:root{
  --color-night-1000:#020203;
  --color-night-950:#040506;
  --color-night-900:#08090c;
  --color-night-800:#101217;
  --color-night-700:#181b22;
  --color-graphite-500:#2a2d34;
  --color-graphite-400:#353840;
  --color-graphite-300:#41454f;
  --color-smoke-300:#8d909d;
  --color-smoke-200:#b3b6c2;
  --color-smoke-150:#cbcfd9;
  --color-ice-50:#f5f6f9;
  --color-mclaren-orange:#ff6b00;
  --color-mclaren-orange-soft:#ff8640;
  --color-mclaren-orange-glow:rgba(255,107,0,0.32);
  --font-heading:'Barlow Condensed', 'Oswald', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  --bg:var(--color-night-1000);
  --bg-alt:var(--color-night-800);
  --card:rgba(18,20,26,0.95);
  --card-elevated:rgba(24,26,32,0.92);
  --text:#f2f3f7;
  --text-subtle:rgba(242,243,247,0.72);
  --muted:var(--color-smoke-200);
  --muted-strong:var(--color-smoke-150);
  --accent:var(--color-mclaren-orange); /* McLaren papaya */
  --accent-soft:var(--color-mclaren-orange-soft);
  --line:rgba(255,255,255,0.08);
  --ambient-rgb:255 106 0;
  --ambient-brightness:0.6;
  --ambient-glow-boost:1;
  --ambient-boost-factor:0;
  --ambient-threshold-percent:71.4286%;
  --ambient-arc-shift:0px;
  --shadow-ambient:0 10px 30px rgba(0,0,0,0.55);
  --shadow-glow:0 0 32px var(--color-mclaren-orange-glow);
  --radius-lg:18px;
  --radius-md:14px;
  --radius-sm:10px;
  --transition-base:0.28s cubic-bezier(.22,.61,.36,1);
  --ambient-flow-offset:0%;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font-body);
  background: radial-gradient(1200px 600px at 75% -10%, rgba(255,107,0,0.12), transparent 60%), var(--bg);
  color:var(--text);
  line-height:1.65;
  letter-spacing:0.015em;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5,h6{
  font-family:var(--font-heading);
  letter-spacing:0.05em;
  text-transform:uppercase;
  margin:0 0 12px;
}

p{color:var(--text-subtle); margin:0 0 16px}

#ambientOverlay,
#ambientRail{
  pointer-events:none;
  position:fixed;
  left:0;
  width:100%;
  z-index:-1;
  opacity:0;
  transition:opacity 0.45s ease;
}
#ambientOverlay{
  top:0;
  height:100%;
  mix-blend-mode:screen;
  background:radial-gradient(68% 90% at 50% -12%, rgb(var(--ambient-rgb) / 0.32), transparent 70%);
}
#ambientArc{
  pointer-events:none;
  position:fixed;
  inset:0;
  z-index:-1;
  opacity:0;
  transition:opacity 0.6s ease;
  mix-blend-mode:screen;
  background:
    radial-gradient(130% 80% at 50% -10%, rgb(var(--ambient-rgb) / 0.18), transparent 70%),
    radial-gradient(110% 90% at 50% 120%, rgb(var(--ambient-rgb) / 0.28), transparent 74%),
    radial-gradient(70% 60% at 15% 85%, rgb(var(--ambient-rgb) / 0.22), transparent 78%),
    radial-gradient(70% 60% at 85% 78%, rgb(var(--ambient-rgb) / 0.2), transparent 76%),
    linear-gradient(120deg, rgb(var(--ambient-rgb) / 0.12) 0%, transparent 60%),
    linear-gradient(300deg, rgb(var(--ambient-rgb) / 0.12) 0%, transparent 65%);
  filter:blur(4px) saturate(120%);
  transform:translate3d(0,var(--ambient-arc-shift,0px),0);
  will-change:transform, opacity;
}
#ambientArc::before{
  content:"";
  position:absolute;
  inset:-15% -10% 35% -10%;
  border-radius:60% 60% 80% 80% / 80% 80% 45% 45%;
  background:
    conic-gradient(from 210deg at 50% 80%, rgb(var(--ambient-rgb) / 0.35) 0deg 120deg, transparent 160deg 360deg);
  filter:blur(12px);
  opacity:0.9;
}
#ambientArc::after{
  content:"";
  position:absolute;
  inset:18% 15% 26% 15%;
  border-radius:70% 70% 85% 85% / 85% 85% 40% 40%;
  background:
    radial-gradient(120% 95% at 50% 95%, rgb(var(--ambient-rgb) / 0.3), transparent 70%),
    radial-gradient(90% 70% at 50% 105%, rgb(var(--ambient-rgb) / 0.25), transparent 68%);
  filter:blur(10px);
  opacity:0.92;
}
#ambientOverlay::after{
  content:"";
  position:absolute;
  inset:-30%;
  border-radius:50%;
  opacity:0;
  pointer-events:none;
  background:conic-gradient(from 0deg, rgb(var(--ambient-rgb) / 0.05) 0deg 90deg, rgb(var(--ambient-rgb) / 0.35) 160deg 230deg, transparent 360deg);
  filter:blur(60px);
  transform:rotate(0deg);
  transform-origin:50% 50%;
}
#ambientRail{
  --ambient-rail-rgb:var(--ambient-rgb);
  --ambient-rail-alpha-soft:0.08;
  --ambient-rail-alpha-strong:0.55;
  --ambient-rail-opacity:0;
  --ambient-rail-brightness:var(--ambient-brightness);
  --ambient-rail-glow-alpha:0.32;
  --ambient-rail-glow-radius:24px;
  top:0;
  height:4px;
  z-index:49;
  opacity:0;
  background:linear-gradient(90deg,
    rgb(var(--ambient-rail-rgb, var(--ambient-rgb)) / var(--ambient-rail-alpha-soft, 0.08)) 0%,
    rgb(var(--ambient-rail-rgb, var(--ambient-rgb)) / var(--ambient-rail-alpha-strong, 0.55)) 40%,
    rgb(var(--ambient-rail-rgb, var(--ambient-rgb)) / var(--ambient-rail-alpha-strong, 0.55)) 60%,
    rgb(var(--ambient-rail-rgb, var(--ambient-rgb)) / var(--ambient-rail-alpha-soft, 0.08)) 100%);
  background-size:200% 100%;
  box-shadow:0 0 var(--ambient-rail-glow-radius, 24px) rgb(var(--ambient-rail-rgb, var(--ambient-rgb)) / var(--ambient-rail-glow-alpha, 0.32));
  transition:opacity 0.25s ease, box-shadow 0.25s ease;
}
body.ambient-on #ambientOverlay{
  display:none;
  opacity:0;
}
body.ambient-on #ambientArc{
  opacity:0;
}
body.ambient-on.ambient-boost #ambientArc{
  opacity:clamp(calc(0.2 + var(--ambient-boost-factor, 0) * 0.8), 0, 0.9);
}
body.ambient-on #ambientRail{
  opacity:var(--ambient-rail-opacity, 1);
}
body.ambient-flow #ambientOverlay::after{
  opacity:0.35;
  animation:ambientFlow 20s linear infinite;
}
body.ambient-flow #ambientRail,
#ambientRail.is-flow{
  background:linear-gradient(90deg,
    hsla(0,100%,50%,1) 0%,
    hsla(15,100%,51%,1) 4%,
    hsla(30,100%,53%,1) 8%,
    hsla(45,100%,54%,1) 12%,
    hsla(60,100%,55%,1) 16%,
    hsla(75,95%,53%,1) 20%,
    hsla(90,92%,50%,1) 24%,
    hsla(105,90%,48%,1) 28%,
    hsla(120,90%,46%,1) 32%,
    hsla(135,92%,46%,1) 36%,
    hsla(150,92%,45%,1) 40%,
    hsla(165,94%,46%,1) 44%,
    hsla(180,95%,50%,1) 48%,
    hsla(195,100%,52%,1) 52%,
    hsla(210,100%,55%,1) 56%,
    hsla(225,100%,58%,1) 60%,
    hsla(240,100%,58%,1) 64%,
    hsla(255,100%,60%,1) 68%,
    hsla(270,100%,62%,1) 72%,
    hsla(285,100%,63%,1) 76%,
    hsla(300,100%,63%,1) 80%,
    hsla(315,100%,60%,1) 84%,
    hsla(330,100%,58%,1) 88%,
    hsla(345,100%,55%,1) 92%,
    hsla(360,100%,50%,1) 100%);
  background-size:420% 100%;
  background-repeat:repeat-x;
  background-position:var(--ambient-flow-offset, 0%) 0%;
  box-shadow:
    0 0 calc(var(--ambient-rail-glow-radius, 24px) * 0.8) rgba(255,255,255, min(1, calc(var(--ambient-rail-brightness, 0.6) + 0.05))),
    0 0 var(--ambient-rail-glow-radius, 24px) rgba(255,255,255, min(1, calc(var(--ambient-rail-brightness, 0.6) + 0.12)));
}
@keyframes ambientFlow{
  0%{transform:rotate(0deg);}
  100%{transform:rotate(360deg);}
}
body.ambient-on[data-tm-mode="track"] #ambientOverlay{
  background:
    radial-gradient(72% 85% at 82% -10%, rgba(255,70,0,0.32), transparent 68%),
    radial-gradient(46% 60% at 12% 112%, rgba(0,0,0,0.42), transparent 80%),
    repeating-conic-gradient(from 18deg at 20% 80%, rgba(255,60,0,0.18) 0deg 14deg, transparent 14deg 36deg),
    linear-gradient(125deg, rgba(255,70,0,0.16) 0%, transparent 65%);
}
body.ambient-on[data-tm-mode="sport"] #ambientOverlay{
  background:
    radial-gradient(60% 80% at 50% -15%, rgba(255,30,30,0.28), transparent 70%),
    radial-gradient(38% 50% at 80% 105%, rgba(90,0,0,0.32), transparent 82%),
    repeating-linear-gradient(135deg, rgba(255,0,0,0.14) 0 44px, transparent 44px 94px),
    linear-gradient(205deg, rgba(120,0,0,0.22) 20%, transparent 72%);
}
body.ambient-on[data-tm-mode="comfort"] #ambientOverlay{
  background:
    radial-gradient(70% 90% at 50% -12%, rgba(255,255,255,0.35), transparent 70%),
    radial-gradient(48% 58% at 85% 102%, rgba(220,220,220,0.26), transparent 82%),
    repeating-linear-gradient(120deg, rgba(255,255,255,0.1) 0 24px, transparent 24px 76px);
}
body.ambient-on[data-tm-mode="electric"] #ambientOverlay{
  background:
    radial-gradient(68% 82% at 50% -15%, rgba(0,200,255,0.35), transparent 72%),
    radial-gradient(48% 55% at 82% 95%, rgba(0,255,210,0.24), transparent 85%),
    repeating-linear-gradient(90deg, rgba(0,160,255,0.12) 0 2px, transparent 2px 68px),
    repeating-linear-gradient(0deg, rgba(0,200,255,0.12) 0 2px, transparent 2px 68px),
    conic-gradient(from 45deg at 18% 78%, rgba(0,255,255,0.08) 0deg 90deg, transparent 90deg 360deg);
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 22px;
  border-radius:var(--radius-sm);
  font-family:var(--font-heading);
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  font-size:0.8rem;
  border:1px solid transparent;
  color:var(--text);
  background:transparent;
  transition:background var(--transition-base), color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}
.btn-primary{
  background:var(--accent);
  color:#050607;
  border-color:var(--accent);
  box-shadow:var(--shadow-glow);
}
.btn-primary:hover,
.btn-primary:focus-visible{
  background:var(--color-mclaren-orange-soft);
  border-color:var(--color-mclaren-orange-soft);
  box-shadow:0 0 18px rgba(255,107,0,0.32);
}
.btn-outline{
  border-color:var(--line);
  color:var(--text);
  background:rgba(255,255,255,0.02);
}
.btn-outline:hover,
.btn-outline:focus-visible{
  border-color:var(--accent);
  color:var(--accent);
}
.btn-link{
  padding:0;
  border:none;
  font-size:0.85rem;
  background:none;
  color:var(--accent);
  letter-spacing:0.12em;
}
.btn-link::after{display:none}
.btn::after{display:none}
.btn:hover::after,
.btn:focus::after{display:none}
.btn-link:hover,
.btn-link:focus-visible{
  color:var(--color-mclaren-orange-soft);
}
.btn-small{
  padding:8px 16px;
  font-size:0.72rem;
  letter-spacing:0.16em;
}

.container{
  width:min(1120px, 92%);
  margin-inline:auto;
}

/* Hero */
.hero{
  position:relative;
  overflow:hidden;
  padding:clamp(80px, 12vw, 160px) 0 clamp(80px, 14vw, 180px);
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(150deg, rgba(255,107,0,0.18) 0%, rgba(255,107,0,0.04) 55%, transparent 70%),
    radial-gradient(70% 120% at 95% -10%, rgba(255,107,0,0.22), transparent 70%),
    var(--bg);
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(60% 90% at 20% -10%, rgba(255,255,255,0.06), transparent 70%);
  pointer-events:none;
}
.hero-inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns: minmax(0,1.1fr) minmax(0,0.9fr);
  gap:clamp(32px, 5vw, 64px);
  align-items:center;
}
.hero-copy{
  max-width:640px;
}
.hero-eyebrow{
  font-family:var(--font-heading);
  text-transform:uppercase;
  letter-spacing:0.28em;
  font-size:0.78rem;
  color:var(--accent);
  margin-bottom:18px;
}
.hero h1{
  font-size:clamp(2.8rem, 5vw, 3.6rem);
  line-height:1.05;
  margin-bottom:20px;
}
.hero-lead{
  font-size:1.05rem;
  max-width:46ch;
  color:var(--muted);
}
.hero-cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:28px 0 14px;
}
.hero-cta .btn-link{
  align-self:center;
}
.hero-metrics{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
  margin-top:32px;
}
.hero-metrics div{
  padding:16px 18px;
  border-radius:var(--radius-md);
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(17,19,25,0.65);
  backdrop-filter:blur(10px);
}
.hero-metrics dt{
  font-family:var(--font-heading);
  font-size:clamp(1.2rem, 2vw, 1.6rem);
  letter-spacing:0.2em;
  color:var(--accent);
  margin-bottom:6px;
}
.hero-metrics dd{
  margin:0;
  color:var(--muted-strong);
  letter-spacing:0.06em;
  text-transform:uppercase;
  font-size:0.75rem;
}
.hero-visual{
  position:relative;
}
.hero-visual img{
  width:100%;
  height:100%;
  max-height:520px;
  object-fit:cover;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 30px 80px rgba(0,0,0,0.55);
}
.hero-visual figcaption{
  margin-top:12px;
  font-size:0.75rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.58);
}
.hero-badge{
  position:absolute;
  bottom:24px;
  left:24px;
  max-width:280px;
  padding:16px 18px;
  border-radius:var(--radius-md);
  background:rgba(5,6,7,0.82);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 16px 40px rgba(0,0,0,0.5);
}
.hero-badge-label{
  display:block;
  font-family:var(--font-heading);
  letter-spacing:0.18em;
  text-transform:uppercase;
  font-size:0.72rem;
  color:var(--accent);
}
.hero-badge-copy{
  display:block;
  margin-top:6px;
  font-size:0.82rem;
  line-height:1.5;
  color:var(--muted);
}

#faq .section-banner{
  display:flex;
  align-items:flex-end;
  gap:14px;
  flex-wrap:wrap;
}

/* Sections */
.section{
  padding:clamp(72px, 10vw, 120px) 0;
  border-bottom:1px solid var(--line);
  position:relative;
}
.section-alt{
  background:var(--bg-alt);
}
.section-banner{
  max-width:820px;
  margin-bottom:36px;
}
.section-title{
  font-size:clamp(2rem, 3.4vw, 2.8rem);
  line-height:1.12;
  letter-spacing:0.14em;
  margin:0 0 18px;
}
.section-lead{
  font-size:1.02rem;
  color:var(--muted);
  max-width:60ch;
}
.section-eyebrow{
  font-family:var(--font-heading);
  text-transform:uppercase;
  letter-spacing:0.28em;
  font-size:0.76rem;
  color:var(--accent);
  margin:0 0 18px;
}

/* Specialist services */
.services-hero-head{
  display:grid;
  gap:10px;
  margin-bottom:20px;
  text-align:center;
}
.services-hero-head h2{
  margin:0;
  font-size:clamp(2.4rem, 5vw, 3rem);
  letter-spacing:0.14em;
}
.services-hero-head p{
  margin:0;
  color:var(--muted);
}
.services-featured{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:14px;
  margin-bottom:22px;
}
.featured-card{
  padding:18px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.12);
  background:linear-gradient(135deg, rgba(10,12,16,0.9) 0%, rgba(10,12,16,0.8) 100%);
  box-shadow:0 16px 32px rgba(0,0,0,0.35);
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:200px;
}
.featured-meta{
  text-transform:uppercase;
  letter-spacing:0.18em;
  font-size:0.72rem;
  color:var(--accent);
}
.featured-card h3{
  margin:0;
  font-size:1.1rem;
  letter-spacing:0.1em;
}
.featured-card p{
  margin:0;
  color:var(--muted);
  font-size:0.95rem;
}
.featured-actions{
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:auto;
}
.service-accordion{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
}
.service-accordion-item{
  border:1px solid rgba(255,255,255,0.1);
  border-radius:var(--radius-lg);
  background:rgba(8,10,16,0.85);
  overflow:hidden;
  box-shadow:0 12px 26px rgba(0,0,0,0.32);
  transition:border-color 0.2s ease, box-shadow 0.2s ease;
}
.service-accordion-item[open]{
  border-color:rgba(255,107,0,0.35);
  box-shadow:0 16px 34px rgba(0,0,0,0.38);
  grid-column:1 / -1;
}
.service-accordion summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
}
.summary-thumb{
  width:52px;
  height:52px;
  border-radius:var(--radius-md);
  border:1px solid rgba(255,255,255,0.08);
  background-size:cover;
  background-position:center;
  background-image:var(--service-cover, linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02)));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.2);
  flex-shrink:0;
}
.summary-text{
  flex:1;
}
.service-accordion summary::-webkit-details-marker{display:none;}
.service-accordion .chevron{
  transition:transform 0.2s ease;
}
.service-accordion-item[open] .chevron{
  transform:rotate(180deg);
}
.service-mini-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:12px;
  padding:0 14px 14px;
}
.service-mini-card{
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-md);
  padding:12px;
  background:rgba(255,255,255,0.02);
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:100%;
  box-shadow:0 10px 22px rgba(0,0,0,0.22);
}
.service-mini-card h3{
  margin:0;
  font-size:1rem;
  letter-spacing:0.08em;
}
.service-mini-card p{
  margin:0;
  color:var(--muted);
  font-size:0.92rem;
}
.btn-icon{
  width:32px;
  height:32px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(10,12,16,0.85);
  color:var(--accent);
  font-weight:700;
  font-size:16px;
  font-family:var(--font-body, 'Inter', system-ui, -apple-system, sans-serif);
  letter-spacing:0;
  padding:0;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  line-height:1;
  transform:none;
}
.service-mini-card ul{
  margin:0;
  padding-left:16px;
  color:var(--muted);
  font-size:0.9rem;
}
.card-actions{
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:auto;
}
.card-actions .btn{
  margin:0;
}
.book-service-fab{
  position:fixed;
  right:16px;
  bottom:16px;
  padding:12px 16px;
  border-radius:999px;
  background:var(--accent);
  color:#050607;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  box-shadow:0 14px 28px rgba(0,0,0,0.35);
  z-index:20;
  display:none;
}
.service-selection-dock{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:22;
  padding:10px 14px;
  display:grid;
  gap:8px;
  max-width:520px;
  margin:0 auto;
}
.service-selection-dock[hidden]{
  display:none !important;
}
.dock-toggle{
  border:1px solid rgba(255,255,255,0.2);
  background:linear-gradient(135deg, rgba(10,12,16,0.95), rgba(14,16,22,0.9));
  color:var(--text);
  border-radius:999px;
  padding:12px 16px;
  text-align:center;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  box-shadow:0 12px 26px rgba(0,0,0,0.35);
}
.dock-panel{
  border:1px solid rgba(255,255,255,0.12);
  border-radius:var(--radius-lg);
  background:rgba(6,7,10,0.95);
  padding:10px;
  box-shadow:0 12px 26px rgba(0,0,0,0.38);
}
.dock-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:6px;
  max-height:220px;
  overflow:auto;
}
.dock-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:var(--radius-md);
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.06);
}
.dock-item button{
  border:none;
  background:rgba(255,255,255,0.08);
  color:var(--text);
  width:26px;
  height:26px;
  border-radius:50%;
  cursor:pointer;
}
.dock-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:8px;
  gap:8px;
}
@media (max-width:720px){
  .book-service-fab{display:inline-flex;}
  .service-mini-grid{grid-template-columns:1fr;}
  .services-featured{grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));}
  .service-selection-dock{padding:8px 10px;}
}

.service-accordion-media{
  width:100%;
  height:160px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  background-size:cover;
  background-position:center;
  margin:0 14px 12px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.2);
}
.service-card{
  display:flex;
  flex-direction:column;
  background:var(--card);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-ambient);
  transition:transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
.service-card:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 60px rgba(0,0,0,0.45);
  border-color:rgba(255,107,0,0.45);
}
.service-media{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
}
.service-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform var(--transition-base);
}
.service-card:hover .service-media img{
  transform:scale(1.05);
}
.service-tag{
  position:absolute;
  top:18px;
  left:18px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(5,6,7,0.78);
  border:1px solid rgba(255,255,255,0.12);
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--accent);
}
.service-body{
  padding:22px 22px 26px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.service-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.service-card--simple .service-body{
  padding:18px 18px 20px;
  gap:10px;
}
.service-card--simple .service-head{
  justify-content:flex-start;
}
.service-card--simple{
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.06);
}
.service-card--simple::before{
  content:"";
  display:block;
  height:120px;
  border-radius:var(--radius-md);
  background:var(--card);
  background-image:var(--service-thumb);
  background-size:cover;
  background-position:center;
  margin:-4px -4px 10px -4px;
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.2);
}
.service-meta{
  margin:0;
  font-size:0.82rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--muted-strong);
}
.service-head h3{
  margin:0;
  font-size:1.32rem;
  letter-spacing:0.1em;
}
.service-price{
  font-family:var(--font-heading);
  font-size:0.82rem;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--muted-strong);
}
.service-points{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}
.service-card--simple .service-points{
  gap:8px;
}
.service-points li{
  position:relative;
  padding-left:18px;
  font-size:0.92rem;
  color:var(--muted);
  line-height:1.5;
}
.service-card--simple .service-points li{
  padding-left:14px;
}
.service-points li::before{
  content:"";
  position:absolute;
  left:0;
  top:0.55em;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 8px rgba(255,107,0,0.4);
}
.services-foot{
  margin-top:42px;
  padding:30px 32px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(10,12,16,0.8);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.services-foot h3{
  font-size:1.2rem;
  margin:0 0 8px;
  letter-spacing:0.14em;
}

.ticks{
  list-style:none;
  margin:24px 0;
  padding:0;
  display:grid;
  gap:12px;
}
.ticks li{
  position:relative;
  padding-left:26px;
  color:var(--muted);
  font-size:0.95rem;
}
.ticks li::before{
  content:"";
  position:absolute;
  left:0;
  top:0.45em;
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 12px rgba(255,107,0,0.35);
}

/* McLaren focus */
.mclaren-grid{
  display:grid;
  gap:clamp(28px, 5vw, 48px);
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  align-items:start;
}
.mclaren-copy p{
  max-width:60ch;
}
.mclaren-cta{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:20px;
}
.stat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:18px;
  margin-bottom:24px;
}
.stat-card{
  padding:20px;
  border-radius:var(--radius-md);
  border:1px solid rgba(255,255,255,0.1);
  background:rgba(13,15,20,0.8);
  box-shadow:var(--shadow-ambient);
}
.stat-value{
  display:block;
  font-family:var(--font-heading);
  font-size:clamp(1.6rem, 3vw, 2.1rem);
  letter-spacing:0.22em;
  color:var(--accent);
  margin-bottom:10px;
}
.stat-label{
  display:block;
  font-size:0.82rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted-strong);
  line-height:1.5;
}
.case-study{
  padding:24px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(8,10,14,0.85);
  box-shadow:0 24px 40px rgba(0,0,0,0.45);
  display:flex;
  flex-direction:column;
  gap:16px;
}
.case-study header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
.case-study h3{
  margin:0;
  font-size:1.2rem;
  letter-spacing:0.14em;
}
.case-study footer{
  font-size:0.85rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted-strong);
}

/* About */
.about-grid{
  display:grid;
  gap:clamp(24px, 4vw, 48px);
  grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr);
  align-items:start;
}

.about-card{
  background:var(--card);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-lg);
  padding:24px;
  box-shadow:var(--shadow-ambient);
  display:grid;
  gap:20px;
}

.about-story{
  display:grid;
  gap:24px;
}

.about-highlights{
  display:grid;
  gap:18px;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}

/* Animated RGB ring around the embedded map only */
.about-card .map-embed {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md);
}

 .about-card .map-embed::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px; /* border thickness */
  border-radius: 14px;
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s ease;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0) border-box;
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 2;
  box-sizing: border-box;
}

.about-card .map-embed iframe{
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  border: 0;
}

.map-actions{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
}
.map-actions .btn{
  width:100%;
  justify-content:center;
}

.about-contact{
  font-size:0.95rem;
  color:var(--muted);
}

.about-contact a{
  color:var(--accent);
}

/* Testimonials */
.testimonials-banner{
  background:
    linear-gradient(160deg, rgba(255,107,0,0.12) 0%, transparent 60%),
    var(--bg);
}
.reviews-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.review-logos{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:10px;
}
.google-logo{
  display:flex;
  align-items:center;
  gap:8px;
  height:34px;
}
.google-mark{
  width:24px;
  height:24px;
}
.google-text{
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:#4285F4;
  line-height:1;
}
.review-carousel{
  margin-top:18px;
}
.review-track{
  display:flex;
  gap:18px;
  overflow-x:auto;
  padding:6px 4px 10px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}
.review-track::-webkit-scrollbar{height:6px;}
.review-track::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15); border-radius:6px;}
.review-card{
  min-width:280px;
  max-width:360px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  padding:20px;
  background:rgba(8,10,14,0.85);
  box-shadow:0 18px 40px rgba(0,0,0,0.45);
  display:flex;
  flex-direction:column;
  gap:12px;
  scroll-snap-align:start;
  animation:floatUp 0.6s ease forwards;
}
.review-card:nth-child(2){animation-delay:0.08s;}
.review-card:nth-child(3){animation-delay:0.16s;}
.review-top{
  display:flex;
  align-items:flex-start;
  gap:12px;
}
.review-avatar{
  width:40px;
  height:40px;
  border-radius:12px;
  background:rgba(255,255,255,0.08);
  display:grid;
  place-items:center;
  font-weight:700;
  letter-spacing:0.08em;
  color:var(--accent);
  border:1px solid rgba(255,255,255,0.06);
}
.review-name{
  margin:0;
  font-weight:700;
}
.review-meta{
  color:var(--muted);
  font-size:0.85rem;
}
.review-time{
  margin:2px 0 0;
  color:var(--muted-strong);
  font-size:0.85rem;
}
.review-stars{
  margin-left:auto;
  color:var(--accent);
  letter-spacing:0.16em;
  font-weight:700;
}
.review-title{
  margin:2px 0 0;
  font-weight:700;
  color:var(--text);
}
.review-body{
  margin:0;
  color:var(--muted);
  line-height:1.6;
}
.review-foot{
  margin-top:auto;
}
.google-card{
  border-color:rgba(66,133,244,0.2);
  background:rgba(12,16,24,0.85);
}
.google-card .review-avatar{color:#4285F4;}
.google-card .review-stars{color:#4285F4;}
.google-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(66,133,244,0.12);
  color:#4285F4;
  font-weight:700;
  font-size:0.82rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.testimonial-cta{
  margin-top:20px;
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

@keyframes floatUp{
  from{opacity:0; transform:translateY(12px);}
  to{opacity:1; transform:translateY(0);}
}

/* Insights */
.insights-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:24px;
}
.insight-card{
  padding:24px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  background:var(--card);
  box-shadow:var(--shadow-ambient);
  display:flex;
  flex-direction:column;
  gap:16px;
}
.insight-tag{
  align-self:flex-start;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.12);
  letter-spacing:0.18em;
  font-size:0.68rem;
  text-transform:uppercase;
  color:var(--accent);
}
.insight-card h3{
  margin:0;
  font-size:1.2rem;
  letter-spacing:0.12em;
}

/* Facilities */
.facilities-grid{
  display:grid;
  gap:clamp(24px, 5vw, 48px);
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;
}
.facilities-copy{
  display:grid;
  gap:16px;
}
.facilities-gallery{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
}
.facilities-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:var(--radius-md);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 14px 28px rgba(0,0,0,0.4);
}

/* Map ring glow when ambient is enabled */
.about-card .map-embed.with-ambient::before{
  opacity:1;
  background: rgb(var(--ambient-rgb) / min(1, calc(var(--ambient-brightness) + 0.18)));
  box-shadow:
    0 0 calc(22px * var(--ambient-glow-boost, 1)) rgb(var(--ambient-rgb) / min(1, calc(var(--ambient-brightness) * 0.85 + 0.05))),
    0 0 calc(48px * var(--ambient-glow-boost, 1)) rgb(var(--ambient-rgb) / min(1, calc(var(--ambient-brightness) * 0.6 + 0.04)));
}

/* Gallery */
.gallery-grid{
  display:grid;
  gap:20px;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}
.gallery-grid figure{
  position:relative;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(10,12,16,0.8);
  box-shadow:0 22px 44px rgba(0,0,0,0.45);
  display:flex;
  flex-direction:column;
}
.gallery-grid img{
  width:100%;
  height:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  display:block;
  transition:transform var(--transition-base), filter var(--transition-base);
}
.gallery-grid figure:hover img{
  transform:scale(1.05);
  filter:brightness(1.05);
}
.gallery-grid figcaption{
  padding:16px 18px;
  font-size:0.78rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--muted-strong);
  position:relative;
  z-index:1;
}
.gallery-grid .gallery-link{
  position:relative;
}
.gallery-grid .gallery-link::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(5,6,7,0) 0%, rgba(5,6,7,0.8) 85%);
  pointer-events:none;
}
.gallery-grid .gallery-link .btn{
  position:absolute;
  right:18px;
  bottom:18px;
  z-index:2;
}

.gallery-collection{
  gap:24px;
}
.gallery-collection figure{
  cursor:pointer;
}
.gallery-collection figure:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:4px;
}
.gallery-collection figure.is-hidden{
  display:none;
}
body.lightbox-open{
  overflow:hidden;
}
.gallery-lightbox{
  position:fixed;
  inset:0;
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(4,5,7,0.92);
  backdrop-filter:blur(8px);
  opacity:0;
  pointer-events:none;
  transition:opacity 0.22s ease;
}
.gallery-lightbox.is-open{
  opacity:1;
  pointer-events:auto;
}
.gallery-lightbox[hidden]{display:none;}
.gallery-lightbox .lightbox-inner{
  max-width: min(960px, 92vw);
  width:100%;
  display:grid;
  gap:18px;
  justify-items:center;
}
.gallery-lightbox img{
  width:100%;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:0 30px 80px rgba(0,0,0,0.6);
}
.gallery-lightbox .lightbox-caption{
  font-size:0.9rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted-strong);
  text-align:center;
}
.lightbox-controls{
  display:flex;
  gap:12px;
}
.lightbox-controls button{
  appearance:none;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(10,12,16,0.85);
  color:var(--text);
  font-family:var(--font-heading);
  letter-spacing:0.18em;
  text-transform:uppercase;
  padding:10px 16px;
  border-radius:999px;
  cursor:pointer;
  transition:background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.lightbox-controls button:hover,
.lightbox-controls button:focus-visible{
  border-color:var(--accent);
  color:var(--accent);
}
.lightbox-close{
  position:absolute;
  top:24px;
  right:24px;
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(5,6,7,0.85);
  color:var(--text);
  font-size:1.2rem;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.lightbox-close:hover,
.lightbox-close:focus-visible{
  border-color:var(--accent);
  color:var(--accent);
}

.gallery-hero{
  position:relative;
  padding:clamp(120px, 18vw, 220px) 0 clamp(80px, 12vw, 140px);
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(160deg, rgba(5,6,7,0.86) 10%, rgba(5,6,7,0.6) 60%, rgba(5,6,7,0.85) 100%),
    var(--gallery-hero-photo, url('../../images/Gallery/wallpaper-1.jpg')) center/cover no-repeat;
}
.gallery-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(80% 120% at 80% -20%, rgba(255,107,0,0.28), transparent 60%);
  pointer-events:none;
}
.gallery-hero-inner{
  position:relative;
  z-index:1;
  max-width:720px;
  display:grid;
  gap:18px;
}
.gallery-hero-inner .hero-eyebrow{
  margin-bottom:12px;
}
.gallery-hero-inner h1{
  font-size:clamp(2.8rem, 6vw, 4rem);
  line-height:1.05;
}
.gallery-hero-inner p{
  font-size:1.05rem;
  color:var(--muted-strong);
  max-width:54ch;
}

.gallery-intro{
  margin-bottom:24px;
  max-width:720px;
  color:var(--muted);
}

.simple-gallery-grid{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}
.simple-gallery-card{
  display:flex;
  flex-direction:column;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(8,10,16,0.85);
  box-shadow:0 18px 40px rgba(0,0,0,0.45);
}
.simple-gallery-thumb{
  width:100%;
  aspect-ratio:4/3;
  background-size:cover;
  background-position:center;
  background-color:#0c0f15;
  position:relative;
  transition:transform 0.25s ease, opacity 0.25s ease;
}
.simple-gallery-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,0.55) 100%);
}
.simple-gallery-label{
  padding:10px 12px 12px;
  font-size:0.88rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted);
}
.simple-gallery-card:hover .simple-gallery-thumb,
.simple-gallery-card:focus-visible .simple-gallery-thumb{
  transform:scale(1.03);
  opacity:0.92;
}
.gallery-loading,
.gallery-empty{
  padding:8px 6px;
  color:var(--muted);
}

/* FAQ */
.faq{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px; margin:10px 0}
.faq summary{cursor:pointer; font-weight:600}
.faq p{color:var(--muted); margin:10px 0 0}

/* Form */
.form{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:18px}
.form-row{display:flex; flex-direction:column; gap:6px; margin-bottom:14px}
.form-row label{font-weight:600}
.form-row .req{color:var(--accent)}
.form-row input, .form-row textarea, .form-row select{
  background:#0f1014; color:var(--text); border:1px solid #2a2b31; border-radius:10px; padding:10px;
}
.form-row input:focus, .form-row textarea:focus, .form-row select:focus{outline:none; border-color:var(--accent)}
.form-actions{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.fineprint{font-size:12px; color:var(--muted); margin:0}
.form-grid{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}
.form-row--full{
  grid-column:1 / -1;
}
.form-row select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23ff6b00' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:12px 8px;
  padding-right:36px;
}
.form-row input[type="date"],
.form-row input[type="time"]{
  color:var(--muted);
}
.form-row option{
  color:#0b0b0c;
}
.enquiry-columns{
  display:grid;
  gap:32px;
  grid-template-columns:minmax(0,2fr) minmax(0,1fr);
  align-items:start;
}
.enquiry-aside{
  display:grid;
  gap:18px;
}
.booking-card{
  padding:20px 22px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(8,10,16,0.78);
  box-shadow:0 18px 36px rgba(0,0,0,0.45);
  display:grid;
  gap:12px;
}
.booking-card h3{
  margin:0;
  font-size:1.05rem;
  letter-spacing:0.14em;
}
.booking-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.booking-list li{
  position:relative;
  padding-left:20px;
  color:var(--muted);
  font-size:0.92rem;
  line-height:1.6;
}
.booking-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:0.55em;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 10px rgba(255,107,0,0.4);
}
.booking-card.contact a{
  color:var(--accent);
}
.small-print{
  font-size:0.75rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted-strong);
}
.section-anchor{
  display:block;
  position:relative;
  top:-100px;
  visibility:hidden;
}

/* Footer */
.site-footer{background:#0a0a0b; padding:26px 0}
.footer-grid{display:grid; gap:16px; grid-template-columns:1.2fr .8fr; align-items:start}
.foot-links{display:grid; gap:8px}
.foot-links a{color:var(--muted); text-decoration:none}
.foot-links a:hover{color:var(--text)}
.foot-note{color:var(--muted); margin:10px 0 0}
.foot-bottom{border-top:1px solid var(--line); margin-top:16px; padding-top:12px; display:flex; justify-content:space-between}

/* Responsive */
@media (max-width: 1100px){
  .hero-inner{grid-template-columns:1fr; gap:40px;}
  .hero-visual{order:-1;}
  .hero-metrics{grid-template-columns:repeat(2, minmax(0,1fr));}
  .services-grid{grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));}
  .mclaren-grid{grid-template-columns:1fr;}
  .facilities-grid{grid-template-columns:1fr;}
  .landing-hero-inner{grid-template-columns:1fr;}
  .landing-status-card{max-width:420px;}
  .landing-preview-grid{grid-template-columns:1fr;}
  .landing-map-grid{grid-template-columns:1fr;}
  .landing-footer-inner{grid-template-columns:1fr; justify-items:flex-start;}
  .landing-footer-cta{justify-items:flex-start;}
}
@media (max-width: 768px){
  .hero h1{font-size:clamp(2.4rem, 8vw, 2.8rem);}
  .hero-metrics{grid-template-columns:1fr;}
  .hero-visual{display:none;}
  .hero-badge{position:static; margin-top:18px;}
  .hero-visual figcaption{margin-top:18px;}
  .services-foot{flex-direction:column; align-items:flex-start;}
  .stat-grid{grid-template-columns:1fr 1fr;}
  .testimonial-grid,
  .insights-grid,
  .gallery-grid{grid-template-columns:1fr;}
  .map-actions{grid-template-columns:1fr;}
  .enquiry-columns{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}
  .landing-hero{padding-top:120px;}
  .landing-hero-copy{gap:18px;}
  .landing-stats{grid-template-columns:1fr;}
  .landing-status-card{justify-self:start;}
  .landing-preview-cta{flex-direction:column; align-items:flex-start;}
  .landing-map-actions{grid-template-columns:1fr;}
}
@media (max-width: 520px){
  .stat-grid{grid-template-columns:1fr;}
  .hero-cta{flex-direction:column; align-items:flex-start;}
  .hero-cta .btn-link{padding-top:8px;}
  .gallery-filters{flex-direction:column;}
  .filter-btn{width:100%; text-align:center;}
  .landing-cta{flex-direction:column; align-items:flex-start;}
  .landing-cta .btn-link{padding-top:8px;}
}

/* Enquiry Banner */
.enquiry-banner {
  background: none;
  position: relative;
  overflow: hidden;
}

.enquiry-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('../../images/wallpaper-3.jpg') center center / cover no-repeat;
  filter: blur(6px) brightness(0.88);
  opacity: 1;
  pointer-events: none;
}

.enquiry-banner .section-banner,
.enquiry-banner > * {
  position: relative;
  z-index: 2;
  background: none;
}

/* Gallery Banner */
.gallery-banner {
  background: none;
  position: relative;
  overflow: hidden;
}

.gallery-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('../../images/wallpaper-2.jpg') center center / cover no-repeat;
  filter: blur(8px) brightness(0.88);
  opacity: 1;
  pointer-events: none;
}

/* Only apply stacking context to main banner and direct children */
.gallery-banner .section-banner,
.gallery-banner > * {
  position: relative;
  z-index: 2;
  background: none;
}

.services-banner {
  background: none;
  position: relative;
  overflow: hidden;
}

.services-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('../../images/wallpaper-1.jpg') center center / cover no-repeat;
  filter: blur(8px) brightness(0.88);
  opacity: 1;
  pointer-events: none;
}

/* Ensure content appears above the blur overlay */
.services-banner .section-banner,
.services-banner > * {
  position: relative;
  z-index: 2;
  background: none;
}
/* =============================
   Landing page (index.html)
   ============================= */
body.landing{
  min-height:100%;
  background:
    linear-gradient(180deg, rgba(8,10,14,0.96) 0%, rgba(8,10,14,0.94) 55%, rgba(8,10,14,0.98) 100%),
    url('../../images/wallpaper-1.jpg') center top / cover no-repeat fixed;
  color:var(--text);
  font-family:var(--font-body);
  overflow-x:hidden;
  position:relative;
  isolation:isolate;
}
body.landing::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(60% 80% at 15% 10%, rgba(255,107,0,0.18), transparent 65%),
    radial-gradient(45% 60% at 80% -10%, rgba(127,90,240,0.18), transparent 70%);
  opacity:0.55;
  z-index:-1;
}

.landing main{
  display:flex;
  flex-direction:column;
  gap:clamp(60px, 10vw, 120px);
}

.review-strip{
  background:rgba(8,10,16,0.92);
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.review-strip-inner{
  display:flex;
  flex-wrap:wrap;
  gap:12px 18px;
  align-items:center;
  justify-content:center;
  padding:10px 0;
  font-size:0.9rem;
  letter-spacing:0.06em;
}
.review-item{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--muted);
}
.review-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
}
.review-icon svg{
  width:18px;
  height:18px;
  display:block;
}
.review-logo-full{
  display:none;
  align-items:center;
  gap:6px;
}
.review-logo-mark{
  width:20px;
  height:20px;
  display:block;
}
.review-logo-text{
  font-family:var(--font-heading);
  letter-spacing:0.12em;
  text-transform:uppercase;
  font-size:0.85rem;
}
.review-logo-text-google{color:#4285F4;}
.review-logo-text-facebook{color:#1877F2;}
.review-stars{
  color:var(--accent);
  font-size:0.95rem;
  letter-spacing:0.1em;
}
.review-score{
  display:none;
  color:var(--accent);
  font-size:0.95rem;
  letter-spacing:0.08em;
}
.review-link{
  color:var(--accent);
  font-size:0.85rem;
  text-transform:uppercase;
  letter-spacing:0.14em;
  font-family:var(--font-heading);
}

@media (max-width: 680px){
  .review-strip-inner{
    justify-content:space-between;
    gap:10px;
  }
  .review-item{
    gap:6px;
  }
  .review-icon{
    display:none;
  }
  .review-logo-full{
    display:inline-flex;
  }
  .review-logo-mark{
    width:22px;
    height:22px;
  }
  .review-link{
    display:none;
  }
  .review-stars{
    display:none;
  }

  .review-track .review-card:nth-child(n+2){
    display:none;
  }
  .review-score{
    display:inline-flex;
  }
}

.landing-hero{
  position:relative;
  padding:clamp(60px, 10vw, 120px) 0 clamp(60px, 9vw, 110px);
}
.landing-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(140deg, rgba(5,6,8,0.9) 0%, rgba(5,6,8,0.75) 55%, rgba(5,6,8,0.92) 100%);
  pointer-events:none;
}
.landing-hero-inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(28px, 5vw, 48px);
  align-items:start;
  justify-items:center;
}
.landing-hero-copy{
  display:grid;
  gap:22px;
  max-width:760px;
  text-align:center;
}
.landing-eyebrow{
  font-family:var(--font-heading);
  letter-spacing:0.3em;
  text-transform:uppercase;
  font-size:0.76rem;
  color:var(--accent);
}
.landing-hero h1{
  font-family:var(--font-heading);
  font-size:clamp(3rem, 6vw, 4rem);
  line-height:1.05;
  margin:0;
  letter-spacing:0.08em;
}
.landing-lead{
  font-size:1.05rem;
  color:var(--muted);
  margin:0;
}
.landing-hero .landing-cta{
  justify-content:center;
}
.landing-cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.landing-cta .btn-link{
  align-self:center;
}
.landing-stats{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:18px;
  margin:0;
  justify-items:center;
  text-align:center;
}
.landing-stats div{
  padding:18px 20px;
  border-radius:var(--radius-md);
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(10,12,16,0.72);
  backdrop-filter:blur(12px);
}
.landing-stats dt{
  font-family:var(--font-heading);
  font-size:clamp(1.2rem, 2.6vw, 1.8rem);
  letter-spacing:0.24em;
  color:var(--accent);
  margin-bottom:8px;
}
.landing-stats dd{
  margin:0;
  font-size:0.82rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted-strong);
}

.landing-status-card{
  align-self:start;
  display:grid;
  gap:18px;
  padding:28px 30px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(6,7,10,0.82);
  box-shadow:0 28px 60px rgba(0,0,0,0.55);
}
.landing-status-card h2{
  margin:0;
  font-size:1.2rem;
  letter-spacing:0.18em;
}
.landing-status-card ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.landing-status-card li{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  font-size:0.9rem;
  letter-spacing:0.06em;
  color:var(--muted);
}
.landing-status-card li span{
  text-transform:uppercase;
}
.landing-status-card li strong{
  font-family:var(--font-heading);
  letter-spacing:0.16em;
  color:var(--text);
  font-size:0.82rem;
}
.landing-status-card p{
  margin:0;
  color:var(--muted);
  font-size:0.85rem;
  line-height:1.6;
}

.landing-pillars{
  padding:0 0 clamp(60px, 12vw, 100px);
}
.landing-section-head{
  max-width:720px;
  display:grid;
  gap:14px;
  margin-bottom:40px;
}
.landing-section-head h2{
  font-size:clamp(2.2rem, 4vw, 3rem);
  line-height:1.08;
  letter-spacing:0.12em;
  margin:0;
}
.landing-pillars-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:22px;
}
.landing-pillar{
  padding:24px 26px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.1);
  background:rgba(8,10,16,0.78);
  box-shadow:0 20px 45px rgba(0,0,0,0.5);
  display:grid;
  gap:12px;
}
.landing-pillar h3{
  margin:0;
  font-family:var(--font-heading);
  letter-spacing:0.2em;
  text-transform:uppercase;
  font-size:1rem;
}
.landing-pillar p{
  margin:0;
  color:var(--muted);
  font-size:0.95rem;
  line-height:1.6;
}

.landing-preview{
  position:relative;
  padding:clamp(60px, 12vw, 100px) 0;
  background:rgba(10,12,16,0.92);
  border-block:1px solid rgba(255,255,255,0.06);
}
.landing-preview-grid{
  display:grid;
  grid-template-columns:minmax(0,0.95fr) minmax(0,1.05fr);
  gap:clamp(28px, 6vw, 56px);
  align-items:center;
}
.landing-preview-media img{
  width:100%;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 30px 70px rgba(0,0,0,0.6);
  object-fit:cover;
}
.landing-preview-copy{
  display:grid;
  gap:18px;
}
.landing-preview h2{
  margin:0;
  font-size:clamp(2rem, 3.6vw, 2.8rem);
  letter-spacing:0.14em;
}
.landing-checklist{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.landing-checklist li{
  position:relative;
  padding-left:26px;
  font-size:0.95rem;
  color:var(--muted);
  line-height:1.6;
}
.landing-checklist li::before{
  content:"";
  position:absolute;
  left:0;
  top:0.55em;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 10px rgba(255,107,0,0.4);
}
.landing-preview-cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

.landing-map{
  padding-bottom:clamp(80px, 12vw, 120px);
}
.landing-map-grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr);
  gap:clamp(28px, 5vw, 48px);
  align-items:center;
}
.landing-map-embed{
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 26px 60px rgba(0,0,0,0.55);
}
.landing-map-embed iframe{
  display:block;
  width:100%;
  border:0;
}
.landing-map-copy{
  display:grid;
  gap:18px;
}
.landing-map-copy h2{
  margin:0;
  font-size:clamp(2rem, 3.4vw, 2.6rem);
  letter-spacing:0.14em;
}
.landing-map-actions{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
}
.landing-map-actions .btn{
  justify-content:center;
}
.landing-contact{
  display:grid;
  gap:8px;
  font-size:0.95rem;
  color:var(--muted);
}
.landing-contact a{
  color:var(--accent);
}

.landing-footer{
  border-top:1px solid rgba(255,255,255,0.08);
  background:rgba(6,7,10,0.96);
  padding:clamp(26px, 6vw, 48px) 0;
}
.landing-footer-inner{
  display:grid;
  gap:24px;
  grid-template-columns:repeat(3, minmax(0,1fr));
  align-items:start;
}
.landing-footer .brand-logo{
  max-height:32px;
  width:auto;
  margin-bottom:12px;
}
.landing-footer-inner p{
  color:var(--muted);
  font-size:0.9rem;
  line-height:1.6;
  margin:0;
}
.landing-footer-links{
  display:grid;
  gap:10px;
  justify-content:start;
}
.landing-footer-links a{
  color:var(--muted-strong);
  font-size:0.85rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
}
.landing-footer-cta{
  display:grid;
  gap:12px;
  justify-items:flex-end;
}
.landing-footer-cta small{
  color:var(--muted-strong);
}

body[data-tm-mode="track"]{
  --ambient-rgb:255 70 40;
  --ambient-brightness:0.68;
  background:
    radial-gradient(1200px 600px at 80% -12%, rgba(255,60,0,0.22), transparent 65%),
    repeating-conic-gradient(from 18deg at 18% 82%, rgba(255,60,0,0.12) 0deg 24deg, transparent 24deg 48deg),
    repeating-linear-gradient(135deg, rgba(255,50,0,0.08) 0 42px, transparent 42px 96px),
    linear-gradient(180deg, #0b0b0c 0%, #090a10 60%, #050609 100%);
}

/* === Comfort mode: make accents white across the site === */
body[data-tm-mode="comfort"] {
  --accent: #ffffff;
  --accent-rgb: 255 255 255;
  --ambient-rgb:255 255 255;
  --ambient-brightness:0.5;
  background:
    radial-gradient(1150px 540px at 75% -12%, rgba(255,255,255,0.25), transparent 60%),
    repeating-linear-gradient(110deg, rgba(255,255,255,0.06) 0 28px, transparent 28px 82px),
    linear-gradient(180deg, #0e0f12 0%, #0b0c10 55%, #090a0d 100%);
}

/* Buttons & links that may not be fully var-driven */
body[data-tm-mode="comfort"] .btn.btn-primary {
  background: #ffffff;
  border-color: #ffffff;
  color: #111111;
}
body[data-tm-mode="comfort"] .btn.btn-outline {
  border-color: #ffffff;
  color: #ffffff;
}
body[data-tm-mode="comfort"] a:not(.btn):hover {
  color: #ffffff;
}

/* === Sport mode: red theme === */
body[data-tm-mode="sport"] {
  --accent: #ff0000;
  --accent-rgb: 255 0 0;
  --ambient-rgb:255 32 32;
  --ambient-brightness:0.62;
  background:
    radial-gradient(1100px 520px at 85% -15%, rgba(255,0,0,0.28), transparent 60%),
    repeating-linear-gradient(125deg, rgba(80,0,0,0.35) 0 22px, transparent 22px 72px),
    linear-gradient(180deg, #060507 0%, #0a0508 55%, #050305 100%);
}
body[data-tm-mode="sport"] .btn.btn-primary {
  background: #ff0000;
  border-color: #ff0000;
  color: #ffffff;
}
body[data-tm-mode="sport"] .btn.btn-outline {
  border-color: #ff0000;
  color: #ff0000;
}
body[data-tm-mode="sport"] a:not(.btn):hover {
  color: #ff0000;
}

/* === Electric mode: blue theme === */
body[data-tm-mode="electric"] {
  --accent: #00aaff;
  --accent-rgb: 0 170 255;
  --ambient-rgb:0 190 255;
  --ambient-brightness:0.72;
  background:
    radial-gradient(1200px 640px at 75% -15%, rgba(0,200,255,0.32), transparent 65%),
    repeating-linear-gradient(90deg, rgba(0,150,255,0.12) 0 2px, transparent 2px 60px),
    repeating-linear-gradient(0deg, rgba(0,220,255,0.08) 0 2px, transparent 2px 60px),
    conic-gradient(from 45deg at 20% 78%, rgba(0,255,255,0.08) 0deg 90deg, transparent 90deg 360deg),
    linear-gradient(180deg, #04050a 0%, #06101b 55%, #020308 100%);
}
body[data-tm-mode="electric"] .btn.btn-primary {
  background: #00aaff;
  border-color: #00aaff;
  color: #ffffff;
}
body[data-tm-mode="electric"] .btn.btn-outline {
  border-color: #00aaff;
  color: #00aaff;
}
body[data-tm-mode="electric"] a:not(.btn):hover {
  color: #00aaff;
}

/* Accent styles */
.section-title {
  position: relative;
  padding-bottom: 6px;
}

.section-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 48px;
  height: 3px;
  border-radius: 2px;
  background-color: var(--accent);
}

:focus-visible {
  outline-offset: 2px;
  outline: 3px solid var(--accent);
  outline-radius: 4px;
}

a {
  position: relative;
  color: var(--accent);
  text-decoration: none;
  transition: color 0.3s ease;
}

a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background-color: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

a:hover::after,
a:focus::after {
  transform: scaleX(1);
}

.faq summary::-webkit-details-marker {
  color: var(--accent);
}

.faq summary::marker {
  color: var(--accent);
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background: var(--bg-alt);
}

::-webkit-scrollbar-thumb {
  background-color: var(--accent);
  border-radius: 6px;
  border: 3px solid var(--bg-alt);
}

::selection {
  background-color: var(--accent);
  color: var(--bg);
}

/* ===== Client portal ===== */
.client-access{
  background:radial-gradient(120% 140% at 110% -20%, rgba(255,107,0,0.15), transparent), var(--bg);
}
.client-access-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:40px;
  align-items:stretch;
}
.client-access-copy .section-title{margin-bottom:18px;}
.client-access-list{
  list-style:none;
  padding:0;
  margin:0 0 18px;
  display:grid;
  gap:8px;
}
.client-access-list li{
  padding-left:20px;
  position:relative;
  color:var(--text-subtle);
}
.client-access-list li::before{
  content:"•";
  position:absolute;
  left:0;
  color:var(--accent);
}
.client-access-note{
  font-size:0.92rem;
  color:var(--muted);
}
.client-panel{
  background:rgba(10,12,18,0.9);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-lg);
  padding:28px;
  box-shadow:0 26px 48px rgba(0,0,0,0.55);
  display:flex;
  flex-direction:column;
  gap:20px;
}
.auth-tabs{
  display:flex;
  gap:12px;
  background:rgba(255,255,255,0.04);
  padding:6px;
  border-radius:999px;
}
.auth-tab{
  flex:1;
  border:none;
  background:transparent;
  color:rgba(255,255,255,0.6);
  text-transform:uppercase;
  letter-spacing:0.2em;
  font-size:0.6rem;
  padding:10px 0;
  border-radius:999px;
  cursor:pointer;
  transition:background var(--transition-base), color var(--transition-base);
}
.auth-tab.is-active{
  background:var(--accent);
  color:#050607;
  box-shadow:0 0 12px rgba(255,107,0,0.45);
}
.auth-panes{display:flex; flex-direction:column;}
.auth-form{
  display:none;
  flex-direction:column;
  gap:16px;
  animation:fadeIn 0.25s ease forwards;
}
.auth-form.is-active{display:flex;}
.auth-field label{
  font-size:0.76rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.65);
  margin-bottom:6px;
  display:block;
}
.auth-field input{
  width:100%;
  border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,0.15);
  background:rgba(255,255,255,0.04);
  color:var(--text);
  font-size:0.95rem;
  padding:12px;
  transition:border-color 0.2s ease, background 0.2s ease;
}
.auth-field input:focus{
  border-color:var(--accent);
  background:rgba(255,255,255,0.08);
  outline:none;
}
.auth-field-inline{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:12px;
}
.auth-submit{width:100%;}
.auth-divider{
  display:flex;
  align-items:center;
  gap:10px;
  margin:4px 0;
  color:rgba(255,255,255,0.55);
  font-size:0.65rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
}
.auth-divider span{
  flex:1;
  height:1px;
  background:rgba(255,255,255,0.18);
}
.auth-divider p{
  margin:0;
  font:inherit;
}
.auth-divider-compact{
  margin-top:2px;
}
.auth-social{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.auth-social-compact{
  gap:8px;
}
.auth-social-btn{
  width:100%;
}
.auth-message{
  min-height:1.4em;
  font-size:0.9rem;
  color:var(--muted);
}
.auth-message.is-success{color:var(--accent);}
.auth-message.is-error{color:#ff6b6b;}
.auth-profile{
  display:none;
  flex-direction:column;
  gap:12px;
  padding:18px;
  border-radius:var(--radius-md);
  border:1px dashed rgba(255,255,255,0.2);
  background:rgba(255,255,255,0.02);
}
.auth-profile[hidden]{display:none !important;}
.auth-profile:not([hidden]){display:flex;}
.auth-kicker{
  text-transform:uppercase;
  letter-spacing:0.3em;
  font-size:0.58rem;
  color:rgba(255,255,255,0.6);
  margin:0;
}
.auth-profile-name{margin:6px 0 0;}
.auth-profile-email{margin:0; color:var(--muted);}
.auth-profile-meta{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:12px;
  margin:0;
}
.auth-profile-meta dt{
  font-size:0.65rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.5);
}
.auth-profile-meta dd{
  margin:2px 0 0;
  font-weight:600;
  color:var(--text);
}
.auth-logout{align-self:flex-start;}

@media (max-width:720px){
  .client-panel{padding:20px;}
  .auth-field-inline{grid-template-columns:1fr;}
}

/* Portal page */
.portal-page{background:var(--bg); color:var(--text);}
.portal-layout{
  width:min(1100px, 92%);
  margin:40px auto 80px;
  display:flex;
  flex-direction:column;
  gap:32px;
}
.portal-hero{
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  background:radial-gradient(120% 160% at 80% -20%, rgba(255,107,0,0.25), transparent), rgba(10,12,18,0.92);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-lg);
  padding:32px;
  box-shadow:0 24px 60px rgba(0,0,0,0.55);
}
.portal-hero-copy{flex:1 1 320px;}
.portal-kicker{
  text-transform:uppercase;
  letter-spacing:0.3em;
  font-size:0.65rem;
  color:rgba(255,255,255,0.65);
  margin:0 0 8px;
}
.portal-lead{color:var(--text-subtle); margin:12px 0 0;}
.portal-hero-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:20px;}
.portal-hero-card{
  flex:1 1 280px;
  background:rgba(5,6,12,0.9);
  border-radius:var(--radius-md);
  padding:22px;
  border:1px solid rgba(255,255,255,0.1);
  display:grid;
  gap:14px;
}
.portal-label{
  text-transform:uppercase;
  letter-spacing:0.25em;
  font-size:0.58rem;
  color:rgba(255,255,255,0.55);
  margin:0 0 4px;
}
.portal-label.small{
  font-size:0.5rem;
  letter-spacing:0.3em;
}
.portal-progress{
  display:flex;
  align-items:center;
  gap:12px;
}
.portal-progress-bar{
  flex:1;
  height:6px;
  border-radius:999px;
  background:rgba(255,255,255,0.08);
  overflow:hidden;
}
.portal-progress-bar span{
  display:block;
  height:100%;
  background:var(--accent);
  border-radius:999px;
}
.portal-stats{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:20px;
}
.portal-stat-card{
  background:rgba(12,13,18,0.95);
  border-radius:var(--radius-md);
  padding:20px;
  border:1px solid rgba(255,255,255,0.08);
}
.portal-muted{
  color:var(--text-subtle);
  font-size:0.85rem;
  margin:8px 0 0;
}
.portal-contact{
  list-style:none;
  margin:12px 0 0;
  padding:0;
  display:grid;
  gap:6px;
}
.portal-contact li{
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:0.9rem;
}
.portal-columns{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:24px;
}
.portal-quad{
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:20px;
}
.portal-card{
  background:rgba(8,9,14,0.95);
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,0.08);
  padding:26px;
  box-shadow:0 20px 40px rgba(0,0,0,0.55);
  display:flex;
  flex-direction:column;
  gap:16px;
}
.portal-card header h2{margin:4px 0 0;}
.portal-form{display:flex; flex-direction:column; gap:14px;}
.portal-form-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:12px;
}
.portal-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:0.85rem;
  color:rgba(255,255,255,0.7);
}
.portal-form input,
.portal-form textarea{
  border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,0.15);
  background:rgba(255,255,255,0.05);
  padding:12px;
  color:var(--text);
  font-size:0.95rem;
}
.portal-inline-message{
  font-size:0.85rem;
  color:var(--muted);
  min-height:1.2em;
}
.portal-inline-message.is-success{color:var(--accent);}
.portal-inline-message.is-error{color:#ff6b6b;}
.portal-event-feed{
  list-style:none;
  padding:0;
  margin:12px 0 0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.portal-event-feed li{
  border:1px dashed rgba(255,255,255,0.12);
  border-radius:var(--radius-sm);
  padding:12px;
  font-size:0.9rem;
}
.portal-note-feed{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.table-controls {
  margin:20px 0 10px;
  display:flex;
  gap:12px;
  align-items:center;
  color:#fff;
}
.table-controls select{
  padding:8px 12px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.12);
  color:#fff;
  border-radius:6px;
}
.dev-table-wrapper{
  width:100%;
  overflow-x:auto;
  background:rgba(255,255,255,0.03);
  padding:20px;
  border-radius:12px;
  margin-top:10px;
}
.dev-table{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
  color:#e4e4e4;
}
.dev-table th,
.dev-table td{
  padding:12px;
  white-space:nowrap;
}
.dev-table th{
  background:rgba(255,255,255,0.07);
  font-weight:600;
}
.dev-table tr:nth-child(even) td{
  background:rgba(255,255,255,0.03);
}
.dev-table tr:hover td{
  background:rgba(255,255,255,0.06);
}
#user-list{
  overflow-x:auto;
}
#user-list table{
  width:100%;
  min-width:640px;
}
#user-list th,
#user-list td{
  white-space:nowrap;
}
.collapsible-card{
  position:relative;
}
.collapsible-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.collapsible-toggle{
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.04);
  color:var(--text);
  border-radius:50%;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.collapsible-card .chevron{
  transition:transform 0.2s ease;
}
.collapsible-card.is-collapsed .chevron{
  transform:rotate(-90deg);
}
.collapsible-body{
  margin-top:6px;
}
.collapsible-card.is-collapsed .collapsible-body{
  display:none;
}
.portal-resource-accordion{
  display:grid;
  gap:10px;
}
.portal-resource-accordion details{
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,0.02);
  padding:10px 12px;
}
.portal-resource-accordion summary{
  cursor:pointer;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.portal-resource-accordion summary::-webkit-details-marker{display:none;}
.portal-resource-accordion ul{
  list-style:none;
  margin:10px 0 0;
  padding:0;
  display:grid;
  gap:6px;
}
.portal-resource-accordion .resource-groups{
  gap:12px;
}
.portal-resource-accordion .resource-groups > li{
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--radius-sm);
  padding:10px;
  background:rgba(255,255,255,0.03);
}
.portal-resource-accordion .resource-groups strong{
  display:block;
  margin-bottom:6px;
  letter-spacing:0.05em;
  text-transform:uppercase;
  font-size:0.78rem;
}
.portal-resource-accordion .resource-groups ul{
  margin:0;
  gap:4px;
}
.portal-resource-accordion a{
  color:var(--accent);
  word-break:break-all;
}
.portal-note{
  border-left:3px solid var(--accent);
  padding:10px 14px;
  background:rgba(255,255,255,0.04);
  border-radius:var(--radius-sm);
  font-size:0.9rem;
}
.admin-note-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.admin-note-form textarea{
  width:100%;
  border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,0.15);
  background:rgba(255,255,255,0.05);
  color:var(--text);
  padding:10px;
  min-height:110px;
  resize:vertical;
}
.admin-note-meta{
  font-size:0.8rem;
  color:var(--muted);
}
.portal-doc-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.portal-doc-list li{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  padding:12px;
  background:rgba(255,255,255,0.02);
  border-radius:var(--radius-sm);
}
.portal-doc-list strong{display:block;}
.portal-doc-list span{
  font-size:0.8rem;
  color:var(--muted);
}
.portal-doc-list .btn-link{font-size:0.8rem;}

@media (max-width:720px){
  .portal-hero{
    flex-direction:column;
    padding:24px;
  }
  .portal-quad{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }
  .portal-card{
    padding:20px;
  }
}

.portal-ceo{
  border:1px solid rgba(255,255,255,0.1);
  border-radius:var(--radius-lg);
  padding:28px;
  background:rgba(4,5,8,0.95);
  box-shadow:0 20px 50px rgba(0,0,0,0.55);
  display:flex;
  flex-direction:column;
  gap:20px;
}
.portal-ceo-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:18px;
}
.portal-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.portal-list li{
  padding:10px 12px;
  border-radius:var(--radius-sm);
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.05);
}
.portal-list strong{
  display:block;
  margin-bottom:3px;
}
.dev-portal .portal-hero{
  background:radial-gradient(120% 180% at 70% -30%, rgba(0,190,255,0.15), transparent), rgba(5,7,12,0.9);
}
.ceo-portal .portal-hero{
  background:radial-gradient(120% 180% at 20% -20%, rgba(255,160,0,0.18), transparent), rgba(8,6,4,0.9);
}
.calendar-embed iframe{
  width:100%;
  min-height:320px;
}
.portal-scratchpad{
  width:100%;
  border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,0.2);
  background:rgba(255,255,255,0.05);
  color:var(--text);
  padding:12px;
  resize:vertical;
}

/* =============================
   Mobile consolidation
   Keep phone layouts concise, single-column, and free of horizontal spill.
   ============================= */
@media (max-width: 720px){
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }

  .container{
    width:min(100% - 32px, 1120px);
  }

  .section{
    padding:46px 0;
  }

  .section-banner{
    margin-bottom:22px;
  }

  .section-title,
  .landing-section-head h2,
  .landing-preview h2,
  .landing-map-copy h2,
  .gallery-hero-inner h1{
    font-size:clamp(1.85rem, 8.5vw, 2.35rem);
    line-height:1.12;
    letter-spacing:0.08em;
  }

  .section-lead,
  .landing-lead,
  .hero-lead,
  .gallery-hero-inner p{
    font-size:0.95rem;
    line-height:1.55;
  }

  .section-eyebrow,
  .hero-eyebrow,
  .landing-eyebrow,
  .gallery-hero-inner .hero-eyebrow{
    font-size:0.68rem;
    letter-spacing:0.18em;
  }

  .hero,
  .landing-hero{
    padding:42px 0 36px;
  }

  .hero-inner,
  .mclaren-grid,
  .about-grid,
  .facilities-grid,
  .landing-preview-grid,
  .landing-map-grid,
  .landing-footer-inner,
  .enquiry-columns,
  .footer-grid,
  .client-access-grid,
  .portal-columns,
  .portal-ceo-grid{
    grid-template-columns:1fr !important;
  }

  .landing-hero-copy,
  .hero-copy{
    gap:14px;
  }

  .hero h1,
  .landing-hero h1{
    font-size:clamp(1.9rem, 8.3vw, 2.45rem);
    line-height:1.12;
    letter-spacing:0.06em;
    margin-bottom:10px;
  }

  .landing-hero h1{
    margin-bottom:0;
  }

  .hero-cta,
  .landing-cta,
  .landing-preview-cta{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    align-items:stretch;
  }

  .hero-cta .btn,
  .landing-cta .btn,
  .landing-preview-cta .btn,
  .landing-map-actions .btn{
    width:100%;
    justify-content:center;
  }

  .hero-cta .btn-link,
  .landing-cta .btn-link{
    display:none;
  }

  .hero-metrics,
  .landing-stats,
  .stat-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
    margin-top:10px;
  }

  .hero-metrics div:nth-child(n+3),
  .landing-stats div:nth-child(n+3),
  .stat-grid .stat-card:nth-child(n+3){
    display:none;
  }

  .hero-metrics div,
  .landing-stats div,
  .stat-card{
    padding:12px;
    border-radius:12px;
  }

  .hero-metrics dt,
  .landing-stats dt,
  .stat-value{
    font-size:1rem;
    letter-spacing:0.12em;
  }

  .hero-metrics dd,
  .landing-stats dd,
  .stat-card p{
    font-size:0.66rem;
    letter-spacing:0.05em;
    line-height:1.35;
  }

  .landing-pillars,
  .landing-preview,
  .landing-map{
    padding:46px 0;
  }

  .landing-section-head{
    margin-bottom:20px;
    gap:10px;
  }

  .landing-pillars-grid,
  .gallery-grid,
  .simple-gallery-grid,
  .insights-grid,
  .testimonial-grid{
    grid-template-columns:1fr !important;
    gap:14px;
  }

  .landing-pillar,
  .booking-card,
  .client-panel,
  .portal-card{
    padding:16px;
    border-radius:14px;
  }

  .landing-preview-media img{
    max-height:260px;
    object-fit:cover;
  }

  .landing-checklist{
    gap:8px;
  }

  .landing-checklist li,
  .ticks li,
  .booking-list li{
    font-size:0.9rem;
    line-height:1.5;
  }

  .landing-map-embed iframe,
  .about-card .map-embed iframe{
    height:260px;
  }

  .landing-map-actions{
    grid-template-columns:1fr;
  }

  .landing-footer-cta,
  .landing-footer-links{
    justify-items:start;
  }

  .review-strip-inner{
    width:100%;
    gap:8px;
  }

  .review-item{
    min-width:0;
    gap:6px;
    justify-content:center;
  }

  .review-logo-full{
    max-width:88px;
    overflow:hidden;
  }

  .review-score{
    white-space:nowrap;
  }

  .review-carousel{
    overflow:visible;
  }

  .review-track{
    display:grid;
    grid-template-columns:1fr;
    max-width:100%;
    overflow:visible;
    padding-bottom:6px;
  }

  .review-card{
    width:100%;
    min-width:0;
    flex-basis:auto;
  }

  .about-card,
  .form{
    padding:16px;
  }

  .about-card .map-embed{
    width:100%;
    min-width:0;
  }

  .form-grid,
  .portal-form-grid{
    grid-template-columns:1fr;
    gap:12px;
  }

  .form-actions{
    align-items:stretch;
  }

  .form-actions .btn{
    width:100%;
    justify-content:center;
  }

  .gallery-hero{
    min-height:auto;
    padding:96px 0 64px;
  }

  .gallery-hero-inner{
    min-height:0;
    gap:14px;
  }

  .simple-gallery-thumb{
    min-height:210px;
  }
}

@media (max-width: 640px){
  .services-page main{
    padding-bottom:78px;
  }

  .services-banner{
    padding-top:42px;
  }

  .services-hero-head{
    margin-bottom:18px;
    gap:8px;
  }

  .services-hero-head h2{
    font-size:clamp(1.9rem, 9vw, 2.35rem);
    line-height:1.18;
    letter-spacing:0.08em;
  }

  .services-featured{
    grid-template-columns:1fr;
    gap:10px;
    margin-bottom:12px;
  }

  .services-featured .featured-card:nth-child(n+2){
    display:none;
  }

  .featured-card{
    min-height:0;
    padding:14px;
    gap:8px;
    border-radius:14px;
  }

  .featured-meta{
    font-size:0.62rem;
    letter-spacing:0.16em;
  }

  .featured-card h3{
    font-size:0.98rem;
    letter-spacing:0.08em;
    line-height:1.35;
  }

  .featured-card p{
    font-size:0.88rem;
    line-height:1.45;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  .featured-actions{
    margin-top:2px;
  }

  .service-accordion{
    grid-template-columns:1fr;
    gap:10px;
  }

  .service-accordion summary{
    padding:12px;
    gap:10px;
    letter-spacing:0.08em;
    font-size:0.82rem;
  }

  .summary-thumb,
  .service-accordion-media{
    display:none;
  }

  .service-mini-grid{
    grid-template-columns:1fr;
    gap:8px;
    padding:0 8px 8px;
  }

  .service-mini-card{
    min-height:0;
    padding:10px;
    gap:6px;
  }

  .service-mini-card h3{
    font-size:0.95rem;
    letter-spacing:0.06em;
  }

  .service-mini-card p{
    font-size:0.84rem;
    line-height:1.42;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  .book-service-fab{
    display:none !important;
  }

  .service-selection-dock{
    width:100%;
    max-width:none;
    padding:6px 10px calc(6px + env(safe-area-inset-bottom));
  }

  .dock-toggle{
    justify-self:center;
    width:min(100%, 330px);
    padding:8px 12px;
    font-size:0.68rem;
    letter-spacing:0.06em;
  }
}

@media (max-width: 420px){
  .container{
    width:min(100% - 28px, 1120px);
  }

  .section{
    padding:40px 0;
  }

  .hero,
  .landing-hero{
    padding:46px 0 38px;
  }

  .hero h1,
  .landing-hero h1{
    font-size:clamp(1.85rem, 9.8vw, 2.35rem);
  }

  .hero-lead,
  .landing-lead{
    font-size:0.92rem;
  }

  .landing-stats,
  .hero-metrics{
    grid-template-columns:1fr 1fr;
  }

  .btn:not(.btn-icon){
    min-height:42px;
    padding:10px 14px;
  }

  .portal-quad{
    grid-template-columns:1fr;
  }
}

/* =============================
   Phone simplification pass
   Reduce repeated detail and keep each mobile section focused.
   ============================= */
@media (max-width: 640px){
  .hero,
  .landing-hero{
    padding:34px 0 34px;
  }

  .section{
    padding:34px 0;
  }

  .hero h1,
  .landing-hero h1,
  .section-title,
  .landing-section-head h2,
  .landing-preview h2,
  .landing-map-copy h2,
  .gallery-hero-inner h1{
    font-size:clamp(1.75rem, 8.8vw, 2.18rem);
    line-height:1.1;
  }

  .hero-lead,
  .landing-lead,
  .section-lead,
  .gallery-hero-inner p,
  .landing-preview-copy p,
  .landing-map-copy p,
  .facilities-copy p,
  .mclaren-copy p,
  .about-story .section-banner p{
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  .hero-cta .btn-outline,
  .landing-cta .btn-outline,
  .landing-preview-cta .btn-outline,
  .mclaren-cta .btn-outline,
  .gallery-hero .hero-cta .btn-outline{
    display:none;
  }

  .hero-metrics,
  .landing-stats{
    margin-top:8px;
  }

  .review-strip{
    min-height:38px;
  }

  .review-strip-inner{
    padding:7px 14px;
  }

  .review-stars{
    display:none;
  }

  .landing-pillars,
  .landing-preview,
  .landing-map{
    padding:34px 0;
  }

  .landing-pillars-grid .landing-pillar:nth-child(n+3),
  .landing-checklist li:nth-child(n+4){
    display:none;
  }

  .landing-preview-media img{
    max-height:190px;
  }

  .landing-map-actions .btn:nth-child(n+2),
  .map-actions .btn:nth-child(n+2){
    display:none;
  }

  .landing-map-embed iframe,
  .about-card .map-embed iframe{
    height:210px;
  }

  .services-featured{
    display:none;
  }

  .services-banner{
    padding-top:34px;
  }

  .services-hero-head{
    margin-bottom:14px;
  }

  .services-hero-head h2{
    font-size:clamp(1.72rem, 8.7vw, 2.14rem);
  }

  .service-accordion{
    gap:8px;
  }

  .service-accordion summary{
    min-height:48px;
    padding:10px 12px;
    font-size:0.76rem;
    letter-spacing:0.06em;
  }

  .facilities-copy .ticks li:nth-child(n+3),
  .mclaren-copy .ticks li:nth-child(n+3),
  .about-story .ticks li:nth-child(n+3),
  .client-access-list li:nth-child(n+2){
    display:none;
  }

  .facilities-gallery{
    display:block;
  }

  .facilities-gallery img{
    max-height:220px;
  }

  .facilities-gallery img:nth-child(n+2),
  .mclaren-proof .case-study,
  .about-highlights,
  .client-access-note,
  .enquiry-aside{
    display:none;
  }

  .stat-grid{
    margin-bottom:0;
  }

  .about-card{
    gap:14px;
  }

  .about-contact p:first-of-type{
    display:none;
  }

  .gallery-grid{
    gap:12px;
  }

  .gallery-grid figure:nth-child(2),
  .gallery-grid figure:nth-child(3){
    display:none;
  }

  .gallery-grid figcaption{
    padding:12px;
  }

  .gallery-grid .gallery-link .btn{
    position:static;
    width:calc(100% - 24px);
    margin:0 12px 12px;
    justify-content:center;
  }

  .simple-gallery-grid{
    gap:12px;
  }

  .simple-gallery-card:nth-child(n+7){
    display:none;
  }

  .simple-gallery-thumb{
    min-height:170px;
  }

  .gallery-intro{
    margin-bottom:16px;
  }

  .gallery-hero{
    padding:86px 0 54px;
  }

  .gallery-cta{
    gap:14px;
  }

  .footer-grid,
  .landing-footer-inner{
    gap:18px;
  }
}