/* Semantic light + dark tokens.
   Existing ink/paper/muted aliases keep current components working. */

:root{
  --ink:var(--background);
  --paper:var(--text-primary);
  --muted:var(--text-muted);
  --muted-2:var(--text-secondary);
  --text:var(--text-primary);
  --line:var(--border);
  --line-strong:var(--border-strong);
  --bg:var(--background);
  --card:var(--surface);
}

:root,
html[data-theme="dark"]{
  --background:#070504;
  --surface:#12100d;
  --surface-2:rgba(255,246,236,.045);
  --border:rgba(255,246,236,.14);
  --border-strong:rgba(255,246,236,.28);
  --text-primary:#fff8f0;
  --text-secondary:#eadcc8;
  --text-muted:#cbb8a0;
  --text-on-accent:#1a1008;
  --text-on-light:#16110c;
  --text-accent:#ffb060;
  --chip:#fff6ec;
  --chip-ink:#16110c;
  --orange-3:var(--text-accent);
  --accent:#ff7a00;
  --accent-2:#ff9a2a;
  --accent-soft:rgba(255,122,0,.1);
  --header-scrolled:rgba(7, 5, 4, .86);
  --shadow-device:0 28px 64px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.06), 0 0 48px rgba(255,122,0,.08);
  --device-bezel:#1a1816;
  --device-screen:#100e0c;
  --bg2:#110c08;
  --bg3:#1c140c;
  --card2:#18140f;
  --card3:#211910;
  --shadow:0 22px 50px rgba(0,0,0,.42);
  --shadow-soft:0 12px 28px rgba(0,0,0,.26);
  --shadow-card:0 16px 40px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.045);
  --glow:rgba(255,122,0,.16);
  --focus-ring:0 0 0 3px #070504, 0 0 0 6px #ffc87a;
  color-scheme:dark;
}

html[data-theme="light"]{
  --background:#f7efe4;
  --surface:#fffaf3;
  --surface-2:rgba(22, 17, 12, .045);
  --border:rgba(22, 17, 12,.12);
  --border-strong:rgba(22, 17, 12,.22);
  --text-primary:#16110c;
  --text-secondary:#3a3129;
  --text-muted:#4f4338;
  --text-on-accent:#1a1008;
  --text-on-light:#16110c;
  --text-accent:#ad4a00;
  --chip:#16110c;
  --chip-ink:#fff8f0;
  --orange-3:var(--text-accent);
  --accent:#ff7a00;
  --accent-2:#e56b00;
  --accent-soft:rgba(255, 122, 0, .1);
  --header-scrolled:rgba(247, 239, 228, .9);
  --shadow-device:0 22px 48px rgba(22, 17, 12, .12), 0 0 0 1px rgba(22, 17, 12, .07), 0 0 36px rgba(255,122,0,.08);
  --device-bezel:#2a2622;
  --device-screen:#171411;
  --bg2:#fff6ea;
  --bg3:#ffe8cc;
  --card2:#fffdf8;
  --card3:#fff4e6;
  --shadow:0 16px 36px rgba(22, 17, 12, .08);
  --shadow-soft:0 10px 22px rgba(22, 17, 12, .06);
  --shadow-card:0 14px 30px rgba(22, 17, 12, .07), 0 0 0 1px rgba(22, 17, 12, .05);
  --glow:rgba(255,122,0,.1);
  --focus-ring:0 0 0 3px #f7efe4, 0 0 0 6px #ff9d2e;
  color-scheme:light;
}

@media(prefers-color-scheme:light){
  :root:not([data-theme]){
    --background:#f7efe4;
    --surface:#fffaf3;
    --surface-2:rgba(22, 17, 12, .045);
    --border:rgba(22, 17, 12,.12);
    --border-strong:rgba(22, 17, 12,.22);
    --text-primary:#16110c;
    --text-secondary:#3a3129;
    --text-muted:#4f4338;
    --text-on-accent:#1a1008;
    --text-on-light:#16110c;
    --text-accent:#ad4a00;
    --chip:#16110c;
    --chip-ink:#fff8f0;
    --orange-3:var(--text-accent);
    --accent:#ff7a00;
    --accent-2:#e56b00;
    --accent-soft:rgba(255, 122, 0, .1);
    --header-scrolled:rgba(247, 239, 228, .9);
    --shadow-device:0 22px 48px rgba(22, 17, 12, .12), 0 0 0 1px rgba(22, 17, 12, .07), 0 0 36px rgba(255,122,0,.08);
    --device-bezel:#2a2622;
    --device-screen:#171411;
    --bg2:#fff6ea;
    --bg3:#ffe8cc;
    --card2:#fffdf8;
    --card3:#fff4e6;
    --shadow:0 16px 36px rgba(22, 17, 12, .08);
    --shadow-soft:0 10px 22px rgba(22, 17, 12, .06);
    --shadow-card:0 14px 30px rgba(22, 17, 12, .07), 0 0 0 1px rgba(22, 17, 12, .05);
    --glow:rgba(255,122,0,.1);
    --focus-ring:0 0 0 3px #f7efe4, 0 0 0 6px #ff9d2e;
    color-scheme:light;
  }

  :root:not([data-theme]) .theme-toggle .theme-toggle__sun{ display:none; }
  :root:not([data-theme]) .theme-toggle .theme-toggle__moon{ display:block; }

  :root:not([data-theme]) .brand-lockup__img--light{ opacity:1; }
  :root:not([data-theme]) .brand-lockup__img--dark{ opacity:0; }
}

html,
body,
html[data-theme="light"] body,
:root:not([data-theme]) body{
  background:var(--background);
  color:var(--text-primary);
}

html[data-theme="light"] .home-hero .device,
html[data-theme="light"] .device-frame,
html[data-theme="light"] .svc .device-frame{
  box-shadow:var(--shadow-device);
}

html[data-theme="light"] .btn{
  color:var(--text-on-accent);
}

html[data-theme="light"] .plan-card.is-featured,
html[data-theme="light"] .price-card.highlight{
  border-color:rgba(255, 122, 0, .4);
  background:var(--accent-soft);
}

html[data-theme="light"] .need-pick:has(input:checked),
html[data-theme="light"] .process-nav button.is-active{
  background:var(--accent-soft);
  border-color:rgba(255, 122, 0, .35);
}

html[data-theme="light"] .svc-feat__btn[aria-selected="true"],
html[data-theme="light"] .svc-picks button.is-active,
html[data-theme="light"] .work-stage__picks button.is-active{
  color:var(--paper);
}

html[data-theme="light"] .device-chrome,
html[data-theme="light"] .svc-browser__bar{
  color:var(--muted);
}

.brand-lockup__img--light{ opacity:0; }
.brand-lockup__img--dark{ opacity:1; }

html[data-theme="light"] .brand-lockup__img--light{ opacity:1; }
html[data-theme="light"] .brand-lockup__img--dark{ opacity:0; }
html[data-theme="dark"] .brand-lockup__img--light{ opacity:0; }
html[data-theme="dark"] .brand-lockup__img--dark{ opacity:1; }

body::before{
  content:"";
  display:block;
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(ellipse 52% 42% at 12% 0%, var(--glow), transparent 58%),
    radial-gradient(ellipse 40% 36% at 92% 18%, rgba(255,122,0,.07), transparent 55%),
    radial-gradient(ellipse 70% 50% at 50% 115%, rgba(0,0,0,.35), transparent 62%);
}

body::after{
  content:"";
  display:block;
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

html[data-theme="light"] body::before{
  background:
    radial-gradient(ellipse 55% 40% at 8% 0%, rgba(255,122,0,.08), transparent 58%),
    radial-gradient(ellipse 40% 30% at 90% 10%, rgba(255,154,42,.06), transparent 52%),
    radial-gradient(ellipse 80% 40% at 50% 100%, rgba(22,17,12,.04), transparent 60%);
}

html[data-theme="light"] body::after{
  opacity:.02;
}

@media(prefers-color-scheme:light){
  :root:not([data-theme]) body::before{
    background:
      radial-gradient(ellipse 55% 40% at 8% 0%, rgba(255,122,0,.08), transparent 58%),
      radial-gradient(ellipse 40% 30% at 90% 10%, rgba(255,154,42,.06), transparent 52%),
      radial-gradient(ellipse 80% 40% at 50% 100%, rgba(22,17,12,.04), transparent 60%);
  }

  :root:not([data-theme]) body::after{ opacity:.02; }
}

/* Global text roles — last-loaded, so leftover hard-coded colours lose. */
h1, h2, h3, h4, h5, h6{
  color:var(--text-primary);
}

.muted,
.lead,
.eyebrow,
.kicker,
.hero p,
.page-hero .lead{
  color:var(--text-muted);
}

strong, b{
  color:inherit;
}

label,
legend{
  color:var(--text-primary);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
select,
textarea{
  color:var(--text-primary);
  background:var(--surface);
  border-color:var(--border);
  caret-color:var(--text-primary);
}

input::placeholder,
textarea::placeholder{
  color:var(--text-muted);
  opacity:1;
}

select option{
  background:var(--surface);
  color:var(--text-primary);
}

.btn,
a.btn,
.skip-link,
.site-nav__cta,
.site-nav > a.site-nav__cta,
.site-nav > a.site-nav__cta:hover,
.site-nav [aria-current="page"].site-nav__cta,
.nav-screen__cta{
  color:var(--text-on-accent);
}

.btn-ghost,
a.btn-ghost{
  color:var(--text-primary);
}

.site-nav > a,
.site-nav__group > a,
.site-footer a,
.site-footer__bottom,
.site-footer__bottom a{
  color:var(--text-muted);
}

.site-nav > a:hover,
.site-nav__group > a:hover,
.site-nav [aria-current="page"]:not(.site-nav__cta),
.site-footer a:hover{
  color:var(--text-primary);
}

.apple-seg{
  background:var(--surface-2);
  border-color:var(--border);
}

.apple-seg__btn{
  color:var(--text-muted);
}

.apple-seg__btn:hover{
  color:var(--text-primary);
}

.apple-seg__btn.is-active{
  color:var(--chip-ink);
  background:var(--chip);
}

.badge--concept,
.process-num,
.about-process__num,
.home-hero__display em{
  color:var(--text-accent);
}

.theme-toggle{
  color:var(--text-primary);
}

.notice{
  color:var(--text-secondary);
  background:var(--surface);
  border-color:var(--border);
}

.notice.success{
  color:var(--text-primary);
  background:var(--surface-2);
  border-color:var(--border-strong);
}

.notice.error{
  color:var(--text-primary);
  border-color:rgba(176, 62, 48, .4);
  background:rgba(176, 62, 48, .1);
}

.btn:disabled,
button.btn:disabled{
  opacity:.62;
  cursor:wait;
  transform:none;
}

.text-link{
  color:var(--text-primary);
  border-bottom-color:var(--border-strong);
}

.offer-card{
  transition:border-color .25s var(--ease, ease), transform .25s var(--ease, ease);
}

.offer-card a{
  color:var(--text-accent);
}

.offer-links{
  margin-top:auto;
  display:flex;
  flex-wrap:wrap;
  gap:.7rem 1.15rem;
}

.offer-card .offer-links a{
  margin-top:0;
}

.offer-card a:hover{
  color:var(--text-primary);
}

.offer-card a:focus-visible,
.need-row__actions a:focus-visible,
.work-line:focus-visible{
  outline:none;
  box-shadow:var(--focus-ring);
}

@media (hover:hover) and (pointer:fine){
  .offer-card:hover{
    border-color:var(--border-strong);
    transform:translateY(-2px);
  }
}

@media(prefers-reduced-motion:reduce){
  html,
  body,
  .site-header,
  .theme-toggle,
  .offer-card{
    transition:none;
    transform:none;
  }
}