/* Hero customer network — shares the site's black, gold and constellation language. */
.hero > .hero-layout { display:grid; grid-template-columns:minmax(0,1.38fr) minmax(0,1fr); align-items:center; gap:clamp(24px,4vw,64px); }
.hero-layout .hero-content { min-width:0; }
.hero-layout .hero-headline { font-size:clamp(2.6rem,4.7vw,4.9rem); }
.hero-layout .hero-headline .h-line { display:inline; }
.hero-layout .hero-headline .h-line + .h-line::before { content:' '; }
.customer-map { --map-green:#83e7a6; min-width:0; position:relative; margin-block:48px 64px; isolation:isolate; }
.customer-map::before { content:''; position:absolute; inset:15% -12% 6%; background:radial-gradient(ellipse,rgba(8,8,8,.94) 0%,rgba(8,8,8,.7) 48%,transparent 73%); z-index:-1; pointer-events:none; }
.customer-map-stage { position:relative; width:100%; aspect-ratio:420/620; margin:14px auto 6px; }
.customer-map-svg,.customer-map-pins { position:absolute; inset:0; width:100%; height:100%; }
.customer-map-svg { filter:drop-shadow(0 0 9px rgba(245,200,66,.07)); }
.customer-map-mesh { animation:mapMeshGlow 7s ease-in-out infinite alternate; }
@keyframes mapMeshGlow { to { stroke-opacity:.42; } }
.customer-map-pins { pointer-events:none; }
.customer-map-pin { position:absolute; width:28px; height:28px; padding:0; border:0; background:transparent; border-radius:50%; transform:translate(-50%,-50%); display:grid; place-items:center; cursor:pointer; pointer-events:auto; -webkit-tap-highlight-color:transparent; }
.customer-pin-core { position:relative; display:block; width:8px; height:8px; border-radius:50%; background:var(--map-green); border:1px solid #c2ffd8; box-shadow:0 0 8px rgba(131,231,166,.85),0 0 22px rgba(131,231,166,.3); transition:transform .2s,box-shadow .2s; pointer-events:none; }
.customer-pin-core::before { content:''; position:absolute; inset:-6px; border:1px solid rgba(131,231,166,.6); border-radius:50%; animation:customerPinPulse 3.4s ease-out infinite; animation-delay:var(--pin-delay); }
@keyframes customerPinPulse { 0% { transform:scale(.65);opacity:.65; } 80%,100% { transform:scale(1.65);opacity:0; } }
.customer-map-pin:hover .customer-pin-core,.customer-map-pin[aria-expanded=true] .customer-pin-core { transform:scale(1.5); box-shadow:0 0 12px #83e7a6,0 0 30px rgba(131,231,166,.6); }
.customer-map-pin:focus-visible { outline:2px solid var(--gold-primary); outline-offset:3px; }
.customer-map-pin[aria-expanded=true] { z-index:2; }
.customer-pin-label { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.customer-map-preview { position:absolute; z-index:5; width:min(238px,calc(100% - 16px)); border:1px solid rgba(245,200,66,.42); border-radius:8px; background:#111110; color:var(--text-primary); box-shadow:0 18px 55px rgba(0,0,0,.8),0 0 24px rgba(245,200,66,.07); overflow:hidden; animation:mapPreviewEnter .18s ease-out; }
.customer-map-preview[hidden] { display:none; }
@keyframes mapPreviewEnter { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
.customer-preview-close { position:absolute; right:3px; top:2px; width:30px; height:28px; border:0; color:#d1cfc7; background:transparent; font-size:21px; cursor:pointer; z-index:2; }
.customer-preview-close:hover { color:var(--gold-primary); }
.customer-preview-close:focus-visible,.customer-preview-copy a:focus-visible { outline:2px solid var(--map-green); outline-offset:-2px; }
.customer-preview-browser { display:flex; align-items:center; gap:4px; height:30px; padding:0 11px; background:#181816; border-bottom:1px solid rgba(245,200,66,.12); }
.customer-preview-browser i { width:4px; height:4px; background:#645c39; border-radius:50%; }
.customer-preview-browser span { margin-left:8px; font-size:8px; color:#afa895; letter-spacing:.05em; }
.customer-preview-visual { position:relative; height:118px; background:#12140f; overflow:hidden; }
.customer-preview-visual img { width:100%; height:100%; object-fit:cover; object-position:top; }
.customer-preview-visual img[hidden],.customer-preview-fallback[hidden] { display:none; }
.customer-preview-fallback { height:100%; position:relative; display:flex; align-items:center; gap:18px; padding:24px; background:linear-gradient(145deg,#202317,#080908); }
.customer-preview-fallback::before { content:''; position:absolute; inset:0; opacity:.2; background:repeating-linear-gradient(35deg,transparent 0 32px,rgba(245,200,66,.3) 33px 34px,transparent 35px 66px); }
#customer-preview-initials { position:relative; font:700 32px/1 var(--font-head); color:var(--gold-primary); }
.customer-preview-lines { display:grid; gap:9px; flex:1; }
.customer-preview-lines i { position:relative; display:block; height:4px; background:#d4c88a; opacity:.4; border-radius:4px; }
.customer-preview-lines i:nth-child(2) { width:72%; }
.customer-preview-lines i:nth-child(3) { width:46%; height:12px; background:var(--gold-primary); opacity:.8; margin-top:4px; }
.customer-preview-copy { padding:13px 15px 15px; }
#customer-preview-town { color:var(--map-green); font-size:.65rem; line-height:1.35; margin:0 0 5px; }
#customer-preview-name { font:600 1rem/1.25 var(--font-head); letter-spacing:-.01em; margin:0 0 5px; }
#customer-preview-tag { font-size:.7rem; color:#b1afa4; line-height:1.4; margin:0; }
.customer-preview-copy a { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; padding-top:10px; border-top:1px solid rgba(245,200,66,.16); color:var(--gold-primary); font-size:.72rem; font-weight:700; min-height:32px; text-decoration:none; }
@media(min-width:1100px) { .customer-map-stage { max-width:420px; } }
@media(max-width:1000px) { .hero > .hero-layout { grid-template-columns:minmax(0,1.22fr) minmax(0,1fr); gap:20px; } .hero-layout .hero-headline { font-size:clamp(2.6rem,4.7vw,4rem); } }
@media(max-width:760px) { .hero > .hero-layout { display:block; } .hero-layout .hero-content { padding-block:48px 20px; } .hero-layout .hero-headline { font-size:clamp(2.6rem,7.6vw,4.5rem); } .customer-map { width:min(100%,430px); margin:36px auto 80px; } .customer-map-stage { width:100%; } .customer-map-pin { width:30px; height:30px; } .customer-map-preview { width:min(238px,calc(100% - 16px)); } }
@media(prefers-reduced-motion:reduce) { .customer-pin-core::before,.customer-map-mesh,.customer-map-preview { animation:none; } .customer-pin-core { transition:none; } }