/* ============================================================
   NewDawn.ai · Enhanced UX variant · shell styles
   Dark default; [data-theme="light"] flips to paper.
   ============================================================ */

/* Default = dark */
:root {
  --paper:    #0C0C0B;
  --paper-2:  #17161A;
  --paper-3:  #1F1D1F;
  --ink:      #EDE7DB;
  --ink-2:    #C9C2B3;
  --ink-3:    #8B8478;
  --rule:     #2A2723;
  --rule-soft:#1F1D1A;
}
[data-theme="light"] {
  --paper:    #F5F1EA;
  --paper-2:  #EDE7DB;
  --paper-3:  #E2DBCB;
  --ink:      #141311;
  --ink-2:    #3A3631;
  --ink-3:    #6B6357;
  --rule:     #C9C2B3;
  --rule-soft:#DDD6C6;
}

html, body { margin:0; padding:0; background:var(--paper); color:var(--ink); }
body {
  font-family: var(--font-mono,'JetBrains Mono',ui-monospace,monospace);
  font-size: var(--fs-base,16px);
  line-height: var(--lh-normal,1.55);
  -webkit-font-smoothing: antialiased;
}

/* Cursor trail canvas — sits behind content, follows the pointer */
.nd-trail { position:fixed; inset:0; pointer-events:none; z-index:0; mix-blend-mode:screen; }
[data-theme="light"] .nd-trail { mix-blend-mode:multiply; opacity:.6; }

/* Per-shape page tint: rebinds --ember on the body so every existing ember-colored
   element (CTAs, links, eyebrows, hero codes) re-tints to the page's shape. */
body[data-shape="copilots"]   { --ember: var(--shape-copilots); }
body[data-shape="rag"]        { --ember: var(--shape-rag); }
body[data-shape="agents"]     { --ember: var(--shape-agents); }
body[data-shape="voice"]      { --ember: var(--shape-voice); }
body[data-shape="automation"] { --ember: var(--shape-automation); }
body[data-shape="integrate"]  { --ember: var(--shape-integrate); }

/* Subtle grid overlay */
body::before {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:
    repeating-linear-gradient(0deg, var(--rule) 0 1px, transparent 1px 48px),
    repeating-linear-gradient(90deg, var(--rule) 0 1px, transparent 1px 48px);
  opacity:0.05;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 20%, #000, transparent 90%);
}
/* Ambient color nebula — red (top-left), blue (bottom-right), white blooms */
body::after {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(ellipse 55% 40% at 3% 12%, rgba(180,28,38,0.26), transparent 70%),
    radial-gradient(ellipse 50% 45% at 97% 88%, rgba(25,45,175,0.30), transparent 70%),
    radial-gradient(ellipse 30% 25% at 72% 8%,  rgba(255,248,230,0.07), transparent 60%),
    radial-gradient(ellipse 38% 32% at 18% 92%, rgba(30,55,180,0.22), transparent 60%);
}
main, header.nd-nav, footer.nd-foot, .nd-partner { position:relative; z-index:1; }

a { color:inherit; text-decoration:none; }
*, *::before, *::after { box-sizing:border-box; }

.wrap { max-width:1200px; margin:0 auto; padding:0 var(--gutter,24px); }
@media (min-width:900px) { .wrap { padding:0 var(--gutter-lg,48px); } }

/* ===================== ANTHROPIC STRIP ===================== */
.nd-partner {
  border-bottom:1px solid var(--rule);
  background: color-mix(in oklab, var(--paper) 88%, #000);
  font-size:11px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--ink-2);
}
.nd-partner__row {
  display:flex; align-items:center; justify-content:space-between;
  height:32px; gap:var(--sp-5,24px);
}
.nd-partner__left { display:inline-flex; align-items:center; gap:10px; }
.nd-partner__left .star {
  width:10px; height:10px; color:var(--ember,#C96F3B); flex:0 0 10px;
  animation:starpulse 4s var(--ease,cubic-bezier(.2,.7,.2,1)) infinite;
}
@keyframes starpulse {
  0%,100% { opacity:.6; transform:rotate(0deg); }
  50%     { opacity:1;  transform:rotate(45deg); }
}
.nd-partner__left b  { color:var(--ember,#C96F3B); font-weight:600; }
.nd-partner__right { color:var(--ink-2); }
.nd-partner__right b { color:var(--ink); font-weight:600; }

/* Ambient background prism on service pages */
.nd-ambient {
  position:fixed; top:0; right:-10%; width:560px; height:760px;
  pointer-events:none; z-index:0; opacity:0.20;
  mask-image: radial-gradient(ellipse 70% 70% at 60% 40%, #000 0%, transparent 80%);
  transform:translateZ(0);
}
.nd-ambient iframe { width:100%; height:100%; border:0; filter:blur(0.3px) saturate(1.1); }
@media (max-width:900px) { .nd-ambient { display:none; } }

/* ===================== NAV ===================== */
header.nd-nav {
  border-bottom:1px solid var(--rule);
  background:color-mix(in oklab, var(--paper) 88%, transparent);
  backdrop-filter:blur(6px);
  position:sticky; top:0; z-index:var(--z-nav,100);
}
.nd-nav__row {
  display:flex; align-items:center; justify-content:space-between;
  height:64px; gap:var(--sp-5,24px);
}

/* Animated wordmark */
.nd-nav__brand {
  font-size:22px; font-weight:600; letter-spacing:-0.01em;
  display:inline-flex; align-items:baseline; gap:2px;
  background: linear-gradient(90deg,
    var(--ink) 0%, var(--ink) 40%,
    var(--horizon-peach,#F2B27A) 50%, var(--ember,#C96F3B) 55%,
    var(--ink) 65%, var(--ink) 100%);
  background-size:280% 100%;
  background-position:0% 0;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:brandsweep 8s var(--ease,cubic-bezier(.2,.7,.2,1)) infinite;
}
@keyframes brandsweep {
  0%,100% { background-position:120% 0; }
  50%     { background-position:-20% 0; }
}
.nd-nav__brand .dot {
  -webkit-text-fill-color:var(--ember,#C96F3B);
  color:var(--ember,#C96F3B);
  display:inline-block;
  animation:dotpulse 1.6s var(--ease,cubic-bezier(.2,.7,.2,1)) infinite;
}
@keyframes dotpulse {
  0%,100% { text-shadow:0 0 0 rgba(201,111,59,0); transform:scale(1); }
  50%     { text-shadow:0 0 10px rgba(201,111,59,0.9); transform:scale(1.15); }
}
.nd-nav__brand:hover { animation-duration:3s; }

@media (prefers-reduced-motion:reduce) {
  .nd-nav__brand, .nd-nav__brand .dot, .nd-partner__left .star { animation:none; }
}

.nd-nav__links {
  display:flex; align-items:center; gap:var(--sp-5,24px);
  list-style:none; margin:0; padding:0;
  font-size:var(--fs-sm,14px); text-transform:lowercase; letter-spacing:0.04em;
}
.nd-nav__links a { color:var(--ink-2); padding:6px 0; border-bottom:1px solid transparent; }
.nd-nav__links a:hover,
.nd-nav__links a[aria-current="page"] { color:var(--ink); border-bottom-color:var(--ember,#C96F3B); }
.nd-nav__right { display:flex; align-items:center; gap:var(--sp-4,16px); }

/* Services dropdown */
.nd-nav__dd { position:relative; }
.nd-nav__dd > button {
  font:inherit; font-size:var(--fs-sm,14px); color:var(--ink-2);
  background:none; border:0; cursor:pointer;
  padding:6px 0; letter-spacing:0.04em; text-transform:lowercase;
  display:inline-flex; align-items:center; gap:6px;
}
.nd-nav__dd > button:hover,
.nd-nav__dd[data-open="true"] > button { color:var(--ink); }
.nd-nav__dd > button::after { content:'▾'; font-size:10px; opacity:.7; }
.nd-nav__dd-panel {
  position:absolute; top:calc(100% + 8px); left:-16px; min-width:360px;
  background:var(--paper); border:1px solid var(--rule);
  padding:var(--sp-3,12px); display:none;
  box-shadow:var(--shadow-stamp-strong,3px 3px 0 rgba(20,19,17,.16));
  z-index:200;
}
.nd-nav__dd[data-open="true"] .nd-nav__dd-panel { display:block; }
.nd-nav__dd-panel a {
  display:grid; grid-template-columns:44px 1fr auto; gap:var(--sp-3,12px);
  padding:var(--sp-3,12px); align-items:center; border:1px solid transparent;
}
.nd-nav__dd-panel a:hover { border-color:var(--rule); background:var(--paper-2); }
.nd-nav__dd-code  { font-size:10px; letter-spacing:0.16em; color:var(--ink-3); text-transform:uppercase; }
.nd-nav__dd-name  { font-weight:500; color:var(--ink); }
.nd-nav__dd-desc  { font-size:11px; color:var(--ink-3); margin-top:2px; }
.nd-nav__dd-arrow { color:var(--ember,#C96F3B); font-size:14px; }

/* Theme toggle */
.nd-toggle {
  font:inherit; font-size:10px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--ink-2); background:none; border:1px solid var(--rule);
  padding:6px 10px; cursor:pointer; border-radius:2px;
}
.nd-toggle:hover { border-color:var(--ember,#C96F3B); color:var(--ink); }

/* CTA in nav */
.nd-nav__cta {
  font-size:var(--fs-sm,14px); padding:8px 14px; border:1px solid var(--ink);
  color:var(--ink); border-radius:var(--radius-cta,4px);
  display:inline-flex; align-items:center; gap:8px;
  transition:all var(--dur-fast,150ms) var(--ease,cubic-bezier(.2,.7,.2,1));
  white-space:nowrap;
}
.nd-nav__cta:hover { background:var(--ember,#C96F3B); border-color:var(--ember,#C96F3B); color:#0C0C0B; }

/* Mobile burger */
.nd-burger {
  display:none; background:none; border:1px solid var(--rule);
  color:var(--ink-2); padding:8px 10px; cursor:pointer; border-radius:2px;
  font-size:18px; line-height:1;
}
.nd-burger:hover { border-color:var(--ember,#C96F3B); color:var(--ink); }
@media (max-width:820px) {
  .nd-nav__links { display:none; }
  .nd-toggle { display:none; }
  .nd-nav__cta { display:none; }
  .nd-burger { display:block; flex-shrink:0; }
  .nd-nav__row { gap:0; }
  .nd-nav__brand { flex:1; }
  .nd-nav__right { display:none; }
  .nd-partner { letter-spacing:0.05em; font-size:10px; }
  .nd-partner__row { height:auto; flex-direction:column; align-items:flex-start; gap:2px; padding:5px 0; }
}

/* Mobile nav drawer */
.nd-mobile-nav {
  display:none; flex-direction:column; gap:0;
  background:var(--paper); border-bottom:1px solid var(--rule);
  padding:var(--sp-4,16px) var(--gutter,24px);
  position:relative; z-index:90;
}
.nd-mobile-nav[data-open="true"] { display:flex; }
.nd-mobile-nav a, .nd-mobile-nav button {
  display:block; padding:12px 0; font-size:var(--fs-sm,14px);
  color:var(--ink-2); border-bottom:1px solid var(--rule-soft);
  background:none; border-left:0; border-right:0; border-top:0;
  text-align:left; width:100%; cursor:pointer; font-family:inherit;
  letter-spacing:0.04em; text-transform:lowercase;
}
.nd-mobile-nav a:hover, .nd-mobile-nav button:hover { color:var(--ember,#C96F3B); }

/* ===================== SECTION PRIMITIVES ===================== */
.section { padding:var(--sp-9,96px) 0; border-top:1px solid var(--rule); }
.section:first-of-type { border-top:0; }
.section__head {
  display:grid; grid-template-columns:1fr auto; align-items:baseline;
  margin-bottom:var(--sp-7,48px); gap:var(--sp-5,24px);
}
.section__eyebrow {
  font-size:var(--fs-xs,12px); text-transform:uppercase;
  letter-spacing:var(--tracking-wider,.14em); color:var(--ember,#C96F3B);
}
.section__counter {
  font-size:var(--fs-xs,12px); text-transform:uppercase;
  letter-spacing:var(--tracking-wider,.14em); color:var(--ink-3);
  font-variant-numeric:tabular-nums;
  border:1px solid var(--rule); padding:4px 10px;
}
.section__title {
  font-size:clamp(var(--fs-2xl,36px), 4.5vw, var(--fs-4xl,64px));
  font-weight:600; letter-spacing:-0.01em; line-height:1.05;
  margin:var(--sp-3,12px) 0 0; text-wrap:balance; max-width:18ch;
}
.section__lede {
  color:var(--ink-2); max-width:60ch; margin-top:var(--sp-4,16px);
  font-size:var(--fs-md,18px); line-height:1.55;
}

/* CTA buttons */
.cta {
  display:inline-flex; align-items:center; gap:8px; padding:12px 18px;
  border:1px solid var(--ink); color:var(--ink); border-radius:var(--radius-cta,4px);
  font-family:var(--font-mono,'JetBrains Mono',monospace);
  font-weight:500; font-size:var(--fs-sm,14px);
  transition:all var(--dur-fast,150ms) var(--ease,cubic-bezier(.2,.7,.2,1)); cursor:pointer;
  white-space:nowrap;
}
.cta--primary { background:var(--ember,#C96F3B); border-color:var(--ember,#C96F3B); color:#0C0C0B; }
.cta--primary:hover { background:var(--ember-bright,#E8844A); border-color:var(--ember-bright,#E8844A); }
.cta--ghost:hover { border-color:var(--ember,#C96F3B); color:var(--ember,#C96F3B); }

/* Card */
.nd-card {
  border:1px solid var(--rule); padding:var(--sp-6,32px); background:var(--paper);
  display:flex; flex-direction:column; gap:var(--sp-3,12px);
  transition:border-color var(--dur-fast,150ms) var(--ease,cubic-bezier(.2,.7,.2,1)),
             box-shadow var(--dur-fast,150ms) var(--ease,cubic-bezier(.2,.7,.2,1));
}
.nd-card:hover { border-color:var(--ink-2); }
.nd-card[data-shape="copilots"]:hover   { border-color:var(--shape-copilots);   box-shadow:0 0 24px -6px rgba(201,111,59,.35); }
.nd-card[data-shape="rag"]:hover        { border-color:var(--shape-rag);        box-shadow:0 0 24px -6px rgba(106,184,196,.35); }
.nd-card[data-shape="agents"]:hover     { border-color:var(--shape-agents);     box-shadow:0 0 24px -6px rgba(213,106,122,.35); }
.nd-card[data-shape="voice"]:hover      { border-color:var(--shape-voice);      box-shadow:0 0 24px -6px rgba(233,196,106,.35); }
.nd-card[data-shape="automation"]:hover { border-color:var(--shape-automation); box-shadow:0 0 24px -6px rgba(107,168,110,.35); }
.nd-card[data-shape="integrate"]:hover  { border-color:var(--shape-integrate);  box-shadow:0 0 24px -6px rgba(90,95,184,.35); }
.nd-card__label { font-size:var(--fs-xs,12px); letter-spacing:var(--tracking-wider,.14em); text-transform:uppercase; color:var(--ember,#C96F3B); }
.nd-card__title { font-size:var(--fs-xl,28px); font-weight:600; letter-spacing:-0.01em; margin:0; }
.nd-card__desc  { color:var(--ink-2); margin:0; }
.nd-card dl { display:grid; grid-template-columns:auto 1fr; gap:4px 14px; margin:var(--sp-3,12px) 0 0; font-size:var(--fs-sm,14px); }
.nd-card dt { color:var(--ink-3); text-transform:uppercase; letter-spacing:0.1em; font-size:10.5px; padding-top:3px; }
.nd-card dd { margin:0; color:var(--ink); }

/* Grid helpers */
.grid { display:grid; gap:var(--sp-5,24px); }
.grid--2 { grid-template-columns:1fr; }
.grid--3 { grid-template-columns:1fr; }
.grid--4 { grid-template-columns:1fr; }
@media (min-width:720px)  { .grid--2 { grid-template-columns:1fr 1fr; } }
@media (min-width:900px)  { .grid--3 { grid-template-columns:1fr 1fr 1fr; } .grid--4 { grid-template-columns:1fr 1fr; } }
@media (min-width:1100px) { .grid--4 { grid-template-columns:1fr 1fr 1fr 1fr; } }

/* Ticker */
.ticker {
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  padding:var(--sp-3,12px) 0; overflow:hidden; white-space:nowrap;
}
.ticker__track { display:inline-flex; gap:var(--sp-7,48px); animation:tkr 40s linear infinite; }
.ticker span { font-size:var(--fs-xs,12px); letter-spacing:var(--tracking-wider,.14em); text-transform:uppercase; color:var(--ink-2); }
.ticker span::before { content:'· '; color:var(--ember,#C96F3B); margin-right:6px; }
@keyframes tkr { from{transform:translateX(0);} to{transform:translateX(-50%);} }
@media (prefers-reduced-motion:reduce) { .ticker__track { animation:none; } }

/* FAQ */
.nd-faq details { border-bottom:1px solid var(--rule); padding:var(--sp-5,24px) 0; }
.nd-faq summary {
  list-style:none; cursor:pointer; display:grid;
  grid-template-columns:1fr 20px; align-items:center;
  font-size:var(--fs-md,18px); font-weight:500;
}
.nd-faq summary::-webkit-details-marker { display:none; }
.nd-faq summary::after { content:'+'; font-size:20px; color:var(--ember,#C96F3B); transition:transform var(--dur,250ms) var(--ease,cubic-bezier(.2,.7,.2,1)); }
.nd-faq details[open] summary::after { content:'×'; }
.nd-faq p { color:var(--ink-2); margin:var(--sp-4,16px) 0 0; max-width:70ch; }

/* Footer */
footer.nd-foot {
  border-top:1px solid var(--rule); padding:var(--sp-7,48px) 0 var(--sp-5,24px);
  margin-top:var(--sp-9,96px); color:var(--ink-3); font-size:var(--fs-xs,12px);
}
.nd-foot__row { display:grid; grid-template-columns:1fr auto; gap:var(--sp-4,16px); align-items:start; }
.nd-foot__sig { letter-spacing:var(--tracking-wider,.14em); text-transform:uppercase; }
.nd-foot__links { display:flex; gap:var(--sp-4,16px); }
.nd-foot__links a:hover { color:var(--ember,#C96F3B); }
@media (max-width:600px) {
  .nd-foot__row { grid-template-columns:1fr; }
}

/* Hero — host for ship prism iframe */
.nd-hero {
  position:relative; height:100svh; min-height:600px;
  border-bottom:1px solid var(--rule); overflow:hidden;
}
.nd-hero__iframe {
  position:absolute; inset:0; width:100%; height:100%; border:0;
}

/* Command Bridge — bottom text band emerges from hero */
.nd-hero__bottom {
  position:absolute; bottom:0; left:0; right:0; z-index:3;
  padding:120px var(--gutter,24px) 52px;
  background: linear-gradient(to bottom,
    transparent 0%,
    rgba(12,12,11,0.78) 45%,
    var(--paper) 82%
  );
  pointer-events:none;
}
.nd-hero__eyebrow {
  font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--ember,#C96F3B); margin-bottom:14px;
  display:flex; align-items:center; gap:10px;
}
.nd-hero__eyebrow::before {
  content:''; display:inline-block; width:28px; height:1px;
  background:var(--ember,#C96F3B); flex-shrink:0;
}
.nd-hero__headline {
  font-size: clamp(38px,5.8vw,84px);
  font-weight:600; letter-spacing:-0.025em; line-height:1.0;
  color:var(--ink); margin:0 0 18px;
  font-family:var(--font-mono,'JetBrains Mono',ui-monospace,monospace);
}
.nd-hero__sub {
  font-size:clamp(12px,1.3vw,15px); color:var(--ink-2);
  letter-spacing:0.10em; text-transform:uppercase; margin:0 0 36px;
}
.nd-hero__actions { display:flex; gap:12px; flex-wrap:wrap; pointer-events:auto; }

.nd-hero__content {
  position:relative; z-index:2; text-align:center; padding:var(--sp-8,64px) var(--gutter,24px);
}

/* Service hero */
.svc-hero { padding:var(--sp-9,96px) 0 var(--sp-8,64px); border-bottom:1px solid var(--rule); }
.svc-hero__grid { display:grid; grid-template-columns:1fr; gap:var(--sp-7,48px); align-items:start; }
@media (min-width:1000px) { .svc-hero__grid { grid-template-columns:1.1fr 1fr; } }
.svc-hero__code { font-size:var(--fs-xs,12px); letter-spacing:var(--tracking-wider,.14em); text-transform:uppercase; color:var(--ember,#C96F3B); }
.svc-hero h1 {
  font-size:clamp(var(--fs-3xl,48px), 6vw, var(--fs-5xl,88px));
  font-weight:600; letter-spacing:-0.02em; line-height:1.02;
  margin:var(--sp-4,16px) 0 var(--sp-5,24px); text-wrap:balance;
}
.svc-hero__lede { font-size:var(--fs-md,18px); color:var(--ink-2); line-height:1.6; max-width:56ch; }
.svc-hero__frame {
  position:relative; aspect-ratio:1/1; border:1px solid var(--rule);
  overflow:hidden; background:#0a0918;
}
.svc-hero__frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; pointer-events:none; }

/* Definition list */
.nd-dl {
  display:grid; grid-template-columns:140px 1fr; gap:var(--sp-3,12px) var(--sp-5,24px);
  font-size:var(--fs-sm,14px); border-top:1px solid var(--rule); padding-top:var(--sp-5,24px);
}
.nd-dl dt { color:var(--ink-3); text-transform:uppercase; letter-spacing:var(--tracking-wide,.08em); font-size:11px; }
.nd-dl dd { margin:0; color:var(--ink); }
.nd-dl dt, .nd-dl dd { border-bottom:1px dashed var(--rule); padding-bottom:var(--sp-3,12px); }

/* ASCII architecture block */
.nd-ascii {
  background:var(--paper-2); border:1px solid var(--rule); padding:var(--sp-5,24px);
  font-size:12px; line-height:1.55; color:var(--ink); overflow-x:auto;
  white-space:pre;
}

/* Phase steps */
.nd-phase { display:grid; grid-template-columns:72px 1fr; gap:var(--sp-5,24px); padding:var(--sp-5,24px) 0; border-bottom:1px dashed var(--rule); }
.nd-phase__n { font-size:var(--fs-2xl,36px); font-weight:600; color:var(--ember,#C96F3B); letter-spacing:-0.02em; }
.nd-phase__name { font-size:var(--fs-lg,22px); font-weight:500; margin:0 0 var(--sp-2,8px); }
.nd-phase__desc { color:var(--ink-2); margin:0; max-width:60ch; }

/* ===================== RESPONSIVE MOBILE ===================== */
@media (max-width:640px) {
  /* Tighten vertical section rhythm */
  .section { padding:var(--sp-8,64px) 0; }

  /* Stack section head — counter drops below title */
  .section__head { grid-template-columns:1fr; }

  /* Hero band — reduce top padding on small/short screens */
  .nd-hero__bottom { padding:72px var(--gutter,24px) 36px; }
  .nd-hero__eyebrow { font-size:10px; letter-spacing:0.13em; }
  .nd-hero__sub { letter-spacing:0.06em; margin-bottom:24px; }

  /* DL → single column (service detail pages) */
  .nd-dl { grid-template-columns:1fr; }
  .nd-dl dt { border-bottom:0; padding-bottom:2px; margin-top:var(--sp-3,12px); }

  /* Phase — tighter number gutter */
  .nd-phase { grid-template-columns:52px 1fr; gap:16px; }
  .nd-phase__n { font-size:var(--fs-xl,28px); }

  /* Footer — let long sig text wrap cleanly */
  .nd-foot__sig { word-break:break-word; }
  .nd-foot__links { flex-wrap:wrap; gap:12px; }
}

@media (max-width:400px) {
  .wrap { padding:0 16px; }
  .nd-hero__bottom { padding:56px 16px 28px; }
  .nd-hero__headline { font-size:clamp(30px,8vw,38px); }
}