/* ===== shared frame ===== */
.sec-dark{background:var(--bg);color:var(--w);border-radius:28px}
.sec-light{background:var(--lt);color:var(--ltt);border-radius:28px}
.cover{position:relative;z-index:2;border-radius:28px 28px 0 0;overflow:hidden}
.ab-ctn{max-width:1120px;margin:0 auto;padding:0 24px}

.ab-eye{display:block;font-family:var(--m);font-size:11px;font-weight:500;letter-spacing:2.4px;text-transform:uppercase;color:var(--c);margin-bottom:22px}
.ab-eye-l{color:var(--c)}

/* ===== FIRST SECTION — editorial lede (unique to about) ===== */
.ab-top{background:var(--bg);padding:clamp(150px,22vh,244px) clamp(24px,5vw,56px) clamp(72px,11vh,120px)}
.ab-top-inner{max-width:960px;margin:0 auto}
.ab-top-lede{font-size:clamp(27px,3.7vw,46px);font-weight:500;letter-spacing:-1.2px;line-height:1.24;color:var(--w2);margin:0 0 clamp(36px,5vh,52px)}
.ab-top-lede b{font-weight:600}
.ab-white{color:var(--w);background:linear-gradient(90deg,var(--w) 0 50%,var(--w2) 50% 100%);background-size:200% 100%;background-position:0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone;animation:abWhite .6s var(--ease) .45s both}
@keyframes abWhite{from{background-position:100% 0}to{background-position:0 0}}
.ab-uline{background-image:linear-gradient(var(--c),var(--c));background-repeat:no-repeat;background-position:left 100%;background-size:100% 4px;-webkit-box-decoration-break:clone;box-decoration-break:clone;animation:abUline .55s var(--ease) .5s both}
@keyframes abUline{from{background-size:0% 4px}to{background-size:100% 4px}}
.ab-top-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;letter-spacing:-.2px;color:var(--c);transition:color .25s var(--ease)}
.ab-top-link svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.ab-top-link:hover{color:var(--c2)}
.ab-top-link:hover svg{transform:translateY(3px)}
@media(max-width:600px){.ab-top-lede{letter-spacing:-.6px}}

.ab-section-head{text-align:center;margin-bottom:clamp(64px,8vh,96px);max-width:680px;margin-left:auto;margin-right:auto}
.ab-section-head .ab-eye{margin-bottom:18px}
.ab-section-head h2{font-size:clamp(34px,4.5vw,56px);font-weight:700;letter-spacing:-2.2px;line-height:1.05;margin-bottom:16px}
.sec-dark .ab-section-head h2{color:var(--w)}
.sec-light .ab-section-head h2{color:var(--ltt)}
.ab-section-head h2 b{color:var(--c);font-weight:700}
.ab-section-head p{font-size:15px;line-height:1.6;letter-spacing:-.2px}
.sec-dark .ab-section-head p{color:var(--w2)}
.sec-light .ab-section-head p{color:var(--ltt2)}


/* ===== WHY (light, centered headline + 2-col paragraphs) ===== */
.ab-why{padding:clamp(120px,15vh,180px) 0}
.ab-why-stack{text-align:center;max-width:900px;margin:0 auto clamp(48px,6vh,72px)}
.ab-why-stack .ab-eye{margin-bottom:20px}
.ab-why-stack h2{font-size:clamp(36px,5.4vw,72px);font-weight:700;letter-spacing:-2.8px;line-height:1.02;color:var(--ltt)}
.ab-why-stack h2 b{color:var(--c);font-weight:700}
.ab-why-cols{max-width:980px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);padding-top:clamp(36px,5vh,56px);border-top:1px solid var(--ltb)}
.ab-why-cols p{font-size:16px;line-height:1.75;letter-spacing:-.2px;color:var(--ltt2)}

/* ===== PLACE (dark) — big map + side stats ===== */
.ab-place{padding:clamp(120px,15vh,180px) 0}
.ab-place-grid{display:grid;grid-template-columns:minmax(280px,38%) 1fr;gap:clamp(40px,5vw,72px);align-items:stretch;max-width:1240px;margin:0 auto;padding:0 clamp(0px,2vw,12px)}
.ab-place-side{display:flex;flex-direction:column;padding-top:clamp(8px,2vh,24px)}
.ab-place-side .ab-eye{margin-bottom:20px}
.ab-place-side h2{font-size:clamp(40px,5.5vw,68px);font-weight:700;letter-spacing:-2.8px;line-height:.98;color:var(--w);margin-bottom:24px}
.ab-place-side h2 b{color:var(--c);font-weight:700}
.ab-place-tag{font-size:15px;line-height:1.65;letter-spacing:-.2px;color:var(--w2);margin-bottom:auto;padding-bottom:32px;max-width:380px}
/* facts — clean stacked def-list, no borders, perfectly aligned */
.ab-place-facts{display:flex;flex-direction:column;gap:0;max-width:340px}
.ab-place-fact{display:grid;grid-template-columns:100px 1fr;gap:24px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--b)}
.ab-place-fact:first-child{border-top:1px solid var(--b)}
.ab-place-fact-lab{font-family:var(--m);font-size:10px;font-weight:500;letter-spacing:1.8px;text-transform:uppercase;color:var(--w3)}
.ab-place-fact-val{font-size:17px;font-weight:600;letter-spacing:-.3px;color:var(--w);font-feature-settings:"tnum"}

/* === map (Mapbox container) === */
.ab-map{position:relative;width:100%;min-height:520px;border-radius:24px;overflow:hidden;border:1px solid var(--b);background:linear-gradient(160deg,#0c0c0f,#08080a)}
.ab-map-canvas{position:absolute;inset:0;width:100%;height:100%}

/* gold pin with pulsing rings */
.ab-map-pin{position:relative;width:18px;height:18px;cursor:pointer;display:grid;place-items:center}
.ab-map-pin-dot{position:relative;z-index:2;width:14px;height:14px;border-radius:50%;background:var(--c);box-shadow:0 0 0 2.5px #08080a,0 0 14px rgba(212,164,74,.55)}
.ab-map-pin-pulse{position:absolute;left:50%;top:50%;width:14px;height:14px;border-radius:50%;background:rgba(212,164,74,.55);transform:translate(-50%,-50%);animation:abPinPulse 2.2s ease-out infinite}
.ab-map-pin-pulse-2{animation-delay:1.1s}
@keyframes abPinPulse{
  0%{transform:translate(-50%,-50%) scale(.7);opacity:.55}
  80%{transform:translate(-50%,-50%) scale(3.6);opacity:0}
  100%{transform:translate(-50%,-50%) scale(3.6);opacity:0}
}

/* Mapbox UI overrides — keep brand cohesion */
.ab-map .mapboxgl-ctrl-attrib{background:rgba(8,8,10,.7)!important;color:rgba(255,255,255,.5)!important;font-family:var(--m);font-size:10px;letter-spacing:.4px}
.ab-map .mapboxgl-ctrl-attrib a{color:rgba(255,255,255,.7)!important}
.ab-map .mapboxgl-ctrl-attrib a:hover{color:var(--c)!important}
.ab-map .mapboxgl-ctrl-logo{opacity:.65;filter:saturate(.4)}
.ab-map .mapboxgl-ctrl-attrib-button{filter:invert(1) brightness(.7)}

/* popup */
.ab-map-popup .mapboxgl-popup-content{background:rgba(8,8,10,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(212,164,74,.25);border-radius:10px;padding:10px 14px;box-shadow:0 12px 32px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.02)}
.ab-map-popup .mapboxgl-popup-tip{border-top-color:rgba(212,164,74,.25)!important;border-bottom-color:rgba(212,164,74,.25)!important}
.ab-map-popup-inner{font-family:var(--f)}
.ab-map-popup-name{font-size:13px;font-weight:600;color:var(--w);letter-spacing:-.2px;margin-bottom:2px}
.ab-map-popup-meta{font-family:var(--f);font-size:12px;font-weight:500;letter-spacing:-.15px;color:var(--w2);margin-top:2px}

/* cooperative gestures overlay */
.ab-map .mapboxgl-cooperative-gesture-screen{background:rgba(8,8,10,.65)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--w);font-family:var(--f);font-weight:500;letter-spacing:-.2px}

/* ===== BELIEVE (light, 2x2 hairline grid — no boxes) ===== */
.ab-believe{padding:clamp(120px,15vh,180px) 0}
.ab-believe-grid{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--ltb);border-left:1px solid var(--ltb)}
.ab-believe-item{padding:clamp(36px,4.5vh,56px) clamp(28px,3.5vw,44px);border-right:1px solid var(--ltb);border-bottom:1px solid var(--ltb);display:flex;flex-direction:column;gap:14px}
.ab-num{font-family:var(--m);font-size:13px;font-weight:500;letter-spacing:1.8px;color:var(--c)}
.ab-believe-item h3{font-size:clamp(20px,2.4vw,26px);font-weight:600;letter-spacing:-.5px;line-height:1.2;color:var(--ltt)}
.ab-believe-item p{font-size:14.5px;color:var(--ltt2);line-height:1.7;letter-spacing:-.15px}

/* ===== BUILT ON (dark, partner strip — hairline grid) ===== */
.ab-built{padding:clamp(120px,15vh,180px) 0}
.ab-built-grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--b);border-left:1px solid var(--b)}
.ab-built-item{padding:clamp(28px,3.5vh,36px) clamp(22px,3vw,32px);border-right:1px solid var(--b);border-bottom:1px solid var(--b)}
.ab-built-name{font-size:16px;font-weight:600;letter-spacing:-.25px;color:var(--w);margin-bottom:8px}
.ab-built-role{font-size:13px;color:var(--w2);letter-spacing:-.1px;line-height:1.5}

/* ===== CONTACT (light, definition-list style) ===== */
.ab-contact{padding:clamp(100px,13vh,160px) 0}
.ab-contact-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(40px,7vw,96px);align-items:start;max-width:1040px;margin:0 auto}
.ab-contact-l h2{font-size:clamp(28px,3.6vw,40px);font-weight:700;letter-spacing:-1.6px;line-height:1.05;color:var(--ltt)}
.ab-contact-r{}
.ab-contact-row{display:grid;grid-template-columns:160px 1fr;gap:24px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--ltb)}
.ab-contact-row:first-child{border-top:1px solid var(--ltb)}
.ab-contact-label{font-family:var(--m);font-size:11px;font-weight:500;letter-spacing:1.6px;text-transform:uppercase;color:var(--ltt2)}
.ab-contact-row a{font-size:15px;font-weight:500;letter-spacing:-.2px;color:var(--ltt);border-bottom:1px solid transparent;transition:color .25s,border-color .25s;padding-bottom:1px}
.ab-contact-row a:hover{color:var(--c);border-bottom-color:var(--c)}

/* ===== CTA (dark) ===== */
.ab-cta{padding:clamp(140px,18vh,200px) 24px;text-align:center;position:relative;overflow:hidden}
.ab-cta-glow{position:absolute;inset:0;background:radial-gradient(700px 400px at 50% 50%,rgba(212,164,74,.08),transparent 65%);pointer-events:none}
.ab-cta-inner{position:relative;z-index:1;max-width:720px;margin:0 auto}
.ab-cta h2{font-size:clamp(36px,5.5vw,64px);font-weight:700;letter-spacing:-2.5px;line-height:1.02;margin-bottom:16px;color:var(--w)}
.ab-cta p{font-size:16px;color:var(--w2);margin-bottom:36px;letter-spacing:-.2px;line-height:1.55}

/* ===== responsive ===== */
@media(max-width:960px){
  .ab-why-cols{grid-template-columns:1fr;gap:24px}
  .ab-place-grid{grid-template-columns:1fr;gap:36px}
  .ab-place-side h2{font-size:42px;letter-spacing:-1.8px}
  .ab-map{min-height:420px}
  .ab-believe-grid{grid-template-columns:1fr}
  .ab-built-grid{grid-template-columns:repeat(2,1fr)}
  .ab-contact-grid{grid-template-columns:1fr;gap:24px}
  .ab-contact-row{grid-template-columns:1fr;gap:6px}
}
@media(max-width:600px){
  .ab-why-stack h2{letter-spacing:-1.8px}
  .ab-place-meta{grid-template-columns:1fr}
  .ab-map{min-height:360px}
  .ab-built-grid{grid-template-columns:1fr}
}