*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --zvq-primary: #0f6f6c;
    --zvq-accent: #f4a259;
    --zvq-deep: #0b3a38;
    --zvq-surface: #eef7f6;
    --zvq-ink: #10302d;
    --zvq-muted: #4d6e6a;
    --zvq-line: #d3e7e4;
    --zvq-paper: #ffffff;
    --zvq-sans: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --zvq-slab: "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
    --zvq-r1: 10px;
    --zvq-r2: 16px;
    --zvq-r3: 26px;
    --zvq-sh1: 0 8px 20px rgba(11, 58, 56, .08);
    --zvq-sh2: 0 16px 38px rgba(11, 58, 56, .13);
    --zvq-sh3: 0 26px 58px rgba(11, 58, 56, .2);
}

html { scroll-behavior: smooth; }

body {
    font-family: var(--zvq-sans);
    background:
        radial-gradient(circle at 12% 4%, rgba(244, 162, 89, .16), transparent 34%),
        linear-gradient(180deg, #ffffff 0%, #eef7f6 58%, #e2f0ee 100%);
    color: var(--zvq-ink);
    line-height: 1.7;
    font-size: 16px;
}

a {
    color: var(--zvq-primary);
    text-decoration: none;
    transition: color .2s ease;
}
a:hover { color: #0b5f5a; }

/* ---------- шапка ---------- */
.zvq-topline {
    position: sticky;
    top: 0;
    z-index: 20;
    padding: 15px 20px;
    background: linear-gradient(90deg, #0b3a38 0%, #0f6f6c 100%);
    border-bottom: 3px solid var(--zvq-accent);
}
.zvq-topline__inner {
    max-width: 1160px;
    margin: 0 auto;
    text-align: center;
}
.zvq-topline__mark {
    font-family: var(--zvq-slab);
    font-size: 20px;
    letter-spacing: .26em;
    text-transform: uppercase;
    font-weight: 700;
    color: #f2fbfa;
}
.zvq-topline__mark:hover { color: var(--zvq-accent); }

/* ---------- заголовок документа ---------- */
.zvq-doc-head {
    max-width: 980px;
    margin: 0 auto;
    padding: 62px 20px 30px;
}
.zvq-doc-head__tag {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 6px;
    background: var(--zvq-deep);
    color: #ffd9b0;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.zvq-doc-head__title {
    font-family: var(--zvq-slab);
    font-size: clamp(28px, 4.4vw, 46px);
    line-height: 1.16;
    color: var(--zvq-deep);
    margin-bottom: 14px;
}
.zvq-doc-head__intro {
    max-width: 700px;
    color: var(--zvq-muted);
    font-size: 17px;
}
.zvq-doc-head__stamp {
    display: inline-block;
    margin-top: 20px;
    padding: 8px 16px;
    border-left: 4px solid var(--zvq-accent);
    background: rgba(255, 255, 255, .8);
    border-radius: 0 var(--zvq-r1) var(--zvq-r1) 0;
    font-size: 13px;
    color: var(--zvq-deep);
    font-weight: 700;
}

/* ---------- каркас сторінки ---------- */
.zvq-shell {
    max-width: 980px;
    margin: 0 auto;
    padding: 0 20px 84px;
}
.zvq-paper {
    background: var(--zvq-paper);
    border: 1px solid var(--zvq-line);
    border-radius: var(--zvq-r3);
    box-shadow: var(--zvq-sh2);
    padding: 46px 48px;
}
.zvq-paper > p { color: var(--zvq-muted); margin-bottom: 15px; }
.zvq-paper strong { color: var(--zvq-deep); }

@media (max-width: 740px) {
    .zvq-paper { padding: 26px 20px; border-radius: 18px; }
    .zvq-doc-head { padding-top: 46px; }
}

/* ---------- нумерована секція з великим номером збоку ---------- */
.zvq-clause {
    display: grid;
    grid-template-columns: 84px 1fr;
    gap: 20px;
    padding: 26px 0;
    border-top: 1px solid var(--zvq-line);
}
.zvq-clause:first-of-type { border-top: none; padding-top: 6px; }
.zvq-clause__num {
    font-family: var(--zvq-slab);
    font-size: 54px;
    line-height: .9;
    font-weight: 700;
    color: rgba(15, 111, 108, .26);
    letter-spacing: -.03em;
    padding-top: 4px;
}
.zvq-clause__body { min-width: 0; }
.zvq-clause__title {
    font-family: var(--zvq-slab);
    font-size: clamp(20px, 2.6vw, 27px);
    line-height: 1.22;
    color: var(--zvq-deep);
    margin-bottom: 12px;
}
.zvq-clause__minor {
    font-size: 17px;
    line-height: 1.3;
    color: var(--zvq-primary);
    margin: 20px 0 8px;
}
.zvq-clause__body p { color: var(--zvq-muted); margin-bottom: 13px; }
.zvq-clause__body ul,
.zvq-clause__body ol {
    padding-left: 20px;
    margin: 0 0 15px;
    color: var(--zvq-muted);
}
.zvq-clause__body li { margin-bottom: 7px; }
.zvq-clause__body li::marker { color: var(--zvq-accent); }

@media (max-width: 620px) {
    .zvq-clause { grid-template-columns: 1fr; gap: 8px; }
    .zvq-clause__num { font-size: 40px; padding-top: 0; }
}

/* ---------- виносні блоки-нотатки ---------- */
.zvq-memo {
    margin: 20px 0;
    padding: 16px 18px 16px 20px;
    border-left: 5px solid var(--zvq-primary);
    background: #eef7f6;
    border-radius: 0 var(--zvq-r2) var(--zvq-r2) 0;
}
.zvq-memo__label {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--zvq-primary);
    margin-bottom: 6px;
}
.zvq-memo p { margin: 0; color: var(--zvq-ink); font-size: 15px; }
.zvq-memo--alert {
    border-left-color: var(--zvq-accent);
    background: #fdf3e9;
}
.zvq-memo--alert .zvq-memo__label { color: #b96a17; }

/* ---------- пари «умова → значення» ---------- */
.zvq-facts {
    margin: 18px 0 20px;
    border: 1px solid var(--zvq-line);
    border-radius: var(--zvq-r2);
    overflow: hidden;
}
.zvq-facts__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--zvq-line);
}
.zvq-facts__row:first-child { border-top: none; }
.zvq-facts__term,
.zvq-facts__value {
    padding: 12px 16px;
    font-size: 15px;
}
.zvq-facts__term {
    background: #f4faf9;
    color: var(--zvq-deep);
    font-weight: 700;
}
.zvq-facts__value { color: var(--zvq-muted); }
@media (max-width: 560px) {
    .zvq-facts__row { grid-template-columns: 1fr; }
    .zvq-facts__value { padding-top: 0; }
}

/* ---------- підпис під документом ---------- */
.zvq-closing {
    margin-top: 30px;
    padding-top: 18px;
    border-top: 2px dashed var(--zvq-line);
    font-size: 13px;
    color: var(--zvq-muted);
}

/* ---------- футер ---------- */
.zvq-basement {
    margin-top: 40px;
    background: linear-gradient(180deg, #0b3a38 0%, #072826 100%);
    color: #8fb8b4;
    padding: 26px 20px 22px;
    text-align: center;
    border-top: 3px solid var(--zvq-accent);
}
.zvq-basement__inner {
    max-width: 900px;
    margin: 0 auto;
}
.zvq-basement__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 22px;
    margin-bottom: 12px;
}
.zvq-basement__links a {
    color: #a9cfcb;
    font-size: 11px;
    letter-spacing: .04em;
}
.zvq-basement__links a:hover { color: var(--zvq-accent); }
.zvq-basement__copy {
    font-size: 11px;
    color: #7ba7a3;
}
