/* ═══════════════════════════════════════════════════════════════════════════
   DINOGLASS — world identity (Glass Worlds, a Launchpad Technology product)
   Museum field notes on a Cretaceous lakeshore: volcanic ash grey, ginkgo gold,
   conifer green, lake green-brown, one ember-orange accent.
   Loads AFTER the shared Launchpad tokens/base/components/layout.
   Chrome (header, footer) and the pricing block stay Launchpad; everything
   prefixed .dg- is the world's own look. Light by default; the hero is the
   page's single dark band.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* Ash and basalt */
  --dg-basalt:      #22241F;   /* hero background */
  --dg-basalt-2:    #2E312A;
  --dg-ash-700:     #3A3C35;
  --dg-ash-600:     #55574F;   /* secondary text on paper */
  --dg-ash-400:     #8A8B80;
  --dg-ash-300:     #BDBAAE;   /* secondary text on basalt */
  --dg-ash-200:     #D9D6CC;
  --dg-ash-100:     #E6E2D6;
  /* Paper (field-notes) */
  --dg-paper:       #F4F1E8;
  --dg-paper-2:     #FBFAF5;
  --dg-ink:         #1F211C;   /* headings and body on paper */
  --dg-body:        #3A3C35;
  /* Life */
  --dg-ginkgo:      #D4A82A;   /* on dark only */
  --dg-ginkgo-ink:  #7A5E0C;   /* on light */
  --dg-ginkgo-wash: #F1E7C6;
  --dg-conifer:     #2E4A36;
  --dg-conifer-wash:#E3EAE1;
  --dg-lake:        #586347;
  --dg-lake-wash:   #E8E9DC;
  /* The one accent */
  --dg-ember:       #B3471A;
  --dg-ember-hover: #9A3B13;
  --dg-ember-ink:   #A3401A;

  --dg-serif: 'EB Garamond', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --dg-rule: 1px solid #CFCAB9;
}

/* ── Page base ───────────────────────────────────────────────────────── */
body.dg-page {
  background: var(--dg-paper);
  color: var(--dg-body);
  overflow-x: hidden;
}

.dg-page main i,
.dg-page main em { font-style: italic; }

.dg-skip {
  position: absolute;
  left: 16px;
  top: -60px;
  z-index: 1000;
  padding: 10px 16px;
  background: #fff;
  color: var(--dg-ink);
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
}
.dg-skip:focus { top: 12px; }

.dg-page :focus-visible {
  outline: 3px solid var(--dg-ember);
  outline-offset: 3px;
  border-radius: 4px;
}
.dg-hero :focus-visible,
.site-header :focus-visible { outline-color: var(--dg-ginkgo); }

/* Small-caps specimen labels */
.dg-smallcaps {
  font-family: var(--dg-serif);
  font-variant-caps: all-small-caps;
  letter-spacing: 0.12em;
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--dg-ginkgo-ink);
  margin: 0 0 var(--space-3);
}
.dg-smallcaps span { color: var(--dg-ash-600); letter-spacing: 0.04em; }

/* ── Buttons ─────────────────────────────────────────────────────────── */
.dg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 14px 26px;
  border-radius: 999px;
  border: 0;
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .2s ease, transform .2s ease;
}
.dg-btn--ember { background: var(--dg-ember); color: #fff; }
.dg-btn--ember:hover { background: var(--dg-ember-hover); color: #fff; transform: translateY(-1px); }
.dg-btn--ember:active { transform: translateY(0); }

.dg-textlink {
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
.dg-textlink--dark { color: var(--dg-ash-100); }
.dg-textlink--dark:hover { color: #fff; }

/* ── Hero ────────────────────────────────────────────────────────────── */
.dg-hero {
  background:
    radial-gradient(120% 80% at 85% 10%, rgba(212, 168, 42, 0.07), transparent 60%),
    linear-gradient(180deg, #1B1D19 0%, var(--dg-basalt) 40%, var(--dg-basalt-2) 100%);
  color: var(--dg-ash-100);
  padding: 112px 0 72px;
  position: relative;
  border-bottom: 6px solid #4A463C;
}
@media (min-width: 1024px) { .dg-hero { padding: 128px 0 96px; } }

.dg-series {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 18px;
  font-size: 0.875rem;
  margin-bottom: 40px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(217, 214, 204, 0.16);
}
.dg-series a { color: var(--dg-ash-300); text-decoration: none; }
.dg-series a:hover { color: #fff; }
.dg-series__home { font-weight: 600; color: var(--dg-ash-100) !important; }
.dg-series ul { display: flex; flex-wrap: wrap; gap: 4px 18px; list-style: none; margin: 0; padding: 0; }
.dg-series a[aria-current="page"] { color: var(--dg-ginkgo); }

.dg-hero__grid {
  display: grid;
  gap: 48px;
  align-items: center;
}
@media (min-width: 1024px) {
  .dg-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 64px; }
}

.dg-wordmark {
  font-family: var(--dg-serif);
  font-weight: 500;
  font-size: clamp(3.25rem, 9vw, 6.25rem);
  line-height: 0.95;
  letter-spacing: -0.01em;
  color: #F4F1E8;
  margin: 0 0 18px;
}
.dg-wordmark::after {
  content: '';
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 18px;
  background: var(--dg-ginkgo);
}

.dg-label {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin: 0 0 22px;
  font-family: var(--dg-serif);
  font-variant-caps: all-small-caps;
  letter-spacing: 0.12em;
  font-size: 1.1rem;
}
.dg-label--dark { color: var(--dg-ash-300); }

.dg-status {
  font-family: var(--font-sans);
  font-variant-caps: normal;
  letter-spacing: 0.02em;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(212, 168, 42, 0.6);
  color: var(--dg-ginkgo);
}

.dg-hero h1 {
  font-family: var(--dg-serif);
  font-weight: 400;
  font-style: italic;
  font-size: clamp(1.75rem, 3.6vw, 2.5rem);
  line-height: 1.15;
  color: #fff;
  margin: 0 0 18px;
  max-width: 22ch;
}

.dg-hero__lead {
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--dg-ash-200);
  max-width: 54ch;
  margin: 0;
}

.dg-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin-top: 32px;
}

.dg-endorse {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 32px 0 0;
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
  color: var(--dg-ash-300);
}
.dg-endorse img { width: 20px; height: 20px; }

.dg-hero__figure { margin: 0; }
.dg-case { width: 100%; height: auto; display: block; }
.dg-hero__cap { margin-top: 10px; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dg-ash-300); }
@media (max-width: 639px) { .dg-case__labels { display: none; } }

/* Gentle ash drift + plume breath; off for reduced motion */
.dg-ash circle { animation: dg-ash-fall 14s linear infinite; }
.dg-ash circle:nth-child(2n) { animation-duration: 18s; animation-delay: -6s; }
.dg-ash circle:nth-child(3n) { animation-duration: 22s; animation-delay: -11s; }
@keyframes dg-ash-fall {
  from { transform: translate(0, -20px); opacity: 0; }
  15%  { opacity: .9; }
  to   { transform: translate(-30px, 220px); opacity: 0; }
}
.dg-plume { animation: dg-plume 9s ease-in-out infinite alternate; transform-origin: 360px 140px; }
@keyframes dg-plume { from { transform: translate(0, 0) scale(1); } to { transform: translate(-6px, -4px) scale(1.06); } }

/* ── Status strip ────────────────────────────────────────────────────── */
.dg-status-strip {
  background: var(--dg-ginkgo-wash);
  border-bottom: var(--dg-rule);
  padding: 22px 0;
}
.dg-status-strip__inner {
  display: grid;
  gap: 6px 32px;
}
@media (min-width: 900px) {
  .dg-status-strip__inner { grid-template-columns: 220px 1fr; align-items: baseline; }
}
.dg-status-strip p { margin: 0; color: var(--dg-ink); line-height: 1.6; font-size: 0.975rem; max-width: 80ch; }
.dg-status-strip .dg-smallcaps { margin: 0; }

/* ── Sections ────────────────────────────────────────────────────────── */
.dg-section { padding: 80px 0; }
@media (min-width: 1024px) { .dg-section { padding: 112px 0; } }

.dg-section__head { max-width: 760px; margin-bottom: 48px; }
.dg-section h2 {
  font-family: var(--dg-serif);
  font-weight: 500;
  font-size: clamp(2rem, 4.2vw, 3rem);
  line-height: 1.08;
  letter-spacing: -0.005em;
  color: var(--dg-ink);
  margin: 0 0 18px;
}
.dg-section__lede {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--dg-body);
  margin: 0;
}

/* Place and time */
.dg-place { background: var(--dg-paper-2); }
.dg-place__grid { display: grid; gap: 48px; }
@media (min-width: 1024px) {
  .dg-place__grid { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 72px; align-items: start; }
}

.dg-facts { margin: 0; display: grid; gap: 0; border-top: var(--dg-rule); }
.dg-facts > div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  padding: 16px 0;
  border-bottom: var(--dg-rule);
}
@media (min-width: 560px) { .dg-facts > div { grid-template-columns: 120px 1fr; gap: 20px; } }
.dg-facts dt {
  font-family: var(--dg-serif);
  font-variant-caps: all-small-caps;
  letter-spacing: 0.1em;
  font-size: 1.05rem;
  color: var(--dg-conifer);
  font-weight: 600;
}
.dg-facts dd { margin: 0; color: var(--dg-body); line-height: 1.6; }

.dg-strata {
  margin: 0;
  background: var(--dg-paper);
  border: var(--dg-rule);
  padding: 24px;
  border-radius: 4px;
}
.dg-strata { position: relative; }
.dg-strata__axis {
  display: flex;
  justify-content: space-between;
  font-size: 0.8125rem;
  color: var(--dg-ash-600);
  margin: 0 0 10px;
}
.dg-strata__axis span:first-child::before { content: '\2191\00a0'; }
.dg-strata__axis span:last-child::after { content: '\00a0\2193'; }
.dg-strata__col { list-style: none; margin: 0; padding: 0; }
.dg-layer {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 0 16px;
  min-height: 48px;
}
@media (min-width: 480px) { .dg-layer { grid-template-columns: 110px minmax(0, 1fr); gap: 0 22px; } }
.dg-layer__rock {
  display: block;
  border-left: 1px solid #3A3C35;
  border-right: 1px solid #3A3C35;
}
.dg-layer:first-child .dg-layer__rock { border-top: 1px solid #3A3C35; }
.dg-layer:last-child .dg-layer__rock { border-bottom: 1px solid #3A3C35; }
.dg-layer__text {
  padding: 10px 0 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.9375rem;
  line-height: 1.45;
  color: var(--dg-ash-600);
}
.dg-layer__text strong { font-family: var(--dg-serif); font-size: 1.2rem; font-weight: 600; color: var(--dg-ink); }
.dg-layer__text .dg-gold { color: var(--dg-ginkgo-ink); }
.dg-layer__who { color: var(--dg-ink); font-family: var(--dg-serif); font-size: 1.05rem; }
.dg-layer--yx .dg-layer__text { border-left: 2px solid var(--dg-ginkgo-ink); padding-left: 14px; }
.dg-layer--yixian-head .dg-layer__text { border-left: 2px solid var(--dg-ginkgo-ink); padding-left: 14px; }
.dg-layer--jiufotang .dg-layer__rock {
  background: repeating-linear-gradient(180deg, #CFCBBE 0 16px, #B7B2A3 16px 17px);
  border-bottom: 1px dashed #8A8B80;
}
.dg-layer--yixian-head .dg-layer__rock { background: #8F8A78; }
.dg-layer--jianshangou .dg-layer__rock {
  background:
    linear-gradient(180deg, transparent calc(100% - 8px), #E6E2D6 calc(100% - 8px) calc(100% - 4px), transparent calc(100% - 4px)),
    repeating-linear-gradient(180deg, #6E6A5A 0 12px, #5A5648 12px 13px);
}
.dg-layer--tuff .dg-layer__rock {
  background: repeating-linear-gradient(180deg, #9C9786 0 14px, #E6E2D6 14px 17px);
}
.dg-layer--lujiatun .dg-layer__rock {
  background:
    radial-gradient(circle at 25% 30%, #5F5544 0 3px, transparent 4px),
    radial-gradient(circle at 70% 60%, #5F5544 0 4px, transparent 5px),
    radial-gradient(circle at 40% 85%, #5F5544 0 3px, transparent 4px),
    #7A6E58;
}
.dg-layer--base .dg-layer__rock { background: #4A4C45; }
.dg-strata__note { margin: 14px 0 0; font-size: 0.9375rem; color: var(--dg-body); }
.dg-strata__scale { margin: 6px 0 0; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dg-ash-600); }
.dg-strata figcaption,
.dg-timeline figcaption {
  margin-top: 16px;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--dg-body);
}
.dg-strata figcaption strong {
  display: block;
  font-family: var(--dg-serif);
  font-weight: 500;
  font-style: italic;
  font-size: 1.2rem;
  color: var(--dg-ink);
  margin-bottom: 6px;
  line-height: 1.35;
}

.dg-timeline {
  margin: 64px 0 0;
  padding-top: 32px;
  border-top: var(--dg-rule);
}
.dg-tl { list-style: none; margin: 0 0 8px; padding: 0 0 0 22px; position: relative; display: grid; gap: 18px; }
.dg-tl::before { content: ''; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 2px; background: #3A3C35; }
.dg-tl__pt { position: relative; display: flex; flex-direction: column; gap: 2px; line-height: 1.4; }
.dg-tl__pt::before {
  content: '';
  position: absolute;
  left: -21px;
  top: 5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--dg-paper-2);
  border: 2px solid #3A3C35;
}
.dg-tl__pt strong { font-family: var(--dg-serif); font-size: 1.15rem; font-weight: 600; color: var(--dg-ink); }
.dg-tl__pt span { font-size: 0.9375rem; color: var(--dg-ash-600); }
.dg-tl__pt--here::before { background: var(--dg-ember); border-color: var(--dg-ember); width: 14px; height: 14px; left: -23px; top: 3px; }
.dg-tl__pt--here strong { color: var(--dg-ember-ink); }
@media (min-width: 760px) {
  .dg-tl { display: block; height: 120px; padding: 0; margin: 0 48px 16px 0; }
  .dg-tl::before { left: 0; right: 0; top: 52px; bottom: auto; width: auto; height: 2px; }
  .dg-tl__pt { position: absolute; left: var(--at); top: 66px; transform: translateX(-50%); text-align: center; white-space: nowrap; }
  .dg-tl__pt::before { left: 50%; top: -20px; transform: translateX(-50%); }
  .dg-tl__pt--here::before { top: -22px; left: 50%; }
  .dg-tl__pt--start { transform: none; text-align: left; }
  .dg-tl__pt--start::before { left: 0; transform: none; }
  .dg-tl__pt--end { transform: translateX(-100%); text-align: right; top: 66px; }
  .dg-tl__pt--end::before { left: auto; right: -6px; transform: none; }
  .dg-tl__pt--rex { top: 0; transform: translateX(-100%); text-align: right; }
  .dg-tl__pt--rex::before { top: 46px; left: auto; right: -6px; transform: none; background: #8A8B80; border-color: #8A8B80; }
  .dg-tl__pt--here { top: 0; }
  .dg-tl__pt--here::before { top: 45px; }
}

/* Cast */
.dg-key {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 1px 8px;
  border-radius: 3px;
  white-space: nowrap;
}
.dg-key--ev, .dg-claims li[data-kind="ev"] > span { background: var(--dg-conifer-wash); color: var(--dg-conifer); }
.dg-key--inf, .dg-claims li[data-kind="inf"] > span { background: var(--dg-ginkgo-wash); color: #6A510A; }
.dg-key--deb, .dg-claims li[data-kind="deb"] > span { background: #F3DED3; color: var(--dg-ember-ink); }

.dg-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
}
.dg-filter__label { font-size: 0.875rem; color: var(--dg-ash-600); margin-right: 4px; }
.dg-chip {
  min-height: 40px;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid #BDB8A6;
  background: transparent;
  color: var(--dg-ink);
  font: 500 0.875rem/1 var(--font-sans);
  cursor: pointer;
}
.dg-chip:hover { border-color: var(--dg-ink); }
.dg-chip[aria-pressed="true"] { background: var(--dg-ink); border-color: var(--dg-ink); color: var(--dg-paper); }

.dg-specimens {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 24px;
}
@media (min-width: 760px)  { .dg-specimens { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1180px) { .dg-specimens { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.dg-specimen {
  background: var(--dg-paper-2);
  border: 1px solid #D6D1C0;
  border-top: 3px solid var(--dg-conifer);
  border-radius: 2px;
  padding: 24px 24px 20px;
  box-shadow: 0 1px 0 rgba(31, 33, 28, 0.04);
}
.dg-specimen--visitor { border-top-color: var(--dg-ember); }
.dg-specimen__no {
  font-family: var(--dg-serif);
  font-variant-caps: all-small-caps;
  letter-spacing: 0.1em;
  font-size: 1rem;
  color: var(--dg-ash-600);
  margin: 0 0 6px;
}
.dg-specimen h3 {
  font-family: var(--dg-serif);
  font-weight: 500;
  font-size: 1.75rem;
  line-height: 1.1;
  color: var(--dg-ink);
  margin: 0 0 6px;
}
.dg-specimen__meta { font-size: 0.9rem; color: var(--dg-ash-600); margin: 0 0 16px; line-height: 1.5; }

.dg-claims { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.dg-claims li {
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--dg-body);
  padding-top: 12px;
  border-top: 1px dashed #D6D1C0;
  transition: opacity .2s ease;
}
.dg-claims li > span {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 2px 8px;
  border-radius: 3px;
  margin-right: 8px;
}
.dg-specimens[data-filter-state="ev"]  .dg-claims li:not([data-kind="ev"]),
.dg-specimens[data-filter-state="inf"] .dg-claims li:not([data-kind="inf"]),
.dg-specimens[data-filter-state="deb"] .dg-claims li:not([data-kind="deb"]) { opacity: 0.3; }

.dg-specimen--more { border-top-color: var(--dg-ash-400); border-style: dashed; border-top-style: solid; }
.dg-specimen--more > p:not([class]) { font-size: 0.9375rem; line-height: 1.6; color: var(--dg-body); margin: 0 0 12px; }
.dg-more {
  margin-top: 32px;
  border-top: var(--dg-rule);
  border-bottom: var(--dg-rule);
  padding: 4px 0;
}
.dg-more summary,
.dg-faq summary {
  cursor: pointer;
  list-style: none;
  padding: 16px 32px 16px 0;
  position: relative;
  font-family: var(--dg-serif);
  font-size: 1.3rem;
  font-weight: 500;
  color: var(--dg-ink);
  min-height: 44px;
}
.dg-more summary::-webkit-details-marker,
.dg-faq summary::-webkit-details-marker { display: none; }
.dg-more summary::after,
.dg-faq summary::after {
  content: '+';
  position: absolute;
  right: 4px;
  top: 12px;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 1.5rem;
  color: var(--dg-ginkgo-ink);
}
.dg-more[open] summary::after,
.dg-faq details[open] summary::after { content: '\2212'; }
.dg-more p { max-width: 80ch; line-height: 1.7; margin: 0 0 16px; }

/* Living cycle */
.dg-cycle { background: var(--dg-lake-wash); }
.dg-cycle__grid { display: grid; gap: 40px; }
@media (min-width: 1024px) { .dg-cycle__grid { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 72px; } }
.dg-cycle .dg-section__head { margin-bottom: 0; }
.dg-nogore {
  margin: 24px 0 0;
  padding: 16px 18px;
  border-left: 3px solid var(--dg-ember);
  background: rgba(255, 255, 255, 0.55);
  line-height: 1.6;
  color: var(--dg-ink);
}

.dg-food { list-style: none; margin: 0; padding: 0; border-top: 1px solid #C6C8B4; }
.dg-food li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  padding: 14px 0;
  border-bottom: 1px solid #C6C8B4;
  line-height: 1.5;
  color: var(--dg-body);
}
.dg-food__who { font-family: var(--dg-serif); font-size: 1.2rem; color: var(--dg-ink); }
.dg-tag { font-size: 0.75rem; font-weight: 600; padding: 2px 8px; border-radius: 3px; }
.dg-tag--ev  { background: var(--dg-conifer-wash); color: var(--dg-conifer); }
.dg-tag--inf { background: var(--dg-ginkgo-wash); color: #6A510A; }

.dg-log {
  margin: 32px 0 0;
  padding: 20px 22px;
  background: var(--dg-basalt);
  color: var(--dg-ash-100);
  border-radius: 4px;
  font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  font-size: 0.875rem;
  line-height: 1.6;
}
.dg-log figcaption { color: var(--dg-ginkgo); margin-bottom: 10px; font-size: 1.05rem; }
.dg-log figcaption span { color: var(--dg-ash-300); }
.dg-log ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.dg-log time { color: var(--dg-ginkgo); margin-right: 8px; }
.dg-log em { display: block; color: var(--dg-ash-300); font-style: italic; }

/* Tools */
.dg-tools { background: var(--dg-paper); }
.dg-toolgrid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 1px;
  background: #D6D1C0;
  border: 1px solid #D6D1C0;
}
@media (min-width: 640px)  { .dg-toolgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .dg-toolgrid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.dg-toolgrid li { background: var(--dg-paper-2); padding: 28px 22px; }
.dg-toolgrid svg { width: 40px; height: 40px; color: var(--dg-conifer); margin-bottom: 14px; }
.dg-toolgrid li:nth-child(3) svg { color: var(--dg-ember); }
.dg-toolgrid h3 { font-family: var(--dg-serif); font-weight: 500; font-size: 1.4rem; color: var(--dg-ink); margin: 0 0 8px; }
.dg-toolgrid p { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--dg-body); }

/* On your Mac */
.dg-mac { background: var(--dg-paper-2); }
.dg-mac__grid { display: grid; gap: 32px; }
@media (min-width: 1024px) { .dg-mac__grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 72px; } }
.dg-mac .dg-section__head { margin-bottom: 0; }
.dg-maclist { list-style: none; margin: 0; padding: 0; border-top: var(--dg-rule); }
.dg-maclist li { padding: 16px 0; border-bottom: var(--dg-rule); line-height: 1.65; color: var(--dg-body); }
.dg-maclist strong { color: var(--dg-ink); }

/* ── Pricing: Launchpad buy chrome (Inter, brand navy and blue) ────────── */
.lp-gw-pricing {
  background: #FFFFFF;
  padding: 88px 0;
  border-top: 1px solid var(--color-border, #E2E8F0);
  border-bottom: 1px solid var(--color-border, #E2E8F0);
  font-family: var(--font-sans);
}
.lp-gw-pricing__head { max-width: 720px; margin-bottom: 40px; }
.lp-gw-pricing h2 {
  font-family: var(--font-sans);
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--lp-brand-navy, #0D1123);
  margin: 14px 0 12px;
}
.lp-gw-pricing__head p { color: var(--color-text-secondary, #475569); line-height: 1.65; margin: 0; }
.lp-gw-badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 5px 10px;
  border-radius: 999px;
  background: #FEF3C7;
  color: #92400E;
}
.lp-gw-plans { display: grid; gap: 20px; }
@media (min-width: 900px) { .lp-gw-plans { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.lp-gw-plan {
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 26px 24px;
  background: #F8FAFC;
}
.lp-gw-plan--lead { background: #FFFFFF; border-color: var(--lp-brand-blue, #4490E2); box-shadow: 0 0 0 1px var(--lp-brand-blue, #4490E2); }
.lp-gw-plan__kicker { font-size: 0.8125rem; font-weight: 600; color: var(--color-accent-text, #2C72C2); margin: 0 0 8px; }
.lp-gw-plan h3 { font-size: 1.125rem; font-weight: 700; color: var(--lp-brand-navy, #0D1123); margin: 0 0 14px; line-height: 1.3; }
.lp-gw-plan__price { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.lp-gw-plan__amount { font-size: 2.25rem; font-weight: 700; letter-spacing: -0.02em; color: var(--lp-brand-navy, #0D1123); line-height: 1.1; }
.lp-gw-plan__alt { font-size: 0.9rem; color: #475569; }
.lp-gw-plan__status { margin: 6px 0 16px; font-size: 0.8125rem; font-weight: 600; color: #92400E; }
.lp-gw-plan ul { margin: 0; padding: 16px 0 0; border-top: 1px solid #E2E8F0; list-style: none; display: grid; gap: 10px; }
.lp-gw-plan li { position: relative; padding-left: 22px; font-size: 0.9375rem; line-height: 1.5; color: #334155; }
.lp-gw-plan li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 0.55em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--lp-brand-blue, #4490E2);
}
.lp-gw-pricing__cta { margin: 28px 0 0; }
.lp-gw-pricing__foot { margin: 28px 0 0; color: #475569; line-height: 1.65; max-width: 820px; }
.lp-gw-pricing__foot a { color: var(--color-accent-text, #2C72C2); overflow-wrap: break-word; }

/* FAQ */
.dg-faq { background: var(--dg-paper); }
.dg-faq__grid { display: grid; gap: 24px; }
@media (min-width: 1024px) { .dg-faq__grid { grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); gap: 72px; } }
.dg-faq .dg-section__head { margin-bottom: 0; }
.dg-faq__list { border-top: var(--dg-rule); }
.dg-faq details { border-bottom: var(--dg-rule); }
.dg-faq summary { font-size: 1.25rem; }
.dg-faq details p { margin: 0 0 18px; line-height: 1.7; color: var(--dg-body); max-width: 70ch; }
.dg-faq a { color: var(--dg-ember-ink); overflow-wrap: anywhere; }

/* Waitlist */
.dg-waitlist { background: var(--dg-paper-2); }
.dg-waitlist__card {
  display: grid;
  gap: 32px;
  background: var(--dg-paper);
  border: 1px solid #D6D1C0;
  border-top: 3px solid var(--dg-ember);
  padding: 28px 20px;
}
@media (min-width: 640px)  { .dg-waitlist__card { padding: 40px; } }
@media (min-width: 1024px) { .dg-waitlist__card { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 64px; padding: 56px; } }
.dg-waitlist__intro p:last-child { line-height: 1.65; margin: 0; }
.dg-waitlist h2 { margin-bottom: 14px; }

.dg-form { display: grid; gap: 20px; }
.dg-field { margin: 0; padding: 0; border: 0; min-width: 0; }
.dg-field > label,
.dg-also legend {
  display: block;
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--dg-ink);
  margin-bottom: 8px;
  padding: 0;
}
.dg-field input[type="email"] {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid #8A8B80;
  border-radius: 6px;
  background: #fff;
  font: 400 1rem/1.4 var(--font-sans);
  color: var(--dg-ink);
}
.dg-field input[type="email"]:focus-visible { outline: 3px solid var(--dg-ember); outline-offset: 1px; border-color: var(--dg-ink); }
.dg-field input[aria-invalid="true"] { border-color: #B42318; }
.dg-also { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.dg-also legend { width: 100%; font-weight: 500; color: var(--dg-body); }
.dg-also label,
.dg-consent label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  line-height: 1.55;
  font-size: 0.9375rem;
  color: var(--dg-body);
  cursor: pointer;
}
.dg-also label { align-items: center; min-height: 44px; }
.dg-also input,
.dg-consent input { width: 20px; height: 20px; margin: 2px 0 0; flex: none; accent-color: var(--dg-ember); }
.dg-consent a { color: var(--dg-ember-ink); }
.dg-consent label span, .dg-also label { font-weight: 400; }
.dg-field__error { margin: 8px 0 0; color: #B42318; font-size: 0.875rem; font-weight: 500; }
.dg-form__submit { justify-self: start; }
.dg-form__fineprint { margin: 0; font-size: 0.8125rem; color: var(--dg-ash-600); line-height: 1.55; }
.dg-form__status { margin: 0; font-weight: 600; color: var(--dg-conifer); min-height: 1.5em; }
.dg-form__status.is-error { color: #B42318; }
.dg-form__status:focus { outline: none; }
.dg-form__hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* Endorsement strip */
.dg-endorse-strip { background: var(--dg-paper); border-top: var(--dg-rule); padding: 28px 0; }
.dg-endorse-strip__inner { display: flex; align-items: center; gap: 14px; }
.dg-endorse-strip img { flex: none; }
.dg-endorse-strip p { margin: 0; color: var(--dg-body); line-height: 1.55; font-size: 0.9375rem; }
.dg-endorse-strip strong { color: var(--lp-brand-navy, #0D1123); }

/* ── Reduced motion ──────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .dg-ash circle, .dg-plume { animation: none !important; }
  .dg-ash { display: none; }
  .dg-btn, .dg-claims li { transition: none; }
  .dg-btn--ember:hover { transform: none; }
}

/* Verifier fix 12 Oct 2026: one primary CTA per viewport. The live nav's "Get in Touch" is a
   filled primary button; on Glass Worlds pages it competed with the hero's waitlist/offer button.
   Demoted to an outline button here only (the live site is unchanged). */
.site-header .site-nav .btn-primary {
  background: transparent !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.55) !important;
  box-shadow: none !important;
}
.site-header .site-nav .btn-primary:hover,
.site-header .site-nav .btn-primary:focus-visible {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: #FFFFFF !important;
}

/* v2 catalogue pricing (Alex, 12 Oct 2026): single world + All Worlds, two cards */
@media (min-width: 900px) { .lp-gw-plans.lp-gw-plans--two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 880px; } }
.lp-gw-plan__launch { margin: 8px 0 0; font-size: 0.9375rem; font-weight: 600; line-height: 1.45; color: var(--lp-brand-navy, #0D1123); }

/* First look: real capture */
.dg-firstlook { padding-top: 56px; padding-bottom: 8px; }
.dg-firstlook__title { font-size: clamp(1.4rem, 2.4vw, 1.9rem); margin: 0 0 18px; }
.dg-firstlook__fig { margin: 0; }
.dg-firstlook__fig img { display: block; width: 100%; height: auto; border-radius: 10px; box-shadow: 0 24px 60px -24px rgba(0,0,0,.35); }
.dg-firstlook__fig figcaption { margin-top: 10px; font-size: .875rem; opacity: .75; }