.oi-experience{--oi-ink:#edf8ff;--oi-muted:#b4cbd8;--oi-blue:#67d9ff;--oi-offset:0px;--oi-height:100svh;position:relative;background:#051a2a;color:var(--oi-ink);font-family:Arial,Helvetica,sans-serif;isolation:isolate;width:100%;margin:0;box-sizing:border-box}
.oi-experience *{box-sizing:border-box}
.oi-experience .oi-stage{position:relative;overflow:hidden;background:radial-gradient(ellipse at 80% 45%,#153e53 0%,#071f31 45%,#041521 100%);color:var(--oi-ink)}
.oi-experience .oi-topbar{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 5%;border-bottom:1px solid #ffffff14}
.oi-experience .oi-brand{font-size:18px;letter-spacing:.18em;white-space:nowrap;color:#fff}
.oi-experience .oi-brand span{font-size:26px;vertical-align:middle;color:#8ee7ff}
.oi-experience .oi-actions{display:flex;align-items:center;gap:18px}
.oi-experience .oi-quick{font-size:13px;color:#fff!important;text-decoration:none!important;border:1px solid #8ea9ba;padding:11px 18px;border-radius:30px;line-height:1.4}
.oi-experience .oi-mode{font:inherit;font-size:12px;color:#c5deeb;background:transparent;border:0;border-bottom:1px solid #638294;padding:7px 0;cursor:pointer;border-radius:0;line-height:1.4;box-shadow:none}
.oi-experience [hidden]{display:none!important}
.oi-experience .oi-art{position:absolute;inset:80px 0 0 43%;pointer-events:none;z-index:1}
.oi-experience .oi-art canvas{display:block;width:100%;height:100%;position:absolute;inset:0}
.oi-experience .oi-fallback-drop{position:absolute;top:15%;left:26%;width:45%;aspect-ratio:1;border-radius:10% 60% 55% 60%;transform:rotate(45deg);background:radial-gradient(circle at 30% 25%,#b4eeff99,#2b89b144 40%,#082638 75%);border:1px solid #a0e2f188;box-shadow:inset 8px 4px 20px #b6f4ff44,0 0 70px #1bb3ec22;opacity:.6}
.oi-experience .oi-panels{position:relative;z-index:2;pointer-events:none}
.oi-experience .oi-panel{min-height:65vh;padding:90px 5%;display:flex;align-items:center;margin:0;border:0;background:transparent}
.oi-experience .oi-copy{width:46%;max-width:640px;pointer-events:auto}
.oi-experience .oi-eyebrow{font-size:11px;letter-spacing:.2em;color:#98c6d9;margin:0 0 24px;line-height:1.6}
.oi-experience .oi-title{font-family:Georgia,'Times New Roman',serif;font-size:clamp(38px,4.5vw,76px);font-weight:400;line-height:1.06;letter-spacing:-.045em;color:#f3f8fa;margin:0 0 28px;padding:0;text-transform:none}
.oi-experience .oi-title em{font-weight:400;color:#9ddcef}
.oi-experience .oi-description{font-size:clamp(16px,1.3vw,19px);line-height:1.7;color:var(--oi-muted);max-width:440px;margin:0 0 28px}
.oi-experience .oi-scroll-hint{font-size:12px;letter-spacing:.07em;color:#c5dce8;margin:35px 0 0}
.oi-experience .oi-scroll-hint span{margin-left:14px;font-size:22px}
.oi-experience .oi-tags{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:#c6e9f6}
.oi-experience .oi-tags span{border:1px solid #567685;padding:9px 12px;border-radius:6px}
.oi-experience .oi-button{display:inline-flex;align-items:center;gap:28px;padding:17px 24px;border-radius:35px;background:#8ae3ff;color:#052a3c!important;text-decoration:none!important;font-size:14px;font-weight:600;line-height:1.3;box-shadow:0 8px 40px #63d9ff18}
.oi-experience a:focus-visible,.oi-experience button:focus-visible{outline:3px solid #fff;outline-offset:5px}
.oi-experience .oi-bottom{display:none}
.oi-experience.is-live{height:calc(var(--oi-height) * 3.6)}
.oi-experience.is-live .oi-stage{position:sticky;top:var(--oi-offset);height:var(--oi-height)}
.oi-experience.is-live .oi-panels{position:absolute;inset:80px 0 55px}
.oi-experience.is-live .oi-panel{position:absolute;inset:0;min-height:0;padding:25px 5%;opacity:0;visibility:hidden}
.oi-experience.is-live .oi-panel.is-active{opacity:1;visibility:visible}
.oi-experience.is-live .oi-fallback-drop{display:none}
.oi-experience.is-live .oi-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;position:absolute;z-index:3;left:5%;right:5%;bottom:24px;font-size:10px;letter-spacing:.14em;color:#98b4c5}
.oi-experience .oi-progress{height:2px;background:#32536a;width:120px;margin-left:auto;overflow:hidden}
.oi-experience .oi-progress i{display:block;height:100%;width:100%;background:#9ce7ff;transform-origin:left;transform:scaleX(0)}
@media(max-width:767px){
 .oi-experience .oi-topbar{padding:18px 6%;gap:10px;align-items:flex-start}
 .oi-experience .oi-brand{font-size:12px;letter-spacing:.12em}
 .oi-experience .oi-brand span{font-size:20px}
 .oi-experience .oi-actions{flex-direction:column-reverse;align-items:flex-end;gap:8px}
 .oi-experience .oi-quick{padding:7px 11px;font-size:11px}
 .oi-experience .oi-mode{font-size:10px;padding:3px 0}
 .oi-experience .oi-copy{width:100%;max-width:none}
 .oi-experience .oi-panel{padding:45px 6%;min-height:0}
 .oi-experience .oi-art{display:none}
 .oi-experience.is-live .oi-art{display:block;inset:50% 0 30px 0}
 .oi-experience.is-live .oi-panels{inset:90px 0 0}
 .oi-experience.is-live .oi-panel{padding:16px 6% 0;align-items:flex-start}
 .oi-experience .oi-title{font-size:clamp(31px,8vw,46px);margin-bottom:15px}
 .oi-experience .oi-eyebrow{margin-bottom:12px;font-size:9px}
 .oi-experience .oi-description{font-size:14px;line-height:1.5;max-width:95%;margin-bottom:16px}
 .oi-experience .oi-scroll-hint{margin-top:12px;font-size:10px}
 .oi-experience .oi-tags{font-size:10px;gap:6px}
 .oi-experience .oi-tags span{padding:6px 8px}
 .oi-experience .oi-button{padding:12px 18px;font-size:12px}
 .oi-experience.is-live .oi-bottom{bottom:14px;left:6%;right:6%;font-size:8px}
 .oi-experience.is-live .oi-bottom>span:first-child{display:none}
}
@media(prefers-reduced-motion:reduce){.oi-experience .oi-scroll-hint{display:none}}
