/* === GateFive brand system (BMW M blue + Jäger orange + graphite) === */
:root{
  --gf-graphite-900:#1D2024; --gf-graphite-800:#22262B; --gf-graphite-700:#2B3036;
  --gf-orange:#FF6A00; --gf-orange-700:#E35800; --gf-orange-300:#FFC199;
  --gf-blue:#1261A0; --gf-blue-700:#0E4E82; --gf-blue-300:#79B3E6;
  --gf-text:#fff; --gf-text-subtle:#C9D1D9; --gf-border:rgba(255,255,255,.08);
}
body{background:var(--gf-graphite-900);color:var(--gf-text);}
/* Header */
.sitebar{position:sticky;top:0;z-index:10;background:rgba(29,32,36,.86);backdrop-filter:saturate(120%) blur(6px);}
.sitebar::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;background:linear-gradient(90deg,var(--gf-orange),var(--gf-blue));}

/* Panels & sections */
.section-panel{background:var(--gf-graphite-800);border:1px solid var(--gf-border);border-radius:16px;padding:18px;position:relative;box-shadow:0 10px 24px rgba(0,0,0,.22);}
.section-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--gf-orange),var(--gf-blue));border-top-left-radius:16px;border-top-right-radius:16px;opacity:.9;}
.section{margin-block:16px 20px;}@media(min-width:900px){.section{margin-block:20px 28px;}}
.section h2,.section h3{margin-block:6px 10px;}
.section-services.section-panel{padding-bottom:12px;}
.services-cta{display:flex;justify-content:center;margin:10px 0 6px;}

/* Services cards */
.service-carousel .card,.service-accordion .card{background:var(--gf-graphite-800);border:2px solid rgba(255,106,0,.55);border-radius:14px;box-shadow:0 4px 14px rgba(0,0,0,.25);}
.service-carousel .card:hover{border-color:var(--gf-orange)}
.service-carousel .card .card-title,.service-accordion .card .card-title{border-left:6px solid var(--gf-blue);padding-left:.66rem;color:#fff;}
.service-carousel .card p,.service-accordion .card p{color:var(--gf-text-subtle);}
.service-carousel{position:relative;}
.service-carousel::after{content:"";position:absolute;top:0;right:0;bottom:0;width:88px;pointer-events:none;background:linear-gradient(90deg, rgba(18,19,22,0) 0%, rgba(18,19,22,.9) 60%, rgba(18,19,22,1) 100%);}
.service-carousel::before{content:"›";position:absolute;right:18px;top:50%;transform:translateY(-50%);color:var(--gf-orange);font-size:32px;line-height:1;opacity:.9;}
.service-carousel .card{min-width:280px;}@media(min-width:960px){.service-carousel .card{min-width:320px;}}

/* Header CTA hotfix */
.sitebar .btn.ghost{background:#fff;color:#0B0D10;border:1px solid rgba(0,0,0,.12);box-shadow:0 4px 10px rgba(0,0,0,.06);}
.sitebar .btn.ghost:hover{background:#F3F6FA;color:#000;}
.sitebar .btn.primary{background:#FF6A00;color:#101214;border:none;}
.sitebar .btn.primary:hover{background:#E35800;}
@media(max-width:600px){.sitebar .cta{gap:10px}.sitebar .btn{padding:.44rem .66rem;font-size:.92rem;border-radius:10px}}
@media(max-width:420px){.sitebar .cta{gap:8px}.sitebar .btn{padding:.38rem .58rem;font-size:.86rem;white-space:nowrap;max-width:45vw;text-overflow:ellipsis;overflow:hidden}}
.sitebar .btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--gf-blue-300), 0 0 0 6px rgba(255,106,0,.35);border-radius:10px}

/* Gallery edge-to-edge thumbs */
.facility-thumbs{gap:14px;padding:12px 8px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.facility-thumbs::-webkit-scrollbar{height:0;width:0}
.facility-thumbs .thumb{flex:0 0 auto;width:150px;height:96px;display:block;border:0;padding:0;margin:0;background:transparent;border-radius:10px;overflow:hidden;scroll-snap-align:start;cursor:pointer;}
@media(min-width:1024px){.facility-thumbs .thumb{width:180px;height:112px}}
.facility-thumbs .thumb img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}
.facility-thumbs .thumb[aria-current="true"]{outline:3px solid var(--gf-orange);outline-offset:2px}
.facility-thumbs .thumb:focus-visible{outline:3px solid var(--gf-blue);outline-offset:2px}

:root{ --graphite:#1f2326; --orange:#ff6a00; --ink:#111; --mblue:#1b5cff; --line:rgba(229,220,207,.3) }
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--graphite);color:#e9e9e9;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;-webkit-text-size-adjust:100%}
a{text-decoration:none;color:inherit}
.wrap{max-width:1100px;margin:0 auto;padding: clamp(10px,2vw,18px)}
h1,h2,h3{line-height:1.2;margin:0 0 .5rem}
h1{font-size:clamp(1.6rem,3.6vw,2.2rem)}
h2{font-size:clamp(1.2rem,2.6vw,1.6rem)}
h3{font-size:clamp(1.05rem,2vw,1.25rem)}

/* Header */
.sitebar{position:sticky;top:0;z-index:10;background:rgba(31,35,38,.9);backdrop-filter:saturate(120%) blur(6px);border-bottom:2px solid var(--orange)}
.nav{display:flex;gap:.75rem;align-items:center;justify-content:space-between;padding-top:calc(env(safe-area-inset-top) + 0px)}
.brand img{height:clamp(72px,14vh,128px);width:auto;display:block;border-radius:4px;transition:height .18s ease}
.nav-right{display:flex;gap:.5rem;align-items:center}
.btn{border:1px solid transparent;border-radius:999px;padding:.65rem 1rem;font-weight:700;display:inline-block;cursor:pointer;min-height:44px}
.btn.primary{background:var(--orange);color:#111;border-color:var(--orange)}
.btn.ghost{background:#fff;color:#222;border-color:#cfc6b2}
.sitebar.scrolled .brand img{height:clamp(56px,10vh,80px)}

/* Focus states */
.btn:focus-visible, .foot-link:focus-visible, .faq-big:focus-visible, a:focus-visible{
  outline:3px solid #fff; outline-offset:3px; box-shadow:0 0 0 3px rgba(255,106,0,.65);
}

/* HERO */
.hero{position:relative;overflow:hidden;border-bottom:3px solid var(--orange)}
.hero-media{position:relative;aspect-ratio:16/9;background:#000}
.hero-media picture,.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,.55) 0%, rgba(0,0,0,.18) 40%, rgba(0,0,0,.04) 75%)}

/* Updates */
main .updates{padding: clamp(16px,3.5vw,24px)}
.notify{display:flex;gap:.6rem;flex-wrap:wrap}
.notify input{flex:1;min-width:220px;padding:.7rem .8rem;border:1px solid #cfc6b2;border-radius:10px;background:#fff;color:#111;min-height:44px}

/* Funding */
.funding{background:#171a1c;border:1px solid #333;border-radius:14px;padding:clamp(14px,2.2vw,18px); box-shadow: 0 1px 0 rgba(0,0,0,.3) inset; margin: 0 auto clamp(18px,3vw,24px); max-width: 980px}
.funding h3{margin:0 0 .4rem;}
.funding .small{opacity:.9; font-size:.95rem}

/* Services */
.services{background:#13171a;border:1px solid #2a2f33;border-radius:14px;padding:clamp(14px,2.2vw,18px); margin: 0 auto clamp(18px,3vw,24px); max-width: 980px}
.s-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.s-item{background:#0f1214;border:1px solid #2a2f33;border-radius:10px;padding:.65rem .8rem}
.s-item h4{margin:0 0 .3rem;font-size:1rem;color:#fff}
.s-item p{margin:0;color:#cfcfcf;font-size:.95rem}
@media (max-width:720px){ .s-grid{grid-template-columns:1fr} }

/* Facility */
.facility{background:#111416;border:1px solid #2a2f33;border-radius:14px;padding:clamp(14px,2.2vw,18px); margin: 0 auto clamp(18px,3vw,24px); max-width: 980px}
.facility .svgwrap{background:#0c0f11;border:1px dashed #384047;border-radius:12px;padding:8px}
.facility svg{width:100%;height:auto;display:block}

/* Footer */
.sitefoot{padding: clamp(16px,3vw,22px); display:flex; flex-direction:column; gap:.8rem; align-items:center; color:#cfcfcf}
.local{opacity:.9}
.footer-cta{font-weight:800; font-size:1.05rem; text-align:center}
.faq-big{display:inline-flex;align-items:center;gap:.5rem;border:2px solid var(--orange);color:#111;background:var(--orange);border-radius:999px;padding:.7rem 1rem;min-height:48px;font-weight:800}
.faq-big::before{content:"?";display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#fff;color:#111;font-weight:900}
.footer-links{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}
.socials{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}
.icon{width:24px;height:24px;display:inline-block;vertical-align:-4px;margin-right:.35rem}
.icon svg{width:24px;height:24px;display:block}
.foot-link{border:1px solid #cfc6b2;color:#222;background:#fff;border-radius:999px;padding:.55rem .85rem;display:inline-flex;align-items:center;min-height:44px}
.badge{display:inline-block;border:1px solid #cfc6b2;border-radius:999px;padding:.3rem .6rem;background:#fff;color:#222;font-weight:700}
.disclaimer{opacity:.7;font-size:.85rem;margin-top:.1rem;text-align:center}

/* Mobile tweaks */
@media (max-width:720px){
  .foot-link, .faq-big{width:100%;justify-content:center}
  .hero-media{aspect-ratio:10/16}
}
@media (prefers-reduced-motion:no-preference){
  .btn.primary,.faq-big{transition:transform .12s ease}
  .btn.primary:hover,.faq-big:hover{transform:translateY(-1px)}
}


/* Facility layout image block */
.facility .layout{margin: .6rem 0 0}
.facility .layout picture, .facility .layout img{width:100%;height:auto;display:block;border-radius:10px;border:1px solid #2a2f33;background:#0c0f11}
.facility .layout figcaption{font-size:.9rem;color:#cfcfcf;opacity:.9;margin-top:.35rem}


/* Hybrid renderer: carousel (desktop) vs accordion (mobile) */
.hybrid{position:relative}
.hybrid .carousel{display:none}
.hybrid .accordion{display:block}
@media (min-width: 721px){
  .hybrid .carousel{display:block}
  .hybrid .accordion{display:none}
}
.carousel{position:relative}
.carousel .track{
  display:flex; gap:.6rem; overflow-x:auto; padding-bottom:.4rem;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
}
.carousel .track:focus{outline:none}
.carousel .card{
  flex:0 0 auto; min-width:280px; max-width:320px;
  background:#0f1214; border:1px solid #2a2f33; border-radius:10px; padding:.75rem;
  scroll-snap-align:start;
}
.carousel .nav{
  position:absolute; top:50%; transform:translateY(-50%);
  border:1px solid #cfc6b2; background:#fff; color:#222; border-radius:999px;
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-weight:900;
}
.carousel .nav[aria-disabled="true"]{opacity:.55; cursor:not-allowed}
.carousel .nav.prev{left:-6px}
.carousel .nav.next{right:-6px}

/* Accordion */
.accordion details{
  border:1px solid #2a2f33; background:#0f1214; border-radius:10px; padding:.35rem .6rem; margin:.4rem 0;
}
.accordion summary{font-weight:700; cursor:pointer; outline:none}
.accordion p{margin:.35rem 0 0; color:#cfcfcf}


/* Carousel nav refinement */
.hybrid .carousel{position:relative}
.carousel .nav{
  z-index:3;
  top:50%;
  transform: translateY(-50%);
  width:48px;height:48px;
  border-radius:999px;
  background:#fff;
  color:#222;
  border:2px solid #cfc6b2;
  box-shadow:0 6px 16px rgba(0,0,0,.35);
}
.carousel .nav.prev{left:-22px}
.carousel .nav.next{right:-22px}
@media (max-width:980px){
  .carousel .nav.prev{left:-12px}
  .carousel .nav.next{right:-12px}
}
.carousel .nav:hover{filter:brightness(.96)}
.carousel .nav:active{transform:translateY(-50%) scale(.98)}
.carousel .track{scroll-behavior:smooth}
.carousel .card{min-width:300px}

/* Vision badge (exact copy) */
.vision-badge{
  position:absolute; left: clamp(10px,3vw,24px); top: clamp(10px,3vw,24px);
  max-width:min(46ch, 80vw);
  background:rgba(17,17,17,.68);
  border:1px solid rgba(207,198,178,.55);
  border-left:4px solid var(--orange);
  color:#f2f2f2; padding:.55rem .75rem; border-radius:10px;
  box-shadow:0 6px 24px rgba(0,0,0,.35);
  font-size:clamp(.92rem,1.9vw,1.05rem);
}
@media (max-width:520px){ .vision-badge{ font-size:.9rem; max-width:85vw; } }


/* Final arrow layout + padding to avoid overlap */
.hybrid .carousel{padding: 0 42px;}
.carousel .nav.prev{left:6px}
.carousel .nav.next{right:6px}


/* Facility gallery */
.facility .facility-thumbs{display:flex;gap:.5rem;margin:.5rem 0 0;overflow-x:auto;padding-bottom:.25rem}
.facility .facility-thumbs .thumb{background:#1a1f23;border:1px solid #2a2f33;border-radius:8px;padding:2px;cursor:pointer}
.facility .facility-thumbs img{display:block;width:110px;height:auto;border-radius:6px}
.facility .facility-thumbs .thumb:focus{outline:2px solid var(--orange)}


/* Facility gallery (multi-image) */
.facility .facility-thumbs{display:flex;gap:.5rem;margin:.5rem 0 0;overflow-x:auto;padding-bottom:.25rem}
.facility .facility-thumbs .thumb{background:#1a1f23;border:1px solid #2a2f33;border-radius:8px;padding:2px;cursor:pointer}
.facility .facility-thumbs img{display:block;width:110px;height:auto;border-radius:6px}
.facility .facility-thumbs .thumb:focus{outline:2px solid var(--orange)}


/* Facility gallery */
.facility .facility-thumbs{display:flex;gap:.5rem;margin:.5rem 0 0;overflow-x:auto;padding-bottom:.25rem}
.facility .facility-thumbs .thumb{background:#1a1f23;border:1px solid #2a2f33;border-radius:8px;padding:2px;cursor:pointer}
.facility .facility-thumbs .thumb[aria-current="true"]{outline:2px solid var(--orange)}
.facility .facility-thumbs img{display:block;width:110px;height:auto;border-radius:6px}

/* Carousel arrows: tuck outside and hide if no overflow */
.hybrid .carousel{padding:0 46px; position:relative}
.carousel .nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2}
.carousel .nav.prev{left:-6px}
.carousel .nav.next{right:-6px}
.carousel[data-overflow="false"] .nav{display:none}


/* vD overrides */
/* 1) Hide carousel arrows by default; JS adds [data-overflow="true"] to show */
.carousel .nav{display:none}
.carousel[data-overflow="true"] .nav{display:block}

/* 2) Make thumbs obviously interactive */
.facility .facility-thumbs .thumb{transition:transform .06s ease}
.facility .facility-thumbs .thumb:active{transform:scale(.98)}
.facility .facility-thumbs .thumb[aria-current="true"]{outline:2px solid var(--orange)}


/* Facility disclosure text */
.facility-disclosure{
  margin: .5rem 0 0;
  font-size: .9rem;
  color: var(--muted, #a8a8a8);
}
.facility-disclosure em{ font-style: italic; }


/* ---- vQ8f: Small-phone optimizations ---- */
@media (max-width: 380px){
  .section-panel{ padding: 12px; border-radius: 14px; }
  .section-panel::before{ height: 3px; border-top-left-radius: 14px; border-top-right-radius: 14px; }
  .section h2, .section h3{ margin-block: 4px 8px; }
  .sitebar .cta{ display:flex; flex-direction: column; align-items: stretch; gap: 8px; }
  .sitebar .btn{ width:100%; max-width:none; padding:.46rem .66rem; font-size:.90rem; border-radius:10px; }
  .service-carousel::after{ width: 52px; }
  .service-carousel::before{ right:12px; font-size: 26px; }
  .service-carousel .card{ min-width: 240px; }
  .facility-thumbs{ gap: 10px; padding: 10px 6px; }
  .facility-thumbs .thumb{ width: 42vw; height: 26vw; border-radius: 8px; }
  .facility-thumbs .thumb[aria-current="true"]{ outline-width: 2px; outline-offset: 2px; }
  .hero::after{ background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.58) 60%, rgba(0,0,0,.78) 100%); }
}
@media (max-width: 340px){
  .sitebar .btn{ padding:.42rem .6rem; font-size:.86rem; }
}


/* ---- vQ8h: Footer grid alignment & legal line ---- */
.sitefoot{ border-top:1px solid var(--gf-border); padding:16px 0 22px; }
.sitefoot .foot-wrap{
  display:grid; gap:16px; align-items:start;
  grid-template-columns: 1.2fr 1fr 1.2fr;
}
@media (max-width: 720px){
  .sitefoot .foot-wrap{ grid-template-columns: 1fr; text-align:center; }
  .sitefoot .brand, .sitefoot .share, .sitefoot .legal{ align-items:center; }
}
.footer-logo{ height: 36px; width:auto; display:block; margin-bottom:8px; }
.sitefoot .local{ color: var(--gf-text-subtle); font-size:.95rem; }

.sitefoot .footer-cta{ margin-bottom:8px; color:#fff; font-weight:600; }
.sitefoot .socials{ display:flex; flex-wrap:wrap; gap:10px 14px; }
.sitefoot .foot-link{ display:inline-flex; align-items:center; gap:8px; color:#E6ECF3; text-decoration:none; font-weight:600;}
.sitefoot .foot-link:hover{ color:#fff; text-decoration:underline; }

.sitefoot .footer-nav{ margin-bottom:6px; }
.sitefoot .legal-line{ color: var(--gf-text-subtle); display:block; margin-top:6px; }
.sitefoot .footer-meta{ color: var(--gf-text-subtle); display:block; margin-top:4px; font-size:.9rem; }


/* ---- vQ8i: Header compact + small-phone typography ---- */
/* Compact header base */
.sitebar .wrap.nav{ padding: 6px 10px; align-items: center; }
.sitebar .brand img{ height: 28px; width:auto; display:block; }

@media (max-width: 480px){
  .sitebar .brand img{ height: 24px; }
  .sitebar .btn{ padding:.42rem .6rem; font-size:.9rem; }
}
@media (max-width: 380px){
  .sitebar .brand img{ height: 22px; }
}

/* Global type scale on tiny phones */
@media (max-width: 380px){
  h1{ font-size: clamp(1.35rem, 5.3vw, 1.55rem); }
  h2{ font-size: clamp(1.15rem, 4.8vw, 1.35rem); }
  h3{ font-size: clamp(1.0rem, 4.4vw, 1.2rem); }
  p, li{ font-size: .98rem; }
  .section{ margin-block: 14px 18px; }
  .section-panel{ padding: 12px; }
}

/* Nav-right spacing (keeps CTAs tidy) */
.sitebar .nav-right{ display:flex; align-items:center; gap: 10px; }
@media (max-width: 380px){
  .sitebar .nav-right{ flex-direction: column; align-items: stretch; gap: 8px; }
  .sitebar .btn{ width: 100%; }
}


/* Footer tweaks after logo removal */
.sitefoot .brand{ display:flex; flex-direction:column; gap:6px; }
.sitefoot .local{ margin-top: 2px; }