/* SurveyQA AI — public landing page (builds on style.css tokens) */
.landing { background:#fff; scroll-behavior:smooth; }
html { scroll-behavior:smooth; scroll-padding-top:72px; }
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} .landing *{transition:none!important;animation:none!important} }

.skip-link{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;border-radius:8px;z-index:2000;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.skip-link:focus{left:8px}

.lp-nav{position:sticky;top:0;z-index:1030;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--sq-card-border)}
.lp-nav .navbar-brand{color:#1f2430}
.lp-nav .nav-link{color:#4b5163;font-weight:500}
.lp-nav .nav-link:hover,.lp-nav .nav-link:focus{color:var(--sq-primary)}
.landing :focus-visible{outline:3px solid rgba(41,82,227,.45);outline-offset:2px}

.lp-hero{padding:72px 0 80px;background:radial-gradient(1200px 500px at 85% -10%,#e3eaff 0,transparent 60%),linear-gradient(180deg,#f7f9ff,#fff)}
.lp-eyebrow{display:inline-block;font-size:.82rem;font-weight:600;color:var(--sq-primary-dark);background:#e8eeff;padding:.35rem .8rem;border-radius:999px;margin-bottom:1.1rem}
.lp-h1{font-size:clamp(2.1rem,4.6vw,3.3rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin-bottom:1.1rem;color:#141a33}
.lp-lead{font-size:1.1rem;color:#4b5163;max-width:34rem;margin-bottom:1.6rem}

.lp-preview{margin:0}
.lp-preview figcaption{font-size:.75rem;color:#7a8093;text-align:center;margin-top:.6rem}
.lp-win{background:#fff;border:1px solid var(--sq-card-border);border-radius:14px;box-shadow:0 24px 60px -20px rgba(30,63,184,.35);overflow:hidden;transition:transform .3s}
.lp-win:hover{transform:translateY(-4px)}
.lp-win-bar{display:flex;align-items:center;gap:6px;padding:.6rem .9rem;background:#f4f6fb;border-bottom:1px solid var(--sq-card-border)}
.lp-win-bar span{width:10px;height:10px;border-radius:50%;background:#d5d9e6}
.lp-win-bar em{font-style:normal;font-size:.75rem;color:#7a8093;margin-left:.5rem}
.lp-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
.lp-pane{padding:.9rem 1rem;border-right:1px solid var(--sq-card-border)}
.lp-pane:last-child{border-right:0}
.lp-pane-h{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#7a8093;margin-bottom:.6rem}
.lp-line{height:9px;border-radius:5px;background:#e7eaf3;margin:.5rem 0}
.lp-line.hl{background:#ffe3a3;box-shadow:0 0 0 3px #fff3d1}
.w45{width:45%}.w50{width:50%}.w55{width:55%}.w60{width:60%}.w62{width:62%}.w65{width:65%}.w70{width:70%}.w80{width:80%}
.lp-issues{border-top:1px solid var(--sq-card-border);padding:.5rem 1rem .8rem;background:#fcfcfe}
.lp-issue{display:flex;align-items:center;gap:.7rem;padding:.4rem 0}
.lp-issue .lp-line{margin:0;flex:0 1 auto}
.lp-issue b{margin-left:auto;font-size:.68rem;padding:.15rem .5rem;border-radius:999px;background:#fff3d1;color:#8a5a00}
.lp-issue b.ok{background:#d9f3e4;color:#146c43}
.lp-dot{width:9px;height:9px;border-radius:50%;flex:none}
.lp-dot.crit{background:var(--sq-critical)}.lp-dot.warn{background:var(--sq-high)}.lp-dot.ok{background:var(--sq-pass)}

.lp-section{padding:72px 0}
.lp-alt{background:var(--sq-bg)}
.lp-head{text-align:center;max-width:42rem;margin:0 auto 2.5rem}
.lp-head h2{font-weight:800;letter-spacing:-.01em;font-size:clamp(1.6rem,3vw,2.2rem);color:#141a33}
.lp-head p{color:#5b6277;margin:0}

.lp-card{background:#fff;border:1px solid var(--sq-card-border);border-radius:14px;padding:1.4rem;transition:transform .2s,box-shadow .2s,border-color .2s}
.lp-card:hover,.lp-card:focus{transform:translateY(-4px);box-shadow:0 14px 30px -14px rgba(30,63,184,.3);border-color:#c9d5ff}
.lp-card h3{font-size:1.02rem;font-weight:700;margin:.9rem 0 .4rem;color:#1f2430}
.lp-card p{font-size:.92rem;color:#5b6277;margin:0}
.lp-icon{width:44px;height:44px;border-radius:12px;background:#e8eeff;color:var(--sq-primary);display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem}
.lp-icon.lg{width:60px;height:60px;font-size:1.5rem;border-radius:16px}
.lp-icon.ok{background:#d9f3e4;color:var(--sq-pass)}

.lp-steps{display:flex;flex-direction:column;gap:.7rem}
.lp-step{width:100%;display:flex;align-items:center;gap:.9rem;text-align:left;background:#fff;border:1px solid var(--sq-card-border);border-radius:12px;padding:.9rem 1rem;transition:all .2s;cursor:pointer;color:#1f2430}
.lp-step:hover{border-color:#c9d5ff;transform:translateX(3px)}
.lp-step.active{border-color:var(--sq-primary);box-shadow:0 8px 22px -12px rgba(41,82,227,.5)}
.lp-step-n{width:34px;height:34px;border-radius:50%;background:#e8eeff;color:var(--sq-primary);font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:none;transition:all .2s}
.lp-step.active .lp-step-n{background:var(--sq-primary);color:#fff}
.lp-step-t{font-weight:600}
.lp-step-panel{height:100%;min-height:220px;background:#fff;border:1px solid var(--sq-card-border);border-radius:16px;padding:2rem;display:flex;flex-direction:column;justify-content:center}
.lp-step-panel h3{font-weight:700;margin:1rem 0 .5rem}
.lp-step-panel p{color:#5b6277;margin:0;font-size:1.02rem}

.lp-benefit{display:flex;align-items:center;gap:.9rem;height:100%;padding:1rem 1.1rem;border:1px solid var(--sq-card-border);border-radius:12px;background:#fff;transition:border-color .2s,box-shadow .2s}
.lp-benefit:hover{border-color:#c9d5ff;box-shadow:0 10px 24px -16px rgba(30,63,184,.4)}
.lp-benefit i{color:var(--sq-primary);font-size:1.1rem;width:24px;text-align:center}

.lp-cta{background:linear-gradient(135deg,#2952e3 0%,#1a2a63 100%);color:#fff}
.lp-cta h2{font-weight:800;font-size:clamp(1.6rem,3vw,2.2rem)}
.lp-cta-p{max-width:40rem;margin:.8rem auto 1.6rem;color:#dbe3ff}
.lp-cta-sub,.lp-cta-sub a{color:#dbe3ff}
.lp-footer{padding:1.5rem 0;border-top:1px solid var(--sq-card-border);font-size:.85rem;color:#7a8093}
.lp-footer a{color:#5b6277;text-decoration:none}.lp-footer a:hover{color:var(--sq-primary)}

.lp-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.modal .form-control:focus,.modal .form-select:focus{border-color:var(--sq-primary);box-shadow:0 0 0 .2rem rgba(41,82,227,.18)}

@media (max-width:575.98px){
  .lp-hero{padding:44px 0 56px}.lp-section{padding:52px 0}
  .lp-step-panel{padding:1.4rem}
}