:root{
  --navy:#031933;
  --navy-2:#061f3d;
  --ink:#081628;
  --blue:#0b5fae;
  --red:#e31b23;
  --gold:#f6b51b;
  --white:#f8fafc;
  --soft:#eef2f5;
  --line:#d9e0e7;
  --muted:#667284;
  --max:1180px;
}

/* Final compact gallery override */
#gallery.gallery-showcase {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(240px, 320px) minmax(380px, 520px) !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 52px !important;
  width: 100% !important;
  min-height: auto !important;
  padding: 72px max(24px, calc((100vw - 960px) / 2)) !important;
  color: #fff !important;
  background: radial-gradient(circle at 75% 40%, rgba(11,95,174,.18), transparent 30%), linear-gradient(135deg,#021327 0%,#041c38 58%,#031933 100%) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

#gallery .gallery-showcase-copy {
  position: static !important;
  grid-column: auto !important;
  max-width: 320px !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#gallery .gallery-showcase-copy .eyebrow {
  display: block;
  margin-bottom: 18px;
  color: #bcd2e9;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 3px;
}

#gallery .gallery-showcase-copy h2 {
  margin: 0;
  color: #fff;
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(60px, 6vw, 86px);
  font-weight: 800;
  line-height: .86;
  text-transform: uppercase;
}

#gallery .gallery-showcase-copy p {
  max-width: 320px;
  margin: 24px 0 0;
  color: #bcd2e9;
  font-size: 16px;
  line-height: 1.65;
}

#gallery .gallery-copy-stripes {
  display: flex;
  gap: 5px;
  width: 88px;
  height: 7px;
  margin-top: 30px;
  transform: skewX(-15deg);
}

#gallery .gallery-copy-stripes span { flex: 1; }
#gallery .gallery-copy-stripes span:nth-child(1) { background: #fbbd17; }
#gallery .gallery-copy-stripes span:nth-child(2) { background: #ed1c24; }
#gallery .gallery-copy-stripes span:nth-child(3) { background: #1268b3; }

#gallery .gallery-slideshow-section,
#gallery .gallery-slideshow {
  position: static !important;
  grid-column: auto !important;
  width: 100% !important;
  max-width: 520px !important;
  justify-self: end !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#gallery .gallery-frame {
  position: relative !important;
  width: 100% !important;
  max-width: 520px !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  padding: 14px !important;
  background: #0d3154 !important;
  border: 1px solid #284d70 !important;
  border-radius: 22px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.28) !important;
}

#gallery .gallery-frame::before { display: none !important; }

#gallery .gallery-frame img,
#gallery #gallery-image {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 14px !important;
  opacity: 1;
  transform: scale(1);
  transition: opacity .32s ease, transform .32s ease;
}

#gallery .gallery-frame img.is-changing {
  opacity: 0 !important;
  transform: scale(1.015) !important;
}

#gallery .gallery-controls {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  gap: 18px !important;
  margin-top: 18px !important;
}

#gallery .gallery-arrow {
  padding: 12px 17px;
  border: 0;
  border-radius: 8px;
  background: #fff;
  color: #031933;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

#gallery .gallery-arrow:hover { background: #0863b6; color: #fff; }
#gallery #gallery-next { justify-self: end; }
#gallery .gallery-counter { color: #bcd2e9; font-weight: 800; white-space: nowrap; }
#gallery .gallery-progress { height: 5px; margin-top: 15px; overflow: hidden; background: #173d60; border-radius: 10px; }
#gallery #gallery-progress-bar { width: 0; height: 100%; background: linear-gradient(90deg,#fbbd17 0 33.33%,#ed1c24 33.33% 66.66%,#1268b3 66.66% 100%); }
#gallery #gallery-progress-bar.is-running { animation: galleryProgress 3s linear forwards; }

@media (max-width: 900px) {
  #gallery.gallery-showcase {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    padding: 60px 24px !important;
  }

  #gallery .gallery-showcase-copy { max-width: 620px !important; }
  #gallery .gallery-showcase-copy p { max-width: 560px; }

  #gallery .gallery-slideshow-section,
  #gallery .gallery-slideshow {
    max-width: 520px !important;
    justify-self: center !important;
  }
}

@media (max-width: 560px) {
  #gallery .gallery-showcase-copy h2 { font-size: 60px; }
  #gallery .gallery-frame { padding: 10px !important; border-radius: 16px !important; }
  #gallery .gallery-controls { gap: 10px !important; }
  #gallery .gallery-arrow { padding: 11px 12px; font-size: 13px; }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:#fff;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.site-header{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:16px max(24px,calc((100vw - var(--max))/2));
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(3,25,51,.08);
}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mark{
  font-family:"Barlow Condensed",sans-serif;
  font-size:33px;font-weight:800;font-style:italic;line-height:1;
  color:var(--navy);letter-spacing:-3px;
}
.brand-copy{display:flex;flex-direction:column;line-height:1}
.brand-copy strong{
  font:800 16px/1 "Barlow Condensed",sans-serif;
  letter-spacing:1.4px;color:var(--navy);
}
.brand-copy small{
  font:700 10px/1.4 Inter,sans-serif;
  letter-spacing:3px;color:#526174;margin-top:4px;
}
.race-stripes{display:flex;gap:3px;transform:skew(-12deg);margin-left:2px}
.race-stripes i{display:block;width:4px;height:31px}
.race-stripes i:nth-child(1){background:var(--gold)}
.race-stripes i:nth-child(2){background:var(--red)}
.race-stripes i:nth-child(3){background:var(--blue)}
.nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:700}
.nav a:hover{color:var(--blue)}
.nav-cta{background:var(--navy);color:#fff!important;padding:11px 17px;border-radius:6px}
.menu-toggle{display:none;border:0;background:none;font-size:24px;color:var(--navy)}
.hero{
  min-height:760px;
  background:
    radial-gradient(circle at 75% 40%,rgba(11,95,174,.18),transparent 30%),
    linear-gradient(135deg,#021327 0%,#041c38 58%,#031933 100%);
  color:white;
  display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:60px;
  padding:90px max(24px,calc((100vw - var(--max))/2));
  overflow:hidden;
}
.eyebrow{
  font:700 12px/1 Inter,sans-serif;
  letter-spacing:2.6px;color:#bcd2e9;margin-bottom:20px;
}
.eyebrow.dark{color:#49657f}
.hero h1,.section h2,.cta-section h2{
  font-family:"Barlow Condensed",sans-serif;
  text-transform:uppercase;
  margin:0;
}
.hero h1{
  font-size:clamp(58px,7vw,98px);
  line-height:.91;
  letter-spacing:-2px;
  font-weight:800;
}
.hero h1 span{color:#cfdbe7}
.hero-copy>p{
  max-width:680px;
  color:#b8c7d7;
  font-size:18px;line-height:1.7;margin:28px 0 32px;
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{
  display:inline-flex;justify-content:center;align-items:center;
  min-height:50px;padding:0 22px;border-radius:6px;
  font-weight:800;border:1px solid transparent;cursor:pointer;
}
.btn-primary{background:#fff;color:var(--navy)}
.btn-primary:hover{background:#eaf0f6}
.btn-secondary{border-color:#36516d;color:#fff;background:transparent}
.btn-secondary:hover{background:rgba(255,255,255,.06)}
.trust-row{display:flex;gap:22px;flex-wrap:wrap;margin-top:34px;color:#8ea5ba;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px}
.trust-row span:before{content:"•";color:var(--gold);margin-right:8px}
.hero-art{position:relative;display:flex;justify-content:center;align-items:center}
.logo-card{
  width:min(100%,560px);
  aspect-ratio:1.1/1;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  border-radius:24px;
  box-shadow:0 35px 80px rgba(0,0,0,.28);
  display:grid;place-items:center;padding:34px;
}
.logo-card img{width:100%;border-radius:14px}
.floating-badge{
  position:absolute;right:-10px;bottom:50px;
  background:#fff;color:var(--navy);padding:13px 16px;border-radius:6px;
  font:800 12px/1 Inter,sans-serif;letter-spacing:2px;
  box-shadow:0 16px 35px rgba(0,0,0,.24);
}
.floating-badge:before{
  content:"";display:inline-block;width:32px;height:4px;margin-right:10px;vertical-align:middle;
  background:linear-gradient(90deg,var(--gold) 0 33%,var(--red) 33% 66%,var(--blue) 66%);
}
.intro-strip{
  background:#f3f6f8;
  display:flex;justify-content:space-between;align-items:center;gap:30px;
  padding:24px max(24px,calc((100vw - var(--max))/2));
  border-bottom:1px solid #e3e8ed;
}
.intro-strip div{display:flex;flex-direction:column;gap:4px}
.intro-strip strong{font-size:15px}
.intro-strip span{font-size:13px;color:var(--muted)}
.intro-strip a{font-weight:800;color:var(--blue);white-space:nowrap}
.section{
  padding:100px max(24px,calc((100vw - var(--max))/2));
}
.section-heading{
  display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:end;margin-bottom:46px;
}
.section-heading h2{
  font-size:clamp(42px,5vw,68px);line-height:.96;letter-spacing:-1px;color:var(--navy)
}
.section-heading>p{margin:0;color:var(--muted);line-height:1.75;font-size:16px}
.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.service-card{
  position:relative;border:1px solid var(--line);border-radius:12px;
  padding:34px;background:#fff;overflow:hidden;
}
.service-card.featured{border-top:4px solid var(--blue)}
.service-number{font:800 12px/1 Inter,sans-serif;letter-spacing:2px;color:#8b98a7}
.service-card h3{font:800 30px/1 "Barlow Condensed",sans-serif;text-transform:uppercase;color:var(--navy);margin:18px 0 12px}
.service-card p{color:var(--muted);line-height:1.65;margin:0 0 22px}
.service-card ul{margin:0 0 25px;padding:0;list-style:none}
.service-card li{padding:9px 0;border-top:1px solid #edf0f3;font-size:14px}
.service-card li:before{content:"✓";color:var(--blue);font-weight:800;margin-right:10px}
.service-card a{font-size:13px;font-weight:800;color:var(--blue)}
.dark-section{background:var(--navy);color:#fff}
.section-heading.light h2{color:#fff}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#203952;border:1px solid #203952}
.why-item{background:var(--navy);padding:28px;min-height:240px}
.why-item strong{color:#83a6c7;font-size:12px;letter-spacing:2px}
.why-item h3{font:800 25px/1 "Barlow Condensed",sans-serif;text-transform:uppercase;margin:55px 0 12px}
.why-item p{color:#aebfd0;line-height:1.65;font-size:14px;margin:0}
.service-area{display:grid;grid-template-columns:1fr .9fr;gap:70px;align-items:center}
.area-copy h2{font:800 clamp(44px,5vw,70px)/.95 "Barlow Condensed",sans-serif;text-transform:uppercase;color:var(--navy);margin:0 0 20px}
.area-copy>p{color:var(--muted);line-height:1.7;max-width:620px}
.area-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.area-pills span{border:1px solid #cfd7df;background:#fff;border-radius:999px;padding:10px 14px;font-size:13px;font-weight:700;color:#33485c}
.area-card{background:#f3f6f8;border-radius:12px;padding:34px;border:1px solid #e0e6eb}
.area-card>span{font-size:11px;font-weight:800;letter-spacing:2px;color:#597087}
.area-card ol{counter-reset:item;list-style:none;margin:22px 0 0;padding:0}
.area-card li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:17px 0;border-top:1px solid #dce3e8}
.area-card li:before{counter-increment:item;content:counter(item,decimal-leading-zero);font:800 12px/1 Inter;color:var(--blue);padding-top:3px}
.area-card b{display:block;color:var(--navy)}
.area-card small{display:block;color:var(--muted);margin-top:4px}
.cta-section{
  background:#061b34;color:#fff;
  display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;
  padding:90px max(24px,calc((100vw - var(--max))/2));
}
.cta-section h2{font-size:clamp(48px,5vw,72px);line-height:.95}
.cta-copy p{color:#adbed0;line-height:1.7;max-width:480px}
.quote-form{background:#fff;color:var(--ink);padding:32px;border-radius:12px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:1px;margin-bottom:14px}
input,select,textarea{
  width:100%;border:1px solid #d5dde5;border-radius:6px;
  padding:14px 15px;font:500 15px/1.4 Inter,sans-serif;color:var(--ink);background:#fff;
  outline:none;text-transform:none;letter-spacing:0;
}
input:focus,select:focus,textarea:focus{border-color:#6f96bc;box-shadow:0 0 0 3px rgba(11,95,174,.08)}
textarea{resize:vertical}
.btn-wide{width:100%;background:var(--navy);color:#fff}
.form-note{font-size:11px;color:#7b8795;line-height:1.5;margin:12px 0 0}
footer{
  padding:34px max(24px,calc((100vw - var(--max))/2));
  display:grid;grid-template-columns:1fr auto 1fr;gap:25px;align-items:center;
  background:#020e1b;color:#fff;border-top:1px solid #17314b;
}
.footer-brand{display:flex;flex-direction:column}
.footer-brand strong{font:800 18px/1 "Barlow Condensed",sans-serif;letter-spacing:1px}
.footer-brand span{font-size:9px;letter-spacing:3px;color:#869db3;margin-top:5px}
.footer-links{display:flex;gap:22px;font-size:12px;font-weight:700;color:#bdc9d5}
.footer-meta{text-align:right;font-size:11px;color:#70869b}
@media(max-width:900px){
  .menu-toggle{display:block}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;background:#fff;
    padding:22px 24px;flex-direction:column;align-items:stretch;border-bottom:1px solid #e2e7eb;
  }
  .nav.open{display:flex}
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:70px;padding-bottom:70px}
  .hero-art{order:-1}
  .logo-card{max-width:440px}
  .section-heading,.service-area,.cta-section{grid-template-columns:1fr;gap:35px}
  .why-grid{grid-template-columns:1fr 1fr}
  footer{grid-template-columns:1fr;text-align:left}
  .footer-meta{text-align:left}
}
@media(max-width:620px){
  .brand-copy{display:none}
  .hero{padding-top:48px}
  .hero h1{font-size:58px}
  .trust-row{gap:12px}
  .intro-strip{align-items:flex-start;flex-direction:column}
  .section{padding-top:72px;padding-bottom:72px}
  .service-grid,.why-grid,.field-row{grid-template-columns:1fr}
  .why-item{min-height:190px}
  .why-item h3{margin-top:34px}
  .quote-form{padding:22px}
  .floating-badge{right:0;bottom:15px}
}


/* Pricing */
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.price-card{
  position:relative;
  border:1px solid var(--line);
  border-radius:12px;
  padding:32px;
  background:#fff;
}
.price-card.featured{border-top:4px solid var(--blue)}
.price-card.showroom{
  grid-column:1/-1;
  background:linear-gradient(135deg,#f7f9fb,#eef3f7);
  border-color:#cfd9e2;
}
.price-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}
.price{
  font:800 34px/1 "Barlow Condensed",sans-serif;
  color:var(--navy);
}
.price-card h3{
  font:800 30px/1 "Barlow Condensed",sans-serif;
  text-transform:uppercase;
  color:var(--navy);
  margin:22px 0 12px;
}
.price-card p{
  color:var(--muted);
  line-height:1.65;
  margin:0 0 18px;
}
.duration{
  display:inline-block;
  margin:0 0 20px;
  padding:8px 10px;
  border-radius:6px;
  background:#f0f4f7;
  color:#47617a;
  font-size:12px;
  font-weight:800;
  letter-spacing:.3px;
}
.price-card a{
  display:block;
  margin-top:16px;
  font-size:13px;
  font-weight:800;
  color:var(--blue);
}
.addons-wrap{
  margin-top:28px;
  border-radius:12px;
  background:var(--navy);
  color:white;
  padding:34px;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:40px;
  align-items:start;
}
.addons-heading h3{
  font:800 34px/1 "Barlow Condensed",sans-serif;
  text-transform:uppercase;
  margin:0;
}
.addons-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:#28415b;
  border:1px solid #28415b;
}
.addon{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  background:var(--navy);
  padding:18px;
}
.addon span{
  color:#c3d0dc;
  font-size:14px;
}
.addon strong{
  color:white;
  white-space:nowrap;
}
@media(max-width:900px){
  .addons-wrap{grid-template-columns:1fr}
}
@media(max-width:620px){
  .pricing-grid,.addons-grid{grid-template-columns:1fr}
  .price-card.showroom{grid-column:auto}
}


/* Booking / Schedule */
.booking-section{background:#f7f9fb}
.booking-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:34px;align-items:start}
.booking-info{background:var(--navy);color:#fff;border-radius:12px;padding:30px;position:static;top:auto}
.booking-step{display:grid;grid-template-columns:36px 1fr;gap:12px;padding:20px 0;border-bottom:1px solid #28415b}
.booking-step:first-child{padding-top:0}
.booking-step>span{color:#8bb0d3;font-size:11px;font-weight:800;letter-spacing:1px}
.booking-step strong{display:block;font:800 20px/1 "Barlow Condensed",sans-serif;text-transform:uppercase}
.booking-step p{margin:7px 0 0;color:#aebfd0;line-height:1.55;font-size:13px}
.availability-note{margin-top:22px;padding:15px;border:1px solid #36516d;border-radius:7px;color:#adc0d3;font-size:12px;line-height:1.55}
.availability-note strong{color:#fff}
.availability-note code{color:#fff;background:#0a2848;padding:2px 5px;border-radius:4px}
.booking-form{background:#fff;border:1px solid #dce3e9;border-radius:12px;padding:32px}
.form-section-title{font:800 22px/1 "Barlow Condensed",sans-serif;text-transform:uppercase;color:var(--navy);padding-top:8px;margin:4px 0 18px;border-top:1px solid #e5eaee}
.form-section-title:first-child{border-top:0;padding-top:0}
.addon-fieldset{border:0;padding:0;margin:0 0 28px}
.addon-fieldset legend{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}
.check-option,.consent-option{flex-direction:row;align-items:flex-start;gap:10px;text-transform:none;letter-spacing:0;font-size:14px;font-weight:600;padding:11px 0;margin:0}
.check-option input,.consent-option input{width:auto;margin-top:2px;accent-color:var(--navy)}
.check-option span{width:100%;display:flex;justify-content:space-between;gap:15px;color:#35485b}
.check-option b{color:var(--navy)}
.consent-option{border:1px solid #dce3e9;padding:14px;border-radius:7px;margin:8px 0 16px;color:#4f6072;line-height:1.45}
.availability-status{padding:11px 13px;border-radius:6px;background:#f0f4f7;color:#536a80;font-size:12px;font-weight:700;margin:-2px 0 18px}
.booking-submit{background:var(--navy);color:#fff}
@media(max-width:900px){.booking-layout{grid-template-columns:1fr}.booking-info{position:static}}
/* Improved How It Works layout */
.area-card li {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  column-gap: 18px;
  padding: 24px 0;
  align-items: start;
}

.area-card li::before {
  grid-column: 1;
  grid-row: 1 / span 2;
  font-size: 16px;
  line-height: 1.2;
  padding-top: 3px;
}

.area-card li b {
  grid-column: 2;
  grid-row: 1;
  font-size: 20px;
  line-height: 1.25;
}

.area-card li small {
  grid-column: 2;
  grid-row: 2;
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.5;
}



/* Google Calendar booking */
.google-booking {
  width: 100%;
  min-width: 0;
  background: #ffffff;
  border: 1px solid #dce3e9;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(6, 27, 52, 0.1);
}

.google-booking iframe {
  display: block;
  width: 100%;
  height: 760px;
  border: 0;
}

@media (max-width: 768px) {
  .google-booking iframe {
    height: 820px;
  }
}

.booking-intro {
  position: static;
  top: auto;
  align-self: start;
}

/* Fix desktop header alignment */
@media (min-width: 901px) {
  .site-header .menu-toggle {
    display: none !important;
  }

  .site-header .brand {
    margin-right: auto;
  }

  .site-header .nav {
    margin-left: auto;
  }
}

/* Service area city columns */
.service-cities-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 18px;
  margin-top: 32px;
}

.service-city-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.service-city-column span {
  padding: 12px 14px;
  background: #f4f7fa;
  border-left: 3px solid var(--blue);
  border-radius: 4px;
  color: var(--navy);
  font-size: 14px;
  font-weight: 700;
}

@media (max-width: 1100px) {
  .service-cities-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 620px) {
  .service-cities-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .service-city-column {
    gap: 10px;
  }

  .service-city-column span {
    padding: 10px;
    font-size: 13px;
  }
}

/* Clean service-area buttons */
.service-cities-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  width: 100%;
  margin: 32px 0 55px;
}

.service-city-column {
  display: contents;
}

.service-city-column span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  width: 100%;
  padding: 12px 10px;
  box-sizing: border-box;
  background: #f4f7fa;
  border: 1px solid #dce5ed;
  border-left: 4px solid var(--blue);
  border-radius: 7px;
  color: var(--navy);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}

@media (max-width: 900px) {
  .service-cities-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .service-cities-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .service-city-column span {
    min-height: 54px;
    font-size: 13px;
  }
}

/* Service area two-column layout */
.service-area {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(340px, 0.85fr);
  gap: 48px;
  align-items: stretch;
}

.service-area .area-copy,
.service-area .area-card {
  min-width: 0;
}

.service-area .area-card {
  width: 100%;
  height: 100%;
  margin: 0;
  box-sizing: border-box;
}

@media (max-width: 760px) {
  .service-area {
    grid-template-columns: 1fr !important;
    gap: 35px;
  }

  .service-area .area-card {
    height: auto;
  }
}

/* Homepage photo slideshow */
.hero-art .hero-slideshow {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 8px;
  background: #021327;
}

.hero-art .hero-slideshow .hero-slide {
  position: absolute !important;
  inset: 0 !important;
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transition: opacity 0.8s ease-in-out;
}

.hero-art .hero-slideshow .hero-slide.active {
  opacity: 1;
}



.hero-slide:nth-child(1) { animation-delay: 0s; }
.hero-slide:nth-child(2) { animation-delay: 3s; }
.hero-slide:nth-child(3) { animation-delay: 6s; }
.hero-slide:nth-child(4) { animation-delay: 9s; }
.hero-slide:nth-child(5) { animation-delay: 12s; }
.hero-slide:nth-child(6) { animation-delay: 15s; }
.hero-slide:nth-child(7) { animation-delay: 18s; }
.hero-slide:nth-child(8) { animation-delay: 21s; }

@keyframes heroPhotoFade {
  0% {
    opacity: 0;
  }

  2% {
    opacity: 1;
  }

  10.5% {
    opacity: 1;
  }

  12.5% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

/* ==================================================
   GALLERY PAGE
================================================== */

.gallery-page {
  background: #f7f9fb;
  color: #031933;
}

/* Gallery introduction */

.gallery-hero {
  padding: 90px max(24px, calc((100vw - 1180px) / 2)) 65px;
  color: #fff;
  background:
    radial-gradient(
      circle at 85% 20%,
      rgba(11, 95, 174, 0.22),
      transparent 30%
    ),
    linear-gradient(135deg, #021327, #041c38);
}

.gallery-hero .eyebrow {
  display: block;
  margin-bottom: 18px;
  color: #8bb0d3;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 3px;
}

.gallery-hero h1 {
  max-width: 800px;
  margin: 0 0 18px;
  color: #fff;
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(58px, 8vw, 105px);
  font-weight: 800;
  line-height: 0.9;
  letter-spacing: -2px;
  text-transform: uppercase;
}

.gallery-hero p {
  max-width: 680px;
  margin: 0;
  color: #bdcde0;
  font-size: 18px;
  line-height: 1.7;
}

/* Photograph grid */

.gallery-section {
  padding: 70px max(24px, calc((100vw - 1180px) / 2)) 90px;
}

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

.photo-gallery img {
  display: block;
  width: 100%;
  height: 360px;
  object-fit: cover;
  object-position: center;
  border: 1px solid #dce3e9;
  border-radius: 12px;
  background: #e9eef3;
  box-shadow: 0 12px 30px rgba(3, 25, 51, 0.09);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.photo-gallery img:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 38px rgba(3, 25, 51, 0.16);
}

/* Create a little variation without breaking the grid */

.photo-gallery img:nth-child(7n + 1) {
  grid-column: span 2;
}

.photo-gallery img:nth-child(7n + 1),
.photo-gallery img:nth-child(7n + 5) {
  height: 430px;
}

/* Bottom booking section */

.gallery-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 35px;
  padding: 65px max(24px, calc((100vw - 1180px) / 2));
  color: #fff;
  background: #031933;
}

.gallery-cta .eyebrow {
  display: block;
  margin-bottom: 12px;
  color: #8bb0d3;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2px;
}

.gallery-cta h2 {
  margin: 0;
  color: #fff;
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(38px, 5vw, 62px);
  line-height: 1;
  text-transform: uppercase;
}

.gallery-cta .btn {
  flex-shrink: 0;
}

/* Tablet */

@media (max-width: 900px) {
  .gallery-hero {
    padding-top: 70px;
    padding-bottom: 55px;
  }

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

  .photo-gallery img,
  .photo-gallery img:nth-child(7n + 1),
  .photo-gallery img:nth-child(7n + 5) {
    height: 330px;
  }

  .photo-gallery img:nth-child(7n + 1) {
    grid-column: auto;
  }
}

/* Phone */

@media (max-width: 600px) {
  .gallery-hero {
    padding-top: 55px;
    padding-bottom: 45px;
  }

  .gallery-hero p {
    font-size: 16px;
  }

  .gallery-section {
    padding-top: 35px;
    padding-bottom: 55px;
  }

  .photo-gallery {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .photo-gallery img,
  .photo-gallery img:nth-child(7n + 1),
  .photo-gallery img:nth-child(7n + 5) {
    height: 330px;
    grid-column: auto;
  }

  .gallery-cta {
    align-items: flex-start;
    flex-direction: column;
  }

  .gallery-cta .btn {
    width: 100%;
    text-align: center;
  }
}

/* ==================================================
   GALLERY SLIDESHOW
================================================== */

.gallery-slideshow-section {
  padding: 70px max(24px, calc((100vw - 1180px) / 2)) 100px;
  background: #f7f9fb;
}

.gallery-slideshow {
  width: min(100%, 900px);
  margin: 0 auto;
}

.gallery-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  padding: 20px;
  overflow: hidden;
  border: 1px solid #29425d;
  border-radius: 22px;
  background: #0b2948;
  box-shadow: 0 25px 65px rgba(3, 25, 51, 0.18);
}

.gallery-frame::before {
  position: absolute;
  inset: 20px;
  z-index: 1;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  content: "";
  pointer-events: none;
}

.gallery-frame img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: cover;
  object-position: center;
  opacity: 1;
  transition:
    opacity 0.25s ease,
    transform 0.6s ease;
}

.gallery-frame img.is-changing {
  opacity: 0;
  transform: scale(1.015);
}

.gallery-controls {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  margin-top: 24px;
}

.gallery-arrow {
  min-height: 54px;
  padding: 14px 24px;
  border: 1px solid #ccd7e2;
  border-radius: 7px;
  color: #031933;
  background: #fff;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition:
    color 0.2s ease,
    background 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}

#gallery-previous {
  justify-self: start;
}

#gallery-next {
  justify-self: end;
}

.gallery-arrow:hover {
  border-color: #031933;
  color: #fff;
  background: #031933;
  transform: translateY(-2px);
}

.gallery-counter {
  min-width: 90px;
  color: #536a80;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
}

.gallery-progress {
  width: 100%;
  height: 4px;
  margin-top: 22px;
  overflow: hidden;
  border-radius: 20px;
  background: #dce4eb;
}

#gallery-progress-bar {
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(
    90deg,
    #f8b600 0 33%,
    #ed1c24 33% 66%,
    #0863b6 66% 100%
  );
}

#gallery-progress-bar.is-running {
  animation: galleryProgress 3s linear forwards;
}

@keyframes galleryProgress {
  from {
    width: 0;
  }

  to {
    width: 100%;
  }
}

@media (max-width: 700px) {
  .gallery-slideshow-section {
    padding-top: 40px;
    padding-bottom: 65px;
  }

  .gallery-frame {
    padding: 10px;
    border-radius: 14px;
  }

  .gallery-frame::before {
    inset: 10px;
  }

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

  #gallery-previous,
  #gallery-next {
    width: 100%;
    justify-self: stretch;
  }

  .gallery-counter {
    grid-column: 1 / -1;
    grid-row: 1;
  }
}

/* ==================================================
   GALLERY TWO-COLUMN SHOWCASE
================================================== */

.gallery-showcase {
  min-height: calc(100vh - 85px);
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(440px, 1.1fr);
  align-items: center;
  gap: clamp(55px, 7vw, 110px);
  padding:
    75px
    max(24px, calc((100vw - 1450px) / 2))
    90px;
  color: #fff;
  background:
    radial-gradient(
      circle at 78% 25%,
      rgba(11, 95, 174, 0.22),
      transparent 32%
    ),
    linear-gradient(135deg, #021327 0%, #041c38 60%, #031933 100%);
}

.gallery-showcase-copy {
  max-width: 650px;
}

.gallery-showcase-copy .eyebrow {
  display: block;
  margin-bottom: 24px;
  color: #8bb0d3;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 3px;
}

.gallery-showcase-copy h1 {
  margin: 0 0 28px;
  color: #fff;
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(75px, 8vw, 135px);
  font-weight: 800;
  line-height: 0.78;
  letter-spacing: -3px;
  text-transform: uppercase;
}

.gallery-showcase-copy p {
  max-width: 570px;
  margin: 0;
  color: #bdcde0;
  font-size: clamp(16px, 1.4vw, 20px);
  line-height: 1.75;
}

.gallery-copy-stripes {
  display: flex;
  gap: 6px;
  width: 90px;
  height: 7px;
  margin-top: 38px;
  transform: skewX(-16deg);
}

.gallery-copy-stripes span {
  flex: 1;
}

.gallery-copy-stripes span:nth-child(1) {
  background: #f8b600;
}

.gallery-copy-stripes span:nth-child(2) {
  background: #ed1c24;
}

.gallery-copy-stripes span:nth-child(3) {
  background: #0863b6;
}

/* Slideshow side */

.gallery-showcase .gallery-slideshow {
  width: min(100%, 700px);
  margin: 0 0 0 auto;
}

.gallery-showcase .gallery-frame {
  width: 100%;
  aspect-ratio: 1 / 1;
  padding: 18px;
  border: 1px solid #29425d;
  border-radius: 22px;
  background: rgba(13, 44, 75, 0.88);
  box-shadow: 0 30px 75px rgba(0, 0, 0, 0.32);
}

.gallery-showcase .gallery-frame img {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: cover;
  object-position: center;
}

/* Controls on navy background */

.gallery-showcase .gallery-controls {
  margin-top: 20px;
}

.gallery-showcase .gallery-arrow {
  border-color: rgba(255, 255, 255, 0.2);
  color: #031933;
  background: #fff;
}

.gallery-showcase .gallery-arrow:hover {
  border-color: #fff;
  color: #fff;
  background: #0863b6;
}

.gallery-showcase .gallery-counter {
  color: #bdcde0;
}

.gallery-showcase .gallery-progress {
  background: rgba(255, 255, 255, 0.17);
}

/* Tablet and phone */

@media (max-width: 1000px) {
  .gallery-showcase {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 55px;
    padding-top: 70px;
    padding-bottom: 75px;
  }

  .gallery-showcase-copy {
    max-width: 750px;
  }

  .gallery-showcase-copy h1 {
    line-height: 0.85;
  }

  .gallery-showcase .gallery-slideshow {
    width: min(100%, 700px);
    margin: 0 auto;
  }
}

@media (max-width: 600px) {
  .gallery-showcase {
    gap: 40px;
    padding-top: 55px;
    padding-bottom: 60px;
  }

  .gallery-showcase-copy h1 {
    margin-bottom: 22px;
    font-size: clamp(65px, 22vw, 90px);
  }

  .gallery-copy-stripes {
    margin-top: 28px;
  }

  .gallery-showcase .gallery-frame {
    padding: 10px;
    border-radius: 15px;
  }
}

/* Homepage Gallery */
#gallery.gallery-showcase {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(420px, 1.2fr);
  align-items: center;
  gap: 60px;
  width: 100%;
  padding: 90px max(24px, calc((100vw - 1180px) / 2));
  background:
    radial-gradient(circle at 75% 40%, rgba(11, 95, 174, 0.18), transparent 30%),
    linear-gradient(135deg, #021327 0%, #041c38 58%, #031933 100%);
  color: white;
  box-sizing: border-box;
  overflow: hidden;
}

#gallery .gallery-showcase-copy {
  min-width: 0;
}

#gallery .gallery-showcase-copy .eyebrow {
  display: block;
  margin-bottom: 18px;
  color: #bcd2e9;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 3px;
}

#gallery .gallery-showcase-copy h2 {
  margin: 0;
  color: white;
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(64px, 8vw, 120px);
  font-weight: 800;
  line-height: 0.85;
  text-transform: uppercase;
}

#gallery .gallery-showcase-copy p {
  max-width: 520px;
  margin: 30px 0 0;
  color: #bcd2e9;
  font-size: 18px;
  line-height: 1.7;
}

#gallery .gallery-copy-stripes {
  display: flex;
  gap: 5px;
  width: 100px;
  height: 7px;
  margin-top: 35px;
  transform: skewX(-15deg);
}

#gallery .gallery-copy-stripes span {
  flex: 1;
}

#gallery .gallery-copy-stripes span:nth-child(1) {
  background: #fbbd17;
}

#gallery .gallery-copy-stripes span:nth-child(2) {
  background: #ed1c24;
}

#gallery .gallery-copy-stripes span:nth-child(3) {
  background: #1268b3;
}

#gallery .gallery-slideshow {
  width: 100%;
  max-width: 680px;
  justify-self: end;
}

#gallery .gallery-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  padding: 18px;
  background: #0d3154;
  border: 1px solid #284d70;
  border-radius: 28px;
  box-sizing: border-box;
  overflow: hidden;
}

#gallery .gallery-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 18px;
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

#gallery .gallery-frame img.is-changing {
  opacity: 0;
  transform: scale(1.01);
}

#gallery .gallery-controls {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  margin-top: 22px;
}

#gallery .gallery-arrow {
  padding: 14px 20px;
  border: 0;
  border-radius: 8px;
  background: white;
  color: #031933;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

#gallery #gallery-next {
  justify-self: end;
}

#gallery .gallery-counter {
  color: #bcd2e9;
  font-weight: 800;
  white-space: nowrap;
}

#gallery .gallery-progress {
  height: 5px;
  margin-top: 18px;
  overflow: hidden;
  background: #173d60;
  border-radius: 10px;
}

#gallery #gallery-progress-bar {
  width: 0;
  height: 100%;
  background: linear-gradient(
    90deg,
    #fbbd17 0%,
    #fbbd17 33.33%,
    #ed1c24 33.33%,
    #ed1c24 66.66%,
    #1268b3 66.66%,
    #1268b3 100%
  );
}

#gallery #gallery-progress-bar.is-running {
  animation: galleryProgress 3s linear forwards;
}

@keyframes galleryProgress {
  from {
    width: 0;
  }

  to {
    width: 100%;
  }
}

@media (max-width: 900px) {
  #gallery.gallery-showcase {
    grid-template-columns: 1fr;
    gap: 45px;
    padding-top: 70px;
    padding-bottom: 70px;
  }

  #gallery .gallery-slideshow {
    max-width: 650px;
    justify-self: center;
  }
}

@media (max-width: 560px) {
  #gallery .gallery-showcase-copy h2 {
    font-size: 64px;
  }

  #gallery .gallery-controls {
    gap: 10px;
  }

  #gallery .gallery-arrow {
    padding: 12px;
    font-size: 13px;
  }
}

/* Keep booking section spacious */
.booking-layout {
  width: min(1400px, calc(100% - 48px));
  margin: 0 auto;
  grid-template-columns: minmax(320px, 400px) minmax(0, 1fr);
  gap: 48px;
}

.booking-info {
  width: 100%;
  min-width: 0;
}

.google-booking {
  width: 100%;
  min-width: 0;
}

.google-booking iframe {
  width: 100%;
  min-width: 0;
}

/* Stack cleanly before the columns become cramped */
@media (max-width: 980px) {
  .booking-layout {
    width: min(900px, calc(100% - 32px));
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .google-booking iframe {
    min-width: 0;
  }
}

/* Final compact gallery override — keep this block at the end of the file. */
#gallery.gallery-showcase {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(240px, 320px) minmax(380px, 520px) !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 52px !important;
  width: 100% !important;
  min-height: auto !important;
  padding: 72px max(24px, calc((100vw - 960px) / 2)) !important;
  color: #fff !important;
  background: radial-gradient(circle at 75% 40%, rgba(11,95,174,.18), transparent 30%), linear-gradient(135deg,#021327 0%,#041c38 58%,#031933 100%) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

#gallery .gallery-showcase-copy {
  position: static !important;
  grid-column: auto !important;
  max-width: 320px !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#gallery .gallery-showcase-copy .eyebrow {
  display: block;
  margin-bottom: 18px;
  color: #bcd2e9;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 3px;
}

#gallery .gallery-showcase-copy h2 {
  margin: 0;
  color: #fff;
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(60px, 6vw, 86px);
  font-weight: 800;
  line-height: .86;
  text-transform: uppercase;
}

#gallery .gallery-showcase-copy p {
  max-width: 320px;
  margin: 24px 0 0;
  color: #bcd2e9;
  font-size: 16px;
  line-height: 1.65;
}

#gallery .gallery-copy-stripes {
  display: flex;
  gap: 5px;
  width: 88px;
  height: 7px;
  margin-top: 30px;
  transform: skewX(-15deg);
}

#gallery .gallery-copy-stripes span { flex: 1; }
#gallery .gallery-copy-stripes span:nth-child(1) { background: #fbbd17; }
#gallery .gallery-copy-stripes span:nth-child(2) { background: #ed1c24; }
#gallery .gallery-copy-stripes span:nth-child(3) { background: #1268b3; }

#gallery .gallery-slideshow-section,
#gallery .gallery-slideshow {
  position: static !important;
  grid-column: auto !important;
  width: 100% !important;
  max-width: 520px !important;
  justify-self: end !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#gallery .gallery-frame {
  position: relative !important;
  width: 100% !important;
  max-width: 520px !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  padding: 14px !important;
  background: #0d3154 !important;
  border: 1px solid #284d70 !important;
  border-radius: 22px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.28) !important;
}

#gallery .gallery-frame::before { display: none !important; }

#gallery .gallery-frame img,
#gallery #gallery-image {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 14px !important;
  opacity: 1;
  transform: scale(1);
  transition: opacity .32s ease, transform .32s ease;
}

#gallery .gallery-frame img.is-changing {
  opacity: 0 !important;
  transform: scale(1.015) !important;
}

#gallery .gallery-controls {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  gap: 18px !important;
  margin-top: 18px !important;
}

#gallery .gallery-arrow {
  padding: 12px 17px;
  border: 0;
  border-radius: 8px;
  background: #fff;
  color: #031933;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

#gallery .gallery-arrow:hover { background: #0863b6; color: #fff; }
#gallery #gallery-next { justify-self: end; }
#gallery .gallery-counter { color: #bcd2e9; font-weight: 800; white-space: nowrap; }
#gallery .gallery-progress { height: 5px; margin-top: 15px; overflow: hidden; background: #173d60; border-radius: 10px; }
#gallery #gallery-progress-bar { width: 0; height: 100%; background: linear-gradient(90deg,#fbbd17 0 33.33%,#ed1c24 33.33% 66.66%,#1268b3 66.66% 100%); }
#gallery #gallery-progress-bar.is-running { animation: galleryProgress 3s linear forwards; }

@media (max-width: 900px) {
  #gallery.gallery-showcase {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    padding: 60px 24px !important;
  }

  #gallery .gallery-showcase-copy { max-width: 620px !important; }
  #gallery .gallery-showcase-copy p { max-width: 560px; }

  #gallery .gallery-slideshow-section,
  #gallery .gallery-slideshow {
    max-width: 520px !important;
    justify-self: center !important;
  }
}

@media (max-width: 560px) {
  #gallery .gallery-showcase-copy h2 { font-size: 60px; }
  #gallery .gallery-frame { padding: 10px !important; border-radius: 16px !important; }
  #gallery .gallery-controls { gap: 10px !important; }
  #gallery .gallery-arrow { padding: 11px 12px; font-size: 13px; }
}