:root{
  --bg:#F6F5F3; --surface:#FFFFFF; --ink:#1B2430; --muted:#4F5B6B; --line:#DCD8CE;
  --accent:#24459A; --accent-hover:#1B3577; --accent-ink:#fff; --tint:#E6ECF8;
  --ok:#2F6F62; --marigold:#E3A23B; --fail:#B4442F;
  --night:#142030; --night-soft:#A7B3C4; --night-2:#22304A;
  --m:clamp(18px,2.2vw,32px);
  --step-small:clamp(.8125rem,.79rem + .1vw,.875rem);
  --step-body:clamp(1.0625rem,1rem + .25vw,1.1875rem);
  --step-lead:clamp(1.25rem,1.1rem + .7vw,1.625rem);
  --step-head:clamp(2rem,1.3rem + 3.2vw,4rem);
  --display:'Imbue',Georgia,serif; --text:'Albert Sans',system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--text);font-size:var(--step-body);line-height:1.55;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:-.01em;line-height:.9;text-wrap:balance}
h2{font-size:var(--step-head)}
.wrap{padding-left:var(--m);padding-right:var(--m)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;background:var(--accent);color:var(--accent-ink);font:500 var(--step-body) var(--text);text-decoration:none;border:0;cursor:pointer;transition:transform .2s var(--ease),background .2s}
.btn:hover{background:var(--accent-hover)}.btn:active{transform:translateY(2px)}
.btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.check :focus-visible,.check2 :focus-visible,.nt2 :focus-visible,.pol.dark :focus-visible{outline-color:var(--marigold)}
.link{color:var(--accent);text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:1px}
.link:hover{text-decoration-thickness:3px}
.check .link,.nt2 .link,.pol.dark .link,footer .link{color:inherit}

/* hero: waterline */
.hero{position:relative;height:100svh;min-height:560px;background:var(--bg)}
.hero::after{content:"";position:absolute;inset:50% 0 0;background:var(--night)}
.hero .bar{position:absolute;inset:28px var(--m) auto;display:flex;justify-content:space-between;align-items:center;z-index:3}
.wordmark{font:500 15px var(--text);text-decoration:none;display:flex;gap:10px;align-items:center}
.wordmark img{width:28px;height:28px}
.hero .slice{position:absolute;left:0;right:0;overflow:hidden;z-index:2}
.hero .slice.top{top:0;bottom:50%}
.hero .slice.bot{top:50%;bottom:0}
.hero h1,.hero .h1copy{position:absolute;left:0;right:0;text-align:center;font-size:clamp(72px,11.5vw,190px);line-height:.86}
.hero .slice.top h1{bottom:0;color:var(--night)}
.hero .slice.bot .h1copy{top:0;color:var(--bg);font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:-.01em;text-wrap:balance}
.hero .ln{display:block;overflow:hidden;padding-bottom:.04em}
.hero .ln>span{display:inline-block;animation:rise .9s var(--ease) both}
.hero .ln+.ln>span{animation-delay:.11s}
@keyframes rise{from{transform:translateY(105%)}}
.hero .sub{position:absolute;left:var(--m);right:var(--m);bottom:40px;text-align:center;color:var(--bg);font-size:var(--step-lead);line-height:1.35;animation:fade .7s .5s var(--ease) both;z-index:2}
.hero .sub a{color:var(--bg)}
@keyframes fade{from{opacity:0;transform:translateY(12px)}}

/* entrances */
.in>*{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.in.seen>*{opacity:1;transform:none}
.in.seen>*:nth-child(2){transition-delay:.08s}.in.seen>*:nth-child(3){transition-delay:.16s}.in.seen>*:nth-child(4){transition-delay:.24s}
.no-js .in>*{opacity:1;transform:none}

section{padding:clamp(96px,12vw,200px) 0}

/* intro */
.intro .top{display:grid;grid-template-columns:repeat(12,1fr);gap:0 var(--m);align-items:end}
.intro h2{grid-column:1/8;font-size:clamp(44px,6vw,96px)}
.intro .note{grid-column:9/13;font-size:var(--step-body)}
.intro .facts:first-child{margin-top:0}
.intro .stores{display:flex;gap:24px;flex-wrap:wrap;margin-top:40px;font-weight:500;font-size:var(--step-body)}
.facts{display:flex;justify-content:space-between;gap:var(--m);margin-top:clamp(64px,8vw,120px);flex-wrap:wrap}
.facts div b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(44px,5.5vw,88px);line-height:.9}
.facts div span{display:block;margin-top:8px;color:var(--muted);font-size:var(--step-small)}
.intro .shots{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--m);margin-top:clamp(64px,8vw,120px)}
.intro .shots figure:nth-child(1){grid-column:1/5}
.intro .shots figure:nth-child(2){grid-column:5/9;margin-top:12vw}
.intro .shots figure:nth-child(3){grid-column:9/13}
figure img{width:100%;background:var(--surface)}
figcaption{margin-top:12px;font-size:var(--step-small);color:var(--muted)}

/* checker */
.check{background:var(--night);color:var(--bg);min-height:88svh}
.check h2{font-size:var(--step-head);max-width:16ch}
.check .lead{margin-top:20px;max-width:46ch;color:var(--night-soft)}
.check form{margin-top:clamp(40px,5vw,72px)}
.check label{display:block;font-size:var(--step-small);color:var(--night-soft);margin-bottom:8px}
.check input{width:100%;background:none;border:0;color:var(--bg);font:400 clamp(48px,8vw,132px)/1 var(--display);text-transform:uppercase;letter-spacing:-.01em;caret-color:var(--marigold)}
.check input:focus{outline:none}
.answer{margin-top:48px;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--m)}
.answer .route{grid-column:1/7;font-size:var(--step-lead);line-height:1.4}
.answer .route b{font-weight:500;color:var(--marigold)}
.answer ul{grid-column:8/13;list-style:none;font-size:var(--step-body)}
.answer li{padding:10px 0}
.answer li+li{border-top:0}
.answer .go{margin-top:20px}
.examples{margin-top:48px;display:flex;gap:12px;flex-wrap:wrap;align-items:center;color:var(--night-soft)}
.examples button{background:var(--night-2);color:var(--bg);border:0;min-height:44px;padding:0 16px;font:400 var(--step-body) var(--text);cursor:pointer;transition:background .2s,transform .2s var(--ease)}
.examples button:hover{background:var(--accent)}.examples button:active{transform:translateY(2px)}

/* exam table */
.exams h2{max-width:14ch}
.exams .tbl{margin-top:56px;font-size:clamp(18px,1.9vw,28px);line-height:1.5}
.exams .grp{color:var(--accent);margin:56px 0 12px;font:inherit}
.exams .row{display:grid;grid-template-columns:2fr 2fr 1fr 1fr;gap:var(--m)}
.exams .row span:nth-child(3),.exams .row span:nth-child(4){text-align:right;font-variant-numeric:tabular-nums}
.exams .head{color:var(--muted);font-size:var(--step-small)}
.exams .src{margin-top:40px;font-size:var(--step-small);color:var(--muted);max-width:70ch}
.band{position:relative;overflow:hidden;height:min(80svh,760px)}
.band img{width:100%;height:120%;object-fit:cover;will-change:transform}
.band figcaption{position:absolute;left:var(--m);bottom:20px;color:#fff;background:rgba(0,0,0,.45);padding:6px 10px;margin:0}

/* proof */
.proof{background:var(--surface)}
.proof .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--m);align-items:center}
.proof .say{grid-column:1/8}
.proof blockquote{font-size:clamp(24px,2.5vw,36px);line-height:1.25;margin-top:28px;min-height:5em;transition:opacity .4s}
.proof cite{display:block;margin-top:20px;font-style:normal;color:var(--muted);font-size:var(--step-small)}
.proof .nums{display:flex;gap:clamp(24px,4vw,64px);margin-top:48px;flex-wrap:wrap}
.proof .nums b{display:block;font:400 clamp(44px,5vw,80px)/.9 var(--display)}
.proof .nums span{font-size:var(--step-small);color:var(--muted)}
.proof figure{grid-column:9/13}

/* pricing */
.plans h2{font-size:var(--step-head)}
.ptable{margin-top:56px;width:100%;border-collapse:collapse;font-size:clamp(17px,1.4vw,22px)}
.ptable th,.ptable td{text-align:left;vertical-align:top;padding:20px 16px}
.ptable thead th{font-weight:500}
.ptable thead th b{display:block;font:400 clamp(28px,3vw,48px)/.95 var(--display);text-transform:uppercase}
.ptable thead th .p{display:block;font:400 clamp(28px,3vw,48px)/1.1 var(--display)}
.ptable thead th small{font-size:16px;color:var(--muted);font-weight:400}
.ptable tbody tr:nth-child(odd) td,.ptable tbody tr:nth-child(odd) th{background:var(--surface)}
.ptable .best{background:var(--tint)!important}
.ptable tbody th{font-weight:400;color:var(--muted);width:24%}
.ptable td .btn{width:100%}
.mplans{display:none}

/* faq */
.faq .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--m)}
.faq .side{grid-column:1/4}
.faq .side h2{font-size:clamp(32px,3vw,48px)}
.faq .side figure{margin-top:40px}
.faq .text{grid-column:5/13;columns:2;column-gap:56px}
.faq .text p{break-inside:avoid;margin-bottom:20px}
.faq .text p b{font-weight:500}

/* footer */
footer{background:var(--night);color:var(--bg);min-height:90svh;display:flex;flex-direction:column;justify-content:space-between;padding:40px var(--m)}
footer .tr{display:flex;justify-content:space-between;gap:var(--m);font-size:15px}
footer .tr p{max-width:52ch}
footer .mail{font:400 clamp(44px,12.5vw,220px)/.9 var(--display);letter-spacing:-.02em;text-decoration:none;display:block;margin:12vh 0 40px;white-space:nowrap}
footer .mail:hover{color:var(--marigold)}
footer .meta{display:flex;justify-content:space-between;gap:var(--m);font-size:14px;flex-wrap:wrap}
footer .meta .credits{max-width:60ch;opacity:.9}
footer .meta p:first-child a{margin-right:16px}

@media (max-width:860px){
  .hero::after{inset:46% 0 0}
  .hero .slice.top{bottom:54%}
  .hero .slice.bot{top:46%}
  .hero h1,.hero .h1copy{font-size:21vw}
  .hero .sub{text-align:left;font-size:18px}
  .intro h2,.intro .note{grid-column:1/-1}.intro .note{margin-top:20px}
  .intro .stores{font-size:19px}
  .facts{display:grid;grid-template-columns:1fr 1fr;row-gap:32px}
  .facts div:first-child{grid-column:1/-1}
  .intro .shots figure:nth-child(n){grid-column:span 6;margin-top:0}
  .intro .shots figure:nth-child(3){display:none}
  .answer .route,.answer ul{grid-column:1/-1}
  .check input{font-size:11vw}
  .exams .row{grid-template-columns:1fr auto;row-gap:0}
  .exams .row span:nth-child(2){grid-column:1;color:var(--muted);font-size:14px;order:3}
  .exams .row span:nth-child(3){order:2}
  .exams .row span:nth-child(4){display:none}
  .exams .head{display:none!important}
  .proof .say,.proof figure{grid-column:1/-1}
  .ptable{display:none}.mplans{display:grid;gap:24px;margin-top:40px}
  .mplans div{background:var(--surface);padding:24px}
  .mplans div.best{background:var(--tint)}
  .mplans b{display:block;font:400 9vw/.95 var(--display);text-transform:uppercase}
  .mplans p{margin-top:12px}.mplans .btn{margin-top:20px;width:100%;font-size:19px}
  .faq .side,.faq .text{grid-column:1/-1}.faq .text{columns:1}
  .faq .side figure{display:none}
  footer .tr,footer .meta{flex-direction:column}
  footer .mail{font-size:12.5vw}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .in>*{opacity:1;transform:none}
}

/* subpages: /knm, /welk-examen */
.subbar{display:flex;justify-content:space-between;align-items:center;gap:var(--m);padding-top:28px}
.lede{display:grid;grid-template-columns:repeat(12,1fr);gap:0 var(--m);padding-bottom:clamp(96px,10vw,160px)}
.lede .say{grid-column:1/8;padding-top:clamp(56px,7vw,112px)}
.lede h1{font-size:clamp(64px,9.5vw,160px);line-height:.86}
.lede .sub{margin-top:36px;max-width:38ch;font-size:var(--step-lead);line-height:1.35}
.lede .go{margin-top:32px;display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.lede figure{grid-column:8/13;align-self:end}
.lede .facts{grid-column:1/-1}
.lede .src{grid-column:1/-1;margin-top:24px;font-size:var(--step-small);color:var(--muted);max-width:70ch}
.how .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--m)}
.how h2{grid-column:1/-1;margin-bottom:clamp(40px,5vw,72px)}
.how .txt{grid-column:1/7;font-size:var(--step-lead);line-height:1.4}
.how .txt p+p{margin-top:20px}
.how dl{grid-column:8/13}
.how dt{font-size:var(--step-small);color:var(--muted);margin-top:24px}
.how dt:first-child{margin-top:0}
.how dd{margin-top:4px}
.exams .note{margin-top:32px;max-width:60ch}
.more{background:var(--surface)}
.more .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--m);align-items:start}
.more .opts2{grid-column:1/7}
.more .opts2 div{padding:32px 0}
.more .opts2 b{display:block;font:400 clamp(32px,3.4vw,56px)/.95 var(--display);text-transform:uppercase}
.more .opts2 p{margin-top:12px;max-width:44ch}
.more .opts2 .acts{margin-top:20px;display:flex;gap:16px 24px;flex-wrap:wrap;align-items:center;font-weight:500}
.more .shots{grid-column:8/13;display:grid;grid-template-columns:1fr 1fr;gap:var(--m)}
.more .shots figure:nth-child(2){margin-top:8vw}
@media (max-width:860px){
  .subbar .btn{display:none}
  .lede .say,.lede figure{grid-column:1/-1}
  .lede figure{margin-top:40px}
  .how .txt,.how dl{grid-column:1/-1}
  .how dl{margin-top:24px}
  .more .opts2,.more .shots{grid-column:1/-1}
  .more .shots figure:nth-child(2){margin-top:0}
}