  /* ---------- SECTION SHELL ---------- */
  section{ padding:120px 0; position:relative; }
  @media(max-width:900px){ section{ padding:80px 0; } }
  .section-light{ background:var(--off-white); color:var(--charcoal); }
  .section-navy{ background:var(--navy); color:var(--white); }
  .section-charcoal{ background:var(--charcoal); color:var(--white); }
  .section-navy .eyebrow, .section-charcoal .eyebrow{ color:var(--gold); }
  .section-head{ max-width:680px; margin-bottom:56px; }
  .section-head h2{ font-size:clamp(1.8rem,3vw,2.6rem); margin-top:20px; line-height:1.2; }
  .section-head p{ margin-top:20px; font-size:1rem; font-weight:300; max-width:600px; }
  .section-light .section-head p{ color:#4b4f54; }
  .section-navy .section-head p, .section-charcoal .section-head p{ color:rgba(255,255,255,0.72); }

  .reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s ease, transform .8s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }

/* ======================================================
   CONTACT HERO
====================================================== */

.page-hero{

    position:relative;

    min-height:100vh;

    display:flex;
    align-items:flex-end;

    overflow:hidden;

    background:var(--charcoal);

}

/* ==========================================
   Background Media
========================================== */

.page-hero-media{

    position:absolute;
    inset:0;

    overflow:hidden;

    z-index:0;

}

/* ==========================================
   Background Image
========================================== */

.contact-hero-image{

    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

    object-position:65% center;

    transform:scale(1.02);

    transition:transform 8s ease;

    z-index:0;

}

.page-hero:hover .contact-hero-image{

    transform:scale(1.05);

}

/* ==========================================
   Overlay
========================================== */

.contact-hero-overlay{

    position:absolute;
    inset:0;

    z-index:1;

    background:

        linear-gradient(
            90deg,
            rgba(10,15,20,.88) 0%,
            rgba(10,15,20,.72) 35%,
            rgba(10,15,20,.45) 65%,
            rgba(10,15,20,.22) 100%
        ),

        linear-gradient(
            180deg,
            rgba(0,0,0,.10) 0%,
            rgba(0,0,0,.78) 100%
        );

}

/* ==========================================
   Topographic Overlay
========================================== */

.page-hero::before{

    content:"";

    position:absolute;
    inset:0;

    z-index:2;

    pointer-events:none;

    background:

        radial-gradient(
            ellipse at 30% 20%,
            rgba(198,165,90,.08),
            transparent 55%
        ),

        repeating-linear-gradient(
            115deg,
            rgba(255,255,255,.03) 0px,
            rgba(255,255,255,.03) 2px,
            transparent 2px,
            transparent 90px
        );

    opacity:.35;

}

/* ==========================================
   Cinematic Vignette
========================================== */

.page-hero::after{

    content:"";

    position:absolute;
    inset:0;

    z-index:3;

    pointer-events:none;

    background:
        radial-gradient(
            ellipse at center,
            transparent 35%,
            rgba(0,0,0,.18) 100%
        );

}

/* ==========================================
   Hero Content
========================================== */

.page-hero-content{

    position:relative;

    z-index:5;

    width:100%;

    padding:80px 0 90px;

}

.page-hero .eyebrow{

    margin-bottom:26px;

}

.page-hero h1{

    max-width:780px;

    color:var(--white);

    font-size:clamp(2.4rem,4.8vw,4.3rem);

    line-height:1.12;

    margin-bottom:28px;

}

.page-hero p{

    max-width:640px;

    color:rgba(255,255,255,.78);

    font-size:1.03rem;

    line-height:1.75;

    font-weight:300;

    margin-bottom:18px;

}

.page-hero-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:18px;

    margin-top:40px;

}

/* ==========================================
   Hero Tag
========================================== */

.page-hero-tag{

    position:absolute;

    top:120px;
    right:48px;

    z-index:6;

    padding:6px 12px;

    font-size:.62rem;

    letter-spacing:.14em;

    text-transform:uppercase;

    color:rgba(255,255,255,.50);

    border:1px solid rgba(255,255,255,.18);

    background:rgba(10,15,20,.25);

    backdrop-filter:blur(8px);

    border-radius:4px;

}

/* ==========================================
   Responsive
========================================== */

@media(max-width:992px){

    .page-hero-content{
        padding:80px 0 80px;
    }

    .page-hero h1{
        max-width:680px;
    }

}

@media(max-width:768px){

    .page-hero{
        min-height:85vh;
    }

    .page-hero-content{
        padding:130px 0 70px;
    }

    .page-hero-tag{
        top:90px;
        right:24px;
    }

    .contact-hero-image{
        object-position:72% center;
    }

}

@media(max-width:576px){

    .page-hero-content{
        padding:80px 0 60px;
    }

    .page-hero h1{
        font-size:clamp(2rem,9vw,3rem);
    }

    .page-hero p{
        font-size:.96rem;
    }

    .page-hero-tag{
        display:none;
    }

    .page-hero-buttons{
        flex-direction:column;
        align-items:flex-start;
    }

}

  /* ---------- ENQUIRY OPTIONS ---------- */
  .enquiry-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); }
  @media(max-width:900px){ .enquiry-grid{ grid-template-columns:repeat(2,1fr); } }
  @media(max-width:560px){ .enquiry-grid{ grid-template-columns:1fr; } }
  .enquiry-card{
    background:var(--off-white); padding:38px 32px; text-align:left;
    border:none; cursor:pointer; font-family:var(--sans);
    position:relative; overflow:hidden;
    transition:background .35s ease, transform .35s ease, box-shadow .35s ease;
  }
  .enquiry-card::before{
    content:''; position:absolute; top:0; left:0; right:0; height:3px;
    background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .4s ease;
  }
  .enquiry-card:hover, .enquiry-card:focus-visible{
    background:#fff; transform:translateY(-4px); box-shadow:0 18px 36px rgba(13,15,17,0.08);
  }
  .enquiry-card:hover::before, .enquiry-card:focus-visible::before{ transform:scaleX(1); }
  .enquiry-card .ic{ width:32px; height:32px; margin-bottom:24px; color:var(--gold); }
  .enquiry-card h3{ font-size:1.05rem; margin-bottom:10px; color:var(--navy); }
  .enquiry-card p{ font-size:0.86rem; color:#5a5f65; font-weight:300; }
  
    /* ---------- CONTACT FORM ---------- */
  .form-card{
    background:var(--off-white); color:var(--charcoal);
    padding:48px; max-width:900px; margin:0 auto;
    box-shadow:0 30px 70px rgba(0,0,0,0.25);
  }
  @media(max-width:700px){ .form-card{ padding:30px 24px; } }
  .form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px 24px; }
  @media(max-width:700px){ .form-grid{ grid-template-columns:1fr; } }
  .field{ display:flex; flex-direction:column; gap:8px; }
  .field.full{ grid-column:1 / -1; }
  .field label{ font-size:0.78rem; letter-spacing:0.03em; font-weight:600; color:var(--navy); }
  .field .optional-tag{ font-weight:400; color:var(--steel); text-transform:none; letter-spacing:0; }
  .field input, .field select, .field textarea{
    font-family:var(--sans); font-size:0.95rem; color:var(--charcoal);
    padding:13px 15px; border:1px solid rgba(13,15,17,0.18); border-radius:2px;
    background:#fff; transition:border-color .25s ease, box-shadow .25s ease;
    width:100%;
  }
  .field textarea{ resize:vertical; min-height:130px; font-family:var(--sans); }
  .field input:focus, .field select:focus, .field textarea:focus{
    outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(198,165,90,0.18);
  }
  .field.has-error input, .field.has-error select, .field.has-error textarea{
    border-color:var(--error);
  }
  .field-error{ font-size:0.78rem; color:var(--error); display:none; }
  .field.has-error .field-error{ display:block; }
  .consent-field{ display:flex; align-items:flex-start; gap:12px; grid-column:1 / -1; }
  .consent-field input[type="checkbox"]{
    width:18px; height:18px; margin-top:3px; accent-color:var(--gold); flex-shrink:0; cursor:pointer;
  }
  .consent-field label{ font-size:0.86rem; font-weight:400; color:#4b4f54; line-height:1.5; }
  .consent-field.has-error label{ color:var(--error); }
  .form-actions{ grid-column:1 / -1; display:flex; align-items:center; gap:20px; margin-top:8px; flex-wrap:wrap; }
  .form-note{ font-size:0.78rem; color:var(--steel); }
  .spinner{
    width:14px; height:14px; border-radius:50%;
    border:2px solid rgba(28,30,33,0.25); border-top-color:var(--charcoal);
    animation:spin .7s linear infinite; display:none;
  }
  .btn-primary.is-loading .spinner{ display:inline-block; }
  .btn-primary.is-loading .btn-label::after{ content:'Submitting…'; }
  .btn-primary.is-loading .btn-label{ font-size:0; }
  .btn-primary.is-loading .btn-label::after{ font-size:0.82rem; }
  @keyframes spin{ to{ transform:rotate(360deg); } }
  .form-success, .form-error-banner{
    padding:38px; text-align:center; max-width:900px; margin:0 auto;
    box-shadow:0 30px 70px rgba(0,0,0,0.25);
  }
  .form-success{ background:#fff; }
  .form-success .check{
    width:52px; height:52px; border-radius:50%; background:rgba(198,165,90,0.15);
    display:flex; align-items:center; justify-content:center; margin:0 auto 22px; color:var(--gold);
  }
  .form-success .check svg{ width:26px; height:26px; }
  .form-success h3{ font-size:1.4rem; color:var(--navy); margin-bottom:12px; }
  .form-success p{ color:#008000; font-weight:300; max-width:500px; margin:0 auto; }
  .form-error-banner{
    background:#fff; border:1px solid rgba(179,69,43,0.3); display:none;}
  .form-error-banner.show{ display:block; }
  .form-error-banner p{ color:var(--error); font-size:0.9rem; }
  [hidden]{ display:none !important; }

  /* ---------- LOCATIONS ---------- */
  .locations-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); }
  @media(max-width:800px){ .locations-grid{ grid-template-columns:1fr; } }
  .location-card{ background:var(--off-white); padding:44px 40px; }
  .location-card .ic{
    width:44px; height:44px; border:1px solid rgba(13,15,17,0.15); border-radius:50%;
    display:flex; align-items:center; justify-content:center; color:var(--gold); margin-bottom:26px;
  }
  .location-card .ic svg{ width:20px; height:20px; }
  .location-card h3{ font-size:1.3rem; color:var(--navy); margin-bottom:16px; }
  .location-card address{ font-style:normal; color:#4b4f54; font-weight:300; line-height:1.7; margin-bottom:24px; }
  .location-card .loc-email{ display:block; color:var(--navy); font-weight:500; margin-bottom:24px; transition:color .3s ease; }
  .location-card .loc-email:hover{ color:var(--gold); }
  
    /* ---------- MAP ---------- */
  .map-section{ padding-bottom:120px; }
  .map-shell{ position:relative; width:100%; }
  .map-frame-wrap{
    position:relative; width:100%; aspect-ratio:16/8; overflow:hidden;
    border:1px solid var(--line-dark); background:#e8e4da;
  }
  @media(max-width:700px){ .map-frame-wrap{ aspect-ratio:4/5; } }
  .map-frame-wrap iframe{ width:100%; height:100%; border:0; display:block; }
  .map-card{
    position:absolute; left:40px; bottom:40px; z-index:2;
    background:var(--navy); color:var(--white);
    padding:32px 34px; max-width:320px;
    box-shadow:0 24px 50px rgba(0,0,0,0.3);
  }
  .map-card h3{ font-size:1.2rem; margin-bottom:12px; }
  .map-card address{ font-style:normal; font-size:0.88rem; color:rgba(255,255,255,0.72); font-weight:300; line-height:1.6; margin-bottom:20px; }
  @media(max-width:700px){
    .map-card{ position:static; max-width:none; margin-bottom:1px; }
  }
  .map-fallback{ margin-top:18px; font-size:0.85rem; color:var(--steel); }
  .map-fallback a{ color:var(--navy); font-weight:600; border-bottom:1px solid rgba(13,41,67,0.3); }
  .map-fallback a:hover{ color:var(--gold); border-color:var(--gold); }

  /* ---------- SOCIAL ---------- */
  .social-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); }
  @media(max-width:700px){ .social-grid{ grid-template-columns:1fr; } }
  .social-card{
    background:var(--off-white); padding:38px 32px; display:flex; align-items:center; gap:20px;
    transition:background .3s ease, transform .3s ease;
  }
  .social-card:hover{ background:#fff; transform:translateY(-3px); }
  .social-card .ic{
    width:48px; height:48px; border-radius:50%; border:1px solid rgba(13,15,17,0.15);
    display:flex; align-items:center; justify-content:center; color:var(--navy); flex-shrink:0;
    transition:border-color .3s ease, color .3s ease, transform .3s ease;
  }
  .social-card .ic svg{ width:20px; height:20px; }
  .social-card:hover .ic{ border-color:var(--gold); color:var(--gold); transform:scale(1.08); }
  .social-card .platform{ font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--steel); margin-bottom:4px; }
  .social-card .handle{ font-size:1rem; color:var(--navy); font-weight:500; }

  /* ---------- FINAL CTA ---------- */
  .cta-section{
    background:
      radial-gradient(ellipse at 20% 20%, rgba(198,165,90,0.08), transparent 55%),
      linear-gradient(160deg, #0f1113 0%, #17191c 55%, #0d0f11 100%);
    text-align:center;
  }
  .cta-section .eyebrow{ justify-content:center; }
  .cta-section h2{ font-size:clamp(1.8rem,3.2vw,2.8rem); max-width:760px; margin:22px auto; color:var(--white); }
  .cta-section p{ max-width:600px; margin:0 auto 40px; color:rgba(255,255,255,0.68); font-weight:300; }
  .cta-buttons{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }
  
  .field.has-error input,
.field.has-error textarea,
.field.has-error select {
    border-color: #d93025;
}

.field-error {
    display: none;
}

.field.has-error .field-error {
    display: block;
}

.consent-field.has-error + .field-error {
    display: block;
}

#formErrorBanner {
    display: none;
}

#submitBtn.loading {
    opacity: .75;
    pointer-events: none;
}

#submitBtn.loading .spinner {
    display: inline-block;
}