/* ============================================================
   Deciphai — shared styles for the inner pages (about, privacy, terms, compare).
   Same tokens, navigator, sky and lunar footer as index.html.

   The two styles have names:
     LUNAR NIGHT  (dark, the default)  — deep space, violet and sky-blue starlight.
     LUNAR DAY    (light)              — daylight: a baby-powder page under a pale blue sky
                                         with a low sun; white cards, neutral shadows,
                                         violet used only as an accent.
   ============================================================ */
/* ---------- Lunar Night ---------- */
:root, .space{
  --bg-0:#050509; --bg-1:#0a0a12;
  --card-border:rgba(255,255,255,.09);
  --card-border-hover:rgba(167,139,250,.45);
  --ink-0:#f5f4ff; --ink-1:#c9c7dc; --ink-2:#9d9bb0; --ink-3:#6b697e;
  --violet-300:#c4b5fd; --violet-400:#a78bfa; --violet-500:#8b5cf6; --violet-600:#7c3aed; --violet-700:#6d28d9;
  --blue-300:#93c5fd; --blue-400:#38bdf8;
  --leaf:#86efac;
  --good:#34d399; --bad:#f87171;
  --grad-brand:linear-gradient(135deg,var(--violet-400),var(--violet-700));
  --grad-text:linear-gradient(90deg,var(--violet-400) 0%,var(--ink-0) 55%,var(--blue-300) 100%);
  --grad-leaf:linear-gradient(90deg,var(--leaf),var(--blue-300));
  --surface:rgba(255,255,255,.025);
  --surface-2:rgba(255,255,255,.04);
  --panel:linear-gradient(180deg,rgba(24,24,36,.92),rgba(10,10,16,.92));
  --nav-bg:rgba(5,5,9,.75);
  --menu-bg:rgba(8,8,14,.97);
  --card-shadow:none;
  --glow-blend:screen; --glow-scale:1;
  --star:200,190,255; --star-alpha:1;
  --glow-1:rgba(139,92,246,.55); --glow-2:rgba(56,189,248,.35); --tint:139,92,246;
  --nav-shadow:0 16px 40px -18px rgba(0,0,0,.5);
  --sky:linear-gradient(180deg,var(--bg-0),var(--bg-1));
  --solid-surface:#0c0c15; --warn:#fbbf24;
  --r-md:16px; --r-lg:24px; --r-pill:999px;
  --ease:cubic-bezier(.16,1,.3,1);
  --max:1160px;
}
/* ---------- Lunar Day ---------- */
:root[data-theme="light"]{
  --page:254,254,250;                                  /* baby powder */
  --bg-0:rgb(var(--page)); --bg-1:rgb(var(--page));
  --sky:linear-gradient(180deg,#e3effc 0,#f1f7fc 180px,rgb(var(--page)) 430px);   /* daylight overhead */
  --card-border:rgba(22,28,48,.09);
  --card-border-hover:rgba(109,40,217,.34);
  --ink-0:#14151f; --ink-1:#40424f; --ink-2:#666876; --ink-3:#9496a3;
  --violet-300:#6d28d9; --blue-300:#0b62a0;
  --leaf:#15803d;
  --good:#15803d; --bad:#c62828;
  --grad-text:linear-gradient(90deg,#6d28d9 0%,#14151f 55%,#0b62a0 100%);
  --grad-leaf:linear-gradient(90deg,#15803d,#0b62a0);
  --surface:#ffffff;
  --surface-2:rgba(22,28,48,.04);
  --panel:linear-gradient(180deg,#ffffff,#f8f8f3);
  --nav-bg:rgba(255,255,253,.8);
  --menu-bg:rgba(255,255,253,.97);
  --card-shadow:0 1px 2px rgba(22,28,48,.05), 0 18px 40px -22px rgba(22,28,48,.22);
  --glow-blend:normal; --glow-scale:1.5;
  --star:120,150,190; --star-alpha:.28;                /* stars become motes in the light */
  --glow-1:rgba(255,196,96,.6); --glow-2:rgba(116,184,248,.45);    /* the sun, and the sky */
  --tint:236,180,84;                                               /* sunlight instead of violet */
  --nav-shadow:0 14px 34px -20px rgba(22,28,48,.3);
  --solid-surface:#ffffff; --warn:#a66a00;
}
:root[data-theme="light"] .space{
  --ink-0:#14151f; --ink-1:#3a3d4b; --ink-2:#5d6070;
  --violet-300:#6d28d9; --blue-300:#0b62a0; --leaf:#15803d;
  --card-border:rgba(22,28,48,.16);
  --solid-bg:#14151f; --solid-fg:#ffffff; --solid-shadow:0 14px 34px -14px rgba(20,21,31,.5);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:110px; background:var(--bg-0); }
body{
  margin:0; color:var(--ink-1); background:var(--bg-0);
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif; font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
  transition:background-color .5s ease, color .5s ease;
}
h1,h2,h3,p,ul,ol{ margin:0; }
h1,h2,h3{ color:var(--ink-0); font-weight:700; letter-spacing:-.03em; line-height:1.1; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
img,svg{ display:block; max-width:100%; }
::selection{ background:var(--violet-600); color:#fff; }
:focus-visible{ outline:2px solid var(--violet-300); outline-offset:4px; border-radius:6px; }

.sky{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; background:var(--sky); }
.sky canvas{ position:absolute; inset:0; width:100%; height:100%; }
.sky__glow{ position:absolute; border-radius:50%; filter:blur(120px); mix-blend-mode:var(--glow-blend); }
.sky__glow--1{ width:700px; height:700px; top:-260px; left:-200px; opacity:calc(.3 * var(--glow-scale)); background:radial-gradient(circle,var(--glow-1),transparent 70%); }
.sky__glow--2{ width:800px; height:800px; top:30%; right:-340px; opacity:calc(.2 * var(--glow-scale)); background:radial-gradient(circle,var(--glow-2),transparent 70%); }
/* Lunar Day: the sky belongs to the top of the page and scrolls away with it. */
:root[data-theme="light"] .sky{ position:absolute; bottom:auto; height:100vh; min-height:760px; }
:root[data-theme="light"] .sky__glow--2{ top:-320px; right:-260px; }
main,footer{ position:relative; z-index:1; }

.wrap{ max-width:var(--max); margin:0 auto; padding:0 24px; }
.eyebrow{ display:inline-flex; align-items:center; gap:9px; font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--violet-300); }
.eyebrow::before{ content:''; width:6px; height:6px; border-radius:50%; background:currentColor; box-shadow:0 0 12px currentColor; }
.grad{ background:var(--grad-text); -webkit-background-clip:text; background-clip:text; color:transparent; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 28px; border-radius:var(--r-pill);
  font-weight:600; font-size:1rem; white-space:nowrap; border:1px solid transparent;
  transition:transform .45s var(--ease), box-shadow .45s var(--ease), border-color .35s ease, background-color .35s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn--primary{ background:var(--grad-brand); color:#fff; box-shadow:0 8px 24px -8px rgba(124,58,237,.7); }
.btn--primary:hover{ box-shadow:0 14px 36px -8px rgba(124,58,237,.95); }
.btn--quiet{ color:var(--ink-1); border-color:var(--card-border); background:var(--surface-2); }
.btn--quiet:hover{ border-color:var(--card-border-hover); color:var(--ink-0); }

.card{
  position:relative; overflow:hidden; padding:28px 26px; border-radius:var(--r-lg);
  border:1px solid var(--card-border); background:var(--surface); backdrop-filter:blur(6px); box-shadow:var(--card-shadow);
  transition:transform .5s var(--ease), border-color .4s ease, background-color .5s ease;
}
.card:hover{ transform:translateY(-6px); border-color:var(--card-border-hover); }
.card h3{ font-size:1.15rem; margin-bottom:8px; }
.card p{ font-size:.96rem; color:var(--ink-2); }
.ico{ width:46px; height:46px; border-radius:14px; display:grid; place-items:center; margin-bottom:18px; background:rgba(139,92,246,.12); border:1px solid rgba(139,92,246,.25); color:var(--violet-300); }
.ico svg{ width:22px; height:22px; }

/* ---------- Navigator (same as index.html) ---------- */
.nav{ position:fixed; top:0; left:0; right:0; z-index:50; padding:20px 24px; }
.nav__inner{
  max-width:var(--max); margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:8px 8px 8px 20px; border-radius:var(--r-pill); border:1px solid transparent;
  transition:max-width .5s var(--ease), padding .5s var(--ease), background-color .4s ease, border-color .4s ease, box-shadow .4s ease;
}
.nav.scrolled .nav__inner{
  max-width:900px; padding:6px 6px 6px 18px; background:var(--nav-bg);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-color:var(--card-border); box-shadow:var(--nav-shadow);
}
.nav__logo{ flex-shrink:0; display:block; }
.nav__logo img{ height:50px; width:auto; margin-left:-20px; transition:height .5s var(--ease); }
.nav.scrolled .nav__logo img{ height:40px; }
.nav__links{ display:flex; gap:22px; font-size:.9rem; color:var(--ink-1); white-space:nowrap; }
.nav__links a[aria-current="page"]{ color:var(--ink-0); }
.nav__links a{ position:relative; padding:4px 0; transition:color .25s; }
.nav__links a::after{ content:''; position:absolute; left:0; bottom:-2px; width:0; height:1.5px; background:var(--grad-brand); transition:width .3s var(--ease); }
.nav__links a:hover{ color:var(--ink-0); }
.nav__links a:hover::after{ width:100%; }
.nav__actions{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
.nav .btn{ padding:11px 22px; font-size:.92rem; }
.theme-toggle{
  position:relative; width:40px; height:40px; border-radius:50%; border:1px solid var(--card-border); background:var(--surface-2);
  margin-right:4px; transition:transform .35s var(--ease), border-color .35s var(--ease);
}
.theme-toggle:hover{ transform:translateY(-2px); border-color:var(--card-border-hover); }
.theme-toggle svg{ position:absolute; top:50%; left:50%; width:18px; height:18px; color:var(--ink-1); transition:opacity .5s var(--ease), transform .6s var(--ease); }
.theme-toggle .sun{ opacity:0; transform:translate(-50%,-50%) scale(.4) rotate(-90deg); }
.theme-toggle .moon-i{ opacity:1; transform:translate(-50%,-50%) scale(1) rotate(0deg); }
:root[data-theme="light"] .theme-toggle .sun{ opacity:1; transform:translate(-50%,-50%) scale(1) rotate(0deg); }
:root[data-theme="light"] .theme-toggle .moon-i{ opacity:0; transform:translate(-50%,-50%) scale(.4) rotate(90deg); }
.nav__burger{ display:none; }
@media (max-width:1080px){
  .nav{ padding:14px 14px; }
  .nav__actions .btn{ display:none; }
  .nav__burger{ display:flex; flex-direction:column; justify-content:center; gap:5px; width:44px; height:44px; padding:0 11px; margin-right:4px; }
  .nav__burger span{ width:22px; height:2px; background:var(--ink-0); border-radius:2px; transition:transform .3s, opacity .3s; }
  .nav__burger.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .nav__burger.is-open span:nth-child(2){ opacity:0; }
  .nav__burger.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
  .nav__links{
    position:fixed; top:0; right:0; bottom:0; width:min(320px,84vw); z-index:-1;
    flex-direction:column; gap:6px; padding:110px 32px 32px; font-size:1.15rem;
    background:var(--menu-bg); backdrop-filter:blur(18px); border-left:1px solid var(--card-border);
    transform:translateX(100%); transition:transform .5s var(--ease);
  }
  .nav__links a{ padding:12px 0; }
  .nav__links--open{ transform:translateX(0); }
}

/* ---------- Legal page ---------- */
.legal-hero{ padding:170px 0 56px; text-align:center; }
.legal-hero h1{ font-size:clamp(2.4rem,6vw,4.4rem); font-weight:800; letter-spacing:-.035em; margin:18px 0 20px; }
.legal-hero p{ max-width:640px; margin:0 auto; font-size:1.12rem; color:var(--ink-1); }
.legal-hero__meta{ display:inline-flex; flex-wrap:wrap; justify-content:center; gap:8px 18px; margin-top:26px; padding:9px 20px; border-radius:var(--r-pill); border:1px solid var(--card-border); background:var(--surface-2); font-size:.88rem; color:var(--ink-2); }
.legal-hero__meta b{ color:var(--ink-0); font-weight:600; }

.glance{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-bottom:64px; }
@media (max-width:860px){ .glance{ grid-template-columns:1fr; } }

.legal{ display:grid; grid-template-columns:250px minmax(0,1fr); gap:56px; align-items:start; padding-bottom:120px; }
.toc{ position:sticky; top:110px; max-height:calc(100vh - 140px); overflow:auto; padding-right:6px; }
.toc h2{ font-size:.74rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); margin-bottom:14px; }
.toc ol{ list-style:none; padding:0; counter-reset:toc; border-left:1px solid var(--card-border); }
.toc li{ counter-increment:toc; }
.toc a{ display:block; margin-left:-1px; padding:7px 0 7px 16px; border-left:2px solid transparent; font-size:.92rem; line-height:1.35; color:var(--ink-2); transition:color .25s, border-color .25s; }
.toc a::before{ content:counter(toc,decimal-leading-zero) "  "; font-size:.74rem; letter-spacing:.08em; color:var(--ink-3); }
.toc a:hover{ color:var(--ink-0); }
.toc a.is-active{ color:var(--ink-0); border-left-color:var(--violet-400); }

.doc{ padding:48px 52px; border-radius:var(--r-lg); border:1px solid var(--card-border); background:var(--surface); backdrop-filter:blur(6px); box-shadow:var(--card-shadow); counter-reset:sec; }
.doc section{ padding:0 0 38px; margin-bottom:38px; border-bottom:1px solid var(--card-border); counter-increment:sec; }
.doc section:last-child{ padding-bottom:0; margin-bottom:0; border-bottom:0; }
.doc h2{ font-size:1.55rem; margin-bottom:16px; display:flex; align-items:baseline; gap:14px; }
.doc h2::before{ content:counter(sec,decimal-leading-zero); flex:none; font-size:.78rem; font-weight:600; letter-spacing:.12em; color:var(--violet-300); }
.doc h3{ font-size:1.08rem; letter-spacing:-.01em; margin:22px 0 8px; }
.doc p{ margin-bottom:14px; color:var(--ink-1); }
.doc p:last-child{ margin-bottom:0; }
.doc ul{ list-style:none; padding:0; margin:0 0 14px; display:grid; gap:9px; }
.doc li{ position:relative; padding-left:24px; color:var(--ink-1); }
.doc li::before{ content:''; position:absolute; left:4px; top:.72em; width:6px; height:6px; border-radius:50%; background:var(--violet-400); }
.doc b, .doc strong{ color:var(--ink-0); font-weight:600; }
.doc a{ color:var(--violet-300); border-bottom:1px solid transparent; transition:border-color .25s; }
.doc a:hover{ border-bottom-color:currentColor; }
.note{ margin:18px 0; padding:16px 20px; border-radius:var(--r-md); border:1px solid var(--card-border); border-left:3px solid var(--violet-400); background:var(--surface-2); font-size:.96rem; }
/* a detail the company still has to fill in before publishing */
.todo{ padding:1px 7px; border-radius:6px; border:1px dashed var(--bad); color:var(--bad); font-size:.92em; font-weight:600; white-space:nowrap; }
@media (max-width:980px){
  .legal{ grid-template-columns:1fr; gap:28px; }
  .toc{ position:static; max-height:none; padding:22px 24px; border-radius:var(--r-lg); border:1px solid var(--card-border); background:var(--surface); }
}
@media (max-width:640px){ .doc{ padding:30px 22px; } body{ font-size:16px; } .legal-hero{ padding-top:140px; } }

/* ---------- Lunar footer (same as index.html) ---------- */
.space{
  position:relative; z-index:1; color:var(--ink-1); overflow:hidden; border-radius:44px 44px 0 0;
  background-color:#04040a;
}
footer{
  position:relative; padding:44px 0 30px; font-size:.92rem; color:#c9c7dc;
  background:
    radial-gradient(ellipse 150px 26px at 14% 34px, rgba(0,0,0,.34), transparent 70%),
    radial-gradient(ellipse 90px 15px at 71% 96px, rgba(0,0,0,.3), transparent 70%),
    radial-gradient(ellipse 210px 34px at 88% 210px, rgba(0,0,0,.3), transparent 70%),
    radial-gradient(ellipse 120px 20px at 36% 250px, rgba(0,0,0,.26), transparent 70%),
    linear-gradient(180deg,#3b3942 0%,#25242b 34%,#131218 72%,#08080c 100%);
}
footer::before{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
.foot{ position:relative; display:grid; grid-template-columns:1.5fr repeat(3,1fr); gap:40px; padding-bottom:40px; }
.foot__brand img{ height:64px; width:auto; margin-left:-26px; }
.foot__brand p{ margin-top:10px; max-width:300px; color:#a9a7ba; font-size:.92rem; }
.foot h4{ margin:0 0 14px; font-size:.74rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#8f8da2; }
.foot__col a{ display:block; padding:5px 0; color:#d6d4e6; transition:color .25s, transform .35s var(--ease); }
.foot__col a:hover, .foot__col a[aria-current="page"]{ color:#fff; transform:translateX(4px); }
.foot__bottom{ position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 30px; padding-top:22px; border-top:1px solid rgba(255,255,255,.1); font-size:.86rem; color:#a9a7ba; }
.foot__bottom > span:last-child{ color:#86efac; }
@media (max-width:820px){ .foot{ grid-template-columns:1fr 1fr; gap:30px; } .foot__brand{ grid-column:1/-1; } .space{ border-radius:28px 28px 0 0; } }


/* ---------- Logo: white at night, the original purple by day ---------- */
.logo--day{ display:none !important; }
:root[data-theme="light"] .logo--night{ display:none !important; }
:root[data-theme="light"] .logo--day{ display:block !important; }
.nav__logo img, .foot__brand img{ width:auto; max-width:none; object-fit:contain; flex:none; }
.nav__logo img.logo--day{ height:44px; margin-left:-2px; }
.nav.scrolled .nav__logo img.logo--day{ height:36px; }
.foot__brand img{ margin-left:-9px; }                 /* the white logo file has 9px of empty space on its left */
.foot__brand img.logo--day{ height:54px; margin-left:0; }

/* ---------- Lunar Day footer: sunlit moondust, dark ink ---------- */
:root[data-theme="light"] footer{
  color:#45424d;
  background:
    radial-gradient(ellipse 150px 26px at 14% 34px, rgba(0,0,0,.07), transparent 70%),
    radial-gradient(ellipse 90px 15px at 71% 96px, rgba(0,0,0,.06), transparent 70%),
    radial-gradient(ellipse 210px 34px at 88% 210px, rgba(0,0,0,.06), transparent 70%),
    radial-gradient(ellipse 120px 20px at 36% 250px, rgba(0,0,0,.05), transparent 70%),
    linear-gradient(180deg,#d3d0c8 0%,#dbd8d1 40%,#e6e3dd 100%);
}
:root[data-theme="light"] .foot__brand p{ color:#5d5a66; }
:root[data-theme="light"] .foot h4{ color:#7a7783; }
:root[data-theme="light"] .foot__col a{ color:#2a2833; }
:root[data-theme="light"] .foot__col a:hover, :root[data-theme="light"] .foot__col a[aria-current="page"]{ color:#6d28d9; }
:root[data-theme="light"] .foot__bottom{ color:#5d5a66; border-top-color:rgba(22,28,48,.14); }
:root[data-theme="light"] .foot__bottom > span:last-child{ color:#15803d; }
:root[data-theme="light"] .foot__bottom > span:only-child{ color:#5d5a66; }
:root[data-theme="light"] .space{ background-color:#d3d0c8; }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}
@media print{
  .sky,.nav,.toc,.space,.glance{ display:none !important; }
  body{ background:#fff; color:#000; }
  .legal{ display:block; padding:0; } .doc{ border:0; padding:0; background:none; }
  .legal-hero{ padding:0 0 24px; text-align:left; }
}