:root{
  --ink:#1C1622;--cream:#F4F6FB;--card:#FCFBFD;
  --muted:#58596B;--muted-light:#8E90A4;
  --accent:#5B2A54;--accent-deep:#43203E;
  --blue-light:#8FB8E4;--blue-mid:#3C6DA8;
  --chip:#E9EEF7;--border:#E4EAF3;--border-2:#E7ECF4;
  --surface:#F2F5FA;--bubble-in:#EFF2F8;--bubble-out:#F1E1ED;
  --font:"Schibsted Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;
  --max:1280px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{margin:0;background:var(--ink);color:var(--ink);font-family:var(--font);font-size:18px;-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--accent)}
button{font-family:inherit;cursor:pointer}
input{font-family:inherit}
img{max-width:100%;display:block}
h1,h2,h3{margin:0}
p{margin:0}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}

@keyframes bokeh{0%,100%{opacity:.55}50%{opacity:.85}}
@keyframes raydrift{0%,100%{opacity:.58;transform:translateX(-50%) scaleX(1)}50%{opacity:.9;transform:translateX(-50%) scaleX(1.12)}}
@keyframes pulseline{0%,100%{opacity:.3}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}html{scroll-behavior:auto}}

/* fixed gradient canvas behind everything */
.bg-canvas{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:linear-gradient(178deg,#DDE7F3 0%,#C6D8EE 32%,#9DBEE2 62%,#6D97C6 84%,#41689B 100%)}
.bg-bokeh{position:absolute;left:50%;bottom:-46vh;width:74vw;height:74vw;transform:translateX(-50%);border-radius:999px;background:radial-gradient(circle,rgba(226,238,251,.95) 0%,rgba(186,213,240,.6) 34%,rgba(60,109,168,0) 72%);filter:blur(42px);animation:bokeh 14s ease-in-out infinite}
.bg-rays{position:absolute;inset:0;mix-blend-mode:screen;opacity:.85}
.ray{position:absolute;left:50%;bottom:-12vh;height:150vh;transform-origin:50% 100%;filter:blur(26px)}
.ray-1{width:120px;transform:translateX(-50%) rotate(-34deg);background:linear-gradient(to top,rgba(235,243,253,.85),rgba(205,224,246,.28) 42%,rgba(205,224,246,0));animation:raydrift 17s ease-in-out infinite}
.ray-2{width:210px;transform:translateX(-50%) rotate(-17deg);background:linear-gradient(to top,rgba(235,243,253,.7),rgba(205,224,246,.2) 46%,rgba(205,224,246,0));filter:blur(34px);animation:raydrift 21s ease-in-out .8s infinite}
.ray-3{width:150px;transform:translateX(-50%) rotate(-3deg);background:linear-gradient(to top,rgba(235,243,253,.9),rgba(205,224,246,.26) 44%,rgba(205,224,246,0));filter:blur(22px);animation:raydrift 15s ease-in-out .4s infinite}
.ray-4{width:260px;transform:translateX(-50%) rotate(12deg);background:linear-gradient(to top,rgba(235,243,253,.62),rgba(205,224,246,.18) 48%,rgba(205,224,246,0));filter:blur(38px);animation:raydrift 24s ease-in-out 1.2s infinite}
.ray-5{width:110px;transform:translateX(-50%) rotate(28deg);background:linear-gradient(to top,rgba(235,243,253,.8),rgba(205,224,246,.24) 40%,rgba(205,224,246,0));filter:blur(24px);animation:raydrift 19s ease-in-out .2s infinite}
.bg-vignette{position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 108%,rgba(91,42,84,.34) 0%,rgba(91,42,84,0) 58%)}

.announce{position:relative;z-index:2;background:var(--ink);text-align:center;padding:12px 20px;font-size:15px;color:var(--blue-light)}

.page-pad{position:relative;z-index:1;padding:clamp(10px,2.2vw,26px) clamp(8px,2.2vw,26px) clamp(28px,5vw,64px)}
.shell{max-width:var(--max);margin:0 auto;background:var(--card);border-radius:clamp(18px,2.4vw,30px);box-shadow:0 40px 110px -34px rgba(18,28,48,.55),0 2px 0 rgba(255,255,255,.6) inset;overflow:hidden}

.site-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding:20px clamp(20px,3.4vw,48px)}
.brand{display:flex;align-items:center;gap:11px}
.logo-mark{width:34px;height:34px;border-radius:999px;background:linear-gradient(160deg,var(--blue-light),var(--blue-mid));display:block;flex:none}
.wordmark{font-size:20px;font-weight:600;letter-spacing:-.02em}
.site-nav{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;font-size:16px}
.site-nav a{color:var(--muted);min-height:44px;display:flex;align-items:center}
.site-nav a:hover{color:var(--accent)}
.site-nav .current{color:var(--accent);font-weight:600;min-height:44px;display:flex;align-items:center}

.eyebrow-chip{display:inline-flex;background:#FFFFFF;border:1px solid var(--border);border-radius:999px;padding:7px 15px;font-size:14px;font-weight:500;color:var(--accent)}

.capture-form{max-width:520px;margin-top:30px}
.capture-row{display:flex;flex-wrap:wrap;gap:10px}
.capture-input{flex:1 1 210px;min-width:0;min-height:58px;background:#FFFFFF;border:1px solid var(--border);border-radius:14px;padding:0 18px;font-size:18px;color:var(--ink)}
.capture-input::placeholder{color:var(--muted-light)}
.capture-button{flex:1 1 180px;min-height:58px;border:none;border-radius:14px;font-size:18px;font-weight:600;padding:0 24px;background:var(--ink);color:var(--cream);display:flex;align-items:center;justify-content:center;transition:opacity .15s ease}
.capture-button:hover{opacity:.88}
.capture-button:disabled{opacity:.6;cursor:default}
.reassurance-row{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:14px;font-size:16px;color:var(--muted)}
.form-error{font-size:16px;line-height:1.45;color:var(--accent);margin:12px 0 0}
.form-success{font-size:17px;font-weight:500;line-height:1.5;color:var(--ink);margin:0}
.is-submitted .capture-row,.is-submitted .reassurance-row{display:none}

/* mouse-reactive canvas dot grid, decorative background used behind a dark section */
.dot-grid-canvas{position:absolute;inset:0;display:block;width:100%;height:100%}
.dot-grid-fade{position:absolute;inset:0;background:radial-gradient(85% 75% at 30% 15%,rgba(28,22,34,0) 0%,rgba(28,22,34,.22) 60%,rgba(28,22,34,.45) 100%);pointer-events:none}
.dot-grid-glow{position:absolute;left:-8%;top:-30%;width:52%;padding-bottom:52%;border-radius:999px;background:radial-gradient(circle,rgba(60,109,168,.4) 0%,rgba(60,109,168,0) 68%);filter:blur(40px);pointer-events:none}

/* spring-following + orbiting gradient blobs, decorative background used behind a dark section */
.gradient-blob{position:absolute;inset:-10%;overflow:hidden;filter:blur(60px) brightness(1.15);mix-blend-mode:soft-light;pointer-events:none}
.gradient-blob-glow{position:absolute;left:50%;bottom:-72%;width:96%;padding-bottom:96%;transform:translateX(-50%);border-radius:999px;background:radial-gradient(circle,rgba(186,213,240,.42) 0%,rgba(186,213,240,0) 64%);filter:blur(26px);pointer-events:none}
.gradient-blob-vignette{position:absolute;left:50%;top:50%;width:130%;height:150%;transform:translate(-50%,-50%);background:radial-gradient(58% 52% at 50% 50%,rgba(30,18,40,.32) 0%,rgba(30,18,40,.15) 52%,rgba(30,18,40,0) 78%);pointer-events:none}

/* shared closing CTA band: dark background, kicker, heading, capture form */
.join{position:relative;overflow:hidden;padding:clamp(48px,6vw,84px) clamp(20px,3.4vw,48px);text-align:center;background:var(--ink)}
.join-inner{position:relative}
.join-kicker{display:inline-flex;background:rgba(12,8,18,.28);border:1px solid rgba(244,246,251,.28);border-radius:999px;padding:8px 16px;font-size:15px;font-weight:500;color:#E7D8EE}
.join h2{font-size:clamp(30px,4.8vw,52px);font-weight:600;line-height:1.05;letter-spacing:-.032em;color:var(--cream);max-width:740px;margin:20px auto 0;text-wrap:pretty}
.join .capture-form{max-width:500px;margin:28px auto 0}
.join .capture-input{background:rgba(244,246,251,.96);border:1px solid rgba(244,246,251,.5)}
.join .capture-button{background:var(--cream);color:var(--accent-deep)}
.join .form-error{color:#E7D8EE}
.join .form-success{color:var(--cream)}
.join .form-error,.join .form-success{max-width:500px;margin-left:auto;margin-right:auto}

/* shared brand footer: used at the end of the closing CTA band */
.site-footer{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin:clamp(30px,4vw,48px) 0 0;padding-top:22px;border-top:1px solid rgba(244,246,251,.12)}
.site-footer-brand{display:flex;align-items:center;gap:11px}
.site-footer-brand .logo-mark{width:28px;height:28px}
.site-footer-brand-name{font-size:16px;font-weight:600;color:var(--cream)}
.site-footer-brand-tag{font-size:15px;color:rgba(244,246,251,.45)}
.site-footer-copy{font-size:15px;color:rgba(244,246,251,.45);margin:0}
