/* ==========================================================================
   Self Storage SEO Services - Page-Specific Styles
   /css/pages/seo-services.css
   ========================================================================== */

/* ---- SEO Internal Hero Theme ---- */
.internal-hero--seo{--internal-hero-bg-image:url('/images/seo-hero-bg.png');}
.internal-hero--seo .internal-hero__bg{background-size:100% 100%;background-position:center;}
.internal-hero--seo .internal-hero__overlay{
    background:
        radial-gradient(circle at 76% 42%,rgba(19,167,179,.12),transparent 38%),
        linear-gradient(90deg,rgba(0,31,49,.90) 0%,rgba(0,31,49,.76) 50%,rgba(0,31,49,.52) 100%);
}

/* SEO hero object: a search-visibility interface, not a generic performance card. */
.seo-search-visual{position:relative;max-width:390px;min-height:286px;margin-left:auto;padding:12px 12px 18px 0;}
.seo-search-window{
    position:relative;z-index:2;
    overflow:hidden;
    border:1px solid rgba(111,217,224,.18);
    border-radius:16px;
    background:linear-gradient(155deg,rgba(7,43,63,.94),rgba(0,31,49,.84));
    box-shadow:0 24px 56px rgba(0,0,0,.28);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}
.seo-search-window__chrome{display:flex;gap:6px;align-items:center;height:34px;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.07);}
.seo-search-window__chrome span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.18);}
.seo-search-query{display:flex;align-items:center;gap:10px;margin:14px;padding:10px 12px;border:1px solid rgba(111,217,224,.16);border-radius:9px;background:rgba(255,255,255,.045);color:rgba(255,255,255,.82);font-size:.78rem;}
.seo-search-query svg{flex:0 0 auto;color:var(--teal-300);}
.seo-search-results{display:grid;gap:9px;padding:0 14px 16px;}
.seo-search-result{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.035);}
.seo-search-result--primary{border-color:rgba(111,217,224,.24);background:rgba(19,167,179,.09);}
.seo-result-pin{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:rgba(19,167,179,.14);color:var(--teal-300);}
.seo-result-copy{display:grid;gap:5px;}
.seo-result-line{display:block;height:5px;border-radius:5px;background:rgba(255,255,255,.16);}
.seo-result-line--strong{width:74%;background:rgba(111,217,224,.48);}
.seo-result-line--mid{width:92%;}
.seo-result-line--short{width:58%;}
.seo-result-status{width:8px;height:8px;border-radius:50%;background:var(--teal-300);box-shadow:0 0 0 5px rgba(111,217,224,.08);}
.seo-visibility-signal{position:absolute;right:-4px;bottom:0;z-index:3;display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid rgba(245,141,29,.25);border-radius:10px;background:rgba(0,31,49,.94);box-shadow:0 14px 30px rgba(0,0,0,.25);color:rgba(255,255,255,.78);font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
.seo-visibility-signal svg{color:var(--amber-500);}
.seo-rank-path{position:absolute;left:-22px;bottom:12px;z-index:1;width:245px;height:112px;opacity:.58;}

/* ---- What Is Self Storage SEO ---- */
.seo-what{padding:90px 0;background:var(--white);}
.seo-what-layout{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;}
.seo-what-copy .section-eyebrow{text-align:left;}
.seo-what-copy h2{text-align:left;font-size:2.2rem;color:var(--navy-950);margin-bottom:20px;}
.seo-what-copy h2::after{display:none;}
.seo-what-copy p{color:var(--gray-700);font-size:1rem;line-height:1.7;margin-bottom:16px;}
.seo-what-cards{display:grid;gap:16px;}
.seo-info-card{background:var(--gray-100);border:1px solid var(--gray-300);border-radius:12px;padding:22px 24px;transition:border-color .2s,box-shadow .2s;}
.seo-info-card:hover{border-color:var(--teal-300);box-shadow:0 8px 24px rgba(0,31,49,.07);}
.seo-info-card h3{color:var(--navy-950);font-size:1rem;font-weight:700;margin-bottom:8px;}
.seo-info-card p{color:var(--gray-700);font-size:.88rem;line-height:1.6;margin:0;}

/* ---- Why Different (dark) ---- */
.seo-different{padding:90px 0;background:var(--navy-950);}
.seo-different h2{text-align:center;color:var(--white);}
.seo-different h2::after{display:none;}
.section-desc{text-align:center;max-width:680px;margin:0 auto 48px;color:var(--gray-700);font-size:1rem;line-height:1.6;}
.section-desc--light{color:var(--gray-300);}
.seo-diff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.seo-diff-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:28px 24px;transition:background .2s,border-color .2s,transform .2s;}
.seo-diff-card:hover{background:rgba(255,255,255,.07);border-color:rgba(19,167,179,.3);transform:translateY(-3px);}
.seo-diff-icon{margin-bottom:14px;}
.seo-diff-card h3{color:var(--white);font-size:1.05rem;font-weight:700;margin-bottom:10px;}
.seo-diff-card p{color:var(--gray-300);font-size:.88rem;line-height:1.6;margin:0;}

/* ---- SEO Services Detail ---- */
.seo-services-detail{padding:90px 0;background:var(--white);}
.seo-services-detail h2{text-align:center;font-size:2.2rem;color:var(--navy-950);margin-bottom:12px;}
.seo-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.seo-svc-card{background:var(--white);border:1px solid var(--gray-300);border-radius:14px;padding:28px 24px;display:flex;flex-direction:column;transition:border-color .2s,box-shadow .2s,transform .2s;}
.seo-svc-card:hover{border-color:var(--teal-300);box-shadow:0 12px 30px rgba(0,31,49,.1);transform:translateY(-3px);}
.seo-svc-card--featured{grid-column:1 / -1;border:2px solid var(--cta-500);background:linear-gradient(180deg,rgba(19,167,179,.03) 0%,var(--white) 30%);position:relative;display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:36px 32px;}
.seo-svc-card-ribbon{position:absolute;top:-12px;left:28px;background:var(--cta-500);color:var(--white);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;padding:5px 16px;border-radius:16px;}
.seo-svc-card h3{color:var(--navy-950);font-size:1.1rem;font-weight:700;margin-bottom:10px;}
.seo-svc-card p{color:var(--gray-700);font-size:.9rem;line-height:1.6;margin:0 0 16px;}
.chk-list{list-style:none;padding:0;margin:0;}
.chk-list li{padding:5px 0;padding-left:24px;position:relative;color:var(--gray-700);font-size:.87rem;}
.chk-list .chk{position:absolute;left:0;color:var(--teal-500);font-weight:700;}

/* ---- Results ---- */
.seo-results{padding:90px 0;background:var(--gray-100);}
.seo-results h2{text-align:center;font-size:2.2rem;color:var(--navy-950);margin-bottom:12px;}
.seo-results-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:48px;}
.seo-result-stat{text-align:center;padding:24px 16px;background:var(--white);border:1px solid var(--gray-300);border-radius:14px;}
.seo-result-val{font-size:2rem;font-weight:800;color:var(--teal-500);line-height:1;margin-bottom:8px;}
.seo-result-label{color:var(--gray-700);font-size:.82rem;line-height:1.4;}
.seo-case-study{background:var(--white);border:1px solid var(--gray-300);border-radius:16px;padding:36px 32px;}
.seo-case-study h3{color:var(--navy-950);font-size:1.3rem;font-weight:700;margin-bottom:16px;}
.seo-case-study p{color:var(--gray-700);font-size:.95rem;line-height:1.7;margin-bottom:14px;}
.seo-case-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px;padding-top:24px;border-top:1px solid var(--gray-300);}
.seo-case-metric{text-align:center;}
.seo-case-val{font-size:1.3rem;font-weight:800;color:var(--navy-950);line-height:1.1;margin-bottom:4px;}
.seo-case-label{color:var(--gray-700);font-size:.78rem;line-height:1.3;}

/* ---- Compact Pricing ---- */
.seo-pricing-compact{background:var(--gray-100);}
.seo-pricing-compact .pricing-cards{max-width:960px;margin:0 auto;}

/* ---- Final CTA ---- */
.final-cta-section{padding:80px 0;background:linear-gradient(135deg,var(--navy-950) 0%,var(--navy-800) 100%);}
.final-cta-inner{text-align:center;max-width:640px;margin:0 auto;}
.final-cta-inner h2{color:var(--white);font-size:2rem;font-weight:800;margin-bottom:16px;}
.final-cta-inner h2::after{display:none;}
.final-cta-inner p{color:var(--gray-300);font-size:1rem;line-height:1.65;margin-bottom:28px;}
.btn-lg{padding:16px 32px;font-size:1.05rem;}

/* ---- Responsive ---- */
@media (max-width:1024px){
    .seo-what-layout{grid-template-columns:1fr;}
    .seo-diff-grid{grid-template-columns:1fr 1fr;}
    .seo-svc-grid{grid-template-columns:1fr 1fr;}
    .seo-svc-card--featured{grid-column:1 / -1;grid-template-columns:1fr;}
    .seo-results-stats{grid-template-columns:1fr 1fr;}
    /* Timeline responsive behavior now owned entirely by css/components/timeline.css */
    .seo-case-metrics{grid-template-columns:1fr 1fr 1fr;}
    .trust-bar-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
    .seo-diff-grid{grid-template-columns:1fr;}
    .seo-svc-grid{grid-template-columns:1fr;}
    .seo-svc-card--featured{grid-template-columns:1fr;}
    .seo-results-stats{grid-template-columns:1fr;}
    /* Timeline responsive behavior now owned entirely by css/components/timeline.css */
    .seo-case-metrics{grid-template-columns:1fr;}
    .trust-bar-grid{grid-template-columns:1fr 1fr;}
}


@media (max-width:1024px){
    .internal-hero--seo .internal-hero__bg{background-size:auto 100%;background-position:58% center;}
    .internal-hero--seo .internal-hero__overlay{
        background:linear-gradient(90deg,rgba(0,31,49,.94) 0%,rgba(0,31,49,.84) 70%,rgba(0,31,49,.72) 100%);
    }
}
