/* ===============================
   Fort.Forge-iv.co — shared + home page styles
================================ */
@font-face{font-family:'DIN Pro';src:url('../fonts/DINPro-Light.ttf') format('truetype');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'DIN Pro';src:url('../fonts/DINPro.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'DIN Pro';src:url('../fonts/DINPro-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'DIN Pro';src:url('../fonts/DINPro-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'DIN Pro';src:url('../fonts/DINPro-Black.ttf') format('truetype');font-weight:900;font-style:normal;font-display:swap;}

:root{
  --red:#e2231a;
  --red-dark:#b81c14;
  --gold:#cf9b2e;
  --gold-light:#e8c874;
  --black:#1a1a1a;
  --grey-bg:#f4f4f4;
  --grey-text:#4d4d4d;
  --white:#ffffff;
  --maxw:1200px;
  --maxw-wide:1320px;
  --header-h:76px;
  --wide-max:1680px;
  --wide-pad:clamp(72px,6vw,110px);
}
*{margin:0;padding:0;box-sizing:border-box;font-family:'DIN Pro',Arial,Helvetica,sans-serif;}
html{scroll-behavior:smooth;}
html,body{overflow-x:hidden;overflow-x:clip;max-width:100%;}
body{color:var(--black);background:var(--white);width:100%;}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
[hidden]{display:none !important;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
section[id]{scroll-margin-top:var(--header-h);}

:focus-visible{outline:3px solid #1a73e8;outline-offset:2px;}

/* Accessibility helpers */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.skip-link{position:absolute;left:12px;top:-60px;background:var(--black);color:#fff;padding:10px 16px;border-radius:4px;z-index:500;}
.skip-link:focus{top:12px;}
.load-error{background:var(--red-dark);color:#fff;text-align:center;padding:10px 16px;font-size:.9rem;position:relative;z-index:400;}

/* ---------- CUSTOM SCROLLBAR ---------- */
html{scrollbar-width:thin;scrollbar-color:var(--red) var(--grey-bg);}
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:var(--grey-bg);}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--red),var(--red-dark));border-radius:10px;}
::-webkit-scrollbar-thumb:hover{background:var(--gold);}

.btn{
  display:inline-block;background:var(--red);color:#fff;font-weight:700;font-size:.75rem;letter-spacing:.5px;
  padding:10px 22px;border:none;border-radius:3px;cursor:pointer;
  transition:background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.btn:hover{background:var(--red-dark);transform:translateY(-2px);box-shadow:0 8px 16px rgba(0,0,0,.18);}

/* ---------- SCROLL REVEAL (only hidden when JS is running) ---------- */
.js .reveal{
  opacity:0;transform:translateY(28px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
}
.reveal.in-view{opacity:1;transform:translateY(0);}
.reveal-stagger > *{transition-delay:calc(var(--i, 0) * .08s);}
@media (prefers-reduced-motion: reduce){
  .js .reveal{opacity:1;transform:none;transition:none;}
  html{scroll-behavior:auto;}
}

/* ---------- JUSTIFIED BODY COPY (site-wide) ---------- */
.about-grid p, .loc-desc, .coe-desc, .advantage-section .intro, .advantage-card p,
.why-copy p, .techlabs-head p, .plans-copy p, .services-section .intro, .js-justify{
  text-align:justify;text-justify:inter-word;hyphens:manual;
}

/* phones: narrow columns + justify leave big gaps between words, so body copy is left-aligned there */
@media (max-width:600px){
  .about-grid p, .loc-desc, .coe-desc, .advantage-section .intro, .advantage-card p,
  .why-copy p, .techlabs-head p, .plans-copy p, .services-section .intro{text-align:left;}
}

/* ---------- HEADER ---------- */
/* Fixed header: transparent over the hero, turns solid white once the page scrolls
   (body[data-header="solid"] keeps it solid on pages without a full-screen hero) */
header{
  position:fixed;top:0;left:0;right:0;z-index:200;
  background:transparent;border-bottom:3px solid transparent;box-shadow:none;
  transition:background-color .35s ease, box-shadow .35s ease, border-color .35s ease;
}
header.scrolled, body[data-header="solid"] header, body.nav-open header{
  background:rgba(255,255,255,.98);border-bottom-color:var(--red);box-shadow:0 4px 18px rgba(0,0,0,.12);
}
body[data-header="solid"] main{padding-top:70px;}
/* transparent state: colour logos (Forge swaps to a white-tagline version via JS) + white links */
.logo-group img{transition:filter .35s ease, opacity .2s ease;}
header:not(.scrolled) .logo-group a + a{border-left-color:rgba(255,255,255,.4);}
header:not(.scrolled) .burger span{background:#fff;}
body.nav-open header .burger span, body[data-header="solid"] header .burger span{background:var(--black);}
@media (min-width:901px){
  body:not([data-header="solid"]) header:not(.scrolled) nav > ul > li > a{color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.35);}
  body:not([data-header="solid"]) header:not(.scrolled) nav > ul > li > a:hover{color:var(--gold-light);}
  body:not([data-header="solid"]) header:not(.scrolled) nav > ul > li > a.active::after{background:#fff;}
}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px 24px;max-width:var(--maxw-wide);margin:0 auto;min-height:64px;}
.logo-group{display:flex;align-items:center;gap:14px;flex-shrink:0;}
.logo-group a{display:block;line-height:0;}
.logo-group img{height:36px;width:auto;}
.logo-group a + a{padding-left:14px;border-left:1px solid #ddd;}
.logo-group a + a img{height:28px;}
.logo-group a:hover img{opacity:.85;}

nav > ul{display:flex;align-items:center;gap:clamp(18px,2.6vw,36px);font-size:.95rem;font-weight:600;color:#333;}
nav > ul > li{position:relative;}
nav > ul > li > a{position:relative;padding:10px 0;transition:color .25s, text-shadow .25s;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
nav > ul > li > a:hover, nav > ul > li > a.active{color:var(--red);}
nav > ul > li > a.active::after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:2px;background:var(--red);border-radius:2px;}
nav .caret{width:9px;height:9px;transition:transform .25s ease;}

.dropdown-menu{
  position:absolute;top:calc(100% + 14px);left:50%;transform:translate(-50%,10px);
  background:#fff;width:540px;max-width:calc(100vw - 32px);border-radius:12px;
  box-shadow:0 22px 46px rgba(0,0,0,.18);padding:14px;
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
  opacity:0;visibility:hidden;
  transition:opacity .22s ease, transform .22s ease, visibility .22s;z-index:50;
}
.dropdown-menu::before{
  content:"";position:absolute;top:-7px;left:50%;transform:translateX(-50%) rotate(45deg);
  width:14px;height:14px;background:#fff;box-shadow:-3px -3px 6px rgba(0,0,0,.04);
}
/* hover / keyboard focus open the menu on desktop */
@media (min-width:901px){
  /* invisible bridge so the menu doesn't close while the pointer crosses the gap */
  nav > ul > li.has-dropdown::after{content:"";position:absolute;left:-12px;right:-12px;top:100%;height:20px;}
  nav > ul > li.has-dropdown:hover .caret,
  nav > ul > li.has-dropdown:focus-within .caret{transform:rotate(180deg);}
  nav > ul > li.has-dropdown:hover .dropdown-menu,
  nav > ul > li.has-dropdown:focus-within .dropdown-menu{opacity:1;visibility:visible;transform:translate(-50%,0);}
  /* last menu opens towards the left so it never runs off the screen */
  nav > ul > li.has-dropdown:last-child .dropdown-menu{left:auto;right:-16px;transform:translate(0,10px);}
  nav > ul > li.has-dropdown:last-child:hover .dropdown-menu,
  nav > ul > li.has-dropdown:last-child:focus-within .dropdown-menu{transform:translate(0,0);}
  nav > ul > li.has-dropdown:last-child .dropdown-menu::before{left:auto;right:40px;transform:rotate(45deg);}
  /* collapsed after scrolling or picking an item, until the pointer leaves */
  nav > ul > li.has-dropdown.dd-closed .dropdown-menu{opacity:0;visibility:hidden;}
  nav > ul > li.has-dropdown.dd-closed .caret{transform:none;}
}
.dropdown-menu li{list-style:none;min-width:0;}
.dd-item{
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;height:100%;
  padding:14px 16px;border-radius:9px;min-height:60px;
  font-size:.9rem;line-height:1.3;color:#222;font-weight:700;text-align:left;
  background:var(--grey-bg);border:1px solid transparent;
  transition:background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.dd-more{display:inline-flex;gap:4px;font-size:.74rem;font-weight:500;color:var(--grey-text);transition:color .18s ease, gap .18s ease;}
a.dd-item:hover,a.dd-item:focus-visible{
  background:#fff;color:var(--red);border-color:var(--gold-light);
  transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,0,0,.08);
}
a.dd-item:hover .dd-more{color:var(--red);gap:7px;}
.dd-item.is-static{cursor:default;color:#444;}

.burger{
  display:none;flex-direction:column;gap:5px;cursor:pointer;
  background:none;border:0;padding:8px;
}
.burger span{width:26px;height:3px;background:var(--black);border-radius:2px;transition:transform .25s ease, opacity .25s ease;display:block;}
.burger.open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

/* ---------- HERO ---------- */
.hero{
  position:relative;min-height:640px;display:flex;align-items:center;overflow:hidden;
  color:#fff;width:100%;max-width:100%;
}
.hero-media{position:absolute;inset:0;z-index:0;}
.hero-media img,.hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero-media img.hero-poster{z-index:1;transition:opacity 1.1s ease;opacity:1;}
.hero-media video.hero-video{z-index:0;opacity:0;transition:opacity 1.1s ease;}
.hero-media video.hero-video.is-playing{opacity:1;}
.hero-media img.hero-poster.is-hidden{opacity:0;}

.hero-video-pattern{display:none;}
/* minimal dot-matrix screen over the video/poster (below the text) */
.hero-media::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background-image:radial-gradient(circle, rgba(0,0,0,0) 0 1.1px, rgba(0,0,0,.18) 1.6px);
  background-size:4px 4px;
}

.hero::before{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.25) 16%, rgba(0,0,0,0) 32%),
    radial-gradient(ellipse 65% 55% at 100% 0%, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 70%),
    linear-gradient(100deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.6) 35%, rgba(0,0,0,.42) 65%, rgba(0,0,0,.36) 100%);
}
.hero-media video.hero-video, .hero-media img.hero-poster{filter:brightness(.82) saturate(.95);}
.hero-content{
  position:relative;z-index:5;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  min-height:100vh;text-align:left;padding:90px clamp(20px,6vw,110px) 50px;width:100%;
}
.hero-partners{margin-bottom:32px;text-align:left;}
.hero-partners img{width:min(550px,85vw);height:auto;margin:0;}
.hero-brand{margin-bottom:26px;text-align:left;}
.hero-brand img{width:min(700px,88vw);height:auto;margin:0;}
.hero-text{max-width:1000px;text-align:left;}
.hero-text p{
  color:#fff;font-size:clamp(26px,2.6vw,52px);line-height:1.18;font-weight:700;
  text-shadow:0 4px 20px rgba(0,0,0,.45);text-align:left;
}

.hero-scroll{
  margin:32px 0 0;display:flex;flex-direction:column;align-items:center;align-self:center;width:fit-content;
  color:#fff;font-size:.9rem;font-weight:700;letter-spacing:2px;text-align:center;
  text-shadow:0 2px 10px rgba(0,0,0,.55);opacity:1;transition:opacity .5s ease, transform .4s ease;
}
.hero-scroll.is-hidden{opacity:0;pointer-events:none;}
.scroll-mouse{
  width:28px;height:48px;border:2px solid #fff;border-radius:30px;margin-top:12px;position:relative;
  box-shadow:0 2px 10px rgba(0,0,0,.4);
}
.scroll-mouse span{
  position:absolute;left:50%;top:8px;width:5px;height:10px;background:#fff;border-radius:20px;
  transform:translateX(-50%);animation:scrollWheel 1.8s infinite;
}
@keyframes scrollWheel{
  0%{opacity:0;transform:translate(-50%,0);}
  50%{opacity:1;}
  100%{opacity:0;transform:translate(-50%,16px);}
}
@media (prefers-reduced-motion: reduce){
  .hero-scroll{transition:none;}
  .scroll-mouse span{animation:none;opacity:1;}
}

/* ---------- FORT + PRIMER SECTION ---------- */
.about-section{background:var(--red);color:#fff;padding:70px 0;}
.about-grid{display:grid;grid-template-columns:46% 54%;gap:60px;align-items:start;}
.about-col{max-width:520px;}
.about-heading-row{display:flex;align-items:center;flex-wrap:wrap;column-gap:14px;row-gap:2px;margin-bottom:22px;}
.about-heading-row #aboutHeading{font-size:3.2rem;font-weight:800;line-height:1;letter-spacing:2px;}
.about-heading-row #aboutSubheading{font-size:.9rem;font-weight:500;letter-spacing:.5px;color:#fff;line-height:1.3;}
.about-grid p{
  font-size:.95rem;line-height:1.9;margin-bottom:14px;color:#fff;
  max-width:46ch;
}
.forge-logo-block{display:flex;align-items:center;gap:12px;margin-top:46px;}
.forge-logo-block img{height:156px;width:auto;padding:14px 20px;}

.primer-col{max-width:600px;}
#primerHeading{font-size:2.1rem;font-weight:800;letter-spacing:6px;margin-bottom:22px;}
.video-frame{border-radius:8px;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.3);}
.yt-embed-wrap{position:relative;width:100%;aspect-ratio:16/9;background:#0d0d0d;}
.yt-embed-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.yt-facade{
  position:absolute;inset:0;width:100%;height:100%;border:0;cursor:pointer;
  background-color:#0d0d0d;background-size:cover;background-position:center;
}
.yt-play{
  position:absolute;left:50%;top:50%;width:68px;height:48px;transform:translate(-50%,-50%);
  background:var(--red);border-radius:12px;transition:background .2s ease, transform .2s ease;
}
.yt-play::after{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-40%,-50%);
  border-style:solid;border-width:10px 0 10px 18px;border-color:transparent transparent transparent #fff;
}
.yt-facade:hover .yt-play{background:var(--red-dark);transform:translate(-50%,-50%) scale(1.06);}
.yt-embed-fallback{
  display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;
  background:#0d0d0d;color:var(--gold-light);font-weight:700;letter-spacing:.5px;
}

/* ---------- SECTIONS ---------- */
.section-pad{padding:80px 0;}
.section-title{color:var(--red);font-size:1.9rem;font-weight:800;margin-bottom:40px;}
#locations .container,
#coe .container{max-width:var(--maxw-wide);}

/* ---------- LOCATIONS CAROUSEL ---------- */
.locations-section{background:#fff;}
.loc-carousel{position:relative;}
.loc-viewport{overflow:hidden;touch-action:pan-y;cursor:grab;}
.loc-viewport.is-dragging{cursor:grabbing;user-select:none;-webkit-user-select:none;}
.loc-track{display:flex;transition:transform .6s cubic-bezier(.22,.61,.36,1);will-change:transform;}
.loc-slide{
  flex:0 0 100%;min-width:0;
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,5vw,96px);align-items:center;
  padding:24px 0 32px;
}
.loc-eyebrow{
  display:flex;align-items:center;gap:16px;
  color:var(--red);font-size:1.25rem;font-weight:700;margin-bottom:18px;
}
.loc-line{display:block;width:44px;height:2px;background:var(--red);}
.loc-title{font-size:clamp(2.3rem,4.6vw,3.5rem);font-weight:800;line-height:1.05;color:var(--red);margin-bottom:16px;letter-spacing:-.5px;}
.loc-tagline{font-size:1.3rem;line-height:1.45;color:#5b6472;margin-bottom:22px;max-width:30ch;}
.loc-desc{font-size:1rem;line-height:1.85;color:var(--grey-text);max-width:60ch;margin-bottom:30px;}
.loc-btn{
  display:inline-flex;align-items:center;gap:12px;
  background:var(--red);color:#fff;font-weight:700;font-size:.95rem;
  padding:15px 32px;border-radius:999px;
  transition:background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.loc-btn:hover{background:var(--red-dark);transform:translateY(-2px);box-shadow:0 10px 20px rgba(226,35,26,.3);}
.loc-btn svg{width:18px;height:18px;flex-shrink:0;}
.loc-btn .loc-btn-arrow{width:20px;height:20px;transition:transform .2s ease;}
.loc-btn:hover .loc-btn-arrow{transform:translateX(4px);}

/* flat, square map frame (no shadow / rounded corners) */
.loc-map-card{
  position:relative;height:clamp(360px,28vw,460px);overflow:hidden;background:#dcdcdc;
  border:1px solid #dedede;border-radius:0;box-shadow:none;
}
/* Location label drawn over Google's pin. The pin tip sits at the map centre;
   tweak --pin-x / --pin-y if Google ever shifts its marker. */
.map-pin-label{
  --pin-x:-26px;--pin-y:-47px;
  position:absolute;left:50%;top:50%;z-index:2;pointer-events:none;
  display:flex;align-items:flex-start;transform:translate(var(--pin-x),var(--pin-y));
}
.map-pin-label svg{
  position:relative;z-index:1;flex:0 0 52px;width:52px;height:52px;color:var(--red);
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.35));
}
.map-pin-text{
  display:flex;flex-direction:column;gap:2px;margin:0 0 0 -18px;padding:8px 16px 8px 24px;
  background:#fff;border-radius:8px;box-shadow:0 4px 14px rgba(0,0,0,.28);white-space:nowrap;line-height:1.2;
}
.map-pin-text strong{color:var(--red);font-size:.95rem;font-weight:800;}
.map-pin-text small{color:#666;font-size:.74rem;font-weight:500;}
.loc-map-card.is-active .map-pin-label{display:none;}
.loc-map-card iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none;}
.loc-map-card.is-active iframe{pointer-events:auto;}
/* map stays locked until clicked so swiping over it works */
.map-lock{
  position:absolute;inset:0;background:transparent;border:0;cursor:pointer;
  display:flex;align-items:flex-end;justify-content:center;padding:16px;
}
.map-lock span{
  background:rgba(26,26,26,.82);color:#fff;font-size:.78rem;font-weight:500;
  padding:7px 14px;border-radius:999px;opacity:0;transition:opacity .2s ease;
}
.loc-map-card:hover .map-lock span,
.map-lock:focus-visible span{opacity:1;}
.loc-map-card.is-active .map-lock{display:none;}
.map-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:var(--red);font-weight:700;}

.loc-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:4px;}
.loc-arrow{
  width:42px;height:42px;border-radius:50%;border:1.5px solid var(--red);background:#fff;color:var(--red);
  font-size:1.4rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .2s, color .2s;
}
.loc-arrow:hover{background:var(--red);color:#fff;}
.loc-dots{display:flex;gap:10px;align-items:center;}
.loc-dots button,
.carousel-dots button{
  position:relative;width:11px;height:11px;border-radius:50%;background:#ccc;border:0;padding:0;cursor:pointer;
  transition:background .2s, transform .2s;
}
.loc-dots button::before,
.carousel-dots button::before{content:"";position:absolute;inset:-9px;}
.loc-dots button.active,
.carousel-dots button.active{background:var(--red);transform:scale(1.25);}
.loc-progress{max-width:220px;height:3px;margin:18px auto 0;background:#e6e6e6;border-radius:3px;overflow:hidden;}
.loc-progress span{display:block;width:100%;height:100%;background:var(--red);transform:scaleX(0);transform-origin:left;}
.loc-hint{display:none;text-align:center;font-size:.8rem;color:var(--grey-text);margin-top:12px;}
@media (hover:none){.loc-hint{display:block;}}
@media (prefers-reduced-motion: reduce){.loc-track{transition:none;}}

/* ---------- CENTERS OF EXCELLENCE / CAROUSEL ---------- */
.coe-section{background:#fff;padding:80px 0 0;}
.coe-section .section-title{margin-bottom:32px;}
.wide-container{width:100%;max-width:var(--wide-max);margin:0 auto;padding:0 var(--wide-pad);}
/* full-bleed slide: name on the left, headline + copy + button on the right */
.coe-carousel{
  position:relative;overflow:hidden;width:100%;min-height:clamp(460px,36vw,580px);
  display:flex;align-items:center;background:#111;color:#fff;outline:none;
}
.coe-carousel:focus-visible{outline:3px solid var(--gold-light);outline-offset:-3px;}
.coe-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transform:scale(1.04);transition:opacity .6s ease, transform 7s ease;}
.coe-bg.fading{opacity:0;transform:scale(1);}
.coe-carousel::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(12,12,12,.84) 0%,rgba(12,12,12,.64) 45%,rgba(12,12,12,.58) 100%);
}
.coe-inner{
  position:relative;z-index:2;width:100%;max-width:var(--wide-max);margin:0 auto;
  padding:64px var(--wide-pad) 84px;
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,5vw,96px);align-items:center;
  transition:opacity .35s ease, transform .35s ease;
}
.coe-inner.fading{opacity:0;transform:translateY(10px);}
.coe-kicker{font-size:.78rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:12px;}
.coe-name{font-size:clamp(2.2rem,3.9vw,3.6rem);font-weight:900;line-height:1.02;text-transform:uppercase;letter-spacing:-.5px;color:#fff;}
.coe-name-accent{color:var(--red);}
.coe-headline{font-size:clamp(1.5rem,2.4vw,2.35rem);font-weight:800;line-height:1.14;text-transform:uppercase;margin-bottom:16px;}
.coe-desc{font-size:clamp(1rem,1.1vw,1.15rem);line-height:1.65;color:rgba(255,255,255,.9);margin-bottom:26px;max-width:64ch;}
.coe-btn{
  display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;font-weight:700;font-size:.98rem;
  padding:13px 28px;border-radius:999px;transition:background .2s ease, color .2s ease, transform .2s ease;
}
.coe-btn:hover{background:var(--gold-light);color:#1a1a1a;transform:translateY(-2px);}
.coe-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:52px;height:52px;border:0;background:none;color:#fff;cursor:pointer;opacity:.75;
  display:flex;align-items:center;justify-content:center;transition:opacity .2s ease, color .2s ease;
}
.coe-arrow svg{width:36px;height:36px;}
.coe-arrow:hover{opacity:1;color:var(--gold-light);}
.coe-arrow.left{left:clamp(8px,2.4vw,40px);}
.coe-arrow.right{right:clamp(8px,2.4vw,40px);}
.coe-controls{position:absolute;z-index:3;left:0;right:0;bottom:24px;display:flex;justify-content:center;align-items:center;}
.coe-controls .carousel-dots button{background:rgba(255,255,255,.45);}
.coe-controls .carousel-dots button.active{background:var(--red);}
/* sits next to the dots (keeps clear of the fixed "Made by" credit in the corner) */
.carousel-pause{
  position:static;margin-left:18px;
  width:32px;height:32px;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.14);color:#fff;display:flex;align-items:center;justify-content:center;transition:background .2s;
}
.carousel-pause svg{width:15px;height:15px;}
.carousel-pause:hover{background:var(--red);}
.carousel-dots{display:flex;justify-content:center;gap:12px;}
@media (prefers-reduced-motion: reduce){.coe-bg,.coe-inner{transition:none;}}

/* ---------- FORT ADVANTAGE ---------- */
.advantage-section{background:var(--red);color:#fff;padding:96px 0;}
.advantage-section .container{max-width:var(--wide-max);padding:0 var(--wide-pad);}
.advantage-section .section-title{color:#fff;margin-bottom:16px;font-size:2.3rem;}
.advantage-section .intro{font-size:1.02rem;color:#fff;max-width:none;line-height:1.8;margin-bottom:52px;}
.advantage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2vw,36px);}
.advantage-card{
  background:#fff;color:var(--black);padding:52px 34px;border-radius:14px;min-height:340px;
  display:flex;flex-direction:column;gap:22px;box-shadow:0 6px 18px rgba(0,0,0,.08);
  transition:transform .2s ease, box-shadow .2s ease;
}
.advantage-card:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(0,0,0,.12);}
.advantage-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;}
.advantage-icon img{width:100%;height:100%;object-fit:contain;}
.advantage-card h3{color:var(--red);font-size:1.3rem;font-weight:800;margin-top:4px;}
.advantage-card p{font-size:.95rem;line-height:1.75;color:var(--grey-text);}

/* ---------- CONTACT ---------- */
.contact-section{position:relative;padding:90px 0;color:#fff;overflow:hidden;}
.contact-section img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:brightness(.5);}
.contact-section::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg, rgba(180,20,15,.85), rgba(20,10,10,.55));z-index:1;}
.contact-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.contact-inner h2{font-size:2.2rem;font-weight:800;}
form.contact-form{background:transparent;display:flex;flex-direction:column;gap:14px;}
form.contact-form input, form.contact-form textarea{
  background:transparent;border:1.5px solid #fff;border-radius:3px;
  padding:12px 14px;color:#fff;font-size:.9rem;font-family:inherit;
  transition:border-color .2s ease, background .2s ease;
}
form.contact-form input:focus, form.contact-form textarea:focus{outline:none;border-color:var(--gold-light);background:rgba(255,255,255,.06);}
form.contact-form input:focus-visible, form.contact-form textarea:focus-visible{outline:3px solid #fff;outline-offset:2px;}
form.contact-form input::placeholder, form.contact-form textarea::placeholder{color:#f2dedd;}
form.contact-form textarea{min-height:110px;resize:vertical;}
form.contact-form button{
  background:#fff;color:var(--red);font-weight:800;border:none;
  padding:12px 0;border-radius:3px;cursor:pointer;font-size:.9rem;letter-spacing:.5px;
  transition:background .2s, color .2s;
}
form.contact-form button:hover{background:var(--gold-light);color:#1a1a1a;}
form.contact-form button:disabled{opacity:.6;cursor:progress;}
.form-status{font-size:.85rem;min-height:18px;color:#ffe9b0;}

/* ---------- FOOTER ---------- */
.site-footer{
  --office-cols:2;--office-cols-sm:2;
  position:relative;overflow:hidden;isolation:isolate;
  background:#efefef;color:#4a4a4a;padding:44px 0 24px;
}
.site-footer .container{max-width:var(--maxw-wide);position:relative;z-index:1;}

/* dotted FORT mark: faint, slow pulse (animation lives inside the SVG) */
.footer-art{
  position:absolute;z-index:0;pointer-events:none;user-select:none;
  right:-90px;top:28px;height:min(440px,82%);width:auto;max-width:none;
  opacity:.16;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 45%);mask-image:linear-gradient(90deg,transparent 0,#000 45%);
}
.site-footer.footer--swipe .footer-art{opacity:.1;}
.site-footer.footer--many .footer-art{opacity:.07;}

.footer-main{display:flex;align-items:stretch;}
.footer-brand{flex:0 0 clamp(250px,30%,400px);display:flex;align-items:center;justify-content:center;gap:clamp(18px,3vw,42px);padding:8px 24px 8px 0;}
.footer-brand a{display:block;line-height:0;}
.footer-brand img{height:50px;width:auto;max-width:100%;object-fit:contain;}
.footer-brand a:hover img,.footer-bottom-logos a:hover img{opacity:.85;}
.logo-sep{display:block;flex:0 0 1px;width:1px;height:52px;background:#c4c4c4;}

.footer-offices{flex:1 1 auto;min-width:0;display:grid;grid-template-columns:repeat(var(--office-cols),minmax(0,380px));}
.office{
  font-style:normal;min-width:0;
  padding:4px clamp(22px,3.4vw,58px);border-left:1px solid #c9c9c9;
}
.office-name{
  position:relative;display:flex;align-items:center;gap:16px;
  color:var(--red);font-size:1.3rem;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;
  padding-bottom:14px;margin-bottom:12px;
}
.office-name svg{width:24px;height:24px;flex-shrink:0;}
/* the two short red dashes under the heading */
.office-name::after{
  content:"";position:absolute;left:0;bottom:0;width:64px;height:2px;
  background:linear-gradient(90deg,var(--red) 0 24px,transparent 24px 40px,var(--red) 40px 64px);
}
.office-desc{font-size:.98rem;line-height:1.6;color:#555;margin-bottom:14px;max-width:34ch;}
.office-locate{
  display:inline-flex;align-items:center;gap:10px;
  background:#fbe1df;color:var(--red);font-weight:500;font-size:.98rem;
  padding:9px 20px;border-radius:10px;margin-bottom:20px;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.office-locate svg{width:17px;height:17px;flex-shrink:0;}
.office-locate:hover{background:var(--red);color:#fff;transform:translateY(-1px);}
.office-contact-title{display:flex;align-items:center;gap:18px;margin-bottom:10px;color:#1f1f1f;font-size:1rem;}
.office-contact-title strong{font-weight:700;}
.office-contact ul{display:flex;flex-direction:column;gap:5px;}
.office-contact li{display:flex;align-items:center;gap:18px;font-size:.98rem;color:#3b3b3b;min-width:0;}
.office-contact svg{width:18px;height:18px;flex-shrink:0;color:var(--red);}
.office-contact li span,.office-contact li a{min-width:0;overflow-wrap:anywhere;}
.office-contact a{transition:color .2s ease;}
.office-contact a:hover{color:var(--red);text-decoration:underline;}

/* 3 offices: give the columns more room */
@media (min-width:901px){
  .site-footer[data-offices="3"] .footer-brand{flex-basis:clamp(200px,21%,280px);flex-direction:column;gap:16px;}
  .site-footer[data-offices="3"] .footer-brand img{height:44px;}
  .site-footer[data-offices="3"] .footer-brand .logo-sep{width:56px;height:1px;flex:none;}
  /* keep "Locate Us" and the contact block on the same line across columns */
  @supports (grid-template-rows:subgrid){
    .site-footer:not(.footer--single) .office{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0;align-content:start;}
    .site-footer:not(.footer--single) .office > *{align-self:start;}
    .site-footer:not(.footer--single) .office-locate{justify-self:start;}
  }
  .site-footer[data-offices="3"] .office{padding-left:clamp(18px,2.2vw,34px);padding-right:clamp(12px,1.6vw,24px);}
}
/* 1 office: one wide card — address left, contact right */
.site-footer.footer--single .footer-offices{grid-template-columns:minmax(0,780px);}
.site-footer.footer--single .office{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(28px,4vw,64px);
  grid-template-areas:"name contact" "desc contact" "locate contact";align-content:start;
  max-width:780px;
}
.site-footer.footer--single .office-name{grid-area:name;}
.site-footer.footer--single .office-desc{grid-area:desc;}
.site-footer.footer--single .office-locate{grid-area:locate;justify-self:start;margin-bottom:0;}
.site-footer.footer--single .office-contact{grid-area:contact;align-self:center;padding-left:clamp(20px,3vw,44px);border-left:1px dashed #d4d4d4;}

/* 4+ offices: logos on their own row, offices in a flowing grid */
.site-footer.footer--many .footer-main{flex-direction:column;row-gap:40px;}
.site-footer.footer--many .footer-brand{flex:none;justify-content:flex-start;padding:0;}
.site-footer.footer--many .footer-brand img{height:48px;}
.site-footer.footer--many .footer-brand .logo-sep{height:48px;}
.site-footer.footer--many .footer-offices{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));row-gap:40px;}
.site-footer.footer--many .office{padding-left:clamp(20px,2.4vw,36px);padding-right:clamp(16px,2vw,28px);}

.footer-bottom{
  text-align:center;font-size:.92rem;color:#777;
  margin-top:30px;padding-top:18px;border-top:1px solid #cdcdcd;
}
.footer-bottom-logos{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:10px;}
.footer-bottom-logos a{display:block;line-height:0;}
.footer-bottom-logos img{height:24px;width:auto;}
.footer-bottom-logos .logo-sep{height:24px;background:var(--red);opacity:.7;}

.made-by-badge{
  position:fixed;right:18px;bottom:14px;z-index:150;
  color:#fff;font-size:.8rem;font-weight:600;letter-spacing:.2px;
}
.made-by-badge a{color:var(--gold-light);font-weight:700;transition:color .2s ease;}
.made-by-badge a:hover,.made-by-badge a:focus-visible{color:#fff;}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1150px){
  .advantage-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:900px){
  .nav-wrap{padding:10px 16px;min-height:60px;}
  .logo-group img{height:32px;}
  .logo-group a + a{padding-left:12px;}
  .logo-group a + a img{height:24px;}
  nav{
    position:absolute;top:100%;left:0;right:0;background:#fff;
    box-shadow:0 14px 24px rgba(0,0,0,.12);border-top:1px solid #eee;
    max-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;visibility:hidden;
    transition:max-height .35s ease, visibility 0s linear .35s;
  }
  nav.open{max-height:calc(100dvh - 64px);visibility:visible;transition:max-height .35s ease, visibility 0s;}
  nav > ul{flex-direction:column;align-items:stretch;gap:0;padding:6px 20px 18px;}
  nav > ul > li{width:100%;}
  nav > ul > li > a{display:flex;justify-content:space-between;width:100%;padding:15px 2px;border-bottom:1px solid #eee;font-size:1rem;}
  nav > ul > li > a.active::after{bottom:-1px;}
  nav > ul > li.has-dropdown.open .caret{transform:rotate(180deg);}
  .dropdown-menu{
    position:static;opacity:1;visibility:hidden;transform:none;width:100%;max-width:100%;
    box-shadow:none;border-radius:0;padding:0;gap:0;max-height:0;overflow:hidden;
    transition:max-height .3s ease, visibility 0s linear .3s;
    grid-template-columns:minmax(0,1fr);
  }
  .dropdown-menu::before{display:none;}
  nav > ul > li.has-dropdown.open .dropdown-menu{max-height:700px;visibility:visible;padding:6px 0 10px;transition:max-height .3s ease, visibility 0s;}
  .dd-item{min-height:0;background:none;border:0;border-radius:6px;padding:11px 12px 11px 16px;font-size:.92rem;font-weight:600;border-left:2px solid #f0d6d4;}
  .dd-more{font-size:.72rem;}
  a.dd-item:hover,a.dd-item:focus-visible{transform:none;box-shadow:none;background:#fdf1f0;border-color:transparent;border-left-color:var(--red);}
  body.nav-open{overflow:hidden;}
  .burger{display:flex;}
  .about-grid, .contact-inner{grid-template-columns:1fr;}
  .about-col, .primer-col{max-width:100%;}
  .about-grid p{max-width:100%;}
  #primerHeading{font-size:1.7rem;letter-spacing:3px;}
  .loc-slide{grid-template-columns:1fr;gap:28px;padding:16px 12px 24px;}
  .loc-map-card{height:300px;}
  .advantage-card{min-height:0;padding:38px 26px;}
  .advantage-grid{grid-template-columns:1fr 1fr;}
  .advantage-section{padding:70px 0;}
  .coe-section{padding-top:60px;}
  :root{--wide-pad:24px;}
  .coe-inner{grid-template-columns:1fr;gap:18px;padding:44px 24px 96px;}
  .coe-arrow{top:auto;bottom:12px;transform:none;width:44px;height:44px;}
  .coe-arrow svg{width:28px;height:28px;}
  .coe-arrow.left{left:8px;}
  .coe-arrow.right{right:8px;}
  .coe-controls{bottom:24px;}
  .carousel-pause{display:none;}
  .advantage-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  /* footer: logos on top, offices below */
  .site-footer{padding:48px 0 70px;}
  .site-footer .footer-main{flex-direction:column;row-gap:34px;}
  .footer-brand{flex:none;padding:0;}
  .footer-brand img{height:42px;}
  .footer-brand .logo-sep{height:44px;}
  .footer-art{right:-140px;top:10px;height:340px;opacity:.1;}
  .footer-offices{grid-template-columns:repeat(var(--office-cols-sm),minmax(0,1fr));row-gap:34px;}
  .office{padding:22px 22px 0;border-left:0;border-top:1px solid #cdcdcd;}
  .office-name{font-size:1.15rem;}
  .office-locate{margin-bottom:24px;}
  .site-footer.footer--single .office{max-width:none;}

  /* 3+ offices on small screens: swipe row instead of a very tall stack */
  .site-footer.footer--swipe .footer-offices{
    display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
    padding:4px 24px 14px;margin:0 -24px;scroll-padding:0 24px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .site-footer.footer--swipe .footer-offices::-webkit-scrollbar{display:none;}
  .site-footer.footer--swipe .office{
    flex:0 0 min(82%,340px);scroll-snap-align:start;
    background:rgba(255,255,255,.75);border:1px solid #e1e1e1;border-radius:14px;padding:22px 20px 20px;
  }
  .site-footer.footer--swipe .office-locate{margin-bottom:20px;}
  .site-footer.footer--swipe .footer-offices::after{content:"";flex:0 0 1px;} /* end spacing */
  /* on phones the fixed badge would cover text, so it sits under the footer instead */
  /* phones: sits under the light footer, so it uses dark text there */
  .made-by-badge{position:static;display:block;text-align:center;color:#777;padding:4px 16px 22px;background:#efefef;}
  .made-by-badge a{color:#a8790f;}
  .made-by-badge a:hover{color:var(--red);}
  .site-footer{padding-bottom:22px;}
}
@media (max-width:600px){
  /* narrow maps: label sits above the pin instead of beside it */
  .map-pin-text{position:absolute;left:50%;bottom:calc(100% + 2px);transform:translateX(-50%);margin:0;padding:7px 14px;align-items:center;text-align:center;}
  .footer-offices{grid-template-columns:1fr;}
  .site-footer.footer--single .office{grid-template-columns:1fr;grid-template-areas:"name" "desc" "locate" "contact";}
  .site-footer.footer--single .office-locate{margin-bottom:24px;}
  .site-footer.footer--single .office-contact{padding-left:0;border-left:0;}
  .office-desc{max-width:none;}
}
@media (prefers-reduced-motion: reduce){
  .footer-art{animation:none;}
}
@media (max-width:520px){
  .advantage-grid{grid-template-columns:1fr;}
  .advantage-section{padding:56px 0;}
  .advantage-section .section-title{font-size:1.7rem;}
  .hero-content{padding:100px 16px 60px;}
  .about-heading-row #aboutHeading{font-size:2.4rem;}
  .loc-tagline{font-size:1.1rem;}
}
@media (max-width:900px){
  .hero-content{min-height:100vh;min-height:100svh;padding-bottom:120px;}
  .hero-scroll{position:absolute;left:50%;bottom:26px;margin:0;transform:translateX(-50%);}
  .hero-scroll.is-hidden{transform:translateX(-50%) translateY(12px);}
}
@media (max-width:600px){
  .hero-content{align-items:center;text-align:center;}
  .hero-partners,.hero-brand,.hero-text,.hero-scroll{text-align:center;}
  .hero-partners img,.hero-brand img{margin:0 auto;}
  .hero-text p{text-align:center;}
}