/* ============================================================
   SEO AUDIT PAGE — seo-audit-services.html
   Page-specific styles. Loaded render-blocking after sage-nav.css.
   Shared components (related-services, proof-strip, footer) come from
   sage-site-components.css. Hero shell + base live in the page's
   critical inline CSS (for CLS), matching the seo-services pattern.
   ============================================================ */

/* ── Section heading helper ── */
.aud-section{padding:78px 0}
.aud-section--dark{background:#020c1b}
.aud-section--alt{background:#f6f8fc}
.aud-head{text-align:center;max-width:780px;margin:0 auto}
.aud-eyebrow{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#1763c4;margin-bottom:10px;display:block}
.aud-head h2{font-size:clamp(24px,3vw,34px);font-weight:600;color:#111;line-height:1.25;margin-bottom:14px}
.aud-head p{color:#525a6b;font-size:16px;line-height:1.7}
.aud-section--dark .aud-eyebrow{color:#caef45}
.aud-section--dark .aud-head h2{color:#fff}
.aud-section--dark .aud-head p{color:rgba(255,255,255,0.72)}

/* ── Hero bullets ── */
.aud-hero-bullets{list-style:none;margin:24px 0 0;padding:0}
.aud-hero-bullets li{position:relative;padding-left:30px;margin-bottom:12px;color:rgba(255,255,255,0.9);font-size:16px;line-height:1.5}
.aud-hero-bullets li::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:50%;background:#caef45;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z' fill='black'/></svg>") center/14px no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z' fill='black'/></svg>") center/14px no-repeat}

/* ══════════════════════════════════════════
   HERO SCORECARD (signature visual) + animation
   ══════════════════════════════════════════ */
.aud-scorecard{background:#0b1830;border:1px solid rgba(255,255,255,0.10);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,0.45);overflow:hidden;width:100%;position:relative}
/* one-time scan shimmer on load */
.aud-scorecard::after{content:"";position:absolute;left:0;right:0;top:0;height:48px;background:linear-gradient(180deg,rgba(202,239,69,0.22),transparent);transform:translateY(-60px);animation:aud-scan 2s ease-in-out .25s 1 forwards;pointer-events:none;z-index:3}
@keyframes aud-scan{0%{transform:translateY(-60px);opacity:1}70%{transform:translateY(380px);opacity:1}100%{transform:translateY(380px);opacity:0}}
.aud-sc-head{display:flex;align-items:center;gap:8px;padding:14px 18px;background:rgba(255,255,255,0.04);border-bottom:1px solid rgba(255,255,255,0.08)}
.aud-sc-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0}
.aud-sc-dot--r{background:#ff5f57}.aud-sc-dot--y{background:#febc2e}.aud-sc-dot--g{background:#28c840}
.aud-sc-title{margin-left:8px;font-size:13px;font-weight:600;color:rgba(255,255,255,0.75)}
.aud-sc-body{padding:22px 22px 24px}
.aud-sc-overall{display:flex;align-items:center;gap:18px;margin-bottom:22px}
.aud-sc-grade{width:84px;height:84px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:700;background:conic-gradient(#caef45 72%,rgba(255,255,255,0.12) 0);position:relative}
.aud-sc-grade::after{content:"";position:absolute;inset:7px;border-radius:50%;background:#0b1830}
.aud-sc-grade span{position:relative;z-index:1;color:#caef45}
.aud-sc-overall-meta .aud-sc-overall-num{font-size:15px;font-weight:600;color:#fff}
.aud-sc-overall-meta .aud-sc-overall-sub{font-size:13px;color:rgba(255,255,255,0.6)}
.aud-sc-row{display:grid;grid-template-columns:120px 1fr 38px;align-items:center;gap:12px;margin-bottom:13px}
.aud-sc-label{font-size:13px;color:rgba(255,255,255,0.82)}
.aud-sc-bar{height:8px;border-radius:6px;background:rgba(255,255,255,0.10);overflow:hidden}
.aud-sc-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,#29abe2,#caef45);transform:scaleX(0);transform-origin:left center;animation:aud-bar .9s cubic-bezier(.2,.8,.2,1) .35s forwards}
.aud-sc-fill--warn{background:linear-gradient(90deg,#febc2e,#ff8a3c)}
.aud-sc-fill--bad{background:linear-gradient(90deg,#ff8a3c,#ff5f57)}
.aud-sc-body > .aud-sc-row:nth-child(2) .aud-sc-fill{animation-delay:.35s}
.aud-sc-body > .aud-sc-row:nth-child(3) .aud-sc-fill{animation-delay:.47s}
.aud-sc-body > .aud-sc-row:nth-child(4) .aud-sc-fill{animation-delay:.59s}
.aud-sc-body > .aud-sc-row:nth-child(5) .aud-sc-fill{animation-delay:.71s}
.aud-sc-body > .aud-sc-row:nth-child(6) .aud-sc-fill{animation-delay:.83s}
@keyframes aud-bar{to{transform:scaleX(1)}}
.aud-sc-score{font-size:13px;font-weight:700;color:#fff;text-align:right}
.aud-sc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,0.08);font-size:13px}
.aud-sc-foot .aud-sc-issues{color:#ff8a3c;font-weight:600}
.aud-sc-foot .aud-sc-crit{color:rgba(255,255,255,0.6)}
@media (prefers-reduced-motion: reduce){
  .aud-scorecard::after{display:none}
  .aud-sc-fill{transform:none;animation:none}
}

/* ── What we cover grid ── */
.aud-cover-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
.aud-cover-card{background:#fff;border:1px solid #e7e9f2;border-radius:14px;padding:24px 22px;transition:transform .15s ease,box-shadow .15s ease}
.aud-cover-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(13,18,45,.10)}
.aud-cover-card h3{font-size:18px;font-weight:600;color:#14172e;margin-bottom:8px}
.aud-cover-card h3 a{color:#14172e}
.aud-cover-card h3 a:hover{color:#1763c4}
.aud-cover-card p{font-size:14.5px;line-height:1.6;color:#525a6b;margin:0}
.aud-cover-card .aud-cover-soon{display:inline-block;font-size:11px;font-weight:600;color:#1763c4;background:#eef4ff;border-radius:20px;padding:2px 10px;margin-top:12px}
@media(max-width:900px){.aud-cover-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.aud-cover-grid{grid-template-columns:1fr}}

/* ══════════════════════════════════════════
   PROCESS + FREE-AUDIT FORM (side by side)
   ══════════════════════════════════════════ */
.aud-split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.aud-split-left h2{font-size:clamp(22px,2.6vw,30px);font-weight:600;color:#fff;margin-bottom:10px}
.aud-split-lead{color:rgba(255,255,255,0.72);font-size:16px;line-height:1.65;margin-bottom:28px}
.aud-timeline{list-style:none;margin:0;padding:0}
.aud-tl-step{display:flex;gap:16px;padding-bottom:24px;position:relative}
.aud-tl-step:last-child{padding-bottom:0}
.aud-tl-step:not(:last-child)::before{content:"";position:absolute;left:18px;top:42px;bottom:0;width:2px;background:rgba(255,255,255,0.14)}
.aud-tl-mark{flex-shrink:0;width:38px;height:38px;border-radius:50%;background:#caef45;color:#0b1830;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:16px;position:relative;z-index:1}
.aud-tl-body h3{font-size:17px;font-weight:600;color:#fff;margin-bottom:5px}
.aud-tl-body p{font-size:14.5px;line-height:1.6;color:rgba(255,255,255,0.7);margin:0}

/* Free-audit form card (white, sits on dark split) */
.aud-form-card{background:#fff;border:1px solid #e8eaf3;border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.28);padding:30px 32px}
.aud-form-card .aud-form-eyebrow{display:block;text-align:left;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#1763c4;margin-bottom:6px}
.aud-form-title{font-size:21px;font-weight:600;color:#14172e;margin-bottom:6px}
.aud-form-intro{color:#5e6470;font-size:14.5px;line-height:1.55;margin-bottom:22px}
.aud-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.aud-field{display:flex;flex-direction:column}
.aud-field--full{grid-column:1 / -1}
.aud-field label{font-size:14px;font-weight:600;color:#191c33;margin-bottom:6px}
.aud-field label .req{color:#e23744;margin-left:2px}
.aud-field input,.aud-field textarea{background:#fff;border:1px solid #dcdeeb;border-radius:8px;padding:11px 13px;font-size:14px;font-family:inherit;color:#14172e;outline:none;transition:border-color .15s ease,box-shadow .15s ease}
.aud-field input::placeholder,.aud-field textarea::placeholder{color:#6b7280}
.aud-field input:focus,.aud-field textarea:focus{border-color:#9aa6e6;box-shadow:0 0 0 3px rgba(120,132,230,.15)}
.aud-field textarea{resize:vertical;min-height:74px}
.aud-field .error{color:#e23744;font-size:12.5px;margin-top:5px;min-height:1em}
.aud-form-actions{margin-top:22px;text-align:center}
.aud-form-actions .raq-cta-btn{font-size:16px;padding:13px 30px}
.aud-form-note{text-align:center;color:#5e6470;font-size:13px;margin:14px 0 0}
.aud-form-loader{display:none;width:40px;height:40px;margin:0 0 0 12px;vertical-align:middle}
.aud-alert{display:none;margin-top:16px;padding:12px 14px;border-radius:8px;font-size:14px}
.aud-alert-danger{background:#fdecec;color:#b42318;border:1px solid #f6c9c4}
@media(max-width:900px){.aud-split{grid-template-columns:1fr;gap:36px}}
@media(max-width:560px){.aud-form-grid{grid-template-columns:1fr}.aud-form-card{padding:24px 20px}}

/* ══════════════════════════════════════════
   INSIDE YOUR REPORT (report graphic + points)
   ══════════════════════════════════════════ */
.aud-report-split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.aud-report-content h2{font-size:clamp(24px,3vw,32px);font-weight:600;color:#111;margin-bottom:12px}
.aud-report-content > p{color:#525a6b;font-size:16px;line-height:1.7;margin-bottom:24px}
.aud-points{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.aud-points li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.5;color:#3a4252}
.aud-points li strong{color:#14172e}
.aud-pt-tick{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:#eaffce;display:flex;align-items:center;justify-content:center;margin-top:1px}
.aud-pt-tick svg{width:13px;height:13px;color:#5a8b00}
/* report graphic — now an indexable image file (see /images/seo-audit-report-sample.webp) */
.aud-report-visual img{display:block;width:100%;height:auto}
@media(max-width:900px){.aud-report-split{grid-template-columns:1fr;gap:34px}.aud-report-content{order:2}.aud-report-visual{order:1}}

/* ══════════════════════════════════════════
   CTA BAND — same concept as seo-services (.cro-cta-band)
   ══════════════════════════════════════════ */
.cro-cta-band{position:relative;overflow:hidden;background:linear-gradient(135deg,#020c1b 0%,#1a3a6e 40%,#020c1b 100%);border-radius:24px;padding:64px 56px;margin:60px 0;border:1px solid rgba(41,171,226,0.2);display:grid;grid-template-columns:1fr auto;align-items:center;gap:48px}
.cro-cta-band::before{content:'';position:absolute;top:-80px;right:-80px;width:400px;height:400px;background:radial-gradient(circle,rgba(41,171,226,0.15) 0%,transparent 65%);pointer-events:none}
.cro-cta-band::after{content:'';position:absolute;bottom:28px;left:56px;width:80px;height:3px;background:linear-gradient(90deg,#253a8f,#29abe2,#caef45);border-radius:3px}
.cro-cta-eyebrow{font-size:11px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:#caef45;margin-bottom:12px;display:block}
.cro-cta-band h2{font-size:clamp(1.5rem,2.4vw,2rem);font-weight:700;color:#fff;line-height:1.3;margin:0 0 20px}
.cro-cta-band h2 span{color:#caef45}
.cro-cta-stats{display:flex;gap:28px;flex-wrap:wrap}
.cro-cta-stat-val{font-size:20px;font-weight:700;color:#fff;line-height:1}
.cro-cta-stat-lbl{font-size:11px;color:rgba(255,255,255,0.65)}
.cro-cta-btns{display:flex;flex-direction:column;gap:12px;align-items:center;min-width:200px;position:relative;z-index:1}
.cro-cta-btn{display:flex;align-items:center;justify-content:center;width:100%;background:#caef45;color:#0a1628;font-size:15px;font-weight:700;padding:14px 28px;border-radius:50px;text-decoration:none;transition:background .2s,transform .15s,box-shadow .2s;white-space:nowrap}
.cro-cta-btn:hover{background:#b8e020;transform:translateY(-2px);box-shadow:0 10px 28px rgba(202,239,69,0.4);color:#0a1628;text-decoration:none}
.cro-cta-note{font-size:11px;color:rgba(255,255,255,0.7);text-align:center}
@media (max-width:992px){.cro-cta-band{grid-template-columns:1fr;padding:48px 40px;margin:48px 0}}
@media (max-width:640px){.cro-cta-band{padding:40px 24px}}