/* ORAVEX INFORMATION LAYER — semantic, static-first sections that sit beneath the film.
   The original underwater palette and glow language are retained, but the content has
   stronger contrast, durable controls, and normal document-flow layouts. */
:root { --orx-ink:#ecf9f7; --orx-muted:#b9d4d5; --orx-cyan:#77eee1; --orx-teal:#16abb8; --orx-deep:#03121a; --orx-panel:rgba(7,30,39,.9); --orx-line:rgba(119,238,225,.24); --orx-shadow:0 34px 82px -42px rgba(0,0,0,.92); }
html { scroll-behavior:auto; }
.skip-link { position:fixed; z-index:9999; top:12px; inset-inline-start:12px; padding:12px 16px; border-radius:10px; background:var(--orx-cyan); color:#04252a; font-weight:700; text-decoration:none; transform:translateY(-160%); transition:transform .2s; }
.skip-link:focus { transform:none; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
body.oravex-redesign { color:var(--orx-ink); }
body.oravex-redesign p { color:var(--orx-muted); font-weight:400; letter-spacing:.01em; line-height:1.72; }
/* Keep the original film, About, Orbit and surface sequence in the canonical story.
   These superseded experiments have semantic replacements in the information layer. */
body.oravex-redesign #modules-list,
body.oravex-redesign #autonomy,
body.oravex-redesign #suite,
body.oravex-redesign #legacy-industries,
body.oravex-redesign #legacy-contact { display:none !important; }
body.oravex-redesign :focus-visible { outline:3px solid var(--orx-cyan); outline-offset:4px; }
body.oravex-redesign header { isolation:isolate; background:linear-gradient(180deg,rgba(2,12,18,.76),rgba(2,12,18,0)); }
.desktop-nav { display:none; align-items:center; gap:clamp(12px,1.5vw,24px); margin-inline:auto; }
.desktop-nav a { color:rgba(236,249,247,.82); font-size:11px; letter-spacing:.11em; text-decoration:none; text-transform:uppercase; white-space:nowrap; transition:color .2s; }
.desktop-nav a:hover,.desktop-nav a[aria-current="true"] { color:var(--orx-cyan); }
body.oravex-redesign .talk { min-height:44px; display:inline-flex; align-items:center; padding:0 22px; border-color:rgba(119,238,225,.6); color:var(--orx-ink); }
body.oravex-redesign .talk:hover { background:var(--orx-cyan); color:#05252a; border-color:var(--orx-cyan); }
@media (min-width:1120px) { .desktop-nav { display:flex; } }
@media (max-width:720px) { body.oravex-redesign .talk { display:inline-flex; font-size:0; width:44px; padding:0; justify-content:center; } body.oravex-redesign .talk::after{content:"↗";font-size:17px;} }

/* Hero proposition: deliberately smaller than the cinematic wordmark. */
.orx-hero-copy { display:grid; justify-items:center; margin-top:20px; }
.hero-value { max-width:660px; margin:0; color:rgba(247,255,254,.95)!important; font-size:clamp(16px,1.35vw,19px); font-weight:400!important; line-height:1.55!important; text-shadow:0 2px 22px rgba(1,9,13,.96); }
.hero-actions { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:18px; margin-top:20px; }
.hero-actions .orx-btn { min-height:42px; padding:0 16px; border-radius:10px; font-size:11px; letter-spacing:.09em; }
.hero-actions .orx-btn.primary { box-shadow:0 10px 26px -16px rgba(119,238,225,.95); }
.hero-actions .orx-btn.secondary { min-height:42px; padding:0; border:0; border-radius:0; background:transparent; color:#e8f9f7; }
.hero-actions .orx-btn.secondary::after { content:'→'; font-size:16px; line-height:1; transition:transform .2s; }
.hero-actions .orx-btn.secondary:hover { color:var(--orx-cyan); transform:none; }
.hero-actions .orx-btn.secondary:hover::after { transform:translateX(4px); }
.orx-btn { min-height:46px; display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:0 19px; border:1px solid var(--orx-line); border-radius:999px; background:rgba(4,24,31,.58); color:var(--orx-ink); font:600 12px/1 "Jost",sans-serif; letter-spacing:.12em; text-decoration:none; text-transform:uppercase; cursor:pointer; transition:transform .2s,background .2s,color .2s,border-color .2s; }
.orx-btn:hover { transform:translateY(-2px); border-color:var(--orx-cyan); }
.orx-btn.primary { background:var(--orx-cyan); color:#04262b; border-color:var(--orx-cyan); }
.orx-btn.primary:hover { background:#b0fff5; }

.orx-site { position:relative; z-index:40; background:var(--orx-deep); color:var(--orx-ink); }
.orx-section { position:relative; overflow:hidden; scroll-margin-top:86px; padding:clamp(72px,11vh,148px) max(20px,6vw); }
.orx-section::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 65% 45% at 82% 0%,rgba(48,202,192,.1),transparent 70%),radial-gradient(ellipse 55% 38% at 15% 100%,rgba(4,113,132,.12),transparent 72%); }
.orx-inner { position:relative; width:min(1220px,100%); margin:auto; }
.orx-eyebrow { display:block; color:var(--orx-cyan); font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; }
.orx-title { max-width:15ch; margin:14px 0 0; color:var(--orx-ink); font-size:clamp(32px,4.6vw,66px); font-weight:300; line-height:1.08; }
.orx-title strong { color:var(--orx-cyan); font-weight:500; }
.orx-lead { max-width:62ch; margin-top:18px; font-size:clamp(16px,1.35vw,19px); }
.orx-grid { display:grid; gap:18px; }
.orx-card { position:relative; min-width:0; border:1px solid var(--orx-line); border-radius:18px; background:linear-gradient(145deg,rgba(12,43,53,.9),rgba(3,18,25,.96)); box-shadow:var(--orx-shadow); }
.orx-card p { font-size:15px; }

/* Platform system diagram */
.orx-platform { background:linear-gradient(180deg,#051b24,#03131b 72%,#051b24); }
.orx-diagram { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:16px; margin-top:52px; }
.orx-node { min-height:180px; padding:26px; }
.orx-node h3 { margin-top:12px; font-size:25px; font-weight:500; }
.orx-node ul { display:grid; gap:8px; margin:17px 0 0; padding:0; list-style:none; }
.orx-node li { color:var(--orx-muted); font-size:14px; }
.orx-node li::before { content:"•"; color:var(--orx-cyan); margin-inline-end:8px; }
.orx-link { width:42px; height:1px; background:linear-gradient(90deg,var(--orx-teal),var(--orx-cyan)); box-shadow:0 0 14px rgba(119,238,225,.7); }
.orx-link::after { content:""; display:block; width:8px; height:8px; margin-inline-start:auto; transform:translateY(-3px) rotate(45deg); border-top:1px solid var(--orx-cyan); border-right:1px solid var(--orx-cyan); }
.orx-human { margin-top:22px; padding:13px 16px; border-inline-start:2px solid var(--orx-cyan); color:#d7f5f1; background:rgba(119,238,225,.07); }

/* Before / after */
.orx-compare { background:#04131b; }
.orx-compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:44px; }
.orx-compare-card { padding:clamp(24px,4vw,44px); }
.orx-compare-card h3 { font-size:28px; font-weight:400; }
.orx-compare-card.before { border-color:rgba(232,172,113,.28); background:linear-gradient(145deg,rgba(54,37,28,.74),rgba(17,17,18,.9)); }
.orx-compare-card.after { border-color:rgba(119,238,225,.36); }
.orx-compare-card ul { display:grid; gap:13px; margin:25px 0 0; padding:0; list-style:none; }
.orx-compare-card li { color:#d4e4e3; font-size:15px; line-height:1.45; }
.orx-compare-card li::before { content:"×"; color:#e8ac71; margin-inline-end:10px; font-weight:600; }
.orx-compare-card.after li::before { content:"✓"; color:var(--orx-cyan); }

/* Product overview */
.orx-overview { background:linear-gradient(180deg,#061d26,#03131b); }
.orx-overview-grid { grid-template-columns:repeat(3,1fr); margin-top:48px; }
.orx-overview-card { display:flex; flex-direction:column; min-height:276px; padding:24px; }
.orx-icon { width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--orx-line); border-radius:13px; color:var(--orx-cyan); background:rgba(119,238,225,.08); font-size:21px; }
.orx-overview-card h3 { margin-top:18px; font-size:22px; font-weight:500; }
.orx-overview-card ul { display:grid; gap:7px; margin:16px 0 18px; padding:0; list-style:none; }
.orx-overview-card li { color:var(--orx-muted); font-size:13px; }
.orx-overview-card li::before { content:"•"; color:var(--orx-cyan); margin-inline-end:7px; }
.orx-link-btn { margin-top:auto; padding:0; border:0; background:none; color:var(--orx-cyan); text-align:start; font:600 12px/1.3 "Jost",sans-serif; letter-spacing:.13em; text-transform:uppercase; cursor:pointer; }

/* Roles / screens */
.orx-explorer { background:linear-gradient(180deg,#03131b,#05232d,#03131b); }
.orx-tabs { display:flex; flex-wrap:wrap; gap:9px; margin-top:34px; }
.orx-tab { min-height:42px; padding:0 14px; border:1px solid rgba(185,212,213,.24); border-radius:999px; background:rgba(5,28,36,.68); color:#d7e9e7; font:500 13px/1 "Jost",sans-serif; cursor:pointer; transition:background .2s,border-color .2s,color .2s; }
.orx-tab[aria-selected="true"] { background:var(--orx-cyan); border-color:var(--orx-cyan); color:#04262b; }
.orx-role-panel { display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(25px,6vw,80px); align-items:center; margin-top:28px; padding:clamp(24px,4vw,46px); }
.orx-role-panel h3 { font-size:clamp(26px,3.2vw,43px); font-weight:400; }
.orx-role-panel h4 { margin-top:19px; color:var(--orx-cyan); font-size:12px; letter-spacing:.15em; text-transform:uppercase; }
.orx-role-panel ul { display:grid; gap:7px; margin:10px 0 0; padding:0; list-style:none; }
.orx-role-panel li { color:var(--orx-muted); font-size:14px; }
.orx-role-panel li::before { content:"•"; color:var(--orx-cyan); margin-inline-end:8px; }
.orx-screen { overflow:hidden; border:1px solid var(--orx-line); border-radius:14px; background:#06141b; box-shadow:0 30px 80px -42px #000; }
.orx-screen-bar { height:32px; border-bottom:1px solid rgba(119,238,225,.15); background:radial-gradient(circle at 15px 16px,rgba(119,238,225,.5) 0 4px,transparent 4.5px),radial-gradient(circle at 30px 16px,rgba(119,238,225,.3) 0 4px,transparent 4.5px),radial-gradient(circle at 45px 16px,rgba(119,238,225,.2) 0 4px,transparent 4.5px),#092029; }
.orx-screen img { display:block; width:100%; height:auto; }
.orx-screen-note { margin-top:9px; color:#89acab; font-size:12px!important; }
.orx-screens-grid { display:grid; grid-template-columns:260px minmax(0,1fr); gap:22px; margin-top:38px; }
.orx-screen-list { display:grid; align-content:start; gap:8px; }
.orx-screen-choice { width:100%; min-height:52px; padding:11px 14px; border:1px solid transparent; border-radius:12px; background:transparent; color:#bfd8d7; text-align:start; font:500 14px/1.3 "Jost",sans-serif; cursor:pointer; }
.orx-screen-choice[aria-selected="true"] { border-color:var(--orx-line); background:rgba(119,238,225,.09); color:var(--orx-ink); }
.orx-screen-copy { margin-top:14px; }
.orx-screen-copy h3 { font-size:29px; font-weight:400; }
.orx-screen-copy p { margin-top:9px; }
.orx-screen-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:17px; }
.orx-sample { color:#88a9a8; font-size:12px!important; }

/* Integration / industries */
.orx-catalog { background:#051720; }
.orx-catalog-grid { grid-template-columns:repeat(3,1fr); margin-top:40px; }
.orx-catalog-card { padding:22px; }
.orx-catalog-card h3 { margin-top:16px; font-size:21px; font-weight:500; }
.orx-status { display:inline-flex; margin-top:10px; padding:5px 8px; border:1px solid rgba(232,172,113,.4); border-radius:999px; color:#f2c58f; font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.orx-catalog-card dl { display:grid; gap:10px; margin-top:18px; }
.orx-catalog-card dt { color:var(--orx-cyan); font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.orx-catalog-card dd { margin:2px 0 0; color:var(--orx-muted); font-size:14px; line-height:1.45; }
.orx-industries { background:linear-gradient(180deg,#03131b,#041b24); }
.orx-industries-grid { grid-template-columns:repeat(3,1fr); margin-top:40px; }
.orx-industry { padding:24px; }
.orx-industry h3 { font-size:21px; font-weight:500; }
.orx-industry p { margin-top:10px; font-size:14px; }
.orx-industry .orx-link-btn { margin-top:17px; }

/* Confidence / implementation / FAQ */
.orx-confidence { background:linear-gradient(180deg,#062631,#03131b); }
.orx-confidence-grid { grid-template-columns:repeat(3,1fr); margin-top:40px; }
.orx-placeholder { padding:26px; }
.orx-placeholder h3 { font-size:22px; font-weight:500; }
.orx-placeholder strong { display:block; margin-top:15px; color:#f2c58f; font-size:12px; letter-spacing:.11em; text-transform:uppercase; }
.orx-implementation { background:#03131b; }
.orx-timeline { display:grid; grid-template-columns:repeat(7,1fr); gap:10px; margin-top:42px; }
.orx-step { min-height:206px; padding:18px; }
.orx-step-num { color:var(--orx-cyan); font-size:12px; letter-spacing:.15em; }
.orx-step h3 { margin-top:12px; font-size:18px; font-weight:500; }
.orx-step p { margin-top:11px; font-size:13px; }
.orx-faq { background:#061d26; }
.orx-faq-list { display:grid; gap:10px; max-width:920px; margin:38px auto 0; }
.orx-faq-item { border:1px solid var(--orx-line); border-radius:14px; background:rgba(6,29,38,.74); }
.orx-faq-item summary { min-height:60px; display:flex; align-items:center; padding:15px 20px; color:var(--orx-ink); font-size:17px; font-weight:500; cursor:pointer; list-style:none; }
.orx-faq-item summary::after { content:"+"; margin-inline-start:auto; color:var(--orx-cyan); font-size:25px; font-weight:300; }
.orx-faq-item[open] summary::after { content:"−"; }
.orx-faq-item p { padding:0 20px 20px; }

/* Contact and practical footer */
.orx-contact { background:linear-gradient(180deg,#03131b,#062a35); }
.orx-contact-grid { position:relative; display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(28px,6vw,80px); align-items:start; }
/* The octopus peers up at the form from the corner. */
.orx-form-octo { position:absolute; z-index:3; inset-inline-end:-2vw; bottom:-4.5vw; width:clamp(140px,13vw,208px); pointer-events:none; opacity:.95; filter:drop-shadow(0 22px 40px rgba(0,0,0,.6)); }
.orx-form-octo video { width:100%; height:auto; display:block; mix-blend-mode:screen; transform:scaleX(-1); }
@media (max-width:900px){ .orx-form-octo { position:static; width:130px; margin:22px auto 0; } .orx-form-octo video { mix-blend-mode:screen; } }
.orx-form { display:grid; grid-template-columns:1fr 1fr; gap:14px; padding:clamp(22px,3.5vw,40px); }
.orx-field { display:grid; gap:7px; }
.orx-field.wide { grid-column:1/-1; }
.orx-field label { color:#cde7e4; font-size:12px; font-weight:600; letter-spacing:.04em; }
.orx-field input,.orx-field select,.orx-field textarea { min-height:46px; width:100%; padding:10px 12px; border:1px solid rgba(185,212,213,.32); border-radius:10px; background:#061b23; color:var(--orx-ink); font:400 15px/1.4 "Jost",sans-serif; }
.orx-field textarea { min-height:112px; resize:vertical; }
.orx-field input:focus,.orx-field select:focus,.orx-field textarea:focus { outline:2px solid var(--orx-cyan); outline-offset:1px; border-color:var(--orx-cyan); }
.orx-consent { grid-column:1/-1; display:flex; align-items:flex-start; gap:10px; color:#bfd8d7; font-size:13px; line-height:1.45; }
.orx-consent input { width:18px; height:18px; flex:none; margin-top:1px; accent-color:var(--orx-cyan); }
.orx-form-status { grid-column:1/-1; margin:0; font-size:14px!important; }
.orx-form-status[data-state="error"] { color:#f4c07a!important; }
.orx-footer-panel { padding:clamp(28px,5vw,56px); background:#031720; }
.orx-footer-grid { display:grid; grid-template-columns:1.3fr repeat(4,1fr); gap:26px; }
.orx-footer-grid h3 { color:var(--orx-ink); font-size:15px; letter-spacing:.08em; text-transform:uppercase; }
.orx-footer-grid a,.orx-footer-grid span { display:block; margin-top:10px; color:#b5d0cf; font-size:14px; line-height:1.45; text-decoration:none; }
.orx-footer-grid a:hover { color:var(--orx-cyan); }
.orx-unverified { color:#f2c58f!important; }

.orx-screen-dialog { width:min(1100px,calc(100vw - 32px)); max-height:calc(100vh - 32px); padding:18px; border:1px solid var(--orx-line); border-radius:18px; background:#04151d; color:var(--orx-ink); box-shadow:0 40px 100px rgba(0,0,0,.85); }
.orx-screen-dialog::backdrop { background:rgba(0,8,12,.82); }
.orx-screen-dialog form { display:flex; justify-content:flex-end; margin-bottom:10px; }
.orx-screen-dialog p { margin:15px 3px 0; }

@media (max-width:1000px) { .orx-diagram{grid-template-columns:1fr;}.orx-link{width:1px;height:30px;margin:auto;}.orx-link::after{margin:0;transform:translate(-3px,23px) rotate(135deg);}.orx-overview-grid,.orx-catalog-grid,.orx-industries-grid,.orx-confidence-grid{grid-template-columns:repeat(2,1fr)}.orx-role-panel,.orx-contact-grid{grid-template-columns:1fr}.orx-timeline{grid-template-columns:repeat(4,1fr)}.orx-footer-grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:700px) { .orx-section{padding:70px 20px}.orx-title{font-size:36px}.orx-compare-grid,.orx-overview-grid,.orx-catalog-grid,.orx-industries-grid,.orx-confidence-grid,.orx-screens-grid{grid-template-columns:1fr}.orx-timeline{grid-template-columns:repeat(2,1fr)}.orx-footer-grid{grid-template-columns:repeat(2,1fr)}.orx-form{grid-template-columns:1fr}.orx-field.wide{grid-column:auto}.orx-tabs{flex-wrap:nowrap;overflow:auto;padding-bottom:6px}.orx-tab{white-space:nowrap}.hero-value{font-size:16px}.hero-actions{margin-top:18px}.orx-btn{font-size:11px;letter-spacing:.08em}.orx-screen-list{grid-template-columns:repeat(2,minmax(0,1fr));}.orx-screen-choice{font-size:12px} }
/* Interaction pass: centered reveals, tactile comparison, and varied content rhythm. */
.desktop-nav { display:none !important; }
.orx-human { display:none; }
.orx-center-head > .orx-inner > .orx-eyebrow,
.orx-center-head > .orx-inner > .orx-title,
.orx-center-head > .orx-inner > .orx-lead { margin-inline:auto; text-align:center; }
.orx-center-head > .orx-inner > .orx-title { max-width:18ch; }
.orx-reveal-ready > .orx-inner > :is(.orx-eyebrow,.orx-title,.orx-lead) { opacity:0; transform:translateY(-28px); transition:opacity .75s ease,transform .75s cubic-bezier(.22,1,.36,1); }
.orx-reveal-ready > .orx-inner > .orx-title { transition-delay:.08s; }
.orx-reveal-ready > .orx-inner > .orx-lead { transition-delay:.16s; }
.orx-reveal-ready.is-revealed > .orx-inner > :is(.orx-eyebrow,.orx-title,.orx-lead) { opacity:1; transform:none; }
.orx-compare { background:linear-gradient(180deg,#03141c 0%,#06333a 52%,#03151c 100%); }
.orx-compare::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.16; background:radial-gradient(circle at 50% 110%,rgba(119,238,225,.18),transparent 56%); }
.orx-comparator { --compare-position:50%; position:relative; height:min(530px,58vw); min-height:410px; max-width:1080px; margin:44px auto 0; overflow:hidden; border:1px solid rgba(119,238,225,.34); border-radius:24px; background:#071b25; box-shadow:0 36px 90px -45px #000; }
.orx-compare-ocean { position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; opacity:.55; }
.orx-comparator > .after { background:linear-gradient(90deg,rgba(6,48,58,.68),rgba(3,28,36,.44)); }
.orx-compare-state { position:absolute; inset:0; z-index:1; padding:clamp(28px,5vw,66px); display:flex; align-items:center; }
.orx-compare-content { width:min(100%,440px); }
.orx-compare-state.after { justify-content:flex-end; color:#eafffb; text-align:start; }
.orx-compare-state.before { width:var(--compare-position); overflow:hidden; color:#d0d7d6; background:linear-gradient(135deg,rgba(50,55,57,.78),rgba(17,27,31,.84)); border-inline-end:1px solid rgba(119,238,225,.75); filter:saturate(.52); }
.orx-compare-state.before::after { opacity:.045; background-image:radial-gradient(rgba(203,221,219,.48) .45px,transparent .7px); background-size:11px 11px; }
.orx-compare-state.before .orx-compare-content { min-width:340px; }
.orx-compare-state::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.18; background-image:radial-gradient(rgba(255,255,255,.55) .6px,transparent .8px); background-size:5px 5px; }
.orx-state-label { position:relative; z-index:1; display:inline-flex; width:max-content; padding:7px 11px; border-radius:999px; background:rgba(0,14,18,.38); color:var(--orx-ink); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.orx-compare-state ul { position:relative; z-index:1; max-width:480px; margin:22px 0 0; padding:0; list-style:none; display:grid; gap:13px; }
.orx-compare-state li { font-size:15px; line-height:1.45; }
.orx-compare-state li::before { content:"✓"; color:var(--orx-cyan); margin-inline-end:10px; }
.orx-compare-state.before li::before { content:"×"; color:#e8b373; }
.orx-compare-range { position:absolute; z-index:3; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:ew-resize; }
.orx-comparator::before { content:"↔"; position:absolute; z-index:2; top:50%; inset-inline-start:calc(var(--compare-position) - 22px); width:44px; height:44px; display:grid; place-items:center; transform:translateY(-50%); border:2px solid var(--orx-cyan); border-radius:50%; background:#062932; color:var(--orx-cyan); font-weight:700; pointer-events:none; box-shadow:0 0 0 8px rgba(119,238,225,.12); }
.orx-browse-switch { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:9px; margin:32px 0 20px; }
.orx-browse-switch > span { color:var(--orx-muted); font-size:13px; margin-inline-end:5px; }
.orx-browse-switch button { min-height:40px; padding:0 13px; border:1px solid var(--orx-line); border-radius:999px; background:rgba(4,27,34,.7); color:var(--orx-muted); font:600 11px/1 "Jost",sans-serif; letter-spacing:.06em; cursor:pointer; }
.orx-browse-switch button[aria-checked="true"] { background:var(--orx-cyan); border-color:var(--orx-cyan); color:#05262b; }
#modules .orx-screens-grid { grid-template-columns:230px minmax(0,1fr); }
#modules .orx-atlas { display:none; grid-column:1/-1; grid-template-columns:repeat(3,1fr); gap:12px; }
#modules .orx-atlas button { overflow:hidden; padding:0; border:1px solid var(--orx-line); border-radius:13px; background:#061820; color:var(--orx-ink); text-align:start; cursor:pointer; }
#modules .orx-atlas img { display:block; width:100%; aspect-ratio:1.65; object-fit:cover; }
#modules .orx-atlas span { display:block; padding:11px; font-size:13px; }
#modules [data-browse-stage="story"] { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:16px; }
#modules [data-browse-stage="story"] .orx-screen-list { display:none; }
#modules [data-browse-stage="story"] #screen-panel { flex:0 0 min(84vw,820px); scroll-snap-align:center; }
#modules [data-browse-stage="atlas"] .orx-screen-list,#modules [data-browse-stage="atlas"] #screen-panel { display:none; }
#modules [data-browse-stage="atlas"] .orx-atlas { display:grid; }
.orx-industry-gallery { overflow:hidden; padding:42px 0 22px; -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); }
.orx-industry-track { display:flex; gap:18px; width:max-content; animation:orx-marquee 68s linear infinite; }
.orx-industry-gallery:hover .orx-industry-track,.orx-industry-gallery:focus-within .orx-industry-track { animation-play-state:paused; }
.orx-industry-track .orx-industry-dossier { flex:0 0 clamp(300px,29vw,352px); }
@keyframes orx-marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes orx-marquee-rtl { from { transform:translateX(0); } to { transform:translateX(50%); } }
html[dir="rtl"] .orx-industry-track { animation-name:orx-marquee-rtl; }
.orx-industry-dossier { position:relative; min-height:425px; overflow:hidden; scroll-snap-align:center; border:1px solid var(--orx-line); border-radius:20px; background:#071a22; }
.orx-industry-dossier img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.42; transition:transform .5s ease,opacity .5s ease; }
.orx-industry-dossier:hover img { transform:scale(1.08); opacity:.58; }
.orx-industry-dossier > div { position:absolute; inset:auto 0 0; z-index:1; padding:24px; background:linear-gradient(0deg,rgba(1,13,18,.97),rgba(1,13,18,.72),transparent); }
.orx-industry-dossier h3 { margin-top:10px; font-size:28px; font-weight:500; }
.orx-industry-dossier p { margin-top:8px; font-size:14px; }
.orx-gallery-controls { display:flex; justify-content:center; align-items:center; gap:15px; margin-top:12px; }
.orx-gallery-controls button { width:42px; height:42px; border:1px solid var(--orx-line); border-radius:50%; background:#09242c; color:var(--orx-cyan); font-size:18px; cursor:pointer; }
.orx-gallery-controls span { min-width:48px; color:var(--orx-muted); font-size:12px; text-align:center; }
/* ── Confidence — split-view story explorer ─────────────────────────────── */
#customers { overflow:clip; padding-block:clamp(58px,8vh,100px) 0; }
#customers .orx-title { max-width:17ch; font-size:clamp(30px,4vw,56px); }
#customers .orx-lead { max-width:54ch; }
.cx { --cx-ease:cubic-bezier(.22,1,.36,1); position:relative; margin-top:clamp(-80px,-5vh,-30px); }
.cx-sticky { position:sticky; top:0; min-height:100vh; display:grid; grid-template-columns:minmax(0,1fr); align-content:center; padding-block:clamp(30px,6vh,64px); }
.cx[data-cx-mode="tabs"] { margin-top:clamp(26px,5vh,40px); }
[data-cx-mode="tabs"] .cx-sticky { position:static; min-height:0; padding-block:0; }
.cx-grid { display:grid; grid-template-columns:minmax(210px,278px) minmax(0,1fr); gap:clamp(28px,4vw,72px); width:min(1180px,100%); margin-inline:auto; align-items:center; }

/* Left — a quiet timeline, never a menu of boxes */
.cx-nav ol { display:grid; gap:2px; margin:0; padding:0; list-style:none; }
.cx-nav-item { position:relative; width:100%; display:flex; align-items:flex-start; gap:14px; padding-block:13px; padding-inline:18px 4px; border:0; background:none; color:var(--orx-ink); text-align:start; cursor:pointer; opacity:.42; transition:opacity .5s var(--cx-ease),transform .5s var(--cx-ease); }
.cx-nav-item::before { content:""; position:absolute; inset-block:9px; inset-inline-start:0; width:2px; border-radius:2px; background:var(--orx-cyan); opacity:0; transform:scaleY(.3); transform-origin:center; transition:opacity .5s var(--cx-ease),transform .5s var(--cx-ease); }
.cx-nav-item.is-on { opacity:1; }
.cx-nav-item.is-on::before { opacity:1; transform:scaleY(1); box-shadow:0 0 12px rgba(119,238,225,.75); }
.cx-nav-item:hover { opacity:.78; }
.cx-nav-item.is-on:hover { opacity:1; }
.cx-nav-n { flex:none; padding-top:3px; color:#7fa8a8; font:600 10px/1 "Jost",sans-serif; letter-spacing:.16em; transition:color .5s var(--cx-ease); }
.cx-nav-item.is-on .cx-nav-n { color:var(--orx-cyan); }
.cx-nav-t { display:grid; gap:3px; min-width:0; }
.cx-nav-t b { font-size:16px; font-weight:500; line-height:1.25; transition:font-size .5s var(--cx-ease); }
.cx-nav-item.is-on .cx-nav-t b { font-size:18px; }
.cx-nav-t small { color:#89adad; font-size:9.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.cx-nav-item:focus-visible { outline:2px solid var(--orx-cyan); outline-offset:3px; border-radius:10px; }

/* Right — the focal panel */
.cx-stage { position:relative; min-width:0; }
.cx-panel { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:clamp(24px,3vw,52px); padding:clamp(28px,3vw,46px); border:1px solid rgba(119,238,225,.16); border-radius:22px; background:linear-gradient(160deg,rgba(11,46,58,.62),rgba(4,20,28,.72)); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:0 30px 70px -46px #000,inset 0 1px 0 rgba(163,245,234,.08); }
.cx-panel[hidden] { display:none; }
.cx-copy > * { opacity:0; transform:translateY(12px); filter:blur(5px); }
.cx-panel.is-in .cx-copy > * { animation:cxIn .5s var(--cx-ease) both; animation-delay:calc(var(--s,0) * 55ms); }
@keyframes cxIn { from{opacity:0;transform:translateY(12px);filter:blur(5px)} to{opacity:1;transform:none;filter:blur(0)} }
.cx-meta { display:inline-flex; padding:5px 11px; border:1px solid rgba(119,238,225,.26); border-radius:999px; color:var(--orx-cyan); font-size:9.5px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; }
.cx-panel h3 { margin:18px 0 0; font-size:clamp(26px,3vw,42px); font-weight:400; line-height:1.1; letter-spacing:-.012em; }
.cx-panel p { margin:14px 0 0; max-width:46ch; font-size:clamp(14.5px,1.05vw,16.5px); line-height:1.78; }
.cx-feats { display:grid; gap:10px; margin:22px 0 0; padding:20px 0 0; border-top:1px solid rgba(119,238,225,.12); list-style:none; }
.cx-feats li { position:relative; padding-inline-start:19px; color:#c6dddb; font-size:13.5px; line-height:1.5; opacity:0; transform:translateY(12px); filter:blur(5px); }
.cx-panel.is-in .cx-feats li { animation:cxIn .5s var(--cx-ease) both; animation-delay:calc(var(--s,0) * 55ms); }
.cx-feats li::before { content:""; position:absolute; inset-block-start:.55em; inset-inline-start:0; width:5px; height:5px; border-radius:50%; background:var(--orx-cyan); opacity:.85; }
.cx-cta { display:inline-flex; margin-top:24px; color:var(--orx-cyan); font:600 11px/1.3 "Jost",sans-serif; letter-spacing:.14em; text-transform:uppercase; text-decoration:none; }
.cx-cta:hover { color:#b0fff5; }
.cx-art { flex:none; width:clamp(150px,17vw,236px); color:var(--orx-cyan); opacity:.78; }
.cx-art svg { width:100%; height:auto; display:block; overflow:visible; }
.cx-panel.is-in .cx-art { animation:cxArt .7s var(--cx-ease) both; animation-delay:.1s; }
@keyframes cxArt { from{opacity:0;transform:scale(.94)} to{opacity:.78;transform:none} }

/* Ambient motion. transform-box:view-box keeps every origin in viewBox units so
   rotations pivot on the artwork's centre, not each element's own bounding box. */
.cx-art svg * { transform-box:view-box; }
.cx-ring { transform-origin:90px 90px; animation:cxRing 4.2s cubic-bezier(.3,.7,.4,1) var(--d,0s) infinite; }
@keyframes cxRing { 0%{transform:scale(.5);opacity:0} 14%{opacity:.7} 100%{transform:scale(3.1);opacity:0} }
.cx-sweep { transform-origin:90px 90px; animation:cxSpin 9s linear infinite; }
@keyframes cxSpin { to{transform:rotate(360deg)} }
.cx-core { transform-origin:90px 90px; animation:cxCore 4.2s ease-in-out infinite; }
@keyframes cxCore { 0%,100%{transform:scale(.86);opacity:.65} 50%{transform:scale(1.1);opacity:1} }
.cx-sat { animation:cxBlink 4.2s ease-in-out var(--d,0s) infinite; }
@keyframes cxBlink { 0%,100%{opacity:.25} 45%{opacity:1} }
.cx-blip { transform-box:fill-box; transform-origin:center; animation:cxBlip 4.2s ease-out var(--d,0s) infinite; }
@keyframes cxBlip { 0%{opacity:.2;transform:scale(.7)} 22%{opacity:1;transform:scale(1.18)} 60%,100%{opacity:.3;transform:scale(1)} }
.cx-step { animation:cxStep 3.6s ease-in-out var(--d,0s) infinite; }
@keyframes cxStep { 0%,100%{opacity:.4} 22%{opacity:1} }
/* one dash chasing along the path; the offset delta equals the dash period so it loops seamlessly */
.cx-flow { stroke-dasharray:18 110; animation:cxFlow 3.2s linear infinite; }
@keyframes cxFlow { to{stroke-dashoffset:-128} }
.cx-check { stroke-dasharray:70; stroke-dashoffset:70; animation:cxDraw 3.4s cubic-bezier(.22,1,.36,1) infinite; }
@keyframes cxDraw { 0%{stroke-dashoffset:70} 30%,72%{stroke-dashoffset:0} 100%{stroke-dashoffset:70} }
.cx-scan { animation:cxScan 3.4s cubic-bezier(.5,0,.5,1) infinite; }
@keyframes cxScan { 0%{transform:translateY(0);opacity:0} 10%{opacity:.55} 82%{opacity:.4} 100%{transform:translateY(124px);opacity:0} }
.cx-fill { transform-origin:26px 0; animation:cxFill 4.6s cubic-bezier(.4,0,.3,1) var(--d,0s) infinite; }
@keyframes cxFill { 0%,100%{transform:scaleX(.28);opacity:.55} 50%{transform:scaleX(1);opacity:1} }
.cx-tick { animation:cxBlink 4.6s ease-in-out var(--d,0s) infinite; }
.cx-node,.cx-hub { transform-box:fill-box; transform-origin:center; }
.cx-node { animation:cxBreath 3.8s ease-in-out var(--d,0s) infinite; }
@keyframes cxBreath { 0%,100%{transform:scale(.9);opacity:.5} 50%{transform:scale(1.05);opacity:1} }
.cx-hub { animation:cxCoreHub 3.8s ease-in-out infinite; }
@keyframes cxCoreHub { 0%,100%{transform:scale(.94);opacity:.7} 50%{transform:scale(1.08);opacity:1} }
/* A short lit segment running the length of a solid line. The dash period must
   exceed the path length, or the "pulse" repeats and reads as a dashed stroke. */
.cx-run { stroke-dasharray:30 230; animation:cxRun 3.6s cubic-bezier(.45,0,.55,1) var(--d,0s) infinite; }
@keyframes cxRun { to{stroke-dashoffset:-260} }
.cx-pulse { stroke-dasharray:7 45; animation:cxPulse 2.4s cubic-bezier(.45,0,.55,1) var(--d,0s) infinite; }
@keyframes cxPulse { to{stroke-dashoffset:-52} }

@media (prefers-reduced-motion:reduce) {
  .cx-art svg * { animation:none!important; stroke-dashoffset:0!important; }
  .cx-ring { opacity:.3; }
}

@media (max-width:1080px) { .cx-panel { grid-template-columns:minmax(0,1fr); } .cx-art { display:none; } }
@media (max-width:860px) {
  #customers { padding-block:clamp(52px,7vh,80px) clamp(52px,7vh,80px); }
  .cx-grid { grid-template-columns:minmax(0,1fr); gap:20px; }
  /* nav becomes horizontal tabs; the stage below is swipeable */
  .cx-nav { margin-inline:calc(-1 * max(20px,6vw)); padding-inline:max(20px,6vw); overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; }
  .cx-nav::-webkit-scrollbar { display:none; }
  .cx-nav ol { grid-auto-flow:column; grid-auto-columns:max-content; gap:8px; }
  .cx-nav-item { flex-direction:row; align-items:center; gap:9px; padding-block:9px; padding-inline:14px; border:1px solid rgba(119,238,225,.16); border-radius:999px; white-space:nowrap; }
  .cx-nav-item::before { display:none; }
  .cx-nav-item.is-on { border-color:var(--orx-cyan); background:rgba(119,238,225,.1); }
  .cx-nav-t small { display:none; }
  .cx-nav-t b,.cx-nav-item.is-on .cx-nav-t b { font-size:13.5px; }
  .cx-panel { padding:24px 20px; }
}
@media (prefers-reduced-motion:reduce) {
  .cx-copy > *,.cx-feats li { opacity:1!important; transform:none!important; filter:none!important; animation:none!important; }
  .cx-art { animation:none!important; opacity:.5!important; }
  .cx-nav-item,.cx-nav-item::before,.cx-nav-t b { transition:none!important; }
}
/* ── Implementation rollout — scroll-driven horizontal journey ───────────── */
#implementation { overflow:clip; padding-block:clamp(60px,8vh,104px) 0; }
#implementation .orx-title { max-width:17ch; font-size:clamp(30px,4vw,56px); }
#implementation .orx-lead { max-width:52ch; margin-top:15px; }
.rl { --rl-ease:cubic-bezier(.22,1,.36,1); position:relative; margin-top:clamp(-90px,-6vh,-40px); }
/* minmax(0,1fr): without it the max-content rail blows the grid column out to
   its full scroll width and shoves every sibling off-screen. */
.rl-sticky { position:sticky; top:0; min-height:100vh; display:grid; grid-template-columns:minmax(0,1fr); align-content:center; gap:clamp(18px,2.4vh,30px); padding-block:clamp(24px,5vh,54px); }
[data-rl-mode="carousel"] .rl-sticky { position:static; min-height:0; }

/* Instruction + scroll cue, retired once the reader engages */
.rl-hint { display:flex; align-items:center; justify-content:center; gap:11px; margin:0; color:var(--orx-muted); font-size:11.5px!important; letter-spacing:.15em; text-transform:uppercase; transition:opacity .55s var(--rl-ease),transform .55s var(--rl-ease); }
.rl.is-engaged .rl-hint { opacity:0; transform:translateY(-6px); pointer-events:none; }
.rl-mouse { position:relative; width:17px; height:26px; flex:none; border:1px solid rgba(119,238,225,.45); border-radius:9px; }
.rl-mouse i { position:absolute; inset-inline-start:50%; top:5px; width:2px; height:5px; margin-inline-start:-1px; border-radius:2px; background:var(--orx-cyan); animation:rlWheel 1.9s var(--rl-ease) infinite; }
@keyframes rlWheel { 0%,100%{opacity:0;transform:translateY(0)} 25%{opacity:1} 70%{opacity:0;transform:translateY(9px)} }
.rl-hint-m { display:none; }

/* Progress: inactive track, filled line, numbered nodes, live counter */
.rl-progress { position:relative; width:min(880px,100%); margin-inline:auto; padding-inline:6px; }
.rl-track { position:absolute; inset-block-start:15px; inset-inline:6px; height:2px; border-radius:2px; background:rgba(119,238,225,.14); }
.rl-fill { display:block; height:100%; border-radius:2px; background:linear-gradient(90deg,rgba(119,238,225,.5),var(--orx-cyan)); box-shadow:0 0 10px rgba(119,238,225,.4); transform:scaleX(0); transform-origin:left center; transition:transform .18s linear; }
[dir="rtl"] .rl-fill { transform-origin:right center; background:linear-gradient(270deg,rgba(119,238,225,.5),var(--orx-cyan)); }
.rl-nodes { position:relative; display:flex; justify-content:space-between; margin:0; padding:0; list-style:none; }
.rl-node { width:32px; height:32px; display:grid; place-items:center; padding:0; border:1px solid rgba(119,238,225,.28); border-radius:50%; background:#062028; color:#8fb6b6; font:600 10px/1 "Jost",sans-serif; letter-spacing:.06em; cursor:pointer; transition:transform .45s var(--rl-ease),background .35s ease,color .35s ease,border-color .35s ease,box-shadow .35s ease; }
.rl-node.is-done { border-color:rgba(119,238,225,.6); color:var(--orx-cyan); }
.rl-node.is-on { transform:scale(1.28); border-color:var(--orx-cyan); background:var(--orx-cyan); color:#04262b; box-shadow:0 0 0 5px rgba(119,238,225,.12); }
.rl-meta { display:flex; align-items:center; justify-content:center; gap:14px; margin:16px 0 0; min-height:16px; }
.rl-phase { color:var(--orx-cyan); font-size:11px; font-weight:600; letter-spacing:.17em; text-transform:uppercase; }
.rl-count { color:#8fb6b6; font:600 11px/1 "Jost",sans-serif; letter-spacing:.16em; }
.rl-count b { color:var(--orx-ink); font-weight:600; }
.rl-count i { margin-inline:6px; font-style:normal; opacity:.4; }

/* Stage: side arrows flank the rail so nothing sits under the page decorations */
.rl-stage { position:relative; display:flex; align-items:center; gap:clamp(8px,1.4vw,18px); }
.rl-viewport { flex:1 1 auto; min-width:0; overflow:hidden; }
.rl-viewport:focus-visible { outline:2px solid var(--orx-cyan); outline-offset:6px; border-radius:20px; }
.rl-viewport.is-grabbing { cursor:grabbing; }
.rl-rail { display:flex; align-items:stretch; gap:clamp(16px,1.8vw,26px); width:max-content; margin:0; padding:14px 0; list-style:none; will-change:transform; }
.rl-card { flex:0 0 clamp(300px,40vw,480px); transform-origin:center; transition:opacity .5s var(--rl-ease),transform .5s var(--rl-ease),filter .5s var(--rl-ease); }
.rl-card-in { height:100%; display:flex; flex-direction:column; padding:clamp(24px,2.4vw,36px); border:1px solid rgba(119,238,225,.15); border-radius:20px; background:linear-gradient(180deg,rgba(10,43,53,.9),rgba(3,17,24,.96)); box-shadow:0 26px 60px -40px #000; text-align:start; transition:border-color .5s var(--rl-ease),box-shadow .5s var(--rl-ease),background .5s var(--rl-ease); }
.rl-card.is-active .rl-card-in { border-color:rgba(119,238,225,.42); background:linear-gradient(180deg,rgba(13,54,66,.94),rgba(4,20,28,.97)); box-shadow:0 34px 74px -40px #000,0 0 0 1px rgba(119,238,225,.1),0 0 34px -12px rgba(119,238,225,.28); }
.rl-top { display:flex; align-items:center; gap:12px; }
.rl-num { color:var(--orx-cyan); font:600 12px/1 "Jost",sans-serif; letter-spacing:.2em; }
.rl-tag { padding:5px 10px; border:1px solid rgba(119,238,225,.2); border-radius:7px; background:rgba(119,238,225,.06); color:#bfe4e0; font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.rl-card h3 { margin:16px 0 0; font-size:clamp(21px,1.9vw,28px); font-weight:500; line-height:1.18; }
.rl-card p { margin:11px 0 0; font-size:clamp(14px,1vw,15.5px); line-height:1.72; }
.rl-block { margin:18px 0 0; padding:15px 0 0; border-top:1px solid rgba(119,238,225,.12); }
.rl-foot { margin-top:auto; }
.rl-label { margin:0; color:var(--orx-cyan); font-size:10px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.rl-dur { margin:8px 0 0!important; color:var(--orx-ink)!important; font-size:15px!important; font-weight:500; letter-spacing:.01em; }
.rl-acts { margin:12px 0 0; padding:0; display:grid; gap:9px; list-style:none; }
.rl-acts li { position:relative; padding-inline-start:18px; color:#c6dddb; font-size:13.5px; line-height:1.5; }
.rl-acts li::before { content:""; position:absolute; inset-block-start:.55em; inset-inline-start:0; width:5px; height:5px; border-radius:50%; background:var(--orx-cyan); opacity:.85; }
/* Visible-but-quiet by default so neighbours read as real content, then lifted
   with a stagger once the card becomes active. */
.rl-line { opacity:.5; transform:translateY(7px); transition:opacity .5s var(--rl-ease),transform .5s var(--rl-ease); }
.rl-card.is-active .rl-line { opacity:1; transform:none; transition-delay:calc(var(--s) * 55ms); }
.rl-arrow { width:44px; height:44px; flex:none; display:grid; place-items:center; padding:0; border:1px solid rgba(119,238,225,.24); border-radius:50%; background:rgba(5,26,33,.7); color:var(--orx-cyan); cursor:pointer; transition:transform .3s var(--rl-ease),background .3s ease,border-color .3s ease,opacity .3s ease; }
.rl-arrow svg { width:18px; height:18px; }
.rl-arrow:hover { transform:scale(1.07); border-color:var(--orx-cyan); background:rgba(9,40,48,.9); }
[dir="rtl"] .rl-arrow svg { transform:scaleX(-1); }

@media (max-width:860px) {
  #implementation { padding-block:clamp(52px,7vh,80px) clamp(52px,7vh,80px); }
  .rl { margin-top:clamp(26px,5vh,40px); }
  .rl-sticky { gap:16px; padding-block:0; }
  .rl-hint-d { display:none; } .rl-hint-m { display:inline; }
  .rl-mouse { display:none; }
  .rl-nodes { display:none; }
  .rl-track { position:static; inset:auto; width:100%; }
  .rl-meta { justify-content:space-between; margin-top:12px; }
  .rl-arrow { display:none; }
  /* native scroll-snap: the page keeps its own vertical scrolling */
  .rl-viewport { overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scrollbar-width:none; -ms-overflow-style:none; margin-inline:calc(-1 * max(20px,6vw)); padding-inline:max(20px,6vw); }
  .rl-viewport::-webkit-scrollbar { display:none; }
  .rl-rail { width:auto; gap:14px; padding:6px 0; }
  .rl-card { flex:0 0 min(84%,340px); scroll-snap-align:center; opacity:1!important; transform:none!important; filter:none!important; }
  .rl-line { opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce) {
  .rl-mouse i { animation:none; }
  .rl-card,.rl-card-in,.rl-line,.rl-node,.rl-fill { transition:none!important; }
  .rl-line { opacity:1; transform:none; }
}

/* Ocean background + drifting fish for confidence and FAQ */
.orx-has-ocean { position:relative; }
.orx-ocean-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.26; z-index:0; pointer-events:none; }
.orx-has-ocean > .orx-inner { position:relative; z-index:2; }
/* For retained sections whose children aren't z-indexed: isolate the section and
   drop the ocean behind its content but still above its own background. */
#modmap, #oravex-wave { position:relative; isolation:isolate; }
.orx-ocean-bg--behind { z-index:-1; opacity:.2; }
.orx-fish { position:absolute; inset:0; z-index:1; overflow:hidden; pointer-events:none; }
.orx-fish-swim { position:absolute; inset-inline-start:-18%; animation:orx-swim var(--dur,28s) linear infinite; animation-delay:var(--delay,0s); opacity:.42; }
.orx-fish-swim img { width:var(--w,120px); height:auto; display:block; filter:saturate(.75) brightness(.85); }
@keyframes orx-swim { from { transform:translateX(0); } to { transform:translateX(136vw); } }
@keyframes orx-swim-rtl { from { transform:translateX(0); } to { transform:translateX(-136vw); } }
html[dir="rtl"] .orx-fish-swim { inset-inline-start:auto; inset-inline-end:-18%; animation-name:orx-swim-rtl; }
html[dir="rtl"] .orx-fish-swim img { transform:scaleX(-1); }
@media (max-width:700px){.orx-comparator{height:500px;min-height:0}.orx-compare-state{padding:26px}.orx-compare-state li{font-size:13px}.orx-industry-track .orx-industry-dossier{flex-basis:78vw}.orx-route-step{flex-basis:78vw}.orx-route-step .orx-step-num{width:54px;height:54px}.orx-confidence-toggle strong{font-size:17px}#modules .orx-atlas{grid-template-columns:1fr 1fr}.orx-browse-switch{gap:6px}.orx-browse-switch > span{width:100%;text-align:center}.orx-browse-switch button{font-size:10px;padding:0 10px}}

/* Product overview — tabbed areas, one product screen read at full size. */
.orx-visual-note { max-width:620px; margin:14px auto 0; color:#92b2b1!important; font-size:13px!important; text-align:center; }
.orx-ov-tabs { justify-content:center; margin-top:30px; }
.orx-ov-panel { display:grid; grid-template-columns:minmax(0,.44fr) minmax(0,.56fr); grid-template-areas:"info visual" "foot foot"; align-items:center; gap:clamp(22px,3vw,46px); margin-top:22px; padding:clamp(22px,2.6vw,40px); }
.orx-ov-info { grid-area:info; min-width:0; }
.orx-ov-info h3 { margin:0; font-size:clamp(23px,2.4vw,34px); font-weight:400; line-height:1.16; }
.orx-ov-info p { margin-top:12px; font-size:15px; }
.orx-ov-points { display:grid; gap:10px; margin:22px 0 0; padding:0; list-style:none; }
.orx-ov-points li { position:relative; padding-inline-start:21px; color:var(--orx-muted); font-size:14px; line-height:1.5; }
.orx-ov-points li::before { content:""; position:absolute; inset-block-start:.55em; inset-inline-start:2px; width:7px; height:7px; border-radius:50%; background:var(--orx-cyan); box-shadow:0 0 0 4px rgba(119,238,225,.13); }
.orx-ov-visual { position:relative; grid-area:visual; min-width:0; overflow:hidden; padding:clamp(14px,1.7vw,26px); border:1px solid rgba(119,238,225,.16); border-radius:18px; background:#061b23; }
.orx-ov-wash { position:absolute; z-index:0; inset:0; width:100%; height:100%; display:block; object-fit:cover; opacity:.55; }
.orx-ov-visual::after { content:""; position:absolute; z-index:1; inset:0; background:linear-gradient(140deg,rgba(4,20,27,.5),rgba(3,17,24,.88)); }
.orx-ov-visual .orx-screen { position:relative; z-index:2; }
.orx-ov-visual .orx-screen img { aspect-ratio:1.62; object-fit:cover; object-position:top; }
.orx-ov-foot { grid-area:foot; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; margin-top:4px; padding-top:20px; border-top:1px solid var(--orx-line); }
.orx-ov-foot .orx-link-btn { margin-top:0; }
.orx-ov-count { color:#89acab; font:600 12px/1 "Jost",sans-serif; letter-spacing:.16em; }
.orx-ov-count b { color:var(--orx-cyan); font-weight:600; }
.orx-ov-count i { margin-inline:7px; font-style:normal; opacity:.4; }
.orx-ov-panel.is-swapped .orx-ov-info,
.orx-ov-panel.is-swapped .orx-ov-visual,
.orx-ov-panel.is-swapped .orx-ov-foot { animation:orxOvIn .5s cubic-bezier(.22,1,.36,1) both; }
.orx-ov-panel.is-swapped .orx-ov-visual { animation-delay:.06s; }
.orx-ov-panel.is-swapped .orx-ov-foot { animation-delay:.12s; }
@keyframes orxOvIn { from { opacity:0; transform:translateY(15px); } }
@media (max-width:900px){ .orx-ov-panel{ grid-template-columns:minmax(0,1fr); grid-template-areas:"visual" "info" "foot"; } }
@media (max-width:700px){ .orx-ov-tabs{ justify-content:flex-start; } .orx-ov-info h3{ font-size:22px; } }

@media (prefers-reduced-motion:reduce){.orx-ov-panel.is-swapped :is(.orx-ov-info,.orx-ov-visual,.orx-ov-foot){animation:none!important;}}

/* Integrations — centered title on top + sticky stacking cards (pile up on scroll) */
/* `overflow:hidden` from .orx-section would make this a scroll container and
   break the stacked cards' position:sticky — clip contains without scrolling. */
#integrations { overflow:visible; }
#integrations .orx-inner { width:min(1040px,100%); }
#integrations .orx-title { font-size:clamp(28px,3.4vw,50px); }
/* Full-frame cards that stack: each one holds the viewport, the next scrolls over it. */
.orx-stack { --stack-top:92px; list-style:none; margin:52px auto 0; padding:0; max-width:1040px; }
.orx-stack-item { position:sticky; top:calc(var(--stack-top) + var(--i) * 24px); }
.orx-stack-item + .orx-stack-item { margin-top:22vh; }
/* Real content, not padding — sticky is constrained by the containing block's
   content box, so trailing padding on .orx-stack buys the last card no dwell. */
.orx-stack-tail { height:62vh; pointer-events:none; }
/* Card hugs its content, capped so it can never outgrow the viewport. */
.orx-stack-card { position:relative; overflow:hidden; height:auto; max-height:calc(100vh - var(--stack-top) - 84px); display:flex; flex-direction:column; justify-content:center; padding:clamp(28px,3.2vw,50px); border:1px solid rgba(119,238,225,.19); border-radius:24px; background:linear-gradient(180deg,rgba(11,47,58,.96),rgba(3,17,24,.99)); box-shadow:0 -8px 44px -26px #000, 0 40px 90px -44px #000, inset 0 1px 0 rgba(163,245,234,.1), inset 0 -60px 90px -70px rgba(0,0,0,.95); transform-origin:top center; transition:transform .25s ease,filter .25s ease; will-change:transform; align-items:center; text-align:center; }
.orx-stack-card > .orx-ocean-bg { opacity:.3; }
.orx-stack-card::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(170deg,rgba(4,23,31,.78),rgba(2,13,19,.93)); }
.orx-stack-inner { position:relative; z-index:2; width:100%; max-width:760px; margin-inline:auto; display:grid; gap:clamp(20px,2.2vw,28px); }

/* Header — badge + title, lifted by a soft radial glow */
.orx-stack-head { position:relative; display:grid; justify-items:center; gap:15px; }
.orx-stack-head::before { content:""; position:absolute; z-index:-1; inset-inline-start:50%; inset-block-start:-24%; width:min(430px,86%); aspect-ratio:1.55; transform:translateX(-50%); pointer-events:none; background:radial-gradient(ellipse at center,rgba(119,238,225,.14),rgba(119,238,225,.04) 46%,transparent 70%); }
.orx-stack-card .orx-status { display:inline-flex; align-self:center; margin-top:0; border-color:rgba(119,238,225,.4); color:var(--orx-cyan); }
.orx-stack-card h3 { margin:0; font-size:clamp(30px,3.5vw,48px); font-weight:500; line-height:1.05; letter-spacing:-.012em; }

/* Fact blocks — soft tint + hairline border, no card-inside-a-card */
.orx-stack-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin:0; text-align:start; }
.orx-fact { padding:clamp(15px,1.5vw,21px) clamp(16px,1.6vw,23px); border:1px solid rgba(119,238,225,.13); border-radius:15px; background:linear-gradient(180deg,rgba(119,238,225,.06),rgba(119,238,225,.014)); }
.orx-stack-card dt { display:flex; align-items:center; gap:9px; color:var(--orx-cyan); font-size:10.5px; font-weight:600; letter-spacing:.17em; text-transform:uppercase; }
.orx-fact-icon { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; flex:none; border-radius:7px; background:rgba(119,238,225,.1); }
.orx-stack-card dt svg { width:14px; height:14px; flex:none; }
.orx-stack-card dd { margin:13px 0 0; max-width:42ch; color:#d3e7e5; font-size:clamp(14.5px,1.02vw,16px); line-height:1.78; }
.orx-chips { display:flex; flex-wrap:wrap; gap:7px; margin:0; padding:0; list-style:none; }
.orx-chips li { padding:6px 11px; border:1px solid rgba(119,238,225,.16); border-radius:8px; background:rgba(4,26,33,.5); color:#dcefed; font-size:13px; line-height:1.35; }

/* Workflow strip — thin glowing connectors, Orbit as the lit middle node */
.orx-flow { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:0; padding:clamp(12px,1.25vw,16px) clamp(16px,1.8vw,26px); border:1px solid rgba(119,238,225,.12); border-radius:999px; background:rgba(119,238,225,.032); list-style:none; }
.orx-flow li { display:flex; align-items:center; color:#c3dcda; font-size:12.5px; letter-spacing:.015em; }
.orx-flow li.is-core { color:var(--orx-cyan); }
.orx-flow li + li::before { content:""; width:clamp(20px,3.4vw,56px); height:1px; flex:none; margin-inline:clamp(9px,1.15vw,17px); background:linear-gradient(90deg,rgba(119,238,225,.1),rgba(119,238,225,.72),rgba(119,238,225,.1)); box-shadow:0 0 7px rgba(119,238,225,.4); }
.orx-flow-node { display:inline-flex; align-items:center; gap:8px; }
.orx-flow-node::before { content:""; width:5px; height:5px; flex:none; border-radius:50%; background:currentColor; box-shadow:0 0 8px currentColor; }

@media(max-width:900px){.orx-stack{--stack-top:74px}.orx-stack-item{top:calc(var(--stack-top) + var(--i)*16px)}.orx-stack-item + .orx-stack-item{margin-top:12vh}.orx-stack-card{max-height:calc(100vh - var(--stack-top) - 56px);overflow-y:auto}
/* auto margins, not justify-content:center — centring a flex item that may
   overflow makes its top unreachable when the card scrolls. */
.orx-stack-inner{margin-block:auto}
.orx-stack-facts{grid-template-columns:minmax(0,1fr)}
.orx-stack-card dd{max-width:none}
.orx-flow{flex-direction:column;border-radius:18px;padding:16px 18px}
/* stack the connector above its node — as a row it would sit beside the text */
.orx-flow li{flex-direction:column}
.orx-flow li + li::before{width:1px;height:17px;margin:9px 0;background:linear-gradient(180deg,rgba(119,238,225,.1),rgba(119,238,225,.72),rgba(119,238,225,.1))}}
@media (prefers-reduced-motion:reduce){.orx-stack-item{position:static;margin-top:16px!important}.orx-stack-card{max-height:none;transform:none!important;filter:none!important}}

@media (prefers-reduced-motion:reduce){.orx-reveal-ready > .orx-inner > :is(.orx-eyebrow,.orx-title,.orx-lead){opacity:1;transform:none}.orx-industry-dossier img,.orx-confidence-item{transition:none!important;}.orx-fish{display:none;}.orx-industry-track{animation:none;}.orx-industry-gallery{overflow-x:auto;}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;} .orx-btn:hover{transform:none;} }

/* ═══════════ Liquid pill button — matches the "See Orbit in action" CTA ═══════════ */
.orx-liquid-btn { position:relative; overflow:hidden; display:inline-flex; align-items:center; justify-content:center;
  padding:15px 32px; border:1px solid rgba(70,216,198,.55); border-radius:999px; background:transparent;
  color:var(--orx-ink); font:500 12px/1 "Jost",sans-serif; letter-spacing:.2em; text-transform:uppercase; cursor:pointer;
  transition:transform .35s cubic-bezier(.22,1,.36,1), border-color .35s;
  animation:orxCtaPing 3.6s cubic-bezier(.22,1,.36,1) infinite; }
.orx-liquid-btn .lb-label { position:relative; z-index:2; text-shadow:0 1px 10px rgba(2,14,20,.7); }
.orx-liquid-btn::before, .orx-liquid-btn::after { content:""; position:absolute; z-index:1; left:50%; top:58%;
  width:232%; aspect-ratio:1; border-radius:42% 45% 43% 44%;
  background:linear-gradient(180deg, rgba(120,240,225,.98), #46d8c6 42%, #10b0be 100%);
  animation:orxCtaSlosh 7s linear infinite;
  transition:top 1.05s cubic-bezier(.3,.85,.25,1); will-change:transform,top; }
.orx-liquid-btn::after { border-radius:46% 42% 45% 43%; opacity:.45; animation:orxCtaSlosh 10.5s linear infinite reverse; }
.orx-liquid-btn:hover { transform:translateY(-2px); border-color:rgba(70,216,198,.9); }
.orx-liquid-btn:hover::before, .orx-liquid-btn:hover::after { top:-55%; }
.orx-liquid-btn:focus-visible { outline:2px solid var(--orx-cyan); outline-offset:3px; }
@keyframes orxCtaSlosh { from{transform:translateX(-50%) rotate(0deg);} to{transform:translateX(-50%) rotate(360deg);} }
@keyframes orxCtaPing { 0%,34%{box-shadow:0 0 0 0 rgba(3,142,158,.5);} 72%{box-shadow:0 0 0 20px rgba(3,142,158,0);} 100%{box-shadow:0 0 0 0 rgba(3,142,158,0);} }
@media (prefers-reduced-motion:reduce){
  .orx-liquid-btn { animation:none; }
  .orx-liquid-btn::before, .orx-liquid-btn::after { animation:none; top:40%; }
}

/* ═══════════ Module-screen gallery ═══════════ */
.orx-gal { position:fixed; inset:0; margin:auto; width:min(1460px,calc(100vw - 32px)); max-width:none; height:min(940px,calc(100vh - 32px)); padding:0;
  border:1px solid var(--orx-line); border-radius:20px; background:#04151d; color:var(--orx-ink);
  box-shadow:0 40px 100px rgba(0,0,0,.85); overflow:hidden; }
.orx-gal::backdrop { background:rgba(0,8,12,.88); backdrop-filter:blur(3px); }
.orx-gal-inner { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr) auto; height:100%; min-width:0; }
.orx-gal-head { min-width:0; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 22px; border-bottom:1px solid var(--orx-line); }
.orx-gal-head h2 { margin:0; overflow-wrap:anywhere; font:600 15px/1.3 "Jost",sans-serif; letter-spacing:.02em; }
.orx-gal-head p { margin:2px 0 0; font-size:12px; color:var(--orx-muted); }
.orx-gal-count { font:600 12px/1 "Jost",sans-serif; letter-spacing:.14em; color:var(--orx-cyan); white-space:nowrap; }
.orx-gal-close { border:1px solid var(--orx-line); background:transparent; color:var(--orx-ink);
  width:34px; height:34px; border-radius:50%; cursor:pointer; font-size:17px; line-height:1; }
.orx-gal-close:hover { border-color:var(--orx-cyan); color:var(--orx-cyan); }
.orx-gal-stage { display:grid; min-width:0; grid-template-columns:minmax(0,1.55fr) minmax(280px,.85fr); gap:0; min-height:0; }
.orx-gal-shot { display:flex; align-items:center; justify-content:center; min-width:0; min-height:0;
  padding:22px; background:radial-gradient(120% 90% at 50% 0%, rgba(22,171,184,.14), transparent 70%); }
.orx-gal-shot img { max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;
  border:1px solid var(--orx-line); border-radius:12px; box-shadow:0 24px 60px rgba(0,0,0,.6); }
.orx-gal-copy { display:flex; flex-direction:column; gap:12px; min-width:0; overflow-y:auto;
  padding:26px 26px 26px 24px; border-inline-start:1px solid var(--orx-line); background:rgba(3,18,26,.6); }
.orx-gal-area { font:600 11px/1 "Jost",sans-serif; letter-spacing:.18em; text-transform:uppercase; color:var(--orx-cyan); }
.orx-gal-copy h3 { margin:0; font:600 22px/1.25 "Jost",sans-serif; }
.orx-gal-copy p { margin:0; font-size:14px; line-height:1.7; color:var(--orx-muted); }
.orx-gal-note { margin-top:auto !important; padding-top:14px; border-top:1px solid var(--orx-line); font-size:11.5px !important; }
.orx-gal-foot { min-width:0; display:flex; align-items:center; gap:12px; padding:12px 16px; border-top:1px solid var(--orx-line); }
.orx-gal-nav { flex:none; width:38px; height:38px; border-radius:50%; border:1px solid var(--orx-line);
  background:transparent; color:var(--orx-ink); cursor:pointer; font-size:16px; line-height:1; }
.orx-gal-nav:hover { border-color:var(--orx-cyan); color:var(--orx-cyan); }
.orx-gal-nav[disabled] { opacity:.3; cursor:default; }
.orx-gal-rail { min-width:0; display:flex; gap:8px; overflow-x:auto; padding:2px; scrollbar-width:thin; }
.orx-gal-thumb { flex:none; width:96px; height:60px; padding:0; border:1px solid var(--orx-line); border-radius:8px;
  background:#04151d; overflow:hidden; cursor:pointer; opacity:.55; transition:opacity .2s, border-color .2s; }
.orx-gal-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.orx-gal-thumb:hover { opacity:.85; }
.orx-gal-thumb[aria-current="true"] { opacity:1; border-color:var(--orx-cyan); box-shadow:0 0 0 1px var(--orx-cyan); }
@media (max-width:900px){
  .orx-gal { height:calc(100vh - 24px); }
  .orx-gal-stage { grid-template-columns:1fr; grid-template-rows:minmax(0,1fr) auto; }
  .orx-gal-copy { border-inline-start:0; border-top:1px solid var(--orx-line); padding:18px; max-height:44%; }
  .orx-gal-shot { padding:14px; }
}

/* ── Menu: section tier ──────────────────────────────────────────────────────
   enhanceMenu() renders c.nav here so the ten information sections stop being
   unreachable. That roughly doubles the item count, so .menu — a centred flex
   column with no scroll — needs a scroll guard. `safe center` keeps the first
   item reachable once the list overflows; browsers without it drop only that
   declaration and keep the inline `center`. */
.menu { overflow-y:auto; padding:calc(88px + var(--safe-top,0px)) 24px calc(40px + var(--safe-bottom,0px)); }
.menu { justify-content:safe center; }
.menu-sections { display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap:12px 26px; max-width:min(720px,86vw); margin-top:4px; padding-top:26px;
  border-top:1px solid rgba(234,247,247,.16); }
.menu-sections a { font-size:clamp(11px,1.15vw,13px); letter-spacing:.22em; text-indent:.22em; }
.orx-contact-direct { margin-top:14px; font-size:14px; color:var(--orx-muted); }
.orx-contact-direct a { color:var(--orx-cyan); text-decoration:none; border-bottom:1px solid rgba(119,238,225,.4); }
.orx-contact-direct a:hover { border-bottom-color:var(--orx-cyan); }

/* ── Scrollbar ───────────────────────────────────────────────────────────────
   The default light scrollbar is jarring against a near-black ocean page, and
   on Windows it is wide enough to read as a UI element. Thin, brand-tinted,
   and applied to nested scrollers (gallery rail, menu) as well as the page. */
html { scrollbar-width: thin; scrollbar-color: rgba(119,238,225,.42) rgba(4,16,28,.55); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: rgba(4,16,28,.55); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(119,238,225,.55), rgba(3,142,158,.8));
  border-radius: 999px; border: 2px solid rgba(4,16,28,.9);
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, rgba(119,238,225,.9), rgba(3,142,158,.95)); }
::-webkit-scrollbar-corner { background: transparent; }
