.seo-landing{
    background:#071426;
    color:#eaf3ff;
}

.seo-hero{
    padding:18px 0 26px;
    background:
        linear-gradient(180deg, rgba(4,15,32,.98), rgba(8,26,49,.96));
    color:#fff;
}

.seo-hero-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:18px;
    align-items:stretch;
}

.seo-hero-grid--single{
    grid-template-columns:1fr;
}

.seo-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    margin:0 0 14px;
    color:rgba(226,236,250,.62);
    font-size:13px;
    font-weight:700;
}

.seo-breadcrumb a{
    color:rgba(226,236,250,.74);
    text-decoration:none;
}

.seo-breadcrumb a:hover{
    color:#ffc107;
}

.seo-kicker{
    display:inline-flex;
    align-items:center;
    width:max-content;
    max-width:100%;
    min-height:26px;
    padding:0 10px;
    border:1px solid rgba(255,193,7,.24);
    border-radius:999px;
    background:rgba(255,193,7,.08);
    color:#ffd978;
    font-size:12px;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
}

.seo-hero h1{
    max-width:760px;
    margin:12px 0 10px;
    color:#fff;
    font-size:42px;
    line-height:1.05;
    font-weight:950;
    letter-spacing:0;
}

.seo-hero p{
    max-width:720px;
    margin:0;
    color:rgba(226,236,250,.76);
    font-size:16px;
    line-height:1.55;
}

.seo-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:18px;
}

.seo-primary-btn,
.seo-secondary-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 14px;
    border-radius:8px;
    font-size:14px;
    font-weight:900;
    text-decoration:none;
}

.seo-primary-btn{
    background:#ffc107;
    color:#111827;
}

.seo-secondary-btn{
    border:1px solid rgba(226,236,250,.22);
    color:#eaf3ff;
    background:rgba(255,255,255,.04);
}

.seo-hero-panel{
    display:grid;
    gap:10px;
    padding:14px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:14px;
    background:rgba(255,255,255,.045);
    box-shadow:0 20px 46px rgba(0,0,0,.22);
}

.seo-price-summary{
    padding:16px;
    border:1px solid rgba(255,193,7,.18);
    border-radius:12px;
    background:rgba(255,193,7,.08);
}

.seo-price-summary span,
.seo-price-summary em,
.seo-mini-stats span,
.seo-stat span{
    display:block;
    color:rgba(226,236,250,.68);
    font-size:12px;
    font-weight:800;
    font-style:normal;
}

.seo-price-summary strong{
    display:block;
    margin:6px 0 4px;
    color:#fff;
    font-size:36px;
    line-height:1;
    font-weight:950;
}

.seo-mini-stats{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.seo-mini-stats div,
.seo-stat{
    min-width:0;
    padding:12px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:10px;
    background:rgba(255,255,255,.055);
}

.seo-mini-stats strong,
.seo-stat strong{
    display:block;
    margin-top:5px;
    color:#fff;
    font-size:18px;
    font-weight:950;
}

.seo-brand-logo{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:86px;
    border-radius:10px;
    background:#fff;
}

.seo-brand-logo img{
    max-width:160px;
    max-height:56px;
    object-fit:contain;
}

.seo-section{
    padding:22px 0;
    background:#071426;
}

.seo-muted{
    background:#091a30;
}

.seo-section-head{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:end;
    margin-bottom:12px;
}

.seo-section-head .seo-kicker{
    color:#ffd978;
    border-color:rgba(255,193,7,.24);
    background:rgba(255,193,7,.08);
}

.seo-section h2{
    margin:8px 0 0;
    color:#fff;
    font-size:24px;
    line-height:1.18;
    font-weight:950;
}

.seo-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.seo-grid-5{
    grid-template-columns:repeat(5,minmax(0,1fr));
}

.seo-card,
.seo-city-link,
.seo-brand-card{
    display:flex;
    flex-direction:column;
    gap:7px;
    min-height:108px;
    padding:14px;
    border:1px solid #dfe7ee;
    border-radius:8px;
    background:#0d213b;
    color:#eaf3ff;
    text-decoration:none;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
}

.seo-card span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    min-width:48px;
    height:28px;
    padding:0 9px;
    border-radius:7px;
    background:#eaf7f1;
    color:#0b7f67;
    font-size:13px;
    font-weight:950;
}

.seo-card strong{
    font-size:28px;
    line-height:1;
    font-weight:950;
}

.seo-card em,
.seo-city-link span,
.seo-brand-card span{
    color:#9fb0c6;
    font-size:14px;
    font-style:normal;
}

.seo-card.is-on span{
    background:#e8f1ff;
    color:#1d5ea8;
}

.seo-card.is-lpg span,
.seo-card.is-onplus span{
    background:#f1eaff;
    color:#7040ad;
}

.seo-list{
    display:grid;
    gap:0;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.08);
    border-radius:8px;
    background:#0d213b;
}

.seo-row{
    display:grid;
    grid-template-columns:48px minmax(0,1fr) 108px;
    gap:12px;
    align-items:center;
    min-height:68px;
    padding:10px 12px;
    border-bottom:1px solid rgba(255,255,255,.07);
    background:#0d213b;
    color:#eaf3ff;
    text-decoration:none;
}

.seo-row:last-child{
    border-bottom:0;
}

.seo-row:hover,
.seo-card:hover,
.seo-city-link:hover,
.seo-brand-card:hover{
    border-color:rgba(255,193,7,.35);
    background:#102843;
}

.seo-row-head{
    min-height:38px;
    grid-template-columns:60px minmax(0,1fr) 108px;
    background:#091a30;
    color:#9fb0c6;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.seo-row img,
.seo-brand-card img{
    width:48px;
    height:48px;
    object-fit:contain;
    border-radius:8px;
    background:#f4f7fa;
    padding:7px;
}

.seo-row span{
    min-width:0;
}

.seo-row strong,
.seo-row em{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.seo-row strong{
    color:#fff;
    font-size:15px;
    font-weight:950;
}

.seo-row em{
    margin-top:3px;
    color:#9fb0c6;
    font-size:13px;
    font-style:normal;
}

.seo-row b{
    text-align:right;
    color:#ffd978;
    font-size:18px;
    font-weight:950;
}

.seo-row-prices{
    grid-template-columns:48px minmax(0,1fr) 92px 92px 92px;
}

.seo-row-prices b{
    font-size:14px;
}

.seo-brand-card{
    min-height:140px;
    align-items:flex-start;
}

.seo-brand-card img{
    margin-bottom:4px;
}

.seo-city-link strong,
.seo-brand-card strong{
    font-size:17px;
    line-height:1.2;
}

.seo-faq-box{
    padding:20px;
    border:1px solid #dfe7ee;
    border-radius:8px;
    background:#0d213b;
}

.seo-faq-box h2{
    margin:0 0 14px;
}

.seo-faq-box h3{
    margin:14px 0 5px;
    color:#fff;
    font-size:17px;
    font-weight:900;
}

.seo-faq-box p{
    margin:0;
    color:#9fb0c6;
    line-height:1.6;
}

@media (max-width: 980px){
    .seo-hero-grid{
        grid-template-columns:1fr;
    }

    .seo-grid,
    .seo-grid-5{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .seo-row-prices{
        grid-template-columns:48px minmax(0,1fr) 1fr 1fr 1fr;
    }
}

@media (max-width: 640px){
    .seo-hero{
        padding:14px 0 20px;
    }

    .seo-hero h1{
        font-size:30px;
    }

    .seo-hero p{
        font-size:15px;
    }

    .seo-hero-actions{
        gap:8px;
    }

    .seo-primary-btn,
    .seo-secondary-btn{
        flex:1 1 140px;
    }

    .seo-grid,
    .seo-grid-5{
        grid-template-columns:1fr;
    }

    .seo-row{
        grid-template-columns:44px minmax(0,1fr) 84px;
        gap:9px;
        padding:10px;
    }

    .seo-row-head{
        display:none;
    }

    .seo-row img{
        width:44px;
        height:44px;
    }

    .seo-row b{
        font-size:16px;
    }

    .seo-row-prices{
        grid-template-columns:44px minmax(0,1fr);
    }

    .seo-row-prices b{
        text-align:left;
        padding:7px 9px;
        border-radius:6px;
        background:#f1f6fa;
    }
}