/* ================================================================
   Five Star Maxi Cab — Homepage styles (fsh-home.css)
   Loaded only on front page via is_front_page() in functions.php.
   Palette tokens defined in custom.css :root.
   ================================================================ */

/* ── Shared section utilities ──────────────────────────────────── */
.fsh-section {
    padding: 80px 0;
}
.fsh-section-sm {
    padding: 56px 0;
}
.fsh-section-head {
    text-align: center;
    margin-bottom: 52px;
}
.fsh-section-head h2 {
    font-size: clamp(34px, 4.5vw, 52px);
    font-weight: 800;
    line-height: 1.18;
    margin-bottom: 14px;
}
.fsh-section-head p {
    font-size: 17px;
    max-width: 620px;
    margin: 0 auto;
    line-height: 1.75;
}
.fsh-eyebrow {
    display       : inline-block;
    font-size     : 15px;
    font-weight   : 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    color         : #54B6F4;
    margin-bottom : 14px;
}

/* scrollbar / overflow fix */
body.home { overflow-x: hidden; }
body.home #page,
body.home #wrapper-inner,
body.home .wp-site-blocks { overflow: visible !important; }


/* ================================================================
   1. HERO SLIDER
   ================================================================ */
.fsh-hero {
    position   : relative;
    min-height : 92vh;
    display    : flex;
    align-items: center;
    overflow   : hidden;
    padding    : 90px 0 100px;
}

/* Slide track — all 3 slides absolutely stacked */
.fsh-slides {
    position: absolute;
    inset   : 0;
    z-index : 0;
}
.fsh-slide {
    position           : absolute;
    inset              : 0;
    background-size    : cover;
    background-position: center center;
    background-repeat  : no-repeat;
    opacity            : 0;
}
/* Mobile: single static image — slides 2+3 not downloaded on mobile */
.fsh-slide-1 {
    background-image: url('/wp-content/uploads/fsh-hero/hero-1.webp');
    opacity: 1;
}
/* Desktop: bias image right so vehicle shows clearly on right half */
@media (min-width: 768px) {
    .fsh-slide   { background-position: 60% center; }
    .fsh-slide-1 { animation: fsh-fade 12s infinite 0s; opacity: 0; }
    .fsh-slide-2 { background-image: url('/wp-content/uploads/fsh-hero/hero-2.webp'); animation: fsh-fade 12s infinite 4s; }
    .fsh-slide-3 { background-image: url('/wp-content/uploads/fsh-hero/hero-3.webp'); animation: fsh-fade 12s infinite 8s; }
}

@keyframes fsh-fade {
    0%           { opacity: 0; }
    5%, 30%      { opacity: 1; }
    35%, 100%    { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .fsh-slide-1 { opacity: 1 !important; animation: none !important; }
    .fsh-slide-2, .fsh-slide-3 { display: none; }
}

/* Directional overlay: readable left side, vehicle visible right side */
.fsh-hero-overlay {
    position  : absolute;
    inset     : 0;
    z-index   : 1;
    background: linear-gradient(
        to right,
        rgba(5,16,32,.90)  0%,
        rgba(8,24,48,.78)  22%,
        rgba(10,30,54,.55) 45%,
        rgba(10,28,50,.22) 65%,
        rgba(6,18,38,.06)  82%,
        transparent        100%
    );
}

/* Hero content sits above overlay */
.fsh-hero-content {
    position : relative;
    z-index  : 2;
    max-width: 580px;
    padding  : 0;
}

.fsh-hero-content .fsh-eyebrow {
    color        : #54B6F4;
    margin-bottom: 20px;
    text-shadow  : 0 1px 10px rgba(0,0,0,.60);
}

.fsh-hero-title {
    font-size     : clamp(38px, 5.2vw, 70px);
    font-weight   : 900;
    color         : #FFFFFF;
    line-height   : 1.04;
    margin-bottom : 26px;
    font-family   : var(--title-font, 'Radio Canada', sans-serif);
    letter-spacing: -.03em;
    text-shadow   : 0 2px 28px rgba(0,0,0,.60), 0 1px 6px rgba(0,0,0,.40);
}

.fsh-hero-text {
    font-size    : clamp(.95rem, 1.4vw, 1.08rem);
    color        : rgba(234,244,251,.88);
    line-height  : 1.78;
    margin-top   : 20px;
    margin-bottom: 0;
    max-width    : 520px;
    text-shadow  : 0 1px 10px rgba(0,0,0,.55);
}

/* ── Book Now ──────────────────────────────────────────────────── */
@keyframes fsh-btn-pulse {
    0%, 100% { box-shadow: 0 6px 28px rgba(84,182,244,.45), 0 2px 10px rgba(0,0,0,.22); }
    50%      { box-shadow: 0 10px 48px rgba(84,182,244,.80), 0 0 0 8px rgba(84,182,244,.16), 0 2px 10px rgba(0,0,0,.22); }
}
.fsh-hero-btn-primary {
    display        : inline-flex;
    align-items    : center;
    gap            : 12px;
    padding        : 0 44px;
    height         : 68px;
    min-width      : 300px;
    justify-content: center;
    background     : linear-gradient(135deg, #60BFFF 0%, #1E9EE0 50%, #1488C8 100%);
    animation      : fsh-btn-pulse 2.4s ease-in-out infinite;
    color          : #FFFFFF;
    border-radius  : 14px;
    font-size      : 1.25rem;
    font-weight    : 900;
    text-decoration: none;
    transition     : background .25s, transform .22s, box-shadow .22s;
    white-space    : nowrap;
    letter-spacing : 0.06em;
    border         : none;
    position       : relative;
    overflow       : hidden;
}
/* Shine sweep on hover */
.fsh-hero-btn-primary::after {
    content   : '';
    position  : absolute;
    inset     : 0;
    background: linear-gradient(115deg, transparent 25%, rgba(255,255,255,.22) 50%, transparent 75%);
    transform : translateX(-100%);
    transition: transform .5s ease;
}
.fsh-hero-btn-primary:hover::after { transform: translateX(100%); }
.fsh-hero-btn-primary:hover {
    background : linear-gradient(135deg, #7CD3FF 0%, #3AAEE8 50%, #2299D4 100%);
    transform  : translateY(-3px) scale(1.015);
    color      : #fff;
    animation  : none;
    box-shadow : 0 16px 44px rgba(84,182,244,.65), 0 4px 16px rgba(0,0,0,.22);
}
.fsh-hero-btn-primary:focus-visible {
    outline       : 3px solid #fff;
    outline-offset: 4px;
}

/* ── Call Now — glassmorphism rounded button (consistent on all views) ── */
.fsh-hero-btn-call {
    display                : inline-flex;
    align-items            : center;
    gap                    : 14px;
    padding                : 0 28px 0 14px;
    height                 : 70px;
    min-width              : 300px;
    background             : rgba(255,255,255,.08);
    backdrop-filter        : blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border                 : 1.5px solid rgba(255,255,255,.25);
    border-radius          : 14px;
    text-decoration        : none;
    margin-top             : 20px;
    transition             : border-color .28s, background .28s, transform .25s, box-shadow .25s;
    box-shadow             : 0 4px 24px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.12);
}
.fsh-hero-btn-call:hover {
    border-color: rgba(84,182,244,.75);
    background  : rgba(84,182,244,.15);
    transform   : translateY(-2px);
    box-shadow  : 0 10px 32px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.14);
}
.fsh-hero-btn-call:focus-visible {
    outline       : 3px solid #54B6F4;
    outline-offset: 4px;
}

.fsh-call-icon {
    width          : 44px;
    height         : 44px;
    border-radius  : 50%;
    background     : rgba(84,182,244,.28);
    border         : 1.5px solid rgba(84,182,244,.55);
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-size      : 1.05rem;
    color          : #54B6F4;
    flex-shrink    : 0;
    transition     : background .25s, border-color .25s, color .25s;
}
.fsh-hero-btn-call:hover .fsh-call-icon {
    background  : rgba(84,182,244,.45);
    border-color: #54B6F4;
    color       : #fff;
}
.fsh-call-text {
    display        : flex;
    flex-direction : column;
    gap            : 4px;
    justify-content: center;
}
.fsh-call-label {
    font-size     : .64rem;
    font-weight   : 700;
    color         : rgba(255,255,255,.58);
    text-transform: uppercase;
    letter-spacing: .14em;
    line-height   : 1;
    transition    : color .25s;
}
.fsh-call-number {
    font-size  : 1rem;
    font-weight: 800;
    color      : #FFFFFF;
    line-height: 1;
    transition : color .25s;
}
.fsh-hero-btn-call:hover .fsh-call-label  { color: rgba(84,182,244,.85); }
.fsh-hero-btn-call:hover .fsh-call-number { color: #54B6F4; }

/* unused wrapper kept for back-compat */
.fsh-hero-btns { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }

/* Trust badges row */
.fsh-hero-badges {
    display    : flex;
    gap        : 28px;
    flex-wrap  : wrap;
    margin-top : 48px;
    padding-top: 36px;
    border-top : 1px solid rgba(255,255,255,.16);
}
.fsh-hero-badge {
    display    : flex;
    align-items: center;
    gap        : 9px;
    color      : rgba(234,244,251,.88);
    font-size  : 14px;
    font-weight: 600;
    text-shadow: 0 1px 8px rgba(0,0,0,.40);
}
.fsh-hero-badge i {
    color     : #54B6F4;
    font-size : 18px;
    width     : 20px;
    text-align: center;
}

/* ── Tablet (768–1199px) ──────────────────────────────────────── */
@media (max-width: 1199px) and (min-width: 768px) {
    .fsh-hero         { padding: 80px 0 90px; }
    .fsh-hero-content { max-width: 500px; }
    .fsh-hero-title   { font-size: clamp(36px, 4.8vw, 56px); }
}

/* ── Mobile (<768px) ──────────────────────────────────────────── */
@media (max-width: 767px) {
    .fsh-hero {
        min-height : 100svh;
        align-items: flex-start;
        padding    : 64px 0 80px;
    }
    /* Mobile: top-to-bottom gradient so image shows through at bottom */
    .fsh-hero-overlay {
        background: linear-gradient(
            to bottom,
            rgba(5,16,32,.85)  0%,
            rgba(8,24,48,.75)  35%,
            rgba(10,30,54,.60) 60%,
            rgba(10,28,50,.40) 80%,
            rgba(6,18,38,.18)  100%
        );
    }
    .fsh-hero-content   { max-width: 100%; padding: 0; }
    .fsh-hero-title     { font-size: clamp(30px, 8vw, 44px); line-height: 1.08; margin-bottom: 20px; }
    .fsh-hero-text      { font-size: .97rem; max-width: 100%; }
    .fsh-hero-btn-primary,
    .fsh-hero-btn-call  { width: 100%; justify-content: center; min-width: 0; }
    .fsh-hero-btn-primary { height: 70px; font-size: 1.3rem; }
    .fsh-call-label  { font-size: .70rem; }
    .fsh-call-number { font-size: 1.12rem; }
    .fsh-hero-badges { gap: 14px; margin-top: 36px; }
}

/* ── Small Mobile (<480px) ──────────────────────────────────── */
@media (max-width: 479px) {
    .fsh-hero             { padding: 52px 0 68px; }
    .fsh-hero-title       { font-size: clamp(26px, 8.5vw, 36px); }
    .fsh-hero-text        { font-size: .92rem; line-height: 1.68; }
    .fsh-hero-btn-primary { height: 64px; font-size: 1.15rem; padding: 0 28px; }
    .fsh-call-number      { font-size: 1.05rem; }
}


/* ================================================================
   2. STATS STRIP
   ================================================================ */
.fsh-stats {
    padding: 0;
}
.fsh-stats-inner {
    display              : grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap                  : 0;
}
.fsh-stat-item {
    padding         : 36px 24px;
    text-align      : center;
    position        : relative;
    display         : flex;
    flex-direction  : column;
    align-items     : center;
    justify-content : flex-start;
}
.fsh-stat-item + .fsh-stat-item::before {
    content : '';
    position: absolute;
    left    : 0; top: 20%; bottom: 20%;
    width   : 1px;
}
.fsh-stat-icon {
    width          : 64px;
    height         : 64px;
    margin         : 0 auto 16px;
    border-radius  : 50%;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-size      : 26px;
    line-height    : 1;
}
html:not([data-theme="dark"]) .fsh-stat-icon { background: #1E8BC3; color: #fff; }
html[data-theme="dark"]       .fsh-stat-icon { background: #54B6F4; color: #0B2038; }

.fsh-stat-number {
    font-size  : clamp(36px, 5vw, 54px);
    font-weight: 900;
    line-height: 1;
    margin-bottom: 6px;
    font-family: var(--title-font, 'Radio Canada', sans-serif);
}
.fsh-stat-label {
    font-size     : 13px;
    font-weight   : 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    line-height   : 1.3;
}
/* hide forced line breaks on large screens — labels wrap naturally */
@media (min-width: 561px) {
    .fsh-stat-label br { display: none; }
}

/* Light */
html:not([data-theme="dark"]) .fsh-stats { background: #EAF4FB; }
html:not([data-theme="dark"]) .fsh-stat-item + .fsh-stat-item::before { background: #D8E7F2; }
html:not([data-theme="dark"]) .fsh-stat-number { color: #143A63; }
html:not([data-theme="dark"]) .fsh-stat-label  { color: #5C6B7A; }

/* Dark */
html[data-theme="dark"] .fsh-stats { background: #0B2038; }
html[data-theme="dark"] .fsh-stat-item + .fsh-stat-item::before { background: rgba(84,182,244,.25); }
html[data-theme="dark"] .fsh-stat-number { color: #54B6F4; }
html[data-theme="dark"] .fsh-stat-label  { color: rgba(234,244,251,.70); }

@media (max-width: 560px) {
    .fsh-stats-inner { grid-template-columns: repeat(3, 1fr); }
    .fsh-stat-item   { padding: 20px 10px; }
    .fsh-stat-icon   { width: 48px; height: 48px; font-size: 20px; margin-bottom: 12px; }
    .fsh-stat-number { font-size: clamp(24px, 6vw, 36px); }
    .fsh-stat-label  { font-size: 11px; letter-spacing: 0.4px; }
}


/* ================================================================
   3. BOOKING SECTION
   Already styled by style.css (.fs404-book-section).
   We just add wrapper overrides here.
   ================================================================ */
.fsh-booking-section { padding: 80px 0; }

.fsh-booking-section .fsh-section-head h2 { margin-bottom: 12px; }

/* Light */
html:not([data-theme="dark"]) .fsh-booking-section {
    background:
        radial-gradient(circle at 8% 30%, rgba(84,182,244,.14), transparent 40%),
        #FFFFFF;
}
html:not([data-theme="dark"]) .fsh-booking-section .fsh-section-head h2 { color: #0B2038; }
html:not([data-theme="dark"]) .fsh-booking-section .fsh-section-head p  { color: #5C6B7A; }

/* Dark */
html[data-theme="dark"] .fsh-booking-section {
    background:
        radial-gradient(circle at 8% 30%, rgba(84,182,244,.12), transparent 40%),
        #071827;
}
html[data-theme="dark"] .fsh-booking-section .fsh-section-head h2 { color: #FFFFFF; }
html[data-theme="dark"] .fsh-booking-section .fsh-section-head p  { color: rgba(234,244,251,.75); }


/* ================================================================
   4. SERVICES GRID
   ================================================================ */
.fsh-services-section .fsh-section-head h2 { margin-bottom: 12px; }

/* Light */
html:not([data-theme="dark"]) .fsh-services-section { background: #F5F9FC; }
html:not([data-theme="dark"]) .fsh-services-section .fsh-section-head h2 { color: #0B2038; }
html:not([data-theme="dark"]) .fsh-services-section .fsh-section-head p  { color: #5C6B7A; }

/* Dark */
html[data-theme="dark"] .fsh-services-section { background: #0B2038; }
html[data-theme="dark"] .fsh-services-section .fsh-section-head h2 { color: #FFFFFF; }
html[data-theme="dark"] .fsh-services-section .fsh-section-head p  { color: rgba(234,244,251,.75); }

/* Grid */
.fsh-services-grid {
    display              : grid;
    grid-template-columns: repeat(3, 1fr);
    gap                  : 28px;
}

/* Card */
.fsh-service-card {
    border-radius : 18px;
    overflow      : hidden;
    padding       : 0;
    transition    : transform .28s, box-shadow .28s;
    display       : flex;
    flex-direction: column;
}
.fsh-service-card:hover { transform: translateY(-5px); }

html:not([data-theme="dark"]) .fsh-service-card {
    background: #FFFFFF;
    border    : 1px solid #D8E7F2;
    box-shadow: 0 8px 30px rgba(11,32,56,.07);
}
html:not([data-theme="dark"]) .fsh-service-card:hover {
    box-shadow: 0 20px 50px rgba(11,32,56,.13);
}
html[data-theme="dark"] .fsh-service-card {
    background: #143A63;
    border    : 1px solid rgba(84,182,244,.22);
    box-shadow: 0 8px 30px rgba(0,0,0,.28);
}
html[data-theme="dark"] .fsh-service-card:hover {
    box-shadow: 0 20px 50px rgba(0,0,0,.40);
}

/* Card image */
.fsh-service-img {
    width   : 100%;
    height  : 190px;
    overflow: hidden;
    flex-shrink: 0;
}
.fsh-service-img img {
    width     : 100%;
    height    : 100%;
    object-fit: cover;
    display   : block;
    transition: transform .4s ease;
}
.fsh-service-card:hover .fsh-service-img img { transform: scale(1.05); }

/* Card body */
.fsh-service-body {
    display       : flex;
    flex-direction: column;
    flex          : 1;
    padding       : 24px 24px 26px;
}
.fsh-service-card h3 {
    font-size    : 17px;
    font-weight  : 800;
    line-height  : 1.3;
    margin-bottom: 8px;
}
.fsh-service-card p {
    font-size    : 14.5px;
    line-height  : 1.7;
    margin-bottom: 0;
    flex         : 1;
}
.fsh-service-link {
    display        : inline-flex;
    align-items    : center;
    gap            : 7px;
    padding        : 10px 20px;
    background     : #54B6F4;
    color          : #06264a;
    border-radius  : 999px;
    font-size      : .88rem;
    font-weight    : 800;
    text-decoration: none;
    margin-top     : 18px;
    align-self     : flex-start;
    transition     : background .2s, transform .2s;
    white-space    : nowrap;
}
.fsh-service-link:hover {
    background: #7ECFF7;
    color     : #06264a;
    transform : translateY(-2px);
}
.fsh-service-link:active {
    background: #3aa8e8;
    color     : #fff;
    transform : translateY(1px) scale(0.97);
}

html:not([data-theme="dark"]) .fsh-service-card h3 { color: #0B2038; }
html:not([data-theme="dark"]) .fsh-service-card p  { color: #5C6B7A; }
html[data-theme="dark"] .fsh-service-card h3        { color: #FFFFFF; }
html[data-theme="dark"] .fsh-service-card p         { color: rgba(234,244,251,.70); }

@media (max-width: 991px) {
    .fsh-services-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .fsh-services-section .container { padding-left: 20px; padding-right: 20px; }
}

/* dots hidden on desktop */
.fsh-svc-dots { display: none; }

@media (max-width: 576px) {

    /* ── Container: clip overflow, keep header padding ─────────── */
    .fsh-services-section .container {
        overflow      : hidden;
        padding-left  : 0;
        padding-right : 0;
    }
    .fsh-services-section .fsh-section-head {
        padding-left  : 20px;
        padding-right : 20px;
        margin-bottom : 40px;
    }

    /* ── Carousel track ─────────────────────────────────────────── */
    .fsh-services-grid {
        display            : flex;
        grid-template-columns: none;
        flex-wrap          : nowrap;
        overflow-x         : auto;
        scroll-snap-type   : x mandatory;
        scroll-behavior    : smooth;
        gap                : 20px;
        padding            : 8px 20px 24px;
        margin             : 0;
        -ms-overflow-style : none;
        scrollbar-width    : none;
        align-items        : center;
    }
    .fsh-services-grid::-webkit-scrollbar { display: none; }

    /* ── Cards ──────────────────────────────────────────────────── */
    .fsh-service-card {
        flex             : 0 0 82vw;
        max-width        : 320px;
        scroll-snap-align: center;
        transition       : transform .35s ease, box-shadow .35s ease, opacity .35s ease;
        opacity          : 0.72;
        transform        : scale(0.96);
    }
    .fsh-service-card.is-active {
        opacity  : 1;
        transform: scale(1);
    }
    html:not([data-theme="dark"]) .fsh-service-card.is-active {
        box-shadow: 0 16px 48px rgba(11,32,56,.16);
    }
    html[data-theme="dark"] .fsh-service-card.is-active {
        box-shadow: 0 16px 48px rgba(0,0,0,.45);
    }

    /* ── More internal card padding ─────────────────────────────── */
    .fsh-service-body {
        padding: 24px 22px 28px;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .fsh-service-card h3 { margin-bottom: 0; }
    .fsh-service-card p  { margin-bottom: 0; }

    /* ── Pagination dots ────────────────────────────────────────── */
    .fsh-svc-dots {
        display        : flex;
        justify-content: center;
        align-items    : center;
        gap            : 6px;
        padding        : 12px 0 4px;
    }
    .fsh-svc-dot {
        width        : 8px;
        height       : 8px;
        border-radius: 50%;
        transition   : width .3s, border-radius .3s, background .3s;
    }
    html:not([data-theme="dark"]) .fsh-svc-dot           { background: rgba(30,139,195,.25); }
    html:not([data-theme="dark"]) .fsh-svc-dot.is-active  { width: 22px; border-radius: 4px; background: #1E8BC3; }
    html[data-theme="dark"]       .fsh-svc-dot            { background: rgba(84,182,244,.25); }
    html[data-theme="dark"]       .fsh-svc-dot.is-active  { width: 22px; border-radius: 4px; background: #54B6F4; }
}


/* ================================================================
   4b. PERTH SUBURBS GRID
   ================================================================ */
.fsh-suburbs-section { padding: 80px 0; }

html:not([data-theme="dark"]) .fsh-suburbs-section { background: #F5F9FC; }
html[data-theme="dark"]       .fsh-suburbs-section { background: #071827; }

html:not([data-theme="dark"]) .fsh-suburbs-section .fsh-section-head h2 { color: #0B2038; }
html:not([data-theme="dark"]) .fsh-suburbs-section .fsh-section-head p  { color: #5C6B7A; }
html[data-theme="dark"]       .fsh-suburbs-section .fsh-section-head h2 { color: #EAF4FB; }
html[data-theme="dark"]       .fsh-suburbs-section .fsh-section-head p  { color: rgba(234,244,251,.75); }

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

.fsh-suburb-card {
    display        : flex;
    align-items    : center;
    gap            : 10px;
    padding        : 22px 20px;
    border-radius  : 10px;
    border         : 1px solid;
    text-decoration: none;
    transition     : background .22s, border-color .22s, transform .22s, box-shadow .22s;
}
.fsh-suburb-card:active {
    transform: translateY(1px);
    opacity  : 0.88;
}
.fsh-suburb-card:hover {
    transform      : translateY(-3px);
    text-decoration: none;
}

html:not([data-theme="dark"]) .fsh-suburb-card {
    background  : #FFFFFF;
    border-color: #D8E7F2;
    box-shadow  : 0 2px 10px rgba(11,32,56,.05);
}
html:not([data-theme="dark"]) .fsh-suburb-card:hover {
    background  : #143A63;
    border-color: #143A63;
    box-shadow  : 0 8px 28px rgba(20,58,99,.22);
}
html[data-theme="dark"] .fsh-suburb-card {
    background  : #0E2236;
    border-color: rgba(84,182,244,.14);
    box-shadow  : 0 2px 10px rgba(0,0,0,.25);
}
html[data-theme="dark"] .fsh-suburb-card:hover {
    background  : #143A63;
    border-color: #54B6F4;
    box-shadow  : 0 8px 28px rgba(0,0,0,.40);
}

.fsh-suburb-pin {
    color      : #54B6F4;
    font-size  : 15px;
    flex-shrink: 0;
    margin-top : 2px;
    transition : color .22s;
}
.fsh-suburb-card:hover .fsh-suburb-pin { color: #54B6F4; }

.fsh-suburb-text {
    display       : flex;
    flex-direction: column;
    gap           : 3px;
}
.fsh-suburb-name {
    font-size  : 14px;
    font-weight: 700;
    line-height: 1.3;
    transition : color .22s;
}
.fsh-suburb-sub {
    font-size  : 11px;
    font-weight: 500;
    line-height: 1;
    transition : color .22s;
}
html:not([data-theme="dark"]) .fsh-suburb-sub              { color: #7A90A4; }
html:not([data-theme="dark"]) .fsh-suburb-card:hover .fsh-suburb-sub { color: rgba(255,255,255,.75); }
html[data-theme="dark"]       .fsh-suburb-sub              { color: rgba(234,244,251,.50); }
html[data-theme="dark"]       .fsh-suburb-card:hover .fsh-suburb-sub { color: rgba(234,244,251,.80); }
html:not([data-theme="dark"]) .fsh-suburb-name              { color: #1A3A56; }
html:not([data-theme="dark"]) .fsh-suburb-card:hover .fsh-suburb-name { color: #FFFFFF; }
html[data-theme="dark"]       .fsh-suburb-name              { color: rgba(234,244,251,.82); }
html[data-theme="dark"]       .fsh-suburb-card:hover .fsh-suburb-name { color: #EAF4FB; }

.fsh-suburb-note {
    text-align : center;
    font-size  : .85rem;
    margin-top : 28px;
    font-weight: 500;
}
html:not([data-theme="dark"]) .fsh-suburb-note { color: #5C7A8C; }
html[data-theme="dark"]       .fsh-suburb-note { color: rgba(234,244,251,.55); }
.fsh-suburb-note a {
    color          : #54B6F4;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.fsh-suburbs-section .fsh-section-head { margin-bottom: 40px; }

@media (max-width: 991px) { .fsh-suburb-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) {
    .fsh-suburb-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .fsh-suburbs-section .fsh-section-head h2 { font-size: clamp(26px, 6vw, 36px); }
}
@media (max-width: 400px) {
    .fsh-suburb-grid { grid-template-columns: 1fr; }
    .fsh-suburb-card { padding: 18px 16px; }
}


/* ================================================================
   5. WHY CHOOSE US
   ================================================================ */
.fsh-why-section { padding: 80px 0; }
.fsh-why-section .fsh-section-head { margin-bottom: 28px; }
.fsh-why-section .fsh-section-head h2,
.fsh-why-section .fsh-section-head p { color: #FFFFFF; }
.fsh-why-section .fsh-section-head p { color: rgba(234,244,251,.80); }

html:not([data-theme="dark"]) .fsh-why-section { background: #143A63; }
html[data-theme="dark"]       .fsh-why-section { background: #0B2038; }

.fsh-why-grid {
    display              : grid;
    grid-template-columns: repeat(4, 1fr);
    gap                  : 28px;
}
.fsh-why-item {
    text-align: center;
    padding   : 36px 20px;
}
.fsh-why-icon {
    width          : 72px;
    height         : 72px;
    border-radius  : 50%;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-size      : 28px;
    margin         : 0 auto 22px;
    transition     : transform .28s;
}
.fsh-why-item:hover .fsh-why-icon { transform: scale(1.08); }

html:not([data-theme="dark"]) .fsh-why-icon {
    background: rgba(84,182,244,.20);
    color     : #54B6F4;
}
html[data-theme="dark"] .fsh-why-icon {
    background: rgba(84,182,244,.18);
    color     : #54B6F4;
}

.fsh-why-item h3 {
    font-size    : 18px;
    font-weight  : 800;
    color        : #FFFFFF;
    margin-bottom: 10px;
}
.fsh-why-item p {
    font-size  : 15px;
    line-height: 1.7;
    margin     : 0;
    color      : rgba(234,244,251,.78);
}

@media (max-width: 991px) { .fsh-why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 576px) { .fsh-why-grid { grid-template-columns: 1fr; gap: 12px; } }


/* ================================================================
   6. FAQ
   ================================================================ */
.fsh-faq-section { padding: 80px 0; }
.fsh-faq-section .fsh-section-head h2 { margin-bottom: 12px; }

html:not([data-theme="dark"]) .fsh-faq-section { background: #FFFFFF; }
html:not([data-theme="dark"]) .fsh-faq-section .fsh-section-head h2 { color: #0B2038; }
html:not([data-theme="dark"]) .fsh-faq-section .fsh-section-head p  { color: #5C6B7A; }
html[data-theme="dark"] .fsh-faq-section { background: #071827; }
html[data-theme="dark"] .fsh-faq-section .fsh-section-head h2 { color: #FFFFFF; }
html[data-theme="dark"] .fsh-faq-section .fsh-section-head p  { color: rgba(234,244,251,.75); }

.fsh-faq-list {
    max-width: 840px;
    margin   : 0 auto;
    display  : flex;
    flex-direction: column;
    gap      : 14px;
}
.fsh-faq-item {
    border-radius: 14px;
    overflow     : hidden;
    border       : 1px solid;
}
html:not([data-theme="dark"]) .fsh-faq-item {
    background  : #FFFFFF;
    border-color: #D8E7F2;
    box-shadow  : 0 4px 16px rgba(11,32,56,.06);
}
html[data-theme="dark"] .fsh-faq-item {
    background  : #143A63;
    border-color: rgba(84,182,244,.22);
}

.fsh-faq-item summary {
    list-style  : none;
    cursor      : pointer;
    padding     : 22px 28px;
    font-size   : 16px;
    font-weight : 700;
    display     : flex;
    align-items : center;
    justify-content: space-between;
    gap         : 16px;
    user-select : none;
}
.fsh-faq-item summary::-webkit-details-marker { display: none; }

html:not([data-theme="dark"]) .fsh-faq-item summary { color: #0B2038; }
html[data-theme="dark"] .fsh-faq-item summary       { color: #EAF4FB; }

/* Toggle icon via ::after */
.fsh-faq-item summary::after {
    content    : '\2b';   /* + */
    font-family: "Font Awesome 6 Pro", "Font Awesome 6 Free";
    font-weight: 900;
    font-size  : 14px;
    flex-shrink: 0;
    color      : #143A63;
    transition : transform .25s;
}
.fsh-faq-item[open] summary::after {
    content  : '\f068'; /* minus */
    transform: rotate(0deg);
    color    : #54B6F4;
}
html[data-theme="dark"] .fsh-faq-item summary::after,
html[data-theme="dark"] .fsh-faq-item[open] summary::after { color: #54B6F4; }

.fsh-faq-body {
    padding    : 0 28px 24px;
    font-size  : 15.5px;
    line-height: 1.75;
}
html:not([data-theme="dark"]) .fsh-faq-body { color: #5C6B7A; }
html[data-theme="dark"] .fsh-faq-body       { color: rgba(234,244,251,.75); }

/* Separator between summary and body */
.fsh-faq-item[open] summary {
    border-bottom: 1px solid;
    margin-bottom: 0;
}
html:not([data-theme="dark"]) .fsh-faq-item[open] summary { border-color: #D8E7F2; }
html[data-theme="dark"] .fsh-faq-item[open] summary       { border-color: rgba(84,182,244,.20); }

@media (max-width: 767px) {
    .fsh-faq-item summary { padding: 18px 20px; font-size: 15px; }
    .fsh-faq-body         { padding: 0 20px 20px; }
}


/* ================================================================
   7. CTA BANNER
   ================================================================ */
.fsh-cta-section { padding: 80px 0; text-align: center; }

html:not([data-theme="dark"]) .fsh-cta-section { background: #143A63; }
html[data-theme="dark"]       .fsh-cta-section { background: #0B2038; }

.fsh-cta-section h2 {
    font-size    : clamp(28px, 4.5vw, 48px);
    font-weight  : 900;
    color        : #FFFFFF;
    margin-bottom: 16px;
    line-height  : 1.15;
}
.fsh-cta-section p {
    font-size    : 17px;
    color        : rgba(234,244,251,.80);
    margin-bottom: 36px;
    max-width    : 560px;
    margin-left  : auto;
    margin-right : auto;
    line-height  : 1.75;
}
.fsh-cta-btns {
    display    : flex;
    gap        : 18px;
    justify-content: center;
    flex-wrap  : wrap;
}
.fsh-cta-btn-sky {
    display        : inline-flex;
    align-items    : center;
    gap            : 9px;
    padding        : 16px 34px;
    background     : #54B6F4;
    color          : #0B2038;
    border         : 2px solid #54B6F4;
    border-radius  : 999px;
    font-size      : 15px;
    font-weight    : 800;
    text-decoration: none;
    transition     : background .25s, transform .25s;
    white-space    : nowrap;
}
.fsh-cta-btn-sky:hover {
    background: #EAF4FB;
    color     : #0B2038;
    transform : translateY(-2px);
}
.fsh-cta-btn-white {
    display        : inline-flex;
    align-items    : center;
    gap            : 9px;
    padding        : 16px 34px;
    background     : transparent;
    color          : #FFFFFF;
    border         : 2px solid rgba(255,255,255,.65);
    border-radius  : 999px;
    font-size      : 15px;
    font-weight    : 700;
    text-decoration: none;
    transition     : border-color .25s, background .25s, transform .25s;
    white-space    : nowrap;
}
.fsh-cta-btn-white:hover {
    border-color: #FFFFFF;
    background  : rgba(255,255,255,.10);
    color       : #FFFFFF;
    transform   : translateY(-2px);
}

@media (max-width: 576px) {
    .fsh-cta-btns { flex-direction: column; align-items: center; }
    .fsh-cta-btn-sky,
    .fsh-cta-btn-white { width: 100%; max-width: 320px; justify-content: center; }
}


/* ================================================================
   6. GOOGLE REVIEWS
   ================================================================ */
.fsh-google-reviews-section { padding: 80px 0; }

/* ── Unified component: one card wrapping everything ── */
.fsh-reviews-layout {
    display      : flex;
    align-items  : stretch;
    border-radius: 24px;
    overflow     : hidden;
}

/* ── Left: rating summary panel ── */
.fsh-reviews-summary {
    flex-shrink   : 0;
    width         : 260px;
    padding       : 44px 32px;
    display       : flex;
    flex-direction: column;
    align-items   : center;
    justify-content: center;
    text-align    : center;
    gap           : 12px;
}
.fsh-rs-google {
    display        : flex;
    align-items    : center;
    gap            : 8px;
    font-size      : 11px;
    font-weight    : 800;
    text-transform : uppercase;
    letter-spacing : 2px;
    color          : #54B6F4;
    margin-bottom  : 6px;
}
.fsh-rs-google i { font-size: 18px; }
.fsh-rs-score {
    font-size     : 76px;
    font-weight   : 900;
    line-height   : 1;
    letter-spacing: -4px;
}
.fsh-rs-outof {
    font-size     : 30px;
    font-weight   : 700;
    letter-spacing: -1px;
    opacity       : .5;
}
.fsh-rs-stars {
    color         : #F4B941;
    font-size     : 24px;
    letter-spacing: 3px;
}
.fsh-rs-count {
    font-size  : 13px;
    line-height: 1.6;
    margin     : 0 0 8px;
}

/* ── Right: carousel wrapper: arrows as flex siblings of track ── */
.fsh-reviews-carousel-wrap {
    flex       : 1;
    display    : flex;
    align-items: center;
    gap        : 12px;
    padding    : 32px 24px;
    min-width  : 0;
}

/* ── Scrollable cards track ── */
.fsh-reviews-cards {
    flex             : 1;
    display          : flex;
    align-items      : stretch;
    gap              : 18px;
    overflow-x       : auto;
    scroll-snap-type : x mandatory;
    scrollbar-width  : none;
    -ms-overflow-style: none;
    min-width        : 0;
}
.fsh-reviews-cards::-webkit-scrollbar { display: none; }

/* ── Arrow buttons: white bg, navy SVG icon, hover inverts ── */
.fsh-carousel-arrow {
    flex-shrink    : 0;
    width          : 36px;
    height         : 36px;
    border-radius  : 50%;
    border         : 1.5px solid #D8E7F2;
    background     : #FFFFFF;
    color          : #143A63;
    cursor         : pointer;
    display        : flex;
    align-items    : center;
    justify-content: center;
    transition     : background .2s, border-color .2s, color .2s, box-shadow .2s;
    box-shadow     : 0 2px 10px rgba(11,32,56,.10);
    padding        : 0;
}
.fsh-carousel-arrow svg { display: block; flex-shrink: 0; }
.fsh-carousel-arrow:hover {
    background  : #143A63;
    border-color: #143A63;
    color       : #FFFFFF;
    box-shadow  : 0 4px 16px rgba(11,32,56,.22);
}
.fsh-carousel-arrow:disabled {
    opacity   : .3;
    cursor    : not-allowed;
    box-shadow: none;
}

/* ── Review card ── */
.fsh-google-review-card {
    flex-shrink    : 0;
    width          : calc(50% - 9px);
    scroll-snap-align: start;
    border-radius  : 16px;
    padding        : 26px 24px;
    display        : flex;
    flex-direction : column;
    gap            : 14px;
    transition     : transform .25s, box-shadow .25s;
}
.fsh-google-review-card:hover { transform: translateY(-3px); }

/* Card top: name left, stars right */
.fsh-google-review-top {
    display        : flex;
    align-items    : flex-start;
    justify-content: space-between;
    gap            : 12px;
}
.fsh-google-review-top h3 {
    font-size    : 15px;
    font-weight  : 700;
    margin-bottom: 4px;
    line-height  : 1.3;
}
.fsh-google-review-source {
    font-size     : 10.5px;
    font-weight   : 700;
    color         : #54B6F4;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}
.fsh-google-review-stars {
    color         : #F4B941;
    font-size     : 15px;
    letter-spacing: 1.5px;
    white-space   : nowrap;
    flex-shrink   : 0;
}

/* Review text — clamp to 4 lines */
.fsh-google-review-text {
    font-size          : 14.5px;
    line-height        : 1.78;
    display            : -webkit-box;
    -webkit-line-clamp : 4;
    -webkit-box-orient : vertical;
    overflow           : hidden;
}
.fsh-google-review-text.fsh-expanded {
    display            : block !important;
    overflow           : visible !important;
    -webkit-line-clamp : unset !important;
}
.fsh-review-toggle {
    background    : none;
    border        : none;
    padding       : 6px 0 2px;
    cursor        : pointer;
    font-size     : 13px;
    font-weight   : 600;
    color         : #54B6F4;
    display       : none;
    align-self    : flex-start;
    position      : relative;
    z-index       : 10;
    pointer-events: auto;
    line-height   : 1.4;
}
.fsh-review-toggle:hover  { text-decoration: underline; }
.fsh-review-toggle:focus-visible { outline: 2px solid #54B6F4; outline-offset: 3px; border-radius: 3px; }
html:not([data-theme="dark"]) .fsh-review-toggle { color: #1A6FA8; }

.fsh-google-review-text-wrap {
    flex          : 1;
    display       : flex;
    flex-direction: column;
    margin        : 0;
    overflow      : visible;
}
.fsh-google-review-date {
    font-size  : 12px;
    margin-top : auto;
    padding-top: 8px;
}

/* View all button */
.fsh-google-review-btn {
    display        : inline-flex;
    align-items    : center;
    justify-content: center;
    gap            : 8px;
    padding        : 13px 22px;
    background     : #143A63;
    color          : #FFFFFF;
    border         : 2px solid #143A63;
    border-radius  : 999px;
    font-size      : 13px;
    font-weight    : 700;
    text-decoration: none;
    width          : 100%;
    transition     : background .25s, border-color .25s, transform .25s;
    margin-top     : 4px;
    white-space    : nowrap;
}
.fsh-google-review-btn:hover {
    background  : #54B6F4;
    border-color: #54B6F4;
    color       : #0B2038;
    transform   : translateY(-2px);
}

/* ── Light mode ── */
html:not([data-theme="dark"]) .fsh-google-reviews-section { background: #EEF4FA; }
html:not([data-theme="dark"]) .fsh-reviews-layout {
    background: #FFFFFF;
    border    : 1px solid #D8E7F2;
    box-shadow: 0 10px 52px rgba(11,32,56,.10);
}
html:not([data-theme="dark"]) .fsh-reviews-summary {
    border-right: 1px solid #D8E7F2;
}
html:not([data-theme="dark"]) .fsh-rs-score  { color: #0B2038; }
html:not([data-theme="dark"]) .fsh-rs-count  { color: #5C6B7A; }
html:not([data-theme="dark"]) .fsh-google-review-card {
    background: #F6FAFD;
    border    : 1px solid #D8E7F2;
    box-shadow: 0 2px 12px rgba(11,32,56,.05);
}
html:not([data-theme="dark"]) .fsh-google-review-card:hover {
    background: #FFFFFF;
    box-shadow: 0 12px 40px rgba(11,32,56,.12);
}
html:not([data-theme="dark"]) .fsh-google-review-top h3 { color: #0B2038; }
html:not([data-theme="dark"]) .fsh-google-review-text   { color: #5C6B7A; }
html:not([data-theme="dark"]) .fsh-google-review-date   { color: #8A9BAD; }

/* ── Dark mode ── */
html[data-theme="dark"] .fsh-google-reviews-section { background: #071827; }
html[data-theme="dark"] .fsh-reviews-layout {
    background: #0E2236;
    border    : 1px solid rgba(84,182,244,.15);
    box-shadow: 0 10px 52px rgba(0,0,0,.45);
}
html[data-theme="dark"] .fsh-reviews-summary {
    border-right: 1px solid rgba(84,182,244,.15);
}
html[data-theme="dark"] .fsh-rs-score  { color: #EAF4FB; }
html[data-theme="dark"] .fsh-rs-count  { color: rgba(234,244,251,.6); }
html[data-theme="dark"] .fsh-google-review-card {
    background: #143A63;
    border    : 1px solid rgba(84,182,244,.18);
    box-shadow: 0 2px 12px rgba(0,0,0,.28);
}
html[data-theme="dark"] .fsh-google-review-card:hover {
    box-shadow: 0 12px 40px rgba(0,0,0,.48);
}
html[data-theme="dark"] .fsh-google-review-top h3 { color: #EAF4FB; }
html[data-theme="dark"] .fsh-google-review-text   { color: rgba(234,244,251,.78); }
html[data-theme="dark"] .fsh-google-review-date   { color: rgba(234,244,251,.45); }
html[data-theme="dark"] .fsh-google-review-btn {
    background  : rgba(84,182,244,.12);
    border-color: #54B6F4;
    color       : #54B6F4;
}
html[data-theme="dark"] .fsh-google-review-btn:hover {
    background  : #54B6F4;
    border-color: #54B6F4;
    color       : #0B2038;
}


/* ── Responsive ── */
@media (max-width: 900px) {
    .fsh-reviews-summary  { width: 220px; padding: 36px 24px; }
    .fsh-rs-score         { font-size: 62px; }
    .fsh-carousel-arrow   { width: 32px; height: 32px; }
}
@media (max-width: 768px) {
    .fsh-reviews-layout   { flex-direction: column; border-radius: 20px; }
    .fsh-reviews-summary  {
        width          : 100%;
        flex-direction : column;
        align-items    : center;
        justify-content: center;
        text-align     : center;
        gap            : 8px;
        padding        : 28px 24px;
        border-right   : none;
    }
    html:not([data-theme="dark"]) .fsh-reviews-summary { border-bottom: 1px solid #D8E7F2; }
    html[data-theme="dark"]       .fsh-reviews-summary { border-bottom: 1px solid rgba(84,182,244,.15); }
    .fsh-rs-google         { width: 100%; justify-content: center; }
    .fsh-rs-score          { font-size: 52px; }
    .fsh-google-review-btn { width: auto; margin-top: 4px; }
    .fsh-reviews-carousel-wrap { padding: 24px 20px; }
    .fsh-google-review-card    { width: calc(80vw - 80px); }
}
@media (max-width: 480px) {
    /* Tighten wrap padding — no extra right-side hack (was causing card overflow/clip) */
    .fsh-reviews-carousel-wrap {
        padding: 16px 14px 20px;
        gap    : 8px;
    }
    .fsh-carousel-arrow { width: 30px; height: 30px; }
    /* Cards: natural height (don't stretch to match tallest sibling), tighter gap */
    .fsh-reviews-cards {
        gap        : 10px;
        align-items: flex-start;
    }
    /* Card fills the track — replaces the broken viewport-width calc */
    .fsh-google-review-card {
        width  : 100%;
        padding: 18px 16px;
        gap    : 10px;
    }
    .fsh-google-review-stars { font-size: 13px; letter-spacing: 1px; }
    /* Date: natural spacing instead of auto-margin that creates big gaps on short cards */
    .fsh-google-review-date { margin-top: 6px; padding-top: 6px; }
}


/* ================================================================
   7. PAYMENT OPTIONS SECTION
   ================================================================ */
.fsh-payment-section { padding: 80px 0; }
html:not([data-theme="dark"]) .fsh-payment-section { background: #FFFFFF; }
html[data-theme="dark"]       .fsh-payment-section { background: #0B1E30; }

/* header */
.fsh-payment-section .fsh-section-head h2 { color: #0B2038; }
html[data-theme="dark"] .fsh-payment-section .fsh-section-head h2 { color: #EAF4FB; }

/* grid */
.fsh-pay-grid {
    display              : grid;
    grid-template-columns: repeat(4, 1fr);
    gap                  : 20px;
    margin-bottom        : 36px;
}

/* card */
.fsh-pay-card {
    display       : flex;
    flex-direction: column;
    align-items   : center;
    text-align    : center;
    padding       : 28px 20px 24px;
    border-radius : 18px;
    gap           : 0;
    transition    : transform .22s, box-shadow .22s, border-color .22s;
    cursor        : default;
}
.fsh-pay-label {
    margin-top: 16px;
    display   : flex;
    flex-direction: column;
    gap       : 4px;
}
html:not([data-theme="dark"]) .fsh-pay-card {
    background : #FFFFFF;
    border     : 1px solid #D8E7F2;
    box-shadow : 0 3px 18px rgba(11,32,56,.07);
}
html[data-theme="dark"] .fsh-pay-card {
    background : #0E2236;
    border     : 1px solid rgba(84,182,244,.12);
    box-shadow : 0 3px 18px rgba(0,0,0,.28);
}
.fsh-pay-card:hover {
    transform  : translateY(-4px);
    box-shadow : 0 12px 40px rgba(11,32,56,.14);
    border-color: #54B6F4;
}

/* icon area */
.fsh-pay-icon {
    width          : 80px;
    height         : 56px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    border-radius  : 14px;
    flex-shrink    : 0;
    font-size      : 2.6rem;
    line-height    : 1;
}

/* Downloaded logo image variant */
.fsh-pay-icon--img {
    background: transparent;
    border    : none;
    padding   : 0;
    overflow  : hidden;
}
.fsh-pay-icon--img img {
    width        : 100%;
    height       : 100%;
    object-fit   : contain;
    display      : block;
    border-radius: 10px;
}
/* Light bg for logos that need a white box (Google Pay) */
.fsh-pay-icon--img.fsh-pay-icon--light {
    background   : #F5F7FA;
    border       : 1px solid #D8E7F2;
    border-radius: 12px;
    padding      : 8px 12px;
}
.fsh-pay-icon--img.fsh-pay-icon--light img {
    border-radius: 0;
    object-fit   : contain;
}
/* Dark bg for bank card (FA icon) */
.fsh-pay-icon--dark {
    background   : #1A3A56;
    border-radius: 12px;
    font-size    : 2rem;
    color        : #FFFFFF;
}
.fsh-pay-icon--img.fsh-pay-icon--dark {
    background: #1A3A56;
    padding   : 10px 14px;
    border    : none;
}
html[data-theme="dark"] .fsh-pay-icon--dark { background: #0B2038; }

/* ── PTTS logo pill ──────────────────────────────────────────── */
.fsh-pay-icon--ptts {
    background: #1B5E20;
}
.fsh-ptts-logo {
    display       : flex;
    flex-direction: column;
    align-items   : center;
    line-height   : 1.15;
}
.fsh-ptts-top {
    font-size    : .85rem;
    font-weight  : 900;
    color        : #FFFFFF;
    letter-spacing: .12em;
}
.fsh-ptts-sub {
    font-size    : .48rem;
    font-weight  : 600;
    color        : rgba(255,255,255,.75);
    letter-spacing: .06em;
    text-transform: uppercase;
}

/* ── Cabcharge text logo ─────────────────────────────────────── */
.fsh-cabcharge-logo {
    display    : flex;
    align-items: center;
    gap        : 4px;
}
.fsh-cab-c {
    font-size  : 1.9rem;
    font-weight: 900;
    color      : #E8501A;
    line-height: 1;
}
.fsh-cab-text {
    font-size     : .52rem;
    font-weight   : 800;
    color         : #1A3A56;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height   : 1.3;
}
html[data-theme="dark"] .fsh-cab-text { color: #EAF4FB; }
.fsh-cab-sub {
    font-size  : .45rem;
    font-weight: 500;
    color      : #5C7A8C;
    letter-spacing: .03em;
}
html[data-theme="dark"] .fsh-cab-sub { color: rgba(234,244,251,.55); }

/* label */
.fsh-pay-name {
    font-size  : .82rem;
    font-weight: 800;
    color      : #0B2038;
    text-transform: uppercase;
    letter-spacing: .06em;
    line-height: 1.2;
}
html[data-theme="dark"] .fsh-pay-name { color: #EAF4FB; }

.fsh-pay-desc {
    font-size  : .78rem;
    color      : #5C7A8C;
    line-height: 1.5;
    margin-top : -6px;
}
html[data-theme="dark"] .fsh-pay-desc { color: rgba(234,244,251,.60); }

/* PTTS highlight */
.fsh-pay-ptts-badge {
    display      : inline-block;
    padding      : 2px 10px;
    border-radius: 999px;
    background   : rgba(84,182,244,.15);
    color        : #54B6F4;
    font-size    : .72rem;
    font-weight  : 800;
    letter-spacing: .05em;
    margin-bottom: 2px;
}

/* safe-payments bar */
.fsh-pay-bar {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 18px;
    flex-wrap      : wrap;
    padding        : 18px 32px;
    border-radius  : 14px;
    font-size      : .88rem;
    font-weight    : 700;
    letter-spacing : .04em;
}
html:not([data-theme="dark"]) .fsh-pay-bar {
    background: #0B2038;
    color     : #FFFFFF;
}
html[data-theme="dark"] .fsh-pay-bar {
    background: #071827;
    color     : #EAF4FB;
    border    : 1px solid rgba(84,182,244,.15);
}
.fsh-pay-bar i  { color: #54B6F4; font-size: 1.1rem; }
.fsh-pay-bar-sep {
    width : 1px;
    height: 18px;
    background: rgba(255,255,255,.25);
}
html[data-theme="dark"] .fsh-pay-bar-sep { background: rgba(84,182,244,.25); }
.fsh-pay-bar-tagline {
    font-weight: 500;
    opacity    : .80;
    font-size  : .84rem;
}

/* responsive */
@media (max-width: 860px) {
    .fsh-pay-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}
@media (max-width: 480px) {
    .fsh-pay-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .fsh-pay-card { padding: 22px 14px 18px; }
    .fsh-pay-icon { width: 64px; height: 48px; font-size: 2.1rem; }
}


/* ================================================================
   MOBILE PERFORMANCE — content-visibility for below-fold sections
   Defers rendering work until sections near the viewport.
   ================================================================ */
.fsh-services-section        { content-visibility: auto; contain-intrinsic-size: 0 640px; }
.fsh-suburbs-section         { content-visibility: auto; contain-intrinsic-size: 0 560px; }
.fsh-why-section             { content-visibility: auto; contain-intrinsic-size: 0 420px; }
.fsh-payment-section         { content-visibility: auto; contain-intrinsic-size: 0 560px; }
.fsh-google-reviews-section  { content-visibility: auto; contain-intrinsic-size: 0 480px; }
.fsh-faq-section             { content-visibility: auto; contain-intrinsic-size: 0 420px; }
.fsh-areas-section           { content-visibility: auto; contain-intrinsic-size: 0 480px; }
.fsh-cta-section             { content-visibility: auto; contain-intrinsic-size: 0 200px; }


/* ================================================================
   SERVICE AREAS SECTION
   ================================================================ */
.fsh-areas-section {
    padding: 72px 0 80px;
}

.fsh-areas-body {
    display              : grid;
    grid-template-columns: 3fr 1fr 1fr;
    gap                  : 28px;
    margin-top           : 48px;
}

.fsh-area-col {
    padding      : 28px 24px;
    border-radius: 16px;
    border       : 1px solid;
}
html:not([data-theme="dark"]) .fsh-area-col {
    background  : #FFFFFF;
    border-color: #D8E7F2;
    box-shadow  : 0 4px 20px rgba(11,32,56,.05);
}
html[data-theme="dark"] .fsh-area-col {
    background  : #0E2236;
    border-color: rgba(84,182,244,.12);
    box-shadow  : 0 4px 20px rgba(0,0,0,.25);
}

.fsh-area-col-title {
    font-size     : 11px;
    font-weight   : 800;
    text-transform: uppercase;
    letter-spacing: .10em;
    color         : #54B6F4;
    margin-bottom : 14px;
    display       : flex;
    align-items   : center;
    gap           : 7px;
}
.fsh-area-col-title::after {
    content   : '';
    flex      : 1;
    height    : 1px;
    background: rgba(84,182,244,.25);
}

.fsh-area-pills {
    display  : flex;
    flex-wrap: wrap;
    gap      : 7px;
}

.fsh-area-pill {
    display      : inline-flex;
    padding      : 4px 11px;
    border-radius: 999px;
    font-size    : .74rem;
    font-weight  : 600;
    border       : 1px solid;
    transition   : background .18s, color .18s;
    text-decoration: none;
}
html:not([data-theme="dark"]) .fsh-area-pill {
    color       : #1A3A56;
    background  : rgba(11,32,56,.04);
    border-color: rgba(11,32,56,.14);
}
html:not([data-theme="dark"]) .fsh-area-pill--key {
    color       : #0B2038;
    background  : rgba(84,182,244,.14);
    border-color: rgba(84,182,244,.38);
}
html:not([data-theme="dark"]) .fsh-area-pill--link:hover {
    background  : #54B6F4;
    border-color: #54B6F4;
    color       : #fff;
}
html[data-theme="dark"] .fsh-area-pill {
    color       : rgba(234,244,251,.75);
    background  : rgba(255,255,255,.05);
    border-color: rgba(255,255,255,.12);
}
html[data-theme="dark"] .fsh-area-pill--key {
    color       : #EAF4FB;
    background  : rgba(84,182,244,.15);
    border-color: rgba(84,182,244,.35);
}
html[data-theme="dark"] .fsh-area-pill--link:hover {
    background  : #54B6F4;
    border-color: #54B6F4;
    color       : #0B2038;
}

.fsh-area-coverage-note {
    text-align : center;
    font-size  : .84rem;
    margin-top : 28px;
    font-weight: 500;
}
html:not([data-theme="dark"]) .fsh-area-coverage-note { color: #5C7A8C; }
html[data-theme="dark"]       .fsh-area-coverage-note { color: rgba(234,244,251,.55); }
.fsh-area-coverage-note a {
    color          : #54B6F4;
    text-decoration: underline;
    text-underline-offset: 3px;
}

@media (max-width: 900px) {
    .fsh-areas-body { grid-template-columns: 1fr 1fr; }
    .fsh-area-col:first-child { grid-column: 1 / -1; }
}
@media (max-width: 576px) {
    .fsh-areas-body { grid-template-columns: 1fr; }
    .fsh-area-col:first-child { grid-column: auto; }
    .fsh-areas-section { padding: 56px 0 64px; }
}


/* ================================================================
   MOBILE LAYOUT FIXES (≤767px and ≤480px)
   Desktop styles are untouched — only spacing and overflow fixes.
   ================================================================ */

@media (max-width: 767px) {

    /* ── Reduce vertical padding on all sections ───────────────── */
    .fsh-section,
    .fsh-booking-section,
    .fsh-suburbs-section,
    .fsh-why-section,
    .fsh-faq-section,
    .fsh-cta-section,
    .fsh-google-reviews-section,
    .fsh-payment-section { padding-top: 52px; padding-bottom: 52px; }
    .fsh-section-sm      { padding-top: 36px; padding-bottom: 36px; }

    /* ── Section heading ─────────────────────────────────────────── */
    .fsh-section-head   { margin-bottom: 36px; }
    .fsh-section-head p { font-size: 15px; }

    /* ── Stats strip: all 5 visible in one row, no scrolling ─────── */
    .fsh-stats-inner {
        display  : flex;
        flex-wrap: nowrap;
    }

    /* Each card shares space equally and never overflows the row */
    .fsh-stat-item {
        flex    : 1 1 0;
        min-width: 0;
        padding : 18px 6px;
    }

    .fsh-stat-icon   { font-size: 16px; margin-bottom: 4px; }
    .fsh-stat-number { font-size: clamp(18px, 4.5vw, 26px); }
    .fsh-stat-label  { font-size: 9px; letter-spacing: 0.2px; }

    /* ── Eyebrow: reduce letter-spacing to prevent text wrapping ─── */
    .fsh-eyebrow { letter-spacing: 0.5px; font-size: 15px; }

    /* ── Hero buttons: reset min-width so width:100% takes effect ── */
    .fsh-hero-btn-primary,
    .fsh-hero-btn-call { min-width: 0; }

    /* ── Hero badges: stack vertically + right pad clears buttons ── */
    .fsh-hero-badges { flex-direction: column; gap: 10px; padding-right: 80px; }

    /* ── Why Choose Us: tighter item padding ─────────────────────── */
    .fsh-why-item { padding: 24px 16px; }

    /* ── Service Areas: tighter top margin ───────────────────────── */
    .fsh-areas-body { margin-top: 28px; }
}

@media (max-width: 480px) {

    /* ── Eyebrow: tighter still on very small screens ────────────── */
    .fsh-eyebrow { letter-spacing: 0.2px; font-size: 14px; }

    /* ── Section padding: tighter on phones ─────────────────────── */
    .fsh-section,
    .fsh-booking-section,
    .fsh-suburbs-section,
    .fsh-why-section,
    .fsh-faq-section,
    .fsh-cta-section,
    .fsh-google-reviews-section,
    .fsh-payment-section { padding-top: 44px; padding-bottom: 44px; }
    .fsh-section-sm      { padding-top: 30px; padding-bottom: 30px; }

    /* ── Section heading ─────────────────────────────────────────── */
    .fsh-section-head   { margin-bottom: 28px; }
    .fsh-section-head p { font-size: 14px; }
}