/* ============================================================
   Boomerang Casino GR — print.css
   Dark theme, Montserrat, gold accent, single-section width 1340.
   Rules in alphabetical order (per code_style.css_rule_order).
   ============================================================ */

:root {
    --color-accent: #ffd738;
    --color-accent-pressed: #ffba05;
    --color-bg: #0b1016;
    --color-bg-elevated: #14191f;
    --color-border: rgba(255, 215, 56, 0.18);
    --color-border-soft: rgba(255, 255, 255, 0.08);
    --color-gradient-light: #1a1b20;
    --color-gradient-mid: #fc4964;
    --color-primary: #060a0d;
    --color-surface: #11161d;
    --color-surface-2: #181e26;
    --color-text: #FFFFFF;
    --color-text-muted: #c1c1c1;
    --container-readable: 720px;
    --container-site: 1340px;
    --font-body: 'Montserrat', system-ui, -apple-system, sans-serif;
    --font-display: 'Montserrat', system-ui, -apple-system, sans-serif;
    --header-height-desktop: 96px;
    --header-height-mobile: 72px;
    --radius-lg: 20px;
    --radius-md: 12px;
    --radius-sm: 6px;
    --shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.45);
    --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.35);
    --space-lg: 40px;
    --space-md: 24px;
    --space-sm: 16px;
    --space-xl: 64px;
    --space-xs: 8px;
    --transition: 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

* { box-sizing: border-box; }

*:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 3px;
    border-radius: var(--radius-sm);
}

html, body { overflow-x: clip; }

html {
    background: var(--color-primary);
    color: var(--color-text);
    color-scheme: dark;
    font-family: var(--font-body);
    line-height: 1.6;
    -webkit-text-size-adjust: 100%;
}

body {
    background:
        radial-gradient(ellipse at 12% 0%, rgba(252, 73, 100, 0.18), transparent 55%),
        radial-gradient(ellipse at 92% 18%, rgba(255, 215, 56, 0.10), transparent 55%),
        var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    margin: 0;
    min-height: 100vh;
    padding-top: var(--header-height-desktop);
}

a { color: var(--color-accent); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--color-accent-pressed); }

button { cursor: pointer; font: inherit; }

h1, h2, h3, h4 {
    color: var(--color-text);
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.2;
    margin: 0 0 var(--space-md);
}
h1 { font-size: clamp(2rem, 4vw, 3.2rem); }
h2 { font-size: clamp(1.5rem, 2.6vw, 2.2rem); }
h3 { font-size: clamp(1.15rem, 1.6vw, 1.4rem); }

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

main { display: block; }

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

ul, ol { margin: 0 0 var(--space-md); padding-left: 1.5rem; }
li { margin-bottom: 0.4rem; }

section { padding: var(--space-xl) 0; }

/* ---------- Author byline (.relise) ---------- */
.relise {
    background: linear-gradient(180deg, var(--color-surface), var(--color-bg-elevated));
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-soft);
    margin: var(--space-lg) auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.relise-inner {
    align-items: center;
    display: flex;
    gap: var(--space-md);
    flex-wrap: wrap;
    padding: var(--space-md) 0;
}
.relise-portrait {
    border-radius: 50%;
    display: block;
    flex-shrink: 0;
    overflow: hidden;
}
.relise-portrait img {
    border-radius: 50%;
    height: 56px;
    object-fit: cover;
    width: 56px;
}
.relise-meta { flex: 1 1 280px; }
.relise-by { color: var(--color-text-muted); font-size: 0.92rem; margin: 0 0 2px; }
.relise-name { color: var(--color-accent); font-weight: 700; }
.relise-role { color: var(--color-text); font-size: 0.95rem; font-weight: 500; margin: 0 0 4px; }
.relise-dates { color: var(--color-text-muted); display: flex; flex-wrap: wrap; font-size: 0.85rem; gap: 8px; margin: 0; }
.relise-sep { opacity: 0.6; }

/* ---------- Author card (.lilo, AUTH-01) ---------- */
.lilo {
    padding: var(--space-xl) 0;
}
.lilo-inner {
    display: grid;
    gap: var(--space-xl);
    grid-template-columns: minmax(220px, 280px) 1fr;
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.lilo-portrait img {
    border: 3px solid var(--color-accent);
    border-radius: 50%;
    height: auto;
    width: 100%;
}
.lilo-name { font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 6px; }
.lilo-role { color: var(--color-accent); font-size: 1.05rem; font-weight: 600; margin-bottom: var(--space-md); }
.lilo-bio { color: var(--color-text-muted); font-size: 1.02rem; line-height: 1.7; }
.lilo-expertise { margin-top: var(--space-md); }
.lilo-subhead { font-size: 1.1rem; margin-bottom: var(--space-sm); }
.lilo-expertise ul { list-style: none; padding: 0; }
.lilo-expertise li {
    background: var(--color-surface);
    border-left: 3px solid var(--color-accent);
    border-radius: var(--radius-sm);
    color: var(--color-text);
    margin-bottom: 8px;
    padding: 10px 14px;
}

/* ---------- Contact form (.sygu, FORM-05) ---------- */
.sygu {
    padding: var(--space-xl) 0;
}
.sygu-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.sygu-title { font-size: 1.6rem; margin-bottom: var(--space-sm); }
.sygu-intro { color: var(--color-text-muted); margin-bottom: var(--space-lg); max-width: 720px; }
.sygu-form {
    background: var(--color-surface);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-soft);
    display: grid;
    gap: var(--space-md);
    padding: var(--space-lg);
}
.sygu-field { display: grid; gap: 6px; }
.sygu-field label { color: var(--color-text); font-size: 0.9rem; font-weight: 600; }
.sygu-field input,
.sygu-field textarea {
    background: var(--color-bg);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border-soft);
    color: var(--color-text);
    font-family: inherit;
    font-size: 1rem;
    padding: 12px 14px;
    transition: border-color var(--transition);
    width: 100%;
}
.sygu-field input:focus,
.sygu-field textarea:focus {
    border-color: var(--color-accent);
    outline: none;
}
.sygu-submit {
    background: var(--color-accent);
    border-radius: var(--radius-md);
    border: none;
    color: var(--color-primary);
    font-size: 1rem;
    font-weight: 700;
    justify-self: start;
    padding: 14px 28px;
    transition: background var(--transition), color var(--transition);
}
.sygu-submit:hover {
    background: var(--color-accent-pressed);
    color: var(--color-primary);
}
.sygu-success {
    background: var(--color-surface);
    border-left: 4px solid var(--color-accent);
    border-radius: var(--radius-md);
    color: var(--color-text);
    margin-top: var(--space-md);
    padding: var(--space-lg);
}
.sygu-channels {
    color: var(--color-text-muted);
    list-style: none;
    margin-top: var(--space-md);
    padding-left: 0;
}
.sygu-channels li { margin-bottom: 6px; }

/* ---------- Cookie banner (.vyni, COOK-07) ---------- */
.vyni {
    background: linear-gradient(180deg, var(--color-bg-elevated), var(--color-primary));
    border-top: 2px solid var(--color-accent);
    bottom: 0;
    box-shadow: var(--shadow-lg);
    left: 0;
    position: fixed;
    right: 0;
    z-index: 200;
}
.vyni[hidden] { display: none; }
.vyni-inner {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding: var(--space-md) 24px;
}
.vyni-text { color: var(--color-text); flex: 1 1 320px; font-size: 0.92rem; margin: 0; }
.vyni-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.vyni-accept {
    background: var(--color-accent);
    border-radius: var(--radius-sm);
    border: none;
    color: var(--color-primary);
    font-weight: 700;
    padding: 10px 20px;
    transition: background var(--transition), color var(--transition);
}
.vyni-accept:hover { background: var(--color-accent-pressed); color: var(--color-primary); }
.vyni-decline {
    background: transparent;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border-soft);
    color: var(--color-text);
    padding: 10px 20px;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
}
.vyni-decline:hover { background: var(--color-text); color: var(--color-primary); border-color: var(--color-text); }

/* ---------- CTA block (.givox, CTA-05) ---------- */
.givox {
    padding: var(--space-xl) 0;
}
.givox-inner {
    align-items: center;
    background: linear-gradient(135deg, var(--color-gradient-mid) 0%, var(--color-accent) 100%);
    border-radius: var(--radius-lg);
    color: var(--color-primary);
    display: grid;
    gap: var(--space-lg);
    grid-template-columns: 1.4fr auto;
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding: var(--space-xl);
    position: relative;
}
.givox-title { color: var(--color-primary); font-size: clamp(1.4rem, 2.4vw, 2rem); margin-bottom: 10px; }
.givox-desc { color: var(--color-primary); font-size: 1.02rem; margin: 0; opacity: 0.92; }
.givox-btn {
    background: var(--color-primary);
    border-radius: var(--radius-md);
    color: var(--color-accent);
    display: inline-block;
    font-weight: 700;
    padding: 18px 36px;
    transition: background var(--transition), color var(--transition);
    white-space: nowrap;
}
.givox-btn:hover { background: var(--color-accent-pressed); color: var(--color-primary); }

/* ---------- Data table (.fygabud, TABLE-02) ---------- */
.fygabud {
    padding: var(--space-lg) 0;
}
.fygabud-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    overflow-x: auto;
    padding-inline: 24px;
}
.fygabud-table {
    background: var(--color-surface);
    border-collapse: collapse;
    border-radius: var(--radius-md);
    overflow: hidden;
    width: 100%;
}
.fygabud-table thead {
    background: linear-gradient(180deg, var(--color-accent), var(--color-accent-pressed));
    color: var(--color-primary);
}
.fygabud-table th,
.fygabud-table td {
    padding: 14px 18px;
    text-align: left;
}
.fygabud-table tbody tr { border-top: 1px solid var(--color-border-soft); }
.fygabud-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, 0.02); }
.fygabud-table th[scope='row'] { color: var(--color-accent); font-weight: 600; }

/* ---------- Error block (.rizyn, ERR-05) ---------- */
.rizyn {
    padding: var(--space-xl) 0;
}
.rizyn-inner {
    margin: 0 auto;
    max-width: 720px;
    padding: var(--space-xl) 24px;
    text-align: center;
}
.rizyn-code {
    background: linear-gradient(180deg, var(--color-accent), var(--color-gradient-mid));
    background-clip: text;
    color: transparent;
    -webkit-background-clip: text;
    font-size: clamp(5rem, 14vw, 9rem);
    font-weight: 800;
    line-height: 1;
    margin: 0 0 var(--space-md);
}
.rizyn-title { font-size: clamp(1.6rem, 3vw, 2.4rem); margin-bottom: var(--space-md); }
.rizyn-text { color: var(--color-text-muted); margin-bottom: var(--space-lg); }
.rizyn-btn {
    background: var(--color-accent);
    border-radius: var(--radius-md);
    color: var(--color-primary);
    display: inline-block;
    font-weight: 700;
    padding: 16px 32px;
    transition: background var(--transition), color var(--transition);
}
.rizyn-btn:hover { background: var(--color-accent-pressed); color: var(--color-primary); }

/* ---------- FAQ (.buve, FAQ-08) ---------- */
.buve {
    padding: var(--space-xl) 0;
}
.buve-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.buve-heading { margin-bottom: var(--space-lg); }
.buve-list { display: grid; gap: 12px; }
.buve-item {
    background: var(--color-surface);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-soft);
    overflow: hidden;
    transition: border-color var(--transition);
}
.buve-item[open] { border-color: var(--color-accent); }
.buve-q {
    align-items: center;
    color: var(--color-text);
    cursor: pointer;
    display: flex;
    font-weight: 600;
    gap: var(--space-md);
    justify-content: space-between;
    list-style: none;
    padding: 18px 22px;
}
.buve-q::-webkit-details-marker { display: none; }
.buve-q:hover { color: var(--color-accent); }
.buve-icon {
    background: var(--color-accent);
    border-radius: 50%;
    color: var(--color-primary);
    display: inline-grid;
    flex-shrink: 0;
    font-size: 1.1rem;
    font-weight: 700;
    height: 28px;
    line-height: 1;
    place-items: center;
    transition: transform var(--transition);
    width: 28px;
}
.buve-item[open] .buve-icon { transform: rotate(45deg); }
.buve-a {
    border-top: 1px solid var(--color-border-soft);
    color: var(--color-text-muted);
    padding: 16px 22px 22px;
}
.buve-a p { margin: 0; }

/* ---------- Footer (.rygyl, FOOT-03) ---------- */
.rygyl {
    background: linear-gradient(180deg, var(--color-bg), var(--color-primary));
    border-top: 1px solid var(--color-border);
    margin-top: var(--space-xl);
    padding: var(--space-xl) 0 var(--space-lg);
}
.rygyl-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.rygyl-grid {
    display: grid;
    gap: var(--space-xl);
    grid-template-columns: 1.4fr 1fr 1fr;
    margin-bottom: var(--space-xl);
}
.rygyl-brand p { color: var(--color-text-muted); font-size: 0.95rem; }
.rygyl-logo { display: inline-block; margin-bottom: var(--space-md); }
.rygyl-logo img { height: 72px; width: auto; }
.rygyl-tag { line-height: 1.6; margin-bottom: var(--space-md); }
.rygyl-age {
    background: var(--color-surface);
    border-left: 3px solid var(--color-accent);
    border-radius: var(--radius-sm);
    color: var(--color-text);
    display: inline-block;
    font-weight: 700;
    padding: 8px 14px;
}
.rygyl-heading {
    color: var(--color-accent);
    font-size: 1rem;
    letter-spacing: 0.04em;
    margin-bottom: var(--space-md);
    text-transform: uppercase;
}
.rygyl-list { list-style: none; padding: 0; }
.rygyl-list li { margin-bottom: 10px; }
.rygyl-list a { color: var(--color-text-muted); }
.rygyl-list a:hover { color: var(--color-accent); }
.rygyl-payment {
    align-items: center;
    border-top: 1px solid var(--color-border-soft);
    border-bottom: 1px solid var(--color-border-soft);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
    padding: var(--space-md) 0;
}
.rygyl-paylabel { color: var(--color-text-muted); font-size: 0.85rem; font-weight: 600; text-transform: uppercase; }
.rygyl-paylist {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.rygyl-paylist li {
    background: var(--color-surface);
    border-radius: var(--radius-sm);
    color: var(--color-text);
    font-size: 0.85rem;
    margin: 0;
    padding: 6px 12px;
}
.rygyl-bottom {
    color: var(--color-text-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: 0.85rem;
    gap: var(--space-md);
    justify-content: space-between;
}
.rygyl-copy, .rygyl-license { margin: 0; }

/* ---------- Header (.sefevop, HEAD-04, STICKY-01) ---------- */
.sefevop {
    backdrop-filter: blur(10px);
    background: rgba(6, 10, 13, 0.92);
    border-bottom: 1px solid var(--color-border);
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    transition: padding var(--transition);
    width: 100%;
    z-index: 100;
}
.sefevop.is-shrunk { background: rgba(6, 10, 13, 0.98); }
.sefevop-inner {
    align-items: center;
    display: flex;
    gap: var(--space-md);
    height: var(--header-height-desktop);
    margin: 0 auto;
    max-width: 1440px;
    padding-inline: var(--space-md);
}
.sefevop-logo, .sefevop-logo img { flex-shrink: 0; }
.sefevop-logo img { height: 88px; width: auto; }
.sefevop-nav { flex: 1; }
.sefevop-list {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: flex-end;
    list-style: none;
    margin: 0;
    padding: 0;
}
.sefevop-list > li { margin: 0; }
.sefevop-list > li > a {
    border-radius: var(--radius-sm);
    color: var(--color-text);
    display: inline-block;
    font-size: 0.9rem;
    font-weight: 500;
    padding: 8px 12px;
    transition: background var(--transition), color var(--transition);
}
.sefevop-list > li > a:hover,
.sefevop-list > li > a[aria-current='page'] {
    background: rgba(255, 215, 56, 0.12);
    color: var(--color-accent);
}
.sefevop-more { position: relative; }
.sefevop-more-toggle {
    background: transparent;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border-soft);
    color: var(--color-text);
    font-size: 0.9rem;
    font-weight: 500;
    padding: 8px 12px;
    transition: background var(--transition), color var(--transition);
}
.sefevop-more-toggle:hover,
.sefevop-more-toggle[aria-expanded='true'] {
    background: rgba(255, 215, 56, 0.12);
    border-color: var(--color-accent);
    color: var(--color-accent);
}
.sefevop-more-menu {
    background: var(--color-bg-elevated);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-soft);
    box-shadow: var(--shadow-lg);
    list-style: none;
    margin: 0;
    min-width: 240px;
    padding: 8px;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 50;
}
.sefevop-more-menu[hidden] { display: none; }
.sefevop-more-menu li { margin: 0; }
.sefevop-more-menu a {
    border-radius: var(--radius-sm);
    color: var(--color-text);
    display: block;
    font-size: 0.9rem;
    padding: 10px 14px;
    transition: background var(--transition), color var(--transition);
}
.sefevop-more-menu a:hover,
.sefevop-more-menu a[aria-current='page'] {
    background: rgba(255, 215, 56, 0.12);
    color: var(--color-accent);
}
.sefevop-toggle {
    background: transparent;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border-soft);
    display: none;
    height: 44px;
    margin-left: auto !important;
    padding: 0;
    position: relative;
    width: 44px;
}
.sefevop-toggle span {
    background: var(--color-text);
    border-radius: 2px;
    display: block;
    height: 2px;
    left: 50%;
    margin: 0 auto;
    position: absolute;
    transform: translateX(-50%);
    transition: transform var(--transition), opacity var(--transition);
    width: 22px;
}
.sefevop-toggle span:nth-child(1) { top: 13px; }
.sefevop-toggle span:nth-child(2) { top: 21px; }
.sefevop-toggle span:nth-child(3) { top: 29px; }
.sefevop-toggle[aria-expanded='true'] span:nth-child(1) { top: 21px; transform: translateX(-50%) rotate(45deg); }
.sefevop-toggle[aria-expanded='true'] span:nth-child(2) { opacity: 0; }
.sefevop-toggle[aria-expanded='true'] span:nth-child(3) { top: 21px; transform: translateX(-50%) rotate(-45deg); }
.sefevop-mobile {
    background: var(--color-bg-elevated);
    border-top: 1px solid var(--color-border-soft);
    max-height: calc(100vh - var(--header-height-desktop));
    overflow-y: auto;
    padding: var(--space-md);
}
.sefevop-mobile[hidden] { display: none; }
.sefevop-mobile-list { list-style: none; margin: 0; padding: 0; }
.sefevop-mobile-list li { margin: 0 0 4px; }
.sefevop-mobile-list a {
    border-radius: var(--radius-sm);
    color: var(--color-text);
    display: block;
    font-size: 1rem;
    font-weight: 500;
    padding: 14px 16px;
}
.sefevop-mobile-list a:hover,
.sefevop-mobile-list a[aria-current='page'] {
    background: rgba(255, 215, 56, 0.12);
    color: var(--color-accent);
}

/* ---------- Hero (.dafog, HERO-12) ---------- */
.dafog {
    overflow: hidden;
    padding: var(--space-xl) 0;
    position: relative;
}
.dafog-inner {
    align-items: center;
    display: grid;
    gap: var(--space-xl);
    grid-template-columns: 1.05fr 1fr;
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.dafog-kicker {
    color: var(--color-accent);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    margin-bottom: var(--space-md);
    text-transform: uppercase;
}
.dafog-title {
    background: linear-gradient(135deg, var(--color-text) 0%, var(--color-accent) 100%);
    background-clip: text;
    color: transparent;
    -webkit-background-clip: text;
    font-size: clamp(2.2rem, 5vw, 3.6rem);
    line-height: 1.1;
    margin-bottom: var(--space-md);
}
.dafog-subtitle {
    color: var(--color-text-muted);
    font-size: clamp(1rem, 1.4vw, 1.15rem);
    line-height: 1.6;
    margin-bottom: var(--space-lg);
    max-width: 56ch;
}
.dafog-cta {
    background: var(--color-accent);
    border-radius: var(--radius-md);
    color: var(--color-primary);
    display: inline-block;
    font-size: 1.05rem;
    font-weight: 700;
    padding: 18px 36px;
    transition: background var(--transition), color var(--transition), transform var(--transition);
}
.dafog-cta:hover { background: var(--color-accent-pressed); color: var(--color-primary); transform: translateY(-2px); }
.dafog-media {
    aspect-ratio: 16 / 10;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    position: relative;
}
.dafog-image {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

/* ---------- Inline CTA (.tyxi, INLINE-CTA-05) ---------- */
.tyxi {
    margin: var(--space-lg) auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.tyxi-inner {
    align-items: center;
    background: linear-gradient(135deg, var(--color-surface), var(--color-bg-elevated));
    border-left: 4px solid var(--color-accent);
    border-radius: var(--radius-md);
    display: grid;
    gap: var(--space-md);
    grid-template-columns: 1fr auto;
    padding: var(--space-md) var(--space-lg);
}
.tyxi-title {
    color: var(--color-text);
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 4px;
}
.tyxi-desc {
    color: var(--color-text-muted);
    font-size: 0.92rem;
    margin: 0;
}
.tyxi-btn {
    background: var(--color-accent);
    border-radius: var(--radius-sm);
    color: var(--color-primary);
    display: inline-block;
    font-weight: 700;
    padding: 14px 28px;
    transition: background var(--transition), color var(--transition);
    white-space: nowrap;
}
.tyxi-btn:hover { background: var(--color-accent-pressed); color: var(--color-primary); }

/* ---------- Items grid (.pugeru, GRID-11) ---------- */
.pugeru {
    padding: var(--space-xl) 0;
}
.pugeru-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.pugeru-heading { margin-bottom: var(--space-lg); }
.pugeru-list {
    display: grid;
    gap: var(--space-md);
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.pugeru-card {
    background: linear-gradient(180deg, var(--color-surface), var(--color-bg-elevated));
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-soft);
    display: flex;
    flex-direction: column;
    padding: var(--space-lg);
    position: relative;
    transition: border-color var(--transition), transform var(--transition);
}
.pugeru-card:hover {
    border-color: var(--color-accent);
    transform: translateY(-4px);
}
.pugeru-badge {
    background: var(--color-accent);
    border-radius: var(--radius-sm);
    color: var(--color-primary);
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 700;
    margin-bottom: var(--space-sm);
    padding: 4px 10px;
    width: max-content;
}
.pugeru-title {
    color: var(--color-text);
    font-size: 1.1rem;
    margin-bottom: var(--space-sm);
}
.pugeru-text {
    color: var(--color-text-muted);
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

/* ---------- Legal section (.zavyfyp, LEGAL-07) ---------- */
.zavyfyp {
    padding: var(--space-xl) 0;
}
.zavyfyp-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.zavyfyp-title { font-size: clamp(1.8rem, 3.4vw, 2.6rem); margin-bottom: var(--space-md); }
.zavyfyp-intro { color: var(--color-text-muted); font-size: 1.05rem; margin-bottom: var(--space-md); max-width: 720px; }
.zavyfyp-updated { color: var(--color-text-muted); font-size: 0.9rem; margin-bottom: var(--space-lg); }
.zavyfyp-block {
    background: var(--color-surface);
    border-left: 3px solid var(--color-accent);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-md);
    padding: var(--space-lg);
}
.zavyfyp-block h2 { font-size: 1.2rem; margin-bottom: var(--space-sm); }
.zavyfyp-block p { color: var(--color-text-muted); margin-bottom: var(--space-sm); }
.zavyfyp-block p:last-child { margin-bottom: 0; }
.zavyfyp-support { background: var(--color-bg-elevated); border-radius: var(--radius-md); margin-top: var(--space-lg); padding: var(--space-lg); }
.zavyfyp-support h2 { color: var(--color-accent); font-size: 1.1rem; margin-bottom: var(--space-sm); }
.zavyfyp-support ul { color: var(--color-text-muted); }
.zavyfyp-disclaimer { color: var(--color-text-muted); font-size: 0.9rem; margin-top: var(--space-lg); }

/* ---------- Page header (.bexyz, PHEAD-01) ---------- */
.bexyz {
    padding: var(--space-xl) 0 var(--space-md);
}
.bexyz-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.bexyz-title {
    background: linear-gradient(135deg, var(--color-text) 0%, var(--color-accent) 100%);
    background-clip: text;
    color: transparent;
    -webkit-background-clip: text;
    font-size: clamp(2rem, 4.2vw, 3.2rem);
    line-height: 1.15;
    margin: 0;
}

/* ---------- Prose (.muvoz, PROSE-06) ---------- */
.muvoz {
    padding: var(--space-lg) 0;
}
.muvoz-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.muvoz-inner h2 {
    border-bottom: 1px solid var(--color-border-soft);
    color: var(--color-text);
    margin-top: var(--space-lg);
    padding-bottom: var(--space-sm);
}
.muvoz-inner h2:first-child { margin-top: 0; }
.muvoz-inner h3 { color: var(--color-accent); }
.muvoz-inner p {
    color: var(--color-text-muted);
    font-size: 1.02rem;
    line-height: 1.75;
    max-width: var(--container-readable);
}
.muvoz-inner ul, .muvoz-inner ol { color: var(--color-text-muted); max-width: var(--container-readable); }
.muvoz-inner li { line-height: 1.7; }
.muvoz-inner strong { color: var(--color-text); }
.muvoz-inner a { border-bottom: 1px dotted var(--color-accent); }
.muvoz-inner a:hover { border-bottom-color: var(--color-accent-pressed); }

/* ---------- Reviews (.xetyz, REV-01) ---------- */
.xetyz {
    padding: var(--space-xl) 0;
}
.xetyz-inner {
    margin: 0 auto;
    max-width: calc(var(--container-site) + 2 * 24px);
    padding-inline: 24px;
}
.xetyz-heading { margin-bottom: var(--space-lg); }
.xetyz-list {
    display: grid;
    gap: var(--space-md);
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.xetyz-card {
    background: var(--color-surface);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-soft);
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-lg);
}
.xetyz-head {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    justify-content: space-between;
}
.xetyz-author { color: var(--color-text); font-weight: 700; margin: 0; }
.xetyz-rating { align-items: center; display: flex; gap: 4px; }
.xetyz-star { font-size: 1rem; }
.xetyz-star--full { color: var(--color-accent); }
.xetyz-star--half { color: var(--color-accent); opacity: 0.6; }
.xetyz-star--empty { color: var(--color-text-muted); opacity: 0.4; }
.xetyz-score { color: var(--color-accent); font-weight: 700; margin-left: 4px; }
.xetyz-text { color: var(--color-text-muted); font-size: 0.95rem; line-height: 1.6; margin: 0; }
.xetyz-date { color: var(--color-text-muted); font-size: 0.82rem; opacity: 0.8; }

/* ---------- Skip link ---------- */
.skip-link {
    background: var(--color-accent);
    border-radius: var(--radius-sm);
    color: var(--color-primary);
    font-weight: 700;
    left: 16px;
    padding: 10px 16px;
    position: absolute;
    top: 16px;
    z-index: 999;
}
.skip-link:not(:focus) { top: -200px !important; }

/* ---------- Tablet (≤ 960px) ---------- */
@media (max-width: 960px) {
    .dafog-inner { grid-template-columns: 1fr; }
    .givox-inner { grid-template-columns: 1fr; text-align: center; }
    .givox-btn { justify-self: center; }
    .lilo-inner { grid-template-columns: 1fr; text-align: center; }
    .lilo-portrait img { margin: 0 auto; max-width: 280px; }
    .lilo-expertise li { text-align: left; }
    .rygyl-grid { gap: var(--space-lg); grid-template-columns: 1fr 1fr; }
    .rygyl-brand { grid-column: 1 / -1; }
    .sefevop-logo img { height: 72px; }
    .sefevop-inner { height: var(--header-height-mobile); }
    body { padding-top: var(--header-height-mobile); }
    .vyni-text { font-size: 0.85rem; }
}

/* ---------- Mobile (BP-09: ≤ 720px) ---------- */
@media (max-width: 720px) {
    section { padding: var(--space-lg) 0; }
    .bexyz { padding-top: var(--space-lg); }
    .buve-q { padding: 14px 16px; }
    .dafog-media { aspect-ratio: 4 / 3; }
    .fygabud-table th, .fygabud-table td { font-size: 0.9rem; padding: 10px 12px; }
    .givox-inner { padding: var(--space-lg); }
    .pugeru-list { grid-template-columns: 1fr; }
    .rygyl-grid { grid-template-columns: 1fr; }
    .sefevop-logo img { height: 64px; }
    .sefevop-nav { display: none; }
    .sefevop-toggle { display: block; }
    .sygu-form { padding: var(--space-md); }
    .tyxi-inner { grid-template-columns: 1fr; padding: var(--space-md); text-align: center; }
    .vyni-inner { flex-direction: column; align-items: stretch; padding: var(--space-sm) 16px; }
    .vyni-text { font-size: 0.82rem; }
    .vyni-actions { justify-content: center; }
    .vyni-accept, .vyni-decline { flex: 1; padding: 10px 14px; }
    .xetyz-list { grid-template-columns: 1fr; }
}

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

/* nav overflow fix: shrink GR labels to fit row */
.sefevop-nav .sefevop-nav-list { flex-wrap: nowrap; gap: 0.5rem; }
.sefevop-nav .sefevop-nav-list > li > a,
.sefevop-nav .sefevop-more-toggle { font-size: 0.82rem; padding-left: 0.4rem; padding-right: 0.4rem; white-space: nowrap; }