/* AUTO-GENERATED from 04_V2_Experience/references.html. Do not edit. */
/* head */
.r-head{padding:26vh 0 8vh}
.r-head h1{font-family:var(--disp);font-weight:600;text-transform:uppercase;color:var(--white);font-size:clamp(40px,7vw,116px);line-height:.94}
.r-head h1 .thin{font-weight:300;color:var(--steel-2)}
.r-head p{max-width:52ch;margin-top:26px;font-size:17px;font-weight:300;color:var(--txt)}

/* world map */
.r-map{position:relative}
.r-map .mapframe{position:relative;border:1px solid var(--line-2);background:var(--ink-2);overflow:hidden}
.r-map svg{width:100%;height:auto;display:block}
.r-map .land{fill:#16191e;stroke:rgba(255,255,255,.07);stroke-width:.4}
.r-map .arc{stroke:var(--steel);stroke-opacity:.10;fill:none;stroke-width:.6}
.r-map .node{fill:none;stroke:var(--steel);stroke-width:1.2;opacity:0;filter:drop-shadow(0 0 5px rgba(139,146,152,.35));cursor:pointer;transition:stroke .42s var(--ease)}
.r-map .node:hover,.r-map .node.hot{stroke:var(--steel-2)}
.r-map .node-core{fill:var(--steel);opacity:0;pointer-events:none}
.r-map .origin{fill:var(--steel-2);stroke:#fff;stroke-width:1;opacity:0}
.r-map .origin-label{font-family:var(--disp);font-size:7.5px;letter-spacing:.2em;fill:var(--steel-2);opacity:0}
.r-map .tip{position:absolute;z-index:5;background:var(--ink-3);border:1px solid var(--line);padding:10px 14px;pointer-events:none;opacity:0;transform:translate(-50%,-130%);transition:opacity .25s}
.r-map .tip .k{font-family:var(--disp);text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:var(--white);white-space:nowrap}
/* interactive map (MapLibre) */
.r-map .mapframe{height:clamp(440px,62vh,700px)}
.r-map .maplibregl-map{font:inherit}
.nis-marker{width:11px;height:11px;border-radius:50%;background:var(--steel);box-shadow:0 0 0 3px rgba(139,146,152,.18),0 0 9px 2px rgba(139,146,152,.55);cursor:pointer;transition:transform .28s var(--ease),box-shadow .28s}
.nis-marker:hover,.nis-marker.hot,.nis-marker:focus{transform:scale(1.4);box-shadow:0 0 0 4px rgba(165,172,179,.30),0 0 13px 3px rgba(165,172,179,.75);outline:none}
.nis-marker.origin{width:15px;height:15px;background:var(--steel-2);border:2px solid #fff;box-shadow:0 0 0 4px rgba(205,210,214,.25),0 0 15px 4px rgba(205,210,214,.60)}
.nis-pop .maplibregl-popup-content{background:#0e1116;color:#e8eaed;font-family:var(--disp);text-transform:uppercase;letter-spacing:.10em;font-size:10.5px;border:1px solid var(--line);border-radius:0;padding:7px 11px;box-shadow:0 8px 26px rgba(0,0,0,.5)}
.nis-pop .maplibregl-popup-tip{display:none}
.r-map .maplibregl-ctrl-group{background:#0e1116;border:1px solid var(--line);box-shadow:none}
.r-map .maplibregl-ctrl-group button+button{border-top:1px solid var(--line)}
.r-map .maplibregl-ctrl button .maplibregl-ctrl-icon{filter:invert(1) brightness(1.35)}
.r-map .maplibregl-ctrl-attrib{background:rgba(10,12,15,.72)}
.r-map .maplibregl-ctrl-attrib a{color:#9aa0a6}
.r-map .legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:26px}
.r-map .legend span{font-family:var(--disp);text-transform:uppercase;letter-spacing:.12em;font-size:10.5px;color:var(--muted);cursor:default;transition:color .3s}
.r-map .legend span:hover{color:var(--white)}
.r-map .capline{margin-top:26px;font-family:var(--disp);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--muted)}

/* counters cluster */
.r-count{border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);background:#08090b}
.r-count .grid{display:grid;grid-template-columns:repeat(5,1fr)}
.r-count .n{padding:9vh 26px;border-left:1px solid var(--line-2)}
.r-count .n:first-child{border-left:none}
.r-count .n .v{font-family:var(--disp);font-weight:300;font-size:clamp(34px,3.6vw,64px);color:var(--white);line-height:1;font-variant-numeric:tabular-nums}
.r-count .n .v b{font-weight:600;color:var(--steel-2)}
.r-count .n .l{font-family:var(--disp);text-transform:uppercase;letter-spacing:.16em;font-size:10px;color:var(--muted);margin-top:12px}
@media(max-width:1000px){.r-count .grid{grid-template-columns:1fr 1fr}.r-count .n{border-left:none;border-top:1px solid var(--line-2);padding:6vh 22px}.r-count .n:nth-child(-n+2){border-top:none}}
@media(max-width:520px){.r-count .grid{grid-template-columns:1fr}.r-count .n:nth-child(2){border-top:1px solid var(--line-2)}}

/* living proof */
.r-live{text-align:center;padding:16vh 0}
.r-live .line{font-family:var(--disp);font-weight:500;text-transform:uppercase;color:var(--white);font-size:clamp(22px,3.4vw,48px);letter-spacing:.02em;display:inline-flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:center}
.r-live .dot{width:10px;height:10px;border-radius:50%;background:var(--steel-2);opacity:.6;animation:live 4s var(--ease) infinite}
@keyframes live{0%,100%{opacity:.4}50%{opacity:.8}}
.r-live .sub{margin-top:18px;font-family:var(--disp);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--muted)}
@media(prefers-reduced-motion:reduce){
  .r-live .dot{animation:none;opacity:.6}
  .r-map .node,.r-map .node-core,.r-map .origin,.r-map .origin-label{opacity:1!important}
}

/* references gallery (filter + tiles + lightbox) */
.gfilter{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 26px}
.gchip{font-family:var(--disp);text-transform:uppercase;letter-spacing:.14em;font-size:10.5px;color:var(--muted);background:transparent;border:1px solid var(--line-2);padding:9px 16px;cursor:pointer;transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease)}
.gchip:hover{color:var(--white);border-color:var(--steel)}
.gchip.on{color:var(--ink);background:var(--steel-2);border-color:var(--steel-2)}
.ggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.gtile{position:relative;margin:0;overflow:hidden;border:1px solid var(--line-2);background:#0e1014;aspect-ratio:4/3;cursor:pointer}
.gtile img{width:100%;height:100%;object-fit:cover;opacity:.9;transition:transform .9s var(--ease),opacity .5s}
.gtile:hover img,.gtile:focus img{transform:scale(1.06);opacity:1}
.gtile figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:14px 16px;font-family:var(--disp);text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:#fff;background:linear-gradient(0deg,rgba(8,9,11,.9),transparent);opacity:0;transform:translateY(8px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.gtile:hover figcaption,.gtile:focus figcaption{opacity:1;transform:none}
.gtile.hide{display:none}
.gtile:focus{outline:2px solid var(--steel-2);outline-offset:2px}
.gvid .playbadge{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:56px;height:56px;border-radius:50%;background:rgba(8,9,11,.5);border:1.5px solid rgba(255,255,255,.85);transition:background .3s,border-color .3s}
.gvid .playbadge::after{content:"";position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);border-left:16px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent}
.gvid:hover .playbadge{background:var(--steel-2);border-color:var(--steel-2)}
.glb{position:fixed;inset:0;z-index:200;background:rgba(6,7,9,.95);display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .35s}
.glb.on{display:flex}.glb.show{opacity:1}
.glb .stage{position:relative;max-width:92vw;max-height:82vh}
.glb img,.glb video{max-width:92vw;max-height:82vh;display:block;border:1px solid var(--line)}
.glb .cap{position:absolute;left:0;bottom:-32px;font-family:var(--disp);text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:var(--steel-2)}
.glb .x,.glb .nav{position:absolute;background:transparent;border:1px solid rgba(255,255,255,.28);color:#fff;cursor:pointer;font-family:var(--disp);line-height:1;transition:color .3s,border-color .3s}
.glb .x{top:24px;right:24px;width:44px;height:44px;font-size:22px}
.glb .nav{top:50%;transform:translateY(-50%);width:52px;height:64px;font-size:24px}
.glb .prev{left:20px}.glb .next{right:20px}
.glb .x:hover,.glb .nav:hover{color:var(--steel-2);border-color:var(--steel-2)}
@media(max-width:640px){.ggrid{grid-template-columns:1fr 1fr;gap:6px}.gtile{aspect-ratio:1}.glb .nav{width:40px;height:54px}}
@media(prefers-reduced-motion:reduce){.gtile img{transition:none}.gtile:hover img{transform:none}}