/* ── REBOTA WORLD — sector chapters (unitedcarriers-grade pacing) ──
   Full screens, no boxes: a machine crosses a giant word; a vehicle drives
   the milestone road while the stages scroll beside it. Monochrome art,
   Rebota blue only for emphasis. */

/* 1 · ride */
.ux-ride { position: relative; height: 240vh; background: #fff; }
.ux-ride-pin { position: sticky; top: 0; height: 100svh; overflow: hidden; display: grid; grid-template-rows: 46% 54%; }
.ux-sky { position: relative; background: #fff; overflow: hidden; }
.ux-meta { position: absolute; top: 92px; left: var(--gut); color: var(--tx-3); z-index: 3; } .ux-meta b { color: var(--blue); font-weight: 500; margin-right: 8px; }
.ux-word { position: absolute; left: 0; bottom: -0.12em; font: 800 clamp(120px, 23vw, 420px)/.8 var(--f-d); text-transform: uppercase; letter-spacing: -.03em; color: #EDEFF2; white-space: nowrap; will-change: transform; }
.ux-obj { position: absolute; left: 0; bottom: -4px; height: 78%; width: auto; aspect-ratio: 2.3 / 1; max-width: none; z-index: 2; will-change: transform; filter: grayscale(1) contrast(1.08) drop-shadow(0 18px 18px rgba(0,0,0,.22)); }
.ux-ground { background: #111; color: #fff; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; gap: clamp(24px, 4vh, 48px); }
.ux-ground::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: rgba(255,255,255,.18); }
.ux-ground-hd { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: end; width: 100%; }
.ux-ground-hd h2 { font-size: clamp(28px, 3.4vw, 54px); line-height: .95; }
.ux-ground-hd p { color: rgba(255,255,255,.62); font-size: 15.5px; max-width: 56ch; }
.ux-belt { display: flex; padding-left: var(--gut); will-change: transform; }
.ux-col { flex: 0 0 min(430px, 80vw); padding: 0 40px 0 0; margin-right: 40px; border-right: 1px solid rgba(255,255,255,.14); }
.ux-col h3 { font-size: clamp(22px, 2.2vw, 34px); line-height: .98; margin-bottom: 14px; }
.ux-col p { color: rgba(255,255,255,.6); font-size: 14.5px; line-height: 1.55; }

/* 2 · milestone road */
.ux-mile { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) clamp(180px, 16vw, 280px) minmax(0, 1fr); background: #fff; }
.ux-mile-l { position: relative; }
.ux-mile-pin { position: sticky; top: 0; height: 100svh; display: flex; flex-direction: column; padding: 110px var(--gut) 48px; }
.ux-count { color: var(--tx-3); margin-bottom: 26px; } .ux-count .ux-n { color: var(--blue); } .ux-count .ux-cur { color: var(--tx); }
.ux-mile-h { font-size: clamp(40px, 5.6vw, 104px); line-height: .9; max-width: 9ch; color: var(--tx); }
.ux-mile-h span { color: #A3A9B3; }
.ux-mile-p { margin-top: auto; font-size: 17px; line-height: 1.5; color: var(--tx); max-width: 36ch; }
.ux-road { position: relative; background: #0E0E0E; }
.ux-road-pin { position: sticky; top: 0; height: 100svh; overflow: hidden; display: grid; place-items: center; }
.ux-lanes { position: absolute; inset: 0; background: repeating-linear-gradient(to bottom, #3A3A3A 0 44px, transparent 44px 128px) 33% 0 / 4px 128px repeat-y, repeating-linear-gradient(to bottom, #3A3A3A 0 44px, transparent 44px 128px) 67% 0 / 4px 128px repeat-y; }
.ux-veh { position: relative; width: 36%; max-width: 92px; height: auto; transition: transform .8s var(--ease); z-index: 1; filter: drop-shadow(0 10px 14px rgba(0,0,0,.5)); }
.ux-stages { list-style: none; margin: 0; padding: 30vh var(--gut) 40vh; }
.ux-stages > li { min-height: 62vh; padding: 28px 0; border-bottom: 1px solid var(--line); opacity: .28; transition: opacity .5s; display: flex; flex-direction: column; justify-content: center; max-width: 440px; }
.ux-stages > li.on { opacity: 1; }
.ux-i { color: var(--blue); margin-bottom: 14px; }
.ux-stages h3 { font-size: clamp(30px, 3vw, 50px); line-height: .92; color: var(--tx); }
.ux-lead { font-weight: 700; color: var(--tx) !important; margin: 14px 0 8px; font-size: 16.5px !important; }
.ux-stages p { color: var(--tx-2); font-size: 15px; line-height: 1.55; }
.ux-rb { margin-top: 14px; } .ux-rb b { display: block; font: 500 11.5px var(--f-m); letter-spacing: .08em; text-transform: uppercase; color: var(--blue); margin-bottom: 4px; }
.ux-rec { margin-top: 14px; color: var(--tx) !important; font-size: 11px !important; line-height: 1.9 !important; } .ux-rec i { font-style: normal; color: var(--blue); margin: 0 4px; }

/* 3 · coverage + FAQ */
.ux-cover { background: #fff; padding: clamp(40px, 7vw, 100px) 0 clamp(60px, 9vw, 120px); border-top: 1px solid var(--line); }
.ux-cover-hd { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; }
.ux-cover-hd h2 { font-size: clamp(26px, 3.2vw, 48px); max-width: 22ch; }
.ux-cover-hd a { color: var(--blue); font-weight: 600; }
.ux-faq { margin-top: 28px; border-top: 1px solid var(--tx); }
.ux-faq details { border-bottom: 1px solid var(--line); }
.ux-faq summary { cursor: pointer; padding: 20px 0; font: 700 18px var(--f-t); list-style: none; display: flex; justify-content: space-between; gap: 20px; }
.ux-faq summary::-webkit-details-marker { display: none; }
.ux-faq summary::after { content: "+"; color: var(--blue); font-size: 24px; line-height: 1; } .ux-faq details[open] summary::after { content: "\2013"; }
.ux-faq p { color: var(--tx-2); padding-bottom: 20px; max-width: 70ch; }

/* hero: where do you do business */
.rw-where { margin-top: 26px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; pointer-events: auto; }
.rw-where label { color: rgba(255,255,255,.6); }
.rw-where select { height: 42px; border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.3); padding: 0 16px; font: 600 14px var(--f-t); }
.rw-where select option { color: #000; }
.rw-where-out { flex-basis: 100%; color: rgba(255,255,255,.72); font-size: 14px; } .rw-where-out b { color: #fff; } .rw-where-out a { color: var(--blue-2); }

@media (max-width: 980px) {
  .ux-ride { height: 200vh; }
  .ux-ride-pin { grid-template-rows: 40% 60%; }
  .ux-obj { height: 62%; }
  .ux-ground-hd { grid-template-columns: 1fr; gap: 10px; }
  .ux-ground-hd p { font-size: 14px; }
  .ux-mile { grid-template-columns: 64px minmax(0, 1fr); }
  .ux-mile-l { grid-column: 1 / -1; }
  .ux-mile-pin { position: relative; height: auto; padding: 80px var(--gut) 20px; }
  .ux-mile-p { margin-top: 20px; }
  .ux-road { grid-row: 2; grid-column: 1; }
  .ux-veh { width: 70%; }
  .ux-stages { grid-row: 2; grid-column: 2; padding: 10vh 16px 30vh 20px; }
  .ux-stages > li { min-height: 70vh; }
}


/* countries as an editorial list, not cards */
#countries .rw-ctys { display: block; border: 0; border-top: 1px solid var(--tx); }
#countries .rw-cty { display: grid; grid-template-columns: 90px minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)) 150px; align-items: center; gap: 16px; min-height: 0; padding: 18px 0; border: 0; border-bottom: 1px solid var(--line); transition: padding .3s var(--ease), background .2s; }
#countries .rw-cty:hover { padding-left: 12px; background: #fff; }
#countries .rw-cty .top { display: contents; } #countries .rw-cty .top span:first-child { order: 0; }
#countries .rw-cty h3 { font-size: clamp(22px, 2.4vw, 36px); order: 1; }
#countries .rw-cty dl { display: contents; } #countries .rw-cty dt { display: none; } #countries .rw-cty dd { order: 2; font-weight: 500; }
#countries .rw-cty .lvl { order: 5; justify-self: start; }
#countries .rw-cty .go { display: none; }
@media (max-width: 760px) { #countries .rw-cty { grid-template-columns: 1fr auto; } #countries .rw-cty dd, #countries .rw-cty .top span:first-child { display: none; } }
#countries .rw-cty[hidden] { display: none; }

/* ── v4 · one scroll film per sector ── */
.sx { position: relative; background: #F4F5F7; }
.sx-pin { position: sticky; top: 0; height: 100svh; overflow: hidden; }
.sx-pin::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #F4F5F7 0, rgba(244,245,247,.92) 26%, rgba(244,245,247,0) 46%); }
.sx-art { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.sx-art .m { filter: none; }
.sx-art .sx-t { font: 600 13px var(--f-m); letter-spacing: .08em; fill: var(--tx-2); }
.sx-cam [data-r] { transition: opacity .35s linear; }
.sx-chip { opacity: 0; transition: opacity .35s; pointer-events: none; }
.sx-chip.on { opacity: 1; }
.sx-chip line { stroke: var(--blue); stroke-width: 1.5; } .sx-chip circle { fill: var(--blue); }
.sx-chip rect { fill: #fff; stroke: var(--blue); stroke-width: 1.5; }
.sx-chip text { font: 600 12px var(--f-m); fill: var(--tx); letter-spacing: .02em; }
.sx-head { position: absolute; z-index: 2; top: 86px; left: var(--gut); }
.sx-head .mono { color: var(--tx-3); } .sx-head .mono b { color: var(--blue); font-weight: 500; margin-right: 6px; }
.sx-head h2 { font-size: clamp(22px, 2.2vw, 34px); line-height: .95; margin-top: 8px; max-width: 16ch; }
.sx-caps { list-style: none; margin: 0; padding: 0; position: absolute; z-index: 2; left: var(--gut); top: 30%; width: min(440px, 34vw); height: 56%; }
.sx-caps li { position: absolute; left: 0; top: 0; width: 100%; opacity: 0; transform: translateY(28px); transition: opacity .45s, transform .6s var(--ease); pointer-events: none; }
.sx-caps li.on { opacity: 1; transform: none; pointer-events: auto; }
.sx-caps h3 { font-size: clamp(44px, 5.4vw, 96px); line-height: .88; margin: 10px 0 14px; }
.sx-lead { font-weight: 700; font-size: 17px; color: var(--tx); }
.sx-biz { color: var(--tx-2); font-size: 15px; line-height: 1.55; margin-top: 6px; }
.sx-caps .ux-rb { font-size: 15px; line-height: 1.55; color: var(--tx-2); }
.sx-rail { position: absolute; z-index: 2; left: var(--gut); right: var(--gut); bottom: 22px; display: flex; gap: 6px; }
.sx-rail button { flex: 1; min-width: 0; border: 0; background: none; padding: 10px 0 0; border-top: 2px solid #D3D7DD; text-align: left; font: 500 10.5px var(--f-m); letter-spacing: .06em; text-transform: uppercase; color: var(--tx-3); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: border-color .3s, color .3s; }
.sx-rail button.done { border-color: var(--tx); } .sx-rail button.on { border-color: var(--blue); color: var(--tx); }
.sx-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px 40px; margin: 36px 0 12px; }
.sx-groups h3 { font-size: 19px; margin-bottom: 8px; } .sx-groups p { color: var(--tx-2); font-size: 14.5px; line-height: 1.6; }
@media (max-width: 899px) {
  .sx-pin::before { background: linear-gradient(0deg, #F4F5F7 0, rgba(244,245,247,.96) 40%, rgba(244,245,247,0) 58%); }
  .sx-head { top: 70px; } .sx-head h2 { font-size: 20px; }
  .sx-caps { top: auto; bottom: 60px; width: auto; right: var(--gut); height: 44%; }
  .sx-caps li { top: auto; bottom: 0; }
  .sx-caps h3 { font-size: 40px; margin: 6px 0 8px; }
  .sx-biz, .sx-caps .ux-rec { display: none; }
  .sx-lead { font-size: 15px; } .sx-caps .ux-rb { font-size: 13.5px; }
  .sx-rail { bottom: 18px; gap: 3px; } .sx-rail button { font-size: 0; padding-top: 0; }
}


/* hero · horizon earth */
.rw-hero canvas { left: 0; right: 0; top: 0; bottom: 0; transform: none; width: 100%; height: 100%; opacity: 1; }
.rw-hero .wrap { justify-content: flex-start; padding-top: clamp(110px, 16vh, 170px); }
.rw-hero h1 { max-width: 13ch; }
@media (max-width: 899px) { .rw-hero-foot > p { display: none; } }
/* hero: globe on the right edge, text in from the left */
.rw-hero .wrap { justify-content: center; padding-top: 120px; }
.rw-hero h1, .rw-hero .wrap > .mono, .rw-where, .rw-hero-foot { animation: rwIn 1.1s cubic-bezier(.2,.7,.2,1) both; }
.rw-hero .wrap > .mono { animation-delay: .1s; } .rw-hero h1 { animation-delay: .25s; } .rw-where { animation-delay: .5s; } .rw-hero-foot { animation-delay: .7s; }
.rw-hero h1 em { animation: rwIn 1.1s .45s cubic-bezier(.2,.7,.2,1) both; }
@keyframes rwIn { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
.rw-hero-foot { grid-template-columns: minmax(0, 520px); }
@media (min-width: 900px) { .rw-hero .wrap > * { max-width: 56vw; } }
@media (max-width: 899px) { .rw-hero canvas { opacity: .55; } }
@media (min-width: 900px) { .rw-hero h1 { font-size: clamp(48px, 6.6vw, 118px); max-width: 12ch; } .rw-hero .wrap > * { max-width: 46vw; } }
/* hero v3: small real globe on the left, copy on the right */
@media (min-width: 900px) { .rw-hero .wrap { padding-left: max(var(--gut), 50vw); } .rw-hero .wrap > * { max-width: 44vw; } .rw-hero h1 { font-size: clamp(44px, 5.6vw, 100px); } .rw-hero .rw-drag { right: auto; left: var(--gut); } }
/* ticker: fixed above the header, faint, slow */
.rw-ticker { position: absolute; top: 0; left: 0; right: 0; z-index: 51; height: 26px; background: rgba(6,9,15,.55); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(255,255,255,.06); color: rgba(255,255,255,.38); }
.rw-ticker div { animation-duration: 180s; }
.rw-ticker span { font-size: 10.5px; }
body:has(.rw-ticker) .rw-hd:not(.scrolled) { top: 26px; }
@media (min-width: 900px) { .rw-hero .rw-drag { left: 25vw; transform: translateX(-50%); bottom: 26px; } }
@media (min-width: 900px) { .rw-hero .rw-drag { left: 14vw; } }
/* unitedcarriers-style type: square techno display in caps, Helvetica body, mono labels */
:root { --f-uc: "Chakra Petch", "Archivo", Arial, sans-serif; --f-body: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.sx-head h2, .sx-caps h3, .ux-cover-hd h2, .sx-groups h3, .rw-hero h1, .rw-state, .rw-final h2, .rw-index h3, #countries .rw-cty h3 { font-family: var(--f-uc); font-weight: 700; text-transform: uppercase; letter-spacing: 0; }
.sx-caps h3 { font-size: clamp(48px, 5.2vw, 100px); line-height: 1.05; margin: 12px 0 18px; }
.sx-head h2 { font-size: clamp(18px, 1.25vw, 24px); line-height: 1.25; }
.sx-lead { font: 500 clamp(17px, .95vw, 18px)/1.2 var(--f-body); }
.sx-biz, .sx-caps .ux-rb { font-family: var(--f-body); font-weight: 400; font-size: 15px; line-height: 1.4; }
.ux-cover-hd h2 { font-size: clamp(32px, 3.1vw, 60px); line-height: 1.05; }
.sx-groups h3 { font-size: 24px; line-height: 1.25; }
.rw-hero h1 { line-height: 1.05; }
@media (max-width: 899px) { .sx-caps h3 { font-size: 40px; } }
/* the story art gets its own area; captions never sit on top of it */
.sx-pin::before { display: none; }
@media (min-width: 900px) { .sx-art { left: auto; right: 0; width: 60vw; } .sx-caps { width: min(440px, 33vw); } }
@media (max-width: 899px) { .sx-art { top: 110px; height: calc(52% - 110px); } .sx-caps { height: 46%; } }
/* 3D sector films */
.sx-3d { position: absolute; top: 0; bottom: 0; right: 0; width: 60vw; overflow: hidden; background: #eef1f4; }
.sx-3d canvas { display: block; }
.sx-chips3 { position: absolute; inset: 0; pointer-events: none; }
.sx-chip3 { position: absolute; left: 0; top: 0; opacity: 0; transition: opacity .35s; will-change: transform; }
.sx-chip3.on { opacity: 1; }
.sx-chip3 i { position: absolute; left: -5px; top: -5px; width: 10px; height: 10px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 4px rgba(24,119,242,.2); }
.sx-chip3 i::after { content: ""; position: absolute; left: 4px; bottom: 9px; width: 2px; height: 46px; background: var(--blue); }
.sx-chip3 span { position: absolute; left: -18px; bottom: 54px; white-space: nowrap; background: #fff; border: 1.5px solid var(--blue); border-radius: 999px; padding: 8px 16px; font: 600 12px var(--f-m); color: var(--tx); box-shadow: 0 6px 20px rgba(10,20,40,.12); }
@media (max-width: 899px) { .sx-3d { top: 110px; bottom: auto; height: calc(52% - 110px); width: 100%; } .sx-chip3 span { font-size: 10.5px; padding: 6px 12px; } }

/* ===== UC-style sector openers ===== */
.uc-band{position:relative;height:clamp(240px,21vw,440px);background:#fff;overflow:hidden;color:#111}
.uc-kmh{position:absolute;left:clamp(16px,2.6vw,50px);top:clamp(20px,4.4vw,90px);font:600 13px/1 var(--f-uc,"Chakra Petch",sans-serif);letter-spacing:.06em;color:#555;z-index:2}
.uc-word{position:absolute;left:14vw;bottom:-.02em;white-space:nowrap;font:700 16vw/.74 var(--f-uc,"Chakra Petch",sans-serif);text-transform:uppercase;color:#1877F2;letter-spacing:.005em;will-change:transform}
.uc-mach{position:absolute;left:0;bottom:0;width:min(44vw,860px);height:56%;will-change:transform}
.uc-mach svg{width:100%;height:100%;display:block;overflow:visible}
.uc-say{background:#111;color:#fff;padding:clamp(70px,9vw,150px) 0}
.uc-say-in{display:grid;grid-template-columns:1.25fr 1fr;gap:6vw;align-items:center;padding:0 clamp(16px,4vw,80px);max-width:1700px;margin:0 auto}
.uc-say h2{font:700 clamp(44px,6.4vw,118px)/.95 var(--f-uc,'Chakra Petch',sans-serif);text-transform:uppercase;margin:0;letter-spacing:-.01em}
.uc-say h2 span{color:#4a4a4a}
.uc-say p{font:400 clamp(16px,1.2vw,21px)/1.45 Helvetica,Arial,sans-serif;color:#bdbdbd;margin:0 0 1.2em;max-width:34em}
.uc-btn{display:inline-block;margin-top:1.4em;padding:16px 32px;border:1px solid #555;border-radius:99px;color:#fff;font:600 14px/1 var(--f-uc,'Chakra Petch',sans-serif);text-transform:uppercase;letter-spacing:.05em;text-decoration:none;transition:background .3s,color .3s}
.uc-btn:hover{background:#fff;color:#111}
.uc-say h2,.uc-say-in>div{opacity:0;transform:translateY(40px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.uc-say-in>div{transition-delay:.15s}
.uc-say.in h2,.uc-say.in .uc-say-in>div{opacity:1;transform:none}
.uc-four{position:relative;overflow:hidden;padding:clamp(90px,11vw,180px) clamp(16px,4vw,80px);color:#fff;
  background:radial-gradient(60% 50% at 50% 45%,#1C45A8 0%,#0F2C7A 45%,#081A4C 100%);}
.uc-four::before{content:"";position:absolute;inset:-20%;opacity:.35;mix-blend-mode:soft-light;
  background:repeating-radial-gradient(circle at 30% 40%,rgba(255,255,255,.18) 0 1px,transparent 1px 7px),repeating-linear-gradient(115deg,rgba(255,255,255,.08) 0 2px,transparent 2px 14px);animation:ucSea 40s linear infinite}
@keyframes ucSea{to{transform:translate3d(-6%,4%,0)}}
.uc-lane{position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);background:linear-gradient(transparent,rgba(255,255,255,.35) 20%,rgba(255,255,255,.35) 80%,transparent)}
.uc-lane i{position:absolute;left:50%;top:0;width:14px;height:90px;margin-left:-7px;border-radius:7px;background:linear-gradient(transparent,#fff);box-shadow:0 0 24px 6px rgba(140,190,255,.7);animation:ucRun 5s cubic-bezier(.5,0,.5,1) infinite}
@keyframes ucRun{from{top:-90px}to{top:100%}}
.uc-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(120px,16vw,260px);row-gap:clamp(70px,8vw,140px);max-width:1080px;margin:0 auto}
.uc-pt{max-width:420px;opacity:0;transform:translateY(50px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.uc-pt.in{opacity:1;transform:none}
.uc-p0,.uc-p2{justify-self:end;text-align:right}
.uc-p1,.uc-p3{transition-delay:.15s}
.uc-ic{width:56px;height:56px;fill:#fff;display:block;margin:0 0 26px}
.uc-p0 .uc-ic,.uc-p2 .uc-ic{margin-left:auto}
.uc-pt h3{font:700 clamp(24px,2vw,34px)/1.02 var(--f-uc,'Chakra Petch',sans-serif);text-transform:uppercase;margin:0 0 18px}
.uc-pt p{font:400 17px/1.35 Helvetica,Arial,sans-serif;color:rgba(255,255,255,.82);margin:0}
@media (max-width:820px){
  .uc-band{height:220px}.uc-word{font-size:30vw}.uc-mach{width:80vw;height:52%}
  .uc-say-in{grid-template-columns:1fr;gap:28px}
  .uc-grid{grid-template-columns:1fr;row-gap:56px}.uc-lane{left:16px}
  .uc-p0,.uc-p2{justify-self:start;text-align:left}.uc-p0 .uc-ic,.uc-p2 .uc-ic{margin-left:0}
}
/* dark module row under the band */
.uc-row{background:#111;color:#fff;padding:clamp(56px,6vw,96px) 0 clamp(60px,6vw,100px);text-align:center}
.uc-cols{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(300px,24.3vw);overflow-x:auto;scrollbar-width:none;text-align:left;padding:0 0 0 clamp(16px,1.6vw,30px)}
.uc-cols::-webkit-scrollbar{display:none}
.uc-cols .uc-pt{max-width:none;padding:0 clamp(20px,2.4vw,46px) 0 0;margin-right:clamp(20px,2.4vw,46px);border-right:1px solid #2a2a2a}
.uc-cols .uc-ic{width:70px;height:70px;margin:0 0 30px}
.uc-cols h3{font:700 clamp(26px,2vw,36px)/1.04 var(--f-uc,'Chakra Petch',sans-serif);text-transform:uppercase;margin:0 0 26px}
.uc-cols p{font:400 18px/1.3 Helvetica,Arial,sans-serif;color:#a9a9a9;margin:0;max-width:22em}
.uc-row .uc-btn{margin-top:clamp(60px,6vw,110px)}
.uc-cols .uc-pt{opacity:1;transform:none}
/* pinned horizontal run (desktop) */
@media (min-width:821px){
  .uc-hs{position:relative}
  .uc-stk{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;overflow:hidden;background:#111}
  .uc-stk .uc-band{flex:none;height:44vh;margin-top:max(0px,calc(56px + 26px))}
  .uc-stk .uc-row{flex:1;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:4vh 0}
  .uc-stk .uc-cols{overflow:visible;will-change:transform}
  .uc-stk .uc-row .uc-btn{align-self:center;margin-top:5vh}
}
@media (min-width:821px){.uc-stk .uc-cols{grid-auto-columns:31vw}.uc-stk .uc-cols .uc-pt{padding-right:3vw;margin-right:3vw}}

/* points row: never tuck under the word band */
@media (min-width:821px){
  .uc-stk .uc-band{height:34vh}
  .uc-stk .uc-row{justify-content:flex-start;padding:6vh 0 3vh}
  .uc-stk .uc-cols .uc-ic{width:52px;height:52px;margin-bottom:22px}
  .uc-stk .uc-cols h3{margin-bottom:16px}
  .uc-stk .uc-row .uc-btn{margin-top:auto}
}

/* sector opener: white behind the word band (no dark strip above it) */
.uc-stk{background:#fff}
.uc-stk .uc-band{margin-top:0;padding-top:0}
@media (min-width:821px){.uc-stk .uc-band{height:calc(34vh + 82px)}}

/* stage captions — same type system as the rest of the page */
.sx-head .mono{font:500 12px/1 var(--f-m);letter-spacing:.14em;color:var(--tx-3)}
.sx-head h2{font:700 clamp(20px,1.7vw,28px)/1 var(--f-uc);text-transform:uppercase;color:var(--tx);margin-top:10px;max-width:18ch}
.sx-caps .ux-i{font:500 12px/1 var(--f-m);letter-spacing:.14em;color:var(--blue)}
.sx-caps h3{font:700 clamp(40px,4.4vw,78px)/.9 var(--f-uc);text-transform:uppercase;color:var(--tx);letter-spacing:-.005em;margin:14px 0 18px}
.sx-lead{font:600 clamp(17px,1.25vw,20px)/1.35 var(--f-t);color:var(--tx)}
.sx-biz{font:400 15.5px/1.6 var(--f-t);color:var(--tx-2);margin-top:6px;max-width:40ch}
.sx-caps .ux-rb{font:400 15px/1.6 var(--f-t);color:var(--tx-2);margin-top:18px;padding-top:16px;border-top:1px solid #DDE1E7;max-width:40ch}
.sx-caps .ux-rb b{font:600 11.5px/1 var(--f-m);letter-spacing:.12em;color:var(--blue);margin-bottom:8px}
.sx-caps .ux-rec{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:16px;font:500 11px/1 var(--f-m)!important;letter-spacing:.08em;text-transform:uppercase}
.sx-caps .ux-rec span{padding:7px 10px;border:1px solid #CFD6E0;border-radius:99px;background:#fff;color:var(--tx)}
.sx-caps .ux-rec i{margin:0;color:var(--blue)}
.sx-rail button{font:500 11px var(--f-m);letter-spacing:.1em}

/* stage captions — unitedcarriers.com type system: bold caps heading, 40% grey follow-on line,
   Helvetica body at 72% ink, tiny mono labels */
.sx-head .mono{font:400 10.5px/1.3 var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:rgba(17,17,17,.56)}
.sx-head .mono b{color:var(--blue);font-weight:400;margin-right:10px}
.sx-head h2{font:700 16.5px/1.1 var(--f-uc);text-transform:uppercase;color:#111;margin-top:8px;letter-spacing:0;max-width:22ch}
.sx-caps{top:28%}
.sx-caps .ux-i{font:400 10.5px/1 var(--f-m);letter-spacing:.08em;color:rgba(17,17,17,.4)}
.sx-caps h3{font:700 clamp(36px,3.4vw,52px)/1.04 var(--f-uc);text-transform:uppercase;color:#111;letter-spacing:0;margin:18px 0 0}
.sx-lead{font:700 clamp(22px,2.2vw,34px)/1.05 var(--f-uc);text-transform:uppercase;color:rgba(17,17,17,.4);margin:2px 0 0;max-width:18ch}
.sx-biz{font:400 16px/1.45 var(--f-body);color:rgba(17,17,17,.72);margin-top:28px;max-width:34em}
.sx-caps .ux-rb{font:400 14px/1.5 var(--f-body);color:rgba(17,17,17,.72);margin-top:22px;padding-top:0;border-top:0;max-width:34em}
.sx-caps .ux-rb b{font:400 10.5px/1 var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:8px}
.sx-caps .ux-rec{gap:8px;margin-top:22px;font:400 10.5px/1 var(--f-m)!important;letter-spacing:.08em;color:#111!important}
.sx-caps .ux-rec span{padding:0;border:0;border-radius:0;background:none;color:#111}
.sx-caps .ux-rec i{color:rgba(17,17,17,.4)}
.sx-rail button{font:400 10px var(--f-m);letter-spacing:.08em;color:rgba(17,17,17,.4)}
.sx-rail button.on{color:#111}
@media (max-width:899px){.sx-caps h3{font-size:30px}.sx-lead{font-size:20px}.sx-biz{margin-top:14px;font-size:14.5px}.sx-caps .ux-rb{margin-top:12px}}
/* mobile: scene on top, caption directly under it (no overlap, no dead gap) */
@media (max-width:899px){
  .sx-art{top:96px;height:calc(48% - 96px)}
  .sx-caps{top:calc(48% + 12px);bottom:64px;height:auto}
  .sx-caps li{top:0;bottom:auto}
  .sx-pin::before{background:none}
  .sx-head{top:62px}
  .sx-caps h3{margin-top:10px}
  .sx-biz{margin-top:12px}
}
/* mobile: same pinned sideways run as desktop, driven by vertical scroll */
@media (max-width:820px){
  .uc-hs{position:relative}
  .uc-stk{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;overflow:hidden}
  .uc-stk .uc-band{flex:none;height:30svh}
  .uc-stk .uc-row{flex:1;display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden;padding:5svh 0 4svh}
  .uc-stk .uc-cols{overflow:visible;will-change:transform;grid-auto-columns:78vw}
  .uc-stk .uc-cols .uc-ic{width:48px;height:48px;margin-bottom:18px}
  .uc-stk .uc-cols h3{font-size:24px;margin-bottom:14px}
  .uc-stk .uc-cols p{font-size:15.5px}
  .uc-stk .uc-row .uc-btn{align-self:center;margin-top:auto}
}
/* mobile: bigger captions + full stage list fills the space above the rail */
@media (max-width:899px){
  .sx-caps h3{font-size:40px}
  .sx-lead{font-size:24px}
  .sx-biz{font-size:16.5px;line-height:1.5}
  .sx-caps .ux-rb{font-size:15.5px}
  .sx-caps .ux-rb b{font-size:11.5px}
  .sx-caps .ux-rec{font-size:12px!important}
  .sx-rail{flex-wrap:wrap;gap:0 14px;bottom:18px}
  .sx-rail button{flex:0 0 calc(33.333% - 10px);font-size:11.5px;padding:10px 0 8px;overflow:visible;text-overflow:clip;white-space:normal;line-height:1.2}
}
/* mobile stage list: one row, swipe sideways; active stage scrolls into view */
@media (max-width:899px){
  .sx-rail{flex-wrap:nowrap;gap:18px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;left:0;right:0;padding:0 var(--gut)}
  .sx-rail::-webkit-scrollbar{display:none}
  .sx-rail button{flex:0 0 auto;white-space:nowrap;font-size:12px;padding:10px 0 8px;min-width:0}
}
/* statement inside the dark panel (phones); the separate statement band is hidden there */
.uc-rsay{display:none}
@media (max-width:820px){
  .uc-say{display:none}
  .uc-rsay{display:block;text-align:left;padding:0 var(--gut);margin-top:5svh}
  .uc-rsay h2{font:700 clamp(26px,7.4vw,34px)/1 var(--f-uc);text-transform:uppercase;color:#fff;margin:0 0 16px}
  .uc-rsay h2 span{color:rgba(255,255,255,.28)}
  .uc-rsay p{font:400 15px/1.45 var(--f-body);color:rgba(255,255,255,.62);margin:0 0 10px;max-width:34em}
}

/* caption column on the hero's dark background (desktop: left panel · mobile: lower half) */
.sx-pin{background:#F4F5F7}
.sx-pin::after{content:"";position:absolute;z-index:1;pointer-events:none;background:radial-gradient(120% 90% at 70% 40%,#0E1B33 0%,var(--ink) 60%);left:0;top:0;bottom:0;width:40vw}
.sx-head,.sx-caps,.sx-rail{z-index:2}
.sx-head .mono{color:rgba(255,255,255,.5)}
.sx-head h2{color:#fff}
.sx-caps .ux-i{color:rgba(255,255,255,.4)}
.sx-caps h3{color:#fff}
.sx-lead{color:rgba(255,255,255,.4)}
.sx-biz,.sx-caps .ux-rb{color:rgba(255,255,255,.72)}
.sx-caps .ux-rb b{color:#6AA9FF}
.sx-caps .ux-rec,.sx-caps .ux-rec span{color:#fff!important}
.sx-caps .ux-rec i{color:rgba(255,255,255,.4)}
.sx-rail button{color:rgba(255,255,255,.4);border-top-color:rgba(255,255,255,.18)}
.sx-rail button.done{border-color:rgba(255,255,255,.7)}
.sx-rail button.on{color:#fff;border-color:var(--blue)}
@media (min-width:900px){
  .sx-caps{width:calc(40vw - var(--gut) * 2)}
  .sx-rail{right:calc(60vw + var(--gut))}
}
@media (max-width:899px){
  .sx-pin::after{top:48%;width:auto;right:0}
  .sx-head .mono{color:var(--tx-3)} .sx-head h2{color:#111}
}

/* ── whole page on the hero's dark, Rebota blue accents; only the scene canvas stays light ── */
body{background:var(--ink);color:#fff}
.rw-sec:not(.rw-dark),.ux-cover,.rw-apps,.uc-stk,.uc-band,.uc-hs{background:radial-gradient(120% 90% at 70% 40%,#0E1B33 0%,var(--ink) 60%);color:#fff;
  --tx:#fff;--tx-2:rgba(255,255,255,.7);--tx-3:rgba(255,255,255,.5);--line:rgba(255,255,255,.14)}
.uc-band,.uc-stk{background:var(--ink)}
.uc-kmh{color:rgba(255,255,255,.5)}
.ux-cover{border-top-color:rgba(255,255,255,.1)}
.ux-faq{border-top-color:rgba(255,255,255,.5)}
.rw-cty:hover{background:rgba(24,119,242,.12)}
.rw-find input{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.2)}
.rw-find input::placeholder{color:rgba(255,255,255,.45)}
.rw-reg button{color:rgba(255,255,255,.7)}
.rw-reg button.on{background:var(--blue);border-color:var(--blue);color:#fff}
.rw-chips span,.rw-chips a{background:transparent;color:#fff}
.rw-app-row{border-top-color:rgba(255,255,255,.5)}
.rw-app i{color:rgba(255,255,255,.6)}
.rw-hd,.rw-hd.scrolled{color:#fff}
.rw-hd.scrolled{background:rgba(6,9,15,.82);border-color:rgba(255,255,255,.1)}
.rw-menu{background:var(--ink);color:#fff}

/* ── stage captions on a white panel, bigger type; panel alternates side per sector ── */
.sx-pin::after{background:#fff;box-shadow:1px 0 0 #E3E7ED}
.sx-head .mono{color:rgba(17,17,17,.5)} .sx-head .mono b{color:var(--blue)}
.sx-head h2{color:#111}
.sx-caps .ux-i{color:rgba(17,17,17,.4)}
.sx-caps h3{color:#111}
.sx-lead{color:rgba(17,17,17,.4)}
.sx-biz,.sx-caps .ux-rb{color:rgba(17,17,17,.74)}
.sx-caps .ux-rb b{color:var(--blue)}
.sx-caps .ux-rec,.sx-caps .ux-rec span{color:#111!important}
.sx-caps .ux-rec i{color:rgba(17,17,17,.4)}
.sx-rail button{color:rgba(17,17,17,.4);border-top-color:#D8DDE4}
.sx-rail button.done{border-color:#111}
.sx-rail button.on{color:#111;border-color:var(--blue)}
@media (min-width:900px){
  .sx-head{top:92px}
  .sx-head h2{font-size:clamp(18px,1.4vw,24px)}
  .sx-caps{top:24%;bottom:90px}
  .sx-caps h3{font-size:clamp(46px,4.4vw,80px);margin-top:20px}
  .sx-lead{font-size:clamp(26px,2.5vw,44px);max-width:16ch}
  .sx-biz{font-size:clamp(17px,1.25vw,20px);margin-top:32px}
  .sx-caps .ux-rb{font-size:clamp(15px,1.1vw,18px);margin-top:26px}
  .sx-caps .ux-rb b{font-size:12px}
  .sx-caps .ux-rec{font-size:12px!important;margin-top:26px}
  .sx-rail button{font-size:11.5px}
  /* even sectors: panel right, scene left */
  .sx-r .sx-pin::after{left:auto;right:0;box-shadow:-1px 0 0 #E3E7ED}
  .sx-r .sx-art{left:0;right:auto}
  .sx-r .sx-head,.sx-r .sx-caps{left:calc(60vw + var(--gut))}
  .sx-r .sx-rail{left:calc(60vw + var(--gut));right:var(--gut)}
}
@media (max-width:899px){
  .sx-pin::after{box-shadow:0 -1px 0 #E3E7ED}
}

/* pricing on white */
.rw-price{background:#fff!important;color:#111}
.rw-price .rw-kick{color:rgba(17,17,17,.5)}
.rw-price .rw-state{color:#111!important}
.rw-price-lede{color:rgba(17,17,17,.66)}
.rw-ptog{border-color:#D8DDE4}.rw-ptog button{color:rgba(17,17,17,.6)}.rw-ptog button.on{background:var(--ink);color:#fff}
.rw-plans{border-top-color:#111}
.rw-plan{border-right-color:#E3E7ED}
.rw-plan.hot{background:rgba(24,119,242,.06)}
.rw-plan-k{color:var(--blue)}
.rw-plan-tag,.rw-plan-per{color:rgba(17,17,17,.55)}
.rw-plan ul{color:rgba(17,17,17,.78)}
.rw-plan .btn{color:#111}.rw-plan .btn-p{color:#fff}
.rw-price-note{color:rgba(17,17,17,.5)}.rw-price-note a{color:var(--blue)}
.rw-sec.rw-price{color:#111!important;--tx:#111;--tx-2:rgba(17,17,17,.7);--tx-3:rgba(17,17,17,.5);--line:#E3E7ED}
.rw-price h3,.rw-price .rw-plan-amt{color:#111}
.rw-price .rw-state span{color:var(--blue)}

/* ── desktop: animation on top (full width), text band below — unitedcarriers-style horizontal split ── */
@media (min-width:900px){
  .sx .sx-art,.sx.sx-r .sx-art{left:0;right:0;top:0;width:100%;height:58%}
  .sx .sx-pin::after,.sx.sx-r .sx-pin::after{left:0;right:0;width:auto;top:58%;bottom:0;box-shadow:0 -1px 0 #E3E7ED}
  .sx .sx-head,.sx.sx-r .sx-head{top:88px;left:var(--gut)}
  .sx .sx-caps,.sx.sx-r .sx-caps{top:calc(58% + 30px);bottom:78px;left:var(--gut);right:var(--gut);width:auto;height:auto}
  .sx-caps li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:6vw;align-items:start}
  .sx-caps h3{font-size:clamp(40px,3.5vw,64px);margin:14px 0 0}
  .sx-lead{font-size:clamp(22px,1.9vw,34px);max-width:20ch}
  .sx-c2{padding-top:26px}
  .sx-biz{margin-top:0;font-size:clamp(16px,1.15vw,19px)}
  .sx-caps .ux-rb{margin-top:18px}
  .sx-caps .ux-rec{margin-top:18px}
  .sx .sx-rail,.sx.sx-r .sx-rail{left:var(--gut);right:var(--gut);bottom:24px}
}
/* sector word band: white, blue word */
.uc-band,.uc-stk{background:#fff!important}
.uc-kmh{color:#555}
/* "One ERP" statement: white background, blue + ink lines */
.rw-final{background:#fff!important;color:var(--blue)}
.rw-final h2 span:nth-child(odd) i{color:var(--blue)}
.rw-final h2 span:nth-child(even) i{color:var(--ink)}
.rw-final .btn-p{background:var(--blue);color:#fff}
.rw-final .btn-o{color:var(--ink);border-color:var(--ink)}
/* full-screen sections follow the live viewport (address bar shown or hidden) — no gap under them on phones */
.sx-pin,.uc-stk,.ux-ride-pin,.ux-mile-pin,.ux-road-pin,.rw-fly-pin{height:100vh;height:100dvh}
.rw-hero{min-height:100vh;min-height:100dvh}
.sx-pin,.uc-stk,.ux-ride-pin,.ux-mile-pin,.ux-road-pin,.rw-fly-pin{height:var(--app-h,100dvh)}
.rw-hero{min-height:var(--app-h,100dvh)}
@media (max-width:899px){ .sx-pin::after{top:var(--cut,48%)} }
/* page never wider than the phone: clip (not hidden) so pinned sections keep working */
html,body{overflow-x:clip;max-width:100%}
@media (max-width:980px){ html body:has(.rw-ticker) .rw-hd, html body .rw-hd{top:0} }
@media (max-width:980px){ html body:has(.rw-ticker) .rw-hd:not(.scrolled){top:0} }
/* phones: country ticker sits just below the fixed header, never under it */
@media (max-width:980px){
  html body .rw-ticker{top:calc(56px + env(safe-area-inset-top,0px))}
  html body .rw-hero{padding-top:calc(26px + env(safe-area-inset-top,0px))}
}