@font-face {
    font-display: swap;
    font-family: 'Roboto Loc';
    font-style: normal;
    font-weight: 400;
    src: url('/runway/rbt-400.woff2') format('woff2');
}

@font-face {
    font-display: swap;
    font-family: 'Roboto Loc';
    font-style: normal;
    font-weight: 500;
    src: url('/runway/rbt-500.woff2') format('woff2');
}

@font-face {
    font-display: swap;
    font-family: 'Roboto Loc';
    font-style: normal;
    font-weight: 600 700;
    src: url('/runway/rbt-700.woff2') format('woff2');
}

:root {
    --prime: #191f34;
    --flare: #3a51fe;
    --accent-pressed: #133aff;
    --page: #0e1424;
    --bg-elevated: #161d31;
    --script: #FFFFFF;
    --quiet: #c1c1c1;
    --line: #2a3352;
    --line-strong: #46527e;
    --grad-1: #ffe385;
    --gradient-mid: #fe4d22;
    --caution: #9f1239;
    --beam: #b9c4ff;
    --deep: #080c17;
    --s-2xs: 4px;
    --s-xs: 8px;
    --s-sm: 12px;
    --s-md: 16px;
    --s-lg: 24px;
    --s-xl: 40px;
    --s-2xl: 64px;
    --s-3xl: 96px;
    --sec-y: 40px;
    --capsule: 9999px;
    --orb: 50%;
    --r-2xs: 2px;
    --r-xs: 4px;
    --r-sm: 10px;
    --r-md: 16px;
    --r-lg: 28px;
    --r-xl: 34px;
    --r-2xl: 40px;
    --r-3xl: 48px;
    --title: 'Roboto Loc', 'Segoe UI', system-ui, sans-serif;
    --copy: 'Roboto Loc', 'Segoe UI', system-ui, sans-serif;
    --z-title: 36px;
    --h2: 26px;
    --sub: 20px;
    --sub-2: 17px;
    --sm-2: 14px;
    --h6: 12px;
    --normal: 14px;
    --caption: 12px;
    --xs: 11px;
    --close: 1.15;
    --even: 1.45;
    --loose: 1.6;
    --plain: 400;
    --half: 500;
    --heavy: 700;
    --tight: -0.01em;
    --e-normal: 0;
    --wide: 0.06em;
    --d-2xs: 0 1px 2px rgba(3, 6, 14, 0.4);
    --d-xs: 0 2px 4px rgba(3, 6, 14, 0.45);
    --d-sm: 0 4px 10px rgba(3, 6, 14, 0.5);
    --d-md: 0 10px 28px rgba(3, 6, 14, 0.55);
    --d-lg: 0 20px 48px rgba(3, 6, 14, 0.6);
    --d-xl: 0 26px 60px rgba(3, 6, 14, 0.62);
    --d-2xl: 0 32px 72px rgba(3, 6, 14, 0.66);
    --d-3xl: 0 40px 88px rgba(3, 6, 14, 0.7);
    --snap: 221ms;
    --steady: 400ms;
    --long: 816ms;
    --land: cubic-bezier(0.32, 0.79, 0.5, 0.99);
    --start: cubic-bezier(0.54, 0.1, 0.49, 0.94);
    --in-out: cubic-bezier(0.54, 0.1, 0.49, 0.94);
    --pop: cubic-bezier(0.43, 1.6, 0.57, 1.2);
    --max: 1420px;
    --readable: 1420px;
    --slim: 470px;
    --pad-lg: 48px;
    --edge-mid: 32px;
    --padding-mobile: 16px;
    --hair: 1px;
    --mid: 2px;
    --b-heavy: 3px;
    --height-desktop: 76px;
    --size-mobile: 64px;
    --sm-bp: 580px;
    --md-bp: 860px;
    --lg-bp: 1160px;
    --xl-bp: 1520px;
    --h-pad: 76px;
    --frame: calc(var(--max) + 2 * var(--pad-lg));
}

* {
    box-sizing: border-box;
}

html,
body {
    overflow-x: clip;
}

body {
    background: var(--page);
    color: var(--script);
    display: flex;
    flex-direction: column;
    font-family: var(--copy);
    font-size: var(--normal);
    line-height: var(--even);
    margin: 0;
    min-height: 100vh;
    padding-top: var(--h-pad, 76px);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--title);
    line-height: var(--close);
    margin: 0;
    overflow-wrap: anywhere;
}

h1 {
    font-size: clamp(28px, 4.4vw, var(--z-title));
}

h2 {
    font-size: clamp(22px, 3vw, var(--h2));
}

h3 {
    font-size: var(--sub);
}

p {
    margin: 0;
    overflow-wrap: anywhere;
}

ul,
ol {
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
}

table {
    border-collapse: collapse;
}

a {
    color: var(--beam);
    transition: color var(--snap) var(--land), text-decoration-thickness var(--snap) var(--land);
}

a:hover {
    color: var(--grad-1);
}

button {
    font-family: inherit;
}

.shell {
    display: flex;
    flex: 1 0 auto;
    flex-direction: column;
    gap: var(--s-xs);
}

.skiphop {
    background: var(--grad-1);
    border-radius: var(--r-xs);
    color: var(--deep);
    left: var(--s-md);
    padding: var(--s-xs) var(--s-md);
    position: fixed;
    top: -240px;
    z-index: 220;
}

.skiphop:focus {
    top: var(--s-md);
}

.sr-only {
    clip: rect(0 0 0 0);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

/* ── befa — legal section (LEGAL-05) ─────────────────────────────────── */
.befa {
    background: var(--page);
    padding-block: var(--sec-y);
}

.befa-wrap {
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.befa-intro {
    color: var(--script);
    font-size: var(--sub-2);
    line-height: var(--loose);
}

.befa-set {
    margin-block-start: var(--s-lg);
}

.befa-term {
    color: var(--script);
    font-family: var(--title);
    font-size: var(--sub-2);
    font-weight: var(--heavy);
    margin-block-end: var(--s-xs);
    margin-block-start: var(--s-lg);
}

.befa-term::before {
    background: var(--grad-1);
    content: '';
    display: block;
    height: 2px;
    margin-block-end: var(--s-xs);
    width: 30px;
}

.befa-note {
    color: var(--quiet);
    display: flex;
    flex-direction: column;
    gap: var(--s-sm);
    line-height: var(--loose);
    margin-block-end: var(--s-md);
    margin-inline-start: 0;
}

.befa-para {
    display: block;
}

.befa-desk {
    background: var(--bg-elevated);
    border: var(--hair) solid var(--line);
    border-radius: var(--r-lg);
    margin-block-start: var(--s-xl);
    padding: var(--s-lg);
}

.befa-lede {
    font-size: var(--sub);
    margin-block-end: var(--s-sm);
}

.befa-help {
    color: var(--quiet);
    display: flex;
    flex-direction: column;
    gap: var(--s-sm);
    list-style: none;
}

.befa-unit {
    border-inline-start: 2px solid var(--flare);
    padding-inline-start: var(--s-sm);
}

.befa-fine {
    color: var(--quiet);
    font-size: var(--caption);
    line-height: var(--loose);
    margin-block-start: var(--s-lg);
}

/* ── bidyti — footer (FOOT-03 Massive Centered) ──────────────────────── */
.bidyti {
    background: var(--deep);
    border-top: var(--hair) solid var(--line);
    padding-block: var(--s-2xl) var(--s-xl);
    text-align: center;
}

.bidyti-core {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: var(--s-lg);
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.bidyti-logo {
    display: inline-flex;
}

.bidyti-logo-plate {
    align-items: center;
    background: #f2f4ff;
    border-radius: var(--r-md);
    display: inline-flex;
    padding: var(--s-xs) var(--s-md);
}

.bidyti-logo-media {
    display: block;
    height: 76px;
    width: auto;
}

.bidyti-guide {
    width: 100%;
}

.bidyti-set {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-md) var(--s-lg);
    justify-content: center;
    list-style: none;
}

.bidyti-route {
    color: var(--script);
    font-family: var(--title);
    font-size: var(--normal);
    font-weight: var(--half);
    text-decoration: none;
    white-space: nowrap;
}

.bidyti-route:hover {
    color: var(--grad-1);
    text-decoration: underline;
}

.bidyti-para {
    color: var(--quiet);
    font-size: var(--caption);
    line-height: var(--loose);
}

.bidyti-lawline {
    align-items: center;
    color: var(--quiet);
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-sm);
    justify-content: center;
}

.bidyti-lawlede {
    color: var(--quiet);
    font-size: var(--xs);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

.bidyti-lawline .bidyti-route {
    font-family: var(--copy);
    font-size: var(--xs);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

.bidyti-lawline .bidyti-route + .bidyti-route::before {
    color: var(--line-strong);
    content: '·';
    margin-inline-end: var(--s-sm);
}

.bidyti-caution {
    background: var(--caution);
    border-radius: var(--r-md);
    color: #ffffff;
    font-size: var(--caption);
    line-height: var(--loose);
    padding: var(--s-sm) var(--s-md);
    width: 100%;
}

.bidyti-badge {
    background: #ffffff;
    border-radius: var(--r-xs);
    color: var(--caution);
    font-weight: var(--heavy);
    margin-inline-end: var(--s-xs);
    padding: 1px var(--s-2xs);
}

.bidyti-guard {
    color: #ffffff;
    text-decoration: underline;
}

.bidyti-guard:hover {
    color: var(--grad-1);
}

.bidyti-fine {
    color: var(--quiet);
    font-size: var(--xs);
}

/* ── fypa — inline CTA (INLINE-CTA-05) ───────────────────────────────── */
.fypa {
    background: var(--bg-elevated);
    border-block: var(--hair) solid var(--line);
    display: block;
    padding-block: var(--s-lg);
}

.fypa-wrap {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: var(--s-sm);
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    text-align: center;
    width: 100%;
}

.fypa-quote {
    color: var(--script);
    font-family: var(--title);
    font-size: var(--sub);
    font-style: italic;
    margin: 0;
    max-width: var(--slim);
}

.fypa-key {
    align-items: center;
    display: inline-flex;
}

.fypa-fine {
    color: var(--quiet);
    font-size: var(--xs);
}

/* ── gysury — faq (FAQ-05 Detail-Tag Native) ─────────────────────────── */
.gysury {
    background: var(--page);
    padding-block: var(--sec-y);
}

.gysury-wrap {
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.gysury-lede {
    margin-block-end: var(--s-lg);
}

.gysury-set {
    list-style: none;
}

.gysury-unit {
    border-bottom: var(--hair) solid var(--line);
}

.gysury-fold {
    padding-block: var(--s-md);
}

.gysury-ask {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: var(--s-md);
    justify-content: space-between;
    list-style: none;
}

.gysury-ask::-webkit-details-marker {
    display: none;
}

.gysury-ask::after {
    border-bottom: 2px solid var(--grad-1);
    border-right: 2px solid var(--grad-1);
    content: '';
    display: block;
    flex-shrink: 0;
    height: 9px;
    transform: rotate(45deg);
    transition: transform var(--snap) var(--land);
    width: 9px;
}

.gysury-fold[open] .gysury-ask::after {
    transform: rotate(225deg);
}

.gysury-head {
    color: var(--script);
    font-size: var(--sm-2);
    font-weight: var(--heavy);
    margin: 0;
}

.gysury-ask:hover .gysury-head {
    color: var(--grad-1);
}

.gysury-part {
    padding-block-start: var(--s-sm);
}

.gysury-fold[open] .gysury-part {
    animation: gysury-open var(--snap) var(--land);
}

.gysury-para {
    color: var(--quiet);
    line-height: var(--loose);
}

@keyframes gysury-open {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* ── lekod — error block (ERR-02 Split Editorial) ────────────────────── */
.lekod {
    background: var(--page);
    padding-block: var(--s-2xl);
}

.lekod-wrap {
    align-items: center;
    display: grid;
    gap: var(--s-xl);
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    margin-inline: auto;
    max-width: var(--frame);
    overflow: hidden;
    padding-inline: var(--pad-lg);
    width: 100%;
}

.lekod-part {
    display: flex;
    flex-direction: column;
    gap: var(--s-md);
}

.lekod-badge {
    color: var(--grad-1);
    font-size: var(--xs);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

.lekod-top {
    color: var(--script);
    margin-block-end: var(--s-2xs);
}

.lekod-para {
    color: var(--quiet);
    line-height: var(--loose);
}

.lekod-key {
    align-items: center;
    align-self: flex-start;
    background: var(--flare);
    border-radius: var(--r-md);
    color: #ffffff;
    display: inline-flex;
    font-family: var(--title);
    font-weight: var(--heavy);
    letter-spacing: var(--wide);
    min-height: 52px;
    padding-inline: var(--s-xl);
    text-decoration: none;
    text-transform: uppercase;
    transition: background var(--snap) var(--land), transform var(--snap) var(--land);
}

.lekod-key:hover {
    background: var(--accent-pressed);
    color: #ffffff;
    transform: scale(1.05);
}

.lekod-mark {
    color: var(--beam);
    display: block;
    font-family: var(--title);
    font-size: clamp(96px, 16vw, 240px);
    font-weight: var(--heavy);
    justify-self: end;
    line-height: var(--close);
    opacity: 0.3;
    overflow: hidden;
}

/* ── liroze — items grid (GRID-04 Icon-Decorated Cards) ──────────────── */
.liroze {
    background: var(--page);
    padding-block: var(--sec-y);
}

.liroze-wrap {
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.liroze-lede {
    margin-block-end: var(--s-lg);
}

.liroze-stack {
    display: grid;
    gap: var(--s-lg);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.liroze-panel {
    background: var(--bg-elevated);
    border: var(--hair) solid var(--line);
    border-radius: var(--r-lg);
    color: var(--script);
    padding: var(--s-lg);
    transition: background var(--steady) var(--land), border-color var(--steady) var(--land);
}

.liroze-panel:hover {
    background: var(--prime);
    border-color: var(--line-strong);
}

.liroze-orb {
    align-items: center;
    background: var(--flare);
    border-radius: var(--orb);
    color: #ffffff;
    display: flex;
    font-family: var(--title);
    font-size: var(--sub-2);
    font-weight: var(--heavy);
    height: 56px;
    justify-content: center;
    margin-block-end: var(--s-md);
    width: 56px;
}

.liroze-head {
    align-items: center;
    color: var(--script);
    display: flex;
    font-size: var(--sub-2);
    font-weight: var(--heavy);
    gap: var(--s-xs);
    margin-block-end: var(--s-sm);
}

.liroze-mark {
    color: var(--grad-1);
    fill: currentColor;
    flex-shrink: 0;
    height: 24px;
    width: 24px;
}

.liroze-para {
    color: var(--quiet);
    line-height: var(--even);
}

/* ── lotizen — data table (TABLE-07 Two-Tone Columns) ────────────────── */
.lotizen {
    background: var(--page);
    padding-block: var(--sec-y);
}

.lotizen-wrap {
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.lotizen-lede {
    margin-block-end: var(--s-lg);
}

.lotizen-scroll {
    -webkit-overflow-scrolling: touch;
    border: var(--hair) solid var(--line);
    border-radius: var(--r-md);
    overflow-x: auto;
}

.lotizen-board {
    background: var(--bg-elevated);
    color: var(--script);
    min-width: 640px;
    width: 100%;
}

.lotizen-board thead {
    background: var(--prime);
    color: var(--script);
}

.lotizen-board th,
.lotizen-board td {
    background: var(--bg-elevated);
    color: var(--script);
    padding: var(--s-md);
    text-align: start;
}

.lotizen-board thead th {
    background: var(--prime);
    color: var(--grad-1);
    font-size: var(--caption);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

.lotizen-board tbody td:nth-child(even),
.lotizen-board tbody th:nth-child(even) {
    background: var(--prime);
    color: var(--script);
}

.lotizen-line + .lotizen-line {
    border-top: var(--hair) solid var(--line);
}

/* ── lyxet — cookie banner (COOK-04 Slide-Up + Backdrop) ─────────────── */
.lyxet-veil {
    background: rgba(4, 7, 15, 0.55);
    display: none;
    inset: 0;
    pointer-events: none;
    position: fixed;
    z-index: 89;
}

.lyxet-veil.is-visible {
    display: block;
}

.lyxet {
    background: var(--prime);
    border-top: 4px solid var(--flare);
    bottom: 0;
    box-shadow: var(--d-lg);
    display: none;
    inset-inline: 0;
    padding-block: var(--s-lg);
    position: fixed;
    transform: translateY(100%);
    z-index: 90;
}

.lyxet.is-visible {
    animation: lyxet-rise var(--long) var(--land) forwards;
    display: block;
}

.lyxet-wrap {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: var(--s-md);
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    text-align: center;
    width: 100%;
}

.lyxet-lede {
    color: var(--script);
    font-family: var(--title);
    font-size: var(--sub-2);
    font-weight: var(--heavy);
}

.lyxet-message {
    color: var(--quiet);
    line-height: var(--loose);
    max-width: var(--slim);
}

.lyxet-keys {
    display: flex;
    gap: var(--s-md);
    justify-content: center;
}

.lyxet-key {
    border-radius: var(--r-md);
    cursor: pointer;
    font-size: var(--normal);
    font-weight: var(--half);
    min-height: 48px;
    padding-inline: var(--s-lg);
    white-space: nowrap;
}

.lyxet-accept {
    background: var(--grad-1);
    border: var(--hair) solid var(--grad-1);
    color: var(--deep);
}

.lyxet-accept:hover {
    background: #ffd34d;
    color: var(--deep);
}

.lyxet-reject {
    background: var(--bg-elevated);
    border: var(--hair) solid var(--line-strong);
    color: var(--script);
}

.lyxet-reject:hover {
    background: var(--line);
    color: var(--script);
}

@keyframes lyxet-rise {
    from {
        opacity: 0;
        transform: translateY(100%);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── meken — header (HEAD-BURGER, hide-show) ─────────────────────────── */
.meken {
    background: var(--prime);
    height: 76px;
    inset-inline: 0;
    position: fixed;
    top: 0;
    transition: transform var(--steady) var(--land);
    z-index: 100;
}

.meken.is-hidden {
    transform: translateY(-100%);
}

.meken-bar {
    align-items: center;
    display: flex;
    gap: var(--s-md);
    height: 76px;
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.meken-logo {
    display: inline-flex;
    flex-shrink: 0;
}

.meken-logo-plate {
    align-items: center;
    background: #f2f4ff;
    border-radius: var(--r-sm);
    display: inline-flex;
    flex-shrink: 0;
    padding: 3px 10px;
}

.meken-logo-media {
    display: block;
    flex-shrink: 0;
    height: 60px;
    width: auto;
}

.meken-menu-toggle {
    background: var(--prime);
    border: 0;
    color: var(--script);
    cursor: pointer;
    font-family: var(--title);
    font-size: var(--sm-2);
    font-weight: var(--half);
    letter-spacing: var(--wide);
    margin-inline-start: auto;
    min-height: 44px;
    padding-inline: var(--s-xs);
    text-transform: uppercase;
}

.meken-menu-toggle:hover {
    color: var(--grad-1);
}

.meken-menu-word {
    border-bottom: 2px solid var(--grad-1);
    padding-bottom: 2px;
}

.meken-zone {
    border: var(--hair) solid var(--line-strong);
    border-radius: var(--r-xs);
    color: var(--script);
    font-size: var(--xs);
    letter-spacing: var(--wide);
    padding: 3px var(--s-xs);
}

.meken-flag {
    background: var(--caution);
    border-radius: var(--r-xs);
    color: #ffffff;
    font-size: var(--xs);
    font-weight: var(--heavy);
    padding: 3px var(--s-xs);
}

.meken-keys {
    display: flex;
    gap: var(--s-sm);
}

.meken-key {
    align-items: center;
    border-radius: var(--r-2xs);
    display: inline-flex;
    flex-shrink: 0;
    font-family: var(--title);
    font-size: var(--sm-2);
    font-weight: var(--heavy);
    min-height: 44px;
    padding-inline: var(--s-lg);
    text-decoration: none;
    white-space: nowrap;
}

.meken-key-main {
    letter-spacing: var(--wide);
    text-align: center;
}

.meken-quiet-key {
    background: var(--prime);
    border: var(--hair) solid var(--line-strong);
    color: var(--script);
}

.meken-quiet-key:hover {
    background: var(--line);
    color: var(--grad-1);
}

.meken-flyout {
    background: var(--prime);
    border-top: var(--hair) solid var(--line);
    box-shadow: var(--d-lg);
    display: none;
    inset-inline: 0;
    max-height: calc(100vh - 76px);
    overflow-y: auto;
    position: absolute;
    top: 100%;
}

.meken-flyout.is-open {
    display: block;
}

.meken-guide {
    margin-inline: auto;
    max-width: var(--frame);
    padding: var(--s-md) var(--pad-lg) var(--s-lg);
    width: 100%;
}

.meken-set {
    display: grid;
    gap: var(--s-2xs);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    list-style: none;
}

.meken-unit {
    display: block;
}

.meken-route {
    color: var(--script);
    display: block;
    font-family: var(--title);
    font-size: var(--sub-2);
    font-weight: var(--half);
    padding: var(--s-sm) var(--s-md);
    text-decoration: none;
    white-space: nowrap;
}

.meken-route:hover {
    background: var(--bg-elevated);
    color: var(--grad-1);
}

.meken-route[aria-current='page'] {
    box-shadow: inset 6px 0 0 var(--grad-1);
    color: var(--grad-1);
}

/* ── mukipis — page header (PHEAD-07 Number + Title) ─────────────────── */
.mukipis {
    background: var(--page);
    padding-block: var(--sec-y);
}

.mukipis-wrap {
    display: grid;
    gap: var(--s-lg);
    grid-template-columns: 120px minmax(0, 1fr);
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.mukipis-index {
    align-self: start;
    color: var(--flare);
    font-family: var(--title);
    font-size: clamp(38px, 6vw, 50px);
    font-weight: var(--heavy);
    line-height: var(--close);
}

.mukipis-top {
    color: var(--script);
}

.mukipis-part {
    display: flex;
    flex-direction: column;
    gap: var(--s-sm);
}

.mukipis-badge {
    color: var(--grad-1);
    font-size: var(--xs);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

/* ── nevony — prose (PROSE-28 stepped indents) ───────────────────────── */
.nevony {
    background: var(--page);
    padding-block: var(--sec-y);
}

.nevony-wrap {
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.nevony-part {
    padding-block-end: var(--s-lg);
}

.nevony-part + .nevony-part {
    border-top: var(--hair) solid var(--line);
    padding-block-start: var(--s-lg);
}

.nevony-lede {
    color: var(--script);
    font-size: clamp(24px, 3.2vw, 30px);
    font-weight: 600;
    margin-block-end: var(--s-md);
}

.nevony-sublede {
    color: var(--grad-1);
    font-size: var(--sub);
    margin-block: var(--s-md) var(--s-xs);
}

.nevony-para {
    color: var(--quiet);
    line-height: var(--loose);
    margin-block-end: var(--s-sm);
}

.nevony-part p:nth-of-type(2) {
    margin-inline-start: var(--s-sm);
}

.nevony-part p:nth-of-type(3) {
    margin-inline-start: var(--s-lg);
}

.nevony-part p:nth-of-type(n + 4) {
    margin-inline-start: var(--s-xl);
}

.nevony-set,
.nevony-steps {
    color: var(--quiet);
    display: flex;
    flex-direction: column;
    gap: var(--s-xs);
    line-height: var(--loose);
    margin-block: var(--s-sm);
    padding-inline-start: var(--s-lg);
}

.nevony-set {
    list-style: none;
}

.nevony-set .nevony-unit::before {
    color: var(--flare);
    content: '';
    background: var(--grad-1);
    border-radius: var(--orb);
    display: inline-block;
    height: 6px;
    margin-inline-end: var(--s-xs);
    vertical-align: middle;
    width: 6px;
}

.nevony-steps {
    list-style: decimal;
}

.nevony-unit {
    color: var(--quiet);
}

.nevony-route {
    color: var(--beam);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.nevony-route:hover {
    color: var(--grad-1);
    text-decoration-thickness: 2px;
}

.nevony-part strong {
    color: var(--script);
}

/* ── nufet — author byline (BYLINE-03 thin strip) ────────────────────── */
.nufet {
    background: var(--page);
    border-bottom: var(--hair) solid var(--line);
    padding-block: var(--s-sm);
}

.nufet-wrap {
    align-items: center;
    display: flex;
    gap: var(--s-sm);
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.nufet-shot {
    border-radius: var(--orb);
    flex-shrink: 0;
    height: 28px;
    object-fit: cover;
    width: 28px;
}

.nufet-facts {
    color: var(--quiet);
    font-size: var(--caption);
}

.nufet-name {
    color: var(--beam);
    text-decoration: none;
}

.nufet-name:hover {
    color: var(--grad-1);
    text-decoration: underline;
}

.nufet-role {
    color: var(--quiet);
}

/* ── redul — author card (AUTH-02 Vertical Centered) ─────────────────── */
.redul {
    background: var(--page);
    padding-block: var(--sec-y);
}

.redul-wrap {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    text-align: center;
    width: 100%;
}

.redul-shot {
    border-radius: var(--orb);
    height: 140px;
    margin-block-end: var(--s-lg);
    object-fit: cover;
    width: 140px;
}

.redul-role {
    color: var(--grad-1);
    font-size: var(--caption);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

.redul-name {
    margin-block: var(--s-xs) var(--s-sm);
}

.redul-para {
    color: var(--quiet);
    line-height: var(--loose);
    margin-block-end: var(--s-md);
}

.redul-set {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-xs);
    justify-content: center;
    list-style: none;
}

.redul-badge {
    background: var(--bg-elevated);
    border: var(--hair) solid var(--line-strong);
    border-radius: var(--capsule);
    color: var(--script);
    font-size: var(--caption);
    padding: var(--s-2xs) var(--s-sm);
}

/* ── telife — reviews (REV-09 Magazine Pull-Quote) ───────────────────── */
.telife {
    background: var(--page);
    padding-block: var(--sec-y);
}

.telife-wrap {
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.telife-lede {
    margin-block-end: var(--s-lg);
    text-align: center;
}

.telife-unit {
    padding-block: var(--s-lg);
    text-align: center;
}

.telife-quote {
    color: var(--script);
    font-family: var(--title);
    font-size: clamp(18px, 2.4vw, var(--sub));
    font-style: italic;
    line-height: var(--close);
    margin: 0 auto;
    max-width: var(--slim);
}

.telife-facts {
    align-items: center;
    color: var(--quiet);
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-sm);
    justify-content: center;
    margin-block-start: var(--s-sm);
}

.telife-name {
    color: var(--quiet);
    font-size: var(--caption);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

.telife-score {
    color: var(--grad-1);
    font-size: var(--caption);
    letter-spacing: var(--wide);
}

.telife-rule {
    border: 0;
    border-top: var(--hair) solid var(--line-strong);
    margin-inline: auto;
    width: 80px;
}

/* ── toker — contact form (FORM-07 Card with Accent Header) ──────────── */
.toker {
    background: var(--page);
    padding-block: var(--sec-y);
}

.toker-wrap {
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.toker-panel {
    background: var(--bg-elevated);
    border-radius: var(--r-lg);
    overflow: hidden;
    padding: var(--s-xl);
    padding-block-start: calc(var(--s-xl) + 8px);
    position: relative;
}

.toker-strip {
    background: var(--flare);
    display: block;
    height: 8px;
    inset-block-start: 0;
    inset-inline: 0;
    position: absolute;
}

.toker-form {
    display: grid;
    gap: var(--s-md);
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.toker-box {
    display: flex;
    flex-direction: column;
    gap: var(--s-2xs);
}

.toker-box-wide {
    grid-column: 1 / -1;
}

.toker-badge {
    color: var(--script);
    font-size: var(--caption);
    letter-spacing: var(--wide);
    text-transform: uppercase;
}

.toker-input {
    background: var(--page);
    border: var(--hair) solid var(--line-strong);
    border-radius: var(--r-md);
    color: var(--script);
    font-family: var(--copy);
    font-size: var(--normal);
    min-height: 48px;
    padding: var(--s-sm) var(--s-md);
    width: 100%;
}

.toker-input:focus {
    border-color: var(--grad-1);
    outline: 2px solid var(--grad-1);
}

.toker-area {
    min-height: 132px;
    resize: vertical;
}

.toker-key {
    background: var(--flare);
    border: 0;
    border-radius: var(--r-md);
    color: #ffffff;
    cursor: pointer;
    font-family: var(--title);
    font-size: var(--sm-2);
    font-weight: var(--heavy);
    grid-column: 1 / -1;
    justify-self: center;
    letter-spacing: var(--wide);
    min-height: 52px;
    padding-inline: var(--s-2xl);
    text-transform: uppercase;
    transition: background var(--snap) var(--land), transform var(--snap) var(--land);
}

.toker-key:hover {
    background: var(--accent-pressed);
    color: #ffffff;
    transform: scale(1.05);
}

.toker-done {
    background: var(--prime);
    border-radius: var(--r-md);
    color: var(--grad-1);
    display: none;
    line-height: var(--loose);
    padding: var(--s-lg);
}

.toker-done.is-visible {
    display: block;
}

/* ── vulikox — cta block (CTA-01 Full-Width Strip) ───────────────────── */
.vulikox {
    background: var(--flare);
    padding-block: var(--s-2xl);
}

.vulikox-wrap {
    align-items: center;
    display: flex;
    gap: var(--s-xl);
    justify-content: space-between;
    margin-inline: auto;
    max-width: var(--frame);
    padding-inline: var(--pad-lg);
    width: 100%;
}

.vulikox-part {
    display: flex;
    flex-direction: column;
    gap: var(--s-sm);
}

.vulikox-top {
    color: #ffffff;
    letter-spacing: var(--tight);
    max-width: var(--slim);
    text-transform: uppercase;
}

.vulikox-para {
    color: #ffffff;
    line-height: var(--even);
}

.vulikox-fine {
    color: #f0f2ff;
    font-size: var(--xs);
}

.vulikox-key {
    flex-shrink: 0;
    min-width: 220px;
}

/* ── xipymi — hero (HERO-04 Slider Multi-Slide) ──────────────────────── */
.xipymi {
    background: var(--deep);
    display: block;
    position: relative;
}

.xipymi-track {
    display: block;
}

.xipymi-slide {
    display: none;
    min-height: clamp(430px, 58vh, 560px);
    position: relative;
}

.xipymi-slide.is-open {
    display: grid;
}

.xipymi-slide-quiet {
    background: var(--deep);
}

.xipymi-media {
    height: 100%;
    inset: 0;
    object-fit: cover;
    object-position: center 30%;
    position: absolute;
    width: 100%;
}

.xipymi-media-1 {
    object-position: left 60%;
}

.xipymi-media-2 {
    object-position: right 20%;
}

.xipymi-veil {
    background-image: linear-gradient(96deg, rgba(8, 12, 23, 0.94) 8%, rgba(8, 12, 23, 0.72) 48%, rgba(25, 31, 52, 0.55) 100%);
    display: block;
    inset: 0;
    position: absolute;
}

.xipymi-wrap {
    align-items: center;
    display: flex;
    margin-inline: auto;
    max-width: var(--frame);
    padding-block: var(--s-2xl);
    padding-inline: var(--pad-lg);
    position: relative;
    width: 100%;
}

.xipymi-part {
    display: flex;
    flex-direction: column;
    gap: var(--s-md);
    max-width: 760px;
}

.xipymi-badge {
    align-self: flex-start;
    background: var(--prime);
    border-radius: var(--capsule);
    color: var(--grad-1);
    font-size: var(--xs);
    letter-spacing: var(--wide);
    padding: var(--s-2xs) var(--s-sm);
    text-transform: uppercase;
}

.xipymi-top {
    color: var(--script);
}

.xipymi-sub {
    color: var(--quiet);
    font-size: var(--sub-2);
    line-height: var(--loose);
    max-width: var(--slim);
}

.xipymi-keys {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-md);
}

.xipymi-key {
    align-items: center;
    display: inline-flex;
}

.xipymi-fine {
    color: var(--quiet);
    font-size: var(--xs);
}

.xipymi-lede {
    color: var(--script);
    font-family: var(--title);
    font-size: clamp(20px, 3vw, 28px);
    font-weight: var(--heavy);
    max-width: 620px;
}

.xipymi-dial {
    align-items: center;
    bottom: var(--s-md);
    display: flex;
    gap: var(--s-sm);
    inset-inline-end: var(--s-lg);
    position: absolute;
    z-index: 3;
}

.xipymi-step {
    background: var(--prime);
    border: var(--hair) solid var(--line-strong);
    border-radius: var(--orb);
    color: var(--script);
    cursor: pointer;
    font-size: var(--sm-2);
    height: 44px;
    width: 44px;
}

.xipymi-step-back,
.xipymi-step-on {
    line-height: 1;
}

.xipymi-step:hover {
    background: var(--flare);
    color: #ffffff;
}

.xipymi-dots {
    align-items: center;
    display: flex;
    gap: var(--s-xs);
}

.xipymi-dot {
    background: var(--line-strong);
    border: 0;
    border-radius: var(--orb);
    cursor: pointer;
    height: 10px;
    padding: 0;
    width: 10px;
}

.xipymi-dot[aria-current='true'] {
    background: var(--grad-1);
    width: 26px;
    border-radius: var(--capsule);
}

/* ── reveal on scroll (rise) ─────────────────────────────────────────── */
[data-reveal] {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity var(--long) var(--land), transform var(--long) var(--land);
}

[data-reveal].is-visible {
    opacity: 1;
    transform: none;
}

/* ── tablet ──────────────────────────────────────────────────────────── */
@media (max-width: 1160px) {
    .liroze-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .meken-bar,
    .bidyti-core,
    .befa-wrap,
    .fypa-wrap,
    .gysury-wrap,
    .lekod-wrap,
    .liroze-wrap,
    .lotizen-wrap,
    .lyxet-wrap,
    .meken-guide,
    .mukipis-wrap,
    .nevony-wrap,
    .nufet-wrap,
    .redul-wrap,
    .telife-wrap,
    .toker-wrap,
    .vulikox-wrap,
    .xipymi-wrap {
        padding-inline: var(--edge-mid);
    }

    .meken-quiet-key {
        display: none;
    }

    .vulikox-wrap {
        align-items: flex-start;
        flex-direction: column;
        gap: var(--s-lg);
    }
}

/* ── mobile ──────────────────────────────────────────────────────────── */
@media (max-width: 860px) {
    :root {
        --z-title: 26px;
        --h2: 22px;
        --sub: 18px;
        --sub-2: 16px;
        --sm-2: 13px;
        --h6: 11px;
        --normal: 14px;
        --caption: 12px;
        --xs: 10px;
        --sec-y: 32px;
    }

    body {
        padding-top: var(--h-pad, 64px);
    }

    .meken,
    .meken-bar {
        height: 64px;
    }

    .meken-flyout {
        max-height: calc(100vh - 64px);
    }

    .meken-logo-media {
        height: 44px;
    }

    .meken-zone {
        display: none;
    }

    .meken-bar,
    .bidyti-core,
    .befa-wrap,
    .fypa-wrap,
    .gysury-wrap,
    .lekod-wrap,
    .liroze-wrap,
    .lotizen-wrap,
    .lyxet-wrap,
    .meken-guide,
    .mukipis-wrap,
    .nevony-wrap,
    .nufet-wrap,
    .redul-wrap,
    .telife-wrap,
    .toker-wrap,
    .vulikox-wrap,
    .xipymi-wrap {
        padding-inline: var(--padding-mobile);
    }

    .meken-set {
        grid-template-columns: minmax(0, 1fr);
    }

    .meken-key {
        font-size: var(--caption);
        padding-inline: var(--s-sm);
    }

    .liroze-stack {
        grid-template-columns: minmax(0, 1fr);
    }

    .lekod-wrap {
        grid-template-columns: minmax(0, 1fr);
    }

    .lekod-mark {
        font-size: clamp(80px, 30vw, 140px);
        justify-self: start;
    }

    .mukipis-wrap {
        gap: var(--s-sm);
        grid-template-columns: minmax(0, 1fr);
    }

    .mukipis-index {
        font-size: 34px;
    }

    .nevony-part p:nth-of-type(2),
    .nevony-part p:nth-of-type(3),
    .nevony-part p:nth-of-type(n + 4) {
        margin-inline-start: 0;
    }

    .toker-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .toker-panel {
        padding: var(--s-lg);
        padding-block-start: calc(var(--s-lg) + 8px);
    }

    .toker-box {
        flex: 0 0 auto;
    }

    .xipymi-slide {
        min-height: 320px;
    }

    .xipymi-wrap {
        padding-block: var(--s-xl) var(--s-2xl);
    }

    .xipymi-part {
        max-width: none;
    }

    .xipymi-dial {
        bottom: var(--s-sm);
        inset-inline: 0;
        justify-content: center;
    }

    .xipymi-step {
        display: none;
    }

    .bidyti-logo-media {
        height: 56px;
    }
}

@media (max-width: 580px) {
    .lyxet-keys {
        flex-direction: column;
        width: 100%;
    }

    .lyxet-key {
        white-space: normal;
        width: 100%;
    }

    .meken,
    .meken-bar {
        height: auto;
        min-height: 64px;
    }

    .meken-bar {
        flex-wrap: wrap;
        padding-block: var(--s-xs);
        row-gap: var(--s-xs);
    }

    .meken-logo-media {
        height: 40px;
    }

    .meken-menu-toggle {
        margin-inline-start: auto;
    }

    .meken-keys {
        flex-basis: 100%;
        gap: var(--s-xs);
    }

    .meken-keys .meken-key {
        flex: 1 1 auto;
        font-size: 12px;
        justify-content: center;
        letter-spacing: 1px;
        min-height: 44px;
        padding-inline: var(--s-sm);
    }
}

@media (max-width: 720px) {
    .lyxet,
    .lyxet-wrap {
        font-size: 13px;
        gap: var(--s-xs);
        line-height: 1.35;
        padding-block: var(--s-sm);
    }

    .lyxet-lede {
        display: none;
    }

    .lyxet-key {
        font-size: var(--caption);
        min-height: 44px;
        padding-inline: var(--s-md);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    [data-reveal] {
        opacity: 1;
        transform: none;
    }
}
/* Offer CTA */
.awzb-act{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;padding:0 30px;border:1px solid #080C17;border-radius:2px;
  background:#C026D3;color:#FFFFFF;text-decoration:none;
  font-size:15px;font-weight:600;letter-spacing:1.8px;text-transform:uppercase;
  box-shadow:0 3px 9px rgba(0,0,0,.22);transition:background .12s ease,color .12s ease,transform .12s ease,box-shadow .12s ease}
.awzb-act:hover{background:#A21CAF;color:#FFFFFF;box-shadow:0 1px 6px rgba(0,0,0,.28);animation:none}
.awzb-act:hover::after{animation:none}
.awzb-act:active{background:#86198F;color:#FFFFFF}
.awzb-act:focus-visible{outline:3px solid #080C17;outline-offset:3px}
.awzb-act{animation:breathe_awzb 4.45s linear infinite}
@keyframes breathe_awzb{0%{transform:scale(1);animation-timing-function:cubic-bezier(.25,.8,.35,1)}12.360%{transform:scale(1.07);animation-timing-function:cubic-bezier(.45,.05,.55,.95)}34.831%,100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.awzb-act,.awzb-act::after{animation:none!important;transition:none!important}}

.telife-page-figure {
	margin-block: 1.5rem;
}

.telife-page-figure img {
	display: block;
	max-width: 100%;
	max-height: 56vh;
	width: auto;
	height: auto;
	margin-inline: auto;
}

.nevony-page-figure {
	margin-block: 1.5rem;
}

.nevony-page-figure img {
	display: block;
	max-width: 100%;
	max-height: 56vh;
	width: auto;
	height: auto;
	margin-inline: auto;
}
