/* A continuous, responsive sculpture connecting the three disciplines. */
.variant-terminal .hero{background:none}
.variant-terminal .hero-copy{width:65%;max-width:65%}
.bridge-experience{position:absolute;right:2%;top:50%;transform:translateY(-54%);width:42%;margin:0;z-index:1}
.bridge-stage{position:relative;height:clamp(300px,31vw,470px);isolation:isolate}
.bridge-stage:before{content:"";position:absolute;inset:15% 4%;background:radial-gradient(ellipse,#ff805b0c,transparent 67%);pointer-events:none}
.bridge-stage canvas{position:absolute;inset:0;width:100%;height:100%;opacity:1;touch-action:pan-y}
.bridge-fallback{position:absolute;inset:12% 4%;width:92%;height:76%;color:#ff805b;opacity:.7}
.bridge-experience.is-ready .bridge-fallback{display:none}
.bridge-caption{max-width:380px;margin:0 auto;padding:0 18px}
.bridge-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#8b949e;font-size:8px;letter-spacing:1.2px;margin-bottom:17px}
.bridge-meta span:first-child{display:flex;align-items:center;gap:9px}
.bridge-meta i{width:4px;height:4px;background:var(--accent)}
.bridge-motion{display:none;border:0;background:transparent;color:#a3abb3;cursor:pointer;padding:10px;margin:-10px;min-height:36px;font-size:9px;letter-spacing:0}
.is-ready .bridge-motion{display:block}
.bridge-motion:hover{color:var(--accent)}
.bridge-modes{display:flex;border-bottom:1px solid #ffffff20;gap:22px}
.bridge-modes button{display:none;background:transparent;color:#b0b6bd;border:0;border-bottom:1px solid transparent;margin-bottom:-1px;padding:0 0 12px;min-height:44px;cursor:pointer;font-size:11px;transition:color .2s,border-color .2s}
.is-ready .bridge-modes button{display:block}
.bridge-modes button:hover,.bridge-modes button[aria-pressed="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.bridge-description{font-size:10px;line-height:1.8;color:#929ca6;min-height:38px;margin:14px 0 0;max-width:330px}
.bridge-hint{font-size:8px;letter-spacing:.3px;color:#77818b;margin:12px 0 0}
.bridge-touch-hint{display:none}
@media(min-width:901px){.variant-terminal .hero-copy{pointer-events:none}.bridge-experience{max-width:640px}}
@media(max-width:1100px) and (min-width:901px){.bridge-modes{gap:16px}.bridge-caption{padding:0 26px}.bridge-modes button{font-size:10px}.bridge-description{font-size:9px}}
@media(max-width:900px){
  .variant-terminal .hero{display:block;height:auto;min-height:0;max-height:none;padding-top:58px;padding-bottom:100px}
  .variant-terminal .hero-copy{width:100%;max-width:100%}
  .variant-terminal .hero-description{max-width:100%}
  .bridge-experience{position:relative;inset:auto;transform:none;width:100%;max-width:560px;margin:8px auto 0}
  .bridge-stage{height:340px}
  .bridge-caption{max-width:390px}
  .bridge-meta{font-size:8px}
}
@media(max-width:640px){
  .variant-terminal .hero{padding-top:48px;padding-bottom:105px}
  .bridge-experience{margin-top:10px}
  .bridge-stage{height:280px;margin-left:-5%;margin-right:-5%}
  .bridge-caption{padding:0 4px}
  .bridge-modes{gap:24px}
  .bridge-modes button{font-size:11px}
  .bridge-description{font-size:10px;min-height:36px}
  .bridge-meta{margin-bottom:13px;font-size:7px}
}
@media(pointer:coarse){.bridge-pointer-hint{display:none}.bridge-touch-hint{display:inline}}
@media(prefers-reduced-motion:reduce){.bridge-pointer-hint{display:none}.bridge-touch-hint{display:inline}}