/* ============================================================
   LOCATION PAGES — page-service-area.php
   Premium design, no forms, call/WhatsApp CTAs
============================================================ */

/* ── Logo — premium redesign ──────────────────────────────── */
.site-logo-text {
    display:flex; align-items:center; gap:.625rem;
    text-decoration:none;
}
.site-logo-icon {
    width:42px; height:42px; flex-shrink:0; border-radius:10px;
    background:linear-gradient(135deg, #d97706, var(--clr-orange));
    color:#fff; font-size:1.125rem;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 4px 14px rgba(249,115,22,.35);
    transition:transform .2s, box-shadow .2s;
}
.site-logo-text:hover .site-logo-icon { transform:rotate(-10deg) scale(1.05); box-shadow:0 6px 20px rgba(249,115,22,.45); }
.site-logo-words {
    display:flex; flex-direction:column;
    line-height:1; gap:2px;
}
.logo-line1 {
    font-size:.58rem; font-weight:700;
    color:var(--clr-orange);
    letter-spacing:.22em; text-transform:uppercase;
}
.logo-line2 {
    font-size:1.175rem; font-weight:900;
    color:var(--clr-navy);
    letter-spacing:.04em; text-transform:uppercase;
    position:relative;
}
/* Accent underline on "PLUMBERS" */
.logo-line2::after {
    content:'';
    position:absolute; left:0; bottom:-3px;
    width:100%; height:2px;
    background:linear-gradient(90deg, var(--clr-orange), transparent);
    border-radius:2px;
}

/* ── Nav text contrast ────────────────────────────────────── */
.main-navigation .nav-menu a { color:var(--clr-navy) !important; font-weight:600; }
.main-navigation .nav-menu a:hover,
.main-navigation .nav-menu .current-menu-item > a { color:var(--clr-orange) !important; }

/* ── Section label ────────────────────────────────────────── */
.la-label {
    display:inline-block; font-size:.7rem; font-weight:700;
    letter-spacing:.12em; text-transform:uppercase;
    color:var(--clr-orange); margin-bottom:.5rem;
}
.section-label {
    display:inline-block; font-size:.7rem; font-weight:700;
    letter-spacing:.12em; text-transform:uppercase;
    color:var(--clr-orange); margin-bottom:.6rem;
}


/* ============================================================
   HERO
============================================================ */
.la-hero {
    position:relative; color:#fff; overflow:hidden;
    margin-top:calc(-1 * (var(--strip-h) + var(--areas-bar-h) + var(--header-h)));
}
.la-hero__bg {
    position:absolute; inset:0;
    background-size:cover; background-position:center;
    background-color:var(--clr-navy);
}
.la-hero__overlay {
    position:absolute; inset:0;
    background:linear-gradient(105deg, rgba(8,16,36,.96) 0%, rgba(14,26,52,.88) 50%, rgba(14,26,52,.75) 100%);
}
.la-hero .container { position:relative; z-index:1; }

.la-hero__grid {
    display:grid; grid-template-columns:1fr 380px; gap:3rem; align-items:center;
    padding:calc(var(--strip-h) + var(--areas-bar-h) + var(--header-h) + 2rem) 0 3rem;
    min-height:92vh;
}
@media (max-width:1024px) { .la-hero__grid { grid-template-columns:1fr 340px; gap:2rem; } }
@media (max-width:800px)  { .la-hero__grid { grid-template-columns:1fr; min-height:auto; padding-bottom:2rem; } }

/* Breadcrumb */
.la-breadcrumb {
    display:flex; align-items:center; gap:.35rem; flex-wrap:wrap;
    font-size:.75rem; color:rgba(255,255,255,.5); margin-bottom:1rem;
}
.la-breadcrumb a { color:rgba(255,255,255,.5); text-decoration:none; }
.la-breadcrumb a:hover { color:var(--clr-orange-light); }
.la-breadcrumb i  { font-size:.55rem; }
.la-breadcrumb span { color:var(--clr-orange-light); font-weight:600; }

/* Eyebrow */
.la-hero__eyebrow {
    display:inline-flex; align-items:center; gap:.5rem;
    font-size:.78rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
    color:var(--clr-orange-light); margin-bottom:.875rem;
}
.la-hero__eyebrow i { font-size:.75rem; }

/* Headline */
.la-hero__title {
    font-size:clamp(2.75rem, 6vw, 4.75rem); font-weight:900;
    line-height:1.02; margin-bottom:.875rem;
    text-shadow:0 2px 24px rgba(0,0,0,.3);
}
.la-hero__title span { color:var(--clr-orange-light); display:block; }

.la-hero__sub {
    font-size:clamp(1rem, 1.8vw, 1.125rem); color:rgba(255,255,255,.72);
    line-height:1.65; margin-bottom:2rem; max-width:520px;
}


/* Trust pills */
.la-hero__pills {
    display:flex; flex-wrap:wrap; gap:.4rem .875rem;
    font-size:.78rem; color:rgba(255,255,255,.55);
    padding-top:1.25rem; border-top:1px solid rgba(255,255,255,.1);
}
.la-hero__pills span { display:flex; align-items:center; gap:.35rem; }
.la-hero__pills i { color:var(--clr-orange-light); }

/* ── Hero info card (right) ─────────────────────────────── */
.la-hero__right { display:flex; justify-content:flex-end; }
@media (max-width:800px) { .la-hero__right { justify-content:flex-start; } }

.la-info-card {
    width:100%; max-width:360px;
    background:rgba(8,16,36,.75);
    backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    border:1px solid rgba(255,255,255,.1);
    border-radius:1.25rem; overflow:hidden;
    box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.la-info-card__head {
    display:flex; align-items:center; gap:.75rem;
    padding:1.1rem 1.375rem;
    background:rgba(255,255,255,.05);
    border-bottom:1px solid rgba(255,255,255,.07);
    color:#fff;
}
.la-info-card__head > i { color:var(--clr-orange); font-size:1.1rem; flex-shrink:0; }
.la-info-card__head strong { display:block; font-size:.9rem; font-weight:700; }
.la-info-card__head span  { font-size:.75rem; color:rgba(255,255,255,.5); }

.la-info-card__phone { padding:1.25rem 1.375rem .875rem; text-align:center; }
.la-info-card__avail { font-size:.72rem; color:rgba(255,255,255,.45); margin-bottom:.35rem; display:block; }
.la-info-card__number {
    display:block; font-size:1.875rem; font-weight:900; color:#fff;
    text-decoration:none; letter-spacing:.01em;
    transition:color .2s;
}
.la-info-card__number:hover { color:var(--clr-orange-light); }


.la-info-card__trust {
    list-style:none; padding:.875rem 1.375rem 1.25rem; margin:0;
    border-top:1px solid rgba(255,255,255,.07);
    display:flex; flex-direction:column; gap:.55rem;
}
.la-info-card__trust li {
    display:flex; align-items:center; gap:.6rem;
    font-size:.8rem; color:rgba(255,255,255,.6);
}
.la-info-card__trust i { color:var(--clr-orange); width:14px; text-align:center; flex-shrink:0; }

/* ============================================================
   MAIN BODY: content + sidebar
============================================================ */
.la-body {
    display:grid; grid-template-columns:1fr 300px; gap:3rem; align-items:start;
    padding-top:3rem; padding-bottom:3rem;
}
@media (max-width:960px) { .la-body { grid-template-columns:1fr; } }

/* ── Content ─────────────────────────────────────────────── */
.la-section { margin-bottom:3rem; }
.la-section h2 { font-size:clamp(1.5rem,3.5vw,2rem); color:var(--clr-navy); margin-bottom:.875rem; }
.la-lead { font-size:1.0625rem; color:var(--clr-gray-600); line-height:1.75; margin-bottom:1rem; }
.la-section p { color:var(--clr-gray-600); line-height:1.7; margin-bottom:.875rem; }

/* Service list rows */
.la-svc-list { display:flex; flex-direction:column; gap:.5rem; }
.la-svc-row {
    display:flex; align-items:center; gap:1rem;
    background:#fff; border:1px solid var(--clr-gray-200);
    border-radius:.875rem; padding:1rem 1.25rem;
    text-decoration:none; color:var(--clr-navy);
    transition:border-color .2s, box-shadow .2s, transform .2s;
    box-shadow:0 1px 4px rgba(26,44,78,.05);
}
.la-svc-row:hover {
    border-color:var(--clr-orange);
    box-shadow:0 4px 20px rgba(249,115,22,.12);
    transform:translateX(4px);
}
.la-svc-row__icon {
    width:44px; height:44px; flex-shrink:0; border-radius:.625rem;
    background:linear-gradient(135deg,var(--clr-orange),var(--clr-orange-dark));
    color:#fff; display:flex; align-items:center; justify-content:center;
    font-size:1.125rem;
}
.la-svc-row__body { flex:1; }
.la-svc-row__body strong { display:block; font-size:.9375rem; font-weight:700; margin-bottom:.2rem; }
.la-svc-row__body span  { font-size:.8125rem; color:var(--clr-gray-500); line-height:1.5; }
.la-svc-row__arrow { color:var(--clr-gray-300); font-size:.75rem; transition:color .2s, transform .2s; flex-shrink:0; }
.la-svc-row:hover .la-svc-row__arrow { color:var(--clr-orange); transform:translateX(3px); }

/* Suburbs grid */
.la-suburb-grid {
    list-style:none; padding:0; margin:1rem 0 0;
    display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:.5rem;
}
.la-suburb-grid li {
    display:flex; align-items:center; gap:.45rem;
    background:var(--clr-gray-50); border:1px solid var(--clr-gray-200);
    border-radius:.5rem; padding:.55rem .875rem;
    font-size:.8125rem; font-weight:500; color:var(--clr-navy);
    transition:background .2s, color .2s, border-color .2s;
}
.la-suburb-grid li:hover { background:var(--clr-orange); color:#fff; border-color:var(--clr-orange); }
.la-suburb-grid li i { color:var(--clr-orange); font-size:.7rem; flex-shrink:0; transition:color .2s; }
.la-suburb-grid li:hover i { color:#fff; }

/* FAQ */
.la-faq__list { display:flex; flex-direction:column; gap:.5rem; margin-top:1rem; }
.la-faq-item {
    background:#fff; border:1px solid var(--clr-gray-200);
    border-radius:.875rem; overflow:hidden;
    transition:border-color .2s, box-shadow .2s;
}
.la-faq-item:has(.faq-question[aria-expanded="true"]) {
    border-color:var(--clr-orange); box-shadow:0 4px 20px rgba(249,115,22,.1);
}
.la-faq-btn {
    width:100%; background:none; border:none; cursor:pointer;
    padding:1.1rem 1.25rem; display:flex; justify-content:space-between; align-items:center; gap:1rem;
    font-size:.9375rem; font-weight:600; color:var(--clr-navy); text-align:left;
    transition:background .15s;
}
.la-faq-btn:hover { background:var(--clr-gray-50); }
.la-faq-btn i { flex-shrink:0; color:var(--clr-orange); transition:transform .25s; }
.la-faq-btn[aria-expanded="true"] i { transform:rotate(45deg); }
.la-faq-answer { padding:0 1.25rem 1.1rem; border-top:1px solid var(--clr-gray-100); }
.la-faq-answer p { margin:.875rem 0 0; font-size:.9375rem; color:var(--clr-gray-600); line-height:1.7; }
.la-faq-answer[hidden] { display:none; }

/* ── Sidebar ─────────────────────────────────────────────── */
.la-sidebar {
    display:flex; flex-direction:column; gap:1.25rem;
    position:sticky; top:calc(var(--strip-h) + var(--areas-bar-h) + var(--header-h) + 1rem);
}
.la-sidebar-card {
    background:#fff; border:1px solid var(--clr-gray-200);
    border-radius:1rem; overflow:hidden;
    box-shadow:0 2px 12px rgba(26,44,78,.06);
}
.la-sidebar-card--cta {
    background:var(--clr-navy); border-color:transparent; text-align:center;
    padding:1.5rem;
}
.la-sidebar-card__area {
    font-size:.75rem; font-weight:600; color:rgba(255,255,255,.5);
    display:flex; align-items:center; justify-content:center; gap:.35rem;
    margin-bottom:.5rem;
}
.la-sidebar-card__area i { color:var(--clr-orange); }
.la-sidebar-card__label { font-size:.72rem; color:rgba(255,255,255,.45); margin-bottom:.35rem; text-transform:uppercase; letter-spacing:.07em; }
.la-sidebar-card__number {
    display:block; font-size:1.5rem; font-weight:900; color:#fff;
    text-decoration:none; margin-bottom:.25rem;
    transition:color .2s;
}
.la-sidebar-card__number:hover { color:var(--clr-orange-light); }
.la-sidebar-card__hours { font-size:.72rem; color:rgba(255,255,255,.4); margin-bottom:1.1rem; }


.la-sidebar-card__title {
    font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
    color:#fff; background:var(--clr-navy); padding:.75rem 1.1rem;
    display:flex; align-items:center; gap:.5rem; margin:0;
}
.la-sidebar-card__title i { color:var(--clr-orange); }

.la-sidebar-trust {
    list-style:none; padding:.875rem 1.1rem; margin:0;
    display:flex; flex-direction:column; gap:.6rem;
}
.la-sidebar-trust li {
    display:flex; align-items:center; gap:.6rem;
    font-size:.8125rem; font-weight:500; color:var(--clr-gray-700);
}
.la-sidebar-trust i { color:var(--clr-orange); width:14px; text-align:center; flex-shrink:0; }

.la-sidebar-links { list-style:none; padding:.5rem 0; margin:0; }
.la-sidebar-links li a {
    display:flex; align-items:center; gap:.625rem;
    padding:.65rem 1.1rem; font-size:.8125rem; font-weight:600;
    color:var(--clr-gray-700); text-decoration:none;
    transition:background .15s, color .15s;
}
.la-sidebar-links li a:hover { background:var(--clr-gray-50); color:var(--clr-orange); }
.la-sidebar-links li a > i:first-child { color:var(--clr-orange); width:14px; text-align:center; flex-shrink:0; }
.la-sidebar-links li a > i:last-child  { margin-left:auto; font-size:.65rem; color:var(--clr-gray-300); transition:transform .2s; }
.la-sidebar-links li a:hover > i:last-child { transform:translateX(3px); color:var(--clr-orange); }

/* ============================================================
   BOTTOM CTA BAND
============================================================ */
.la-cta-band {
    background:linear-gradient(135deg, #0a1224 0%, var(--clr-navy) 100%);
    padding:3.5rem 0;
}
.la-cta-band__inner {
    display:flex; align-items:center; justify-content:space-between;
    gap:2rem; flex-wrap:wrap;
}
.la-cta-band__text h2 { font-size:clamp(1.5rem,3.5vw,2rem); color:#fff; margin-bottom:.35rem; }
.la-cta-band__text p  { color:rgba(255,255,255,.65); }

/* ============================================================
   ARCHIVE: areas grid
============================================================ */
.areas-archive-grid {
    display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:1.5rem; margin-top:2.5rem;
}
.area-archive-card {
    display:flex; flex-direction:column; background:#fff;
    border:1px solid var(--clr-gray-200); border-radius:1rem; padding:1.75rem;
    text-decoration:none; color:var(--clr-navy);
    box-shadow:0 2px 12px rgba(26,44,78,.06);
    transition:transform .25s, box-shadow .25s, border-color .25s; position:relative;
}
.area-archive-card::before { content:''; position:absolute; top:0; left:0; width:4px; height:100%; background:var(--clr-gray-200); transition:background .2s; border-radius:1rem 0 0 1rem; }
.area-archive-card:hover { transform:translateY(-4px); box-shadow:0 12px 40px rgba(249,115,22,.15); border-color:rgba(249,115,22,.3); }
.area-archive-card:hover::before,.area-archive-card--primary::before { background:var(--clr-orange); }
.area-archive-card__icon { width:48px; height:48px; border-radius:50%; background:linear-gradient(135deg,var(--clr-orange),var(--clr-orange-dark)); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.125rem; margin-bottom:1rem; }
.area-archive-card__title { font-size:1.2rem; font-weight:700; margin-bottom:.35rem; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.area-archive-card__tagline { font-size:.875rem; color:var(--clr-gray-500); margin-bottom:.75rem; }
.area-archive-card__suburbs,.area-archive-card__meta { font-size:.8rem; color:var(--clr-gray-400); margin-bottom:.5rem; }
.area-archive-card__meta { display:flex; flex-wrap:wrap; gap:.35rem .875rem; }
.area-archive-card__meta i,.area-archive-card__suburbs i { margin-right:.25rem; color:var(--clr-orange); }
.area-archive-card__body { flex:1; }
.area-archive-card__cta { display:inline-flex; align-items:center; gap:.35rem; font-size:.875rem; font-weight:700; color:var(--clr-orange); margin-top:auto; padding-top:.875rem; }
.area-archive-card__cta i { font-size:.7rem; transition:transform .2s; }
.area-archive-card:hover .area-archive-card__cta i { transform:translateX(3px); }
/* ============================================================
   COMPACT LOCATION CTA BUTTONS
============================================================ */
.la-hero__actions {
    margin-bottom: 1.35rem;
}
.la-mini-cta-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}
.la-mini-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .42rem;
    min-height: 36px;
    padding: .46rem .72rem;
    border-radius: 11px;
    border: 1px solid rgba(255,255,255,.12);
    text-decoration: none;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .01em;
    line-height: 1;
    white-space: nowrap;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.la-mini-cta i {
    flex: 0 0 auto;
    font-size: .76rem;
    line-height: 1;
}
.la-mini-cta--call {
    background: linear-gradient(180deg, #ff8a1d 0%, #f97316 100%);
    border-color: rgba(255,168,92,.32);
    color: #fff;
    box-shadow: 0 8px 18px rgba(249,115,22,.2);
}
.la-mini-cta--call:hover {
    transform: translateY(-1px);
    background: linear-gradient(180deg, #ff951f 0%, #ea6a12 100%);
    box-shadow: 0 12px 24px rgba(249,115,22,.24);
}
.la-mini-cta--wa {
    background: linear-gradient(180deg, #2bd86b 0%, #20b85a 100%);
    border-color: rgba(87,255,155,.24);
    color: #fff;
    box-shadow: 0 8px 18px rgba(16,95,48,.16);
}
.la-mini-cta--wa:hover {
    transform: translateY(-1px);
    background: linear-gradient(180deg, #31df72 0%, #1ca650 100%);
    box-shadow: 0 12px 24px rgba(16,95,48,.2);
}
.la-info-card__actions,
.la-sidebar-card__actions {
    padding: 0 1.375rem 1rem;
}
.la-info-card__actions .la-mini-cta-group,
.la-sidebar-card__actions .la-mini-cta-group {
    width: auto;
    justify-content: center;
}
.la-info-card__actions .la-mini-cta,
.la-sidebar-card__actions .la-mini-cta {
    flex: 0 0 auto;
    min-width: 104px;
}
@media (max-width: 520px) {
    .la-mini-cta {
        min-height: 34px;
        padding: .42rem .66rem;
        font-size: .72rem;
    }
    .la-info-card__actions .la-mini-cta,
    .la-sidebar-card__actions .la-mini-cta {
        min-width: 98px;
    }
}
}