/* SEO AI, Spectrum V4.1: the Free Audit Preview, form states and footer, on top of v36.css.
   Existing tokens only (ink, text, muted, line, ice, cloud, cobalt #0870E6, deep #0058C9, the Spectrum accents). */

/* ---------- Free Audit Preview: one dominant document, a tab list beside it */
.pv{padding:130px var(--gut) 40px}
.pv-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:64px;align-items:center}
.pv-side{position:relative}
.pv-side::before{content:"";position:absolute;z-index:-1;inset:-50px -70px;pointer-events:none;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,.85) 65%,rgba(255,255,255,0))}
.pv h2{font-size:46px;line-height:1.04;letter-spacing:-.04em;font-weight:800;color:var(--ink);text-wrap:balance}
.pv-lead{margin-top:16px;font-size:18.5px;line-height:1.5;color:var(--text)}
.pv-tabs{position:relative;margin-top:30px;display:grid;gap:4px}
.pv-tabs [role=tab]{position:relative;z-index:1;display:grid;gap:3px;text-align:left;padding:16px 18px 16px 22px;border-radius:14px;transition:background-color .3s ease}
.pv-tabs [role=tab] b{font-size:19px;letter-spacing:-.015em;color:#4A6595;transition:color .3s ease}
.pv-tabs [role=tab] span{font-size:15px;line-height:1.45;color:#4A6595}
.pv-tabs [role=tab][aria-selected=true] b{color:var(--ink)}.pv-tabs [role=tab][aria-selected=true] span{color:var(--text)}
.pv-tabs [role=tab]:hover:not([aria-selected=true]){background:rgba(230,240,253,.6)}
.pv-ind{position:absolute;z-index:0;left:0;top:0;width:100%;border-radius:14px;background:#fff;box-shadow:inset 4px 0 0 #0870E6,0 1px 2px rgba(11,42,102,.06),0 18px 36px -24px rgba(8,80,180,.45);transition:transform .55s cubic-bezier(.65,0,.35,1),height .55s cubic-bezier(.65,0,.35,1)}
.pv-cta{margin-top:28px}
.pv-doc-wrap{position:relative;perspective:1600px}
.pv-doc{position:relative;min-height:470px;display:grid;grid-template-rows:auto 1fr auto;border-radius:22px;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);transform-origin:50% 60%}
.pv-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 30px;border-bottom:1px solid var(--line)}
.pv-title{font-size:15.5px;font-weight:700;color:var(--ink)}
.pv-tag{font-size:13px;font-weight:700;color:#0A6F94;background:#E7F7FC;border-radius:999px;padding:5px 12px}
.pv-body{position:relative;display:grid;padding:30px}
.pv-pane{grid-area:1/1}
.pv-h{font-size:30px;line-height:1.1;letter-spacing:-.03em;font-weight:800;color:var(--ink);text-wrap:balance}
.pv-list{margin-top:22px;display:grid;gap:10px}
.pv-list li{display:grid;grid-template-columns:36px 1fr auto;gap:14px;align-items:start;padding:16px 18px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--line)}
.pv-list li.top{box-shadow:inset 0 0 0 2px #0870E6;background:linear-gradient(90deg,#F2F7FE,#fff)}
.pv-rank{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-size:15px;font-weight:800;color:#0870E6;background:#E6F0FD}
.pv-list li.top .pv-rank{color:#fff;background:#0870E6}
.pv-list b{display:block;font-size:17px;line-height:1.3;color:var(--ink)}.pv-list div>span{display:block;margin-top:4px;font-size:15px;line-height:1.45;color:var(--text)}
.pv-list em{font-style:normal;font-size:12.5px;font-weight:700;color:#0870E6;background:#E6F0FD;border-radius:999px;padding:4px 10px;white-space:nowrap}
.pv-two{margin-top:22px;display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:start}
.pv-shot{border-radius:14px;padding:12px;background:var(--cloud);box-shadow:inset 0 0 0 1px var(--line)}
.pv-mini{border-radius:9px;background:#fff;padding:12px 12px 16px;box-shadow:0 8px 20px -14px rgba(8,80,180,.45)}
.m-nav{font-size:10px;font-weight:800;color:var(--ink)}
.m-h{position:relative;display:inline-block;margin:14px 0 10px;font-size:24px;line-height:1;font-weight:800;color:var(--ink);padding:3px 6px;border-radius:6px;box-shadow:0 0 0 2px #27CBF5}
.m-p{height:6px;border-radius:3px;background:var(--ice);margin-top:6px}.m-p.s{width:64%}
.m-b{display:block;width:56px;height:14px;margin-top:12px;border-radius:5px;background:#0870E6}
.pv-dl{display:grid;gap:16px}
.pv-dl dt{font-size:14px;font-weight:700;color:#0870E6}
.pv-dl dd{margin:4px 0 0;font-size:16.5px;line-height:1.5;color:var(--ink)}
.pv-step{margin-top:18px;font-size:20px;line-height:1.4;font-weight:700;color:var(--ink)}
.pv-step q{display:block;margin-top:10px;padding-left:16px;font-size:24px;letter-spacing:-.02em;color:#8F5E00;box-shadow:inset 3px 0 0 #FFC65A;quotes:"“" "”"}
.pv-small{margin-top:12px;font-size:15px;color:var(--text)}
.pv-flow{margin-top:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;counter-reset:f}
.pv-flow li{position:relative;padding:14px 16px 14px 16px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--line);counter-increment:f}
.pv-flow li::before{content:counter(f);display:grid;place-items:center;width:24px;height:24px;margin-bottom:8px;border-radius:50%;font-size:12.5px;font-weight:800;color:#0870E6;background:#E6F0FD}
.pv-flow b{display:block;font-size:16px;color:var(--ink)}.pv-flow span{display:block;margin-top:3px;font-size:14px;line-height:1.4;color:var(--text)}
.pv-foot{padding:16px 30px;border-top:1px solid var(--line);font-size:14.5px;color:var(--text);display:flex;align-items:center;gap:10px}
.pv-foot::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:#19BCA9}
.pv-note{max-width:1240px;margin:38px auto 0;font-size:15.5px;line-height:1.55;color:var(--text);text-align:center;position:relative}
.pv-note::before{content:"";position:absolute;z-index:-1;inset:-14px -40px;pointer-events:none;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0))}

/* ---------- form states: errors on leaving a field, cleared as it is fixed, confirmed when valid */
.f{position:relative}
input[data-ok=true]{border-color:#19BCA9;background-image:linear-gradient(transparent,transparent)}
.ok-mark{position:absolute;right:14px;top:41px;width:22px;height:22px;border-radius:50%;background:#0A7569;opacity:0;transform:scale(.8);transition:opacity .2s ease,transform .25s cubic-bezier(.16,1,.3,1);pointer-events:none}
.ok-mark::after{content:"";position:absolute;left:7px;top:4px;width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
input[data-ok=true]+.ok-mark{opacity:1;transform:none}

/* ---------- footer: light, fuller, connected to the ribbon's last curve */
.ft{position:relative;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.88),#fff)}
.ft-in{max-width:var(--max);margin:0 auto;padding:56px var(--gut) 40px;display:grid;grid-template-columns:minmax(0,1.2fr) auto;gap:22px 48px;align-items:start}
.ft-brand{display:grid;gap:14px;max-width:440px}.ft-brand img{width:104px;height:auto}
.ft-brand p{font-size:15.5px;line-height:1.55;color:var(--text)}
.ft nav{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:flex-end;font-size:15.5px;font-weight:700;color:var(--ink);padding-top:8px}
.ft nav a:hover{color:#0870E6}.ft nav [aria-current]{color:#0870E6}
.ft-mail{grid-column:2;justify-self:end;font-size:15px;color:var(--text)}.ft-mail a{color:var(--deep);font-weight:700}
.ft-small{grid-column:1/-1;padding-top:22px;border-top:1px solid var(--line);font-size:13.5px;color:var(--text)}

@media (prefers-reduced-motion:reduce){.pv-ind,.pv-tabs [role=tab],.ok-mark{transition:none!important}}
@media (max-width:1100px){
  .pv-grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .pv-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.pv-tabs [role=tab] span{display:none}.pv-tabs [role=tab]{padding:14px 16px;text-align:center}
  .pv-ind{box-shadow:inset 0 -3px 0 #0870E6,0 1px 2px rgba(11,42,102,.06),0 18px 36px -24px rgba(8,80,180,.45)}
}
@media (max-width:760px){
  .pv{padding:96px var(--gut) 20px}.pv h2{font-size:34px}.pv-lead{font-size:17px}
  .pv-tabs [role=tab]{padding:12px 8px}.pv-tabs [role=tab] b{font-size:15px}
  .pv-top{padding:16px 18px;flex-wrap:wrap}.pv-body{padding:20px 18px}.pv-foot{padding:14px 18px}
  .pv-h{font-size:23px}.pv-list li{grid-template-columns:30px 1fr;padding:14px}.pv-list em{grid-column:2;justify-self:start}
  .pv-two{grid-template-columns:1fr}.pv-shot{max-width:220px}
  .pv-step q{font-size:20px}.pv-flow{grid-template-columns:1fr}
  .pv-cta{width:100%;justify-content:center}
  .ft-in{grid-template-columns:1fr}.ft nav{justify-content:flex-start}.ft-mail{grid-column:1;justify-self:start}
}
.pv-pane[hidden]{display:block!important;visibility:hidden}
/* phones and tablets: tabs, then the document, then the action */
@media (max-width:1100px){
  .pv-side{display:contents}.pv-grid{gap:0}
  .pv h2{order:1}.pv-lead{order:2}.pv-tabs{order:3;margin-bottom:22px}.pv-doc-wrap{order:4}.pv-cta{order:5;justify-self:start;margin-top:26px}
}
@media (max-width:760px){.pv-cta{justify-self:stretch}}
.ft-brand{grid-row:span 2}.ft-mail{align-self:start}@media (max-width:760px){.ft-brand{grid-row:auto}}
/* email-app fallback: the address is always visible and copyable */
.a-result .fallback{display:block;margin-top:10px;padding-top:10px;border-top:1px solid rgba(8,112,230,.18)}
.a-result .addr{font-weight:700;color:var(--deep);user-select:all}
.a-result .copy{margin-left:8px;padding:6px 12px;border-radius:999px;font-size:14px;font-weight:700;color:#0870E6;background:#fff;box-shadow:inset 0 0 0 1.5px #B9CDE9;cursor:pointer}
.a-result .copy:hover{background:#E6F0FD}
@media (max-width:760px){.how{font-size:15px}.audit label{font-size:15.5px}.req,.opt{font-size:13.5px}.a-result .copy{display:block;margin:10px 0 0}}

/* the preview's panes sit on white so the incoming one fully covers the outgoing one */
.pv-pane{background:#fff}
/* Before/After is complete on the first frame; transitions only once the visitor uses it */
.cmp4-still .cmp4-ind,.cmp4-still .cmp4-ctl button,.cmp4-still .cmp4-a,.cmp4-still figcaption p{transition:none!important}