/* SEO AI, Spectrum V4: lead-generation refinements on top of v35.css. Same tokens; light only; no eyebrows. */

/* ---------- hero: offer first */
.hero-side{grid-template-columns:minmax(0,560px) minmax(0,520px);align-items:end}
.hero-side>p:first-child{align-self:start}
.quick label{display:block;margin-bottom:8px;font-size:15px;font-weight:700;color:var(--ink)}
.q-row{display:flex;gap:10px}
.q-row input{flex:1;min-width:0}
.alt-row{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:-4px}
.alt-row .tlink{color:var(--deep);font-size:15.5px}.alt-row .status{margin:0}
input,textarea{font:inherit;font-size:17px;color:var(--ink);background:#fff;border:1.5px solid #B9CDE9;border-radius:12px;padding:0 16px;height:56px;width:100%;transition:border-color .2s ease,box-shadow .2s ease}
textarea{height:auto;padding:14px 16px;resize:vertical;line-height:1.5}
input::placeholder,textarea::placeholder{color:#7489AE}
input:focus,textarea:focus{outline:none;border-color:#0870E6;box-shadow:0 0 0 4px rgba(8,127,255,.16)}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:#C3364A;box-shadow:0 0 0 4px rgba(195,54,74,.12)}
.err{min-height:0;margin-top:6px;font-size:14px;font-weight:600;color:#C3364A}
.err:empty{display:none}
.btn{cursor:pointer;border:0}

/* ---------- one clear Before / After comparison */
.cmp4{position:relative;max-width:1060px;margin:46px auto 0;display:grid;justify-items:center;gap:18px}
.cmp4-ctl{position:relative;display:flex;padding:5px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px rgba(11,42,102,.08),0 14px 30px -20px rgba(8,80,180,.5)}
.cmp4-ctl button{position:relative;z-index:1;min-width:120px;padding:11px 22px;border-radius:999px;font-size:16px;font-weight:700;color:#4A6595;transition:color .35s ease}
.cmp4-ctl button[aria-pressed=true]{color:#fff}
.cmp4-ind{position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:#0870E6;transition:transform .55s cubic-bezier(.65,0,.35,1),background-color .4s ease}
.cmp4-win[data-v=after]~* .x{display:none}
.cmp4-win{position:relative;width:100%;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.7),0 2px 4px rgba(11,42,102,.08),0 50px 90px -40px rgba(8,80,180,.55)}
.cmp4-pg .site{height:100%}
.cmp4-a{position:absolute;inset:0;clip-path:inset(0 0 0 0);transition:clip-path .8s cubic-bezier(.65,0,.35,1)}
.cmp4-win[data-v=before] .cmp4-a{clip-path:inset(0 0 0 100%)}
.cmp4 .fl .f-welcome{font-size:58px}.cmp4 .fl .f-h1{font-size:40px;line-height:1.06;max-width:440px}
.cmp4 .s-hero{grid-template-columns:1.05fr .95fr;gap:36px;padding:28px 38px 30px}.cmp4 .s-nav{padding:20px 38px}
.cmp4 .s-img img{height:300px;border-radius:14px}.cmp4 .s-more{padding:4px 38px 34px}
.cmp4 figcaption{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.cmp4 figcaption p{font-size:15.5px;line-height:1.5;color:var(--text);padding:14px 18px;border-radius:14px;background:rgba(255,255,255,.88);box-shadow:0 0 0 1px rgba(11,42,102,.06);transition:box-shadow .4s ease}
.cmp4 figcaption b{display:block;margin-bottom:2px;font-size:16px;color:var(--ink)}
.cmp4[data-v=before] .c-b,.cmp4[data-v=after] .c-a{opacity:1;box-shadow:0 0 0 2px #0870E6}
.cmp4[data-v=after] .c-a b{color:#0A7569}
.cmp4-note{font-size:13px;color:var(--text)}

/* ---------- what the free review includes */
.value{padding:130px var(--gut) 40px}
.val-in{max-width:1180px;margin:0 auto;position:relative}
.val-in::before{content:"";position:absolute;z-index:-1;inset:-40px -80px;pointer-events:none;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,.85) 65%,rgba(255,255,255,0))}
.value h2{font-size:52px;line-height:1.04;letter-spacing:-.04em;font-weight:800;color:var(--ink);max-width:760px}
.val-list{margin-top:40px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:2px solid #0870E6}
.val-list li{padding:26px 34px 0 0}
.val-list li+li{padding-left:34px;border-left:1px solid var(--line)}
.val-list h3{font-size:24px;line-height:1.15;letter-spacing:-.02em;font-weight:800;color:var(--ink)}
.val-list p{margin-top:10px;font-size:17px;line-height:1.55;color:var(--text)}
.val-note{margin-top:36px;max-width:820px;font-size:16.5px;line-height:1.55;color:var(--text)}
.val-cta{margin-top:26px}

/* ---------- process: one clear next step */
.s3-next{margin-top:36px;text-align:center}

/* ---------- the enquiry */
.end{padding:130px var(--gut) 300px}
.end-in{max-width:780px}
.end-lead{margin:20px auto 0;max-width:620px;font-size:19px;line-height:1.55;color:var(--text)}
.audit{margin-top:34px;width:100%;text-align:left;display:grid;gap:18px;padding:34px;border-radius:24px;background:#fff;box-shadow:0 0 0 1px rgba(11,42,102,.06),0 2px 6px rgba(11,42,102,.05),0 50px 90px -42px rgba(8,80,180,.5)}
.audit label{display:flex;align-items:baseline;gap:8px;margin-bottom:7px;font-size:15px;font-weight:700;color:var(--ink)}
.req,.opt{font-size:13px;font-weight:600;color:#4A6595}.req{color:#0870E6}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.a-send{justify-self:start;margin-top:4px}
.a-send[disabled]{opacity:.6;cursor:progress}
.how{font-size:14px;line-height:1.5;color:#4A6595}
.a-result:empty{display:none}
.a-result{padding:16px 18px;border-radius:14px;font-size:15.5px;line-height:1.5;color:var(--ink);background:#E6F0FD;box-shadow:inset 3px 0 0 #0870E6}
.a-result.bad{background:#FFF0F2;box-shadow:inset 3px 0 0 #C3364A}
.a-result a{color:var(--deep);font-weight:700}
.end-alt{margin-top:24px;font-size:15.5px;color:var(--text)}.end-alt a{color:var(--deep);font-weight:700}.end-alt span{color:#4A6595;margin-left:6px}
.end-in::before{inset:-60px -110px}

/* ---------- the living ribbon, a little more alive (same artwork and colours) */
@media (prefers-reduced-motion:no-preference){
  .rb-glow{animation:rbFlowA 18s ease-in-out infinite alternate}
  .rb-core{animation:rbFlowB 23s ease-in-out infinite alternate}
  .rb-glint{opacity:.95;animation-duration:20s}.rb-glint.g2{animation-delay:-10s}
  @keyframes rbFlowA{0%{transform:none;opacity:1}33%{transform:translate(-44px,30px) rotate(-1deg) scale(1.04);opacity:.74}66%{transform:translate(30px,-22px) rotate(.7deg) scale(.985);opacity:.92}100%{transform:translate(-14px,-34px) rotate(-.4deg) scale(1.025);opacity:.8}}
  @keyframes rbFlowB{0%{transform:none}33%{transform:translate(40px,-20px) rotate(.85deg) scale(1.03)}66%{transform:translate(-26px,28px) rotate(-.6deg) scale(1.012)}100%{transform:translate(18px,16px) rotate(.35deg) scale(1.02)}}
}

@media (max-width:1180px){.hero-side{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){
  .q-row{flex-direction:column}.q-row input{flex:none}.q-row .btn{justify-content:center}
  .cmp4-ctl button{min-width:104px;padding:10px 18px;font-size:15px}
  .cmp4 .fl .f-welcome{font-size:44px}.cmp4 .fl .f-h1{font-size:30px}
  .cmp4 .s-hero{grid-template-columns:1fr;padding:18px 20px}.cmp4 .s-img img{height:180px}.cmp4 .s-nav{padding:14px 20px}.cmp4 .s-nav span{display:none}.cmp4 .s-more{padding:4px 20px 22px}
  .cmp4 figcaption{grid-template-columns:1fr;gap:10px}
  .value{padding:96px var(--gut) 20px}.value h2{font-size:36px}
  .val-list{grid-template-columns:1fr}.val-list li,.val-list li+li{padding:22px 0 0;border-left:0}.val-list li+li{border-top:1px solid var(--line);margin-top:22px}
  .audit{padding:22px 18px}.f2{grid-template-columns:1fr}.a-send{justify-self:stretch;justify-content:center}
}
.ft p{color:var(--text)}
