/* ================================================================
   MAHARASHTRA FIRE SERVICES
   Modern Landing Page
   ================================================================ */


/* ================================================================
   ROOT
   ================================================================ */

:root {
    --fire-bg: #06182a;
    --fire-bg-soft: #0a2137;
    --fire-bg-light: #102a42;
    --fire-orange: #d71920;
    --fire-orange-light: #ef5350;
    --fire-orange-dark: #b51218;
    --fire-blue: #005baa;
    --fire-blue-light: #2d8bd6;
    --fire-white: #ffffff;
    --fire-text: #e8f0f7;
    --fire-text-soft: #9db0c2;
    --fire-text-muted: #71879b;
    --fire-border: rgba(255,255,255,.10);
    --fire-border-light: rgba(255,255,255,.16);
    --fire-card: rgba(255,255,255,.055);
    --fire-radius: 18px;
    --fire-shadow: 0 20px 50px rgba(0,0,0,.24);
    --fire-container: 1380px;
}


/* ================================================================
   RESET
   ================================================================ */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    background: var(--fire-bg);
    color: var(--fire-text);
    font-family: Inter, "Noto Sans Devanagari", "Nirmala UI", Mangal, "Segoe UI", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
select,
input {
    font-family: inherit;
}

button {
    cursor: pointer;
}

img,
svg {
    display: block;
}


/* ================================================================
   COMMON CONTAINER
   ================================================================ */

.fire-container {
    /*width: min( calc(100% - 48px), var(--fire-container) );*/
    width: min(calc(100% - 50px));
    margin: 0 auto;
}


/* ================================================================
   MAIN WRAPPER
   ================================================================ */

.fire-landing {
    min-height: 100vh;
    overflow: hidden;
    background: radial-gradient( circle at 90% 5%, rgba(215,25,32,.08), transparent 25% ), radial-gradient( circle at 5% 80%, rgba(0,91,170,.07), transparent 25% ), var(--fire-bg);
}


/* ================================================================
   HEADER
   ================================================================ */

.fire-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    height: 78px;
    background: rgba(6,24,42,.88);
    border-bottom: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}


.fire-header__inner {
    width: min( calc(100% - 48px), var(--fire-container) ) !important;
    height: 100%;
    margin: auto;
    display: flex;
    align-items: center;
    gap: 30px;
}


/* BRAND */

.fire-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}


.fire-brand__icon {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: inset 0 0 20px rgba(255,255,255,.04);
}


.fire-brand__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}


.fire-brand__eyebrow {
    color: var(--fire-orange-light);
    font-size: 10px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .08em;
}


.fire-brand__title {
    color: #fff;
    font-size: 17px;
    line-height: 1.1;
    font-weight: 800;
}


/* NAVIGATION */

.fire-navigation {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
}


.fire-navigation__link {
    position: relative;
    padding: 10px 13px;
    color: var(--fire-text-soft);
    font-size: 13px;
    font-weight: 600;
    border-radius: 9px;
    transition: color .2s ease, background .2s ease;
}


    .fire-navigation__link:hover {
        color: #fff;
        background: rgba(255,255,255,.06);
    }


    .fire-navigation__link.active {
        color: #fff;
    }


        .fire-navigation__link.active::after {
            content: "";
            position: absolute;
            left: 13px;
            right: 13px;
            bottom: 3px;
            height: 2px;
            border-radius: 10px;
            background: var(--fire-orange);
        }


/* HEADER BUTTON */

.fire-header__button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 15px;
    color: #fff;
    background: var(--fire-orange);
    border-radius: 10px;
    font-size: 12px;
    font-weight: 750;
    box-shadow: 0 8px 22px rgba(215,25,32,.18);
    transition: transform .2s ease, background .2s ease;
}


    .fire-header__button:hover {
        background: var(--fire-orange-light);
        transform: translateY(-1px);
    }


/* ================================================================
   HERO
   ================================================================ */

.fire-hero {
    position: relative;
    min-height: 650px;
    display: flex;
    align-items: center;
    padding: 85px 0 75px;
    overflow: hidden;
    border-bottom: 1px solid rgba(255,255,255,.06);
}


.fire-hero__grid {
    position: absolute;
    inset: 0;
    opacity: .13;
    background-image: linear-gradient( rgba(255,255,255,.05) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255,255,255,.05) 1px, transparent 1px );
    background-size: 65px 65px;
    mask-image: linear-gradient( to bottom, black, transparent 85% );
    pointer-events: none;
}


.fire-hero__glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    pointer-events: none;
}


.fire-hero__glow--one {
    width: 500px;
    height: 500px;
    top: -250px;
    right: -120px;
    background: radial-gradient( circle, rgba(215,25,32,.15), transparent 70% );
}


.fire-hero__glow--two {
    width: 420px;
    height: 420px;
    left: -220px;
    bottom: -250px;
    background: radial-gradient( circle, rgba(0,91,170,.12), transparent 70% );
}


.fire-hero__content {
    position: relative;
    z-index: 2;
    display: grid;
    /* grid-template-columns: minmax(0, .95fr) minmax(460px, .8fr);*/
    /*align-items: center;*/
    gap: 75px;
}


/* HERO LEFT */

.fire-hero__badge {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 11px;
    margin-bottom: 22px;
    color: #ffb3b6;
    background: rgba(215,25,32,.08);
    border: 1px solid rgba(215,25,32,.20);
    border-radius: 100px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
}


.fire-hero__badge-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--fire-orange);
    box-shadow: 0 0 0 5px rgba(215,25,32,.08), 0 0 15px rgba(215,25,32,.55);
    animation: firePulse 2s infinite;
}


@keyframes firePulse {

    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: .55;
        transform: scale(.85);
    }
}


.fire-hero__title {
    max-width: 700px;
    margin: 0;
    color: #fff;
    font-size: 35px;
    line-height: .99;
    letter-spacing: -.045em;
    font-weight: 850;
}


    .fire-hero__title span {
        display: block;
        margin-top: 9px;
        color: var(--fire-orange);
        background: linear-gradient( 90deg, #d71920, #ef5350 );
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
    }


.fire-hero__description {
    max-width: 610px;
    margin: 27px 0 30px;
    color: var(--fire-text-soft);
    font-size: 16px;
    line-height: 1.7;
}


/* SEARCH */

.fire-search {
    width: 100%;
    max-width: 650px;
    min-height: 72px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 8px 8px 17px;
    background: rgba(255,255,255,.075);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 14px;
    box-shadow: 0 20px 45px rgba(0,0,0,.20);
    backdrop-filter: blur(15px);
}


.fire-search__icon {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fire-orange);
    background: rgba(215,25,32,.10);
    border-radius: 10px;
}


.fire-search__content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}


    .fire-search__content label {
        color: var(--fire-text-muted);
        font-size: 9px;
        font-weight: 750;
        text-transform: uppercase;
        letter-spacing: .08em;
    }


.fire-search__select {
    width: 100%;
    border: 0;
    outline: 0;
    appearance: none;
    color: #fff;
    background: transparent;
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
}


    .fire-search__select option {
        color: #142b40;
        background: #fff;
    }


.fire-search__button {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 19px;
    color: #fff;
    border: 0;
    border-radius: 10px;
    background: var(--fire-orange);
    font-size: 12px;
    font-weight: 800;
    transition: background .2s ease, transform .2s ease;
}


    .fire-search__button:hover {
        background: var(--fire-orange-light);
        transform: translateY(-1px);
    }


/* HERO BUTTONS */

.fire-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin-top: 20px;
}


.fire-button {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 17px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 750;
    transition: transform .2s ease, background .2s ease, border .2s ease;
}


    .fire-button:hover {
        transform: translateY(-2px);
    }


.fire-button--primary {
    color: #fff;
    background: var(--fire-orange);
    box-shadow: 0 10px 25px rgba(215,25,32,.16);
}


    .fire-button--primary:hover {
        background: var(--fire-orange-light);
    }


.fire-button--secondary {
    color: #dbe7f1;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.045);
}


    .fire-button--secondary:hover {
        background: rgba(255,255,255,.09);
    }


/* TRUST */

.fire-hero__trust {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 25px;
    color: var(--fire-text-muted);
    font-size: 11px;
}


.fire-hero__trust-icon {
    width: 27px;
    height: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fire-blue-light);
    border: 1px solid rgba(45,139,214,.20);
    background: rgba(0,91,170,.08);
    border-radius: 8px;
}


/* ================================================================
   HERO NETWORK VISUAL
   ================================================================ */

.fire-hero__visual {
    position: relative;
    min-height: 480px;
    display: flex;
    align-items: center;
    justify-content: center;
}


.fire-network-card {
    position: relative;
    width: 100%;
    max-width: 570px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 24px;
    background: linear-gradient( 145deg, rgba(20,47,70,.92), rgba(7,25,43,.96) );
    box-shadow: 0 35px 80px rgba(0,0,0,.30);
}


    .fire-network-card::before {
        content: "";
        position: absolute;
        width: 240px;
        height: 240px;
        top: -120px;
        right: -70px;
        border-radius: 50%;
        background: radial-gradient( circle, rgba(215,25,32,.15), transparent 70% );
    }


.fire-network-card__header {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 24px 17px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}


.fire-network-card__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--fire-orange-light);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
}


.fire-network-card__header h3 {
    margin: 0;
    color: #fff;
    font-size: 20px;
    font-weight: 800;
}


.fire-network-status {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 6px 9px;
    color: #9fe0bc;
    background: rgba(67,184,120,.08);
    border: 1px solid rgba(67,184,120,.15);
    border-radius: 100px;
    font-size: 9px;
    font-weight: 750;
}


    .fire-network-status span {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #57c88c;
        box-shadow: 0 0 9px rgba(87,200,140,.7);
    }


/* MAP VISUAL */

.fire-network-map {
    position: relative;
    height: 335px;
    overflow: hidden;
    background: radial-gradient( circle at center, rgba(0,91,170,.09), transparent 60% );
}


.fire-network-map__grid {
    position: absolute;
    inset: 0;
    opacity: .22;
    background-image: linear-gradient( rgba(255,255,255,.05) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255,255,255,.05) 1px, transparent 1px );
    background-size: 40px 40px;
}


/* ABSTRACT MAHARASHTRA */

.maharashtra-shape {
    position: absolute;
    width: 310px;
    height: 255px;
    left: 50%;
    top: 49%;
    transform: translate(-50%, -50%) rotate(-10deg);
    background: linear-gradient( 135deg, rgba(215,25,32,.20), rgba(0,91,170,.12) );
    clip-path: polygon( 18% 3%, 39% 8%, 56% 2%, 71% 12%, 88% 15%, 95% 29%, 88% 42%, 91% 55%, 78% 61%, 83% 76%, 70% 83%, 58% 96%, 44% 88%, 31% 96%, 24% 80%, 12% 75%, 17% 59%, 5% 50%, 12% 36%, 4% 23% );
    border: 1px solid rgba(255,255,255,.1);
    filter: drop-shadow( 0 0 25px rgba(215,25,32,.12) );
}


.map-point {
    position: absolute;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--fire-orange);
    border: 2px solid rgba(255,255,255,.85);
    box-shadow: 0 0 0 6px rgba(215,25,32,.09), 0 0 20px rgba(215,25,32,.55);
    z-index: 3;
    animation: mapPulse 2.8s infinite;
}


@keyframes mapPulse {

    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.25);
        opacity: .72;
    }
}


.map-point--1 {
    left: 27%;
    top: 54%;
}

.map-point--2 {
    left: 38%;
    top: 67%;
}

.map-point--3 {
    left: 53%;
    top: 53%;
}

.map-point--4 {
    left: 59%;
    top: 34%;
}

.map-point--5 {
    left: 70%;
    top: 27%;
}

.map-point--6 {
    left: 69%;
    top: 48%;
}

.map-point--7 {
    left: 51%;
    top: 78%;
}


.map-line {
    position: absolute;
    height: 1px;
    transform-origin: left center;
    background: linear-gradient( 90deg, rgba(215,25,32,.60), rgba(215,25,32,0) );
    opacity: .45;
}


.map-line--1 {
    width: 115px;
    left: 28%;
    top: 55%;
    transform: rotate(27deg);
}

.map-line--2 {
    width: 90px;
    left: 39%;
    top: 67%;
    transform: rotate(-25deg);
}

.map-line--3 {
    width: 115px;
    left: 52%;
    top: 53%;
    transform: rotate(-50deg);
}

.map-line--4 {
    width: 95px;
    left: 59%;
    top: 35%;
    transform: rotate(-8deg);
}


/* LOCATION LABELS */

.network-location {
    position: absolute;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 6px;
    color: rgba(255,255,255,.75);
    font-size: 9px;
    font-weight: 650;
}


.network-location__dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--fire-orange);
}


.network-location--pune {
    left: 40%;
    top: 61%;
}


.network-location--mumbai {
    left: 25%;
    top: 55%;
}


.network-location--nagpur {
    right: 19%;
    top: 29%;
}


.network-location--nashik {
    left: 53%;
    top: 42%;
}


/* NETWORK FOOTER */

.fire-network-card__footer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid rgba(255,255,255,.07);
}


    .fire-network-card__footer > div {
        min-height: 78px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 0 20px;
        border-right: 1px solid rgba(255,255,255,.07);
    }


        .fire-network-card__footer > div:last-child {
            border-right: 0;
        }


    .fire-network-card__footer strong {
        color: #fff;
        font-size: 19px;
        font-weight: 800;
    }


    .fire-network-card__footer span {
        margin-top: 3px;
        color: var(--fire-text-muted);
        font-size: 8px;
        line-height: 1.3;
    }


/* FLOATING CARDS */

.fire-floating-card {
    position: absolute;
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    background: rgba(14,39,60,.90);
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 12px;
    box-shadow: 0 18px 40px rgba(0,0,0,.25);
    backdrop-filter: blur(15px);
}


.fire-floating-card--top {
    top: 30px;
    right: -22px;
}


.fire-floating-card--bottom {
    bottom: 42px;
    left: -27px;
}


.fire-floating-card__icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fire-orange);
    background: rgba(215,25,32,.10);
    border-radius: 9px;
}


.fire-floating-card strong {
    display: block;
    color: #fff;
    font-size: 10px;
    font-weight: 750;
}


.fire-floating-card span {
    display: block;
    margin-top: 2px;
    color: var(--fire-text-muted);
    font-size: 8px;
}


.fire-floating-card__pulse {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #58c98b;
    box-shadow: 0 0 0 5px rgba(88,201,139,.08), 0 0 14px rgba(88,201,139,.5);
}


/* ================================================================
   STATS
   ================================================================ */

.fire-stats {
    position: relative;
    background: rgba(255,255,255,.025);
    border-top: 1px solid rgba(255,255,255,.05);
    border-bottom: 1px solid rgba(255,255,255,.06);
}


.fire-stats__inner {
    min-height: 105px;
    display: grid;
    grid-template-columns: 1.2fr repeat(3, 1fr);
    align-items: center;
}


.fire-stats__intro {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-right: 30px;
}


    .fire-stats__intro span {
        color: var(--fire-orange);
        font-size: 9px;
        font-weight: 800;
        letter-spacing: .10em;
    }


    .fire-stats__intro strong {
        color: #fff;
        font-size: 16px;
        font-weight: 750;
    }


.fire-stat {
    min-height: 66px;
    display: flex;
    align-items: center;
    gap: 13px;
    padding-left: 28px;
    border-left: 1px solid rgba(255,255,255,.08);
}


.fire-stat__icon {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fire-orange);
    background: rgba(215,25,32,.08);
    border: 1px solid rgba(215,25,32,.13);
    border-radius: 10px;
}


.fire-stat strong {
    display: block;
    color: #fff;
    font-size: 22px;
    line-height: 1;
    font-weight: 800;
}


.fire-stat span {
    display: block;
    margin-top: 4px;
    color: var(--fire-text-muted);
    font-size: 9px;
}


/* ================================================================
   SECTION HEADINGS
   ================================================================ */

.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 30px;
}


.section-heading--center {
    display: block;
    max-width: 720px;
    margin: 0 auto 45px;
    text-align: center;
}


.section-heading__eyebrow {
    display: block;
    margin-bottom: 9px;
    color: var(--fire-orange);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
}


.section-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(30px, 3vw, 43px);
    line-height: 1.1;
    letter-spacing: -.025em;
    font-weight: 800;
}


.section-heading p {
    margin: 13px 0 0;
    color: var(--fire-text-muted);
    font-size: 13px;
    line-height: 1.65;
}


.section-heading--center p {
    margin-left: auto;
    margin-right: auto;
}


.section-heading__badge {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 11px;
    color: #91d9b0;
    border: 1px solid rgba(91,204,145,.15);
    background: rgba(91,204,145,.06);
    border-radius: 100px;
    font-size: 9px;
    font-weight: 700;
}


    .section-heading__badge span {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #62d296;
    }


/* ================================================================
   STATION SECTION
   ================================================================ */

.station-section {
    padding: 90px 0;
    background: linear-gradient( 180deg, #071b2e, #091f34 );
}


.station-locator {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(340px, .85fr);
    gap: 16px;
    min-height: 570px;
}


/* MAP CARD */

.station-map-card {
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 20px;
    background: #0b243b;
    box-shadow: var(--fire-shadow);
}


.station-map-card__top {
    min-height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 17px;
    background: rgba(255,255,255,.035);
    border-bottom: 1px solid rgba(255,255,255,.08);
}


    .station-map-card__top span {
        display: block;
        margin-bottom: 3px;
        color: var(--fire-orange);
        font-size: 8px;
        font-weight: 800;
        letter-spacing: .1em;
    }


    .station-map-card__top strong {
        color: #fff;
        font-size: 14px;
        font-weight: 750;
    }


.station-map-card__count {
    display: flex;
    align-items: baseline;
    gap: 5px;
    color: var(--fire-text-muted);
    font-size: 9px;
}


    .station-map-card__count strong {
        color: var(--fire-orange);
        font-size: 20px;
    }


/* MAP */

.station-map {
    width: 100%;
    height: 500px;
    background: #d8e8f4;
}


    /* ================================================================
   LEAFLET OVERRIDES
   ================================================================ */

    .station-map .leaflet-control-zoom {
        margin: 15px !important;
        border: 1px solid rgba(0,0,0,.12) !important;
        box-shadow: 0 8px 20px rgba(0,0,0,.18) !important;
    }


        .station-map .leaflet-control-zoom a {
            width: 32px !important;
            height: 32px !important;
            line-height: 32px !important;
            color: #122a40 !important;
            background: #fff !important;
        }


    .station-map .leaflet-control-attribution {
        font-size: 8px !important;
    }


/* ================================================================
   STATION PANEL
   ================================================================ */

.station-panel {
    min-height: 570px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #f7fafc;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 20px;
    box-shadow: var(--fire-shadow);
}


.station-panel__filter {
    padding: 19px 17px 15px;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
}


    .station-panel__filter label {
        display: block;
        margin-bottom: 8px;
        color: #12314e;
        font-size: 11px;
        font-weight: 750;
    }


.station-select-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}


    .station-select-wrapper > svg {
        position: absolute;
        left: 13px;
        z-index: 2;
        color: #2c7cc3;
        pointer-events: none;
    }


.station-select {
    width: 100%;
    min-height: 42px;
    padding: 0 34px 0 39px;
    color: #243b53;
    background: #f8fafc;
    border: 1px solid #dce5ee;
    border-radius: 10px;
    outline: none;
    font-size: 12px;
    font-weight: 600;
    appearance: auto;
    cursor: pointer;
}


    .station-select:focus {
        border-color: #2d82c9;
        box-shadow: 0 0 0 3px rgba(0,91,170,.10);
    }


/* PANEL HEADER */

.station-panel__header {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 0 17px;
    background: #fff;
    border-bottom: 1px solid #e1e8ef;
}


    .station-panel__header > div {
        display: flex;
        align-items: baseline;
        gap: 5px;
        color: #708398;
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
    }


    .station-panel__header #stationCount {
        color: #b51218;
        font-size: 12px;
    }


/* LIST */

.station-list {
    flex: 1;
    margin: 0;
    padding: 11px;
    overflow-y: auto;
    list-style: none;
    scrollbar-width: thin;
    scrollbar-color: #c7d4df transparent;
}


    .station-list::-webkit-scrollbar {
        width: 6px;
    }


    .station-list::-webkit-scrollbar-track {
        background: transparent;
    }


    .station-list::-webkit-scrollbar-thumb {
        background: #c8d4df;
        border-radius: 10px;
    }


.station-card {
    position: relative;
    margin-bottom: 9px;
    padding: 14px 13px 13px 15px;
    background: #fff;
    border: 1px solid #dce5ed;
    border-left: 3px solid #2a82ca;
    border-radius: 11px;
    box-shadow: 0 4px 15px rgba(15,40,65,.05);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}


    .station-card:hover {
        transform: translateY(-2px);
        border-color: #b8d5eb;
        box-shadow: 0 9px 22px rgba(15,40,65,.09);
    }


    .station-card:last-child {
        margin-bottom: 0;
    }


.station-card__name {
    margin: 0 0 6px;
    color: #143a5d;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 800;
}


.station-card__corp {
    display: inline-block;
    margin-bottom: 6px;
    padding: 3px 7px;
    color: #2b80c4;
    background: #edf6fd;
    border-radius: 20px;
    font-size: 8px;
    line-height: 1.1;
    font-weight: 750;
}


.station-card__address {
    margin: 0 0 9px;
    color: #718398;
    font-size: 9px;
    line-height: 1.45;
}


.station-card__row {
    min-height: 20px;
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 4px;
    color: #1f6fb2;
    font-size: 10px;
}


    .station-card__row svg {
        flex-shrink: 0;
    }


.station-card__link,
.station-card__phone {
    color: #143f67;
    font-size: 10px;
    font-weight: 650;
}


    .station-card__link:hover,
    .station-card__phone:hover {
        color: #b51218;
        text-decoration: underline;
    }


.station-list__empty {
    padding: 35px 15px;
    color: #8293a5;
    text-align: center;
    font-size: 11px;
}


/* ================================================================
   SERVICES
   ================================================================ */

.services-section {
    padding: 100px 0;
    background: #06182a;
}


.service-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}


.service-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: 21px;
    background: linear-gradient( 145deg, rgba(255,255,255,.065), rgba(255,255,255,.025) );
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    transition: transform .25s ease, border .25s ease, background .25s ease, box-shadow .25s ease;
}


    .service-card::after {
        content: "";
        position: absolute;
        width: 170px;
        height: 170px;
        right: -90px;
        bottom: -100px;
        border-radius: 50%;
        background: rgba(215,25,32,.08);
        transition: transform .3s ease;
    }


    .service-card:hover {
        transform: translateY(-6px);
        border-color: rgba(215,25,32,.30);
        background: linear-gradient( 145deg, rgba(215,25,32,.10), rgba(255,255,255,.035) );
        box-shadow: 0 20px 45px rgba(0,0,0,.20);
    }


        .service-card:hover::after {
            transform: scale(1.4);
        }


.service-card--featured {
    border-color: rgba(215,25,32,.30);
    background: linear-gradient( 145deg, rgba(215,25,32,.12), rgba(255,255,255,.035) );
}


.service-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.service-card__icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fire-orange);
    background: rgba(215,25,32,.09);
    border: 1px solid rgba(215,25,32,.15);
    border-radius: 12px;
    transition: transform .25s ease, background .25s ease;
}


.service-card:hover .service-card__icon {
    transform: rotate(-5deg) scale(1.05);
    background: rgba(215,25,32,.15);
}


.service-card__arrow {
    color: var(--fire-text-muted);
    font-size: 20px;
    transition: transform .25s ease, color .25s ease;
}


.service-card:hover .service-card__arrow {
    color: var(--fire-orange);
    transform: translateX(5px);
}


.service-card__content {
    position: relative;
    z-index: 2;
}


.service-card__number {
    display: block;
    margin-bottom: 9px;
    color: rgba(255,255,255,.28);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
}


.service-card h3 {
    margin: 0 0 9px;
    color: #fff;
    font-size: 17px;
    line-height: 1.2;
    font-weight: 750;
}


.service-card p {
    margin: 0;
    color: var(--fire-text-muted);
    font-size: 11px;
    line-height: 1.6;
}


/* ================================================================
   SAFETY
   ================================================================ */

.safety-section {
    padding: 90px 0;
    background: #091f34;
}


.safety-panel {
    position: relative;
    display: grid;
    grid-template-columns: .75fr 1.25fr;
    overflow: hidden;
    min-height: 330px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 24px;
    background: linear-gradient( 120deg, rgba(215,25,32,.10), rgba(255,255,255,.035) );
    box-shadow: var(--fire-shadow);
}


.safety-panel__visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    background: radial-gradient( circle, rgba(215,25,32,.16), transparent 62% );
}


    .safety-panel__visual::before {
        content: "";
        position: absolute;
        width: 220px;
        height: 220px;
        border: 1px solid rgba(215,25,32,.15);
        border-radius: 50%;
    }


    .safety-panel__visual::after {
        content: "";
        position: absolute;
        width: 140px;
        height: 140px;
        border: 1px solid rgba(215,25,32,.14);
        border-radius: 50%;
    }


.safety-flame {
    position: relative;
    z-index: 2;
    width: 95px;
    height: 95px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fire-orange);
    background: rgba(215,25,32,.09);
    border: 1px solid rgba(215,25,32,.20);
    border-radius: 50%;
    box-shadow: 0 0 70px rgba(215,25,32,.15);
}


.safety-panel__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 50px 55px;
}


    .safety-panel__content h2 {
        max-width: 600px;
        margin: 0;
        color: #fff;
        font-size: clamp(30px, 3vw, 43px);
        line-height: 1.1;
        letter-spacing: -.03em;
        font-weight: 800;
    }


    .safety-panel__content > p {
        max-width: 620px;
        margin: 17px 0 25px;
        color: var(--fire-text-muted);
        font-size: 13px;
        line-height: 1.7;
    }


.safety-points {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}


    .safety-points > div {
        display: flex;
        align-items: center;
        gap: 8px;
    }


    .safety-points span {
        color: var(--fire-orange);
        font-size: 9px;
        font-weight: 800;
    }


    .safety-points strong {
        color: #dce7f0;
        font-size: 10px;
        font-weight: 650;
    }


/* ================================================================
   EMERGENCY
   ================================================================ */

.emergency-section {
    padding: 10px;
    background: #091f34;
}


.emergency-panel {
    display: flex;
    align-items: center;
    gap: 17px;
    padding: 22px 25px;
    background: linear-gradient( 90deg, rgba(215,25,32,.13), rgba(215,25,32,.045) );
    border: 1px solid rgba(215,25,32,.18);
    border-radius: 16px;
}


.emergency-panel__icon {
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fire-orange);
    background: rgba(215,25,32,.10);
    border: 1px solid rgba(215,25,32,.18);
    border-radius: 12px;
}


.emergency-panel__content {
    flex: 1;
}


    .emergency-panel__content > span {
        display: block;
        margin-bottom: 3px;
        color: var(--fire-orange);
        font-size: 8px;
        font-weight: 800;
        letter-spacing: .1em;
    }


    .emergency-panel__content h3 {
        margin: 0;
        color: #fff;
        font-size: 17px;
        font-weight: 750;
    }


    .emergency-panel__content p {
        margin: 4px 0 0;
        color: var(--fire-text-muted);
        font-size: 10px;
    }


.emergency-panel__button {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 15px;
    color: #fff;
    border: 1px solid rgba(215,25,32,.25);
    background: rgba(215,25,32,.10);
    border-radius: 9px;
    font-size: 10px;
    font-weight: 750;
    transition: background .2s ease;
}


    .emergency-panel__button:hover {
        background: rgba(215,25,32,.20);
    }


    .emergency-panel__button span {
        color: var(--fire-orange);
        font-size: 16px;
    }


/* ================================================================
   ABOUT
   ================================================================ */

.about-section {
    padding: 95px 0;
    background: #06182a;
}


.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 90px;
    align-items: center;
}


    .about-grid h2 {
        max-width: 600px;
        margin: 0;
        color: #fff;
        font-size: clamp(30px, 3vw, 44px);
        line-height: 1.1;
        letter-spacing: -.03em;
        font-weight: 800;
    }


    .about-grid p {
        margin: 0 0 22px;
        color: var(--fire-text-muted);
        font-size: 14px;
        line-height: 1.8;
    }


.about-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--fire-orange);
    font-size: 11px;
    font-weight: 750;
}


    .about-link span {
        font-size: 18px;
        transition: transform .2s ease;
    }


    .about-link:hover span {
        transform: translateX(4px);
    }


/* ================================================================
   FOOTER
   ================================================================ */

.fire-footer {
    display: grid;
    justify-content: center;
    padding: 0px 0 10px;
    background: #041321;
    border-top: 1px solid rgba(255,255,255,.07);
}


.fire-footer__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding-bottom: 28px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}


.fire-footer__links {
    display: flex;
    flex-wrap: wrap;
    gap: 23px;
}


    .fire-footer__links a {
        color: var(--fire-text-muted);
        font-size: 10px;
        font-weight: 600;
        transition: color .2s ease;
    }


        .fire-footer__links a:hover {
            color: var(--fire-orange);
        }


.fire-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-top: 20px;
    color: #61778a;
    font-size: 9px;
    text-align: center;
}


/* ================================================================
   RESPONSIVE
   ================================================================ */


/* ------------------------------------------------
   1200px
------------------------------------------------ */

@media (max-width: 1200px) {

    .fire-navigation {
        display: none;
    }


    .fire-hero__content {
        grid-template-columns: 1fr .85fr;
        gap: 35px;
    }


    .fire-hero__title {
        font-size: clamp(42px, 5vw, 62px);
    }


    .service-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* ------------------------------------------------
   1000px
------------------------------------------------ */

@media (max-width: 1000px) {

    .fire-hero {
        padding: 65px 0;
    }


    .fire-hero__content {
        grid-template-columns: 1fr;
    }


    .fire-hero__visual {
        max-width: 680px;
        margin: 15px auto 0;
        width: 100%;
    }


    .fire-stats__inner {
        grid-template-columns: 1fr 1fr 1fr;
        padding: 20px 0;
    }


    .fire-stats__intro {
        display: none;
    }


    .station-locator {
        grid-template-columns: 1fr;
    }


    .station-panel {
        min-height: 500px;
    }


    .station-map {
        height: 470px;
    }


    .safety-panel {
        grid-template-columns: .55fr 1.45fr;
    }
}


/* ------------------------------------------------
   760px
------------------------------------------------ */

@media (max-width: 760px) {

    .fire-container {
        width: calc(100% - 30px);
    }


    .fire-header__inner {
        width: calc(100% - 30px);
    }


    .fire-header {
        height: 68px;
    }


    .fire-brand__icon {
        width: 38px;
        height: 38px;
    }


    .fire-brand__eyebrow {
        font-size: 8px;
    }


    .fire-brand__title {
        font-size: 15px;
    }


    .fire-header__button {
        margin-left: auto;
        padding: 9px 11px;
    }


        .fire-header__button span {
            display: none;
        }


    .fire-hero {
        min-height: auto;
        padding: 55px 0 60px;
    }


    .fire-hero__title {
        font-size: clamp(40px, 11vw, 58px);
    }


    .fire-hero__description {
        font-size: 14px;
    }


    .fire-search {
        min-height: auto;
        flex-wrap: wrap;
        padding: 10px;
    }


    .fire-search__icon {
        display: none;
    }


    .fire-search__content {
        width: calc(100% - 105px);
    }


    .fire-search__button {
        min-height: 48px;
    }


        .fire-search__button span {
            display: none;
        }


    .fire-search__button {
        width: 48px;
        padding: 0;
    }


    .fire-hero__visual {
        min-height: 400px;
    }


    .fire-network-card {
        max-width: 100%;
        border-radius: 18px;
    }


    .fire-network-map {
        height: 280px;
    }


    .fire-network-card__footer > div {
        padding: 0 10px;
    }


    .fire-network-card__footer strong {
        font-size: 16px;
    }


    .fire-network-card__footer span {
        font-size: 7px;
    }


    .fire-floating-card--top {
        right: -5px;
        top: 10px;
    }


    .fire-floating-card--bottom {
        left: -5px;
        bottom: 15px;
    }


    .fire-stats__inner {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 20px 0;
    }


    .fire-stat {
        min-height: 55px;
        padding-left: 0;
        border-left: 0;
    }


    .section-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }


    .section-heading--center {
        align-items: center;
        text-align: center;
    }


    .station-section,
    .services-section,
    .safety-section,
    .about-section {
        padding: 65px 0;
    }


    .station-map {
        height: 380px;
    }


    .station-locator {
        min-height: 0;
    }


    .service-grid {
        grid-template-columns: 1fr;
    }


    .service-card {
        min-height: 220px;
    }


    .safety-panel {
        grid-template-columns: 1fr;
    }


    .safety-panel__visual {
        min-height: 220px;
    }


    .safety-panel__content {
        padding: 35px 25px 40px;
    }


    .safety-points {
        flex-direction: column;
        gap: 11px;
    }


    .emergency-panel {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px;
    }


    .emergency-panel__button {
        width: 100%;
        justify-content: center;
    }


    .about-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }


    .fire-footer__top {
        align-items: flex-start;
        flex-direction: column;
    }


    .fire-footer__bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* ------------------------------------------------
   480px
------------------------------------------------ */

@media (max-width: 480px) {

    .fire-hero__badge {
        font-size: 8px;
    }


    .fire-hero__actions {
        flex-direction: column;
    }


    .fire-button {
        width: 100%;
    }


    .fire-network-card__header {
        padding: 16px;
    }


        .fire-network-card__header h3 {
            font-size: 17px;
        }


    .fire-network-status {
        font-size: 8px;
    }


    .fire-network-map {
        height: 245px;
    }


    .maharashtra-shape {
        width: 250px;
        height: 205px;
    }


    .fire-floating-card {
        padding: 9px 10px;
    }


    .fire-floating-card__icon {
        width: 27px;
        height: 27px;
    }


    .fire-floating-card strong {
        font-size: 9px;
    }


    .fire-floating-card span {
        font-size: 7px;
    }


    .fire-floating-card--top {
        right: 5px;
    }


    .fire-floating-card--bottom {
        left: 5px;
    }


    .station-map {
        height: 320px;
    }


    .station-panel {
        min-height: 450px;
    }


    .section-heading h2 {
        font-size: 30px;
    }


    .safety-panel__content h2 {
        font-size: 30px;
    }


    .about-grid h2 {
        font-size: 30px;
    }
}


/* ================================================================
   ACCESSIBILITY
   ================================================================ */

.fire-navigation__link:focus-visible,
.fire-header__button:focus-visible,
.fire-button:focus-visible,
.fire-search__button:focus-visible,
.service-card:focus-visible,
.about-link:focus-visible {
    outline: 2px solid var(--fire-orange);
    outline-offset: 3px;
}


/* ================================================================
   REDUCED MOTION
   ================================================================ */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}


/* ================================================================
   FINAL UI FIXES
   Maharashtra Fire Services - Red + Blue
   ================================================================ */

/* Keep the locator cards the same visual height.
   The station list scrolls internally instead of stretching the map. */
.station-locator {
    align-items: start !important;
    min-height: 0 !important;
}

.station-map-card {
    height: 570px !important;
    min-height: 570px !important;
    align-self: start !important;
}

.station-map {
    height: 500px !important;
    min-height: 500px !important;
}

.station-panel {
    height: 570px !important;
    min-height: 0 !important;
    max-height: 570px !important;
    align-self: start !important;
}

.station-list {
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* Correct count styling for the panel count label. */
.station-panel__header #stationCountLabel {
    color: #b51218 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

/* Red + blue station-card treatment. */
.station-card {
    border-left-color: #005baa !important;
}

    .station-card:hover {
        border-color: #b8d2e8 !important;
        border-left-color: #d71920 !important;
    }

.station-card__corp {
    color: #005baa !important;
    background: #edf5fb !important;
}

.station-card__row {
    color: #005baa !important;
}

.station-card__link:hover,
.station-card__phone:hover {
    color: #d71920 !important;
}

/* Stronger Maharashtra red/blue visual hierarchy. */
.fire-hero__title span {
    color: #d71920 !important;
    background: linear-gradient(90deg, #d71920, #ef5350) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

.fire-hero__badge {
    color: #ffb3b6 !important;
    background: rgba(215,25,32,.08) !important;
    border-color: rgba(215,25,32,.22) !important;
}

.fire-hero__badge-dot {
    background: #d71920 !important;
    box-shadow: 0 0 0 5px rgba(215,25,32,.08), 0 0 15px rgba(215,25,32,.55) !important;
}

.fire-search__icon,
.fire-stat__icon,
.service-card__icon,
.safety-flame,
.fire-floating-card__icon {
    color: #d71920 !important;
}

.fire-search__button,
.fire-button--primary,
.fire-header__button {
    background: #d71920 !important;
}

    .fire-search__button:hover,
    .fire-button--primary:hover,
    .fire-header__button:hover {
        background: #ef5350 !important;
    }

.fire-button--secondary {
    border-color: rgba(0,91,170,.30) !important;
}

.fire-hero__trust-icon {
    color: #2d8bd6 !important;
    border-color: rgba(45,139,214,.25) !important;
    background: rgba(0,91,170,.10) !important;
}

.fire-network-status {
    color: #8bc5f0 !important;
    background: rgba(0,91,170,.10) !important;
    border-color: rgba(0,91,170,.22) !important;
}

    .fire-network-status span {
        background: #2d8bd6 !important;
    }

.map-point {
    background: #d71920 !important;
    box-shadow: 0 0 0 6px rgba(215,25,32,.09), 0 0 20px rgba(215,25,32,.50) !important;
}

.map-line {
    background: linear-gradient( 90deg, rgba(215,25,32,.60), rgba(215,25,32,0) ) !important;
}

.network-location__dot {
    background: #d71920 !important;
}

.fire-network-card__footer strong,
.station-map-card__count strong {
    color: #d71920 !important;
}

.section-heading__eyebrow,
.fire-stats__intro span,
.about-link {
    color: #d71920 !important;
}

.section-heading__badge span {
    background: #2d8bd6 !important;
}

.service-card:hover,
.service-card--featured {
    border-color: rgba(215,25,32,.30) !important;
}

.service-card::after {
    background: rgba(215,25,32,.08) !important;
}

.safety-section {
    background: linear-gradient( 180deg, #081e34 0%, #071a2e 100% ) !important;
}

.safety-panel {
    background: linear-gradient( 120deg, rgba(215,25,32,.10), rgba(0,91,170,.055) ) !important;
}

.emergency-panel {
    background: linear-gradient( 90deg, rgba(215,25,32,.13), rgba(0,91,170,.055) ) !important;
    border-color: rgba(215,25,32,.22) !important;
}

.emergency-panel__icon {
    color: #d71920 !important;
    background: rgba(215,25,32,.10) !important;
    border-color: rgba(215,25,32,.20) !important;
}

.emergency-panel__content > span {
    color: #d71920 !important;
}

.emergency-panel__button {
    border-color: rgba(215,25,32,.25) !important;
    background: rgba(215,25,32,.08) !important;
}

    .emergency-panel__button span {
        color: #d71920 !important;
    }

/* Leaflet controls: clean blue/red accent. */
.station-map .leaflet-control-zoom a:hover {
    color: #d71920 !important;
}

/* Prevent long corporation names from making controls awkward. */
.station-select,
.fire-search__select {
    text-overflow: ellipsis;
}

/* Better section rhythm. */
.station-section {
    padding: 76px 0 !important;
}

.services-section {
    padding: 25px 0 !important;
}

.safety-section {
    padding: 76px 0 !important;
}

.about-section {
    padding: 76px 0 !important;
}

/* ================================================================
   DESKTOP LOCATOR
   ================================================================ */

@media (min-width: 1001px) {

    .station-locator {
        grid-template-columns: minmax(0, 1.58fr) minmax(350px, .82fr) !important;
        height: 570px !important;
    }

    .station-map-card,
    .station-panel {
        height: 570px !important;
        max-height: 570px !important;
    }
}

/* ================================================================
   TABLET
   ================================================================ */

@media (max-width: 1000px) {

    .station-locator {
        min-height: 0 !important;
    }

    .station-map-card {
        height: 520px !important;
        min-height: 520px !important;
    }

    .station-map {
        height: 452px !important;
        min-height: 452px !important;
    }

    .station-panel {
        height: 520px !important;
        max-height: 520px !important;
    }
}

/* ================================================================
   MOBILE
   ================================================================ */

@media (max-width: 760px) {

    .station-locator {
        display: grid !important;
        grid-template-columns: 1fr !important;
        height: auto !important;
        gap: 14px !important;
    }

    .station-map-card {
        height: 390px !important;
        min-height: 390px !important;
        max-height: 390px !important;
    }

    .station-map {
        height: 322px !important;
        min-height: 322px !important;
    }

    .station-panel {
        height: 480px !important;
        max-height: 480px !important;
        min-height: 480px !important;
    }

    .station-list {
        max-height: none !important;
    }

    .station-section {
        padding: 58px 0 !important;
    }

    .services-section,
    .safety-section,
    .about-section {
        padding: 60px 0 !important;
    }
}

/* ================================================================
   SMALL MOBILE
   ================================================================ */

@media (max-width: 480px) {

    .station-map-card {
        height: 350px !important;
        min-height: 350px !important;
        max-height: 350px !important;
    }

    .station-map {
        height: 282px !important;
        min-height: 282px !important;
    }

    .station-panel {
        height: 440px !important;
        max-height: 440px !important;
        min-height: 440px !important;
    }
}




/* ================================================================
   FINAL LAYOUT PATCH
   ================================================================ */

/* HERO: keep the two-column hero balanced and prevent the right
   visual from inheriting station-locator dimensions. */
.fire-hero__content {
    grid-template-columns: minmax(0, 1fr) minmax(420px, .82fr) !important;
    gap: 55px !important;
}

.fire-hero__left {
    min-width: 0;
}

.fire-hero__visual {
    min-height: 480px !important;
    width: 100%;
    overflow: visible;
}

.fire-network-card {
    width: min(100%, 560px) !important;
}

/* Separate station locator section. */
.station-section {
    position: relative;
    padding: 78px 0 84px !important;
    background: linear-gradient(180deg, #071c30 0%, #06182a 100%) !important;
    border-top: 1px solid rgba(255,255,255,.04);
}

.station-locator {
    align-items: stretch !important;
    min-height: 0 !important;
}

.station-map-card {
    height: 570px !important;
    min-height: 570px !important;
    align-self: stretch !important;
}

.station-map {
    height: 500px !important;
    min-height: 500px !important;
}

.station-panel {
    height: 570px !important;
    min-height: 0 !important;
    max-height: 570px !important;
    align-self: stretch !important;
}

.station-list {
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* Cleaner red/blue government styling. */
.station-map-card,
.station-panel,
.service-card,
.safety-panel,
.emergency-panel {
    box-shadow: 0 18px 45px rgba(0,0,0,.18) !important;
}

.station-map-card__top {
    background: linear-gradient(90deg, rgba(215,25,32,.07), rgba(0,91,170,.04)) !important;
}

    .station-map-card__top > div:first-child span,
    .station-panel__header #stationCountLabel {
        color: #d71920 !important;
    }

.station-select {
    border-color: #d5e0ea !important;
}

    .station-select:focus {
        border-color: #005baa !important;
        box-shadow: 0 0 0 3px rgba(0,91,170,.10) !important;
    }

.station-card {
    border-left: 3px solid #005baa !important;
}

    .station-card:hover {
        border-left-color: #d71920 !important;
    }

.station-card__corp {
    color: #005baa !important;
    background: rgba(0,91,170,.07) !important;
}

.station-card__row {
    color: #005baa !important;
}

.station-card__link:hover,
.station-card__phone:hover {
    color: #d71920 !important;
}

/* Improve desktop section proportions. */
@media (min-width: 1201px) {
    .fire-hero {
        min-height: 600px !important;
        padding: 0px 0 15px !important;
    }

    .fire-hero__visual {
        min-height: 440px !important;
    }

    .fire-network-map {
        height: 300px !important;
    }
}

/* Tablet */
@media (max-width: 1000px) {
    .fire-hero__content {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }

    .fire-hero__visual {
        max-width: 680px;
        margin: 0 auto;
        min-height: 430px !important;
    }

    .station-map-card {
        height: 520px !important;
        min-height: 520px !important;
    }

    .station-map {
        height: 452px !important;
        min-height: 452px !important;
    }

    .station-panel {
        height: 520px !important;
        max-height: 520px !important;
    }
}

/* Mobile */
@media (max-width: 760px) {
    .fire-container {
        width: calc(100% - 30px) !important;
    }

    .fire-hero {
        min-height: auto !important;
        padding: 52px 0 58px !important;
    }

    .fire-hero__content {
        grid-template-columns: 1fr !important;
    }

    .fire-hero__visual {
        min-height: 390px !important;
        margin-top: 8px;
    }

    .fire-network-card {
        max-width: 100% !important;
        border-radius: 18px !important;
    }

    .fire-network-map {
        height: 275px !important;
    }

    .station-section {
        padding: 58px 0 64px !important;
    }

    .station-locator {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .station-map-card {
        height: 390px !important;
        min-height: 390px !important;
    }

    .station-map {
        height: 322px !important;
        min-height: 322px !important;
    }

    .station-panel {
        height: 480px !important;
        min-height: 480px !important;
        max-height: 480px !important;
    }
}

@media (max-width: 480px) {
    .fire-hero__title {
        font-size: clamp(38px, 11vw, 54px) !important;
    }

    .fire-hero__description {
        font-size: 13px !important;
    }

    .fire-network-map {
        height: 245px !important;
    }

    .station-map-card {
        height: 350px !important;
        min-height: 350px !important;
    }

    .station-map {
        height: 282px !important;
        min-height: 282px !important;
    }

    .station-panel {
        height: 440px !important;
        min-height: 440px !important;
        max-height: 440px !important;
    }
}

/* Header/footer flame icons use the same government red palette. */
.fire-brand__icon {
    background: rgba(255,255,255,.075) !important;
    border-color: rgba(255,255,255,.13) !important;
}

/* Remove the old orange visual completely from CSS variables/classes. */
.fire-header__button,
.fire-search__button,
.fire-button--primary {
    background: #d71920 !important;
}

    .fire-header__button:hover,
    .fire-search__button:hover,
    .fire-button--primary:hover {
        background: #ef5350 !important;
    }


/* ================================================================
   HERO LEAFLET STATION LOCATOR
   The old "LIVE NETWORK / Maharashtra" decorative card is no longer
   used. The hero now contains the real Leaflet station map.
   ================================================================ */

.fire-hero__visual--locator {
    min-height: 0 !important;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;
}

.hero-station-card {
    width: 100%;
    max-width: 590px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 20px;
    box-shadow: 0 30px 75px rgba(0,0,0,.30);
}

.hero-station-card__header {
    min-height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    color: #143a5d;
    /*background: #ffffff;*/
    border-bottom: 1px solid #e4ebf1;
}

.hero-station-card__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: #d71920;
    font-size: 8px;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .12em;
}

.hero-station-card__header h3 {
    margin: 0;
    color: #102e49;
    font-size: 19px;
    line-height: 1.15;
    font-weight: 800;
}

.hero-station-card__status {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 9px;
    color: #176b46;
    background: #effaf4;
    border: 1px solid #cdebd9;
    border-radius: 100px;
    font-size: 9px;
    font-weight: 800;
}

    .hero-station-card__status span {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #35a86f;
        box-shadow: 0 0 0 4px rgba(53,168,111,.10);
    }

.hero-station-card__filter {
    padding: 13px 15px 12px;
    background: #ffffff;
    /* border-bottom: 1px solid #e4ebf1;*/
}

    .hero-station-card__filter label {
        display: block;
        margin-bottom: 7px;
        color: #183a57;
        font-size: 10px;
        font-weight: 800;
    }

.hero-station-select {
    position: relative;
    display: flex;
    align-items: center;
}

    .hero-station-select > svg {
        position: absolute;
        left: 12px;
        z-index: 2;
        color: #005baa;
        pointer-events: none;
    }

.hero-station-select__input {
    width: 100%;
    min-height: 42px;
    padding: 0 34px 0 37px;
    color: #203e59;
    background: #f7fafc;
    border: 1px solid #d6e1eb;
    border-radius: 10px;
    outline: none;
    font-size: 11px;
    font-weight: 650;
    cursor: pointer;
}

    .hero-station-select__input:focus {
        border-color: #005baa;
        box-shadow: 0 0 0 3px rgba(0,91,170,.10);
    }

    .hero-station-select__input option {
        color: #183a57;
        background: #ffffff;
    }

.hero-station-map-wrap {
    position: relative;
    padding: 0;
    background: #d9e7f0;
}

.hero-station-map-label {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 500;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 10px;
    background: rgba(255,255,255,.94);
    border: 1px solid rgba(15,45,70,.10);
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,.12);
    pointer-events: none;
}

    .hero-station-map-label span {
        color: #d71920;
        font-size: 7px;
        line-height: 1;
        font-weight: 850;
        letter-spacing: .10em;
    }

    .hero-station-map-label strong {
        color: #173b58;
        font-size: 10px;
        font-weight: 800;
    }

.hero-station-map {
    width: 100%;
    height: 325px;
    background: #d9e7f0;
}

    .hero-station-map .leaflet-control-zoom {
        margin: 12px !important;
        border: 0 !important;
        box-shadow: 0 5px 18px rgba(0,0,0,.15) !important;
    }

        .hero-station-map .leaflet-control-zoom a {
            width: 30px !important;
            height: 30px !important;
            line-height: 30px !important;
            color: #163b58 !important;
            background: #ffffff !important;
        }

    .hero-station-map .leaflet-control-attribution {
        font-size: 7px !important;
    }

.hero-station-card__footer {
    min-height: 64px;
    display: grid;
    grid-template-columns: .9fr .9fr 1.4fr;
    align-items: center;
    /*background: #ffffff;*/
    border-top: 1px solid #e3eaf0;
}

    .hero-station-card__footer > div {
        min-height: 40px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 0 15px;
        border-right: 1px solid #e4ebf1;
    }

    .hero-station-card__footer strong {
        color: #102e49;
        font-size: 17px;
        line-height: 1;
        font-weight: 850;
    }

    .hero-station-card__footer span {
        margin-top: 3px;
        color: #71869a;
        font-size: 8px;
        font-weight: 650;
    }

.hero-station-services {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    margin: 0 10px;
    padding: 0 9px;
    color: #ffffff;
    background: #005baa;
    border-radius: 8px;
    font-size: 9px;
    font-weight: 800;
    transition: background .2s ease, transform .2s ease;
}

    .hero-station-services:hover {
        color: #ffffff;
        background: #004b8d;
        transform: translateY(-1px);
    }

    .hero-station-services span {
        margin: 0;
        color: inherit;
        font-size: 13px;
    }

/* Existing decorative network card is no longer part of the hero. */
.fire-network-card,
.fire-floating-card {
    /* These remain available for old markup elsewhere,
       but are not used by the new hero locator. */
}

/* Keep the hero balanced around the real map. */
.fire-hero__content {
    grid-template-columns: minmax(0, .70fr) minmax(430px, .95fr) !important;
    gap: 55px !important;
}

/* Header "Fire Stations" now points to the hero map. */
#stations {
    scroll-margin-top: 95px;
}

/* Mobile */
@media (max-width: 1000px) {
    .fire-hero__content {
        grid-template-columns: 1fr !important;
        gap: 35px !important;
    }

    .hero-station-card {
        max-width: 680px;
        margin: 0 auto;
    }

    .fire-hero__visual--locator {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .hero-station-card {
        border-radius: 16px;
    }

    .hero-station-card__header {
        min-height: 62px;
        padding: 13px 14px;
    }

        .hero-station-card__header h3 {
            font-size: 16px;
        }

    .hero-station-map {
        height: 285px;
    }

    .hero-station-card__footer {
        grid-template-columns: 1fr 1fr;
        padding: 8px;
        gap: 7px;
    }

        .hero-station-card__footer > div {
            border-right: 0;
            padding: 5px 8px;
        }

    .hero-station-services {
        grid-column: 1 / -1;
        margin: 2px 0 0;
    }
}

@media (max-width: 420px) {
    .hero-station-map {
        height: 255px;
    }

    .hero-station-card__status {
        display: none;
    }
}

/* ================================================================
   UNIQUE SERVICE CARDS
   Maharashtra Fire Services
   ================================================================ */

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


/* ------------------------------------------------
   BASE CARD
   ------------------------------------------------ */

.service-card {
    --service-accent: #d71920;
    --service-glow: rgba(215, 25, 32, .16);
    position: relative;
    min-height: 180px;
    padding: 21px 20px 20px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    text-decoration: none;
    background: linear-gradient( 145deg, rgba(255,255,255,.055), rgba(255,255,255,.018) );
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(0,0,0,.12);
    transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease, background .28s ease;
}


    /* Decorative bottom-right circle */

    .service-card::after {
        content: "";
        position: absolute;
        width: 105px;
        height: 105px;
        right: -42px;
        bottom: -52px;
        border-radius: 50%;
        background: radial-gradient( circle, var(--service-glow) 0%, rgba(0,0,0,0) 70% );
        transition: width .35s ease, height .35s ease, right .35s ease, bottom .35s ease;
    }


    /* Small accent line */

    .service-card::before {
        content: "";
        position: absolute;
        left: 0;
        top: 20px;
        width: 3px;
        height: 0;
        border-radius: 0 3px 3px 0;
        background: var(--service-accent);
        transition: height .3s ease;
    }


/* ------------------------------------------------
   CARD TOP
   ------------------------------------------------ */

.service-card__top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
}


/* ------------------------------------------------
   ICON
   ------------------------------------------------ */

.service-card__icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--service-accent);
    background: linear-gradient( 145deg, var(--service-glow), rgba(255,255,255,.025) );
    border: 1px solid var(--service-glow);
    border-radius: 12px;
    transition: transform .28s ease, background .28s ease, box-shadow .28s ease;
}

    .service-card__icon i {
        font-size: 19px;
    }


/* ------------------------------------------------
   DEFAULT ARROW
   ------------------------------------------------ */

.service-card__arrow {
    display: flex;
    color: #7891a6;
    font-size: 20px;
    transition: opacity .2s ease, transform .2s ease;
}


/* ------------------------------------------------
   CLICK HERE
   Hidden normally
   ------------------------------------------------ */

.service-card__click {
    position: absolute;
    top: 50%;
    right: 0;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 7px 10px;
    color: #ffffff;
    background: var(--service-accent);
    border-radius: 7px;
    font-size: 9px;
    font-weight: 800;
    white-space: nowrap;
    opacity: 0;
    transform: translateY(-50%) translateX(8px);
    pointer-events: none;
    transition: opacity .22s ease, transform .22s ease;
}

    .service-card__click i {
        font-size: 12px;
    }


/* ------------------------------------------------
   CONTENT
   ------------------------------------------------ */

.service-card__content {
    position: relative;
    z-index: 2;
    margin-top: auto;
    padding-top: 18px;
}

.service-card__number {
    display: block;
    margin-bottom: 7px;
    color: #6f8497;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .12em;
}

.service-card__content h3 {
    margin: 0 0 7px;
    color: #ffffff;
    font-size: 17px;
    line-height: 1.2;
    font-weight: 800;
}

.service-card__content p {
    max-width: 290px;
    margin: 0;
    color: #7e95a8;
    font-size: 10px;
    line-height: 1.55;
}


/* ================================================================
   CARD COLORS
   ================================================================ */

/* 01 - Red */

.service-card--community {
    --service-accent: #d71920;
    --service-glow: rgba(215,25,32,.18);
}


/* 02 - Blue */

.service-card--noc {
    --service-accent: #1683d8;
    --service-glow: rgba(22,131,216,.18);
}


/* 03 - Purple */

.service-card--auditor {
    --service-accent: #9b6cff;
    --service-glow: rgba(155,108,255,.18);
}



/* ================================================================
   HOVER
   ================================================================ */

.service-card:hover {
    transform: translateY(-6px);
    border-color: var(--service-accent);
    background: linear-gradient( 145deg, var(--service-glow), rgba(255,255,255,.025) );
    box-shadow: 0 18px 38px rgba(0,0,0,.24), 0 0 0 1px var(--service-glow);
}


    /* Accent line */

    .service-card:hover::before {
        height: 48px;
    }


    /* Decorative circle expands */

    .service-card:hover::after {
        width: 145px;
        height: 145px;
        right: -50px;
        bottom: -68px;
    }


    /* Icon */

    .service-card:hover .service-card__icon {
        transform: translateY(-2px);
        background: var(--service-glow);
        box-shadow: 0 8px 22px var(--service-glow);
    }


    /* Hide arrow */

    .service-card:hover .service-card__arrow {
        opacity: 0;
        transform: scale(.7);
    }


    /* Show Click Here */

    .service-card:hover .service-card__click {
        opacity: 1;
        transform: translateY(-50%) translateX(0);
    }


    /* Heading */

    .service-card:hover .service-card__content h3 {
        color: #ffffff;
    }




/* ================================================================
   MOBILE / TABLET
   ================================================================ */

@media (max-width: 1100px) {

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


@media (max-width: 600px) {

    .services-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .service-card {
        min-height: 165px;
    }
}

/* ================================================================
   BACK TO TOP BUTTON
   ================================================================ */

.back-to-top {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: #d71920;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    box-shadow: 0 8px 24px rgba(0,0,0,.28), 0 0 0 4px rgba(215,25,32,.08);
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    z-index: 9999;
    transition: opacity .25s ease, visibility .25s ease, transform .25s ease, background .25s ease, box-shadow .25s ease;
}


    /* Visible after scrolling */

    .back-to-top.is-visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }


    /* Hover */

    .back-to-top:hover {
        color: #ffffff;
        background: #005baa;
        transform: translateY(-4px);
        box-shadow: 0 12px 28px rgba(0,0,0,.32), 0 0 0 4px rgba(0,91,170,.10);
    }


    /* Icon */

    .back-to-top i {
        line-height: 1;
        transition: transform .25s ease;
    }

    .back-to-top:hover i {
        transform: translateY(-2px);
    }


/* Mobile */

@media (max-width: 600px) {

    .back-to-top {
        right: 16px;
        bottom: 16px;
        width: 42px;
        height: 42px;
        font-size: 18px;
    }
}

/* =========================================================
        LOGO
        ========================================================= */

.fire-background-brand__logo {
    width: 70px !important;
    height: 70px !important;
    /*flex: 0 0 82px !important;*/
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
}


    .fire-background-brand__logo img {
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        display: block !important;
        object-fit: contain !important;
        filter: drop-shadow(0 3px 7px rgba(0,0,0,.35));
    }

.fire-brand__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-width: 0;
}

.fire-brand__title {
    display: block;
    color: #ffffff;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0;
}

.fire-background-brand__marathi {
    display: block;
    color: rgba(255, 255, 255, 0.82);
    font-family: "Noto Sans Devanagari", "Nirmala UI", Mangal, sans-serif;
    font-size: 12px;
    line-height: 1.65;
    font-weight: 500;
    letter-spacing: 0;
    white-space: nowrap;
}


/* ================================================================
   FINAL RESPONSIVE UI PATCH
   Fire Station Locator + Header + Service Grid
   ================================================================ */

/* Prevent horizontal page shifting on every viewport. */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.fire-landing {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}

/* The previous container had no max-width because min() had only one
   argument. Keep the content centered on wide monitors. */
.fire-container {
    width: min(calc(100% - 40px), var(--fire-container)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}



.fire-background-brand__marathi {
    white-space: nowrap;
}

/* ================================================================
   HERO
   ================================================================ */

.fire-hero__content {
    grid-template-columns: minmax(0, .88fr) minmax(620px, 1.12fr) !important;
   /* align-items: center !important;*/
    gap: 46px !important;
}

.fire-hero__left {
    min-width: 0;
}

.fire-hero__title {
    max-width: 680px;
}

.fire-hero__description {
    max-width: 590px;
}

/* ================================================================
   MAP + DETAILS CARD
   ================================================================ */

.hero-station-card {
    width: 100% !important;
    max-width: 760px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 20px !important;
    box-shadow: 0 25px 60px rgba(0,0,0,.25), 0 0 0 1px rgba(0,91,170,.06);
}

.hero-station-body {
    display: grid;
    grid-template-columns: minmax(0, 1.48fr) minmax(270px, .82fr);
    min-height: 360px;
    background: #eef4f8;
}

.hero-station-map-wrap {
    min-width: 0;
    height: 360px;
}

.hero-station-map {
    height: 360px !important;
    min-height: 360px !important;
}

.station-details-panel {
    min-width: 0;
    min-height: 360px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #f8fafc;
    border-left: 1px solid #dbe5ec;
}

.station-details-panel__header {
    min-height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 13px;
    background: #ffffff;
    border-bottom: 1px solid #e2e9ef;
}

    .station-details-panel__header > div {
        min-width: 0;
    }

        .station-details-panel__header > div > span {
            display: block;
            margin-bottom: 3px;
            color: #d71920;
            font-size: 7px;
            font-weight: 900;
            letter-spacing: .12em;
        }

        .station-details-panel__header > div > strong {
            display: block;
            overflow: hidden;
            color: #123450;
            font-size: 12px;
            line-height: 1.25;
            font-weight: 850;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

.station-details-panel__count {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 44px;
    padding: 5px 7px;
    background: #edf5fb;
    border: 1px solid #d4e5f1;
    border-radius: 8px;
}

    .station-details-panel__count b {
        color: #005baa;
        font-size: 14px;
        line-height: 1;
    }

    .station-details-panel__count small {
        margin-top: 2px;
        color: #6d8193;
        font-size: 7px;
        font-weight: 700;
    }

.station-details-list {
    flex: 1 1 auto;
    min-height: 0;
    padding: 9px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: #b9c9d6 transparent;
}

    .station-details-list::-webkit-scrollbar {
        width: 5px;
    }

    .station-details-list::-webkit-scrollbar-thumb {
        background: #b9c9d6;
        border-radius: 10px;
    }

.station-details-card {
    position: relative;
    margin: 0 0 8px;
    padding: 10px 10px 9px;
    background: #ffffff;
    border: 1px solid #dce6ed;
    border-left: 3px solid #005baa;
    border-radius: 10px;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(15,40,65,.05);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

    .station-details-card:last-child {
        margin-bottom: 0;
    }

    .station-details-card:hover {
        transform: translateY(-1px);
        border-color: #b6d0e3;
        box-shadow: 0 8px 18px rgba(15,40,65,.09);
    }

    .station-details-card.is-selected {
        border-color: #d71920;
        border-left-color: #d71920;
        box-shadow: 0 7px 20px rgba(215,25,32,.12), 0 0 0 1px rgba(215,25,32,.08);
    }

.station-details-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 5px;
}

.station-details-card__number {
    color: #8498a9;
    font-size: 7px;
    font-weight: 850;
    letter-spacing: .08em;
}

.station-details-card__status {
    color: #18734b;
    font-size: 7px;
    font-weight: 750;
}

    .station-details-card__status i {
        margin-right: 3px;
    }

.station-details-card h4 {
    margin: 0 0 4px;
    color: #143a5d;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 850;
}

.station-details-card__corp {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 10px;
    padding: 3px 6px;
    overflow: hidden;
    color: #005baa;
    background: #edf5fb;
    border-radius: 20px;
    font-size: 7px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.station-details-card__address {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 0 0 8px;
    color: #667c8f;
    font-size: 8px;
    line-height: 1.45;
}

    .station-details-card__address i {
        flex: 0 0 auto;
        margin-top: 1px;
        color: #d71920;
    }

.station-details-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.station-details-card__action {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 7px;
    color: #16496f;
    background: #f4f8fb;
    border: 1px solid #dbe6ee;
    border-radius: 6px;
    font-size: 8px;
    font-weight: 750;
}

    .station-details-card__action:hover {
        color: #d71920;
        border-color: #efc4c7;
        background: #fff6f6;
    }

.station-details-card__action--map {
    color: #005baa;
}

.station-details-empty {
    min-height: 230px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 25px 15px;
    color: #7c8f9f;
    text-align: center;
}

    .station-details-empty > i {
        width: 38px;
        height: 38px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #d71920;
        background: #fff0f1;
        border: 1px solid #f2d3d5;
        border-radius: 50%;
        font-size: 15px;
    }

    .station-details-empty strong {
        color: #244762;
        font-size: 11px;
    }

    .station-details-empty span {
        max-width: 205px;
        font-size: 8px;
        line-height: 1.5;
    }

.hero-station-card__footer {
    grid-template-columns: 1fr 1fr !important;
}

.hero-station-card.is-loading {
    opacity: .72;
    pointer-events: none;
}

.fire-map-popup {
    min-width: 190px;
    color: #314b61;
}

    .fire-map-popup > strong {
        display: block;
        margin-bottom: 3px;
        color: #123450;
        font-size: 12px;
    }

    .fire-map-popup > span {
        display: block;
        margin-bottom: 6px;
        color: #005baa;
        font-size: 9px;
        font-weight: 700;
    }

    .fire-map-popup > p {
        margin: 0 0 8px;
        color: #667b8c;
        font-size: 9px;
        line-height: 1.45;
    }

.fire-map-popup__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

    .fire-map-popup__actions a {
        color: #005baa;
        font-size: 9px;
        font-weight: 750;
    }

/* ================================================================
   SERVICE GRID
   ================================================================ */

.services-grid {
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: stretch;
}

.service-card {
    width: 100%;
    min-width: 0;
    /*min-height: 195px !important;*/
    padding: 18px !important;
    border-radius: 16px !important;
}

.service-card__top {
    min-height: 48px;
}

.service-card__content {
    padding-top: 12px;
}

    .service-card__content h3 {
        font-size: 15px !important;
    }

    .service-card__content p {
        font-size: 9px !important;
        line-height: 1.5 !important;
    }

.service-card__click {
    right: 0;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */

@media (max-width: 1250px) {

    .fire-hero__content {
        grid-template-columns: minmax(0, .9fr) minmax(560px, 1.1fr) !important;
        gap: 32px !important;
    }

    .hero-station-body {
        grid-template-columns: minmax(0, 1.35fr) minmax(245px, .8fr);
    }

    .hero-station-map,
    .hero-station-map-wrap,
    .station-details-panel {
        height: 340px !important;
        min-height: 340px;
    }

    .services-grid {
        gap: 9px !important;
    }

    .service-card {
        padding: 15px !important;
    }
}

@media (max-width: 1000px) {

    .fire-hero__content {
        grid-template-columns: 1fr !important;
        gap: 34px !important;
    }

    .fire-hero__left {
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
    }

    .fire-hero__visual--locator {
        width: 100%;
        max-width: 900px !important;
        margin: 0 auto !important;
    }

    .hero-station-card {
        max-width: 900px !important;
    }

    .hero-station-body {
        grid-template-columns: minmax(0, 1.4fr) minmax(260px, .8fr);
    }

    .hero-station-map,
    .hero-station-map-wrap,
    .station-details-panel {
        height: 390px !important;
        min-height: 390px;
    }

    .services-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .service-card {
        min-height: 185px !important;
    }
}

@media (max-width: 760px) {

    .fire-container,
    .fire-header__inner {
        width: calc(100% - 28px) !important;
    }

    .fire-header {
        height: 76px !important;
    }




    .fire-background-brand__logo {
        width: 54px !important;
        height: 54px !important;
        flex: 0 0 54px;
    }

    .fire-brand__title {
        font-size: 14px !important;
        line-height: 1.18;
    }

    .fire-background-brand__marathi {
        font-size: 9px !important;
        line-height: 1.45;
    }

    .fire-brand__text {
        text-align: left;
        max-width: calc(100% - 64px);
    }

    .fire-hero {
        padding: 45px 0 50px !important;
    }

    .fire-hero__title {
        font-size: clamp(38px, 10vw, 54px) !important;
    }

    .fire-hero__description {
        font-size: 13px !important;
        line-height: 1.65;
    }

    .services-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .service-card {
        min-height: 160px !important;
    }

    .hero-station-card {
        border-radius: 16px !important;
    }

    .hero-station-card__header {
        min-height: 64px;
        padding: 12px 13px;
    }

        .hero-station-card__header h3 {
            font-size: 16px;
        }

    .hero-station-card__filter {
        padding: 12px;
    }

    .hero-station-body {
        display: flex !important;
        flex-direction: column;
    }

    .hero-station-map-wrap,
    .hero-station-map {
        height: 300px !important;
        min-height: 300px !important;
    }

    .station-details-panel {
        height: 330px !important;
        min-height: 330px !important;
        border-left: 0;
        border-top: 1px solid #dbe5ec;
    }

    .station-details-panel__header {
        min-height: 58px;
    }

    .station-details-list {
        padding: 8px;
    }

    .hero-station-card__footer {
        min-height: 58px;
    }
}

@media (max-width: 480px) {

    .fire-container,
    .fire-header__inner {
        width: calc(100% - 20px) !important;
    }

    .fire-header {
        height: 72px !important;
    }

    .fire-background-brand__logo {
        width: 48px !important;
        height: 48px !important;
        flex-basis: 48px;
    }

    .fire-brand__title {
        font-size: 12px !important;
    }

    .fire-background-brand__marathi {
        font-size: 8px !important;
    }

    .fire-brand__text {
        max-width: calc(100% - 57px);
    }

    .fire-hero__badge {
        font-size: 8px !important;
    }

    .fire-hero__title {
        font-size: clamp(34px, 11vw, 45px) !important;
    }

    .hero-station-card__status {
        display: none !important;
    }

    .hero-station-map,
    .hero-station-map-wrap {
        height: 260px !important;
        min-height: 260px !important;
    }

    .station-details-panel {
        height: 310px !important;
        min-height: 310px !important;
    }

    .station-details-card h4 {
        font-size: 11px;
    }

    .station-details-card__address {
        font-size: 8px;
    }

    .service-card {
        min-height: 150px !important;
    }

    .service-card__icon {
        width: 44px;
        height: 44px;
    }

    .service-card__content h3 {
        font-size: 14px !important;
    }
}

@media (max-width: 360px) {

    .fire-brand__title {
        font-size: 11px !important;
    }

    .fire-background-brand__marathi {
        font-size: 7px !important;
    }

    .hero-station-map,
    .hero-station-map-wrap {
        height: 235px !important;
        min-height: 235px !important;
    }
}

/* ========================================================================
   FINAL FIX - ACTUAL FIRE STATION HERO LOCATOR
   ------------------------------------------------------------------------
   IMPORTANT:
   The Index view uses:
     .fire-hero__visual--locator
     .hero-station-card
     .hero-station-body
     .hero-station-map-wrap
     .hero-station-map
     .station-details-panel
     .station-details-list
     .station-details-card
   This patch intentionally targets those actual classes.
   ======================================================================== */


/* ------------------------------------------------------------------------
   GLOBAL WIDTH / HORIZONTAL SHIFT
   ------------------------------------------------------------------------ */

html,
body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

.fire-landing {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
}

.fire-container {
    width: min(calc(100% - 48px), var(--fire-container)) !important;
    max-width: var(--fire-container) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}







/* ------------------------------------------------------------------------
   HERO - DO NOT LET THE LOCATOR STRETCH
   ------------------------------------------------------------------------ */

..fire-hero__content {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr) !important;
   /* align-items: center !important;*/
    gap: 45px !important;
}

.fire-hero__left {
    min-width: 0 !important;
}

.fire-hero__visual--locator {
    width: 100% !important;
    min-width: 0 !important;
    height: 570px !important;
    min-height: 570px !important;
    max-height: 570px !important;
    align-self: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}


/* ------------------------------------------------------------------------
   ACTUAL LOCATOR CARD - FIXED 570px
   ------------------------------------------------------------------------ */

.hero-station-card {
    width: 100% !important;
    max-width: 760px !important;
    height: 570px !important;
    min-height: 570px !important;
    max-height: 570px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 20px !important;
    box-shadow: 0 25px 60px rgba(0,0,0,.25), 0 0 0 1px rgba(0,91,170,.06) !important;
}


/* ------------------------------------------------------------------------
   LOCATOR HEADER
   ------------------------------------------------------------------------ */

.hero-station-card__header {
    flex: 0 0 68px !important;
    width: 100% !important;
    height: 68px !important;
    min-height: 68px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 17px !important;
    overflow: hidden !important;
}

    .hero-station-card__header > div {
        min-width: 0;
    }

    .hero-station-card__header h3 {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }


/* ------------------------------------------------------------------------
   FILTER
   ------------------------------------------------------------------------ */

.hero-station-card__filter {
    margin-bottom: 10px !important;
    flex: 0 0 70px !important;
    width: 100% !important;
    height: 70px !important;
    min-height: 70px !important;
    padding: 10px 17px !important;
    overflow: hidden !important;
}

    .hero-station-card__filter label {
        display: block;
        margin-bottom: 6px;
    }


/* ------------------------------------------------------------------------
   BODY = MAP + DETAILS
   ------------------------------------------------------------------------ */

.hero-station-body {
    border-top: 1px solid #e4ebf1 !important;
    flex: 0 0 368px !important;
    width: 100% !important;
    height: 368px !important;
    min-height: 368px !important;
    max-height: 368px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.48fr) minmax(320px, .82fr) !important;
    overflow: hidden !important;
    background: #eef4f8 !important;
}


/* ------------------------------------------------------------------------
   MAP AREA
   ------------------------------------------------------------------------ */

.hero-station-map-wrap {
    width: 100% !important;
    height: 368px !important;
    min-height: 368px !important;
    max-height: 368px !important;
    min-width: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}

.hero-station-map {
    width: 100% !important;
    height: 368px !important;
    min-height: 368px !important;
    max-height: 368px !important;
    min-width: 0 !important;
    background: #d8e8f4 !important;
}

    .hero-station-map.leaflet-container {
        width: 100% !important;
        height: 368px !important;
        min-height: 368px !important;
        max-height: 368px !important;
    }

.hero-station-map-label {
    z-index: 500 !important;
}


/* ------------------------------------------------------------------------
   DETAILS PANEL - FIXED HEIGHT
   ------------------------------------------------------------------------ */

.station-details-panel {
    width: 100% !important;
    height: 368px !important;
    min-height: 368px !important;
    max-height: 368px !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: #f8fafc !important;
    border-left: 1px solid #dbe5ec !important;
}


/* Details header */

.station-details-panel__header {
    flex: 0 0 68px !important;
    width: 100% !important;
    height: 68px !important;
    min-height: 68px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    background: #fff !important;
    border-bottom: 1px solid #e2e9ef !important;
    overflow: hidden !important;
}

    .station-details-panel__header > div {
        min-width: 0 !important;
    }

    .station-details-panel__header strong {
        display: block !important;
        max-width: 190px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }


/* Count */

.station-details-panel__count {
    flex: 0 0 auto !important;
}


/* ------------------------------------------------------------------------
   DETAILS LIST - THIS IS THE ONLY SCROLL AREA
   ------------------------------------------------------------------------ */

.station-details-list {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 8px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-width: thin !important;
    scrollbar-color: #b9c8d5 transparent !important;
}

    .station-details-list::-webkit-scrollbar {
        width: 5px;
    }

    .station-details-list::-webkit-scrollbar-track {
        background: transparent;
    }

    .station-details-list::-webkit-scrollbar-thumb {
        background: #b9c8d5;
        border-radius: 10px;
    }


/* ------------------------------------------------------------------------
   DETAILS CARD
   ------------------------------------------------------------------------ */

.station-details-card {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 7px !important;
    padding: 9px 10px !important;
    background: #fff !important;
    border: 1px solid #dce5ed !important;
    border-left: 3px solid #005baa !important;
    border-radius: 9px !important;
    box-shadow: 0 3px 10px rgba(15,40,65,.05) !important;
    overflow: hidden !important;
}

    .station-details-card:last-child {
        margin-bottom: 0 !important;
    }

    .station-details-card:hover {
        border-left-color: #d71920 !important;
        box-shadow: 0 6px 15px rgba(15,40,65,.09) !important;
    }

    .station-details-card h4 {
        margin: 3px 0 4px !important;
        color: #143a5d !important;
        font-size: 11px !important;
        line-height: 1.25 !important;
        font-weight: 800 !important;
        overflow-wrap: anywhere !important;
    }

.station-details-card__top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
}

.station-details-card__number {
    color: #8294a5 !important;
    font-size: 7px !important;
    font-weight: 800 !important;
}

.station-details-card__status {
    color: #29945d !important;
    font-size: 7px !important;
    font-weight: 750 !important;
}

.station-details-card__corp {
    display: block !important;
    margin-bottom: 5px !important;
    color: #005baa !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    font-weight: 750 !important;
}

.station-details-card__address {
    display: flex !important;
    align-items: flex-start !important;
    gap: 5px !important;
    margin: 0 0 6px !important;
    color: #718398 !important;
    font-size: 10px !important;
    line-height: 1.4 !important;
    overflow-wrap: anywhere !important;
}

    .station-details-card__address i {
        flex: 0 0 auto;
        color: #d71920 !important;
        margin-top: 1px;
    }

.station-details-card__actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
}

    .station-details-card__actions a,
    .station-details-card__phone,
    .station-details-card__map {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 22px !important;
        padding: 0 7px !important;
        color: #143f67 !important;
        background: #f2f7fb !important;
        border: 1px solid #dce8f1 !important;
        border-radius: 5px !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        text-decoration: none !important;
    }

        .station-details-card__actions a:hover,
        .station-details-card__phone:hover,
        .station-details-card__map:hover {
            color: #fff !important;
            background: #005baa !important;
            border-color: #005baa !important;
        }


/* ------------------------------------------------------------------------
   EMPTY DETAILS
   ------------------------------------------------------------------------ */

.station-details-empty {
    min-height: 220px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 20px !important;
    color: #718398 !important;
    text-align: center !important;
}

    .station-details-empty i {
        color: #005baa !important;
        font-size: 25px !important;
    }

    .station-details-empty strong {
        color: #244762 !important;
        font-size: 11px !important;
    }

    .station-details-empty span {
        max-width: 205px !important;
        color: #8293a5 !important;
        font-size: 8px !important;
        line-height: 1.5 !important;
    }


/* ------------------------------------------------------------------------
   LOCATOR FOOTER - FIXED
   ------------------------------------------------------------------------ */

.hero-station-card__footer {
    flex: 0 0 64px !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    align-items: center !important;
   /* background: #fff !important;*/
    border-top: 1px solid #e3eaf0 !important;
    overflow: hidden !important;
}

    .hero-station-card__footer > div {
        height: 42px !important;
        min-height: 42px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        padding: 0 15px !important;
        border-right: 1px solid #e4ebf1 !important;
    }

        .hero-station-card__footer > div:last-child {
            border-right: 0 !important;
        }

    .hero-station-card__footer strong {
        color: #102e49 !important;
        font-size: 17px !important;
        line-height: 1 !important;
        font-weight: 850 !important;
    }

    .hero-station-card__footer span {
        margin-top: 3px !important;
        color: #71869a !important;
        font-size: 8px !important;
    }


/* ------------------------------------------------------------------------
   SERVICES - ACTUAL CLASS IS services-grid
   ------------------------------------------------------------------------ */

.services-grid {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch !important;
}

    .services-grid .service-card {
        width: 100% !important;
        min-width: 0 !important;
        /*min-height: 205px !important;*/
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
    }


/* ------------------------------------------------------------------------
   DESKTOP
   ------------------------------------------------------------------------ */

@media (min-width: 1201px) {

    .fire-hero__content {
        grid-template-columns: minmax(0, .82fr) minmax(516px, 0.9fr) !important;
        gap: 15px !important;
    }

    .fire-hero__visual--locator,
    .hero-station-card {
        height: 570px !important;
        min-height: 570px !important;
        max-height: 570px !important;
    }
}


/* ------------------------------------------------------------------------
   1000 - 1200
   ------------------------------------------------------------------------ */

@media (max-width: 1200px) and (min-width: 1001px) {

    .fire-hero__content {
        grid-template-columns: minmax(0, .85fr) minmax(520px, 1.15fr) !important;
        gap: 28px !important;
    }

    .hero-station-card {
        max-width: 680px !important;
        height: 540px !important;
        min-height: 540px !important;
        max-height: 540px !important;
    }

    .fire-hero__visual--locator {
        height: 540px !important;
        min-height: 540px !important;
        max-height: 540px !important;
    }

    .hero-station-card__header {
        flex-basis: 62px !important;
        height: 62px !important;
        min-height: 62px !important;
    }

    .hero-station-card__filter {
        flex-basis: 66px !important;
        height: 66px !important;
        min-height: 66px !important;
    }

    .hero-station-body {
        flex-basis: 348px !important;
        height: 348px !important;
        min-height: 348px !important;
        max-height: 348px !important;
    }

    .hero-station-map-wrap,
    .hero-station-map,
    .hero-station-map.leaflet-container,
    .station-details-panel {
        height: 348px !important;
        min-height: 348px !important;
        max-height: 348px !important;
    }

    .hero-station-card__footer {
        flex-basis: 64px !important;
        height: 64px !important;
        min-height: 64px !important;
    }
}


/* ------------------------------------------------------------------------
   TABLET
   ------------------------------------------------------------------------ */

@media (max-width: 1000px) {

    .fire-hero__content {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }

    .fire-hero__left {
        width: 100% !important;
        max-width: 900px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .fire-hero__visual--locator {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        overflow: visible !important;
    }

    .hero-station-card {
        width: 100% !important;
        max-width: 900px !important;
        height: 540px !important;
        min-height: 540px !important;
        max-height: 540px !important;
    }

    .hero-station-body {
        flex-basis: 348px !important;
        height: 348px !important;
        min-height: 348px !important;
        max-height: 348px !important;
        grid-template-columns: minmax(0, 1.4fr) minmax(260px, .8fr) !important;
    }

    .hero-station-map-wrap,
    .hero-station-map,
    .hero-station-map.leaflet-container,
    .station-details-panel {
        height: 348px !important;
        min-height: 348px !important;
        max-height: 348px !important;
    }

    .services-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}


/* ------------------------------------------------------------------------
   MOBILE 760
   ------------------------------------------------------------------------ */

@media (max-width: 760px) {

    .fire-container,
    .fire-header__inner {
        width: calc(100% - 28px) !important;
    }

    .fire-header {
        height: 72px !important;
    }





    .fire-hero {
        min-height: auto !important;
        padding: 45px 0 50px !important;
    }

    .fire-hero__content {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
    }

    .fire-hero__visual--locator {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .hero-station-card {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        border-radius: 16px !important;
    }

    .hero-station-card__header {
        flex-basis: 62px !important;
        height: 62px !important;
        min-height: 62px !important;
        padding: 11px 13px !important;
    }

    .hero-station-card__filter {
        flex-basis: 68px !important;
        height: 68px !important;
        min-height: 68px !important;
        padding: 10px 12px !important;
    }

    .hero-station-body {
        flex: 0 0 auto !important;
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .hero-station-map-wrap,
    .hero-station-map,
    .hero-station-map.leaflet-container {
        width: 100% !important;
        height: 300px !important;
        min-height: 300px !important;
        max-height: 300px !important;
    }

    .station-details-panel {
        width: 100% !important;
        height: 330px !important;
        min-height: 330px !important;
        max-height: 330px !important;
        border-left: 0 !important;
        border-top: 1px solid #dbe5ec !important;
    }

    .station-details-panel__header {
        flex-basis: 58px !important;
        height: 58px !important;
        min-height: 58px !important;
    }

    .station-details-list {
        flex: 1 1 auto !important;
        min-height: 0 !important;
    }

    .hero-station-card__footer {
        flex-basis: 60px !important;
        height: 60px !important;
        min-height: 60px !important;
        max-height: 60px !important;
    }

    .services-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

        .services-grid .service-card {
            min-height: 160px !important;
        }
}


/* ------------------------------------------------------------------------
   SMALL MOBILE 480
   ------------------------------------------------------------------------ */

@media (max-width: 480px) {

    .fire-container,
    .fire-header__inner {
        width: calc(100% - 20px) !important;
    }

    .fire-header {
        height: 70px !important;
    }

    .fire-brand__title {
        font-size: 12px !important;
    }

    .fire-background-brand__marathi {
        font-size: 8px !important;
    }

    .hero-station-card__header {
        height: 60px !important;
        min-height: 60px !important;
        flex-basis: 60px !important;
        padding: 10px 11px !important;
    }

        .hero-station-card__header h3 {
            font-size: 15px !important;
        }

    .hero-station-card__filter {
        height: 66px !important;
        min-height: 66px !important;
        flex-basis: 66px !important;
    }

    .hero-station-map-wrap,
    .hero-station-map,
    .hero-station-map.leaflet-container {
        height: 260px !important;
        min-height: 260px !important;
        max-height: 260px !important;
    }

    .station-details-panel {
        height: 310px !important;
        min-height: 310px !important;
        max-height: 310px !important;
    }

    .station-details-card {
        padding: 8px !important;
    }

        .station-details-card h4 {
            font-size: 10px !important;
        }

    .station-details-card__address {
        font-size: 7px !important;
    }

    .hero-station-card__footer {
        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
    }

        .hero-station-card__footer strong {
            font-size: 15px !important;
        }
}


/* ------------------------------------------------------------------------
   EXTRA SMALL 360
   ------------------------------------------------------------------------ */

@media (max-width: 360px) {

    .hero-station-map-wrap,
    .hero-station-map,
    .hero-station-map.leaflet-container {
        height: 235px !important;
        min-height: 235px !important;
        max-height: 235px !important;
    }

    .station-details-panel {
        height: 290px !important;
        min-height: 290px !important;
        max-height: 290px !important;
    }

    .fire-brand__title {
        font-size: 11px !important;
    }

    .fire-background-brand__marathi {
        font-size: 7px !important;
    }
}


/* ------------------------------------------------------------------------
   LEAFLET INVALID SIZE / RESIZE SAFETY
   ------------------------------------------------------------------------ */

.hero-station-map .leaflet-container {
    width: 100%;
    height: 100%;
}

.hero-station-map .leaflet-control-zoom {
    margin: 10px !important;
}

.hero-station-map .leaflet-control-attribution {
    font-size: 7px !important;
}


.hero-station-select > i {
    padding-right: 10px;
}

/* ================================================================
   CHOSEN MUNICIPAL CORPORATION DROPDOWN
   ================================================================ */

.hero-station-select .chosen-container {
    width: 100% !important;
    font-size: 12px;
}

.hero-station-select .chosen-container-single .chosen-single {
    height: 42px;
    line-height: 40px;
    padding: 0 38px 0 39px;
    color: #243b53;
    background: #f8fafc;
    border: 1px solid #dce5ee;
    border-radius: 10px;
    box-shadow: none;
    font-size: 12px;
    font-weight: 600;
}

    .hero-station-select .chosen-container-single .chosen-single span {
        margin-right: 0;
    }

    .hero-station-select .chosen-container-single .chosen-single div {
        width: 30px;
    }

        .hero-station-select .chosen-container-single .chosen-single div b {
            background: none !important;
            position: relative;
            width: 100%;
            height: 100%;
        }

            .hero-station-select .chosen-container-single .chosen-single div b::after {
                content: "\f107";
                position: absolute;
                top: 0;
                right: 8px;
                color: #71879b;
                font-family: FontAwesome;
                font-size: 13px;
            }

.hero-station-select .chosen-container-active.chosen-with-drop .chosen-single {
    border-color: #2d82c9;
    box-shadow: 0 0 0 3px rgba(0,91,170,.10);
}

.hero-station-select .chosen-container .chosen-drop {
    margin-top: 4px;
    border: 1px solid #dce5ee;
    border-radius: 10px;
    box-shadow: 0 12px 30px rgba(15,40,65,.15);
    overflow: hidden;
    z-index: 3000;
}

.hero-station-select .chosen-container .chosen-results {
    margin: 0;
    padding: 6px;
}

    .hero-station-select .chosen-container .chosen-results li {
        padding: 9px 10px;
        color: #243b53;
        border-radius: 7px;
        font-size: 12px;
    }

        .hero-station-select .chosen-container .chosen-results li.highlighted {
            background: #d71920;
            color: #fff;
        }

.hero-station-select .chosen-container .chosen-search {
    padding: 8px;
}

    .hero-station-select .chosen-container .chosen-search input {
        width: 100%;
        min-height: 34px;
        padding: 6px 9px;
        border: 1px solid #dce5ee;
        border-radius: 7px;
        outline: none;
    }

        .hero-station-select .chosen-container .chosen-search input:focus {
            border-color: #2d82c9;
            box-shadow: 0 0 0 2px rgba(0,91,170,.08);
        }

/* ================================================================
   LEAFLET MAP FULLSCREEN BUTTON
   ================================================================ */

.leaflet-control-fullscreen {
    width: 34px !important;
    height: 34px !important;
    margin: 15px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: #122a40 !important;
    background: #fff !important;
    border: 1px solid rgba(0,0,0,.12) !important;
    border-radius: 4px !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.18) !important;
    cursor: pointer;
    font-size: 14px;
}

    .leaflet-control-fullscreen:hover {
        color: #d71920 !important;
        background: #fff !important;
    }

    .leaflet-control-fullscreen:focus {
        outline: 2px solid rgba(215,25,32,.35);
        outline-offset: 1px;
    }

#fireStationMap:fullscreen,
#fireStationMap:-webkit-full-screen {
    width: 100vw !important;
    height: 100vh !important;
    z-index: 99999;
    border-radius: 0;
}

#fireStationMap.fire-map-fullscreen-fallback {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 99999 !important;
    border-radius: 0 !important;
}

body.fire-map-fullscreen-active {
    overflow: hidden !important;
}

#fireStationMap.fire-map-fullscreen-fallback .leaflet-control-fullscreen {
    z-index: 100000;
}

@media (max-width: 600px) {
    .leaflet-control-fullscreen {
        margin: 10px !important;
    }

    .hero-station-select .chosen-container-single .chosen-single {
        height: 40px;
        line-height: 38px;
    }
}


/* ================================================================
   FIRE CORPORATION SEARCH DROPDOWN
   Dependency-free searchable dropdown used by site_FireStation_Searchable_Clean
   ================================================================ */
.fire-corporation-search-dropdown {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    z-index: 4000;
}

    .fire-corporation-search-dropdown .fire-corporation-search-menu {
        z-index: 99999;
    }

.hero-station-card__filter {
    position: relative !important;
    z-index: 5000 !important;
}

.hero-station-card {
    overflow: visible !important;
}
/* ==========================================================================
   Fire Station Portal - Definitive searchable Municipal Corporation combo
   This is a dependency-free override. No Chosen.js required.
   ========================================================================== */

/* Hide any Chosen UI left by an older/cached script. */
.chosen-container,
.chosen-drop,
.chosen-search,
.chosen-results {
    display: none !important;
}

.hero-station-select {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 42px !important;
}

.fire-corporation-combo {
    position: relative !important;
    width: 100% !important;
    min-height: 42px !important;
    z-index: 100 !important;
}

.fire-corporation-combo-input {
    display: block !important;
    width: 100% !important;
    height: 42px !important;
    box-sizing: border-box !important;
    padding: 0 42px 0 10px !important;
    border: 1px solid #d6e1eb !important;
    border-radius: 10px !important;
    outline: none !important;
    background: #f7fafc !important;
    color: #203e59 !important;
    font-size: 11px !important;
    font-weight: 650 !important;
}

    .fire-corporation-combo-input:focus,
    .fire-corporation-combo.is-open .fire-corporation-combo-input {
        border-color: #1683d8 !important;
        background: #ffffff !important;
        box-shadow: 0 0 0 2px rgba(22,131,216,.10) !important;
    }

.fire-corporation-combo-arrow {
    position: absolute !important;
    top: 1px !important;
    right: 1px !important;
    width: 40px !important;
    height: 40px !important;
    border: 0 !important;
    background: transparent !important;
    color: #49677f !important;
    cursor: pointer !important;
    z-index: 4 !important;
}

/* The list is attached to BODY and uses fixed positioning, so the existing
   .hero-station-card { overflow:hidden; } cannot clip it. */
.fire-corporation-combo-menu {
    position: fixed !important;
    z-index: 2147483647 !important;
    background: #fff !important;
    border: 1px solid #b8c7d6 !important;
    border-radius: 9px !important;
    box-shadow: 0 14px 35px rgba(0,0,0,.25) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 5px 0 !important;
    box-sizing: border-box !important;
}

.fire-corporation-combo-option {
    display: block !important;
    width: 100% !important;
    min-height: 38px !important;
    padding: 9px 13px !important;
    border: 0 !important;
    background: #fff !important;
    color: #16344e !important;
    text-align: left !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}

    .fire-corporation-combo-option:hover,
    .fire-corporation-combo-option.is-selected {
        background: #eaf4ff !important;
        color: #075ea8 !important;
    }

.fire-corporation-combo-empty {
    padding: 14px !important;
    color: #7b8794 !important;
    font-size: 12px !important;
}