/* OptiWolf marketing-site — free CRO scanner page. Shared chrome is in site.css. */

/* hero */
.hero{text-align:center;padding:76px 0 60px;background:
  radial-gradient(800px 400px at 50% 0%,rgba(47,217,194,.12),transparent 60%),var(--page);}
.eyebrow{display:inline-flex;align-items:center;gap:.5em;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:6px 14px;font-size:.8rem;font-weight:600;color:var(--teal-700);box-shadow:var(--sh-sm);margin-bottom:22px;}
.hero h1{font-size:clamp(2.4rem,5vw,3.4rem);max-width:760px;margin:0 auto;}
.hero h1 em{font-style:normal;color:var(--teal-600);}
.hero .lead{font-size:1.2rem;color:var(--ink-soft);max-width:560px;margin:18px auto 30px;}
.scanform{display:flex;gap:10px;max-width:540px;margin:0 auto;background:var(--surface);border:1px solid var(--border-strong);border-radius:14px;padding:8px;box-shadow:var(--sh-md);}
.scanform input{flex:1;border:none;border-radius:9px;padding:.8em 1em;font-family:var(--body);font-size:1.02rem;color:var(--ink);}
.scanform input:focus{outline:none;}
@media(max-width:540px){.scanform{flex-direction:column;}}
.note{margin-top:14px;font-size:.85rem;color:var(--muted);}
.note b{color:var(--teal-700);}

/* interim "scanner coming soon" notice (shown after submit until project #9 ships) */
.scan-soon{max-width:540px;margin:20px auto 0;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--teal-500);border-radius:0 12px 12px 0;padding:18px 20px;box-shadow:var(--sh-sm);text-align:left;display:flex;flex-direction:column;gap:8px;align-items:flex-start;}
.scan-soon strong{color:var(--navy-900);font-family:var(--display);}
.scan-soon span{color:var(--ink-soft);font-size:.95rem;}
.scan-soon .btn{margin-top:4px;}

/* checks */
.sec{padding:72px 0;}
.sec-head{text-align:center;max-width:640px;margin:0 auto 44px;}
.caption{font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;font-weight:700;color:var(--teal-700);}
.sec-head h2{font-size:clamp(1.8rem,3.4vw,2.3rem);margin:.4rem 0 .5rem;}
.sec-head p{color:var(--muted);margin:0;font-size:1.05rem;}
.checks{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media(max-width:860px){.checks{grid-template-columns:1fr;}}
.check{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:var(--sh-sm);}
.check .i{flex:none;width:40px;height:40px;border-radius:10px;background:var(--navy-50);color:var(--teal-700);display:grid;place-content:center;}
.check .i svg{width:20px;height:20px;}
.check h4{font-size:1.02rem;margin-bottom:3px;}
.check p{margin:0;color:var(--muted);font-size:.9rem;}

/* sample report */
.report{background:var(--surface);}
.report .grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center;}
@media(max-width:860px){.report .grid{grid-template-columns:1fr;}}
.report h2{font-size:clamp(1.8rem,3.4vw,2.3rem);}
.report p{color:var(--muted);font-size:1.05rem;margin:14px 0 22px;}
.mock{background:var(--page);border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:var(--sh-lg);}
.mock .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.mock .grade{display:flex;align-items:baseline;gap:8px;}
.mock .grade .g{font-family:var(--display);font-weight:700;font-size:2rem;color:var(--navy-900);}
.mock .grade .l{font-size:.8rem;color:var(--muted);}
.mock .opp{font-family:var(--display);font-weight:700;color:var(--teal-700);font-size:1.1rem;}
.frow{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:11px 13px;margin:8px 0;}
.frow .r{font-family:var(--display);font-weight:700;color:var(--teal-700);font-size:.9rem;width:14px;}
.frow .t{flex:1;font-size:.9rem;color:var(--ink);font-weight:500;}
.sev{font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:999px;}
.sev.h{background:var(--hi-bg);color:var(--hi);}.sev.m{background:var(--med-bg);color:var(--med);}
.ice{font-family:var(--display);font-weight:700;color:var(--navy-900);font-size:.9rem;}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media(max-width:860px){.steps{grid-template-columns:1fr;}}
.step{text-align:center;}
.step .n{font-family:var(--display);font-weight:700;color:#fff;background:var(--grad-navy);width:46px;height:46px;border-radius:13px;display:grid;place-content:center;margin:0 auto 16px;box-shadow:var(--sh-md);}
.step h4{font-size:1.1rem;margin-bottom:6px;}
.step p{color:var(--muted);margin:0;font-size:.95rem;}

/* cta */
.cta .box{background:var(--grad-navy);border-radius:24px;padding:52px;text-align:center;box-shadow:var(--sh-lg);position:relative;overflow:hidden;}
.cta .box::after{content:"";position:absolute;right:-60px;top:-60px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(47,217,194,.26),transparent 65%);}
.cta h2{color:#fff;position:relative;}
.cta p{color:var(--navy-200);position:relative;max-width:520px;margin:12px auto 24px;}
.cta .row{position:relative;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}