/* Shared site header and responsive navigation — used by every content page. */
.site-header, header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line,#e7e5f0)}
.site-header .header-inner,header .top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px}
.site-header .brand,header .brand{display:inline-flex;align-items:center;gap:10px;min-width:0;color:var(--ink,#191827);text-decoration:none;font-weight:850;letter-spacing:-.04em}
.menu-btn{display:none;align-items:center;justify-content:center;flex:0 0 auto;width:46px;height:46px;margin-left:auto;border:1px solid #ded7ff;border-radius:14px;background:#f4f1ff;color:#6048e8;font:inherit;font-size:23px;font-weight:600;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nav{display:flex;align-items:center;gap:20px;font-size:14px}
.nav a{display:inline-flex;align-items:center;color:#5f5d70;text-decoration:none;font-size:14px;font-weight:550;line-height:1.4;transition:color .15s ease,background .15s ease}
.nav a:hover,.nav a:focus-visible{color:#6048e8}.nav .social{color:#5140be;font-weight:700}
@media(max-width:760px){header .top{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:12px}.site-header .header-inner{min-height:66px}.menu-btn{display:inline-flex}.nav{display:none;position:absolute;top:calc(100% + 8px);right:0;left:auto;width:min(320px,calc(100vw - 28px));max-height:min(72vh,560px);overflow-y:auto;padding:10px;flex-direction:column;align-items:stretch;gap:2px;border:1px solid #e7e3f5;border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 16px 44px rgba(33,26,72,.14);z-index:100}.nav.open{display:flex}.nav a{display:flex;width:100%;min-height:42px;padding:10px 12px;border-radius:10px;font-size:14px}.nav a:active,.nav a:focus-visible{background:#f4f1ff;outline:none}}


/* Premium visual refinement — shared across the site */
:root{
  --premium-shadow:0 18px 50px rgba(37,28,82,.075);
  --premium-shadow-hover:0 24px 58px rgba(52,38,110,.13);
}
html{scroll-behavior:smooth}
body{
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  background-image:radial-gradient(ellipse at 12% 0%,rgba(221,214,255,.24),transparent 34%),
                   radial-gradient(ellipse at 92% 18%,rgba(255,224,239,.2),transparent 30%);
}
::selection{background:#ded7ff;color:#292044}
a{-webkit-tap-highlight-color:transparent}
button,input,textarea,select{font:inherit}
:focus-visible{outline:3px solid rgba(107,78,255,.55);outline-offset:3px}
header,.site-header{
  box-shadow:0 4px 22px rgba(31,24,65,.025);
}
.brand,.site-header .brand{
  transition:opacity .18s ease,transform .18s ease;
}
.brand:hover,.site-header .brand:hover{opacity:.88}
.brand-mark,.mark{
  box-shadow:0 7px 18px rgba(107,78,255,.2);
}
.nav a{
  transition:color .18s ease,background .18s ease;
}
.nav a:hover{color:var(--purple,#6b4eff)}
.card,.entry,.panel,.planner-shell,.ribbon-card,.choice,.formbox{
  box-shadow:0 1px 2px rgba(25,24,39,.015);
}
.card,.entry,.choice,.panel{
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.card:hover,.entry:hover,.choice:hover{
  box-shadow:var(--premium-shadow-hover);
}
.card{border-radius:22px}
.entry{border-radius:17px}
.note{
  border:1px solid rgba(107,78,255,.09);
  background:linear-gradient(120deg,#f0edff,#f8f5ff 72%,#fff7fb);
}
.section-title{line-height:1.15}
.btn,.record-toggle{transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
.btn:active,.record-toggle:active{transform:translateY(0) scale(.985)}
input,textarea,select{
  max-width:100%;
}
img,svg,video{max-width:100%}
@media(max-width:760px){
  body{background-image:radial-gradient(ellipse at 50% 0%,rgba(221,214,255,.22),transparent 42%)}
  .card:hover,.entry:hover,.choice:hover{transform:none}
  .nav a{border-radius:11px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* Second polish pass: rhythm, hierarchy and responsive guardrails */
main{min-width:0}
main h1,main h2,main h3{ text-wrap:balance }
main p{ text-wrap:pretty }
main .hero{isolation:isolate}
main .hero::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width: min(58vw,620px);height: min(38vw,360px);right:-8%;top:0;
  border-radius:50%;background:radial-gradient(ellipse,rgba(221,214,255,.26),transparent 68%);
}
main .eyebrow{display:inline-flex;align-items:center;gap:9px}
main .eyebrow::before{content:"";width:20px;height:2px;border-radius:2px;background:currentColor;opacity:.65}
main .section-title{margin-top:clamp(28px,4vw,42px)}
main .list{gap:12px}
main .entry strong{letter-spacing:-.015em}
main .entry small{line-height:1.55}
main .note{line-height:1.7}
main .hero-cta{gap:12px}
main .btn{min-height:48px}
.site-footer{background:rgba(255,255,255,.82)}
.legal-footer-links a{transition:color .18s ease}
.legal-footer-links a:hover{color:var(--purple,#6b4eff)}
@media(max-width:760px){
  main .hero::before{width:90vw;height:60vw;right:-25%;top:-12%}
  main .hero-cta .btn{width:100%}
  main .entry{gap:12px}
  main .entry .arrow{font-size:18px}
}
@media(min-width:761px){
  main .entry{padding:20px 22px}
}