/* Proof page commits to a single dark look on purpose: a launch stage. Colors are explicit. */
body.proof{--bar-bg:#0B1220;--bar-fg:#EEF1F7;--bar-fg-2:#A9B1C4;--bar-line:#26324C;background:#0B1220;color:#EEF1F7;color-scheme:dark;font-family:var(--display)}
.proof .eyebrow{color:#8D95A8}
.okc{color:#3CC7A7}.bad{color:#F06B6B}
.mono{font-family:var(--mono)}

/* hero */
.hero{padding-block:clamp(36px,6vw,72px) clamp(48px,7vw,88px);border-bottom:1px solid #26324C;overflow:hidden}
.hero-grid{display:grid;gap:28px}
.hero-head h1{font-weight:800;font-size:clamp(40px,7.2vw,92px);line-height:.96;max-width:16ch;margin-top:12px}
.exactq{margin:16px 0 0;font:500 13px/1.5 var(--mono);color:#8D95A8;max-width:70ch}
.exactq q{color:#C9CFDC}
.stage{display:grid;gap:14px;grid-template-columns:1fr;align-items:stretch}
@media (min-width:980px){.stage{grid-template-columns:1.15fr 1fr .9fr}}
.answers{display:grid;gap:10px;align-content:start;min-width:0}
.ans{border-radius:14px;padding:14px 16px;background:#121B2E;border:1px solid #26324C;min-width:0}
.ans .who{display:flex;justify-content:space-between;gap:10px;font:500 12px var(--mono);color:#8D95A8;letter-spacing:.06em;text-transform:uppercase}
.ans .big{font:800 clamp(28px,3.6vw,44px)/1.02 var(--display);letter-spacing:-.025em;margin:8px 0 6px}
.ans .q{font:400 15px/1.45 var(--serif);color:#C9CFDC;margin:0}
.ans.wrong .big{color:#F06B6B}.ans.wrong{border-color:#4A2430}
.ans.good{background:#0F2A27;border-color:#1E6B5C}
.ans.good .big{color:#3CC7A7;font-size:clamp(34px,4.6vw,58px)}
.ans .mark{font-weight:600}
.form{margin:0;background:#F3F4F1;color:#121826;border-radius:12px;padding:18px;position:relative;font-family:var(--serif);min-width:0;align-self:start}
.form-top{display:flex;justify-content:space-between;gap:8px;font:600 14px var(--display);border-bottom:2px solid #121826;padding-bottom:10px;margin-bottom:6px}
.form-top .mono{font:500 11px var(--mono);color:#6B7285}
.form-row{display:flex;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid #D9DCD6;font-size:17px}
.form-row .sig{font:italic 500 18px var(--serif);color:#14866F}
.form-row.no .sig{color:#9AA0AE;font-style:normal;font-size:15px}
.stamp{position:absolute;right:14px;bottom:-14px;transform:rotate(-7deg);border:3px solid #14866F;color:#14866F;font:800 18px/1 var(--display);letter-spacing:.06em;padding:8px 12px;border-radius:6px;background:#F3F4F1}
.land h2{font-size:clamp(30px,4.6vw,58px);line-height:1.02;font-weight:800;max-width:20ch}
.land p{font:400 clamp(18px,2vw,21px)/1.55 var(--serif);color:#C9CFDC;max-width:58ch;margin:16px 0 0}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

/* load sequence: elements rest visible; animation only plays the entrance */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes stampIn{0%{opacity:0;transform:rotate(-7deg) scale(1.6)}60%{opacity:1;transform:rotate(-7deg) scale(.94)}100%{opacity:1;transform:rotate(-7deg) scale(1)}}
.play .hero-head{animation:rise .7s .1s both}
.play .wrongs .ans{animation:rise .55s both}
.play .wrongs .ans:nth-child(1){animation-delay:1.1s}.play .wrongs .ans:nth-child(2){animation-delay:1.5s}.play .wrongs .ans:nth-child(3){animation-delay:1.9s}
.play .right .ans{animation:rise .7s 3s both}
.play .form{animation:rise .6s 4s both}
.play .stamp{animation:stampIn .5s 4.8s both}
.play .land{animation:rise .8s 5.6s both}

/* strip */
.strip{border-bottom:1px solid #26324C}
.strip-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0}
.strip-row>div{padding:22px 18px 22px 0;display:grid;gap:4px}
.strip-row b{font:700 19px var(--display)}
.strip-row span{font:400 15px var(--serif);color:#A9B1C4}

/* sections */
.sec-head{display:grid;gap:12px;margin-bottom:36px;max-width:780px}
.sec-head h2{font-size:clamp(32px,4.8vw,60px);line-height:1;font-weight:800}
.sec-head p{font:400 19px/1.55 var(--serif);color:#A9B1C4;margin:0}
.wins,.measured,.daily,.demo{padding-block:clamp(64px,9vw,120px);border-bottom:1px solid #26324C}

.win-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,255px),1fr));gap:14px}
.win{background:#121B2E;border:1px solid #26324C;border-radius:16px;padding:22px;display:grid;gap:14px;align-content:start;min-width:0}
.win .tag{display:flex;justify-content:space-between;gap:8px;font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#8D95A8}
.win h3{font-size:24px;line-height:1.15;font-weight:700}
.win .plain{font:italic 400 18px/1.4 var(--serif);color:#C9CFDC;margin:0}
.duel{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.duel>div{border-radius:12px;padding:12px 14px;min-width:0}
.duel .o{background:#2A1620}.duel .e{background:#0F2A27}
.duel small{display:block;font:500 11px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#A9B1C4}
.duel b{display:block;font:800 clamp(20px,2vw,26px)/1.1 var(--display);letter-spacing:-.02em;margin-top:6px;overflow-wrap:normal;word-break:normal;hyphens:none}
.duel .o b{color:#F06B6B}.duel .e b{color:#3CC7A7}
.duel b.long{font-size:16px;line-height:1.3;font-weight:600;font-family:var(--serif)}
.win .note{font:400 15px/1.5 var(--serif);color:#A9B1C4;margin:0}
.win details{font:500 13px/1.5 var(--mono);color:#8D95A8}
.win summary{cursor:pointer}
.win details ul{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:8px}
.win details li{font:400 14px/1.45 var(--serif);color:#C9CFDC}

.tests{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.test{background:#121B2E;border:1px solid #26324C;border-radius:16px;padding:22px;min-width:0}
.test.total{border-color:#1E6B5C;background:#0F2420;grid-column:1/-1}
.test h3{font-size:21px}
.test p{font:400 15px/1.45 var(--serif);color:#A9B1C4;margin:6px 0 16px}
.bar-row{display:grid;grid-template-columns:96px 1fr auto;gap:10px;align-items:center;margin:9px 0;font:500 14px var(--display)}
.track{display:block;height:12px;border-radius:99px;background:#1B263D;overflow:hidden}
.fill{display:block;height:100%;border-radius:99px;background:#5D6884;transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.bar-row.me .fill{background:#3CC7A7}.bar-row.me{color:#3CC7A7;font-weight:700}
.bar-row .n{font-variant-numeric:tabular-nums;white-space:nowrap}
.pre .fill{transform:scaleX(.02)}
.speed{margin-top:22px;background:#121B2E;border:1px solid #26324C;border-radius:16px;padding:22px}
.speed h3{font-size:21px}
.speed p{font:400 15px/1.45 var(--serif);color:#A9B1C4;margin:6px 0 14px}

.daily-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:28px}
.daily h3{font-size:22px;margin-bottom:8px}
.daily p{font:400 17px/1.55 var(--serif);color:#A9B1C4;margin:0}

.demo-grid{display:grid;gap:30px}
.demo h2{font-size:clamp(34px,5.4vw,68px);line-height:.98;font-weight:800;max-width:15ch;margin:12px 0 16px}
.demo p{font:400 19px/1.55 var(--serif);color:#A9B1C4;max-width:50ch;margin:0}
.mailbox{display:flex;flex-wrap:wrap;gap:12px;align-items:center;align-content:start}
.mail{font:500 clamp(17px,2.3vw,24px) var(--mono);padding:14px 18px;border-radius:12px;border:1px solid #26324C;background:#121B2E;user-select:all;overflow-wrap:anywhere}
#copied{flex-basis:100%;margin:0;min-height:1.4em;font:500 14px var(--mono);color:#3CC7A7}
.story-link{flex-basis:100%;font:600 17px var(--display);color:#EEF1F7}
@media (min-width:900px){.demo-grid{grid-template-columns:1.2fr 1fr;align-items:end}}
.proof .foot{color:#8D95A8;border-top:0}
.reveal{transition:opacity .7s,transform .7s}
.reveal.pre-r{opacity:.35;transform:translateY(16px)}
@media (max-width:700px){
  .hero-head h1{font-size:clamp(34px,10vw,48px)}
  .exactq{font-size:12px}
  .wrongs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .wrongs .ans{padding:10px}
  .wrongs .ans .who{font-size:10px;flex-direction:column;gap:2px}
  .wrongs .ans .big{font-size:19px;margin:6px 0 0}
  .wrongs .ans .q{display:none}
  .ans.good .big{font-size:40px}
}
