/* ── Cormorant Garamond (self-hosted, latin + latin-ext, features OpenType intacte) ── */
@font-face {
    font-family: "Cormorant Garamond";
    src: url("/fonts/cormorant-garamond-300.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Cormorant Garamond";
    src: url("/fonts/cormorant-garamond-300-italic.woff2") format("woff2");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Cormorant Garamond";
    src: url("/fonts/cormorant-garamond-400.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Cormorant Garamond";
    src: url("/fonts/cormorant-garamond-400-italic.woff2") format("woff2");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Cormorant Garamond";
    src: url("/fonts/cormorant-garamond-500.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Cormorant Garamond";
    src: url("/fonts/cormorant-garamond-600.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.section,
[id] {
    scroll-margin-top: 90px; /* înălțimea navbar-ului */
}

/* ── VARIABILE TEMA DARK (default) ── */
:root {
    /* Culori de bază */
    --bg: #1c1e5b;
    --gold: #c9a84c;
    --gold-light: #e4c97a;
    --emfază: #e4c97a;
    --text: #e8dfc8;

    /* Variante cu opacitate */
    --text-82: color-mix(in srgb, var(--text) 82%, transparent);
    --text-75: color-mix(in srgb, var(--text) 75%, transparent);
    --text-72: color-mix(in srgb, var(--text) 72%, transparent);
    --text-65: color-mix(in srgb, var(--text) 65%, transparent);
    --text-55: color-mix(in srgb, var(--text) 55%, transparent);
    --text-45: color-mix(in srgb, var(--text) 45%, transparent);
    --text-85: color-mix(in srgb, var(--text) 85%, transparent);

    --gold-75: color-mix(in srgb, var(--gold) 75%, transparent);
    --gold-60: color-mix(in srgb, var(--gold) 60%, transparent);
    --gold-35: color-mix(in srgb, var(--gold) 35%, transparent);
    --gold-22: color-mix(in srgb, var(--gold) 22%, transparent);
    --gold-20: color-mix(in srgb, var(--gold) 20%, transparent);
    --gold-14: color-mix(in srgb, var(--gold) 14%, transparent);
    --gold-45: color-mix(in srgb, var(--gold) 45%, transparent);
    --gold-52: color-mix(in srgb, var(--gold) 52%, transparent);
    --gold-06: color-mix(in srgb, var(--gold) 6%, transparent);

    /* Suprafețe */
    --card-bg: rgba(255, 255, 255, 0.025);
    --card-back-bg: rgba(201, 168, 76, 0.06);
    --input-bg: rgba(255, 255, 255, 0.04);
    --input-bg-focus: rgba(255, 255, 255, 0.07);
    --overlay-bg: rgba(28, 30, 91, 0.85);
    --fullscreen-bg: #1c1e5b;

    /* Borduri */
    --border: rgba(201, 168, 76, 0.22);
    --border-hover: rgba(201, 168, 76, 0.52);
    --border-back: rgba(201, 168, 76, 0.45);
    --border-footer: rgba(201, 168, 76, 0.14);
    --border-map: rgba(201, 168, 76, 0.2);
    --border-diac: rgba(201, 168, 76, 0.2);

    /* Misc */
    --nav-h: 64px;
    --bg-opacity: 1;
}

/* ── VARIABILE TEMA LIGHT ── */
[data-theme="light"] {
    --bg: #f5efe0;
    --gold: #00059c;
    --gold-light: #0007d9;
    --text: #1a1d6e;
    --emfază: #494fff;

    /* variantele text pe light — valori mai mari pentru contrast pe fond deschis */
    --text-82: var(--text);
    --text-75: var(--text);
    --text-72: var(--text);
    --text-65: color-mix(in srgb, var(--text) 90%, transparent);
    --text-55: color-mix(in srgb, var(--text) 80%, transparent);
    --text-45: color-mix(in srgb, var(--text) 65%, transparent);
    --text-85: var(--text);

    --card-bg: rgba(28, 30, 91, 0.04);
    --card-back-bg: rgba(28, 30, 91, 0.08);
    --input-bg: rgba(28, 30, 91, 0.03);
    --input-bg-focus: rgba(28, 30, 91, 0.07);
    --overlay-bg: rgba(245, 239, 224, 0.9);
    --fullscreen-bg: #f5efe0;

    --border: rgba(28, 30, 91, 0.22);
    --border-hover: rgba(28, 30, 91, 0.6);
    --border-back: rgba(28, 30, 91, 0.45);
    --border-footer: rgba(28, 30, 91, 0.14);
    --border-map: rgba(28, 30, 91, 0.2);
    --border-diac: rgba(28, 30, 91, 0.22);

    --bg-opacity: 0.2;
}
#bg-wrap {
    color: #2a2d7e;
    opacity: 0.6;
}
[data-theme="light"] #bg-wrap {
    color: #dabe88;
    opacity: 0.5;
}
[data-theme="light"] .calc-field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%231a1d6e' stroke-width='1.2' fill='none'/%3E%3C/svg%3E");
}
[data-theme="light"] .calc-field select:focus {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%231a1d6e' stroke-width='1.2' fill='none'/%3E%3C/svg%3E");
}
[data-theme="light"] .calc-field select:focus {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%231a1d6e' stroke-width='1.2' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1em center;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--bg);
    color: var(--text);
    font-family: "Cormorant Garamond", serif;
    overflow-x: hidden;
    min-height: 100vh;
    font-size: clamp(18px, 2.2vw, 24px);
    line-height: 1.75;
    transition:
        background 0.4s ease,
        color 0.4s ease;
}

em {
    font-style: italic;
    color: var(--emfază);
}

/* ── NAV ── */
.anunt-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 110;
    background: var(--gold);
    color: var(--bg);
    text-align: center;
    padding: 0.5em 1.2em;
    font-size: clamp(0.92rem, 1.2vw, 1.08rem);
    letter-spacing: 0.01em;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55em;
    line-height: 1.35;
    cursor: pointer;
    transition: transform 0.35s ease;
}
.anunt-bar.anunt-hidden {
    transform: translateY(-100%);
    visibility: hidden;
    transition:
        transform 0.35s ease,
        visibility 0s linear 0.35s;
}
/* anti-flash: dacă a fost deja închisă în sesiune, nu o picta deloc */
html.anunt-off .anunt-bar {
    display: none;
}
.anunt-icon {
    flex-shrink: 0;
}
#site-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 clamp(24px, 6vw, 80px);
    height: clamp(52px, 7vw, 72px);
    pointer-events: auto;
    transition: top 0.35s ease;
}
#nav-logo {
    position: absolute;
    left: clamp(12px, 3vw, 80px);
    top: 50%;
    transform: translateY(-50%);
    color: var(--gold);
}
#nav-logo svg {
    height: clamp(2.5rem, 5vw, 4rem);
    padding-top: 2px;
    width: auto;
}
.nav-brand {
    font-size: clamp(0.65rem, 1.2vw, 0.9rem);
    letter-spacing: 0.28em;
    color: var(--gold);
    text-transform: uppercase;
    text-decoration: none;
}
.nav-links {
    display: flex;
    gap: clamp(20px, 3vw, 48px);
    list-style: none;
}
.nav-links a {
    font-size: clamp(1rem, 1.2vw, 1.2rem);
    font-weight: 500;
    letter-spacing: 0.3em;
    color: var(--gold);
    text-transform: uppercase;
    text-decoration: none;
    transition: color 0.25s;
}
.nav-links a.active,
.nav-links a:hover {
    color: var(--emfază);
}

/* ── BACKGROUND ── */
#bg-wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    opacity: var(--bg-opacity);
    transition: opacity 0.4s ease;
}
#bg-wrap svg {
    width: 100%;
    height: 100%;
}
.page {
    position: relative;
    z-index: 1;
}

/* ── HERO ── */
.hero {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: clamp(40px, 8vw, 100px) clamp(24px, 8vw, 100px);
}
.hero h1 {
    font-style: italic;
    font-weight: 300;
    font-size: clamp(3.4rem, 8vw, 7rem);
    color: var(--gold-light);
    letter-spacing: 0.02em;
    line-height: 1.05;
    margin-bottom: 0.35em;
}
.hero .sub {
    font-size: clamp(1rem, 2.1vw, 2rem);
    font-weight: 400;
    letter-spacing: 0.35em;
    color: var(--gold);
    text-transform: uppercase;
    margin-bottom: 2em;
}
.logo-divider {
    width: 100px;
    margin: 0 auto 2em;
    color: var(--gold);
}
.logo-divider svg {
    width: 100%;
    height: auto;
    display: block;
}
.hero-lead {
    max-width: 680px;
    font-size: clamp(1.6rem, 5vw, 3rem);
    font-weight: 400;
    line-height: 1.4;
    color: var(--text-82);
}

/* ── SECȚIUNI ── */
.section {
    padding: clamp(60px, 8vw, 130px) clamp(24px, 8vw, 80px);
    max-width: 980px;
    margin: 0 auto;
}
.section-label {
    font-size: clamp(1rem, 1vw, 2rem);
    letter-spacing: 0.4em;
    color: var(--gold);
    text-transform: uppercase;
    margin-bottom: 1em;
    display: block;
    font-weight: 400;
}
.section h1,
.section h2 {
    font-style: italic;
    font-weight: 300;
    font-size: clamp(2.2rem, 5vw, 5rem);
    color: var(--gold-light);
    margin-bottom: 0.9em;
    line-height: 1.12;
}
.section h3 {
    margin-bottom: 0.5em;
    font-weight: 300;
    font-size: clamp(1.5rem, 3.8vw, 2.3rem);
    color: var(--gold-light);
    line-height: 1.2;
}
.section p,
ol {
    //list-style-position: inside;
    font-size: clamp(1.5rem, 3.8vw, 2.3rem);
    font-weight: 300;
    line-height: 1.3;
    color: var(--text-82);
    margin-bottom: 1em;
    hyphens: auto;
    hyphenate-limit-chars: 6 3 4; /* min cuvânt, min înainte, min după */
    hyphenate-limit-lines: 2;
    -webkit-hyphenate-limit-before: 3;
    -webkit-hyphenate-limit-after: 4;
    -webkit-hyphenate-limit-lines: 2;
}
ol {
    margin-top: 0;
    padding-left: 1em;
}
.section a,
.section a:link,
.section a:visited {
    color: var(--gold);
    text-underline-offset: 0.2em;
    text-decoration-thickness: from-font;
    transition: color 0.25s;
}
.section a:hover {
    color: var(--gold-light);
}

/* ── CARDS ── */
.cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 28px;
    padding: 0 clamp(24px, 8vw, 80px) clamp(60px, 8vw, 110px);
    max-width: 980px;
    margin: 0 auto;
    align-items: stretch;
}
.card {
    perspective: 1000px;
    background: transparent;
    border: none;
    display: flex;
    min-height: 380px;
    overflow: visible;
}
.card-inner {
    position: relative;
    width: 100%;
    transform-style: preserve-3d;
    transition: transform 0.6s ease;
    overflow: visible;
}
.card.flipped .card-inner {
    transform: rotateY(180deg);
}
.card-front,
.card-back {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border: 1px solid var(--border);
    padding: clamp(28px, 4vw, 44px) clamp(24px, 3vw, 36px);
    background: var(--card-bg);
    transition:
        border-color 0.3s,
        background 0.3s;
    overflow: visible;
    display: flex;
    flex-direction: column;
}
.card-back {
    transform: rotateY(180deg);
    border-color: var(--border-back);
    background: var(--card-back-bg);
}
.card:hover .card-front,
.card:hover .card-back {
    border-color: var(--border-hover);
}
.card-bar {
    width: 28px;
    height: 1px;
    background: var(--gold);
    margin-bottom: 1.4em;
}
.card h3 {
    font-size: clamp(0.8rem, 1.3vw, 1rem);
    letter-spacing: 0.18em;
    color: var(--gold-light);
    margin-bottom: 0.75em;
    text-transform: uppercase;
}
.card p {
    font-size: clamp(1rem, 4vw, 1.3rem);
    line-height: 1.4;
    color: var(--text);
    hyphens: auto;
    hyphenate-limit-chars: 6 3 4; /* min cuvânt, min înainte, min după */
    hyphenate-limit-lines: 2;
}
.card .card-hint {
    color: var(--gold);
    margin-top: auto;
}
.card-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    min-height: 280px;
    padding: clamp(28px, 4vw, 44px) clamp(24px, 3vw, 36px);
    border: 1px solid var(--border);
    background: var(--card-bg);
    transition:
        border-color 0.3s,
        background 0.3s;
}
.card-link:hover {
    border-color: var(--border-hover);
    background: var(--card-back-bg);
}
.card-link .card-bar {
    width: 28px;
    height: 1px;
    background: var(--gold);
    margin-bottom: 1.4em;
    flex-shrink: 0;
}
.card-link h3 {
    font-size: clamp(0.8rem, 1.3vw, 1rem);
    letter-spacing: 0.18em;
    color: var(--gold-light);
    margin-bottom: 0.75em;
    text-transform: uppercase;
}
.card-link p {
    font-size: clamp(1rem, 4vw, 1.3rem);
    line-height: 1.4;
    color: var(--text);
}
.card-link .card-hint {
    margin-top: auto;
    padding-top: 1.2em;
    color: var(--gold);
    font-size: clamp(1rem, 1.3vw, 1.3rem);
}
@media (hover: hover) {
    .card:hover .card-inner {
        transform: rotateY(180deg);
    }
}

/* ── CARD DIACRITICE ── */
.diac-wrap {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: visible;
    padding-bottom: 1.5rem;
}
.diac-act {
    font-family: "Times New Roman", serif;
    font-size: clamp(0.9rem, 1.2vw, 1.05rem);
    color: var(--text);
    position: relative;
    z-index: 1;
    user-select: none;
    overflow: visible;
}
.diac-w {
    color: rgba(220, 80, 80, 0.9);
}
.diac-c {
    color: rgba(29, 158, 117, 0.9);
}
.diac-canvas {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 50;
    display: none;
}
.diac-preview {
    height: 40px;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    border-top: 0.5px solid var(--border-diac);
    padding-top: 0.5rem;
    margin-top: 0.4rem;
}
.diac-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    background: rgba(220, 80, 80, 0.9);
    transition: background 0.4s;
}
.diac-info {
    font-family: "Times New Roman", serif;
    font-size: clamp(0.9rem, 1.2vw, 1.05rem);
    color: var(--text);
}
.diac-info strong {
    color: var(--gold-light);
    font-weight: 400;
}

/* ── SEPARATOR ── */
.hr-gold {
    border: none;
    width: 1px;
    height: 56px;
    background: linear-gradient(
        to bottom,
        transparent,
        var(--gold),
        transparent
    );
    margin: 0 auto;
    display: block;
}

/* ── CONTACT (index) ── */
.contact {
    text-align: center;
    padding: clamp(60px, 8vw, 130px) clamp(24px, 8vw, 80px)
        clamp(80px, 10vw, 150px);
}
.contact h2 {
    font-style: italic;
    font-weight: 300;
    font-size: clamp(2.2rem, 5vw, 3.8rem);
    color: var(--gold-light);
    margin-bottom: 1em;
}
.cline {
    color: var(--gold-75);
    margin-bottom: 0.6em;
}
a.cta {
    display: inline-block;
    margin-top: 2.5em;
    padding: 0.9em 3.2em;
    border: 1px solid var(--gold);
    color: var(--gold);
    font-size: clamp(0.78rem, 1.3vw, 0.95rem);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    text-decoration: none;
    transition:
        background 0.3s,
        color 0.3s;
}
a.cta:hover {
    background: var(--gold);
    color: var(--bg);
}

/* ── FOOTER ── */
footer {
    border-top: 1px solid var(--border-footer);
    padding: clamp(22px, 4vw, 40px) clamp(24px, 8vw, 80px);
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}
footer span {
    font-size: clamp(0.65rem, 1vw, 0.78rem);
    letter-spacing: 0.2em;
    color: var(--gold);
    text-transform: uppercase;
}

/* ── PAGINA CONTACT ── */
.contact-page {
    padding: clamp(80px, 10vw, 140px) clamp(24px, 8vw, 80px)
        clamp(60px, 8vw, 110px);
    max-width: 1400px;
    margin: 0 auto;
}
.contact-page h1,
.contact-page h2 {
    font-style: italic;
    font-weight: 300;
    font-size: clamp(2.2rem, 5vw, 4.5rem);
    color: var(--gold-light);
    margin-bottom: 0.25em;
    line-height: 1.1;
}
.contact-page .section-label {
    margin-bottom: 0.6em;
}
.contact-page p {
    font-size: clamp(1.5rem, 1.2vw, 3rem);
    font-weight: 300;
    line-height: 1.6;
    color: var(--text);
    margin-bottom: 0.6em;
}
.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 5vw, 72px);
    margin-top: clamp(48px, 6vw, 80px);
    align-items: start;
}
.contact-info {
    display: flex;
    flex-direction: column;
    gap: 2em;
}
.contact-block-label {
    font-size: clamp(1.2rem, 1.2vw, 2rem);
    letter-spacing: 0.2em;
    color: var(--gold);
    text-transform: uppercase;
    margin-bottom: 0.55em;
    display: block;
}
.contact-block-value {
    font-weight: 300;
    color: var(--text);
    line-height: 1.6;
    text-decoration: none;
    display: block;
    transition: color 0.2s;
}
a.contact-block-value:hover,
.contact-link:hover {
    color: var(--gold-light);
}
.contact-link {
    color: var(--gold);
}
.contact-block-bar {
    width: 28px;
    height: 1px;
    background: var(--gold);
    margin-bottom: 1.2em;
    opacity: 0.6;
}

/* ── FORMULAR DE CONTACT ── */
.contact-form-wrap {
    position: relative;
}
.contact-form-wrap form {
    display: flex;
    flex-direction: column;
    gap: 1.2em;
}
.form-group {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
}
.form-group label {
    font-size: clamp(1rem, 0.7vw, 2rem);
    letter-spacing: 0.35em;
    color: var(--text);
    text-transform: uppercase;
}
.form-group input,
.form-group textarea {
    background: var(--input-bg);
    border: 1px solid var(--border);
    color: var(--text);
    font-family: inherit;
    font-size: clamp(2rem, 1.5vw, 5rem);
    font-weight: 300;
    padding: 0.7em 1em;
    outline: none;
    transition:
        border-color 0.25s,
        background 0.25s;
    width: 100%;
    border-radius: 0;
    -webkit-appearance: none;
}
.form-group input:focus,
.form-group textarea:focus {
    border-color: var(--gold);
    background: var(--input-bg-focus);
}
.form-group textarea {
    resize: vertical;
}
input::placeholder,
textarea::placeholder {
    color: color-mix(in srgb, var(--text) 50%, transparent);
}
.form-submit {
    font-family: inherit;
    display: inline-block;
    padding: 0.9em 3.2em;
    border: 1px solid var(--gold);
    color: var(--gold);
    font-size: clamp(0.78rem, 1vw, 0.95rem);
    letter-spacing: 0.3em;
    text-transform: uppercase;
    background: transparent;
    cursor: pointer;
    transition:
        background 0.3s,
        color 0.3s;
    align-self: flex-start;
    margin-top: 0.4em;
}
.form-submit:hover {
    background: var(--gold);
    color: var(--bg);
}
/* capcană anti-spam — ascunsă vizual, dar prezentă în DOM pentru roboți */
.hp-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.contact-page .form-notice {
    font-size: clamp(0.58rem, 0.65vw, 0.68rem);
    letter-spacing: 0.2em;
    color: var(--gold-35);
    text-transform: uppercase;
    margin-top: 0.5em;
}

/* ── OVERLAY EROARE ── */
.form-overlay {
    position: absolute;
    inset: 0;
    background: var(--overlay-bg);
    backdrop-filter: blur(3px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
}
.contact-page .form-overlay-text {
    font-size: clamp(2rem, 1.5vw, 5rem);
    font-weight: 300;
    color: var(--gold-light);
    text-align: center;
    padding: 2em;
    line-height: 1.6;
}

/* ── SCROLL HINT ── */
.scroll-hint {
    position: fixed;
    bottom: clamp(60px, 2vw, 80px);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0px;
    opacity: 0;
    transition: opacity 0.6s ease;
    z-index: 10;
    pointer-events: none;
}
.scroll-hint span {
    font-size: clamp(0.6rem, 0.7vw, 0.72rem);
    letter-spacing: 0.35em;
    color: var(--gold-75);
    text-transform: uppercase;
}
.scroll-hint svg {
    opacity: 0.6;
    animation: bounce 1.8s ease infinite;
}
.scroll-hint svg path {
    stroke: var(--gold);
}
@keyframes bounce {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(6px);
    }
}

/* ── HAMBURGER ── */
.nav-hamburger {
    display: none;
    flex-direction: column;
    gap: 5px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
    z-index: 101;
}
.nav-hamburger span {
    display: block;
    width: 24px;
    height: 1px;
    background: var(--gold);
}

/* ── FULLSCREEN MENU ── */
.nav-fullscreen {
    position: fixed;
    inset: 0;
    background: var(--fullscreen-bg);
    z-index: 200;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s ease;
    overflow: hidden;
}
.nav-fullscreen.open {
    opacity: 1;
    pointer-events: auto;
}
.nav-close {
    position: absolute;
    top: clamp(20px, 4vw, 40px);
    right: clamp(24px, 6vw, 80px);
    background: transparent;
    border: none;
    color: var(--gold);
    font-size: clamp(1.2rem, 2vw, 1.6rem);
    cursor: pointer;
    letter-spacing: 0.1em;
}
.nav-fullscreen-links {
    list-style: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2em;
}
.nav-fullscreen-links a {
    font-size: clamp(1.4rem, 4vw, 2.4rem);
    letter-spacing: 0.3em;
    color: var(--gold-75);
    text-transform: uppercase;
    text-decoration: none;
    transition: color 0.25s;
}
.nav-fullscreen-links a:hover {
    color: var(--gold-light);
}

/* ── THEME TOGGLE ── */
.theme-toggle {
    position: absolute;
    right: clamp(24px, 6vw, 80px);
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
    z-index: 101;
    color: var(--gold);
    display: flex;
    align-items: center;
    opacity: 0.6;
    transition: opacity 0.25s;
}
.theme-toggle:hover {
    opacity: 1;
}
.theme-toggle svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
}
.icon-sun {
    display: none;
}
.icon-moon {
    display: block;
}
[data-theme="light"] .icon-sun {
    display: block;
}
[data-theme="light"] .icon-moon {
    display: none;
}

/* ── ARTICOLE ── */
.article-list {
    display: flex;
    flex-direction: column;
}
.article-card {
    padding: clamp(20px, 3vw, 40px) 0;
}
.article-meta {
    display: flex;
    align-items: center;
    gap: 1.2em;
    margin-bottom: 0.6em;
}
.article-meta time,
.article-meta span {
    font-size: clamp(0.62rem, 0.75vw, 0.78rem);
    letter-spacing: 0.3em;
    color: var(--gold);
    text-transform: uppercase;
}
.article-meta span {
    color: var(--gold-60);
}
.article-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.25s;
    margin-bottom: 0.4em;
    margin-top: 1.6em;
    font-weight: 300;
    font-size: clamp(1.5rem, 3.8vw, 2.3rem);
    color: var(--gold-light);
    line-height: 1.2;
}
.article-title a:hover {
    color: var(--gold-light);
}
.article-excerpt {
    font-size: clamp(1rem, 1.4vw, 1.2rem);
    line-height: 1.6;
    color: var(--text);
    margin-bottom: 1.2em;
}
.article-read-more {
    font-size: clamp(0.62rem, 0.75vw, 0.78rem);
    letter-spacing: 0.3em;
    color: var(--gold);
    text-transform: uppercase;
    text-decoration: none;
    transition: color 0.25s;
}
.article-read-more:hover {
    color: var(--gold-light);
}

/* ── ARTICOL ── */
.hero-article {
    min-height: 100vh;
}
.hero-article h1 {
    font-size: clamp(2.2rem, 5vw, 5rem);
    line-height: 1.1;
    max-width: 860px;
}
.hr-article {
    margin: clamp(40px, 6vw, 80px) auto;
}
.article-cta-wrap {
    margin-top: 1.5em;
    text-align: center;
}
.section-no-top {
    padding-top: 0;
}
.article-hero-meta {
    margin-top: 5em;
    font-size: clamp(0.65rem, 0.8vw, 0.8rem);
    letter-spacing: 0.3em;
    color: var(--gold-75);
    text-transform: uppercase;
}
.article-disclaimer {
    font-style: italic;
    color: var(--text);
    font-size: clamp(0.9rem, 1.2vw, 1rem);
    text-align: center;
}
h3.article-faq-q {
    margin-bottom: 0.4em;
    margin-top: 1.6em;
    font-weight: 300;
    font-size: clamp(1.5rem, 3.8vw, 2.3rem);
    color: var(--gold-light);
    line-height: 1.2;
}
.article-hero-lead {
    margin-top: 1em;
    line-height: 1.3;
}

/* ── CALCULATOR TAXE ── */
#calc-taxe {
    scroll-margin-top: 120px;
}
.calc-wrap {
    margin: 2em 0;
}
.calc-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
}
.calc-grid .calc-inputs,
.calc-grid .calc-output {
    margin-top: 0;
    padding-top: 0;
}
.calc-grid .calc-field:first-child {
    margin-top: 0;
}
.calc-grid .calc-output .calc-table {
    margin-top: 0;
}
.calc-grid .calc-field label {
    font-size: clamp(0.72rem, 0.85vw, 0.92rem);
    letter-spacing: 0.12em;
    white-space: nowrap;
}
.calc-grid .calc-field select,
.calc-grid .calc-field input {
    font-size: clamp(1.05rem, 1.3vw, 1.35rem);
    padding: 0.55em 1em;
}
.calc-grid .calc-table {
    font-size: clamp(1.05rem, 1.3vw, 1.35rem);
}
.calc-grid .calc-table th {
    font-size: clamp(0.72rem, 0.85vw, 0.92rem);
    letter-spacing: 0.12em;
    padding-top: 0;
    padding-bottom: 0.4em;
    vertical-align: top;
    line-height: 1.3;
    white-space: nowrap;
}
.calc-grid .calc-field label {
    line-height: 1.3;
}
.calc-field {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    margin-bottom: 0.6em;
}
.calc-field label {
    font-size: clamp(0.8rem, 0.8vw, 2rem);
    letter-spacing: 0.35em;
    color: var(--gold);
    text-transform: uppercase;
}
.calc-field input,
.calc-field select {
    background: var(--input-bg);
    border: 1px solid var(--border);
    color: var(--text);
    font-family: inherit;
    font-size: clamp(1rem, 1.5vw, 5rem);
    font-weight: 300;
    padding: 0.7em 1em;
    outline: none;
    transition:
        border-color 0.25s,
        background 0.25s;
    width: 100%;
    border-radius: 0;
    -webkit-appearance: none;
}
.calc-field select {
    appearance: none;
    -webkit-appearance: none;
    background-color: var(--input-bg);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23c9a84c' stroke-width='1.2' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1em center;
    padding-right: 3em;
}
.calc-field select:focus {
    background-color: var(--input-bg-focus);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23c9a84c' stroke-width='1.2' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1em center;
}
.calc-table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em 0 1em;
    font-size: clamp(1rem, 1.5vw, 2rem);
    font-weight: 300;
}
.calc-table th,
.calc-table td {
    text-align: left;
    padding: 0.7em 0.5em;
    border-bottom: 1px solid var(--border);
}
.calc-table th {
    font-size: clamp(0.6rem, 0.8vw, 2rem);
    letter-spacing: 0.35em;
    color: var(--gold);
    text-transform: uppercase;
    /* font-weight: 600; */
}
.calc-table td:not(:first-child),
.calc-table th:not(:first-child) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.calc-table .calc-total td {
    color: var(--gold-light);
    border-bottom: none;
    border-top: 1px solid var(--border-hover);
    padding-top: 0.9em;
}
.section .calc-note {
    font-size: clamp(0.85rem, 1vw, 1rem);
    line-height: 1.6;
}
.section .calc-note-italic {
    font-style: italic;
}
.calc-disclaimer {
    font-style: italic;
    margin-top: 1em;
}

/* pentru succesiuni */

.frac {
    font-feature-settings: "frac" 1;
}

.mostenitori-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
}

#ghid .calc-field label {
    font-size: clamp(0.7rem, 0.9vw, 0.9rem);
    letter-spacing: 0.25em;
}
#ghid .calc-field select {
    font-size: clamp(0.95rem, 1.1vw, 1.2rem);
    padding: 0.55em 1em;
}

#concluzie h3 {
    font-size: clamp(1.15rem, 1.6vw, 1.6rem);
}
#concluzie p {
    font-size: clamp(1.15rem, 1.8vw, 1.6rem);
}

/* ── BARĂ DE ANUNȚ ── */
/* ── RESPONSIVE ── */
@media (max-width: 768px) {
    .contact-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 640px) {
    .nav-brand {
        display: none;
    }
    .cards {
        grid-template-columns: 1fr;
    }
    .nav-links {
        display: none;
    }
    .nav-hamburger {
        display: flex;
    }
    footer {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .scroll-hint {
        position: fixed;
        bottom: clamp(20px, 6vh, 10px);
    }
}
@media (max-width: 720px) {
    .mostenitori-grid {
        grid-template-columns: 1fr;
    }
    .calc-grid {
        grid-template-columns: 1fr;
    }
}