/* ============================================================
   Clockchain — Merged
   Reference site's clean Apple-style layout & spacing
   + Clockchain brand (green marks, real content)
   Variant-aware: daylight (light) / eclipse (dark) / hybrid
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

:root{
  /* ---- Brand constants ---- */
  --brand-green:#00cc00;            /* Clockchain logo mark green (matches assets/clockchain-logo) */
  --forest:#2d7a4f;                 /* reference refined green */
  --forest-mid:#3a9e65;

  /* ---- Accent (overridable by data-accent) ---- */
  --accent:var(--brand-green);
  --accent-soft:color-mix(in oklab, var(--accent), transparent 90%);
  --accent-line:color-mix(in oklab, var(--accent), transparent 70%);

  /* ---- Compatibility aliases (used by blog article page) ---- */
  --acc:var(--accent);
  --bg-elev:var(--surface-2);

  /* ---- Type (overridable by data-font) ---- */
  --f-display:'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --f-body:'Inter', ui-sans-serif, system-ui, sans-serif;
  --f-mono:'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* ---- Section rhythm (overridable by data-density) ---- */
  --band:clamp(72px,8vw,120px);
  --band-sm:clamp(48px,5.5vw,76px);

  /* ---- DAYLIGHT palette (default) ---- */
  --bg:#ffffff;
  --bg-alt:#f5f5f7;
  --surface:#ffffff;
  --surface-2:#f5f5f7;
  --ink:#1d1d1f;                    /* dark-band background */
  --fg:#1d1d1f;
  --fg-2:#6e6e73;
  --fg-3:#86868b;
  --line:#e9e9ee;
  --line-2:#d8d8df;
  --grid-line:rgba(0,0,0,0.035);
  --shadow:0 1px 2px rgba(0,0,0,.04), 0 12px 40px -24px rgba(0,0,0,.25);
  --glass:rgba(255,255,255,0.72);
  --globe-grid:var(--accent);
  --globe-line:var(--accent);
  --globe-land:#5aa5e1;
  --globe-base:#1d1d1f;
  color-scheme:light;
}

/* ===== Accent options ===== */
:root[data-accent="bright"]{ --accent:var(--brand-green); }   /* exact logo green #00cc00 (bright) */
:root[data-accent="forest"]{ --accent:#0a9d44; }              /* slightly darker, refined green (default) */
:root[data-accent="emerald"]{ --accent:#0a9d6e; }             /* deeper emerald */

/* ===== Font options ===== */
:root[data-font="grotesk"]{ --f-display:'Space Grotesk', ui-sans-serif, system-ui, sans-serif; }
:root[data-font="inter"]{   --f-display:'Inter', ui-sans-serif, system-ui, sans-serif; }
:root[data-bodyfont="inter"]{   --f-body:'Inter', ui-sans-serif, system-ui, sans-serif; }
:root[data-bodyfont="grotesk"]{ --f-body:'Space Grotesk', ui-sans-serif, system-ui, sans-serif; }

/* ===== Body weight (Tweaks): Regular / Light / Thin — body copy only ===== */
:root[data-bodyweight="thin"]  p,
:root[data-bodyweight="thin"]  li,
:root[data-bodyweight="thin"]  body{ font-weight:100 !important; }
:root[data-bodyweight="light"] p,
:root[data-bodyweight="light"] li,
:root[data-bodyweight="light"] body{ font-weight:300 !important; }

/* ===== Headline weight (Tweaks): Regular / Light / Thin — headings only ===== */
:root[data-headweight="thin"]  h1, :root[data-headweight="thin"]  h2,
:root[data-headweight="thin"]  h3, :root[data-headweight="thin"]  h4,
:root[data-headweight="thin"]  h5, :root[data-headweight="thin"]  h6,
:root[data-headweight="thin"]  .h2, :root[data-headweight="thin"]  .hero-title,
:root[data-headweight="thin"]  .feature-cell-title, :root[data-headweight="thin"]  .step-title,
:root[data-headweight="thin"]  .svc-q, :root[data-headweight="thin"]  .pg-teaser-title{ font-weight:100 !important; }
:root[data-headweight="light"] h1, :root[data-headweight="light"] h2,
:root[data-headweight="light"] h3, :root[data-headweight="light"] h4,
:root[data-headweight="light"] h5, :root[data-headweight="light"] h6,
:root[data-headweight="light"] .h2, :root[data-headweight="light"] .hero-title,
:root[data-headweight="light"] .feature-cell-title, :root[data-headweight="light"] .step-title,
:root[data-headweight="light"] .svc-q, :root[data-headweight="light"] .pg-teaser-title{ font-weight:300 !important; }

/* ===== Density ===== */
:root[data-density="compact"]{ --band:clamp(52px,5.5vw,84px); --band-sm:clamp(36px,4vw,56px); }
:root[data-density="airy"]{ --band:clamp(96px,11vw,168px); --band-sm:clamp(64px,7vw,104px); }

/* ===== ECLIPSE palette (dark) ===== */
:root[data-variant="eclipse"]{
  --bg:oklch(0.13 0.012 150);
  --bg-alt:oklch(0.16 0.013 150);
  --surface:oklch(0.18 0.013 150);
  --surface-2:oklch(0.21 0.014 150);
  --ink:oklch(0.08 0.012 150);
  --fg:oklch(0.97 0.005 145);
  --fg-2:oklch(0.74 0.01 145);
  --fg-3:oklch(0.56 0.012 145);
  --line:oklch(1 0 0 / 0.09);
  --line-2:oklch(1 0 0 / 0.16);
  --grid-line:rgba(255,255,255,0.04);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 24px 60px -30px rgba(0,0,0,.8);
  --glass:oklch(0.2 0.013 150 / 0.6);
  --globe-grid:#3a4a44;
  --globe-land:#4f7d68;
  --globe-base:#0a0a0a;
  --accent:var(--brand-green);
  color-scheme:dark;
}
:root[data-variant="eclipse"][data-accent="forest"]{ --accent:#1fb55a; }
:root[data-variant="eclipse"][data-accent="emerald"]{ --accent:#1fc78c; }

/* ===== HYBRID: light base, but statement + how-it-works + sectors go dark (true blend) ===== */
:root[data-hybrid] .statement,
:root[data-hybrid] .how,
:root[data-hybrid] .sectors{
  --bg:var(--ink);--bg-alt:var(--ink);--surface:rgba(255,255,255,0.04);
  --fg:#fff;--fg-2:rgba(255,255,255,0.62);--fg-3:rgba(255,255,255,0.42);
  --line:rgba(255,255,255,0.1);--line-2:rgba(255,255,255,0.16);
  background:var(--ink);color:#fff;
}
:root[data-hybrid] .statement p .muted,
:root[data-hybrid] .how .h2 em{color:var(--accent);}

/* ===== EMBED MODE: fixed hero height so the document height can't feed back into the iframe height (compare view) ===== */
:root[data-embed] .hero{min-height:0;height:720px;}

html{scroll-behavior:smooth;}
body{
  font-family:var(--f-body);
  background:var(--bg);
  color:var(--fg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  line-height:1.5;
  transition:background .4s ease, color .4s ease;
}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
::selection{background:var(--accent);color:#fff;}

/* ============ Skip link (WCAG 2.4.1 Bypass Blocks) ============ */
.skip-link{
  position:fixed;
  top:14px;left:14px;
  /* fully off-screen above the viewport (incl. its own height + the 14px gap),
     but still focusable — not display:none / visibility:hidden */
  transform:translateY(calc(-100% - 28px));
  z-index:2000;
  padding:11px 20px;
  font-family:var(--f-display);
  font-size:14px;font-weight:600;letter-spacing:-0.01em;
  color:#fff;background:var(--accent);
  border-radius:10px;
  /* no shadow in the hidden state so nothing bleeds below the top edge */
  transition:transform .18s ease;
}
.skip-link:focus,
.skip-link:focus-visible{
  transform:translateY(0);
  box-shadow:0 8px 24px rgba(0,0,0,0.28);
  outline:2px solid #fff;outline-offset:2px;
}
/* main is a programmatic focus target only — no persistent focus ring */
main:focus{outline:none;}

/* ============ Scroll progress indicator ============ */
.scroll-progress{
  position:fixed;top:0;left:0;
  height:3px;width:100%;
  transform:scaleX(0);
  transform-origin:0 50%;
  background:var(--accent);
  z-index:3000;
  pointer-events:none;        /* never traps clicks / focus */
  will-change:transform;
}
@media (prefers-reduced-motion: no-preference){
  .scroll-progress{transition:transform .08s linear;}
}

/* ============ Layout ============ */
.container{max-width:1080px;margin:0 auto;padding:0 48px;}
.container-wide{max-width:1320px;margin:0 auto;padding:0 48px;}
section{width:100%;}

/* ============ NAV ============ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  height:58px;
  background:transparent;
  border-bottom:1px solid transparent;
  box-shadow:none;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 28px;
  transition:background .4s ease, border-color .4s ease, box-shadow .4s ease, backdrop-filter .4s ease;
}
.nav.scrolled{
  background:color-mix(in oklab, var(--bg), transparent 20%);
  backdrop-filter:saturate(190%) blur(26px);
  -webkit-backdrop-filter:saturate(190%) blur(26px);
  border-bottom:1px solid color-mix(in oklab, var(--fg), transparent 90%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.5), 0 10px 30px -18px rgba(0,0,0,0.45);
}
.nav-logo{display:flex;align-items:center;gap:9px;}
.nav-logo img{height:44px;width:auto;filter:none;transition:filter .4s ease;}
/* logo inverts to white only in dark eclipse mode */
:root[data-variant="eclipse"] .nav-logo img{filter:brightness(0) invert(1);}
:root[data-variant="eclipse"] .nav.scrolled .nav-logo img{filter:brightness(0) invert(1);}
.nav-links{
  display:flex;align-items:center;gap:30px;list-style:none;
  position:absolute;left:50%;transform:translateX(-50%);
}
.nav-links a{
  font-size:13.5px;font-weight:450;
  color:var(--fg-2);letter-spacing:-0.01em;
  text-shadow:none;
  transition:color .2s, text-shadow .2s;
}
.nav-links a:hover{color:var(--fg);}
/* light text over the dark eclipse page */
:root[data-variant="eclipse"] .nav:not(.scrolled) .nav-links a{color:rgba(255,255,255,0.86);}
:root[data-variant="eclipse"] .nav:not(.scrolled) .nav-links a:hover{color:#fff;}
/* light nav text while sitting over the dark video hero (top of page, before scroll);
   reverts to the default dark links once .scrolled (over the white page) */
.nav:not(.scrolled) .nav-links a{
  color:var(--fg-2);
  text-shadow:none;
}
.nav:not(.scrolled) .nav-links a:hover{color:var(--fg);}
.nav-right{display:flex;align-items:center;gap:18px;}

/* ===== Connect dropdown (replaces the loose social icons) ===== */
.nav-connect{position:relative;display:flex;align-items:center;}
.nav-connect-trigger{
  display:inline-flex;align-items:center;gap:6px;
  font-family:inherit;font-size:13.5px;font-weight:450;letter-spacing:-0.01em;
  color:var(--fg-2);background:transparent;cursor:pointer;
  border:0.5px solid var(--line-2);
  padding:7px 12px;border-radius:980px;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.nav-connect-trigger:hover{background:var(--bg-alt);color:var(--fg);}
.nav-connect-trigger .cx-chev{
  width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;
  transition:transform .2s ease;
}
.nav-connect-trigger[aria-expanded="true"] .cx-chev{transform:rotate(180deg);}
.nav-connect-trigger[aria-expanded="true"]{background:var(--bg-alt);color:var(--fg);}
/* keep the trigger legible over the dark eclipse hero before scroll */
:root[data-variant="eclipse"] .nav:not(.scrolled) .nav-connect-trigger{
  color:rgba(255,255,255,0.86);border-color:rgba(255,255,255,0.24);
}
:root[data-variant="eclipse"] .nav:not(.scrolled) .nav-connect-trigger:hover{background:rgba(255,255,255,0.1);color:#fff;}

.nav-connect-menu{
  position:absolute;top:calc(100% + 8px);right:0;width:228px;
  background:var(--surface);border:0.5px solid var(--line-2);border-radius:14px;
  padding:6px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:2px;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
  z-index:210;
}
.nav-connect.open .nav-connect-menu{opacity:1;visibility:visible;transform:none;}
.cx-item{
  display:flex;align-items:center;gap:10px;
  padding:9px 10px;border-radius:9px;
  color:var(--fg);text-decoration:none;
  transition:background .15s ease;
}
.cx-item:hover,.cx-item:focus-visible{background:var(--bg-alt);outline:none;}
.cx-item:focus-visible{box-shadow:0 0 0 2px var(--accent);}
.cx-ico{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 auto;}
.cx-ico svg{width:18px;height:18px;}
/* Community — emphasized */
.cx-community{background:rgba(0,198,39,0.10);}
.cx-community:hover,.cx-community:focus-visible{background:rgba(0,198,39,0.16);}
.cx-community .cx-ico svg{fill:none;stroke:#00A521;stroke-width:2;width:19px;height:19px;}
.cx-text{display:flex;flex-direction:column;line-height:1.25;}
.cx-title{font-size:13.5px;font-weight:500;color:var(--fg);}
.cx-sub{font-size:11.5px;color:var(--fg-3);}
.cx-divider{height:0.5px;background:var(--line-2);margin:4px 6px;}
/* social rows */
.cx-social .cx-label{font-size:13.5px;font-weight:450;color:var(--fg);flex:1 1 auto;}
.cx-social .cx-ico svg{fill:currentColor;}
.cx-x .cx-ico{color:var(--fg);}
.cx-discord .cx-ico{color:#4D5EEA;}
.cx-telegram .cx-ico{color:#1796D0;}
.cx-ext{width:13px;height:13px;stroke:var(--fg-3);fill:none;stroke-width:2;flex:0 0 auto;}

.nav-cta{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:500;
  color:#fff;background:var(--accent);
  padding:8px 16px;border-radius:980px;
  transition:transform .18s ease, filter .18s ease;
}
.nav-cta:hover{transform:translateY(-1px);filter:brightness(1.06);}
.nav-cta svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.4;}
/* ===== theme toggle (injected by app.js) ===== */
.nav-theme{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border:1px solid var(--line-2);border-radius:50%;background:transparent;color:var(--fg-2);cursor:pointer;transition:color .2s ease,border-color .2s ease,background .2s ease;flex:0 0 auto;}
.nav-theme:hover{color:var(--fg);border-color:var(--accent);background:var(--accent-soft);}
.nav-theme svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.nav-theme svg circle{fill:none;}
:root[data-variant="eclipse"] .nav:not(.scrolled) .nav-theme{color:rgba(255,255,255,0.86);border-color:rgba(255,255,255,0.22);}
:root[data-variant="eclipse"] .nav:not(.scrolled) .nav-theme:hover{color:#fff;border-color:rgba(255,255,255,0.4);}
/* ===== use-case Go Now button row (R2 #6-8) ===== */
.uc-go-row{margin-top:16px;}
/* ===== mobile hamburger button ===== */
.nav-burger{display:none;width:42px;height:42px;border:none;background:transparent;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;-webkit-tap-highlight-color:transparent;}
.nav-burger span{display:block;width:22px;height:2px;border-radius:2px;background:var(--fg);transition:transform .3s ease, opacity .2s ease, background .3s ease;}
.nav:not(.scrolled) .nav-burger span{background:var(--fg);box-shadow:none;}
:root[data-variant="eclipse"] .nav-burger span{background:#fff;}
body.menu-open .nav-burger span{background:#fff;box-shadow:none;}
body.menu-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
body.menu-open .nav-burger span:nth-child(2){opacity:0;}
body.menu-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ===== full-screen mobile menu ===== */
.mobile-menu{
  position:fixed;inset:0;z-index:190;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:color-mix(in oklab, var(--ink), transparent 3%);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .3s ease, transform .3s ease, visibility .3s;
  padding:84px 28px 44px;
}
body.menu-open .mobile-menu{opacity:1;visibility:visible;transform:none;}
.mm-links{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;}
.mm-links a{
  font-family:var(--f-display);font-size:clamp(26px,8vw,34px);font-weight:600;letter-spacing:-0.02em;
  color:#fff;padding:11px 16px;line-height:1.1;opacity:0.92;transition:color .2s, opacity .2s;
}
.mm-links a:hover,.mm-links a:active{color:var(--accent);opacity:1;}
.mm-cta{
  margin-top:30px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:16px;font-weight:600;color:#fff;background:var(--accent);
  width:min(360px,100%);min-height:54px;border-radius:980px;
}
.mm-cta svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4;}
.mm-socials{display:flex;gap:18px;margin-top:36px;order:0;}
.mm-socials a{color:rgba(255,255,255,0.72);width:46px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(255,255,255,0.14);transition:color .2s,border-color .2s;}
.mm-socials a:hover{color:#fff;border-color:rgba(255,255,255,0.4);}
.mm-socials svg{width:21px;height:21px;fill:currentColor;}
.mm-theme{
  margin-top:30px;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:15px;font-weight:600;color:rgba(255,255,255,0.85);
  background:transparent;border:1px solid rgba(255,255,255,0.2);border-radius:980px;
  padding:0 26px;min-height:48px;cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:color .2s,border-color .2s;
}
.mm-theme:hover,.mm-theme:active{color:#fff;border-color:rgba(255,255,255,0.45);}
.mm-theme svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.mm-theme svg circle{fill:none;}

@media(max-width:860px){
  .nav-links{display:none;}
  .nav-connect{display:none;}
  .nav-cta{display:none;}
  .nav-burger{display:flex;}
  .nav-theme{display:none;}
  /* width-driven logo: height follows aspect, so iOS Display Zoom / Larger Text
     can never squash it against the burger (img max-width:100% + fixed height did) */
  .nav-logo img{width:min(56vw,220px);height:auto;}
  .nav-burger{flex:0 0 auto;}
}
@media(max-width:400px){
  .nav{padding:0 18px;}
}
@media(min-width:861px){
  .mobile-menu{display:none;}
}

/* ============ HERO (orbital-logo animation over a light horizon) ============ */
.hero{
  padding-top:58px;
  min-height:100vh;
  display:flex;align-items:center;
  position:relative;overflow:hidden;
  background:#070b0a;
  isolation:isolate;
}
/* orbital-logo variant: light surface so the green spheres, black Earth and line-burst read */
.hero--orbit{
  background:
    radial-gradient(120% 80% at 50% 42%, #ffffff 0%, #ffffff 52%, #f3f5f4 100%);
}
/* full-bleed canvas behind the hero text; never blocks clicks */
.hero-orbit-canvas{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;display:block;
  pointer-events:none;user-select:none;
}
/* video fills the hero, day-to-night loop */
.hero-video{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;object-fit:cover;object-position:53% 35%;
  pointer-events:none;user-select:none;
}
/* mobile still poster (shown instead of the autoplay video on small screens) */
.hero-poster{
  position:absolute;inset:0;z-index:0;display:none;
  background:#070b0a url("assets/hero-poster.jpg?v=2") 53% 35% / cover no-repeat;
  pointer-events:none;user-select:none;
}
/* readability scrim — darker top (statement) & bottom (blends into dark ticker) */
.hero-scrim{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(7,11,10,0.86) 0%,
      rgba(7,11,10,0.62) 22%,
      rgba(7,11,10,0.28) 44%,
      rgba(7,11,10,0.14) 60%,
      rgba(7,11,10,0.46) 82%,
      rgba(7,11,10,0.92) 100%);
}
/* ===== HERO STATEMENT (light text over the video, top-center) ===== */
.hero-statement{
  position:absolute;top:clamp(120px,17vh,190px);left:50%;transform:translateX(-50%);
  z-index:2;width:min(920px,86%);text-align:center;pointer-events:auto;
}
.hero-statement p{
  font-family:var(--f-display);
  font-size:clamp(20px,2.5vw,34px);font-weight:500;line-height:1.34;letter-spacing:-0.02em;
  color:#ffffff;text-wrap:balance;
  text-shadow:0 2px 20px rgba(0,0,0,0.85), 0 1px 3px rgba(0,0,0,0.9), 0 0 1px rgba(0,0,0,0.8);
}
.hero-statement .hs-em{color:var(--brand-green);}
/* orbital-logo hero: dark text on the light horizon (overrides the video-hero light text) */
.hero-statement .hero-title{
  font-family:var(--f-display);
  font-size:clamp(24px,3.6vw,52px);font-weight:600;line-height:1.06;letter-spacing:-0.03em;
  color:var(--fg);margin:0 0 18px;text-wrap:balance;
}
.hero--orbit .hero-title{
  text-shadow:0 1px 0 rgba(255,255,255,0.9), 0 2px 22px rgba(255,255,255,0.85);
}
.hero-title .hs-em{color:#00cc00;}
.hero--orbit .hero-statement p{
  color:var(--fg-2);
  font-size:clamp(17px,1.9vw,24px);font-weight:400;
  text-shadow:0 1px 0 rgba(255,255,255,0.9), 0 2px 18px rgba(255,255,255,0.85);
}
.hero--orbit .hero-statement .hs-em{color:var(--accent);}
.hero--orbit .hero-statement .hero-cta-help{
  color:var(--fg-2);
  text-shadow:0 1px 0 rgba(255,255,255,0.85);
}
.hero--orbit .hero-scroll{color:var(--fg-3);}
.hero--orbit .scroll-line{background:linear-gradient(var(--fg-3),transparent);}
/* orbital hero CTA moved to the nav (replacing Contact); the in-hero button was removed
   so it no longer overlaps the green Sun. Override kept minimal below. */
.hero--orbit .hero-statement .hero-cta-help{
  color:var(--fg-2);
  text-shadow:0 0 10px rgba(255,255,255,0.95), 0 0 4px rgba(255,255,255,0.95), 0 1px 0 rgba(255,255,255,0.9);
}

/* scroll hint reads light over the video */
.hero .hero-scroll{color:rgba(255,255,255,0.7);}
.hero .scroll-line{background:linear-gradient(rgba(255,255,255,0.7),transparent);}

/* ===== INTRO (headline + copy on the left, globe on the right) ===== */
.hero-intro{
  min-height:100vh;
  display:grid;grid-template-columns:1.05fr 0.95fr;align-items:center;
  position:relative;overflow:hidden;
  background:var(--bg);
}
/* indent only the copy column to the section rail; the globe column keeps the full right side */
.hero-intro-inner{position:relative;z-index:2;padding:80px 0;max-width:620px;margin-left:max(48px, calc((100vw - 1520px) / 2 + 48px));}
.hero-intro h1{
  font-family:var(--f-display);
  font-size:clamp(24px,3.6vw,52px);
  font-weight:600;line-height:0.99;letter-spacing:-0.04em;
  color:var(--fg);margin:24px 0 26px;text-wrap:balance;
}
.hero-intro h1 .muted{color:var(--accent);}
.hero-intro .hero-sub{max-width:360px;margin-bottom:26px;}
/* ===== Hero focal CTA (sits over the video, beneath the statement) ===== */
.hero-statement .hero-cta{
  margin-top:34px;display:flex;flex-direction:column;align-items:center;
  pointer-events:auto;  /* re-enable clicks (statement block is pointer-events:none) */
}
.hero-cta-btn.btn{
  font-size:16px;font-weight:600;letter-spacing:-0.01em;
  padding:15px 32px;color:#fff;
  background:var(--brand-green);
  box-shadow:
    0 10px 26px -10px color-mix(in oklab, var(--brand-green), transparent 32%),
    0 3px 8px -3px rgba(0,0,0,0.45);
  transition:transform .24s cubic-bezier(.2,.8,.2,1), box-shadow .24s ease, filter .2s ease;
}
.hero-cta-btn.btn svg{width:17px;height:17px;transition:transform .24s cubic-bezier(.2,.8,.2,1);}
.hero-cta-btn.btn:hover{
  transform:translateY(-2px);filter:brightness(1.06);
  background:var(--brand-green);
  box-shadow:
    0 18px 40px -12px color-mix(in oklab, var(--brand-green), transparent 20%),
    0 4px 10px -3px rgba(0,0,0,0.5);
}
.hero-cta-btn.btn:hover svg{transform:translateX(4px);}
.hero-cta-btn.btn:active{transform:translateY(0);transition-duration:.08s;}
/* --- Hero button style variants (tweakable: solid / white / clear) --- */
:root[data-herobtn="white"] .hero-cta-btn.btn{
  background:#fff;color:var(--brand-green);
  box-shadow:0 10px 26px -10px rgba(0,0,0,0.5), 0 3px 8px -3px rgba(0,0,0,0.4);
}
:root[data-herobtn="white"] .hero-cta-btn.btn:hover{
  background:#fff;filter:none;color:color-mix(in oklab, var(--brand-green), black 10%);
  transform:translateY(-2px);
  box-shadow:0 18px 40px -12px rgba(0,0,0,0.55), 0 4px 10px -3px rgba(0,0,0,0.45);
}
:root[data-herobtn="clear"] .hero-cta-btn.btn{
  background:rgba(6,12,8,0.5);
  -webkit-backdrop-filter:blur(10px) saturate(1.1);backdrop-filter:blur(10px) saturate(1.1);
  color:var(--brand-green);
  border:1.5px solid color-mix(in oklab, var(--brand-green), transparent 28%);
  box-shadow:
    inset 0 0 24px -8px color-mix(in oklab, var(--brand-green), transparent 55%),
    0 10px 26px -12px rgba(0,0,0,0.6);
  text-shadow:0 1px 3px rgba(0,0,0,0.95), 0 2px 12px rgba(0,0,0,0.85);
}
:root[data-herobtn="clear"] .hero-cta-btn.btn:hover{
  filter:none;
  background:rgba(6,12,8,0.62);
  border-color:color-mix(in oklab, var(--brand-green), transparent 8%);
  color:var(--brand-green);
  transform:translateY(-2px);
  box-shadow:
    inset 0 0 28px -8px color-mix(in oklab, var(--brand-green), transparent 42%),
    0 18px 40px -14px color-mix(in oklab, var(--brand-green), transparent 28%), 0 4px 10px -3px rgba(0,0,0,0.5);
}
.hero-statement .hero-cta-help{
  font-family:var(--f-body);
  font-size:16px;line-height:1.5;font-weight:400;
  color:rgba(255,255,255,0.95);
  margin-top:14px;letter-spacing:-0.005em;text-wrap:pretty;max-width:360px;
  text-shadow:0 2px 16px rgba(0,0,0,0.9), 0 1px 4px rgba(0,0,0,0.85), 0 0 1px rgba(0,0,0,0.8);
}
@media(max-width:600px){
  .hero-statement .hero-cta{margin-top:26px;width:100%;}
  .hero-cta-btn.btn{display:flex;width:100%;max-width:340px;justify-content:center;min-height:54px;}
}
/* --- Services-section copy of the hero CTA (helper adapted for light background) --- */
.svc-cta{margin-top:28px;display:flex;flex-direction:column;align-items:flex-start;}
.svc-cta .hero-cta-help{
  font-family:var(--f-body);
  font-size:14px;line-height:1.5;font-weight:400;
  color:var(--fg-2);
  margin-top:13px;letter-spacing:-0.005em;text-wrap:pretty;max-width:340px;
  text-shadow:none;
}
/* keep the "white" button state visible on light sections */
:root[data-herobtn="white"] .hero-cta-btn.btn{
  border:1px solid color-mix(in oklab, var(--brand-green), transparent 78%);
}
.hero-intro .hero-visual{
  position:relative;height:100vh;z-index:1;
  display:flex;align-items:center;justify-content:center;
}
.hero-intro #globe-canvas{display:block;}
/* live block card sits below the copy, in the left column (clear of the globe) */
.hero-intro .hero-block-card{
  margin-top:34px;width:100%;max-width:360px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,0.4);
}
@media(max-width:900px){
  .hero-intro{grid-template-columns:1fr;min-height:0;}
  .hero-intro-inner{padding:96px 28px 24px;max-width:none;margin-left:0;}
  .hero-intro .hero-visual{height:76vw;min-height:300px;}
  .hero-intro .hero-block-card{width:auto;max-width:360px;margin-top:28px;}
}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--f-mono);
  font-size:12px;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--accent);margin-bottom:30px;
}
.live-dot{
  width:7px;height:7px;border-radius:50%;display:inline-block;
  background:var(--accent);
  box-shadow:0 0 0 0 var(--accent-line);
  animation:livepulse 2s ease-in-out infinite;
}
@keyframes livepulse{
  0%{box-shadow:0 0 0 0 var(--accent-soft);}
  70%{box-shadow:0 0 0 8px transparent;}
  100%{box-shadow:0 0 0 0 transparent;}
}
.hero h1{
  font-family:var(--f-display);
  font-size:clamp(46px,5.4vw,86px);
  font-weight:600;line-height:0.99;letter-spacing:-0.04em;
  color:var(--fg);margin-bottom:26px;text-wrap:balance;
}
.hero h1 .muted{color:var(--fg-3);}
.hero-sub{
  font-size:18px;font-weight:400;line-height:1.62;
  color:var(--fg-2);max-width:460px;margin-bottom:42px;letter-spacing:-0.01em;
}
.hero-sub strong{color:var(--fg);font-weight:600;}
.hero-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-size:15px;font-weight:500;letter-spacing:-0.01em;
  padding:13px 26px;border-radius:980px;
  transition:transform .18s ease, filter .18s ease, background .2s, border-color .2s;
}
.btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{transform:translateY(-1px);filter:brightness(1.06);}
.btn-dark{background:var(--ink);color:#fff;}
.btn-dark:hover{transform:translateY(-1px);}
.btn-outline{border:1px solid var(--line-2);color:var(--fg);}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);}
.btn-ghost{color:var(--fg-2);}
.btn-ghost:hover{color:var(--fg);}

.hero-scroll{
  position:absolute;bottom:34px;left:64px;z-index:2;
  font-family:var(--f-mono);
  font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--fg-3);
  display:flex;flex-direction:column;align-items:center;gap:8px;
}
.scroll-line{width:1px;height:34px;background:linear-gradient(var(--fg-3),transparent);animation:scrollline 2s ease-in-out infinite;}
@keyframes scrollline{0%,100%{opacity:.35;}50%{opacity:1;}}
@media(max-width:900px){
  .hero-inner{padding:120px 28px 64px;max-width:none;}
  .hero-scroll{display:none;}
}

/* ============ TICKER (stat bar) ============ */
.ticker{background:var(--ink);padding:16px 0;}
.ticker-inner{display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;overflow:hidden;}
.ticker-item{
  display:flex;flex-direction:column;align-items:center;
  padding:0 38px;border-right:1px solid rgba(255,255,255,0.1);flex-shrink:0;
}
.ticker-item:last-child{border-right:none;}
.ticker-label{
  font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;
  color:rgba(255,255,255,0.4);margin-bottom:4px;
}
.ticker-val{
  font-size:14px;font-weight:500;color:rgba(255,255,255,0.92);
  letter-spacing:0.03em;font-variant-numeric:tabular-nums;
}
.ticker-val.accent{color:var(--accent);}
@media(max-width:760px){.ticker-inner{justify-content:flex-start;overflow-x:auto;padding:0 20px;-webkit-overflow-scrolling:touch;scrollbar-width:none;}.ticker-inner::-webkit-scrollbar{display:none;}.ticker-item{padding:0 24px;}}

/* ============ Shared section heads ============ */
.tag{
  display:inline-block;font-family:var(--f-mono);
  font-size:12px;font-weight:500;letter-spacing:0.13em;text-transform:uppercase;
  color:var(--accent);margin-bottom:18px;
}
.h2{
  font-family:var(--f-display);
  font-size:clamp(30px,3.8vw,50px);font-weight:600;line-height:1.06;letter-spacing:-0.03em;
  color:var(--fg);text-wrap:balance;
}
.h2 em{font-style:normal;color:var(--accent);}
.body-lg{font-size:17px;font-weight:400;line-height:1.7;color:var(--fg-2);letter-spacing:-0.01em;text-wrap:pretty;}

/* ============ STATEMENT ============ */
.statement{padding:var(--band) 0;border-bottom:1px solid var(--line);text-align:center;}
.statement p{
  font-family:var(--f-display);
  font-size:clamp(24px,3.4vw,42px);font-weight:500;line-height:1.28;letter-spacing:-0.025em;
  color:var(--fg);max-width:860px;margin:0 auto;text-wrap:balance;
}
.statement p .muted{color:var(--fg-3);}

/* ============ SECTORS row ============ */
.sectors{padding:calc(var(--band-sm) * 0.28) 0;background:var(--bg-alt);border-bottom:1px solid var(--line);}
.sectors-label{
  font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--fg-3);text-align:center;margin-bottom:16px;
}
.sectors-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;}
.sector-item{
  /* affordance-honest: plain inline label, no box / border / interaction */
  display:inline-flex;align-items:center;
  font-family:var(--f-body);
  font-size:14px;font-weight:400;color:var(--fg-2);
  letter-spacing:0;text-transform:none;
}
.sector-item:not(:last-child)::after{
  content:"·";
  margin:0 12px;
  color:var(--fg-3);
  font-weight:400;
}

/* ============ WHAT IS (2-col + live block) ============ */
.what{padding:var(--band) 0;border-bottom:1px solid var(--line);}
.what-grid{display:grid;grid-template-columns:1fr 1fr;gap:96px;align-items:center;}
.what-grid.solo{grid-template-columns:1fr;}
.what-grid.solo > div{max-width:780px;}
.what-grid .h2{margin-bottom:20px;}
.stats{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-top:38px;
}
.stat{background:var(--surface);padding:26px 24px;}
.stat-n{font-family:var(--f-display);font-size:34px;font-weight:600;letter-spacing:-0.03em;color:var(--fg);margin-bottom:4px;}
.stat-l{font-size:13px;color:var(--fg-3);}

/* live block card */
.block-card{
  background:var(--surface-2);border:1px solid var(--line);border-radius:20px;
  padding:34px;position:relative;overflow:hidden;box-shadow:var(--shadow);
}
.block-card::before{
  content:'';position:absolute;top:-70px;right:-70px;width:220px;height:220px;
  background:radial-gradient(circle, var(--accent-soft), transparent 70%);pointer-events:none;
}
.bc-label{font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--fg-3);margin-bottom:18px;display:flex;align-items:center;gap:8px;}
.bc-row{background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:13px 15px;margin-bottom:8px;}
.bc-row-label{font-family:var(--f-mono);font-size:12px;color:var(--fg-3);font-weight:500;letter-spacing:0.1em;text-transform:uppercase;margin-bottom:5px;}
.bc-row-val{font-size:14px;color:var(--fg);font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:0.01em;}
.bc-row-val.mono{font-family:var(--f-mono);font-size:12px;font-weight:400;color:var(--fg-2);word-break:break-all;line-height:1.4;}
.bc-two{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.status-pill{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--accent);padding:3px 10px;border-radius:980px;font-size:12px;font-weight:600;}

/* ============ NUMBERED CARD GRID (What-is trio, Solution trio) ============ */
.numgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden;}
.numgrid.two{grid-template-columns:repeat(2,1fr);}
.numcard{background:var(--surface);padding:40px 34px;transition:background .25s;}
.numcard:hover{background:var(--bg-alt);}
.numcard .big-num{font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:0.1em;color:var(--accent);margin-bottom:26px;}
.numcard h4{font-family:var(--f-display);font-size:20px;font-weight:600;letter-spacing:-0.02em;color:var(--fg);margin-bottom:13px;line-height:1.22;}
.numcard p{font-size:14.5px;font-weight:400;line-height:1.66;color:var(--fg-2);margin-bottom:12px;}
.numcard p:last-of-type{margin-bottom:0;}
.numcard .pill{display:inline-block;margin-top:18px;font-family:var(--f-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--fg-3);border:1px solid var(--line-2);border-radius:980px;padding:5px 12px;}

/* ============ DARK BAND (Problem/Solution alt, Token economy, News) ============ */
.band-dark{
  --bg:var(--ink);--surface:rgba(255,255,255,0.04);--surface-2:rgba(255,255,255,0.03);
  --fg:#fff;--fg-2:rgba(255,255,255,0.62);--fg-3:rgba(255,255,255,0.4);
  --line:rgba(255,255,255,0.1);--line-2:rgba(255,255,255,0.16);
  background:var(--ink);color:#fff;
}

/* ============ SHARED SIDE-BY-SIDE LAYOUT (header left + sticky, content right) ============ */
.split > .container{
  max-width:1520px;
  display:grid;
  grid-template-columns:360px minmax(0,1fr);
  gap:clamp(140px,15vw,300px);
  align-items:start;
}
/* header column = first child of the container */
.split > .container > :first-child{
  position:sticky;top:96px;align-self:start;
  text-align:left;margin:0;
}
.split > .container > :first-child .h2{margin:0 0 16px;max-width:none;}
.split > .container > :first-child .body-lg{max-width:none;margin:0;}
/* content column: multi-card grids collapse to a single stacked column */
.split .numgrid,
.split .feature-row,
.split .media-grid,
.split .ps-cols{grid-template-columns:1fr;margin-top:0;}
.split.feature{text-align:left;}

/* ============ PROBLEM / SOLUTION ============ */
.ps{padding:var(--band) 0;border-bottom:1px solid var(--line);}
/* merged Challenge+Solution: right column flows comparison -> primitives */
.ps-content{display:flex;flex-direction:column;gap:clamp(44px,5vw,72px);min-width:0;}
.ps-subhead{padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line);scroll-margin-top:90px;}
.ps-subhead .tag{margin-bottom:14px;}
.ps-subhead-title{font-family:var(--f-display);font-size:clamp(22px,2.6vw,32px);font-weight:600;letter-spacing:-0.025em;line-height:1.16;color:var(--fg);margin:0 0 12px;}
.ps-subhead-title em{font-style:normal;color:var(--accent);}
.ps-subhead .body-lg{max-width:640px;margin:0;}
.ps-header{text-align:center;margin-bottom:64px;}
.ps-header .h2{margin-bottom:16px;}
.ps-header .body-lg{max-width:600px;margin:0 auto;}
.ps-cols{display:grid;grid-template-columns:1fr 1fr;gap:1px;border-radius:20px;overflow:hidden;border:1px solid var(--line);}
.ps-col{background:var(--surface);padding:52px 44px;}
.ps-col.alt{background:var(--ink);}
.ps-col-tag{font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;margin-bottom:18px;display:inline-block;}
.ps-col-tag.prob{color:var(--accent);}
.ps-col-tag.sol{color:var(--accent);}
.ps-col h3{font-family:var(--f-display);font-size:clamp(21px,2.4vw,28px);font-weight:600;letter-spacing:-0.025em;line-height:1.15;margin-bottom:18px;color:var(--fg);}
.ps-col.alt h3{color:#fff;}
.ps-list{list-style:none;display:flex;flex-direction:column;gap:12px;}
.ps-list li{display:flex;align-items:flex-start;gap:12px;font-size:14.5px;font-weight:400;line-height:1.6;color:var(--fg-2);}
.ps-col.alt .ps-list li{color:rgba(255,255,255,0.62);}
.ps-list li::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--fg-3);flex-shrink:0;margin-top:8px;}
.ps-col.alt .ps-list li::before{background:var(--accent);}

/* ============ SERVICES ============ */
.services{padding:var(--band) 0;border-bottom:1px solid var(--line);}
.services-head{margin-bottom:60px;}
.services-head .h2{margin-bottom:16px;max-width:560px;}
.services-head .body-lg{max-width:560px;}
.svc-list{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden;}
.svc{
  background:var(--surface);display:grid;grid-template-columns:48px 1.1fr 1.2fr;gap:36px;
  padding:48px 44px;align-items:start;transition:background .25s;}
.svc:hover{background:var(--bg-alt);}
.svc-n{font-family:var(--f-mono);font-size:13px;font-weight:500;color:var(--accent);padding-top:4px;}
.svc-q{font-family:var(--f-display);font-size:18px;font-weight:500;line-height:1.4;letter-spacing:-0.02em;color:var(--fg);font-style:italic;}
.svc-body h4{font-family:var(--f-display);font-size:17px;font-weight:600;letter-spacing:-0.01em;color:var(--fg);margin-bottom:10px;}
.svc-body p{font-size:14.5px;font-weight:400;line-height:1.66;color:var(--fg-2);}
/* Card without a quote — number + body fill the row cleanly */
.svc.svc-noq{grid-template-columns:48px 1fr;}
.svc.svc-noq .svc-body{max-width:680px;}
@media(max-width:820px){.svc{grid-template-columns:1fr;gap:14px;}}

/* ---- Playground teaser (compact promo in Services → routes to playground.html) ---- */
.pg-teaser{
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:40px;align-items:center;
  margin-top:18px;padding:40px 44px;
  background:var(--surface);border:1px solid var(--line);border-radius:20px;
  box-shadow:var(--shadow);transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.pg-teaser:hover{transform:translateY(-3px);border-color:color-mix(in oklab,var(--accent),transparent 60%);box-shadow:0 1px 2px rgba(0,0,0,.05),0 30px 60px -34px rgba(0,0,0,.4);}
.pg-teaser-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;}
.pg-teaser-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent);}
.pg-teaser-title{font-family:var(--f-display);font-size:clamp(22px,2.4vw,28px);font-weight:600;letter-spacing:-0.025em;line-height:1.1;color:var(--fg);margin-bottom:12px;}
.pg-teaser-copy{font-size:15px;line-height:1.62;color:var(--fg-2);max-width:46ch;margin-bottom:24px;}
.pg-teaser-btn{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;letter-spacing:-0.01em;color:#fff;background:var(--accent);padding:13px 26px;border-radius:980px;transition:transform .2s ease, filter .2s ease;}
.pg-teaser-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;transition:transform .24s cubic-bezier(.2,.8,.2,1);}
.pg-teaser:hover .pg-teaser-btn{filter:brightness(1.06);}
.pg-teaser:hover .pg-teaser-btn svg{transform:translateX(4px);}
/* stylized, purely decorative mini-demo */
.pg-teaser-demo{
  border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,0.08);
  background:radial-gradient(130% 100% at 100% 0%, rgba(0,204,0,0.12) 0%, transparent 55%),linear-gradient(158deg,#1b211d 0%,#121714 60%,#0c100e 100%);
  box-shadow:0 20px 44px -28px rgba(0,0,0,.7);padding:14px;
}
.pgd-bar{display:flex;align-items:center;gap:6px;margin-bottom:14px;}
.pgd-bar .pgd-dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,0.16);box-shadow:none;}
.pgd-bar-label{margin-left:6px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.34);}
.pgd-field{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:9px;padding:10px 12px;font-family:var(--f-mono);font-size:12px;color:rgba(255,255,255,0.82);}
.pgd-cue{color:#7ed99a;}
.pgd-typed{color:rgba(255,255,255,0.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pgd-caret{width:1.5px;height:13px;background:var(--accent);flex:none;animation:pgdBlink 1.1s steps(1) infinite;}
@keyframes pgdBlink{50%{opacity:0;}}
.pgd-res{margin-top:12px;display:flex;flex-direction:column;gap:7px;}
.pgd-pill{align-self:flex-start;display:inline-flex;align-items:center;gap:5px;font-family:var(--f-mono);font-size:10.5px;font-weight:600;letter-spacing:0.04em;color:#9bf2c4;background:rgba(0,204,0,0.14);border:1px solid rgba(0,204,0,0.3);border-radius:980px;padding:3px 9px;}
.pgd-row{font-family:var(--f-mono);font-size:11.5px;color:rgba(255,255,255,0.62);}
.pgd-row.mono{color:rgba(255,255,255,0.42);}
@media(prefers-reduced-motion:reduce){.pgd-caret{animation:none;}}
@media(max-width:760px){.pg-teaser{grid-template-columns:1fr;gap:26px;padding:30px 24px;}}

/* ============ HOW IT WORKS ============ */
.how{padding:var(--band) 0;background:var(--bg-alt);border-bottom:1px solid var(--line);}
.how-head{margin-bottom:56px;}
.how-head .h2{max-width:520px;}
.how-steps{display:flex;flex-direction:column;}
.step{display:grid;grid-template-columns:64px 1fr 1.25fr;gap:0;padding:38px 0;border-top:1px solid var(--line-2);align-items:start;}
.step-n{font-family:var(--f-mono);font-size:13px;font-weight:500;color:var(--accent);padding-top:3px;font-variant-numeric:tabular-nums;}
.step-title{font-family:var(--f-display);font-size:20px;font-weight:600;letter-spacing:-0.02em;color:var(--fg);padding-right:36px;line-height:1.3;}
.step-body{font-size:15px;font-weight:400;line-height:1.72;color:var(--fg-2);}
@media(max-width:760px){.step{grid-template-columns:1fr;gap:10px;}}

/* ============ TOKEN ECONOMY (dark feature) ============ */
.feature{padding:var(--band) 0;text-align:center;}
.feature .tag{color:rgba(255,255,255,0.4);}
.feature .h2{color:#fff;max-width:700px;margin:0 auto 18px;}
.feature .body-lg{color:rgba(255,255,255,0.55);max-width:560px;margin:0 auto;}
.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.08);border-radius:20px;overflow:hidden;margin-top:60px;text-align:left;}
.feature-cell{padding:38px 34px;background:var(--ink);}
.feature-cell-n{font-family:var(--f-mono);font-size:12px;letter-spacing:0.12em;font-weight:500;text-transform:uppercase;color:var(--accent);margin-bottom:18px;}
.feature-cell-title{font-family:var(--f-display);font-size:18px;font-weight:600;color:rgba(255,255,255,0.92);letter-spacing:-0.02em;margin-bottom:11px;line-height:1.25;}
.feature-cell-body{font-size:14px;font-weight:400;line-height:1.7;color:rgba(255,255,255,0.45);}

/* ============ BLOG ============ */
.blog{padding:var(--band) 0;border-bottom:1px solid var(--line);}
.section-head-c{text-align:center;margin-bottom:56px;}
.section-head-c .h2{margin-bottom:14px;}
.blog-list{display:flex;flex-direction:column;gap:22px;}
.blog-card{
  display:grid;grid-template-columns:1.5fr 1fr;gap:0;align-items:center;
  background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden;
  box-shadow:var(--shadow);transition:transform .25s ease, box-shadow .25s ease;
}
.blog-card:hover{transform:translateY(-3px);}
.blog-img{position:relative;height:204px;background:var(--bg-alt);border-radius:14px;overflow:hidden;margin:24px 0 24px 24px;}
.blog-img img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
.blog-img.placeholder{display:flex;align-items:center;justify-content:center;background:
    repeating-linear-gradient(135deg, color-mix(in oklab, var(--fg), transparent 94%) 0 10px, transparent 10px 20px),
    var(--bg-alt);}
.blog-ph{display:flex;flex-direction:column;align-items:center;gap:6px;}
.blog-ph-note{font-family:var(--f-mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--fg-3);}
.blog-body{padding:48px 44px;display:flex;flex-direction:column;justify-content:center;}
.blog-meta{display:flex;align-items:center;gap:12px;font-family:var(--f-mono);font-size:12px;letter-spacing:0.04em;text-transform:uppercase;color:var(--fg-3);margin-bottom:18px;}
.blog-meta .accent{color:var(--accent);}
.blog-body h3{font-family:var(--f-display);font-size:clamp(26px,3vw,38px);font-weight:600;letter-spacing:-0.03em;line-height:1.06;color:var(--fg);margin-bottom:16px;}
.blog-body p{font-size:16px;line-height:1.6;color:var(--fg-2);margin-bottom:24px;max-width:440px;}
.read-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--accent);}
.read-link svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s;}
.blog-card:hover .read-link svg{transform:translateX(4px);}
@media(max-width:820px){.blog-card{grid-template-columns:1fr;}.blog-img{height:200px;margin:24px 24px 0 24px;}}

/* ============ NEWS & MEDIA ============ */
.news{padding:var(--band) 0;}
.news .section-head-c .h2{color:inherit;}
.subhead{display:flex;align-items:center;gap:18px;margin:48px 0 24px;}
.subhead-l{display:flex;align-items:center;gap:14px;}
.subhead-num{font-family:var(--f-mono);font-size:12px;color:var(--accent);font-weight:500;}
.subhead h3{font-family:var(--f-display);font-size:19px;font-weight:600;letter-spacing:-0.01em;color:var(--fg);}
.subhead-pill{font-family:var(--f-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--fg-3);border:1px solid var(--line-2);border-radius:980px;padding:4px 11px;}
.subhead-rule{flex:1;height:1px;background:var(--line);}
.subhead-count{font-family:var(--f-mono);font-size:12px;color:var(--fg-3);letter-spacing:0.04em;}

.pr-lead{
  display:block;
  position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,0.12);border-radius:18px;padding:40px 40px;
  background-color:#0b2429;
  background-image:url("assets/pr-bg-blockchain.jpeg");
  background-size:cover;background-position:center right;background-repeat:no-repeat;
  transition:transform .25s, border-color .25s, box-shadow .25s;cursor:pointer;box-shadow:var(--shadow);
}
/* readability scrim — strongest on the left where the text sits */
.pr-lead::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,
    rgba(7,24,28,0.95) 0%,
    rgba(7,24,28,0.85) 34%,
    rgba(7,24,28,0.55) 62%,
    rgba(7,24,28,0.22) 100%);
}
/* keep real content above the image + scrim */
.pr-lead > *{position:relative;z-index:1;}
.pr-lead:hover{transform:translateY(-2px);border-color:color-mix(in oklab, var(--brand-green), transparent 45%);box-shadow:0 18px 50px -24px rgba(0,0,0,0.55);}
.pr-lead .pr-meta{display:flex;align-items:center;gap:12px;font-family:var(--f-mono);font-size:12px;text-transform:uppercase;letter-spacing:0.04em;color:rgba(255,255,255,0.7);margin-bottom:14px;}
.pr-lead .pr-tag{display:inline-block;font-family:var(--f-mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--brand-green);margin-bottom:14px;}
.pr-lead h4{font-family:var(--f-display);font-size:clamp(22px,2.6vw,30px);font-weight:600;letter-spacing:-0.025em;line-height:1.12;color:#fff;margin-bottom:14px;text-wrap:balance;text-shadow:0 1px 14px rgba(0,0,0,0.45);}
.pr-lead .dek{font-size:15.5px;line-height:1.6;color:rgba(255,255,255,0.85);max-width:560px;text-shadow:0 1px 10px rgba(0,0,0,0.4);}

.pr-list{list-style:none;margin-top:8px;border-top:1px solid var(--line);}
.pr-item{display:grid;grid-template-columns:160px 1fr 24px;gap:20px;align-items:center;padding:18px 4px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .2s, padding .2s;}
.pr-item:hover{background:var(--bg-alt);padding-left:14px;padding-right:14px;}
.pr-item .pr-date{font-family:var(--f-mono);font-size:12px;color:var(--fg-3);letter-spacing:0.02em;}
.pr-item .pr-title{font-size:15.5px;font-weight:500;color:var(--fg);letter-spacing:-0.01em;}
.pr-item .pr-arrow{color:var(--fg-3);justify-self:end;}
.pr-item:hover .pr-arrow{color:var(--accent);}
.pr-item .pr-arrow svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}
@media(max-width:680px){.pr-item{grid-template-columns:1fr;gap:4px;}.pr-item .pr-arrow{display:none;}}

.news .media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.media-card{
  position:relative;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(120% 90% at 100% 0%, color-mix(in oklab, var(--accent), transparent 82%) 0%, transparent 55%),
    linear-gradient(158deg, #20262b 0%, #14181b 46%, #0c0e10 100%);
  border:1px solid rgba(255,255,255,0.08);border-radius:18px;
  padding:14px 14px 0;display:flex;flex-direction:column;cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.18), 0 26px 50px -34px rgba(0,0,0,.7);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.media-card::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(80% 120% at 0% 100%, color-mix(in oklab, var(--accent), transparent 90%) 0%, transparent 60%);
  opacity:0;transition:opacity .3s ease;
}
.media-card:hover{transform:translateY(-4px);border-color:color-mix(in oklab, var(--accent), transparent 55%);box-shadow:0 1px 2px rgba(0,0,0,.2), 0 34px 60px -32px rgba(0,0,0,.85);}
.media-card:hover::before{opacity:1;}

/* ---- thumbnail ---- */
.media-thumb{
  position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;
  background:#0c0e10;flex:none;
}
.media-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.media-thumb.contain img{object-fit:contain;}
.media-thumb.panel-light{background:#ffffff;}
.media-thumb.panel-dark{background:#000000;}
.media-thumb.contain img{padding:24px;}
/* placeholder (no asset yet) */
.media-thumb.placeholder{
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.035) 0 9px, transparent 9px 18px),
    linear-gradient(160deg, #1a1f22, #0c0e10);
  display:flex;align-items:center;justify-content:center;
}
.thumb-ph{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:0 14px;}
.thumb-ph-name{font-family:var(--f-display);font-weight:600;font-size:20px;letter-spacing:-0.015em;color:rgba(255,255,255,0.82);}
.thumb-ph-note{font-family:var(--f-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.34);}
/* tag pill overlaid on the thumbnail */
.media-thumb .media-tag{
  position:absolute;top:10px;left:10px;z-index:2;
  font-family:var(--f-mono);font-size:10px;letter-spacing:0.07em;text-transform:uppercase;
  color:#fff;white-space:nowrap;padding:5px 9px;border-radius:980px;
  background:color-mix(in oklab, var(--accent), transparent 14%);
  box-shadow:0 2px 8px rgba(0,0,0,0.3);
}

/* ---- body ---- */
.media-body{display:flex;flex-direction:column;flex:1 1 auto;padding:16px 12px 18px;}
.media-source{
  font-family:var(--f-mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--accent);margin-bottom:9px;
}
.media-card h4{font-family:var(--f-display);font-size:17px;font-weight:600;letter-spacing:-0.015em;line-height:1.26;color:#f2f3f4;margin-bottom:12px;text-wrap:pretty;}
.media-card .dek{font-size:14px;line-height:1.6;color:rgba(255,255,255,0.6);margin-bottom:18px;}
.media-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid rgba(255,255,255,0.09);}
.media-date{font-family:var(--f-mono);font-size:11.5px;letter-spacing:0.03em;text-transform:uppercase;color:rgba(255,255,255,0.42);}
.media-read{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--accent);white-space:nowrap;}
.media-read svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s;}
.media-card:hover .media-read svg{transform:translateX(4px);}

/* ---- featured lead: spans the full grid width, horizontal ---- */
.news .media-card.lead{grid-column:1 / -1;flex-direction:row;align-items:stretch;padding:16px;gap:4px;}
.media-card.lead .media-thumb{aspect-ratio:auto;width:50%;min-height:300px;flex:none;border-radius:14px;}
.media-card.lead .media-body{padding:18px 22px 18px 26px;display:flex;flex-direction:column;justify-content:center;}
.media-card.lead .media-source{font-size:12px;}
.media-card.lead h4{font-size:25px;line-height:1.16;margin-bottom:14px;}
.media-card.lead .media-tag{font-size:10.5px;padding:6px 11px;}

@media(max-width:980px){.news .media-grid{grid-template-columns:repeat(2,1fr);}.news .media-card.lead{grid-column:span 2;}}
@media(max-width:680px){.news .media-grid{grid-template-columns:1fr;}.news .media-card.lead{grid-column:span 1;flex-direction:column;padding:14px 14px 0;}.media-card.lead .media-thumb{width:auto;aspect-ratio:16/10;}.media-card.lead .media-body{padding:16px 12px 18px;}}

/* ============ CTA ============ */
.cta{padding:var(--band) 0;text-align:center;}
.cta-card{
  max-width:880px;margin:0 auto;padding:72px 56px;border-radius:28px;
  background:var(--surface);color:var(--fg);border:1px solid var(--line);box-shadow:var(--shadow);position:relative;overflow:hidden;
}
.cta-card::before{content:none;}
.cta-card .tag{color:var(--accent);position:relative;}
.cta-card h2{font-family:var(--f-display);font-size:clamp(30px,3.6vw,46px);font-weight:600;letter-spacing:-0.03em;line-height:1.05;margin:0 auto 18px;max-width:640px;position:relative;}
.cta-card h2 em{font-style:normal;color:var(--accent);}
.cta-card .sub{font-size:16.5px;line-height:1.6;color:var(--fg-2);max-width:480px;margin:0 auto 34px;position:relative;}
.cta-actions{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;position:relative;}
/* helper line beneath the CTA buttons (light card) */
.cta-card .cta-help{
  font-family:var(--f-body);font-size:14px;line-height:1.5;font-weight:400;
  color:var(--fg-2);max-width:340px;margin:16px auto 0;text-align:center;
  text-shadow:none;position:relative;
}

/* ============ FOOTER ============ */
.footer{background:var(--bg-alt);border-top:1px solid var(--line);padding:64px 0 40px;}
.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-bottom:44px;}
.footer-brand img{height:24px;margin-bottom:18px;}
.footer-addr{font-size:13px;line-height:1.7;color:var(--fg-3);font-weight:400;}
.footer-col h5{font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:var(--fg);margin-bottom:16px;}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:10px;}
.footer-col a{font-size:13.5px;color:var(--fg-2);transition:color .15s;}
.footer-col a:hover{color:var(--accent);}
.footer-bottom{border-top:1px solid var(--line);padding-top:24px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;}
.footer-copy{font-size:12px;color:var(--fg-3);}
.btt-top{justify-self:center;display:inline-flex;align-items:center;gap:9px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:0.18em;text-transform:uppercase;color:var(--fg-2);padding:8px 15px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,0.02);transition:color .2s,border-color .2s,background .2s,transform .2s;text-decoration:none;white-space:nowrap;cursor:pointer;}
.btt-top:hover{color:var(--accent);border-color:var(--line-2);background:rgba(255,255,255,0.05);transform:translateY(-1px);}
.btt-top svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s;}
.btt-top:hover svg{transform:translateY(-2px);}
.footer-socials{display:flex;gap:14px;justify-self:end;}
.footer-socials a{color:var(--fg-3);transition:color .15s;}
.footer-socials a:hover{color:var(--accent);}
.footer-socials svg{width:17px;height:17px;fill:currentColor;}
.footer-socials a[aria-label*="Telegram"] svg{fill:#229ED9;}
.footer-socials a[aria-label*="Discord"] svg{fill:#5865F2;}
.footer-socials a[aria-label*="on X"] svg{fill:var(--fg);}
.footer-socials a[aria-label*="Email"] svg{fill:var(--fg-3);}
.footer-socials a:hover svg{opacity:.82;}
@media(max-width:760px){.footer-top{grid-template-columns:1fr 1fr;}.footer-bottom{grid-template-columns:1fr;justify-items:center;text-align:center;}.btt-top,.footer-socials{justify-self:center;}}

/* ============ Reveal animation ============ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;}}

/* ============ Responsive grids ============ */
/* side-by-side needs room — stack it before the content column gets cramped */
@media(max-width:1100px){
  .split > .container{grid-template-columns:1fr;gap:40px;}
  .split > .container > :first-child{position:static;}
}
@media(max-width:900px){
  .container,.container-wide{padding:0 24px;}
  .what-grid{grid-template-columns:1fr;gap:48px;}
  .numgrid,.numgrid.two{grid-template-columns:1fr;}
  .ps-cols{grid-template-columns:1fr;}
  .feature-row{grid-template-columns:1fr;}
}

/* ============ Mobile refinements ============ */
@media(max-width:760px){
  /* orbital hero: tighten height so the small-screen logo + rays don't leave a void */
  .hero{min-height:88vh;}
  /* the hero block-card sits full width on phones */
  .hero-intro .hero-block-card{max-width:none;}
}
@media(max-width:600px){
  .container,.container-wide{padding:0 20px;}
  .hero-statement{top:clamp(86px,13vh,128px);width:90%;}
  .hero-statement .hero-title{font-size:clamp(26px,7.6vw,34px);}
  .hero-statement p{font-size:clamp(16px,4.6vw,20px);line-height:1.4;margin-top:12px;}
  .hero-intro h1{font-size:clamp(26px,7.6vw,34px);}
  .hero-intro .hero-sub{font-size:16px;max-width:none;}
  .hero-intro-inner{padding:84px 20px 16px;}
  .hero-intro .hero-visual{height:84vw;min-height:280px;}
  .sectors-row{flex-wrap:wrap;justify-content:center;row-gap:10px;}
  /* comfortable tap targets for footer + inline links */
  .footer-socials a{width:40px;height:40px;display:flex;align-items:center;justify-content:center;}
  .footer-socials{gap:6px;}
  .btt-top{padding:11px 16px;}
  /* tighten oversized card paddings so content gets room on phones */
  .cta-card{padding:46px 24px;}
  .cta-actions{flex-direction:column;align-items:center;gap:12px;}
  .cta-actions .btn{width:100%;max-width:340px;justify-content:center;min-height:50px;}
  .cta-card .cta-help{margin-top:18px;}
  .pr-lead{padding:28px 22px;}
  .svc{padding:32px 24px;}
  .svc.svc-noq{padding:32px 24px;}
  .numcard{padding:32px 24px;}
}
@media(max-width:480px){
  .footer-top{grid-template-columns:1fr;gap:30px;}
  .feature-cell{padding:30px 26px;}
  .ps-col{padding:40px 28px;}
}

/* ============ Article modal ============ */
.amodal{position:fixed;inset:0;z-index:500;display:none;align-items:center;justify-content:center;padding:24px;}
.amodal.open{display:flex;}
.amodal-backdrop{position:absolute;inset:0;background:rgba(10,12,11,0.55);backdrop-filter:blur(6px);}
.amodal-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:20px;max-width:720px;width:100%;max-height:86vh;display:flex;flex-direction:column;box-shadow:0 40px 120px -30px rgba(0,0,0,.6);}
.amodal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px 28px;border-bottom:1px solid var(--line);}
.amodal-meta{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12px;text-transform:uppercase;letter-spacing:0.04em;color:var(--fg-3);flex-wrap:wrap;}
.amodal-meta .accent{color:var(--accent);}
.amodal-close{background:var(--bg-alt);border:1px solid var(--line);border-radius:50%;width:34px;height:34px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--fg-2);flex-shrink:0;}
.amodal-close:hover{color:var(--fg);}
.amodal-close svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}
.amodal-body{padding:28px;overflow-y:auto;}
.amodal-body h2{font-family:var(--f-display);font-size:26px;font-weight:600;letter-spacing:-0.02em;line-height:1.15;color:var(--fg);margin-bottom:18px;}
.amodal-body p{font-size:15.5px;line-height:1.7;color:var(--fg-2);margin-bottom:16px;}

/* ============ PAGE HERO (subpages: Newsroom) ============ */
.page-hero{
  padding:132px 0 52px;
  background:radial-gradient(125% 95% at 50% -15%, #ffffff 0%, #ffffff 56%, #f2f4f3 100%);
  border-bottom:0.5px solid var(--line);
}
:root[data-variant="eclipse"] .page-hero{background:var(--bg-alt);}
.page-hero .ph-inner{max-width:760px;}
.page-hero h1{font-family:var(--f-display);font-size:clamp(34px,5vw,58px);font-weight:600;letter-spacing:-0.03em;line-height:1.04;color:var(--fg);margin:14px 0 0;}
.page-hero h1 em{font-style:normal;color:var(--accent);}
.page-hero .dek{font-size:clamp(16px,1.7vw,19px);color:var(--fg-2);margin-top:16px;max-width:620px;line-height:1.55;}
.page-hero .ph-jump{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap;}
.page-hero .ph-jump a{font-size:13px;color:var(--fg-2);border:0.5px solid var(--line-2);padding:8px 15px;border-radius:980px;transition:background .18s,color .18s;}
.page-hero .ph-jump a:hover{background:var(--bg-alt);color:var(--fg);}

/* ============ NEWSROOM TEASER (home) ============ */
.newsroom-teaser{padding:var(--band) 0;border-bottom:1px solid var(--line);}
.nt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.nt-card{display:flex;flex-direction:column;gap:11px;padding:24px;border:0.5px solid var(--line);border-radius:18px;background:var(--surface);text-decoration:none;color:var(--fg);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;}
.nt-card:hover{transform:translateY(-3px);border-color:var(--line-2);box-shadow:var(--shadow);}
.nt-top{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.nt-kicker{font-size:11.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);}
.nt-date{font-size:12.5px;color:var(--fg-3);}
.nt-card h3{font-family:var(--f-display);font-size:19px;font-weight:600;line-height:1.25;letter-spacing:-0.01em;margin:2px 0 0;color:var(--fg);}
.nt-card p{font-size:14px;color:var(--fg-2);line-height:1.5;flex:1 1 auto;}
.nt-link{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:500;color:var(--accent);margin-top:2px;}
.nt-link svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;}
.nt-cta-row{display:flex;justify-content:center;margin-top:38px;}
.nt-cta-row .btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;margin-left:2px;}
@media(max-width:860px){.nt-grid{grid-template-columns:1fr;}}