/* /solutions/ownership and /solutions/ventures. Built on the pricing look in pricing.css (glass,
   buttons, kickers, scroll reveals); colours come from the site tokens in
   global.css. Cyan (--ep-energy) is light and glow only, never text.
   Motion is transform and opacity only, and none of it runs with reduced motion. */
.ov-page { --ov-line: rgba(23, 23, 25, 0.09); --ov-mx: 0; --ov-my: 0; }
html[data-alyssiun-atmosphere="neo"] .ov-page,
html[data-alyssiun-theme="neo"] .ov-page,
html.neo-mode .ov-page { --ov-line: rgba(245, 245, 247, 0.1); }

.ov-main > section { position: relative; }
.ov-icon { width: 40px; height: 40px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- Cinematic hero ---------- */
.ov-hero {
    position: relative; isolation: isolate; display: grid; place-items: center; align-content: center;
    min-height: min(82vh, 860px); min-height: min(82svh, 860px);
    padding: clamp(40px, 8vh, 96px) 0 clamp(96px, 14vh, 150px); text-align: center;
}
.ov-stage {
    position: absolute; inset: -140px 0 0; z-index: -1; overflow: hidden; pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, #000 62%, transparent); mask-image: linear-gradient(to bottom, #000 62%, transparent);
}
.ov-depth { position: absolute; inset: 0; transition: transform 1.2s var(--ep-ease); }
.ov-depth--far { transform: translate3d(calc(var(--ov-mx) * 26px), calc(var(--ov-my) * 18px), 0); }
.ov-depth--near { transform: translate3d(calc(var(--ov-mx) * -14px), calc(var(--ov-my) * -10px), 0); }
.ov-glow { position: absolute; left: 50%; border-radius: 50%; will-change: transform; }
.ov-glow--a {
    top: 6%; width: min(980px, 130vw); height: 620px; margin-left: calc(min(980px, 130vw) / -2);
    background: radial-gradient(closest-side, rgba(var(--ep-energy), 0.22), rgba(var(--ep-energy), 0.06) 55%, transparent);
    animation: ov-drift 16s ease-in-out infinite alternate;
}
.ov-glow--b {
    top: 30%; width: min(720px, 110vw); height: 460px; margin-left: calc(min(720px, 110vw) / -2 + 180px);
    background: radial-gradient(closest-side, rgba(255, 255, 255, 0.55), transparent);
    animation: ov-drift 20s ease-in-out -6s infinite alternate-reverse;
}
html.neo-mode .ov-glow--b, html[data-alyssiun-atmosphere="neo"] .ov-glow--b {
    background: radial-gradient(closest-side, rgba(var(--ep-energy), 0.1), transparent);
}
@keyframes ov-drift {
    from { transform: translate3d(-4%, 0, 0) scale(1); }
    to { transform: translate3d(4%, 3%, 0) scale(1.08); }
}

/* The ring: a slow seal of light behind the title. */
.ov-ring {
    position: absolute; top: 50%; left: 50%; width: min(620px, 92vw); aspect-ratio: 1; margin: calc(min(620px, 92vw) / -2) 0 0 calc(min(620px, 92vw) / -2);
    border-radius: 50%; opacity: 0.9;
}
.ov-ring::before, .ov-ring::after { content: ""; position: absolute; inset: 0; border-radius: 50%; }
.ov-ring::before {
    padding: 1px;
    background: conic-gradient(from 0deg, transparent 0 18%, rgba(var(--ep-energy), 0.75) 30%, transparent 44% 68%, rgba(var(--ep-energy), 0.35) 80%, transparent 92%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    animation: ov-spin 26s linear infinite;
}
.ov-ring::after { inset: 13%; border: 1px solid var(--ov-line); }
@keyframes ov-spin { to { transform: rotate(1turn); } }

/* A floor of light lines running toward the horizon. */
.ov-floor {
    position: absolute; left: 0; right: 0; bottom: 0; height: 38%; perspective: 520px; perspective-origin: 50% 0; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 22%, #000 78%, transparent); mask-image: linear-gradient(90deg, transparent, #000 22%, #000 78%, transparent);
}
.ov-floor-grid {
    position: absolute; inset: 0 -40% -128px; transform-origin: 50% 0; transform: rotateX(64deg);
    background-image: linear-gradient(var(--ov-line) 1px, transparent 1px), linear-gradient(90deg, var(--ov-line) 1px, transparent 1px);
    background-size: 64px 64px;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 40%); mask-image: linear-gradient(to bottom, transparent, #000 40%);
    animation: ov-floor 9s linear infinite;
}
@keyframes ov-floor { from { transform: rotateX(64deg) translate3d(0, -64px, 0); } to { transform: rotateX(64deg) translate3d(0, 0, 0); } }
.ov-horizon {
    position: absolute; left: 8%; right: 8%; bottom: 38%; height: 1px; overflow: hidden;
    background: linear-gradient(90deg, transparent, rgba(var(--ep-energy), 0.45), transparent);
}
.ov-horizon::after {
    content: ""; position: absolute; inset: -1px auto -1px 0; width: 24%;
    background: linear-gradient(90deg, transparent, rgba(var(--ep-energy), 0.95), transparent);
    animation: ov-sweep 6.5s var(--ep-ease) infinite;
}
@keyframes ov-sweep { from { transform: translateX(-100%); } to { transform: translateX(420%); } }

.ov-hero-copy { position: relative; max-width: 1040px; }
.ov-hero h1 {
    margin-top: 22px; font-size: clamp(2.9rem, 8.4vw, 7rem); font-weight: 800; line-height: 1; letter-spacing: -0.04em;
    text-wrap: balance;
}
.ov-word { display: inline-block; animation: ov-word-in 1.15s var(--ep-ease) both; animation-delay: calc(0.18s + var(--i, 0) * 0.11s); }
.ov-line { display: block; }
@keyframes ov-word-in {
    from { opacity: 0; transform: translate3d(0, 0.42em, 0) scale(0.98); filter: blur(14px); }
    to { opacity: 1; transform: none; filter: blur(0); }
}
.ov-hero .ep-eyebrow { animation: ov-fade-in 1s ease 0.05s both; }
.ov-hero .ep-lede { max-width: 700px; animation: ov-rise-in 1.1s var(--ep-ease) 0.75s both; }
@keyframes ov-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes ov-rise-in { from { opacity: 0; transform: translate3d(0, 18px, 0); } to { opacity: 1; transform: none; } }

.ov-cue { position: absolute; left: 50%; bottom: clamp(24px, 5vh, 52px); width: 1px; height: 54px; overflow: hidden; background: var(--border-subtle); animation: ov-fade-in 1s ease 1.4s both; }
.ov-cue::after { content: ""; position: absolute; left: 0; top: 0; width: 1px; height: 22px; background: linear-gradient(transparent, var(--text-primary)); animation: ov-cue 2.2s var(--ep-ease) infinite; }
@keyframes ov-cue { from { transform: translateY(-22px); } to { transform: translateY(54px); } }

/* ---------- Section heads ---------- */
.ov-head { max-width: 820px; }
.ov-head--center { margin: 0 auto; text-align: center; }
.ov-head h2 { margin-top: 14px; font-size: clamp(1.9rem, 4.6vw, 3.4rem); font-weight: 700; line-height: 1.06; letter-spacing: -0.03em; text-wrap: balance; }
.ov-head p:not(.ep-kicker) { margin-top: 18px; color: var(--text-secondary); font-size: clamp(1.02rem, 1.7vw, 1.22rem); line-height: 1.55; text-wrap: pretty; }
.ov-head--center p:not(.ep-kicker) { margin-left: auto; margin-right: auto; max-width: 680px; }

/* Glass tiles with an icon, used for rights, never-reused items and what ALYSSIUN brings. */
.ov-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: clamp(30px, 5vh, 48px); }
.ov-tiles--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ov-tile { position: relative; overflow: hidden; padding: clamp(22px, 2.6vw, 32px); transition: translate 0.45s var(--ep-ease), box-shadow 0.45s ease, border-color 0.45s ease; }
.ov-tile::before {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity 0.5s ease;
    background: radial-gradient(420px circle at var(--ov-px, 50%) var(--ov-py, 0%), rgba(var(--ep-energy), 0.12), transparent 60%);
}
.ov-tile:hover { translate: 0 -4px; border-color: rgba(var(--ep-energy), 0.32); box-shadow: var(--ep-glow); }
.ov-tile:hover::before { opacity: 1; }
.ov-tile h3 { margin-top: 20px; font-size: 1.18rem; font-weight: 700; letter-spacing: -0.012em; }
.ov-tile p { margin-top: 8px; color: var(--text-secondary); font-size: 0.96rem; line-height: 1.55; }
.ov-tile .ov-icon { display: block; }

/* Stroke drawing: paths with pathLength="1" draw in when their block comes into view. */
.ov-draw path, .ov-draw rect, .ov-draw circle { stroke-dasharray: 1; stroke-dashoffset: 0; }
.ep-js .ov-draw path, .ep-js .ov-draw rect, .ep-js .ov-draw circle { stroke-dashoffset: 1; transition: stroke-dashoffset 1.3s var(--ep-ease) calc(var(--ep-delay, 0s) + 0.25s); }
.ep-js .is-in .ov-draw path, .ep-js .is-in .ov-draw rect, .ep-js .is-in .ov-draw circle,
.ep-js .ov-draw.is-in path, .ep-js .ov-draw.is-in rect, .ep-js .ov-draw.is-in circle { stroke-dashoffset: 0; }

/* "You are never locked in." The lock opens as it comes into view. */
.ov-unlocked {
    display: flex; align-items: center; justify-content: center; gap: clamp(16px, 3vw, 28px);
    margin-top: clamp(28px, 5vh, 44px); padding: clamp(22px, 3.4vw, 36px) clamp(22px, 4vw, 48px);
    border-color: rgba(var(--ep-energy), 0.34); box-shadow: var(--ep-glow);
}
.ov-unlocked p { font-size: clamp(1.35rem, 3.2vw, 2.3rem); font-weight: 700; letter-spacing: -0.025em; line-height: 1.15; }
.ov-lock { flex: 0 0 auto; width: clamp(40px, 6vw, 56px); height: clamp(40px, 6vw, 56px); fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.ov-lock-shackle { transform-box: fill-box; transform-origin: 100% 100%; transition: transform 0.9s var(--ep-ease) 0.5s; }
.is-in .ov-lock-shackle, html:not(.ep-js) .ov-lock-shackle { transform: translate3d(0, -5px, 0) rotate(28deg); }

/* What ALYSSIUN never reuses: a sealed vault of six items. A scan of light passes once. */
.ov-vault { position: relative; overflow: hidden; margin-top: clamp(30px, 5vh, 48px); padding: clamp(20px, 3vw, 36px); }
.ov-vault ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(18px, 3vw, 40px); }
.ov-vault li { display: flex; align-items: center; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--border-subtle); font-size: clamp(1.02rem, 1.6vw, 1.18rem); font-weight: 600; }
.ov-vault li:nth-last-child(-n + 3) { border-bottom: 0; }
.ov-vault li svg { flex: 0 0 22px; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0.75; }
.ov-vault::after {
    content: ""; position: absolute; inset: 0 auto 0 0; width: 40%; pointer-events: none; opacity: 0;
    background: linear-gradient(90deg, transparent, rgba(var(--ep-energy), 0.16), transparent);
}
.ov-vault.is-in::after { animation: ov-scan 2.2s var(--ep-ease) 0.4s 1 both; }
@keyframes ov-scan { 0% { opacity: 1; transform: translateX(-100%); } 85% { opacity: 1; } 100% { opacity: 0; transform: translateX(260%); } }
.ov-note {
    display: flex; align-items: flex-start; gap: 14px; max-width: 820px; margin: 24px auto 0;
    color: var(--text-secondary); font-size: clamp(0.98rem, 1.5vw, 1.08rem); line-height: 1.55;
}
.ov-note svg { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 2px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- Two options (Internal Use, Exclusive), side by side ---------- */
.ov-options.ov-options--two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 980px; margin-left: auto; margin-right: auto; }
.ov-option-cta { margin-top: 22px; align-self: end; }
.ov-own-line { margin-top: 18px; color: var(--text-secondary); font-size: 1rem; text-align: center; }

/* ---------- Three options, side by side ---------- */
.ov-options {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 18px; margin-top: clamp(34px, 6vh, 56px);
}
.ov-option {
    position: relative; display: grid; grid-row: span 9; grid-template-rows: subgrid; row-gap: 0; align-content: start;
    padding: clamp(24px, 2.6vw, 34px); padding-top: clamp(28px, 3vw, 38px); margin-bottom: 18px;
    transition: translate 0.45s var(--ep-ease), box-shadow 0.45s ease, border-color 0.45s ease;
}
@supports not (grid-template-rows: subgrid) {
    .ov-option { display: flex; flex-direction: column; }
    .ov-option-rows li { min-height: 76px; }
}
.ov-option::before {
    content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 2px; transform-origin: 0 50%;
    background: linear-gradient(90deg, rgba(var(--ep-energy), 0), rgba(var(--ep-energy), 0.9), rgba(var(--ep-energy), 0));
}
.ep-js .ov-option::before { transform: scaleX(0); transition: transform 1.2s var(--ep-ease) calc(var(--ep-delay, 0s) + 0.2s); }
.ep-js .ov-option.is-in::before { transform: scaleX(1); }
.ov-option:hover { translate: 0 -4px; border-color: rgba(var(--ep-energy), 0.32); box-shadow: var(--ep-glow); }
.ov-option-icon { width: 44px; height: 44px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.ov-tag {
    justify-self: start; align-self: start; margin-top: 18px; padding: 5px 9px; border: 1px solid var(--border-strong); border-radius: 3px;
    color: var(--text-secondary); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap;
}
.ov-tag--included { border-color: rgba(var(--ep-energy), 0.6); background: rgba(var(--ep-energy), 0.1); color: var(--text-primary); }
.ov-option h3 { margin-top: 14px; font-size: clamp(1.35rem, 2vw, 1.6rem); font-weight: 700; letter-spacing: -0.02em; }
.ov-option-desc { margin-top: 10px; padding-bottom: 22px; color: var(--text-secondary); font-size: 0.97rem; line-height: 1.55; }
.ov-option-rows { display: contents; }
.ov-option-rows li { display: grid; align-content: start; gap: 6px; padding: 14px 0; border-top: 1px solid var(--border-subtle); }
.ov-option-label { color: var(--text-muted); font-size: 0.74rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.ov-option-val { display: flex; align-items: flex-start; gap: 10px; font-size: 0.97rem; font-weight: 600; line-height: 1.4; }
.ov-mark { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 1px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ov-mark circle { stroke: none; fill: rgba(var(--ep-energy), 0.18); }
.ov-no { color: var(--text-muted); font-weight: 500; }
.ov-no .ov-mark { opacity: 0.6; }
.ov-no .ov-mark circle { fill: transparent; }
/* Each answer lights up row by row as the card comes into view. */
.ep-js .ov-option-rows li { opacity: 0.001; transform: translate3d(0, 8px, 0); transition: opacity 0.6s ease, transform 0.7s var(--ep-ease); transition-delay: calc(var(--ep-delay, 0s) + 0.35s + var(--r, 0) * 0.09s); }
.ep-js .ov-option.is-in .ov-option-rows li { opacity: 1; transform: none; }
.ov-mark path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.ep-js .ov-mark path { stroke-dashoffset: 1; transition: stroke-dashoffset 0.7s var(--ep-ease); transition-delay: calc(var(--ep-delay, 0s) + 0.55s + var(--r, 0) * 0.09s); }
.ep-js .ov-option.is-in .ov-mark path { stroke-dashoffset: 0; }

/* ---------- What ALYSSIUN always keeps: the layered foundation ---------- */
.ov-keeps { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(30px, 5vw, 80px); align-items: center; }
.ov-keeps-list { display: grid; margin-top: 28px; border-top: 1px solid var(--border-subtle); }
.ov-keeps-list li { display: flex; align-items: center; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--border-subtle); font-size: 1.06rem; font-weight: 600; }
.ov-keeps-list li::before { content: ""; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--text-primary); box-shadow: 0 0 0 4px rgba(var(--ep-energy), 0.16); }
.ov-keeps-yours { margin-top: 22px; color: var(--text-secondary); font-size: 1.02rem; line-height: 1.55; }
.ov-keeps-yours strong { color: var(--text-primary); }

/* Drawn with flat 2D transforms (a squashed, turned square per layer), so every
   browser shows the same layers; the stack leans toward the pointer as a whole. */
.ov-stack { --size: clamp(220px, 28vw, 300px); --gap: clamp(36px, 4.4vw, 54px); position: relative; height: clamp(320px, 38vw, 440px); perspective: 1400px; }
.ov-stack-tilt { position: absolute; inset: 0; transition: transform 1.2s var(--ep-ease); transform: rotateX(calc(var(--ov-ty, 0) * 6deg)) rotateY(calc(var(--ov-tx, 0) * 8deg)); }
.ov-stack-plane { position: absolute; left: 50%; top: 66%; width: 0; height: 0; }
.ov-layer {
    position: absolute; left: calc(var(--size) / -2); top: calc(var(--size) / -2); width: var(--size); height: var(--size);
    transform: translate3d(0, calc(var(--l) * var(--gap) * -1), 0);
    transition: transform 1.4s var(--ep-ease) calc(0.15s + var(--l) * 0.12s), opacity 0.9s ease calc(0.15s + var(--l) * 0.12s);
}
.ep-js .ov-stack:not(.is-in) .ov-layer { opacity: 0; transform: translate3d(0, 0, 0); }
.ov-layer-float { position: absolute; inset: 0; animation: ov-float 7s ease-in-out infinite; animation-delay: calc(var(--l) * -1.3s); }
.ov-layer-face {
    position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 16px 18px; border-radius: 6px;
    transform: scaleY(0.56) rotate(-40deg);
    background: var(--ep-glass-fill); border: 1px solid var(--border-strong);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.1);
    color: var(--text-primary); font-size: 0.82rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
}
.ov-layer--yours .ov-layer-face {
    border-color: rgba(var(--ep-energy), 0.7);
    background: linear-gradient(135deg, rgba(var(--ep-energy), 0.2), rgba(var(--ep-energy), 0.04)), var(--ep-glass-fill);
    box-shadow: 0 0 0 1px rgba(var(--ep-energy), 0.4), 0 30px 80px rgba(var(--ep-energy), 0.22);
}
@keyframes ov-float { 0%, 100% { transform: translate3d(0, 0, 0); } 50% { transform: translate3d(0, -8px, 0); } }

/* ---------- Need more ---------- */
.ov-more { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: center; padding: clamp(28px, 4.6vw, 60px); }
.ov-more h2 { font-size: clamp(1.7rem, 3.6vw, 2.6rem); font-weight: 700; line-height: 1.08; letter-spacing: -0.025em; }
.ov-more p { margin-top: 14px; max-width: 640px; color: var(--text-secondary); font-size: clamp(1rem, 1.6vw, 1.15rem); line-height: 1.55; }
.ov-more .ep-button { min-width: 260px; }

/* Closing note */
.ov-fine { padding-top: 0; padding-bottom: clamp(56px, 10vh, 110px); }
.ov-fine p { max-width: 720px; margin: 0 auto; padding-top: 22px; border-top: 1px solid var(--border-subtle); color: var(--text-muted); font-size: 0.88rem; line-height: 1.55; text-align: center; }

/* ---------- Ventures: who it is for ---------- */
.ov-signals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(30px, 5vh, 48px); }
.ov-signal { display: flex; align-items: center; gap: 18px; padding: clamp(20px, 2.6vw, 28px); }
.ov-signal svg { flex: 0 0 auto; width: 64px; height: 40px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ov-signal svg .ov-energy { stroke: rgba(var(--ep-energy), 0.95); }
.ov-signal h3 { font-size: 1.15rem; font-weight: 700; letter-spacing: -0.01em; }

/* You and ALYSSIUN: who does what */
.ov-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin-top: 18px; overflow: hidden; }
.ov-split > div { padding: clamp(24px, 3.6vw, 44px); }
.ov-split > div + div { border-left: 1px solid var(--border-subtle); background: rgba(var(--ep-energy), 0.06); }
.ov-split p:not(.ep-kicker) { margin-top: 10px; font-size: clamp(1.25rem, 2.6vw, 1.9rem); font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; }

/* How it works: a four-step timeline. The line fills and each step lights up in turn. */
.ov-timeline { position: relative; margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: clamp(38px, 6vh, 60px); counter-reset: ov-step; }
.ov-timeline::before, .ov-timeline::after { content: ""; position: absolute; top: 27px; left: 28px; right: calc((100% - 72px) / 4 - 28px); height: 1px; }
.ov-timeline::before { background: var(--border-subtle); }
.ov-timeline::after { background: linear-gradient(90deg, rgba(var(--ep-energy), 0.9), rgba(var(--ep-energy), 0.4)); box-shadow: 0 0 12px rgba(var(--ep-energy), 0.6); transform-origin: 0 50%; }
.ep-js .ov-timeline::after { transform: scaleX(0); transition: transform 2s var(--ep-ease) 0.2s; }
.ep-js .ov-timeline.is-in::after { transform: scaleX(1); }
.ov-step { position: relative; }
.ov-step-dot {
    position: relative; z-index: 1; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
    background: var(--page-bg); border: 1px solid var(--border-strong); font-size: 1rem; font-weight: 700; font-variant-numeric: tabular-nums;
    transition: border-color 0.6s ease, box-shadow 0.6s ease; transition-delay: calc(0.3s + var(--s) * 0.45s);
}
.ov-step-dot::before { counter-increment: ov-step; content: counter(ov-step, decimal-leading-zero); }
.ep-js .ov-timeline.is-in .ov-step-dot, html:not(.ep-js) .ov-step-dot { border-color: rgba(var(--ep-energy), 0.8); box-shadow: 0 0 0 6px rgba(var(--ep-energy), 0.1), 0 0 30px rgba(var(--ep-energy), 0.35); }
.ov-step h3 { margin-top: 22px; font-size: 1.3rem; font-weight: 700; letter-spacing: -0.015em; }
.ov-step p { margin-top: 10px; max-width: 280px; color: var(--text-secondary); font-size: 0.98rem; line-height: 1.55; }
.ep-js .ov-step h3, .ep-js .ov-step p { opacity: 0.001; transform: translate3d(0, 12px, 0); transition: opacity 0.7s ease, transform 0.8s var(--ep-ease); transition-delay: calc(0.4s + var(--s) * 0.45s); }
.ep-js .ov-timeline.is-in .ov-step h3, .ep-js .ov-timeline.is-in .ov-step p { opacity: 1; transform: none; }

/* The partnership: the equity range */
.ov-deal { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; padding: clamp(28px, 4.6vw, 64px); }
.ov-equity { font-size: clamp(2.8rem, 5.4vw, 5rem); font-weight: 800; line-height: 0.95; letter-spacing: -0.045em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ov-equity small { font-size: 0.4em; font-weight: 600; letter-spacing: -0.02em; color: var(--text-secondary); }
.ov-equity-label { margin-top: 12px; color: var(--text-muted); font-size: 0.76rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; }
.ov-range { margin-top: clamp(26px, 4vh, 38px); }
.ov-range-track { position: relative; height: 6px; border-radius: 3px; background: var(--border-subtle); overflow: hidden; }
.ov-range-fill { position: absolute; inset: 0; border-radius: 3px; transform-origin: 0 50%; background: linear-gradient(90deg, rgba(var(--ep-energy), 0.35), rgba(var(--ep-energy), 0.95)); box-shadow: 0 0 18px rgba(var(--ep-energy), 0.5); }
.ep-js .ov-range-fill { transform: scaleX(0); transition: transform 1.8s var(--ep-ease) 0.3s; }
.ep-js .is-in .ov-range-fill { transform: scaleX(1); }
.ov-range-ends { display: flex; justify-content: space-between; gap: 16px; margin-top: 12px; color: var(--text-muted); font-size: 0.82rem; line-height: 1.4; }
.ov-range-ends span:last-child { text-align: right; }
.ov-range-ends strong { display: block; color: var(--text-primary); font-size: 0.95rem; }
.ov-deal-copy p { font-size: clamp(1.05rem, 1.8vw, 1.28rem); line-height: 1.5; }
.ov-deal-copy p + p { margin-top: 16px; color: var(--text-secondary); font-size: 1rem; }
.ov-deal-copy .ov-by-app { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--border-subtle); color: var(--text-primary); font-weight: 600; }

/* Apply */
.ov-apply { display: grid; justify-items: center; gap: 30px; text-align: center; }
.ov-apply h2 { font-size: clamp(2.2rem, 6.4vw, 4.6rem); font-weight: 800; line-height: 1.04; letter-spacing: -0.035em; text-wrap: balance; }
.ov-apply .ep-button { min-width: 240px; }

/* ---------- Smaller screens ---------- */
@media (max-width: 1020px) {
    .ov-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ov-options, .ov-options.ov-options--two { grid-template-columns: minmax(0, 1fr); max-width: 680px; margin-left: auto; margin-right: auto; }
    .ov-keeps { grid-template-columns: minmax(0, 1fr); }
    .ov-stack { max-width: 560px; width: 100%; margin: 0 auto; }
    .ov-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 28px; }
    .ov-timeline::before, .ov-timeline::after { display: none; }
    .ov-deal { grid-template-columns: minmax(0, 1fr); }
    .ov-equity { font-size: clamp(2.8rem, 12vw, 5rem); }
}
@media (max-width: 760px) {
    .ov-vault ul, .ov-signals { grid-template-columns: minmax(0, 1fr); }
    .ov-vault li:nth-last-child(-n + 3) { border-bottom: 1px solid var(--border-subtle); }
    .ov-vault li:last-child { border-bottom: 0; }
    .ov-more { grid-template-columns: minmax(0, 1fr); }
    .ov-more .ep-button { min-width: 0; width: 100%; }
    /* The timeline turns vertical: the line runs down the left. */
    .ov-timeline { grid-template-columns: minmax(0, 1fr); gap: 30px; }
    .ov-timeline::before, .ov-timeline::after { display: block; top: 28px; bottom: 28px; left: 27px; right: auto; width: 1px; height: auto; }
    .ov-timeline::after { background: linear-gradient(180deg, rgba(var(--ep-energy), 0.9), rgba(var(--ep-energy), 0.4)); transform-origin: 50% 0; }
    .ep-js .ov-timeline::after { transform: scaleY(0); }
    .ep-js .ov-timeline.is-in::after { transform: scaleY(1); }
    .ov-step { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 20px; }
    .ov-step-dot { grid-row: span 2; }
    .ov-step h3 { margin-top: 14px; }
    .ov-step p { max-width: none; }
}
@media (max-width: 640px) {
    .ov-tiles, .ov-tiles--3 { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .ov-tile { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; align-items: start; }
    .ov-tile .ov-icon { grid-row: span 2; width: 34px; height: 34px; }
    .ov-tile h3 { margin-top: 2px; }
    .ov-unlocked { justify-content: flex-start; text-align: left; }
    .ov-split { grid-template-columns: minmax(0, 1fr); }
    .ov-split > div + div { border-left: 0; border-top: 1px solid var(--border-subtle); }
    .ov-signal { padding: 18px 20px; }
    .ov-apply .ep-button { width: 100%; }
    .ov-stack { height: 300px; }
    .ov-stack { --size: 200px; --gap: 38px; }
    .ov-layer-face { padding: 12px 14px; font-size: 0.7rem; }
    .ov-ring { opacity: 0.6; }
    .ov-hero { min-height: min(74vh, 640px); min-height: min(74svh, 640px); }
}
@media (max-width: 900px) and (orientation: landscape) and (max-height: 500px) {
    .ov-hero { min-height: 0; padding: 26px 0 84px; }
    .ov-hero h1 { font-size: clamp(2.2rem, 7vw, 3.8rem); }
    .ov-ring { width: 360px; margin: -180px 0 0 -180px; }
}
/* No hover lift on touch screens: a tap must not leave a card raised. */
@media (hover: none) {
    .ov-tile:hover, .ov-option:hover { translate: none; box-shadow: var(--ep-glass-shadow); border-color: var(--ep-glass-border); }
    .ov-tile:hover::before { opacity: 0; }
}

/* Reduce motion: everything is shown at once, nothing moves. */
@media (prefers-reduced-motion: reduce) {
    .ov-main *, .ov-main *::before, .ov-main *::after { animation: none !important; transition: none !important; }
    .ep-js .ov-option-rows li, .ep-js .ov-step h3, .ep-js .ov-step p { opacity: 1; transform: none; }
    .ep-js .ov-option::before, .ep-js .ov-range-fill, .ep-js .ov-timeline::after { transform: none; }
    .ep-js .ov-mark path, .ep-js .ov-draw path, .ep-js .ov-draw rect, .ep-js .ov-draw circle { stroke-dashoffset: 0; }
    .ep-js .ov-stack:not(.is-in) .ov-layer { opacity: 1; transform: translate3d(0, calc(var(--l) * var(--gap) * -1), 0); }
    .ov-lock-shackle { transform: translate3d(0, -5px, 0) rotate(28deg); }
    .ov-depth--far, .ov-depth--near, .ov-stack-tilt { transform: none; }
    .ov-tile:hover, .ov-option:hover { translate: none; }
}

/* The equity count keeps its width while it counts up. */
.ov-equity [data-count] { display: inline-block; min-width: 1.7ch; text-align: right; }
