.compass-hero{--compass-bg:#f4f6f5;--dial-projection:.53;--compass-text:#24312f;--compass-muted:#596562;max-width:none;padding:0 0 26px;margin:0;background:var(--compass-bg);color:var(--compass-text);overflow:clip}
.compass-intro{position:relative;z-index:2;text-align:center;padding:32px 24px 0}
.compass-intro h1{font-size:clamp(42px,4.2vw,64px);font-weight:700;line-height:1.24;letter-spacing:-.02em}
.compass-intro .lead{color:#596562;font-size:19px;line-height:1.8;max-width:820px;margin:18px auto 0;text-wrap:balance}
.compass-intro .hero-actions{justify-content:center;gap:30px;margin-top:24px}
.compass-intro .primary{color:#fff;background:#5c6f5e;border-color:#5c6f5e;min-height:50px;padding-inline:27px;font-size:16px}
.compass-intro .primary:hover{background:#485c4b;border-color:#485c4b}
.compass-intro .text-link{color:var(--compass-text);font-size:16px}
.compass-hero :is(a,button):focus-visible,.compass-opening button:focus-visible{outline:2px solid #5c6f5e;outline-offset:5px}
.compass-space{position:relative;width:100%;max-width:1220px;margin:16px auto 0}
.network-frame{width:100%;aspect-ratio:2 / 1;position:relative;isolation:isolate;pointer-events:none}
.network-frame .scene-fallback{width:100%;height:100%;object-fit:contain}
.network-frame .scene-fallback,.opening-dial{mask-image:linear-gradient(transparent,#000 12%,#000 85%,transparent),linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-composite:intersect}
.compass-needle-plane{position:absolute;width:43%;aspect-ratio:1;left:49.605%;top:43.63%;transform:translate(-50%,-50%) scaleY(var(--dial-projection));filter:drop-shadow(1px 5px 3px #0007);pointer-events:none}
.compass-needle{position:absolute;height:100%;width:8%;max-width:none;left:46.014%;top:.9191%;transform-origin:49.8258% 49.0809%;transform:rotate(62deg);pointer-events:none}
.compass-hub{position:absolute;inset:0;background:url(/homepage/20261008-02/assets/compass-values.webp) center / 100% 100%;clip-path:inset(37% 48.2% 54% 47.55% round 50% / 25%);pointer-events:none}
.compass-controls{display:flex;justify-content:center;position:relative;min-height:44px;margin-top:-42px;color:var(--compass-muted)}
.compass-controls button{border:0;background:transparent;color:inherit;min-height:44px;padding:10px 16px;font-size:14px;text-decoration:underline;text-underline-offset:4px}
:root:has(.compass-opening[open]){overflow:hidden}
[data-opening] .compass-opening{position:fixed;inset:0;z-index:1000;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;display:grid;align-content:center;justify-items:center;background:#f4f6f5}
.opening-dial{width:min(1060px,100vw,135svh);aspect-ratio:2 / 1}
#opening-enter{visibility:hidden;margin-top:-32px;min-height:54px;padding:0 32px;border:1px solid #5c6f5e;border-radius:40px;background:#5c6f5e;color:#fff;font-size:18px;font-weight:500}
[data-opening=ready] #opening-enter{visibility:visible;animation:opening-action .55s ease-out both}
#opening-skip{position:absolute;right:28px;top:24px;min-height:44px;padding:0 16px;border:0;background:transparent;color:#596562}
[data-opening=closing] #opening-enter{visibility:visible}
[data-opening=closing] .compass-opening>*{animation:opening-exit .25s both}
[data-opening=closing] .compass-opening{animation:opening-exit .3s .25s both}
@keyframes opening-action{from{opacity:0;translate:0 10px}}
@keyframes opening-exit{to{opacity:0;visibility:hidden}}
@media (max-width:760px),(prefers-reduced-motion:reduce){.compass-opening{display:none !important}}
@media (max-width:1100px){.compass-intro{padding-top:40px}
 .compass-space{margin-top:18px}
  .compass-controls{margin-top:-24px}}
@media (max-width:760px){.compass-hero{padding-bottom:24px}
  .compass-intro{padding:34px 22px 0}
  .compass-intro h1{font-size:clamp(30px,8.5vw,42px);line-height:1.32}
  .compass-intro h1 span{display:inline-block;max-width:430px;text-wrap:balance}
  .compass-intro .lead{font-size:15px;line-height:1.85;margin-top:18px}
  .compass-intro .hero-actions{flex-wrap:nowrap;gap:18px;margin-top:22px}
  .compass-intro .primary{font-size:14px;min-height:48px;padding:10px 17px;gap:12px}
  .compass-intro .text-link{font-size:14px;gap:8px}
  .compass-intro .hero-actions a{white-space:nowrap}
  .compass-space{margin-top:26px}
  .network-frame{width:136%;margin-left:-18%}
  .compass-hub{background-image:url(/homepage/20261008-02/assets/compass-values-mobile.webp)}
  .compass-controls{display:none}}
@media (max-width:360px){.compass-intro .hero-actions{gap:12px}
  .compass-intro .primary{padding-inline:12px;font-size:13px;gap:8px}
  .compass-intro .text-link{font-size:13px;gap:6px}}