/* Vychara — shared styles. Single stylesheet, no build, no dependencies. */
@font-face{
  font-family:"Space Grotesk";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/assets/fonts/space-grotesk-latin.woff2") format("woff2");
}
@font-face{
  font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;
  src:url("/assets/fonts/inter-latin.woff2") format("woff2");
}
:root{
  --indigo:#1F3864;
  --indigo-2:#2A4C82;
  --ink:#1B2333;
  --saffron:#B24E0C;
  --saffron-soft:#E0762B;
  --paper:#FBF9F5;
  --card:#FFFFFF;
  --line:#E7E1D6;
  --muted:#5F6675;
  --deep:#16233E;
  --shadow:0 18px 45px -30px rgba(22,35,62,.5);
  --ease:cubic-bezier(.2,.7,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{
  min-width:320px;overflow-x:clip;background:var(--paper);color:var(--ink);
  font-family:"Inter",system-ui,sans-serif;font-size:1.02rem;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
::selection{background:var(--saffron);color:#fff}
h1,h2,h3,h4,.brand,.eyebrow,.btn,.pill,nav a,.sec-tag,.num,.case-tag,.cap-h{font-family:"Space Grotesk",sans-serif}
a{color:inherit}
:focus-visible{outline:3px solid var(--saffron);outline-offset:3px;border-radius:4px}
.wrap{max-width:70rem;margin:0 auto;padding:0 1.6rem}
.narrow{max-width:48rem;margin:0 auto;padding:0 1.6rem}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;z-index:100;top:.7rem;left:.7rem;transform:translateY(-180%);background:var(--deep);color:#fff;padding:.7rem 1rem;border-radius:8px;text-decoration:none;font-family:"Space Grotesk",sans-serif;font-weight:600;transition:transform .16s var(--ease)}
.skip-link:focus{transform:translateY(0)}

/* ---------- nav ---------- */
header{position:sticky;top:0;z-index:50;background:rgba(251,249,245,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:4.35rem}
.brand{font-weight:600;font-size:1.3rem;letter-spacing:-.01em;color:var(--indigo);text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}
.brand .dot{width:7px;height:7px;border-radius:50%;background:var(--saffron);display:inline-block;margin-top:.55rem}
nav.links{display:flex;gap:2rem;align-items:center}
nav.links a{font-size:.9rem;font-weight:500;color:var(--ink);text-decoration:none;opacity:.85;transition:color .16s var(--ease),opacity .16s var(--ease)}
nav.links a:hover{opacity:1;color:var(--saffron)}
nav.links a.btn,nav.links a.btn:hover{color:#fff;opacity:1}
.hamburger{display:none;width:44px;height:44px;align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer;background:transparent;border:0;border-radius:8px}
.hamburger span{width:23px;height:2px;background:var(--indigo);display:block;transition:transform .16s var(--ease),opacity .16s var(--ease)}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;
  background:var(--indigo);color:#fff;text-decoration:none;
  padding:.7rem 1.25rem;border-radius:8px;font-size:.9rem;font-weight:500;
  border:1.5px solid var(--indigo);transition:background-color .16s var(--ease),border-color .16s var(--ease),color .16s var(--ease),transform .16s var(--ease),box-shadow .16s var(--ease);
}
.btn:hover{background:var(--deep);border-color:var(--deep);transform:translateY(-1px);box-shadow:0 8px 18px -12px rgba(22,35,62,.8)}
.btn.ghost{background:transparent;color:var(--indigo)}
.btn.ghost:hover{background:var(--indigo);color:#fff}
.btn.lg{padding:.95rem 1.7rem;font-size:1rem;border-radius:9px}
.btn .arw{transition:transform .16s var(--ease)}
.btn:hover .arw{transform:translateX(3px)}
.textlink{color:var(--indigo);font-weight:500;text-decoration:none;border-bottom:1.5px solid var(--line)}
.textlink:hover{color:var(--saffron);border-color:var(--saffron)}

@media(max-width:760px){
  .hamburger{display:flex}
  nav.links{position:absolute;top:4.35rem;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 16px 32px -26px rgba(22,35,62,.65);flex-direction:column;align-items:flex-start;gap:0;padding:.5rem 1.1rem 1rem;display:none}
  nav.links.is-open{display:flex}
  nav.links a{padding:.72rem .5rem;width:100%;font-size:1rem}
  nav.links .btn{margin-top:.35rem;color:#fff;opacity:1}
}

/* ---------- hero ---------- */
.hero{padding:6rem 0 4.5rem;position:relative;overflow:hidden;background:radial-gradient(circle at 88% 42%,rgba(31,56,100,.06),transparent 30rem)}
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;color:var(--saffron);font-weight:600;margin-bottom:1.5rem}
.eyebrow::before{content:"";width:26px;height:1.5px;background:var(--saffron)}
h1{font-size:clamp(2.4rem,6vw,4rem);line-height:1.05;letter-spacing:-.03em;color:var(--indigo);font-weight:600;max-width:16ch;text-wrap:balance}
h1 em{font-style:normal;color:var(--saffron)}
.hero p.sub{font-size:clamp(1.1rem,2.2vw,1.35rem);color:var(--ink);max-width:40rem;margin:1.6rem 0 2.4rem;line-height:1.5}
.hero-cta{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.hero-cta .tertiary{font-size:.92rem;color:var(--muted);text-decoration:none;border-bottom:1px solid var(--line)}
.hero-cta .tertiary:hover{color:var(--saffron);border-color:var(--saffron)}
.kolam{position:absolute;right:max(-3rem,calc((100vw - 72rem)/2));top:3.2rem;width:21rem;height:21rem;opacity:.44;pointer-events:none}
@media(max-width:900px){.kolam{display:none}}

/* ---------- credibility strip ---------- */
.cred{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--card)}
.cred .grid{display:grid;grid-template-columns:repeat(4,1fr)}
.cred-item{padding:1.5rem 1.4rem;border-right:1px solid var(--line);display:flex;gap:.7rem;align-items:flex-start}
.cred-item:last-child{border-right:0}
.cred-item .tick{flex:none;width:14px;height:14px;margin-top:.3rem;color:var(--saffron)}
.cred-item p{font-size:.92rem;color:var(--ink);line-height:1.45}
@media(max-width:820px){
  .cred .grid{grid-template-columns:1fr 1fr}
  .cred-item:nth-child(2){border-right:0}
  .cred-item:nth-child(1),.cred-item:nth-child(2){border-bottom:1px solid var(--line)}
}
@media(max-width:520px){
  .cred .grid{grid-template-columns:1fr}
  .cred-item{border-right:0;border-bottom:1px solid var(--line)}
  .cred-item:last-child{border-bottom:0}
}

/* ---------- section scaffolding ---------- */
section{padding:5.5rem 0}
.sec-head{max-width:44rem;margin-bottom:3rem}
.sec-tag{font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;color:var(--saffron);font-weight:600}
h2{font-size:clamp(1.7rem,3.4vw,2.4rem);letter-spacing:-.02em;color:var(--indigo);font-weight:600;margin:.8rem 0 1rem;line-height:1.12;text-wrap:balance}
.sec-head p{font-size:1.08rem;color:var(--ink);opacity:.85}

/* ---------- services ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media(max-width:900px){.pillars{grid-template-columns:1fr}}
.pillar,.why,.post-card,.offerbox,.cap{transition:border-color .17s var(--ease),box-shadow .17s var(--ease),transform .17s var(--ease)}
.pillar{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:2rem 1.8rem}
.pillar .num{font-size:.8rem;font-weight:600;color:var(--saffron);letter-spacing:.1em}
.pillar h3{font-size:1.35rem;color:var(--indigo);font-weight:600;margin:.6rem 0 .3rem;letter-spacing:-.01em}
.pillar .lead{font-size:.95rem;color:var(--muted);margin-bottom:1.3rem}
.pillar ul{list-style:none}
.pillar li{font-size:.96rem;padding:.55rem 0;border-top:1px solid var(--line);display:flex;gap:.6rem;align-items:flex-start}
.pillar li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--saffron);margin-top:.55rem}
.pillar li b{font-weight:600;color:var(--ink)}
@media(hover:hover){
  .pillar:hover,.why:hover,.post-card:hover,.offerbox:hover,.cap:hover{border-color:rgba(178,78,12,.7);box-shadow:var(--shadow);transform:translateY(-3px)}
}

/* ---------- process ---------- */
.process{background:var(--deep);color:#EAF0FA}
.process .sec-tag{color:var(--saffron-soft)}
.process h2{color:#fff}
.process .sec-head p{color:#B9C6DD;opacity:1}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}
.step{border:1px solid rgba(255,255,255,.14);border-radius:13px;padding:1.6rem 1.4rem;background:rgba(255,255,255,.03);position:relative}
.step .s-n{width:2.1rem;height:2.1rem;border-radius:50%;border:1.5px solid var(--saffron-soft);color:var(--saffron-soft);display:flex;align-items:center;justify-content:center;font-family:"Space Grotesk",sans-serif;font-weight:600;font-size:.95rem;margin-bottom:1rem}
.step h4{font-family:"Space Grotesk",sans-serif;font-size:1.1rem;color:#fff;font-weight:600;margin-bottom:.4rem}
.step p{font-size:.9rem;color:#B9C6DD;line-height:1.5}

/* ---------- guarantee band ---------- */
.guarantee{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--saffron);border-radius:12px;padding:1.8rem 2rem;margin-top:2.6rem}
.guarantee h4{font-family:"Space Grotesk",sans-serif;font-size:1.15rem;color:var(--indigo);font-weight:600;margin-bottom:.5rem}
.guarantee p{font-size:1rem;color:var(--ink);max-width:52rem}
.guarantee .fineprint{font-size:.85rem;color:var(--muted);margin-top:.6rem}

/* ---------- why ---------- */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem}
@media(max-width:820px){.why-grid{grid-template-columns:1fr}}
.why{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.9rem}
.why h4{font-family:"Space Grotesk",sans-serif;font-size:1.15rem;color:var(--indigo);font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.6rem}
.why h4 .ic{width:9px;height:9px;border-radius:2px;background:var(--saffron);transform:rotate(45deg);flex:none}
.why p{font-size:.97rem;color:var(--ink);opacity:.9}

/* ---------- principal / bio ---------- */
.principal{display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:2.2rem;box-shadow:0 18px 40px -36px rgba(22,35,62,.6)}
@media(max-width:640px){.principal{grid-template-columns:1fr;gap:1.2rem}}
.principal .photo{width:120px;height:120px;border-radius:14px;object-fit:cover;background:var(--paper);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted);font-family:"Space Grotesk",sans-serif;font-weight:600;font-size:2rem}
.principal h3{font-family:"Space Grotesk",sans-serif;font-size:1.3rem;color:var(--indigo);font-weight:600;margin-bottom:.5rem}
.principal p{font-size:1rem;color:var(--ink);opacity:.9;max-width:46rem}
.principal .plink{margin-top:.8rem;display:inline-block}

/* ---------- contrast table ---------- */
.contrast{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.contrast th,.contrast td{text-align:left;padding:1rem 1.2rem;border-bottom:1px solid var(--line);font-size:.95rem;vertical-align:top}
.contrast thead th{font-family:"Space Grotesk",sans-serif;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--paper)}
.contrast tbody tr:last-child td{border-bottom:0}
.contrast .alt{font-weight:600;color:var(--ink);white-space:nowrap}
.contrast .vy{color:var(--indigo);font-weight:600}
.contrast td:last-child{background:rgba(178,78,12,.05)}
@media(max-width:720px){
  .contrast,.contrast thead,.contrast tbody,.contrast th,.contrast td,.contrast tr{display:block}
  .contrast thead{display:none}
  .contrast tr{border-bottom:1px solid var(--line);padding:.55rem 0}
  .contrast tbody tr:last-child{border-bottom:0}
  .contrast td{border:0;padding:.45rem 1.2rem}
  .contrast td::before{content:attr(data-label);display:block;margin-bottom:.12rem;font-family:"Space Grotesk",sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
  .contrast .alt{padding-top:1rem;font-size:1.05rem;white-space:normal}
  .contrast .alt::before{display:none}
}

/* ---------- FAQ ---------- */
.faq{max-width:52rem}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:.8rem;padding:0 1.4rem}
.faq summary{font-family:"Space Grotesk",sans-serif;font-weight:600;color:var(--indigo);font-size:1.05rem;cursor:pointer;padding:1.15rem 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--saffron);font-size:1.4rem;line-height:1;flex:none}
.faq details[open] summary::after{content:"\2013"}
.faq details p{padding:0 0 1.2rem;color:var(--ink);opacity:.9;font-size:.98rem;max-width:46rem}
.faq details p a{color:var(--indigo);border-bottom:1.5px solid var(--line)}
.faq details p a:hover{color:var(--saffron);border-color:var(--saffron)}

/* ---------- blog / posts ---------- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media(max-width:900px){.post-grid{grid-template-columns:1fr}}
.post-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.8rem;display:flex;flex-direction:column;gap:.7rem;text-decoration:none}
.post-card .meta{font-family:"Space Grotesk",sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--saffron)}
.post-card h3{font-family:"Space Grotesk",sans-serif;font-size:1.2rem;color:var(--indigo);font-weight:600;letter-spacing:-.01em;line-height:1.2}
.post-card p{font-size:.95rem;color:var(--muted)}
.post-card .more{margin-top:auto;color:var(--indigo);font-weight:600;font-size:.9rem}

/* ---------- article ---------- */
.article{padding:3.5rem 0 4rem}
.article h1{font-size:clamp(2rem,4.5vw,3rem);max-width:22ch;margin-bottom:1rem}
.article .ameta{font-family:"Space Grotesk",sans-serif;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--saffron);font-weight:600;margin-bottom:1.5rem}
.prose{max-width:44rem}
.prose p{margin:0 0 1.2rem;font-size:1.08rem;line-height:1.7}
.prose h2{font-size:1.5rem;margin:2.4rem 0 .8rem;scroll-margin-top:5rem}
.prose h3{font-family:"Space Grotesk",sans-serif;font-size:1.2rem;color:var(--indigo);margin:1.8rem 0 .6rem}
.prose ul,.prose ol{margin:0 0 1.2rem 1.2rem}
.prose li{margin:.4rem 0;font-size:1.05rem;line-height:1.6}
.prose strong{color:var(--ink)}
.prose a{color:var(--indigo);font-weight:500;text-decoration-thickness:1.5px;text-underline-offset:3px}
.prose code{background:var(--card);border:1px solid var(--line);border-radius:5px;padding:.1rem .35rem;font-size:.9em}
.prose blockquote{border-left:3px solid var(--saffron);padding-left:1.2rem;margin:1.5rem 0;color:var(--muted);font-style:italic}
.article-cta{max-width:44rem;margin:2.5rem 0 0;padding:1.7rem 1.8rem;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--saffron);border-radius:12px}
.article-cta .sec-tag{display:block;margin-bottom:.35rem}
.article-cta h2{font-size:1.35rem;margin:0 0 .55rem}
.article-cta p{margin-bottom:1rem;color:var(--muted)}
.more-notes{max-width:44rem;margin-top:2.4rem;padding-top:1.5rem;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* ---------- sprint offer page ---------- */
.offerbox{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:2.4rem;margin:2rem 0}
.priceline{display:flex;align-items:baseline;gap:.65rem 1rem;flex-wrap:wrap;margin-bottom:.4rem}
.priceline .now{font-family:"Space Grotesk",sans-serif;font-size:2.6rem;font-weight:600;color:var(--indigo);letter-spacing:-.02em;line-height:1}
.priceline .was{font-size:1.2rem;color:var(--muted);text-decoration:line-through}
.priceline .tag{font-size:.8rem;font-weight:600;color:#fff;background:var(--saffron);padding:.28rem .65rem;border-radius:20px;letter-spacing:.03em;line-height:1.35}
.offerbox .sub{color:var(--muted);margin-bottom:1.4rem}
.includes{list-style:none;margin:1.4rem 0}
.includes li{padding:.65rem 0;border-top:1px solid var(--line);display:flex;gap:.7rem;align-items:flex-start;font-size:1rem}
.includes li .ck{flex:none;width:16px;height:16px;margin-top:.25rem;color:var(--saffron)}
.credit-note{background:rgba(178,78,12,.06);border:1px solid var(--line);border-radius:10px;padding:1rem 1.2rem;font-size:.95rem;color:var(--ink);margin-top:1rem}

/* ---------- quiz ---------- */
.quiz{max-width:44rem}
.q{min-inline-size:0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1.1rem 1.4rem 1.35rem;margin-bottom:1rem}
.q .qh{max-width:100%;padding:0 .2rem;font-family:"Space Grotesk",sans-serif;font-weight:600;color:var(--indigo);margin-bottom:.35rem}
.q label{display:flex;gap:.75rem;align-items:center;min-height:44px;padding:.5rem .45rem;cursor:pointer;font-size:.98rem;border-radius:8px;transition:background-color .16s var(--ease),color .16s var(--ease)}
.q label:hover{color:var(--saffron);background:rgba(178,78,12,.045)}
.q input{flex:none;width:18px;height:18px;accent-color:var(--saffron)}
#quizResult{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--saffron);border-radius:12px;padding:2rem;margin-top:1.5rem;scroll-margin-top:5.5rem}
#quizResult[hidden]{display:none}
#quizResult h2{font-family:"Space Grotesk",sans-serif;color:var(--indigo);font-size:1.4rem;margin:0 0 .6rem}
#quizResult p{margin-bottom:1rem}
.result-next{background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:.85rem 1rem;margin:.2rem 0 1.15rem;font-size:.96rem}
.result-next strong{color:var(--indigo)}
.quizerr{color:var(--saffron);font-size:.9rem;margin-top:.6rem;display:none}
.guide-download{margin-top:1.5rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.guide-download h3{font-size:1.05rem!important;margin:0 0 .35rem!important}
.guide-download p{font-size:.9rem;color:var(--muted);margin-bottom:.9rem!important}

/* ---------- CTA band ---------- */
.cta{background:var(--indigo);color:#fff;border-radius:20px;padding:3.8rem 2.5rem;text-align:center;position:relative;overflow:hidden;box-shadow:0 24px 55px -42px rgba(22,35,62,.85)}
.cta h2{color:#fff;max-width:22ch;margin:0 auto 1rem}
.cta p{color:#CBD8EE;max-width:38rem;margin:0 auto 2rem;font-size:1.08rem}
.cta .cta-actions{display:inline-flex;align-items:center;gap:1.1rem;flex-wrap:wrap;justify-content:center}
.cta .btn{background:#fff;color:var(--indigo);border-color:#fff}
.cta .btn:hover{background:var(--saffron);border-color:var(--saffron);color:#fff}
.cta .cta-alt{color:#CBD8EE;text-decoration:none;font-size:.92rem;border-bottom:1px solid rgba(255,255,255,.25)}
.cta .cta-alt:hover{color:#fff;border-color:#fff}
.cta .fine{margin-top:1.3rem;font-size:.85rem;color:#9DB2D6}

/* ---------- mobile CTA ---------- */
.mobile-cta{display:none}
@media(max-width:760px){
  body{padding-bottom:calc(4.75rem + env(safe-area-inset-bottom))}
  .mobile-cta{position:fixed;z-index:45;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1fr;gap:.65rem;padding:.65rem max(1rem,env(safe-area-inset-left)) calc(.65rem + env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-right));background:rgba(251,249,245,.96);border-top:1px solid var(--line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transform:translateY(110%);visibility:hidden;pointer-events:none;transition:transform .18s var(--ease),visibility .18s}
  .mobile-cta.is-visible{transform:translateY(0);visibility:visible;pointer-events:auto}
  .mobile-cta .btn{min-height:44px;padding:.62rem .75rem;font-size:.86rem}
  .mobile-cta .btn.ghost{background:#fff}
}

/* ---------- 404 ---------- */
.not-found{min-height:calc(100vh - 12rem);display:grid;place-items:center;padding:4rem 0;text-align:center}
.not-found .code{font-family:"Space Grotesk",sans-serif;font-size:.8rem;letter-spacing:.13em;text-transform:uppercase;color:var(--saffron);font-weight:600}
.not-found h1{margin:.8rem auto 1rem;max-width:18ch}
.not-found p{max-width:34rem;margin:0 auto 1.8rem;color:var(--muted)}
.not-found .hero-cta{justify-content:center}

/* ---------- footer ---------- */
footer{padding:3rem 0}
.foot{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:start;border-top:1px solid var(--line);padding-top:2rem}
.foot .fb{font-family:"Space Grotesk",sans-serif;font-weight:600;color:var(--indigo)}
.foot .fb .dot{color:var(--saffron)}
.foot .foot-l{display:flex;flex-direction:column;gap:.4rem}
.foot .foot-l .muted{font-size:.85rem;color:var(--muted)}
.foot .foot-r{display:flex;gap:1.4rem;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.foot .foot-r a{color:var(--muted);text-decoration:none;font-size:.9rem}
.foot .foot-r a:hover{color:var(--saffron)}

/* ---------- reveal motion ---------- */
@media(prefers-reduced-motion:no-preference){
  html.reveal-ready [data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .48s var(--ease),transform .48s var(--ease)}
  html.reveal-ready [data-reveal].is-visible{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

@media(max-width:640px){
  .wrap,.narrow{padding-left:1.1rem;padding-right:1.1rem}
  section{padding:4.25rem 0}
  .hero{padding:4.35rem 0 3.5rem}
  .sec-head{margin-bottom:2.2rem}
  .principal{padding:1.4rem}
  .guarantee{padding:1.4rem 1.25rem}
  .offerbox{padding:1.45rem 1.25rem;border-radius:14px}
  .priceline .now{font-size:2.3rem}
  .priceline .tag{flex-basis:auto}
  .cta{padding:2.7rem 1.25rem;border-radius:16px}
  .q{padding:1.1rem .85rem}
  #quizResult{padding:1.4rem 1.2rem}
  .guide-download .btn{width:100%;min-height:44px}
  .article{padding:2.7rem 0 3.5rem}
  .article-cta{padding:1.35rem 1.2rem}
  .foot{grid-template-columns:1fr}
  .foot .foot-r{justify-content:flex-start}
}
@media(max-width:460px){
  h1{font-size:clamp(2.25rem,12vw,3rem)}
  .hero-cta{align-items:stretch}
  .hero-cta>.btn{width:100%}
  .hero-cta .tertiary{margin-top:.15rem}
  .priceline{align-items:center}
  .priceline .tag{width:fit-content}
}

/* 2026-07-21: completed responsive, motion, accessibility, quiz, article, and mobile CTA polish; simplified the guide to an ungated download (agent) */
/* 2026-07-21: renamed the content-section annotation from writing to blog (agent) */