/* ==========================================================================
   nv casino RO — foaia de stil principală
   Ordinea regulilor: tokens → tipuri de literă → reset → utilitare →
   blocuri de pagină → variante mobile.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens de proiectare
   -------------------------------------------------------------------------- */
:root {
    /* culori */
    --hue-prime: #3a2a7b;
    --hue-focus: #d31f10;
    --hue-accent-pressed: #af1b0d;
    --hue-field: #ffffff;
    --hue-bg-elevated: #f5f3fa;
    --hue-body: #202a38;
    --hue-soft-text: #4b5566;
    --hue-edge: #e2e0ec;
    --hue-edge-hard: #b9b3d0;
    --hue-gradient-light: #f57975;
    --hue-fade-bottom: #ef3631;
    --hue-advisory: #cc2936;
    --hue-on-prime: #ffffff;
    --hue-on-prime-soft: #d9d4ee;
    --hue-wash: #f4f2fa;

    /* spațiere */
    --step-2xs: 4px;
    --step-xs: 8px;
    --step-sm: 12px;
    --step-md: 16px;
    --step-lg: 24px;
    --step-xl: 40px;
    --step-2xl: 64px;
    --step-3xl: 96px;

    /* rotunjiri */
    --curve-2xs: 2px;
    --curve-xs: 4px;
    --curve-sm: 8px;
    --curve-md: 12px;
    --curve-lg: 20px;
    --curve-xl: 28px;
    --curve-2xl: 36px;
    --curve-3xl: 48px;
    --curve-stadium: 9999px;
    --curve-dot: 50%;

    /* umbre */
    --depth-2xs: 0 1px 1px rgba(32, 42, 56, 0.04);
    --depth-xs: 0 1px 2px rgba(32, 42, 56, 0.06);
    --depth-sm: 0 2px 6px rgba(32, 42, 56, 0.08);
    --depth-md: 0 6px 18px rgba(32, 42, 56, 0.12);
    --depth-lg: 0 12px 32px rgba(32, 42, 56, 0.16);
    --depth-xl: 0 18px 44px rgba(32, 42, 56, 0.18);
    --depth-2xl: 0 24px 60px rgba(32, 42, 56, 0.2);
    --depth-3xl: 0 32px 80px rgba(32, 42, 56, 0.24);

    /* literă */
    --font-head: "Open Sans", "Segoe UI", Tahoma, sans-serif;
    --font-copy: "Open Sans", "Segoe UI", Tahoma, sans-serif;
    --scale-display-1: 48px;
    --scale-head: 36px;
    --scale-display-3: 26px;
    --scale-display-4: 21px;
    --scale-minor: 18px;
    --scale-h6: 16px;
    --scale-body: 19px;
    --scale-small: 16px;
    --scale-mini: 14px;
    --leading-compact: 1.2;
    --leading-base: 1.7;
    --leading-roomy: 2;
    --ls-snug: -0.01em;
    --ls-default: 0;
    --ls-open: 0.02em;
    --boldness-normal: 400;
    --boldness-demi: 500;
    --boldness-black: 600;

    /* mișcare */
    --time-brisk: 127ms;
    --time-regular: 250ms;
    --time-calm: 388ms;
    --easing-exit: cubic-bezier(0.34, 0.82, 0.5, 0.96);
    --easing-in-out: cubic-bezier(0.53, 0.08, 0.56, 1);
    --easing-overshoot: cubic-bezier(0.38, 1.45, 0.61, 1.3);

    /* lățimi */
    --width-main: 1200px;
    --width-text: 1200px;
    --width-brief: 500px;
    --width-pad-lg: 48px;
    --width-edge-mid: 32px;
    --width-pad-sm: 16px;
    --border-hair: 1px;
    --border-medium: 2px;
    --border-bold: 3px;
    --header-tall: 88px;
    --header-short: 64px;

    /* derivate */
    --shell-wide: calc(var(--width-main) + 2 * var(--width-pad-lg));
}

/* --------------------------------------------------------------------------
   2. Fișiere de literă găzduite local
   -------------------------------------------------------------------------- */
@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("/panel/faces/os-latin-ext-400.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("/panel/faces/os-latin-400.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("/panel/faces/os-latin-ext-500.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("/panel/faces/os-latin-500.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 600 700;
    font-display: swap;
    src: url("/panel/faces/os-latin-ext-600.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 600 700;
    font-display: swap;
    src: url("/panel/faces/os-latin-600.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --------------------------------------------------------------------------
   3. Reset și bază
   -------------------------------------------------------------------------- */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    overflow-x: clip;
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--hue-field);
    color: var(--hue-body);
    font-family: var(--font-copy);
    font-size: var(--scale-body);
    font-weight: var(--boldness-normal);
    line-height: var(--leading-roomy);
}

img {
    max-width: 100%;
    display: block;
}

a {
    color: var(--hue-focus);
}

a:hover {
    color: var(--hue-accent-pressed);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: anywhere;
    margin: 0 0 var(--step-md);
    color: var(--hue-body);
}

h1,
h2 {
    font-family: var(--font-head);
    font-weight: var(--boldness-black);
    line-height: var(--leading-compact);
    letter-spacing: var(--ls-snug);
}

h3,
h4 {
    font-family: var(--font-copy);
    font-weight: var(--boldness-black);
    line-height: var(--leading-compact);
}

h5,
h6 {
    font-family: var(--font-copy);
    font-weight: var(--boldness-demi);
}

h1 {
    font-size: clamp(28px, 5.4vw, 48px);
}

h2 {
    font-size: clamp(24px, 3.6vw, 36px);
}

h3 {
    font-size: var(--scale-display-3);
}

h4 {
    font-size: var(--scale-display-4);
}

h5 {
    font-size: var(--scale-minor);
}

h6 {
    font-size: var(--scale-h6);
}

p {
    margin: 0 0 var(--step-md);
}

ul,
ol {
    margin: 0 0 var(--step-md);
    padding-inline-start: var(--step-lg);
}

li {
    margin-bottom: var(--step-xs);
}

strong {
    font-weight: var(--boldness-black);
}

table {
    border-collapse: collapse;
}

button {
    font: inherit;
}

:focus-visible {
    outline: var(--border-medium) solid var(--hue-focus);
    outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   4. Utilitare și accesibilitate
   -------------------------------------------------------------------------- */
.skip-jump {
    position: fixed;
    left: var(--step-md);
    top: var(--step-md);
    z-index: 400;
    background: var(--hue-prime);
    color: var(--hue-on-prime);
    padding: var(--step-sm) var(--step-md);
    border-radius: var(--curve-sm);
    text-decoration: none;
}

.skip-jump:not(:focus) {
    top: -200px !important;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

/* banda 18+ deasupra antetului (RG-01) */
.pavois-vif {
    margin: 0;
    background: var(--hue-advisory);
    color: var(--hue-on-prime);
    font-size: var(--scale-mini);
    line-height: 1.35;
    text-align: center;
    padding: var(--step-xs) var(--width-pad-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--step-xs);
    flex-wrap: wrap;
}

.pavois-vif a {
    color: var(--hue-on-prime);
    text-underline-offset: 2px;
}

.pavois-vif a:hover {
    color: var(--hue-on-prime);
}

/* --------------------------------------------------------------------------
   5. Antet — HEAD-MIRROR: meniul la stânga, sigla la dreapta
   -------------------------------------------------------------------------- */
.dais-voile {
    position: sticky;
    top: 0;
    z-index: 120;
    background: var(--hue-field);
    border-bottom: var(--border-hair) solid var(--hue-edge);
    transition: box-shadow var(--time-regular) var(--easing-exit);
}

.dais-voile-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-inline: var(--step-xl);
    height: 88px;
    display: flex;
    align-items: center;
    gap: var(--step-lg);
    transition: height var(--time-regular) var(--easing-exit);
}

.dais-voile.is-shrunk .dais-voile-guts {
    height: 66px;
}

/* sigla — dreapta, în ramă rotundă */
.dais-voile-glyph {
    margin-left: auto;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 66px;
    border-radius: var(--curve-dot);
    background: var(--hue-bg-elevated);
    border: var(--border-hair) solid var(--hue-edge);
    overflow: hidden;
    transition: width var(--time-regular) var(--easing-exit), height var(--time-regular) var(--easing-exit);
}

.dais-voile-glyph img {
    flex-shrink: 0;
    width: 66px;
    height: 66px;
    object-fit: contain;
}

.dais-voile.is-shrunk .dais-voile-glyph,
.dais-voile.is-shrunk .dais-voile-glyph img {
    width: 52px;
    height: 52px;
}

/* meniul în linie */
.dais-voile-links {
    min-width: 0;
    flex: 0 1 auto;
}

.dais-voile-set {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: var(--step-md);
    flex-wrap: nowrap;
}

.dais-voile-node {
    margin: 0;
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--step-md);
}

.dais-voile-node-more {
    position: relative;
    flex-shrink: 0;
}

.dais-voile-set > .dais-voile-node + .dais-voile-node::before {
    content: "\00b7";
    color: var(--hue-edge-hard);
    font-size: var(--scale-small);
    line-height: 1;
}

.dais-voile-jump {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    font-family: var(--font-copy);
    font-size: 16px;
    font-weight: 500;
    font-variant: small-caps;
    letter-spacing: var(--ls-open);
    color: var(--hue-body);
    text-decoration: none;
    white-space: nowrap;
    border-radius: var(--curve-sm);
    padding-inline: var(--step-2xs);
    transition: color var(--time-brisk) var(--easing-exit), background-color var(--time-brisk) var(--easing-exit);
}

.dais-voile-jump:hover {
    color: var(--hue-prime);
    background-color: var(--hue-bg-elevated);
}

.dais-voile-jump[aria-current="page"] {
    color: var(--hue-focus);
    font-weight: 600;
}

/* butonul „încă” pentru punctele care nu încap */
.dais-voile-more {
    display: none;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
    padding: 0 var(--step-xs);
    background: none;
    border: 0;
    border-radius: var(--curve-sm);
    color: var(--hue-body);
    cursor: pointer;
    transition: background-color var(--time-brisk) var(--easing-exit);
}

.dais-voile-more.is-live {
    display: inline-flex;
}

.dais-voile-more:hover {
    background-color: var(--hue-bg-elevated);
    color: var(--hue-prime);
}

.dais-voile-more svg {
    width: 22px;
    height: 22px;
    stroke: currentColor;
    stroke-width: 2;
    fill: none;
    stroke-linecap: round;
}

.dais-voile-pane {
    position: absolute;
    top: calc(100% + var(--step-xs));
    right: 0;
    z-index: 130;
    min-width: 200px;
    max-height: 60vh;
    overflow-y: auto;
    margin: 0;
    padding: var(--step-xs);
    list-style: none;
    background: var(--hue-field);
    border: var(--border-hair) solid var(--hue-edge);
    border-radius: var(--curve-md);
    box-shadow: var(--depth-md);
    display: none;
    flex-direction: column;
    gap: var(--step-2xs);
}

.dais-voile-pane.is-open {
    display: flex;
}

.dais-voile-pane .dais-voile-node {
    display: block;
}

.dais-voile-pane .dais-voile-node::before {
    content: none;
}

.dais-voile-pane .dais-voile-jump {
    display: flex;
    width: 100%;
    padding-inline: var(--step-sm);
}

/* butonul de ofertă din antet */
.dais-voile-deck {
    display: flex;
    align-items: center;
    gap: var(--step-sm);
    flex-shrink: 0;
}

.dais-voile-call-press {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding-inline: var(--step-lg);
    border-radius: var(--curve-md);
    border: var(--border-medium) solid var(--hue-focus);
    background: var(--hue-field);
    color: var(--hue-focus);
    font-family: var(--font-head);
    font-size: var(--scale-small);
    font-weight: var(--boldness-black);
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}

/* butonul de meniu (două linii) */
.dais-voile-handle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    width: 44px;
    height: 44px;
    padding: 0;
    background: none;
    border: 0;
    cursor: pointer;
    order: -1;
}

.dais-voile-bar {
    display: block;
    width: 26px;
    height: 2px;
    background: var(--hue-body);
    border-radius: var(--curve-stadium);
    transition: transform var(--time-regular) var(--easing-in-out);
}

/* sertarul mobil */
.dais-voile-panel {
    display: none;
    border-top: var(--border-hair) solid var(--hue-edge);
    background: var(--hue-field);
    padding: var(--step-md) var(--width-pad-sm) var(--step-lg);
    max-height: 70vh;
    overflow-y: auto;
}

.dais-voile-panel.is-open {
    display: block;
}

.dais-voile-panel-set {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--step-xs);
}

.dais-voile-panel-node {
    margin: 0;
}

.dais-voile-panel-jump {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding-inline: var(--step-sm);
    border-radius: var(--curve-sm);
    font-size: var(--scale-minor);
    font-weight: 500;
    color: var(--hue-body);
    text-decoration: none;
}

.dais-voile-panel-jump:hover {
    background: var(--hue-bg-elevated);
    color: var(--hue-prime);
}

.dais-voile-panel-jump[aria-current="page"] {
    color: var(--hue-focus);
}

/* --------------------------------------------------------------------------
   6. Fir de urmă — BREAD-06: bandă cu fundal
   -------------------------------------------------------------------------- */
.ecrin-vif {
    background: var(--hue-bg-elevated);
    border-bottom: var(--border-hair) solid var(--hue-edge);
}

.ecrin-vif-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding: var(--step-sm) var(--width-pad-lg);
}

.ecrin-vif-set {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--step-xs);
    margin: 0;
    padding: 0;
    font-size: var(--scale-small);
}

.ecrin-vif-node {
    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--step-xs);
    color: var(--hue-body);
}

.ecrin-vif-node + .ecrin-vif-node::before {
    content: "\203a";
    color: var(--hue-soft-text);
}

.ecrin-vif-jump {
    color: var(--hue-soft-text);
    text-decoration: none;
}

.ecrin-vif-jump:hover {
    color: var(--hue-accent-pressed);
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   7. Primul ecran — HERO-06: imagine înclinată asimetric
   -------------------------------------------------------------------------- */
.verriere-brut {
    position: relative;
    overflow: hidden;
    background: linear-gradient(160deg, var(--hue-bg-elevated), var(--hue-field) 62%);
    border-bottom: var(--border-hair) solid var(--hue-edge);
}

.verriere-brut-guts {
    position: relative;
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-inline: var(--width-pad-lg);
    min-height: 560px;
    display: flex;
    align-items: center;
}

.verriere-brut-matter {
    position: relative;
    z-index: 2;
    width: 50%;
    padding-block: var(--step-2xl);
}

.verriere-brut-second {
    max-width: var(--width-brief);
    font-size: var(--scale-minor);
    line-height: var(--leading-base);
    color: var(--hue-soft-text);
}

.verriere-brut-fine {
    display: block;
    margin-top: var(--step-sm);
    max-width: var(--width-brief);
    font-size: var(--scale-mini);
    line-height: 1.45;
    color: var(--hue-soft-text);
}

.verriere-brut-frame {
    position: absolute;
    right: 0;
    top: -40px;
    width: 46%;
    height: calc(100% + 40px);
    margin: 0;
    transform: rotate(2deg);
    border-radius: var(--curve-lg);
    overflow: hidden;
    box-shadow: var(--depth-lg);
    transition: transform var(--time-calm) var(--easing-exit);
}

.verriere-brut:hover .verriere-brut-frame {
    transform: rotate(0deg) scale(1.02);
}

.verriere-brut-art {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* --------------------------------------------------------------------------
   8. Cap de pagină — PHEAD-10: manifest
   -------------------------------------------------------------------------- */
.berceau-profond {
    background: var(--hue-field);
}

.berceau-profond-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding: var(--step-3xl) var(--width-pad-lg);
    text-align: center;
}

.berceau-profond-top {
    font-size: clamp(28px, 6vw, 68px);
    line-height: var(--leading-compact);
    margin-bottom: var(--step-sm);
}

.berceau-profond-dot {
    display: block;
    color: var(--hue-focus);
    font-size: var(--scale-head);
    line-height: 1;
    margin-bottom: var(--step-sm);
}

.berceau-profond-prose {
    margin-inline: auto;
    max-width: 600px;
    font-style: italic;
    font-size: var(--scale-display-4);
    line-height: var(--leading-base);
    color: var(--hue-soft-text);
}

.berceau-profond-tag {
    margin-top: var(--step-md);
    font-size: var(--scale-mini);
    color: var(--hue-soft-text);
}

/* --------------------------------------------------------------------------
   9. Text curent — PROSE-14: secțiuni alternante cu fundal (fill = tint,
   boxWidth = full, density = roomy)
   -------------------------------------------------------------------------- */
.parterre-large {
    background: var(--hue-field);
}

.parterre-large-wash {
    background: var(--hue-wash);
}

.parterre-large-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
}

.parterre-large-wash .parterre-large-guts {
    padding-block: var(--step-2xl);
}

.parterre-large-top {
    font-size: clamp(24px, 3.6vw, 36px);
    font-weight: var(--boldness-black);
    margin-top: 0;
    margin-bottom: var(--step-lg);
}

.parterre-large p {
    line-height: var(--leading-roomy);
}

.parterre-large ul,
.parterre-large ol {
    line-height: var(--leading-base);
}

.parterre-large-frame {
    margin: var(--step-lg) auto 0;
    max-width: 860px;
}

.parterre-large-art {
    width: 100%;
    height: auto;
    border-radius: var(--curve-md);
    box-shadow: var(--depth-sm);
}

.parterre-large-frame-tall {
    max-width: 520px;
    margin-inline: auto;
}

/* --------------------------------------------------------------------------
   10. Listă de argumente — GRID-05: card lat + listă compactă
   -------------------------------------------------------------------------- */
.vigile-classique {
    background: var(--hue-field);
}

.vigile-classique-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
}

.vigile-classique-top {
    margin-bottom: var(--step-lg);
}

.vigile-classique-lead {
    padding: var(--step-2xl);
    background: var(--hue-prime);
    color: var(--hue-on-prime);
    border-radius: var(--curve-lg);
    margin-bottom: var(--step-xl);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--step-xl);
    align-items: center;
}

.vigile-classique-lead-top {
    margin-bottom: 0;
    font-family: var(--font-head);
    font-size: clamp(24px, 3.6vw, 36px);
    font-weight: var(--boldness-black);
    line-height: var(--leading-compact);
    color: var(--hue-on-prime);
    margin-bottom: var(--step-md);
}

.vigile-classique-lead-prose {
    max-width: var(--width-brief);
    font-size: var(--scale-minor);
    line-height: var(--leading-base);
    color: var(--hue-on-prime-soft);
    margin: 0;
}

.vigile-classique-set {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--step-lg);
}

.vigile-classique-block {
    margin: 0;
    padding: var(--step-md);
    border-top: var(--border-medium) solid var(--hue-focus);
    background: var(--hue-field);
    transition: background-color var(--time-regular) var(--easing-exit);
}

.vigile-classique-block:hover {
    background-color: var(--hue-bg-elevated);
}

.vigile-classique-sign {
    display: flex;
    align-items: center;
    gap: var(--step-xs);
    margin-bottom: var(--step-xs);
    color: var(--hue-prime);
}

.vigile-classique-sign svg {
    width: 26px;
    height: 26px;
    stroke: currentColor;
    stroke-width: 1.6;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.vigile-classique-block-top {
    font-size: var(--scale-body);
    font-weight: var(--boldness-black);
    line-height: var(--leading-compact);
    margin-bottom: var(--step-xs);
}

.vigile-classique-block-prose {
    font-size: var(--scale-small);
    line-height: var(--leading-base);
    margin: 0;
    color: var(--hue-body);
}

/* --------------------------------------------------------------------------
   11. Tabel — TABLE-05: compact, dens
   -------------------------------------------------------------------------- */
.garde-corps-prime {
    background: var(--hue-field);
}

.garde-corps-prime-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
}

.garde-corps-prime-cap {
    display: block;
    margin-bottom: var(--step-md);
    font-size: var(--scale-small);
    color: var(--hue-soft-text);
}

.garde-corps-prime-scroll {
    overflow-x: auto;
    border: var(--border-hair) solid var(--hue-edge);
    border-radius: var(--curve-md);
}

.garde-corps-prime table {
    width: 100%;
    min-width: 560px;
    font-size: var(--scale-small);
    line-height: var(--leading-base);
}

.garde-corps-prime th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--hue-bg-elevated);
    color: var(--hue-body);
    padding: var(--step-sm);
    font-size: var(--scale-mini);
    font-weight: var(--boldness-black);
    text-transform: uppercase;
    letter-spacing: var(--ls-open);
    text-align: left;
    border-bottom: var(--border-hair) solid var(--hue-edge-hard);
}

.garde-corps-prime td {
    padding: var(--step-xs) var(--step-sm);
    border-bottom: var(--border-hair) solid var(--hue-edge);
    vertical-align: top;
}

.garde-corps-prime tr:last-child td {
    border-bottom: 0;
}

/* --------------------------------------------------------------------------
   12. Păreri — REV-02: citat editorial
   -------------------------------------------------------------------------- */
.colonnade-vaste {
    background: var(--hue-bg-elevated);
}

.colonnade-vaste-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
}

.colonnade-vaste-node {
    position: relative;
    max-width: var(--width-brief);
    margin-block: var(--step-2xl);
    padding-block: var(--step-xl);
    padding-left: var(--step-2xl);
    border-bottom: var(--border-hair) solid var(--hue-edge-hard);
}

.colonnade-vaste-node:last-of-type {
    border-bottom: 0;
}

.colonnade-vaste-node::before {
    content: "\201c";
    position: absolute;
    left: 0;
    top: 0;
    font-family: var(--font-head);
    font-size: var(--scale-display-1);
    line-height: 1;
    color: var(--hue-focus);
}

.colonnade-vaste-quote {
    margin: 0 0 var(--step-md);
}

.colonnade-vaste-quote p {
    font-family: var(--font-head);
    font-size: var(--scale-display-4);
    font-style: italic;
    line-height: var(--leading-compact);
    color: var(--hue-body);
    margin: 0;
}

.colonnade-vaste-tag {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--step-xs);
    font-size: var(--scale-small);
    color: var(--hue-soft-text);
}

.colonnade-vaste-tag > * + *::before {
    content: "\00b7";
    margin-right: var(--step-xs);
    color: var(--hue-edge-hard);
}

.colonnade-vaste-person {
    font-style: normal;
    font-weight: var(--boldness-demi);
    color: var(--hue-body);
}

/* --------------------------------------------------------------------------
   13. Întrebări — FAQ-03: carduri pe două coloane
   -------------------------------------------------------------------------- */
.baldaquin-prime {
    background: var(--hue-field);
}

.baldaquin-prime-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
}

.baldaquin-prime-set {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--step-lg);
    align-items: start;
}

.baldaquin-prime-node {
    padding: var(--step-lg);
    background: var(--hue-field);
    border: var(--border-hair) solid var(--hue-edge);
    border-radius: var(--curve-md);
}

.baldaquin-prime-node > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    gap: var(--step-xs);
    align-items: baseline;
}

.baldaquin-prime-node > summary::-webkit-details-marker {
    display: none;
}

.baldaquin-prime-node > summary::before {
    content: "\00ce.";
    font-family: var(--font-head);
    font-weight: var(--boldness-black);
    color: var(--hue-focus);
    flex-shrink: 0;
}

.baldaquin-prime-hdr {
    font-size: var(--scale-minor);
    font-weight: var(--boldness-black);
    line-height: var(--leading-compact);
    color: var(--hue-body);
    margin: 0;
}

.baldaquin-prime-matter {
    padding-top: var(--step-md);
}

.baldaquin-prime-matter p {
    font-size: var(--scale-body);
    line-height: var(--leading-base);
    margin: 0;
}

.baldaquin-prime-node[open] > .baldaquin-prime-matter {
    animation: bald-unfold var(--time-regular) var(--easing-exit) both;
}

@keyframes bald-unfold {
    from {
        opacity: 0;
        max-height: 0;
    }

    to {
        opacity: 1;
        max-height: 700px;
    }
}

/* --------------------------------------------------------------------------
   14. Bloc de îndemn — CTA-09: supratitlu + h2 + text scurt
   -------------------------------------------------------------------------- */
.veilleur-profond {
    background: var(--hue-bg-elevated);
    border-block: var(--border-hair) solid var(--hue-edge);
}

.veilleur-profond-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-2xl);
    padding-inline: var(--width-pad-lg);
    text-align: left;
}

.veilleur-profond-brow {
    display: block;
    margin-bottom: var(--step-xs);
    font-size: var(--scale-mini);
    text-transform: uppercase;
    letter-spacing: var(--ls-open);
    color: var(--hue-focus);
}

.veilleur-profond-top {
    font-family: var(--font-head);
    font-weight: var(--boldness-black);
    margin-bottom: var(--step-md);
}

.veilleur-profond-prose {
    max-width: var(--width-brief);
    font-size: var(--scale-body);
    line-height: var(--leading-roomy);
    color: var(--hue-body);
}

.veilleur-profond-fine {
    display: block;
    margin-top: var(--step-sm);
    max-width: var(--width-brief);
    font-size: var(--scale-mini);
    line-height: 1.45;
    color: var(--hue-soft-text);
}

/* --------------------------------------------------------------------------
   15. Îndemn în text — INLINE-CTA-04: promisiune pe două coloane
   -------------------------------------------------------------------------- */
.berceau-calme {
    display: block;
    background: var(--hue-field);
}

.berceau-calme-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-lg);
    padding-inline: var(--width-pad-lg);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--step-xl);
}

.berceau-calme-matter {
    flex: 1;
    border-left: var(--border-bold) solid var(--hue-focus);
    padding-left: var(--step-md);
}

.berceau-calme-hdr {
    font-family: var(--font-head);
    font-size: var(--scale-display-4);
    color: var(--hue-body);
    margin-bottom: var(--step-2xs);
}

.berceau-calme-second {
    font-size: var(--scale-body);
    color: var(--hue-soft-text);
    margin: 0;
}

/* --------------------------------------------------------------------------
   16. Semnătura autorului — BYLINE-02: card cu chenar
   -------------------------------------------------------------------------- */
.chapelle-large {
    display: block;
    padding-block: var(--step-lg);
}

.chapelle-large-block {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding: var(--step-lg);
    background: var(--hue-bg-elevated);
    border: var(--border-hair) solid var(--hue-edge);
    border-radius: var(--curve-md);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: var(--step-md);
}

.chapelle-large-portrait {
    flex-shrink: 0;
    display: block;
    width: 64px;
    height: 64px;
    border-radius: var(--curve-dot);
    overflow: hidden;
}

.chapelle-large-portrait img {
    width: 64px;
    height: 64px;
    object-fit: cover;
    object-position: center top;
}

.chapelle-large-matter {
    min-width: 0;
}

.chapelle-large-mark {
    display: block;
    font-size: var(--scale-mini);
    text-transform: uppercase;
    letter-spacing: var(--ls-open);
    color: var(--hue-soft-text);
}

.chapelle-large-person {
    font-family: var(--font-head);
    font-size: var(--scale-display-4);
    font-weight: var(--boldness-black);
    margin: var(--step-2xs) 0;
}

.chapelle-large-person a {
    color: var(--hue-body);
    text-decoration: none;
}

.chapelle-large-person a:hover {
    color: var(--hue-accent-pressed);
    text-decoration: underline;
}

.chapelle-large-role {
    font-size: var(--scale-small);
    color: var(--hue-soft-text);
    margin-bottom: var(--step-xs);
}

.chapelle-large-prose {
    font-size: var(--scale-body);
    line-height: var(--leading-base);
    margin-bottom: var(--step-xs);
}

.chapelle-large-time {
    display: block;
    font-size: var(--scale-mini);
    color: var(--hue-soft-text);
    margin-bottom: var(--step-xs);
}

.chapelle-large-jump {
    font-size: var(--scale-small);
    text-transform: uppercase;
    letter-spacing: var(--ls-open);
    color: var(--hue-focus);
    text-decoration: none;
}

.chapelle-large-jump:hover {
    color: var(--hue-accent-pressed);
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   17. Fișa autorului — AUTH-06: bloc-afiș pe pagina /autor/
   -------------------------------------------------------------------------- */
.prie-dieu-robuste {
    background: linear-gradient(135deg, var(--hue-prime), var(--hue-field));
}

.prie-dieu-robuste-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-3xl);
    padding-inline: var(--width-pad-lg);
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: var(--step-2xl);
    align-items: start;
}

.prie-dieu-robuste-portrait {
    width: 280px;
    aspect-ratio: 4 / 5;
    border-radius: var(--curve-lg);
    box-shadow: var(--depth-lg);
    overflow: hidden;
    background: var(--hue-bg-elevated);
}

.prie-dieu-robuste-portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.prie-dieu-robuste-brow {
    display: block;
    font-family: var(--font-copy);
    font-size: var(--scale-small);
    text-transform: uppercase;
    letter-spacing: var(--ls-open);
    color: var(--hue-on-prime-soft);
    margin-bottom: var(--step-xs);
}

.prie-dieu-robuste-person {
    font-size: clamp(28px, 6vw, 64px);
    line-height: var(--leading-compact);
    color: var(--hue-on-prime);
    margin-bottom: var(--step-md);
}

.prie-dieu-robuste-prose {
    font-size: var(--scale-minor);
    line-height: var(--leading-base);
    color: var(--hue-on-prime);
    margin-bottom: var(--step-md);
}

.prie-dieu-robuste-set {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--step-xs);
}

.prie-dieu-robuste-set li {
    margin: 0;
    padding: var(--step-2xs) var(--step-sm);
    background: rgba(255, 255, 255, 0.16);
    border: var(--border-hair) solid rgba(255, 255, 255, 0.34);
    border-radius: var(--curve-stadium);
    font-size: var(--scale-small);
    color: var(--hue-on-prime);
}

.prie-dieu-robuste-articles {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
}

.prie-dieu-robuste-articles-hdr {
    font-family: var(--font-head);
    font-size: var(--scale-display-3);
    margin-bottom: var(--step-md);
}

.prie-dieu-robuste-articles-set {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--step-md);
}

.prie-dieu-robuste-articles-node {
    margin: 0;
    padding: var(--step-md);
    border: var(--border-hair) solid var(--hue-edge);
    border-radius: var(--curve-sm);
    background: var(--hue-field);
}

.prie-dieu-robuste-articles-node a {
    color: var(--hue-body);
    font-weight: var(--boldness-demi);
    text-decoration: none;
}

.prie-dieu-robuste-articles-node a:hover {
    color: var(--hue-accent-pressed);
    text-decoration: underline;
}

.prie-dieu-robuste-articles-node time {
    display: block;
    margin-top: var(--step-2xs);
    font-size: var(--scale-mini);
    color: var(--hue-soft-text);
}

/* --------------------------------------------------------------------------
   18. Pagini juridice — LEGAL-04: articol într-un chenar
   -------------------------------------------------------------------------- */
.crucifix-leger {
    background: var(--hue-field);
}

.crucifix-leger-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-2xl);
    padding-inline: var(--width-pad-lg);
}

.crucifix-leger-box {
    position: relative;
    padding: var(--step-2xl);
    background: var(--hue-bg-elevated);
    border: var(--border-hair) solid var(--hue-edge);
    border-radius: var(--curve-lg);
    box-shadow: var(--depth-sm);
}

.crucifix-leger-stamp {
    position: absolute;
    top: var(--step-md);
    right: var(--step-md);
    font-size: var(--scale-mini);
    color: var(--hue-soft-text);
}

.crucifix-leger-hdr {
    font-size: var(--scale-display-3);
    margin-top: var(--step-xl);
    margin-bottom: var(--step-sm);
}

.crucifix-leger-hdr:first-of-type {
    margin-top: 0;
}

.crucifix-leger-set {
    margin-bottom: var(--step-md);
}

.crucifix-leger-fine {
    display: block;
    margin-top: var(--step-lg);
    padding-top: var(--step-md);
    border-top: var(--border-hair) solid var(--hue-edge);
    font-size: var(--scale-small);
    line-height: var(--leading-base);
    color: var(--hue-soft-text);
}

/* --------------------------------------------------------------------------
   19. Formular de contact — FORM-02: două coloane
   -------------------------------------------------------------------------- */
.peristyle-leger {
    background: var(--hue-field);
}

.peristyle-leger-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: var(--step-xl);
    align-items: start;
}

.peristyle-leger-track {
    padding: var(--step-lg);
    background: var(--hue-bg-elevated);
    border-radius: var(--curve-md);
}

.peristyle-leger-track h3 {
    margin-top: 0;
}

.peristyle-leger-set {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: var(--scale-small);
}

.peristyle-leger-set li {
    margin-bottom: var(--step-sm);
}

.peristyle-leger-form {
    display: grid;
    gap: var(--step-md);
}

.peristyle-leger-box {
    display: grid;
    gap: var(--step-2xs);
}

.peristyle-leger-mark {
    font-size: var(--scale-small);
    font-weight: var(--boldness-demi);
    color: var(--hue-body);
}

.peristyle-leger-box input,
.peristyle-leger-box textarea {
    width: 100%;
    padding: var(--step-sm) var(--step-md);
    font: inherit;
    font-size: var(--scale-small);
    color: var(--hue-body);
    background: var(--hue-field);
    border: var(--border-hair) solid var(--hue-edge-hard);
    border-radius: var(--curve-sm);
}

.peristyle-leger-press {
    justify-self: start;
    min-height: 48px;
    padding-inline: var(--step-xl);
    background: var(--hue-prime);
    color: var(--hue-on-prime);
    border: 0;
    border-radius: var(--curve-md);
    font-family: var(--font-head);
    font-weight: var(--boldness-black);
    cursor: pointer;
    transition: background-color var(--time-brisk) var(--easing-exit);
}

.peristyle-leger-press:hover {
    background-color: var(--hue-accent-pressed);
    color: var(--hue-on-prime);
}

.peristyle-leger-done {
    display: none;
    padding: var(--step-md);
    border: var(--border-hair) solid var(--hue-edge-hard);
    border-radius: var(--curve-sm);
    background: var(--hue-bg-elevated);
    font-size: var(--scale-small);
    color: var(--hue-body);
}

.peristyle-leger-done.is-open {
    display: block;
}

/* --------------------------------------------------------------------------
   20. Pagina 404 — ERR-04: fundal atmosferic pe toată lățimea
   -------------------------------------------------------------------------- */
.tribune-large {
    position: relative;
    background-color: #140c2e;
    min-height: 72vh;
    display: flex;
    align-items: center;
    background-image: linear-gradient(180deg, rgba(20, 12, 46, 0.55), rgba(12, 8, 28, 0.9)), url("/panel/top-visual-soft.webp");
    background-size: cover;
    background-position: center;
}

.tribune-large-guts {
    position: relative;
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-3xl);
    padding-inline: var(--width-pad-lg);
    text-align: center;
}

.tribune-large-top {
    max-width: var(--width-brief);
    margin-inline: auto;
    font-size: clamp(28px, 6vw, 64px);
    color: var(--hue-on-prime);
}

.tribune-large-prose {
    margin-inline: auto;
    max-width: var(--width-brief);
    color: var(--hue-on-prime);
    margin-bottom: var(--step-lg);
}

.tribune-large-press {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding-inline: var(--step-xl);
    background: var(--hue-focus);
    color: var(--hue-on-prime);
    border-radius: var(--curve-md);
    font-family: var(--font-head);
    font-weight: var(--boldness-black);
    text-decoration: none;
}

.tribune-large-press:hover {
    background: var(--hue-accent-pressed);
    color: var(--hue-on-prime);
}

/* --------------------------------------------------------------------------
   21. Bandă cookie — COOK-15: foaie laterală
   -------------------------------------------------------------------------- */
.gradin-classique {
    position: fixed;
    inset-block: 0;
    inset-inline-end: 0;
    z-index: 200;
    width: min(360px, 100vw);
    background: var(--hue-prime);
    color: var(--hue-on-prime);
    border-inline-start: var(--border-hair) solid rgba(255, 255, 255, 0.2);
    box-shadow: var(--depth-xl);
    opacity: 0;
    visibility: hidden;
    clip-path: inset(0 0 0 100%);
    transition: clip-path var(--time-calm) var(--easing-exit), opacity var(--time-regular) var(--easing-exit), visibility 0s linear var(--time-calm);
}

.gradin-classique.is-open {
    opacity: 1;
    visibility: visible;
    clip-path: inset(0 0 0 0);
    transition: clip-path var(--time-calm) var(--easing-exit), opacity var(--time-regular) var(--easing-exit), visibility 0s;
}

.gradin-classique-guts {
    height: 100%;
    padding: var(--step-xl);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: var(--step-md);
    overflow-y: auto;
}

.gradin-classique-say {
    font-size: var(--scale-small);
    line-height: var(--leading-base);
    color: var(--hue-on-prime);
    margin: 0;
}

.gradin-classique-deck {
    display: flex;
    flex-direction: column;
    gap: var(--step-sm);
}

.gradin-classique-accept,
.gradin-classique-reject {
    width: 100%;
    min-height: 44px;
    border-radius: var(--curve-md);
    font-family: var(--font-head);
    font-weight: var(--boldness-black);
    font-size: var(--scale-small);
    cursor: pointer;
    transition: background-color var(--time-brisk) var(--easing-exit);
}

.gradin-classique-accept {
    background: var(--hue-on-prime);
    color: var(--hue-prime);
    border: 0;
}

.gradin-classique-accept:hover {
    background-color: var(--hue-on-prime-soft);
    color: var(--hue-prime);
}

.gradin-classique-reject {
    background: transparent;
    color: var(--hue-on-prime);
    border: var(--border-hair) solid rgba(255, 255, 255, 0.6);
}

.gradin-classique-reject:hover {
    background-color: #4c3d93;
    color: var(--hue-on-prime);
}

/* --------------------------------------------------------------------------
   22. Subsol — FOOT-01: trei coloane clasice
   -------------------------------------------------------------------------- */
.hypostyle-haut {
    background: var(--hue-prime);
    color: var(--hue-on-prime);
}

.hypostyle-haut-call {
    border-bottom: var(--border-hair) solid rgba(255, 255, 255, 0.2);
}

.hypostyle-haut-call-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-xl);
    padding-inline: var(--width-pad-lg);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--step-lg);
}

.hypostyle-haut-call-hdr {
    font-family: var(--font-head);
    font-size: var(--scale-display-4);
    color: var(--hue-on-prime);
    margin: 0 0 var(--step-2xs);
}

.hypostyle-haut-call-prose {
    font-size: var(--scale-small);
    color: var(--hue-on-prime-soft);
    margin: 0;
}

.hypostyle-haut-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-2xl);
    padding-inline: var(--width-pad-lg);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--step-xl);
}

.hypostyle-haut-track {
    min-width: 0;
}

.hypostyle-haut-glyph {
    display: inline-flex;
    align-items: center;
}

.hypostyle-haut-glyph img {
    width: auto;
    height: 72px;
    object-fit: contain;
}

.hypostyle-haut-lede {
    margin-top: var(--step-md);
    font-size: var(--scale-small);
    line-height: var(--leading-base);
    color: var(--hue-on-prime-soft);
}

.hypostyle-haut-hdr {
    font-family: var(--font-head);
    font-weight: var(--boldness-black);
    font-size: var(--scale-h6);
    text-transform: uppercase;
    letter-spacing: var(--ls-open);
    color: var(--hue-on-prime);
    margin-bottom: var(--step-md);
}

.hypostyle-haut-set {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--step-xs);
    line-height: var(--leading-base);
}

.hypostyle-haut-node {
    margin: 0;
}

.hypostyle-haut-jump {
    font-family: var(--font-copy);
    font-weight: var(--boldness-normal);
    font-size: var(--scale-small);
    color: var(--hue-on-prime-soft);
    text-decoration: none;
    transition: color var(--time-brisk) var(--easing-exit);
}

.hypostyle-haut-jump:hover {
    color: var(--hue-on-prime);
    text-decoration: underline;
}

.hypostyle-haut-base {
    border-top: var(--border-hair) solid rgba(255, 255, 255, 0.2);
}

.hypostyle-haut-base-guts {
    width: 100%;
    max-width: var(--shell-wide);
    margin-inline: auto;
    padding-block: var(--step-md);
    padding-inline: var(--width-pad-lg);
    text-align: center;
    font-size: var(--scale-mini);
    color: var(--hue-on-prime-soft);
}

/* --------------------------------------------------------------------------
   23. Ecrane înguste
   -------------------------------------------------------------------------- */
@media (max-width: 1140px) {
    .peristyle-leger-guts {
        grid-template-columns: 1fr;
    }

    .prie-dieu-robuste-guts {
        grid-template-columns: 220px minmax(0, 1fr);
        gap: var(--step-xl);
    }

    .prie-dieu-robuste-portrait {
        width: 220px;
    }
}

@media (max-width: 899px) {
    .dais-voile-links,
    .dais-voile-more {
        display: none !important;
    }

    .dais-voile-handle {
        display: flex;
    }

    .dais-voile-guts {
        height: var(--header-short);
        gap: var(--step-sm);
        padding-inline: var(--width-edge-mid);
    }

    .dais-voile.is-shrunk .dais-voile-guts {
        height: var(--header-short);
    }

    .dais-voile-glyph,
    .dais-voile-glyph img,
    .dais-voile.is-shrunk .dais-voile-glyph,
    .dais-voile.is-shrunk .dais-voile-glyph img {
        width: 48px;
        height: 48px;
    }

    .verriere-brut-guts {
        min-height: 0;
        flex-direction: column;
        align-items: stretch;
        padding-block: var(--step-xl);
    }

    .verriere-brut-matter {
        width: 100%;
        padding-block: 0 var(--step-lg);
    }

    .verriere-brut-frame {
        position: static;
        width: 100%;
        height: auto;
        transform: none;
        aspect-ratio: 3 / 2;
    }

    .verriere-brut:hover .verriere-brut-frame {
        transform: none;
    }

    .vigile-classique-lead {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--step-md);
    }

    .vigile-classique-lead-top {
        margin-bottom: var(--step-2xs);
    }

    .vigile-classique-set,
    .baldaquin-prime-set,
    .prie-dieu-robuste-articles-set {
        grid-template-columns: minmax(0, 1fr);
    }

    .hypostyle-haut-guts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--step-lg);
    }

    .hypostyle-haut-track-brand {
        grid-column: 1 / -1;
    }

    .berceau-calme-guts,
    .hypostyle-haut-call-guts {
        flex-direction: column;
        align-items: stretch;
    }

    .prie-dieu-robuste-guts {
        grid-template-columns: minmax(0, 1fr);
        padding-block: var(--step-2xl);
    }

    .prie-dieu-robuste-portrait {
        width: 200px;
    }

    .vigile-classique-lead {
        padding: var(--step-xl);
    }

    .crucifix-leger-box {
        padding: var(--step-xl) var(--step-lg) var(--step-xl);
    }

    .crucifix-leger-stamp {
        position: static;
        display: block;
        margin-bottom: var(--step-md);
    }
}

@media (max-width: 780px) {
    :root {
        --scale-display-1: 32px;
        --scale-head: 26px;
        --scale-display-3: 22px;
        --scale-display-4: 19px;
        --scale-minor: 17px;
        --scale-h6: 15px;
        --scale-body: 18px;
        --scale-small: 15px;
        --scale-mini: 13px;
    }

    .berceau-profond-guts,
    .parterre-large-guts,
    .parterre-large-wash .parterre-large-guts,
    .vigile-classique-guts,
    .garde-corps-prime-guts,
    .colonnade-vaste-guts,
    .baldaquin-prime-guts,
    .veilleur-profond-guts,
    .berceau-calme-guts,
    .crucifix-leger-guts,
    .peristyle-leger-guts,
    .prie-dieu-robuste-guts,
    .prie-dieu-robuste-articles,
    .tribune-large-guts,
    .hypostyle-haut-guts,
    .hypostyle-haut-call-guts,
    .hypostyle-haut-base-guts,
    .ecrin-vif-guts {
        padding-inline: var(--width-pad-sm);
    }

    .berceau-profond-guts {
        padding-block: var(--step-2xl);
    }

    .colonnade-vaste-node {
        margin-block: var(--step-xl);
        padding-block: var(--step-md);
    }

    .vigile-classique-lead {
        padding: var(--step-lg);
    }

    .crucifix-leger-box {
        padding: var(--step-lg) var(--step-md);
    }

    .chapelle-large-block {
        flex-direction: column;
    }

    .prie-dieu-robuste-articles-set {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 720px) {
    .gradin-classique {
        inset-block: auto 0;
        inset-inline: 0;
        width: 100vw;
        height: auto;
        clip-path: inset(100% 0 0 0);
    }

    .gradin-classique.is-open {
        clip-path: inset(0 0 0 0);
    }

    .gradin-classique-guts {
        height: auto;
        padding: 12px 14px !important;
        gap: 8px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .gradin-classique-say {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .gradin-classique-deck {
        flex-direction: row;
        gap: 8px !important;
    }

    .gradin-classique-accept,
    .gradin-classique-reject {
        padding: 8px 14px !important;
        font-size: 12px !important;
        min-height: 44px;
    }
}

@media (max-width: 540px) {
    .hypostyle-haut-guts {
        grid-template-columns: minmax(0, 1fr);
    }

    .garde-corps-prime table {
        min-width: 460px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
}

/* --------------------------------------------------------------------------
   23b. Plăci de ofertă intercalate în listele lungi
   -------------------------------------------------------------------------- */
.vigile-classique-call,
.baldaquin-prime-call,
.colonnade-vaste-call {
    grid-column: 1 / -1;
    margin: 0;
    padding: var(--step-lg);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--step-lg);
    background: var(--hue-bg-elevated);
    border: var(--border-hair) solid var(--hue-edge-hard);
    border-radius: var(--curve-md);
}

.colonnade-vaste-call {
    background: var(--hue-field);
    margin-block: var(--step-xl);
}

.vigile-classique-call-hdr,
.baldaquin-prime-call-hdr,
.colonnade-vaste-call-hdr {
    margin: 0;
    font-family: var(--font-head);
    font-size: var(--scale-display-4);
    font-weight: var(--boldness-black);
    line-height: var(--leading-compact);
    color: var(--hue-body);
}

@media (max-width: 780px) {
    .vigile-classique-call,
    .baldaquin-prime-call,
    .colonnade-vaste-call {
        flex-direction: column;
        align-items: stretch;
        gap: var(--step-md);
    }
}

/* --------------------------------------------------------------------------
   24. Butonul de ofertă — culoare, formă și mișcare din scripts/cta-style.mjs
   (verde lime, în afara paletei sitului, ca butonul să iasă în evidență)
   -------------------------------------------------------------------------- */
.oriflamme-act {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 var(--step-lg);
    min-height: 44px;
    border-radius: var(--curve-md);
    border: var(--border-medium) solid #4d7c0f;
    font-size: var(--scale-small);
    font-weight: var(--boldness-black);
    font-family: var(--font-head);
    background: #65a30d;
    color: #202a38;
    text-decoration: none;
    transition: background var(--time-regular) var(--easing-exit), transform var(--time-regular) var(--easing-exit);
}

.oriflamme-act.oriflamme-act {
    color: #202a38;
    text-decoration: none;
    font-family: var(--font-head);
}

.oriflamme-act:hover {
    background: #4d7c0f;
    color: #ffffff;
    animation: none;
}

.oriflamme-act.oriflamme-act:hover {
    color: #ffffff;
    text-decoration: none;
}

.oriflamme-act:active {
    background: #3f6212;
    color: #ffffff;
}

.oriflamme-act:focus-visible {
    outline: 3px solid #202a38;
    outline-offset: 3px;
}

@keyframes oriflamme-beat {
    0% {
        transform: rotate(0);
    }

    29.032% {
        transform: rotate(0.4deg);
    }

    58.065%,
    100% {
        transform: rotate(0);
    }
}

.oriflamme-act {
    animation: oriflamme-beat 1.55s var(--easing-in-out) infinite;
    transform-origin: 50% 90%;
}

@media (prefers-reduced-motion: reduce) {
    .oriflamme-act,
    .oriflamme-act::after {
        animation: none !important;
        transition: none !important;
    }
}
