/* devonNEXT — Design Tokens */
:root{
  color-scheme: light dark;
  /* Brand */
  --navy:#0C1C36;           /* Brand Navy */
  --navy-90:#12274A;
  --navy-70:#243A5E;
  --n50:#51607A;
  --n40:#586780;
  --n30:#606E88;
  --n20:#A8B2C2;
  --n15:#BEC6D1;
  --n10:#D4D9E2;
  --n05:#EEF0F4;
  --n03:#F6F7FA;

  /* ——— Primary accent: Brand Teal ( #00A6A0 ) ——— */
  --or:#00A6A0;            /* brand teal (primary) */
  --or-h:#008C86;          /* hover (deeper) */
  --or-soft:#D6F0EE;       /* soft tint */
  --or-glow:rgba(0,166,160,.30);
  --teal:#00A6A0;          /* alias */
  --teal-h:#008C86;
  --teal-deep:#053F38;
  --gold:#FFD166;          /* warm gold accent (arrow, highlights) */
  --gold-h:#F5BF3E;
  --lime:#C9E265;          /* lime accent (optional) */
  --lime-h:#B8D048;

  --wh:#FFFFFF;
  --warm:#F6F5F2;
  --warm-2:#EDEAE3;

  --grn:#00A6A0;
  --sport-grn:#7BAE3F;
  --red:#C43A2B;

  /* Type */
  --hd:'Sora',system-ui,-apple-system,sans-serif;
  --bd:'DM Sans',system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  /* Motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  /* Shadow */
  --sh-1:0 1px 2px rgba(12,28,54,.04),0 2px 8px rgba(12,28,54,.04);
  --sh-2:0 4px 20px rgba(12,28,54,.06),0 1px 3px rgba(12,28,54,.04);
  --sh-3:0 12px 40px rgba(12,28,54,.10),0 2px 6px rgba(12,28,54,.04);
  --sh-or:0 8px 28px rgba(0,166,160,.32);

  /* Radii */
  --r-sm:6px;
  --r-md:10px;
  --r-lg:16px;
  --r-xl:24px;
  /* Einheitlicher vertikaler Modul-Abstand (sitewide) */
  --sp-sect:52px;
}
@media(max-width:640px){:root{--sp-sect:40px}}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--wh);
  color:var(--navy);
  font-family:var(--bd);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
button{font-family:inherit}
a{color:inherit;text-decoration:none}

/* Utility */
.wrap{max-width:1240px;margin:0 auto;padding:0 40px}
.wrap-narrow{max-width:880px;margin:0 auto;padding:0 40px}
@media(max-width:720px){.wrap,.wrap-narrow{padding:0 22px}}

/* Eyebrow marker */
.eye{display:inline-flex;align-items:center;gap:8px;font-family:var(--hd);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--or);margin-bottom:20px}
.eye::before{content:'//';font-weight:800;letter-spacing:-1px;color:var(--or)}

/* Section headings */
.h-xl{font-family:var(--hd);font-size:clamp(40px,5.4vw,72px);font-weight:700;line-height:1.02;letter-spacing:-0.03em}
.h-lg{font-family:var(--hd);font-size:clamp(32px,3.8vw,48px);font-weight:700;line-height:1.08;letter-spacing:-0.025em}
.h-md{font-family:var(--hd);font-size:clamp(24px,2.4vw,32px);font-weight:700;line-height:1.2;letter-spacing:-0.015em}
.h-sm{font-family:var(--hd);font-size:20px;font-weight:700;line-height:1.3;letter-spacing:-0.01em}
.lead{font-size:18px;line-height:1.65;color:var(--n40);max-width:62ch}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--bd);font-size:15px;font-weight:600;
  padding:14px 26px;border-radius:var(--r-md);
  border:none;cursor:pointer;transition:all .25s var(--ease);
  text-decoration:none;white-space:nowrap;
}
.btn-primary{background:var(--or);color:#fff;box-shadow:var(--sh-or)}
.btn-primary:hover{background:var(--or-h);transform:translateY(-1px);box-shadow:0 12px 36px rgba(0,166,160,.38)}
.btn-ghost{background:transparent;color:var(--navy);padding:14px 0}
.btn-ghost:hover{color:var(--or)}
.btn-dark{background:var(--navy);color:#fff}
.btn-dark:hover{background:#000}
.btn-outline{background:transparent;color:var(--navy);border:1.5px solid var(--n10)}
.btn-outline:hover{border-color:var(--navy)}
.btn-lg{padding:18px 34px;font-size:16px}
.btn .arr{display:inline-block;transition:transform .25s var(--ease)}
.btn:hover .arr{transform:translateX(3px)}

/* Reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.rv.v{opacity:1;transform:none}
.rv-d1{transition-delay:.08s}
.rv-d2{transition-delay:.16s}
.rv-d3{transition-delay:.24s}

/* Big decorative slashes */
.slash-deco{
  position:absolute;font-family:var(--hd);font-weight:900;
  color:var(--or);opacity:.04;line-height:.8;letter-spacing:-.1em;
  pointer-events:none;user-select:none;
}

/* Tag pill */
.tag{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:100px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-family:var(--hd)}
.tag-or{background:var(--or-soft);color:var(--or-h)}
.tag-navy{background:rgba(12,28,54,.06);color:var(--navy)}
.tag-grn{background:rgba(0,166,160,.1);color:var(--grn)}

/* Focus states */
:focus-visible{outline:2px solid var(--or);outline-offset:3px;border-radius:4px}

/* Scrollbar taming */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--n10);border-radius:10px;border:2px solid var(--wh)}
::-webkit-scrollbar-thumb:hover{background:var(--n20)}

/* ======== DARK MODE — DISABLED (kept for reference, never activated) ======== */
html[data-theme="never-dark-do-not-match"]{
  --navy:#F5F7FA;          /* inverted — text-on-dark */
  --navy-90:#E7EAF0;
  --navy-70:#BFC6D4;
  --n50:#9AA3B5;
  --n40:#8791A3;
  --n30:#6E7789;
  --n20:#4E5566;
  --n15:#3A4053;
  --n10:#2A2F40;
  --n05:#1B1F2E;
  --n03:#151927;

  --wh:#0B0E1A;            /* page bg */
  --warm:#121624;
  --warm-2:#1A1E2C;
}
html[data-theme="dark"] body{background:var(--wh);color:var(--navy)}
html[data-theme="dark"] .hero{
  background:
    radial-gradient(1200px 500px at 90% -10%, rgba(0,166,160,.14) 0%, transparent 60%),
    linear-gradient(180deg, #0B0E1A 0%, #10152A 100%);
}
html[data-theme="dark"] nav.top{background:rgba(11,14,26,.72)}
html[data-theme="dark"] nav.top.scrolled{background:rgba(11,14,26,.92);border-color:var(--n10)}
html[data-theme="dark"] .hero-chip{background:var(--n05);border-color:var(--n10);color:var(--n40)}
html[data-theme="dark"] .stack-card{background:var(--n05);border-color:var(--n10)}
html[data-theme="dark"] .sc-c{background:#000;border-color:#000}
html[data-theme="dark"] .pain-card,
html[data-theme="dark"] .case,
html[data-theme="dark"] .founder,
html[data-theme="dark"] .phase-panel,
html[data-theme="dark"] .book-card,
html[data-theme="dark"] .art-card,
html[data-theme="dark"] .cfg-mod{background:var(--n05);border-color:var(--n10)}
html[data-theme="dark"] .phase-tabs{background:var(--n03)}
html[data-theme="dark"] .phase-right,
html[data-theme="dark"] .phase-nav,
html[data-theme="dark"] .founder-foot{background:var(--n03)}
html[data-theme="dark"] .case-body h3,
html[data-theme="dark"] .founder-name,
html[data-theme="dark"] .phase-left h3{color:var(--navy)}
html[data-theme="dark"] .slot,
html[data-theme="dark"] .book-field input,
html[data-theme="dark"] .book-field select,
html[data-theme="dark"] .book-field textarea{background:var(--n05);color:var(--navy);border-color:var(--n10)}
html[data-theme="dark"] .cfg-mod.on{background:rgba(0,166,160,.10)}
html[data-theme="dark"] .logo .d{color:var(--navy)}
html[data-theme="dark"] footer{background:#05070F}
html[data-theme="dark"] .cc-banner{background:var(--n05);border-color:var(--n10)}
html[data-theme="dark"] .faq-q .ic{border-color:var(--n10)}
html[data-theme="dark"] .modal{background:var(--n05)}

/* Theme toggle button */
.theme-toggle{
  background:none;border:1px solid var(--n10);border-radius:100px;
  width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--n40);transition:all .2s;margin-right:8px;
}
.theme-toggle:hover{color:var(--or);border-color:var(--or)}
.theme-toggle svg{width:18px;height:18px}