/* Tannor v6 — multi-page additions built on the approved v5 stylesheet (v5.css). */

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
address{font-style:normal}

/* ---------- Header: active state + services mega menu ---------- */
.desktop-nav>a[aria-current="page"]::after,.nav-dropdown>a[aria-current="page"]::after{transform:scaleX(1)}
.desktop-nav>a[aria-current="page"],.nav-dropdown>a[aria-current="page"]{color:var(--navy);font-weight:600}
.nav-dropdown{position:relative;display:flex;align-items:center;gap:2px}
.nav-toggle{display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:transparent;padding:0;border-radius:3px;color:var(--muted)}
.nav-toggle svg{width:16px;height:16px;transition:transform .2s}
.nav-toggle:hover{color:var(--navy);background:var(--soft)}
.nav-dropdown:hover .nav-toggle svg,.nav-dropdown.open .nav-toggle svg{transform:rotate(180deg)}
.mega{position:absolute;top:calc(100% + 26px);left:50%;width:min(760px,calc(100vw - 64px));transform:translate(-42%,8px);background:#fff;border:1px solid var(--line);border-top:3px solid var(--orange);box-shadow:0 26px 60px #0a1a3324;padding:14px;opacity:0;visibility:hidden;transition:opacity .18s,transform .18s,visibility 0s .18s;z-index:60;border-radius:0 0 4px 4px}
.mega::before{content:'';position:absolute;left:0;right:0;top:-30px;height:30px}
.nav-dropdown:hover .mega,.nav-dropdown.open .mega{opacity:1;visibility:visible;transform:translate(-42%,0);transition:opacity .18s,transform .18s}
.mega-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.desktop-nav .mega a{display:flex;align-items:flex-start;gap:14px;padding:14px;border-radius:3px;white-space:normal;transition:background .15s}
.desktop-nav .mega a::after{display:none}
.desktop-nav .mega a:hover,.desktop-nav .mega a[aria-current="page"]{background:var(--soft)}
.mega-icon{flex:none;width:40px;height:40px;display:grid;place-items:center;background:#fff3e9;color:#c45400;border-radius:3px}
.mega-icon svg{width:22px;height:22px}
.mega strong{display:block;font-size:14px;font-weight:600;color:var(--navy);line-height:1.35}
.mega small{display:block;font-size:12px;line-height:1.55;color:var(--muted);margin-top:3px;font-weight:400}
.mega-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:10px;padding:14px 14px 4px;font-size:12px;color:var(--muted)}
.desktop-nav .mega-foot a{display:inline-flex;padding:0;gap:12px;font-weight:600;color:var(--navy);font-size:13px}
.desktop-nav .mega-foot a:hover{background:none;color:#b54b00}
.mobile-group{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:16px 0 6px;font-weight:600}
.mobile-menu nav a.mobile-sub{padding-left:16px;font-size:13px}
.mobile-menu nav a[aria-current="page"]{color:#b54b00;font-weight:600}
.mobile-menu nav{max-height:calc(100dvh - 120px);overflow:auto}
.open-status::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#7d8ba0;margin-right:8px;vertical-align:1px}
.open-status.is-open::before{background:#3ecf7a;box-shadow:0 0 0 3px #3ecf7a33}

/* ---------- Page hero (inner pages) ---------- */
.page-hero .hero-inner{min-height:540px;padding-block:44px 86px}
.page-hero h1{font-size:clamp(50px,5.3vw,80px)}
.page-hero .hero-copy{max-width:640px}
.page-hero .hero-location{bottom:64px}
.crumbs{margin-bottom:26px}
.crumbs ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px 0;font-size:12px;color:#9fb0c6}
.crumbs li+li::before{content:'/';margin:0 12px;color:#55667e}
.crumbs a:hover{color:#fff}
.crumbs [aria-current]{color:#fff}

/* ---------- Generic helpers ---------- */
.section-soft{background:var(--soft)}
.shipment-only{padding-block:64px}
.shipment-only .shipment-update{margin-top:0;background:#fff}
.detail-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px 34px;margin-top:6px}
.plain-link{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--muted);transition:color .2s}
.plain-link:hover{color:var(--navy)}
.plain-link span{font-size:16px}
.inline-link{color:var(--navy);text-decoration:underline;text-underline-offset:3px;font-weight:500;white-space:nowrap}
.all-services-link{display:inline-flex;align-items:center;gap:20px;margin-top:46px;font-size:14px;font-weight:600;border-bottom:1px solid currentColor;padding-bottom:5px}
.all-services-link span{font-size:22px;font-weight:400;line-height:1}
.footage-links{display:flex;flex-wrap:wrap;gap:16px 34px}
.muted-link{color:#c8d3e2}
h2.h3-size{font-size:36px;font-weight:550;line-height:1.16;letter-spacing:-.032em;margin-bottom:21px}

/* Home: six service tabs */
.service-tabs.six{grid-template-columns:repeat(6,1fr);gap:16px}
.service-tabs.six .service-tab{font-size:13px;gap:10px}
.service-tabs.six .service-tab .tab-arrow{display:none}

/* ---------- Service page: overview + included ---------- */
.overview-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:90px;align-items:start}
.overview-copy h2{margin-bottom:30px}
.overview-text{font-size:16px;line-height:1.85;color:var(--muted);max-width:60ch}
.overview-text+.overview-text{margin-top:18px}
.overview-copy .detail-actions{margin-top:34px}
.included-card{background:var(--navy);color:#fff;padding:38px 36px;border-radius:3px;position:relative;overflow:hidden;isolation:isolate}
.included-card::after{content:'';position:absolute;right:-70px;top:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#fe6f0130,transparent 70%);z-index:-1}
.included-head{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.included-icon{width:54px;height:54px;display:grid;place-items:center;background:#fe6f011f;color:var(--orange);border-radius:3px}
.included-icon svg{width:30px;height:30px}
.included-card h3{font-size:26px;font-weight:550}
.included-card ul{list-style:none;padding:0;margin:0;display:grid}
.included-card li{position:relative;padding:14px 0 14px 30px;border-top:1px solid #ffffff1c;font-size:14px;color:#e2e8f0}
.included-card li::before{content:'✓';position:absolute;left:0;top:14px;color:var(--orange);font-weight:600}
.included-note{font-size:12px;line-height:1.75;color:#9fb0c6;margin-top:20px;padding-top:18px;border-top:1px solid #ffffff1c}

/* ---------- Service cards ---------- */
.card-grid{display:grid;gap:26px}
.card-grid.three{grid-template-columns:repeat(3,1fr)}
.service-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:3px;overflow:hidden;transition:box-shadow .25s,transform .25s,border-color .25s}
.service-card:hover{box-shadow:0 22px 50px #0a1a3318;border-color:#c9d3de;transform:translateY(-3px)}
.service-card-photo{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--soft)}
.service-card-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.service-card:hover .service-card-photo img{transform:scale(1.05)}
.service-card-body{display:flex;flex-direction:column;flex:1;padding:24px 26px 26px}
.service-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.service-card-top small{font-family:var(--display);font-size:15px;color:var(--muted)}
.service-card-icon{color:var(--orange);display:flex}
.service-card strong{font-family:var(--display);font-size:23px;font-weight:550;line-height:1.2;letter-spacing:-.025em;color:var(--navy)}
.service-card-text{font-size:13px;line-height:1.75;color:var(--muted);margin-top:10px}
.service-card-link{display:inline-flex;align-items:center;gap:14px;margin-top:auto;padding-top:22px;font-size:13px;font-weight:600;color:var(--navy)}
.service-card-link span{font-size:20px;color:var(--orange);display:inline-block}
.help-card{background:var(--navy);color:#fff;padding:34px 30px;border-radius:3px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;background-image:linear-gradient(160deg,#0a1a33 55%,#13305a)}
.help-card h3{font-size:28px;font-weight:550;line-height:1.2}
.help-actions{display:grid;gap:22px;justify-items:start}

/* ---------- Services hub: journey ---------- */
.journey{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;counter-reset:j}
.journey::before{content:'';position:absolute;left:28px;right:28px;top:28px;height:2px;background:linear-gradient(90deg,var(--orange),#fe6f0155)}
.journey a{display:flex;flex-direction:column;gap:8px;padding-right:22px;position:relative}
.journey-icon{width:58px;height:58px;display:grid;place-items:center;background:#fff;border:2px solid var(--orange);border-radius:50%;color:var(--navy);position:relative;z-index:1;margin-bottom:14px;transition:background .2s,color .2s}
.journey a:hover .journey-icon{background:var(--orange);color:#fff}
.journey-step{font-size:11px;color:#a54600;font-weight:600;letter-spacing:.1em}
.journey strong{font-family:var(--display);font-size:24px;font-weight:550;color:var(--navy)}
.journey-text{font-size:13px;line-height:1.7;color:var(--muted);max-width:22ch}
.extra-service+.extra-service{padding-top:0}
.extra-service.reverse .service-photo{order:2}

/* ---------- Quote band ---------- */
.quote-band{background:linear-gradient(115deg,#0d2346 0%,#01286b 100%);color:#fff;padding-block:84px;position:relative;overflow:hidden;isolation:isolate;border-bottom:3px solid var(--orange)}
.quote-band::before{content:'';position:absolute;inset:auto -8% -70% auto;width:680px;height:680px;border-radius:50%;background:radial-gradient(circle,#fe6f0130,transparent 62%);z-index:-1}
.quote-band::after{content:'';position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(90deg,transparent 0 79px,#ffffff08 79px 80px)}
.quote-band-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;align-items:end}
.quote-band h2{font-size:clamp(38px,4.2vw,58px)}
.quote-band-side>p{font-size:15px;line-height:1.8;color:#b8c5d6;max-width:46ch}
.quote-band .hero-actions{margin-top:26px}

/* ---------- About ---------- */
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}
.story-copy h2{margin-bottom:30px}
.story-photos{position:relative;padding:0 0 70px 0}
.story-photo-a{width:78%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:3px}
.story-photo-b{position:absolute;right:0;bottom:0;width:46%;height:auto;aspect-ratio:3/4;object-fit:cover;border:8px solid #fff;border-radius:3px;box-shadow:0 20px 50px #0a1a3326}
.motto-band{background:var(--navy);color:#fff;padding-block:70px}
.motto-inner{display:grid;grid-template-columns:200px 1fr;gap:50px;align-items:start}
.motto-label{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:#9fb0c6;font-weight:600;padding-top:14px}
.motto-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.motto-list strong{display:block;font-family:var(--display);font-size:clamp(40px,4.4vw,62px);font-weight:600;letter-spacing:-.04em;line-height:1.05;margin-bottom:14px}
.motto-list li:nth-child(2) strong{color:var(--orange)}
.motto-list span{font-size:14px;line-height:1.75;color:#b8c5d6;display:block;max-width:30ch}
.audience-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.audience-card{border:1px solid var(--line);border-radius:3px;padding:28px 26px;background:#fff;transition:border-color .2s}
.audience-card:hover{border-color:var(--orange)}
.audience-icon{display:flex;color:var(--orange);margin-bottom:24px}
.audience-icon svg{width:30px;height:30px}
.audience-card h3{font-size:21px;margin-bottom:12px}
.audience-card p{font-size:13px;line-height:1.8;color:var(--muted)}
.photo-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.photo-strip a{display:block;overflow:hidden;border-radius:3px;aspect-ratio:3/4}
.photo-strip img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.photo-strip a:hover img{transform:scale(1.05)}

/* ---------- Gallery ---------- */
.gallery-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.filter-chip{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:40px;padding:10px 18px;font-size:13px;font-weight:500;color:var(--ink);transition:background .2s,border-color .2s,color .2s}
.filter-chip:hover{border-color:var(--navy)}
.filter-chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.chip-count{font-size:11px;color:var(--muted);background:var(--soft);border-radius:20px;padding:1px 8px}
.filter-chip[aria-pressed="true"] .chip-count{background:#ffffff1f;color:#fff}
.gallery-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.gallery-item{min-width:0}
.gallery-open{position:relative;display:block;width:100%;padding:0;background:var(--soft);border-radius:3px;overflow:hidden;aspect-ratio:3/4;text-align:left;color:#fff}
.gallery-open img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.gallery-open::after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#061226e6);pointer-events:none}
.gallery-caption{position:absolute;left:18px;right:18px;bottom:16px;z-index:1;display:grid;gap:3px}
.gallery-caption strong{font-family:var(--display);font-size:18px;font-weight:550;line-height:1.25}
.gallery-caption span{font-size:11px;color:#c5d0de;line-height:1.5}
.gallery-zoom{position:absolute;top:14px;right:14px;z-index:1;width:36px;height:36px;display:grid;place-items:center;background:#ffffffe6;color:var(--navy);border-radius:50%;font-size:17px;opacity:0;transform:scale(.85);transition:opacity .2s,transform .2s}
.gallery-open:hover img{transform:scale(1.05)}
.gallery-open:hover .gallery-zoom,.gallery-open:focus-visible .gallery-zoom{opacity:1;transform:none}
.lightbox{width:min(980px,calc(100% - 28px));padding:18px;background:var(--navy);color:#fff}
.lightbox-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}
.lightbox-head p{display:flex;align-items:baseline;gap:16px}
.lightbox-head span{font-size:11px;color:#9fb0c6;font-variant-numeric:tabular-nums}
.lightbox-head strong{font-family:var(--display);font-size:22px;font-weight:550}
.lightbox-head button,.lightbox-nav button{font-size:12px;padding:11px 15px;background:#ffffff14;color:#fff;border-radius:2px}
.lightbox-head button:hover,.lightbox-nav button:hover{background:#ffffff26}
.lightbox figure{margin:0}
.lightbox img{width:100%;max-height:calc(100dvh - 220px);object-fit:contain;background:#061226;border-radius:2px}
.lightbox figcaption{font-size:13px;color:#b8c5d6;margin-top:12px}
.lightbox-nav{display:flex;justify-content:space-between;gap:12px;margin-top:14px}
.hero-film-list.many .hero-film-choice{padding-block:12px}
.hero-film-list.many .film-thumbnail{height:58px}

/* ---------- Contact ---------- */
.contact-tiles{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);margin-top:-48px;background:#fff;box-shadow:0 14px 45px #0a1a3310;border:1px solid var(--line)}
.contact-tiles>a{display:flex;align-items:center;gap:16px;padding:26px 24px;min-height:118px;transition:background .2s;min-width:0}
.contact-tiles>a+a{border-left:1px solid var(--line)}
.contact-tiles>a:hover{background:#f8fafc}
.contact-tiles strong{display:block;font-size:14px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}
.contact-tiles small{display:block;font-size:11px;color:var(--muted);margin-top:3px;line-height:1.5}
.contact-tiles small.tile-label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 4px;font-weight:600;color:#a54600}
.contact-tiles .quick-icon svg{width:26px;height:26px}
.dd-note{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.hours-line{display:flex;justify-content:space-between;gap:16px;font-size:13px}
.hours-line+.hours-line{margin-top:4px}
.hours-line span:first-child{color:var(--muted)}
.visit-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:30px;align-items:stretch}
.hours-card{border:1px solid var(--line);border-radius:3px;padding:34px 32px;background:#fff;display:flex;flex-direction:column}
.hours-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:20px}
.hours-head h3{font-size:26px;font-weight:550}
.status-pill{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;padding:6px 12px;border-radius:20px;background:var(--soft);color:var(--muted)}
.status-pill::before{content:'';width:7px;height:7px;border-radius:50%;background:#98a4b4}
.status-pill.is-open{background:#e6f8ee;color:#16733f}
.status-pill.is-open::before{background:#25b765}
.hours-list{display:grid;margin:0}
.hours-list>div{display:flex;justify-content:space-between;gap:20px;padding:15px 12px;border-top:1px solid var(--line);font-size:14px}
.hours-list>div:last-child{border-bottom:1px solid var(--line)}
.hours-list dt{color:var(--muted)}
.hours-list dd{font-weight:600;color:var(--navy);text-align:right}
.hours-list>div.is-today{background:#fff6ee;border-left:3px solid var(--orange)}
.hours-list>div.is-today dt{color:var(--navy);font-weight:600}
.hours-list>div.is-today dt::after{content:'Today';margin-left:10px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#a54600}
.hours-note{font-size:12px;color:var(--muted);line-height:1.75;margin-top:16px}
.visit-address{display:grid;gap:2px;font-size:14px;line-height:1.7;margin:26px 0 22px;padding-top:22px;border-top:1px solid var(--line)}
.visit-address strong{font-family:var(--display);font-size:17px;font-weight:550;margin-bottom:4px}
.visit-address .muted{color:var(--muted);font-size:13px}
.hours-card .detail-actions{margin-top:auto}
.map-panel{position:relative;min-height:470px;border-radius:3px;overflow:hidden;background:var(--navy);isolation:isolate}
.map-panel::before{content:'';position:absolute;inset:0;z-index:-1;background:
  linear-gradient(135deg,#0a1a33f0,#0a1a33b8),
  repeating-linear-gradient(0deg,transparent 0 46px,#ffffff10 46px 47px),
  repeating-linear-gradient(90deg,transparent 0 46px,#ffffff10 46px 47px),
  url('/media/rangerover-port-sm.webp') center/cover}
.map-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:40px;color:#fff}
.map-placeholder h3{font-size:clamp(28px,2.8vw,38px);font-weight:550;margin-bottom:12px}
.map-placeholder>p:not(.eyebrow){font-size:14px;color:#c0ccdb;max-width:42ch}
.map-placeholder .hero-actions{margin-top:24px;flex-wrap:wrap}
.map-pin{position:absolute;top:34%;left:58%;width:22px;height:22px;background:var(--orange);border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 0 0 10px #fe6f0130,0 0 0 22px #fe6f0114}
.map-pin::after{content:'';position:absolute;inset:6px;background:#fff;border-radius:50%}
.map-panel.loaded .map-placeholder{display:none}
.map-panel iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- Footer ---------- */
.footer-main.footer-4{grid-template-columns:1.4fr .9fr .9fr 1.1fr;gap:60px}
.footer-brand>span{display:block}
.footer-social{display:flex;gap:22px;margin-top:22px;font-size:12px}
.footer-visit address{font-size:13px;line-height:1.75;color:#d0d9e5;margin-bottom:16px}
.footer-visit address small{display:block;color:#8e9fb7;font-size:11px;margin-top:4px}
.footer-hours{display:grid;gap:6px;margin:0 0 14px;font-size:12px}
.footer-hours>div{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid #ffffff14;padding-bottom:6px}
.footer-hours dt{color:#8e9fb7}
.footer-hours dd{color:#e3e9f1}
.footer-visit>a{display:block;font-size:13px;margin-top:8px}

/* ---------- 404 ---------- */
.not-found .hero-inner{min-height:560px}
.not-found::before{background:radial-gradient(circle at 80% 40%,#13305a,#0a1a33 60%)}
.not-found-links{list-style:none;padding:0;margin:40px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.not-found-links a{display:inline-block;font-size:12px;padding:8px 14px;border:1px solid #ffffff30;border-radius:30px;color:#dbe3ee}
.not-found-links a:hover{border-color:var(--orange);color:#fff}

/* ---------- Responsive ---------- */
@media(max-width:1150px){
  .service-tabs.six{gap:10px}.service-tabs.six .service-tab{font-size:11.5px;gap:8px}.service-tabs.six .service-tab svg{width:20px}
  .page-hero h1{font-size:66px}
  .overview-grid,.story-grid{gap:56px}
  .quote-band-inner{gap:56px}
  .audience-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:repeat(3,1fr)}
  .contact-tiles>a{padding:22px 18px;gap:12px}
  .footer-main.footer-4{grid-template-columns:1fr 1fr 1fr;gap:45px}
  .footer-main.footer-4 .footer-brand{grid-column:1/-1}
  /* Centred under "Services" the menu ran past the right edge (and caused sideways scroll) below ~1100px, so anchor it to the header's right edge instead. */
  .nav-dropdown{position:static}
  .mega{top:100%;left:auto;right:32px;transform:translateY(8px)}.nav-dropdown:hover .mega,.nav-dropdown.open .mega{transform:translateY(0)}
  .mega::before{top:-40px;height:40px}
}
@media(max-width:950px){
  .service-tabs.six{grid-template-columns:repeat(3,1fr);gap:0 18px}
  .page-hero h1{font-size:58px}
  .page-hero .hero-inner{min-height:500px}
  .overview-grid{grid-template-columns:1fr;gap:44px}
  .card-grid.three{grid-template-columns:repeat(2,1fr)}
  .journey{grid-template-columns:repeat(3,1fr);gap:36px 0}
  .journey::before{display:none}
  .quote-band-inner{grid-template-columns:1fr;gap:26px;align-items:start}
  .story-grid{grid-template-columns:1fr}
  .story-photos{max-width:560px}
  .motto-inner{grid-template-columns:1fr;gap:26px}
  .motto-list{gap:26px}
  .contact-tiles{grid-template-columns:repeat(2,1fr)}
  .contact-tiles>a:nth-child(3){border-left:0}
  .contact-tiles>a:nth-child(n+3){border-top:1px solid var(--line)}
  .contact-tiles .quick-icon{display:flex}
  .visit-grid{grid-template-columns:1fr}
  .map-panel{min-height:400px}
  h2.h3-size{font-size:27px}
}
@media(max-width:650px){
  .page-hero .hero-inner{min-height:0;padding:30px 0 250px}
  .page-hero h1{font-size:clamp(44px,11vw,60px)}
  .page-hero .hero-landscape{top:auto;bottom:0;height:300px}
  .page-hero::before{background:linear-gradient(180deg,#0a1a33 0%,#0a1a33 55%,#0a1a33cc 68%,#0a1a3320 92%)}
  .page-hero .hero-location{bottom:36px}
  .crumbs{margin-bottom:18px}.crumbs ol{font-size:11px}
  .service-tabs.six{grid-template-columns:1fr 1fr}
  .detail-actions{gap:16px 24px}
  .overview-text{font-size:14px}
  .included-card{padding:28px 22px}
  .included-card h3{font-size:22px}
  .card-grid.three{grid-template-columns:1fr}
  .service-card strong{font-size:21px}
  .journey{grid-template-columns:1fr;gap:0}
  .journey li{border-top:1px solid #d9e1ea}
  .journey li:last-child{border-bottom:1px solid #d9e1ea}
  .journey a{display:grid;grid-template-columns:52px 1fr;column-gap:16px;padding:18px 0;align-items:center}
  .journey-icon{grid-row:1/4;width:50px;height:50px;margin:0}
  .journey strong{font-size:20px}
  .journey-text{max-width:none}
  .quote-band{padding-block:58px}
  .quote-band h2{font-size:36px}
  .quote-band .hero-actions{flex-wrap:wrap}
  .story-photos{padding-bottom:50px}
  .motto-band{padding-block:52px}
  .motto-list{grid-template-columns:1fr;gap:24px}
  .audience-grid{grid-template-columns:1fr}
  .photo-strip{grid-template-columns:repeat(2,1fr);gap:12px}
  .gallery-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .gallery-caption{left:12px;right:12px;bottom:10px}
  .gallery-caption strong{font-size:14px}
  .gallery-caption span{display:none}
  .gallery-zoom{display:none}
  .filter-chip{padding:8px 14px;font-size:12px}
  .contact-tiles{grid-template-columns:1fr;margin-top:-28px}
  .contact-tiles>a{min-height:80px;padding:16px 18px}
  .contact-tiles>a+a{border-left:0;border-top:1px solid var(--line)}
  .hours-card{padding:26px 20px}
  .map-panel{min-height:420px}
  .map-placeholder{padding:26px 22px}
  .footer-main.footer-4{grid-template-columns:1fr 1fr;gap:35px 25px}
  .footer-visit{grid-column:1/-1}
  .all-services-link{margin-top:32px}
  .lightbox{padding:12px}
  .lightbox-head strong{font-size:17px}
}
@media print{.mega,.nav-toggle,.quote-band,.gallery-filters,.map-panel{display:none}}

/* Accessibility (Lighthouse): v5's #768293 field hints were 3.9:1 on white; phone links were 23.4px tall on phones. */
.field label span{color:var(--muted)}
.contact-card dd a{padding-block:1px}

/* Phones: stack the quote form so selects and placeholders are not cut off (v5 stacked only at 360px). */
@media(max-width:480px){.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}

/* Scroll depth: motion.js sets --hero-scroll and --view while .scroll-depth is on (never for reduced motion).
   Individual translate/scale compose with the existing transform animations and hover zooms. */
.scroll-depth .hero-landscape img{translate:0 calc(var(--hero-scroll,0)*6%);scale:calc(1 + var(--hero-scroll,0)*.12)}
.scroll-depth .hero-copy{translate:0 calc(var(--hero-scroll,0)*-64px);opacity:calc(1 - var(--hero-scroll,0)*.8)}
.scroll-depth :is(.service-photo,.service-card-photo,.photo-strip a,.gallery-open) img{scale:1.12;translate:0 calc((var(--view,.5) - .5)*10%)}
.scroll-depth .story-photo-a{translate:0 calc((var(--view,.5) - .5)*24px)}
.scroll-depth .story-photo-b{translate:0 calc((var(--view,.5) - .5)*-90px)}
.scroll-depth .quote-band::before{translate:0 calc((var(--view,.5) - .5)*-180px)}
.scroll-depth .quote-band::after{inset:0 -80px;translate:calc(var(--view,.5)*80px) 0}

/* Sliding words: BgWords.astro sets oversized faint words behind a section heading, and --view slides them sideways.
   Browsers without :has() can't position them, so they are hidden there. */
section:has(>.bg-words){position:relative}
.bg-words{position:absolute;inset-inline:0;top:clamp(26px,5vw,62px);overflow:hidden;pointer-events:none;user-select:none}
.bg-words~.wrap{position:relative}
.bg-words::before{content:attr(data-words);display:block;width:max-content;margin-left:-25vw;font:600 clamp(68px,12vw,190px)/1 var(--display);letter-spacing:-.04em;text-transform:uppercase;white-space:nowrap;color:rgb(10 26 51/.05)}
/* The line holds three copies of the words, so moving it one third of its width loops seamlessly. motion.js adds .running only while it's on screen. */
@keyframes bg-words-run{to{transform:translateX(calc(-100%/3))}}
.scroll-depth .bg-words::before{translate:calc((var(--view,.5) - .5)*-40vw) 0;animation:bg-words-run var(--words-time,80s) linear infinite paused}
.scroll-depth .bg-words.reverse::before{translate:calc((var(--view,.5) - .5)*40vw) 0;animation-direction:reverse}
.scroll-depth .bg-words.running::before{animation-play-state:running}
@supports not selector(:has(*)){.bg-words{display:none}}
@media print{.bg-words{display:none}}

/* Cinematic: the hero fades to navy as it leaves, photos open from a letterbox crop, navy bands widen from inset cards
   to full width, and section headings rise line by line (motion.js). The images are clipped rather than their links,
   so focus outlines stay visible; .story-photo-b keeps its shadow unclipped. */
.scroll-depth .hero::after{content:'';position:absolute;inset:0;z-index:-1;background:var(--navy);opacity:calc(var(--hero-scroll,0)*.75);pointer-events:none}
.scroll-depth :is(.service-photo,.service-card-photo,.photo-strip a,.gallery-open) img,.scroll-depth .story-photo-a{clip-path:inset(calc(clamp(0,(.42 - var(--view,.5))*2.4,1)*12%) 0)}
.scroll-depth :is(.footage-section,.motto-band,.quote-band){--open:clamp(0,var(--view,.5)/.4,1);clip-path:inset(0 calc((1 - var(--open))*5vw) round calc((1 - var(--open))*min(32px,6vw)))}
.reveal-line{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.reveal-text{display:inline-block}
.reveal-pending .reveal-text{transform:translateY(105%)}
@media print{.reveal-pending .reveal-text{transform:none}}

/* WhatsApp button, fixed at the bottom right of every page. #1a9e4b keeps 3:1 contrast on white, grey and navy
   (WhatsApp's own #25d366 is 2:1 on white). The label slides out on hover or keyboard focus on devices with a mouse,
   and the footer has extra space at the bottom so the button never covers "Back to top". */
.whatsapp-float{position:fixed;right:24px;bottom:24px;z-index:40;display:flex;flex-direction:row-reverse;align-items:center;height:58px;min-width:58px;padding:0 16px;border-radius:29px;background:#1a9e4b;color:#fff;box-shadow:0 12px 30px #0a1a3340;animation:whatsapp-in .5s 1.2s cubic-bezier(.22,1,.36,1) backwards;transition:background .2s}
.whatsapp-float svg{width:26px;height:26px;flex:none;fill:currentColor;stroke:none}
.whatsapp-float-label{max-width:0;overflow:hidden;white-space:nowrap;font-size:14px;font-weight:600;transition:max-width .35s cubic-bezier(.22,1,.36,1),margin .35s cubic-bezier(.22,1,.36,1)}
.whatsapp-float:hover,.whatsapp-float:focus-visible{background:#168a41}
@media(hover:hover){.whatsapp-float:is(:hover,:focus-visible) .whatsapp-float-label{max-width:160px;margin-right:10px}}
@keyframes whatsapp-in{from{opacity:0;transform:translateY(16px) scale(.9)}}
@keyframes whatsapp-fade{from{opacity:0}}
.footer-bottom{padding-bottom:100px}
@media(max-width:650px){.whatsapp-float{right:16px;bottom:16px;height:54px;min-width:54px;padding:0 14px}.footer-bottom{padding-bottom:86px}}
@media(prefers-reduced-motion:reduce){.whatsapp-float{animation-name:whatsapp-fade}}
@media print{.whatsapp-float{display:none}}

/* Footer email addresses: allow breaks so they fit the two-column phone footer. */
.footer-email{overflow-wrap:anywhere}
/* Keep "8 am – 9 pm" on one line in the narrow phone contact card; the day label wraps instead. */
.hours-line span:last-child{white-space:nowrap}
