:root{
  --background:#fefefe;
  --ink:#1a1d24;
  --supporting:#314561;
  --body-soft:#5a6678;
  --muted:#f5f5f5;
  --muted-foreground:#74798a;
  --border:#e5e5e5;
  --card:#ffffff;
  --primary:#516bef;
  --primary-hover:#4059d6;
  --primary-light:#e9edff;
  --primary-foreground:#ffffff;
  --accent-deep:#c98f17;
}
*{box-sizing:border-box;margin:0;padding:0;border-color:var(--border)}
html,body{
  background:var(--background);color:var(--ink);
  font-family:"Inter",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;line-height:1.5;
}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input{font:inherit}

h1,h2,h3{font-family:"Instrument Serif",Georgia,serif;font-weight:400;letter-spacing:-0.01em;color:var(--supporting);line-height:1.1}

/* layout */
.page{position:relative;display:flex;flex-direction:column;min-height:100vh;overflow:hidden;background:var(--background)}
.container{margin:0 auto;width:100%;max-width:72rem;padding:0 1.5rem}
.container-sm{max-width:48rem}
.container-md{max-width:56rem}

.site-header{position:relative;z-index:10;padding:2.5rem 1.5rem 0}
.site-header .row{margin:0 auto;max-width:72rem;display:flex;align-items:center;justify-content:space-between}
.site-header.legal .row{max-width:48rem}
.logo{height:2rem;width:auto;color:var(--supporting)}
.logo.sm{height:1.75rem}
.badge{display:none;border:1px solid var(--border);background:rgba(255,255,255,.6);backdrop-filter:blur(8px);
  border-radius:9999px;padding:.4rem 1rem;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--supporting)}
@media(min-width:640px){.badge{display:inline-block}}

main.center{position:relative;z-index:10;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 1.5rem;text-align:center}

/* hero */
.hero{max-width:48rem;animation:fadeIn 1.2s ease-out both}
.hero h1{font-size:clamp(2.75rem,6vw,4.5rem);line-height:1.05;animation:fadeUp 1s cubic-bezier(.22,1,.36,1) both}
.hero h1 em{font-style:italic;font-weight:400;color:var(--primary)}
.hero .lead{margin:2rem auto 0;max-width:34rem;font-size:1.125rem;line-height:1.6;color:var(--body-soft);animation:fadeUp 1s .15s cubic-bezier(.22,1,.36,1) both}
.hero .lead .name{font-weight:500;color:var(--supporting)}
@media(min-width:640px){.hero .lead{font-size:1.25rem}}

.form-wrap{margin-top:3rem;animation:fadeUp 1s .3s cubic-bezier(.22,1,.36,1) both}
.legal-note{margin-top:1rem;font-size:.75rem;color:var(--muted-foreground)}
.legal-note a{color:inherit;text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--accent-deep)}
.legal-note a:hover{color:var(--supporting)}

/* newsletter form */
.newsletter{margin:0 auto;display:flex;flex-direction:column;gap:.75rem;max-width:36rem}
.newsletter input[type=email]{
  height:3.5rem;flex:1;border:1px solid var(--border);background:rgba(255,255,255,.8);
  border-radius:9999px;padding:0 1.5rem;font-size:1rem;color:var(--ink);
  box-shadow:0 1px 2px rgba(0,0,0,.04);backdrop-filter:blur(8px);transition:border-color .2s,box-shadow .2s;
}
.newsletter input[type=email]::placeholder{color:var(--muted-foreground)}
.newsletter input[type=email]:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(81,107,239,.25)}
.newsletter .hp{display:none}
.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  height:3.5rem;padding:0 2rem;border-radius:9999px;
  background:var(--primary);color:var(--primary-foreground);font-weight:500;font-size:1rem;
  box-shadow:0 10px 25px -10px rgba(81,107,239,.5);transition:background .2s,transform .1s,box-shadow .2s;
}
.btn-primary:hover{background:var(--primary-hover);box-shadow:0 12px 30px -8px rgba(81,107,239,.6)}
.btn-primary:active{transform:scale(.98)}
.btn-primary svg{transition:transform .2s}
.btn-primary:hover svg{transform:translateX(2px)}
@media(min-width:640px){.newsletter{flex-direction:row;align-items:stretch}}

/* feature grid */
.features{margin-top:5rem;display:grid;grid-template-columns:1fr;gap:1.5rem;animation:fadeUp 1s .5s cubic-bezier(.22,1,.36,1) both}
@media(min-width:640px){.features{grid-template-columns:repeat(3,1fr)}}
.feature{border:1px solid rgba(229,229,229,.7);background:rgba(255,255,255,.5);
  border-radius:1rem;padding:1.5rem;text-align:left;backdrop-filter:blur(6px)}
.feature .k{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--primary)}
.feature p{margin-top:.5rem;font-size:.9rem;line-height:1.55;color:var(--body-soft)}

/* simple page (validation/confirmation) */
.simple{max-width:36rem;animation:fadeUp 1s cubic-bezier(.22,1,.36,1) both}
.simple .icon{margin:0 auto 2rem;display:flex;height:4rem;width:4rem;align-items:center;justify-content:center;border-radius:9999px}
.simple .icon.solid{background:var(--primary);color:var(--primary-foreground);box-shadow:0 12px 30px -10px rgba(81,107,239,.55)}
.simple .icon.soft{background:var(--primary-light);color:var(--primary)}
.simple h1{font-size:clamp(2.25rem,5vw,3rem)}
.simple .lead{margin:1.5rem auto 0;max-width:32rem;font-size:1.125rem;color:var(--body-soft)}
.simple .meta{margin-top:1rem;font-size:.875rem;color:var(--muted-foreground)}
.btn-ghost,.btn-fill{
  display:inline-flex;align-items:center;justify-content:center;height:3rem;
  border-radius:9999px;padding:0 1.75rem;font-size:.9rem;margin-top:2.5rem;transition:all .2s;
}
.btn-fill{background:var(--primary);color:var(--primary-foreground);box-shadow:0 10px 25px -10px rgba(81,107,239,.45)}
.btn-fill:hover{background:var(--primary-hover)}
.btn-ghost{border:1px solid var(--border);background:rgba(255,255,255,.7);color:var(--supporting);backdrop-filter:blur(6px)}
.btn-ghost:hover{border-color:var(--primary);color:var(--primary)}

/* legal pages */
.legal-main{position:relative;z-index:10;margin:0 auto;width:100%;max-width:48rem;flex:1;padding:4rem 1.5rem}
.legal-main h1{margin-bottom:2.5rem;font-size:clamp(2.25rem,5vw,3rem)}
.prose{font-size:.94rem;line-height:1.7;color:var(--body-soft)}
.prose h2{font-family:"Instrument Serif",Georgia,serif;font-size:1.6rem;color:var(--supporting);margin:2.5rem 0 .75rem}
.prose h3{font-weight:600;font-size:1.05rem;color:var(--supporting);margin:1.75rem 0 .5rem}
.prose h4{font-weight:600;color:var(--ink);margin:1.25rem 0 .4rem}
.prose p{margin-bottom:1rem}
.prose ul{list-style:disc;padding-left:1.25rem;margin-bottom:1rem}
.prose a{color:var(--primary);text-decoration:underline;text-underline-offset:2px}
.prose a:hover{color:var(--primary-hover)}
.prose strong{color:var(--ink)}
.prose hr{margin:2rem 0;border:0;border-top:1px solid var(--border)}
.legal-back{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--supporting)}
.legal-back:hover{color:var(--primary)}

/* footer */
.site-footer{position:relative;z-index:10;margin-top:auto;padding:4rem 1.5rem 2rem;font-size:.75rem;color:var(--muted-foreground)}
.site-footer .row{margin:0 auto;max-width:64rem;display:flex;align-items:center;justify-content:center}
.site-footer nav{display:flex;gap:1.5rem}
.site-footer a:hover{color:var(--supporting)}

/* aurora */
.aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.aurora .blob{position:absolute;border-radius:9999px;filter:blur(80px);opacity:.55;mix-blend-mode:multiply;animation:aurora 22s ease-in-out infinite}
.aurora .b1{width:60vmax;height:60vmax;left:-20vmax;top:-20vmax;background:#516bef;animation-delay:0s}
.aurora .b2{width:55vmax;height:55vmax;right:-18vmax;top:-10vmax;background:#e8b23a;opacity:.35;animation-delay:-7s}
.aurora .b3{width:70vmax;height:70vmax;left:10vmax;bottom:-30vmax;background:#4059d6;opacity:.45;animation-delay:-14s}
.aurora .b4{width:45vmax;height:45vmax;right:-10vmax;bottom:-10vmax;background:#e9edff;opacity:.7;animation-delay:-3s}
.aurora.dim{opacity:.4}

/* grain */
.grain::after{content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(0,0,0,.06) 1px,transparent 1px);
  background-size:3px 3px;opacity:.25;pointer-events:none;mix-blend-mode:overlay}

@keyframes aurora{
  0%,100%{transform:translate3d(0,0,0) rotate(0) scale(1)}
  33%{transform:translate3d(8%,-6%,0) rotate(60deg) scale(1.15)}
  66%{transform:translate3d(-6%,8%,0) rotate(-40deg) scale(1.1)}
}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
