:root {
    --noapte: #4A1624;
    --noapte-adanc: #361018;
    --pergament: #F8F1E7;
    --pergament-2: #EFE4D1;
    --alb-cald: #FFF9F0;
    --chihlimbar: #E9A536;
    --bordo: #7E2D40;
    --aramiu: #B86A3D;
    --salvie: #8FA08B;
    --carbune: #2B2B33;
    --rosu-ie: #C92A2A;
}

/* RESET */
* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: "Alegreya Sans", sans-serif;
    background: var(--pergament);
    color: var(--carbune);
}

h1,
h2,
h3 {
    font-family: "Fraunces", serif;
    line-height: 1.12;
    margin: 0 0 18px;
}

a {
    color: inherit;
}

/* GLOBAL LAYOUT */
.container {
    width: min(1120px, calc(100% - 48px));
    margin-left: auto;
    margin-right: auto;
}

.section {
    padding-top: 86px;
    padding-bottom: 86px;
}

.section-title {
    margin-bottom: 42px;
}

.section-title--center {
    text-align: center;
}

.eyebrow {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--chihlimbar);
    margin: 0 0 22px;
}

.eyebrow--aramiu {
    color: var(--aramiu);
}

.cusatura-titlu {
    width: 96px;
    height: 18px;
    margin-top: 14px;
    margin-bottom: 0;
    display: block;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='18' viewBox='0 0 96 18'%3E%3Cg fill='none' stroke-linecap='round' stroke-width='2.6'%3E%3Cpath stroke='%23C92A2A' d='M2 3L10 11M10 3L2 11'/%3E%3Cpath stroke='%232B2B33' d='M18 3L26 11M26 3L18 11'/%3E%3Cpath stroke='%23C92A2A' d='M34 3L42 11M42 3L34 11'/%3E%3Cpath stroke='%232B2B33' d='M50 3L58 11M58 3L50 11'/%3E%3Cpath stroke='%23C92A2A' d='M66 3L74 11M74 3L66 11'/%3E%3Cpath stroke='%232B2B33' d='M82 3L90 11M90 3L82 11'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 96px 18px;
}

.section-title--center .cusatura-titlu {
    margin-left: auto;
    margin-right: auto;
}

/* HEADER */
.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: var(--noapte);
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.header-bar {
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo-img {
    height: 72px;
    width: auto;
    display: block;
}

.nav-logo {
    line-height: 0;
}

.nav-links {
    list-style: none;
    display: flex;
    gap: 34px;
    margin: 0;
    padding: 0;
}

.nav-links a {
    text-decoration: none;
    color: var(--pergament);
    font-weight: 700;
    font-size: 16px;
}

.nav-links a:hover {
    color: var(--chihlimbar);
}

/* BRODERIE BORDER */
.motif-border,
.broderie {
    height: 48px;
    width: 100%;
    background-color: var(--alb-cald);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60' viewBox='0 0 120 60'%3E%3Cg fill='none' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath stroke='%232B2B33' d='M2 24L10 32M10 24L2 32M14 18L22 26M22 18L14 26M26 12L34 20M34 12L26 20M38 6L46 14M46 6L38 14M50 0L58 8M58 0L50 8M62 0L70 8M70 0L62 8M74 6L82 14M82 6L74 14M86 12L94 20M94 12L86 20M98 18L106 26M106 18L98 26M110 24L118 32M118 24L110 32M2 28L10 36M10 28L2 36M14 34L22 42M22 34L14 42M26 40L34 48M34 40L26 48M38 46L46 54M46 46L38 54M50 52L58 60M58 52L50 60M62 52L70 60M70 52L62 60M74 46L82 54M82 46L74 54M86 40L94 48M94 40L86 48M98 34L106 42M106 34L98 42M110 28L118 36M118 28L110 36'/%3E%3Cpath stroke='%23C92A2A' d='M56 26L64 34M64 26L56 34M56 14L64 22M64 14L56 22M56 38L64 46M64 38L56 46M44 26L52 34M52 26L44 34M68 26L76 34M76 26L68 34M48 18L56 26M56 18L48 26M64 18L72 26M72 18L64 26M48 34L56 42M56 34L48 42M64 34L72 42M72 34L64 42M-4 26L4 34M4 26L-4 34M4 18L12 26M12 18L4 26M4 34L12 42M12 34L4 42M116 26L124 34M124 26L116 34M108 18L116 26M116 18L108 26M108 34L116 42M116 34L108 42'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: repeat-x;
    background-position: center;
    background-size: 96px 48px;
    border-top: 2px solid var(--pergament-2);
    border-bottom: 2px solid var(--pergament-2);
}

/* HERO */
.hero {
    background: var(--noapte);
    color: var(--pergament);
    padding-bottom: 76px;
}

.hero-banner {
    background: var(--noapte);
    padding: 18px 0 0;
    text-align: center;
}

.hero-banner img {
    width: 100%;
    height: auto;
    max-height: 310px;
    object-fit: contain;
    object-position: center;
    display: block;
}

.hero-grid {
    padding-top: 70px;
    display: grid;
    grid-template-columns: 1fr 390px;
    gap: 95px;
    align-items: center;
}

.hero h1 {
    font-size: clamp(46px, 5vw, 68px);
    color: var(--alb-cald);
}

.hero h1 em {
    color: var(--chihlimbar);
    font-style: italic;
}

.hero .sub {
    max-width: 620px;
    font-size: 21px;
    line-height: 1.65;
    margin: 0 0 34px;
}

.hero-butoane {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
}

.hero-photo-frame,
.povestea-foto-frame {
    position: relative;
    padding: 12px;
    border-radius: 26px;
    background: rgba(54, 16, 24, .75);
}

.hero-photo-frame {
    border: 4px solid #B87A35;
    box-shadow: 0 0 0 14px rgba(126, 45, 64, .25);
}

.hero-photo-frame::before,
.povestea-foto-frame::before {
    content: "";
    position: absolute;
    inset: 16px;
    border: 1.5px dashed rgba(255, 249, 240, .55);
    border-radius: 18px;
    pointer-events: none;
}

.hero-photo {
    width: 100%;
    height: 420px;
    object-fit: cover;
    border-radius: 18px;
    display: block;
}

/* BUTTONS */
.btn,
.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
}

.btn {
    padding: 17px 34px;
    font-size: 17px;
}

.btn-amber {
    background: var(--chihlimbar);
    color: var(--noapte-adanc);
    box-shadow: 0 10px 28px rgba(233, 165, 54, .35);
}

.btn-ghost {
    border: 2px solid rgba(255, 249, 240, .55);
    color: var(--alb-cald);
}

.btn-secondary {
    margin-top: 42px;
    padding: 14px 28px;
    border: 2px solid var(--noapte);
    color: var(--noapte);
    font-size: 16px;
}

.btn-secondary:hover {
    background: var(--noapte);
    color: var(--alb-cald);
}

/* QUOTE */
.hero2 {
    background: var(--alb-cald);
}

.hero2-quote {
    max-width: 980px;
    margin: 0 auto;
    padding: 78px 24px 86px;
    text-align: center;
    font-family: "Fraunces", serif;
    font-size: clamp(28px, 3vw, 40px);
    line-height: 1.55;
    color: var(--noapte);
}

.q-italic {
    font-style: italic;
}

.q-bold {
    font-weight: 700;
    color: var(--bordo);
}

/* NEWS */
.ultimile-stiri {
    background: var(--pergament-2);
}

.ultimile-stiri h1 {
    color: var(--noapte);
    font-size: clamp(38px, 4vw, 52px);
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.card {
    background: var(--alb-cald);
    border: 1px solid rgba(74, 22, 36, .12);
    border-radius: 14px;
    padding: 30px 28px;
    min-height: 190px;
}

.card h3 {
    color: var(--noapte);
    font-size: 23px;
}

.card p {
    color: var(--carbune);
    font-size: 17px;
    line-height: 1.55;
}

.badge {
    display: inline-block;
    padding: 7px 15px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    color: var(--alb-cald);
}

.badge--salvie {
    background: var(--salvie);
}

.badge--bordo {
    background: var(--noapte);
}

.badge--aramiu {
    background: var(--aramiu);
}

/* PROMISIUNI */
.promisiuni {
    background: var(--noapte);
    color: var(--alb-cald);
}

.promisiuni h1 {
    font-size: clamp(38px, 4vw, 52px);
    max-width: 850px;
}

.promisiuni-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 34px;
    margin-top: 46px;
}

.promisiune {
    border-top: 3px solid var(--chihlimbar);
    padding-top: 24px;
}

.promisiune:nth-child(2) {
    border-top-color: var(--salvie);
}

.promisiune:nth-child(3) {
    border-top-color: var(--aramiu);
}

.promisiune h3 {
    color: var(--alb-cald);
    font-size: 27px;
}

/* POVESTEA MEA */
.povestea-mea {
    background: var(--pergament);
}

.povestea-mea-grid {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 72px;
    align-items: center;
}

.povestea-foto-frame {
    border-radius: 18px;
    background: var(--noapte);
}

.povestea-foto {
    width: 100%;
    height: 520px;
    object-fit: cover;
    border-radius: 14px;
    display: block;
}

.povestea-mea h2 {
    font-family: "Alegreya Sans", sans-serif;
    color: var(--aramiu);
    letter-spacing: .28em;
    font-size: 15px;
    font-weight: 700;
}

.povestea-mea h1 {
    color: var(--noapte);
    font-size: clamp(38px, 4vw, 50px);
}

.povestea-mea p {
    font-size: 20px;
    line-height: 1.75;
}

.povestea-mea strong {
    color: var(--bordo);
}

/* CREZ */
.crezul-meu {
    background: var(--alb-cald);
    text-align: center;
}

.crezul-meu .container {
    max-width: 820px;
}

.crezul-meu h4,
.followers h4 {
    color: var(--aramiu);
    letter-spacing: .32em;
    font-size: 13px;
    margin: 0 0 14px;
}

.crezul-meu h1 {
    color: var(--noapte);
    font-size: clamp(38px, 4vw, 52px);
}

.crez-list {
    list-style: none;
    padding: 0;
    margin: 38px auto 0;
}

.crez-list li {
    font-family: "Fraunces", serif;
    font-style: italic;
    font-size: 25px;
    line-height: 1.55;
    color: var(--noapte);
    margin-bottom: 24px;
}

.crez-list li::before {
    content: "× ";
    color: var(--chihlimbar);
    font-style: normal;
}

.crezul-meu h2 {
    color: var(--bordo);
    font-size: 27px;
    margin-top: 46px;
}

/* FOLLOWERS */
.followers {
    background: var(--pergament-2);
    text-align: center;
}

.followers-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 46px;
}

.stat-numar {
    font-family: "Fraunces", serif;
    font-size: 50px;
    font-weight: 700;
    color: var(--noapte);
    margin: 0 0 8px;
}

.stat p:last-child {
    max-width: 260px;
    margin: 0 auto;
    line-height: 1.5;
}

/* NEWSLETTER */
.aboneazate {
    background: var(--bordo);
    color: var(--alb-cald);
}

.aboneazate-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    align-items: center;
}

.aboneazate h2 {
    font-size: clamp(34px, 4vw, 48px);
    max-width: 560px;
}

.aboneazate .sub {
    max-width: 620px;
    font-size: 19px;
    line-height: 1.55;
}

.aboneazate-form {
    padding-top: 34px;
}

.ghid-form {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: nowrap;
}

.ghid-form input {
    width: 320px;
    padding: 15px 22px;
    border: none;
    border-radius: 999px;
    font-family: inherit;
}

.ghid-form button {
    border: none;
    cursor: pointer;
    white-space: nowrap;
}

.form-note {
    font-size: 14px;
    opacity: .9;
    margin-top: 12px;
}

@media (max-width: 900px) {
    .aboneazate-inner {
        grid-template-columns: 1fr;
        gap: 34px;
        text-align: center;
    }

    .ghid-form {
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* CHAT */
.chat-fab {
    position: fixed;
    right: 26px;
    bottom: 26px;
    width: 60px;
    height: 60px;
    background: var(--chihlimbar);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 28px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .32);
    z-index: 900;
}

/*==============================
            FOOTER
==============================*/

.footer {
    background: var(--noapte-adanc);
    color: var(--pergament);
    padding: 32px 0;
}

.footer-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
}

.footer-brand {
    font-family: "Fraunces", serif;
    font-size: 34px;
    font-weight: 700;
    white-space: nowrap;
}

.footer-brand span {
    color: var(--chihlimbar);
}

.footer-social {
    list-style: none;
    display: flex;
    gap: 34px;
    padding: 0;
    margin: 0;
}

.footer-social a {
    color: var(--chihlimbar);
    text-decoration: none;
    font-weight: 700;
    font-size: 18px;
    transition: .25s;
}

.footer-social a:hover {
    color: #ffd27b;
}

.footer-copy {
    font-size: 17px;
    color: rgba(255, 249, 240, .78);
    white-space: nowrap;
}

/*==============================
        MOBILE
==============================*/

@media (max-width: 900px) {

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 44px;
        padding-top: 44px;
    }

    .hero-photo-frame {
        max-width: 390px;
        margin: 0 auto;
    }

    .card-grid,
    .promisiuni-grid,
    .followers-grid {
        grid-template-columns: 1fr;
    }

    .povestea-mea-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .povestea-foto {
        height: 420px;
    }

    .header-bar {
        height: auto;
        flex-direction: column;
        gap: 10px;
        padding: 12px 0;
    }

    .nav-links {
        flex-wrap: wrap;
        justify-content: center;
        gap: 16px 22px;
    }

    .logo-img {
        height: 56px;
    }

    .section {
        padding-top: 56px;
        padding-bottom: 56px;
    }

    .footer-content {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }

    .footer-brand {
        font-size: 28px;
    }

    .footer-social {
        flex-wrap: wrap;
        justify-content: center;
        gap: 20px;
    }

    .footer-copy {
        white-space: normal;
    }
}

@media (max-width: 480px) {

    .ghid-form input {
        width: 100%;
    }

    .ghid-form button {
        width: 100%;
    }

    .hero-photo {
        height: 340px;
    }
}

/* MESAJE FORMULAR — în afara media query, se aplică peste tot */
.form-mesaj {
    margin-top: 14px;
    padding: 12px 20px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 15px;
    display: inline-block;
}

.form-mesaj--succes {
    background: var(--salvie);
    color: var(--alb-cald);
}

.form-mesaj--eroare {
    background: var(--chihlimbar);
    color: var(--noapte-adanc);
}

/*despre-mine*/
.despre-mine {
    background: var(--pergament-2);
}

.despre-mine h2 {
    color: var(--noapte);
    font-size: clamp(38px, 4vw, 52px);
}

.despre-CarlitaIanisTech {
    background: var(--bordo);
    color: var(--alb-cald);
}

.despre-CarlitaIanisTech-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    align-items: center
}

.despre-CarlitaIanisTech h2 {
    font-size: clamp(34px, 4vw, 48px);
    max-width: 560px;
}

.despre-CarlitaIanisTech .sub {
    max-width: 620px;
    font-size: 19px;
    line-height: 1.55;


}

/*===== CURSURI =====*/

/* Fundaluri alternate pe secțiuni */
.cursuri-programare {
    background: var(--pergament-2);
}

.securitate-cibernetica {
    background: var(--alb-cald);
}

.inteligenta-artificiala {
    background: var(--pergament);
}

/* Toggle "Vezi lecțiile" — ascundem săgeata default a lui details */
.curs-toggle::-webkit-details-marker {
    display: none;
}

.curs-toggle {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

/* Chevron — starea normală (închis) */
.chevron {
    display: inline-block;
    /* fără asta, transform nu funcționează */
    transition: transform 0.3s ease;
    /* rotație lină, nu bruscă */
}

/* Chevron — starea deschisă */
details[open] .chevron {
    transform: rotate(180deg);
    /* ▼ devine ▲ */
}

/* Rândul unei lecții în listă */
.lectie-rand {
    display: flex;
    justify-content: space-between;
    /* titlul la stânga, durata la dreapta */
    align-items: center;
    width: 100%;
    padding: 0.9rem 1.2rem;
    margin-top: 0.6rem;
    background: var(--alb-cald);
    border: 1px solid var(--pergament-2);
    border-radius: 8px;
    font-family: inherit;
    font-size: 1rem;
    cursor: pointer;
    text-align: left;
    transition: background 0.2s ease, transform 0.2s ease;
}

.lectie-rand:hover {
    background: var(--pergament);
    transform: translateX(4px);
    /* mică alunecare la hover — subtil, elegant */
}

.lectie-durata {
    opacity: 0.6;
    font-size: 0.9rem;
}

/*===== DIALOG LECȚIE =====*/

dialog {
    /* dialog e centrat automat de browser — noi doar îl îmbrăcăm frumos */
    width: min(90vw, 480px);
    /* max 480px, dar pe telefon 90% din ecran */
    max-height: 85vh;
    /* niciodată mai înalt de 85% din ecran */
    overflow-y: auto;
    /* dacă nu încape, apare scroll ÎN dialog */
    border: none;
    border-radius: 12px;
    padding: 1.5rem;
    background: var(--alb-cald);
    text-align: center;
    /* totul pe mijloc, cum ai vrut */
}

/* Fundalul întunecat din spatele dialogului */
dialog::backdrop {
    background: rgba(0, 0, 0, 0.55);
}

/* Videoclipul — vertical (Shorts), centrat, mai mare */
dialog iframe {
    width: 250px;
    aspect-ratio: 9 / 16;
    /* format vertical de Shorts */
    border: none;
    border-radius: 10px;
    display: block;
    margin: 0 auto 1rem;
    /* auto stânga-dreapta = centrat */
}

/* Details din dialog — săgeata rămâne lizibilă și centrat arată curat */
dialog details {
    margin: 0.6rem 0;
}

dialog summary {
    cursor: pointer;
    font-weight: 500;
}

/* Butonul Închide, centrat */
dialog form[method="dialog"] {
    margin-top: 1rem;
}

/*pentru telefon */
@media (max-width: 600px) {
    .lectie-rand {
        flex-direction: column;
        /* titlul sus, durata dedesubt */
        align-items: flex-start;
        gap: 0.3rem;
    }
}

/*===== ȘTIRI ===== */

/* Bara de filtre — orizontală, scroll lateral (ca YouTube) */
.stiri-filtre {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 10px;
    margin-bottom: 28px;
    scrollbar-width: thin;
}

.stiri-filtru {
    flex: 0 0 auto;
    /* nu se micșorează, stă pe o linie */
    padding: 8px 18px;
    border-radius: 999px;
    border: 1px solid var(--pergament-2);
    background: var(--alb-cald);
    color: var(--bordo);
    font-family: inherit;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s ease;
}

.stiri-filtru:hover {
    background: var(--pergament);
}

.stiri-filtru.activ {
    background: var(--chihlimbar);
    color: var(--noapte-adanc);
    border-color: var(--chihlimbar);
}

/* Grid-ul de carduri */
.stiri-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 24px;
}

/* Cardul unei știri (buton care deschide dialogul) */
.stire-card {
    display: flex;
    flex-direction: column;
    padding: 0;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
}

.stire-coperta {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 12px;
    display: block;
    transition: transform 0.2s ease;
}

.stire-card:hover .stire-coperta {
    transform: scale(1.02);
    /* mică mărire la hover, elegant */
}

.stire-info {
    padding: 10px 4px 0;
}

.stire-titlu {
    font-family: inherit;
    /* curat, ca la YouTube — nu Fraunces */
    font-size: 1rem;
    font-weight: 700;
    color: var(--noapte);
    margin: 0 0 4px;
    line-height: 1.3;
}

.stire-data {
    font-size: 0.85rem;
    color: var(--carbune);
    opacity: 0.65;
    margin: 0;
}

/* Dialog știre — video orizontal 16:9 (nu vertical ca la cursuri) */
.stire-dialog {
    width: min(92vw, 640px);
    text-align: left;
}

.stire-dialog iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    margin-bottom: 1rem;
}

/* ============================================================
   POVESTEA MEA  (versiune curată — tot CSS-ul stă aici, în style.css)
   ============================================================ */

:root {
    --pv-panel: #F6F0E2;
    /* panoul ferestrei */
    --pv-burgundy: #40121F;
    /* titluri închise */
    --pv-wine: #6E2537;
    --pv-aramiu: #B08A4A;
    --pv-rosu: #C0392B;
    --pv-text: #3A2B24;
    --pv-line: rgba(64, 18, 31, .15);
}

/* ---------- CUPRINS ---------- */
.cuprins-list {
    list-style: none;
    max-width: 600px;
    margin: 1.6rem auto 0;
    padding: 0;
}

.cuprins-list li+li {
    border-top: 1px dashed var(--pv-line);
}

.cuprins-list a {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    padding: .9rem .5rem;
    text-decoration: none;
    color: var(--pv-burgundy);
    transition: color .15s ease;
}

.cuprins-list a:hover {
    color: var(--pv-rosu);
}

.cuprins-num {
    font-family: 'Fraunces', serif;
    font-weight: 600;
    color: var(--pv-aramiu);
    min-width: 2em;
    font-size: 1.15rem;
}

/* ---------- FEREASTRA CU POVESTEA ---------- */
.poveste-cadru {
    width: min(760px, 92%);
    margin: 0 auto;
    background: var(--pv-panel);
    border-radius: 14px;
    padding: clamp(1.6rem, 4vw, 3.2rem);
    box-shadow:
        0 0 0 1px var(--pv-aramiu),
        0 0 0 7px var(--pv-panel),
        0 0 0 8px var(--pv-line),
        0 22px 50px rgba(64, 18, 31, .12);
}

/* rama foto de la începutul fiecărui capitol (se ascunde singură dacă poza lipsește) */
.cap-poza {
    max-width: 440px;
    margin: 0 auto 1.6rem;
    background: #fff;
    padding: .6rem;
    border: 1px solid var(--pv-aramiu);
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(64, 18, 31, .14);
}

.cap-poza img {
    width: 100%;
    display: block;
    border-radius: 4px;
}

.cap {
    scroll-margin-top: 90px;
}

.cap-eyebrow {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .3em;
    font-size: .74rem;
    font-weight: 700;
    color: var(--pv-aramiu);
    margin: 0 0 .4rem;
}

.cap-titlu {
    text-align: center;
    font-family: 'Fraunces', serif;
    font-weight: 600;
    font-size: clamp(1.7rem, 4vw, 2.3rem);
    line-height: 1.15;
    color: var(--pv-burgundy);
    margin: 0 0 1.6rem;
}

.cap-body {
    font-size: 1.16rem;
    line-height: 1.85;
    color: var(--pv-text);
}

.cap-body p {
    margin: 0 0 1.2rem;
}

.cap-body h3 {
    font-family: 'Fraunces', serif;
    font-weight: 600;
    font-size: 1.42rem;
    color: var(--pv-wine);
    margin: 2.4rem 0 1rem;
}

.cap-body h4 {
    font-family: 'Fraunces', serif;
    font-weight: 600;
    font-size: 1.18rem;
    color: var(--pv-aramiu);
    margin: 1.9rem 0 .7rem;
}

.cap-body strong {
    color: var(--pv-wine);
    font-weight: 700;
}

.cap-body em {
    font-style: italic;
}

/* inițială mare pe primul paragraf al poveștii */
.cap--first .cap-body>p:first-of-type::first-letter {
    font-family: 'Fraunces', serif;
    font-weight: 700;
    color: var(--pv-wine);
    float: left;
    font-size: 3.4rem;
    line-height: .82;
    padding: .3rem .5rem 0 0;
}

/* despărțitor între capitole (× × × × ×) */
.cap-divider {
    text-align: center;
    color: var(--pv-aramiu);
    letter-spacing: .55em;
    font-size: 1rem;
    margin: 3rem 0 2.4rem;
}

/* ---------- MULȚUMESC ---------- */
/* forțăm centrarea (anulează max-width:560px moștenit din .despre-CarlitaIanisTech) */
.multumesc-center {
    text-align: center;
}

#multumesc,
#multumesc .section-title,
#multumesc h2,
#multumesc .eyebrow,
#multumesc .cusatura-titlu,
#multumesc .sub {
    text-align: center;
}

#multumesc h2 {
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* semnătura caligrafică — auriu, ca să se vadă pe fundalul vișiniu */
.semnatura {
    font-family: 'Great Vibes', cursive;
    font-size: clamp(3.2rem, 9vw, 5rem);
    color: #E3C07E;
    line-height: 1;
    margin: 1rem 0 1.6rem;
    text-align: center;
}

/* butonul — auriu cu text închis, contrast clar pe vișiniu */
.btn-cursuri {
    display: inline-block;
    font-weight: 700;
    text-decoration: none;
    color: #3A1720;
    background: #CBA24A;
    padding: .9rem 1.9rem;
    border-radius: 999px;
    transition: background .15s ease, transform .15s ease;
}

.btn-cursuri:hover {
    background: #B98F3B;
    transform: translateY(-2px);
}
/* ==========================================================
ACASĂ — grila „Ce învățăm săptămâna aceasta" (cele mai noi 3)
3 pe rând pe desktop · unul sub altul pe mobil
 ========================================================== */
#acasa-noutati {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    align-items: start;
}

@media (max-width: 900px) {
    #acasa-noutati {
        grid-template-columns: 1fr;
    }
}

/* Cardurile de pe pagina de acasă — clic pentru video */
.card--clic {
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
}

.card--clic:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(74, 22, 36, .12);
}
/* ==========================================================
   IANIS — botul de întrebări (pagina principală)
   ========================================================== */
.ianis-panou {
    position: fixed;
    right: 26px;
    bottom: 96px;                 /* deasupra butonului rotund */
    width: min(360px, calc(100vw - 40px));
    max-height: 70vh;
    display: flex;
    flex-direction: column;
    background: var(--alb-cald);
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
    overflow: hidden;
    z-index: 950;
}

.ianis-panou[hidden] { display: none; }

.ianis-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: var(--noapte);
    color: var(--pergament);
    font-family: "Fraunces", serif;
    font-weight: 700;
    font-size: 18px;
}

.ianis-inchide {
    background: none;
    border: none;
    color: var(--pergament);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.ianis-mesaje {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ianis-bula {
    max-width: 85%;
    padding: 10px 14px;
    border-radius: 14px;
    font-size: 15px;
    line-height: 1.5;
}

.ianis-bula--bot {
    align-self: flex-start;
    background: var(--pergament-2);
    color: var(--carbune);
    border-bottom-left-radius: 4px;
}

.ianis-bula--user {
    align-self: flex-end;
    background: var(--chihlimbar);
    color: var(--noapte-adanc);
    border-bottom-right-radius: 4px;
}

.ianis-sugestii {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 16px 12px;
}

.ianis-chip {
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid var(--aramiu);
    background: var(--alb-cald);
    color: var(--bordo);
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background .2s ease;
}

.ianis-chip:hover { background: var(--pergament-2); }

.ianis-form {
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid var(--pergament-2);
}

.ianis-form input {
    flex: 1;
    padding: 11px 16px;
    border: 1px solid var(--pergament-2);
    border-radius: 999px;
    font-family: inherit;
    font-size: 15px;
}

.ianis-form button {
    border: none;
    background: var(--chihlimbar);
    color: var(--noapte-adanc);
    width: 44px;
    border-radius: 50%;
    font-size: 18px;
    cursor: pointer;
}
/* Butonul-link din răspunsul lui Ianis */
.ianis-link {
    display: inline-block;
    margin-top: 8px;
    padding: 8px 16px;
    background: var(--bordo);
    color: var(--alb-cald);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s ease;
}

.ianis-link:hover { background: var(--noapte); }