/*
 * Varianta nouă a paginii principale (`acasa-nou.php`). Prefix `an-`.
 *
 * Folosește tokenii din public.css (`--wlp-*`, `--primary-color`). O singură culoare pentru
 * acțiunea principală — verdele mărcii —, iar acțiunile secundare sunt linkuri simple.
 * O singură mișcare automată pe pagină: filmul din primul ecran. Restul animațiilor (liniile
 * tăiate, chitanța) rulează o dată, la intrarea în ecran, și dispar cu `prefers-reduced-motion`.
 */

/* ── Primul ecran ── */
.an-erou {
    padding: clamp(2.2rem, 1.4rem + 3.5vw, 4.5rem) 0 clamp(2rem, 1.4rem + 3vw, 4rem);
    background:
        radial-gradient(900px 420px at 20% -10%, rgba(18, 133, 79, .12), transparent 70%),
        var(--wlp-suprafata);
    border-bottom: 1px solid var(--wlp-bordura);
}
.an-erou-grila {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: clamp(1.5rem, 1rem + 2.5vw, 3.2rem);
    align-items: center;
}
.an-erou h1 { font-size: clamp(1.9rem, 1.3rem + 2.2vw, 2.9rem); margin-bottom: .5em; }
.an-erou-sub { font-size: clamp(1.02rem, .96rem + .3vw, 1.15rem); color: var(--wlp-titlu); margin: 0 0 .8rem; max-width: 52ch; }
.an-pentru { font-size: .88rem; color: var(--wlp-text-slab); margin: 0 0 1.5rem; }
.an-erou-actiuni { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.4rem; }

.an-scut {
    display: flex;
    gap: .55rem;
    align-items: flex-start;
    margin: 1.2rem 0 0;
    font-size: .9rem;
    color: var(--wlp-titlu);
    max-width: 52ch;
}
.an-scut i { color: var(--primary-color); margin-top: .2em; }

/* ── Cifrele reale ── */
.an-dovezi { padding: 1.4rem 0; background: var(--wlp-suprafata-2); border-bottom: 1px solid var(--wlp-bordura); }
.an-cifre {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .6rem clamp(1.2rem, .6rem + 2.4vw, 2.8rem);
    margin: 0;
    padding: 0;
    list-style: none;
}
.an-cifre li { display: flex; flex-direction: column; align-items: center; text-align: center; }
.an-cifre strong {
    font-size: clamp(1.35rem, 1.1rem + .9vw, 1.8rem);
    color: var(--wlp-titlu);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
}
.an-cifre span { font-size: .82rem; color: var(--wlp-text-slab); }
/* Text simplu centrat, nu flex: pe telefon flex-ul împărțea fraza în două coloane. */
.an-viu {
    text-align: center;
    margin: 1rem 0 0;
    font-size: .88rem;
    color: var(--wlp-text);
}
.an-punct {
    display: inline-block;
    vertical-align: middle;
    margin: -2px .45rem 0 0;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #18a35e;
    box-shadow: 0 0 0 0 rgba(24, 163, 94, .5);
    animation: an-puls 2.4s ease-out infinite;
}
@keyframes an-puls {
    0%   { box-shadow: 0 0 0 0 rgba(24, 163, 94, .45); }
    70%  { box-shadow: 0 0 0 9px rgba(24, 163, 94, 0); }
    100% { box-shadow: 0 0 0 0 rgba(24, 163, 94, 0); }
}

/* ── Cât de viu e site-ul tău ── */
.an-viu-sectiune { padding-top: clamp(2.5rem, 1.6rem + 3vw, 4rem); }
.an-cutie {
    max-width: 760px;
    margin: 0 auto;
    padding: clamp(1.4rem, 1rem + 2vw, 2.4rem);
    background: var(--wlp-suprafata);
    border: 1px solid var(--wlp-bordura);
    border-radius: 18px;
    box-shadow: var(--wlp-umbra-ridicat);
}
.an-cutie-antet { text-align: center; margin-bottom: 1.3rem; }
.an-cutie-antet p { margin: 0 auto; max-width: 54ch; }
.an-test { display: flex; gap: .6rem; }
.an-test input {
    flex: 1;
    min-width: 0;
    padding: .85rem 1rem;
    font: inherit;
    font-size: 1.05rem;
    color: var(--wlp-titlu);
    border: 2px solid var(--wlp-bordura);
    border-radius: 12px;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}
.an-test input:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 0 4px rgba(18, 133, 79, .12); }
.an-test .wlp-buton { flex: 0 0 auto; }
.an-test .wlp-buton[disabled] { opacity: .7; cursor: progress; transform: none; }

.an-titluri {
    margin: 1.3rem 0 0;
    padding: 1rem 1.1rem;
    border-radius: 12px;
    background: var(--wlp-verde-slab);
    border: 1px solid rgba(18, 133, 79, .18);
}
.an-titluri p { margin: 0 0 .5rem; font-weight: 700; color: var(--wlp-titlu); }
.an-titluri ol { margin: 0; padding-left: 1.2rem; }
.an-titluri li { margin: .25rem 0; color: var(--wlp-titlu); }
.an-titluri small { display: block; margin-top: .5rem; color: var(--wlp-text-slab); }

.an-se-incarca { display: flex; align-items: center; gap: .6rem; color: var(--wlp-text); }
.an-se-incarca i { color: var(--primary-color); }

/* ── Cum NU facem noi ── */
.an-contra { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1.2rem; max-width: 900px; margin: 0 auto; }
.an-contra > div { padding: 1.4rem 1.5rem; border-radius: 16px; }
.an-contra h3 { font-size: 1rem; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 1rem; }
.an-contra-vechi { background: #fbf4f3; border: 1px solid #f1d9d6; }
.an-contra-vechi h3 { color: #9a3b33; }
.an-contra-vechi ol { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: .45rem; }
.an-contra-vechi li span {
    position: relative;
    display: inline-block;
    padding: .3rem .7rem;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #ecd3cf;
    color: #7a4a45;
    font-size: .9rem;
}
.an-contra-vechi li span::after {
    content: "";
    position: absolute;
    left: .5rem;
    right: .5rem;
    top: 50%;
    height: 2px;
    background: #c4483d;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s ease;
}
.an-contra-vechi.is-taiat li span::after { transform: scaleX(1); }
.an-contra-vechi.is-taiat li:nth-child(2) span::after { transition-delay: .12s; }
.an-contra-vechi.is-taiat li:nth-child(3) span::after { transition-delay: .24s; }
.an-contra-vechi.is-taiat li:nth-child(4) span::after { transition-delay: .36s; }
.an-contra-vechi.is-taiat li:nth-child(5) span::after { transition-delay: .48s; }
.an-contra-vechi.is-taiat li:nth-child(6) span::after { transition-delay: .6s; }
.an-contra-vechi.is-taiat li:nth-child(7) span::after { transition-delay: .72s; }
.an-contra-nou {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: var(--wlp-verde-slab);
    border: 1px solid rgba(18, 133, 79, .22);
}
.an-contra-nou h3 { color: var(--wlp-verde-pe-tenta); }
.an-pas {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
    margin: 0;
    padding: .8rem 1rem;
    border-radius: 12px;
    background: #fff;
    color: var(--wlp-titlu);
    font-weight: 600;
    border: 1px solid rgba(18, 133, 79, .2);
}
.an-pas i { color: var(--primary-color); margin-top: .2em; }
.an-pas--gata { border-color: var(--primary-color); box-shadow: 0 6px 18px rgba(18, 133, 79, .14); }
.an-sageata { display: block; text-align: center; margin: .5rem 0; color: var(--primary-color); }

/* ── Luni, 08:10 ── */
.an-scena { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(1.5rem, 1rem + 3vw, 4rem); align-items: center; }
.an-ora { font-size: clamp(2.4rem, 1.8rem + 2.4vw, 3.6rem); font-weight: 800; color: var(--wlp-titlu); letter-spacing: -.03em; margin: 0 0 .4rem; line-height: 1; }
.an-poveste { font-size: clamp(1.08rem, 1rem + .4vw, 1.25rem); color: var(--wlp-titlu); margin: 0 0 1.4rem; max-width: 48ch; }
.an-telefon {
    justify-self: center;
    width: 270px;
    padding: 12px;
    border-radius: 36px;
    background: #1f2633;
    box-shadow: 0 30px 60px rgba(20, 30, 50, .22);
}
.an-telefon-ecran { min-height: 400px; padding: 1.4rem 1rem 1rem; border-radius: 26px; background: #f5f7fb; display: flex; flex-direction: column; gap: .7rem; }
.an-telefon-titlu { margin: 0 0 .2rem; font-weight: 700; color: var(--wlp-titlu); font-size: .95rem; }
.an-notif { padding: .75rem .8rem; border-radius: 14px; background: #fff; box-shadow: 0 2px 8px rgba(20, 30, 50, .07); }
.an-notif b { display: inline-block; padding: .1rem .5rem; border-radius: 6px; background: #12854f; color: #fff; font-size: .7rem; }
.an-notif span { margin-left: .4rem; font-size: .74rem; color: var(--wlp-text-slab); }
.an-notif p { margin: .4rem 0 0; font-size: .86rem; font-weight: 600; color: var(--wlp-titlu); line-height: 1.35; }

/* ── Chitanța ── */
.an-chitanta { position: relative; margin: 0 auto 1.6rem; max-width: 380px; transform: rotate(-1.6deg); }
.an-chitanta-hartie {
    position: relative;
    padding: 1.4rem 1.4rem 1.8rem;
    background: #fffdf7;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: .86rem;
    color: #2f3540;
    box-shadow: 0 18px 40px rgba(20, 30, 50, .14);
    /* Marginea de jos „ruptă": un zigzag din două degradeuri. */
    -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 10px) no-repeat,
        conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 16px 10px repeat-x;
            mask: linear-gradient(#000 0 0) top / 100% calc(100% - 10px) no-repeat,
        conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 16px 10px repeat-x;
}
.an-chitanta-antet { margin: 0 0 1rem; text-align: center; font-weight: 700; letter-spacing: .2em; border-bottom: 1px dashed #c9ccd2; padding-bottom: .8rem; }
.an-chitanta-antet small { letter-spacing: .05em; font-weight: 400; color: #6b7385; }
.an-chitanta ul { margin: 0; padding: 0; list-style: none; }
.an-chitanta li { display: flex; justify-content: space-between; gap: .8rem; padding: .32rem 0; }
.an-chitanta li span { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.an-chitanta li span::after { content: " ........................................"; color: #b8bcc4; }
.an-chitanta li b { white-space: nowrap; }
.an-chitanta-total { display: flex; justify-content: space-between; margin: .8rem 0 0; padding-top: .7rem; border-top: 1px dashed #c9ccd2; font-size: 1.05rem; font-weight: 800; }
.an-chitanta-subsol { margin: .8rem 0 0; text-align: center; color: #6b7385; font-size: .78rem; }
.an-stampila {
    position: absolute;
    /* Sub totaluri, peste rândul de subsol: pusă mai sus acoperea suma. */
    right: -10px;
    bottom: -26px;
    padding: .45rem .7rem;
    border: 3px solid #c4362b;
    border-radius: 8px;
    color: #c4362b;
    background: rgba(255, 253, 247, .85);
    font-weight: 800;
    font-size: .78rem;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
    transform: rotate(-11deg);
    mix-blend-mode: multiply;
}
.an-stampila b { font-size: 1.25rem; }
/* La intrarea în ecran: rândurile „se tipăresc", apoi cade ștampila. O singură dată. */
.an-chitanta.is-anim li, .an-chitanta.is-anim .an-chitanta-total { opacity: 0; transform: translateY(-4px); }
.an-chitanta.is-anim .an-stampila { opacity: 0; transform: rotate(-11deg) scale(1.6); }
.an-chitanta.is-tiparit li, .an-chitanta.is-tiparit .an-chitanta-total { opacity: 1; transform: none; transition: opacity .25s, transform .25s; }
.an-chitanta.is-tiparit li:nth-child(2) { transition-delay: .15s; }
.an-chitanta.is-tiparit li:nth-child(3) { transition-delay: .3s; }
.an-chitanta.is-tiparit li:nth-child(4) { transition-delay: .45s; }
.an-chitanta.is-tiparit li:nth-child(5) { transition-delay: .6s; }
.an-chitanta.is-tiparit .an-chitanta-total { transition-delay: .8s; }
.an-chitanta.is-tiparit .an-stampila { opacity: 1; transform: rotate(-11deg) scale(1); transition: opacity .2s 1.15s, transform .25s cubic-bezier(.5, 1.8, .6, 1) 1.15s; }

/* ── Advertoriale ── */
.an-advert { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 3vw, 4rem); align-items: center; }
.an-advert-text .an-scut { margin-bottom: .6rem; }
.an-mic { font-size: .85rem; color: var(--wlp-text-slab); margin: 0 0 1.4rem; }
.an-advert-bife li { margin-bottom: .7rem; }

/* ── Ce gândești acum ── */
.an-bule { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; max-width: 900px; margin: 0 auto; }
.an-bula { flex: 0 1 auto; max-width: 100%; }
.an-bula-gand {
    padding: .75rem 1.15rem;
    border: 1px solid var(--wlp-bordura);
    border-radius: 22px 22px 22px 6px;
    background: var(--wlp-suprafata);
    color: var(--wlp-titlu);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    box-shadow: var(--wlp-umbra);
    transition: border-color .15s, background .15s, transform .15s;
}
.an-bula-gand:hover { border-color: var(--primary-color); transform: translateY(-1px); }
.an-bula-gand[aria-expanded="true"] { background: var(--wlp-verde-slab); border-color: var(--primary-color); }
.an-bula-raspuns {
    margin: .5rem 0 0;
    padding: .8rem 1rem;
    max-width: 420px;
    border-radius: 6px 18px 18px 18px;
    background: var(--primary-color);
    color: #fff;
    font-size: .95rem;
    line-height: 1.45;
}

/* ── Bara fixă de pe telefon ── */
.an-bara {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    padding: .6rem 16px calc(.6rem + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .96);
    border-top: 1px solid var(--wlp-bordura);
    box-shadow: 0 -6px 20px rgba(20, 30, 50, .08);
    transform: translateY(110%);
    transition: transform .25s ease;
}
.an-bara.is-vizibila { transform: none; }
.an-bara .wlp-buton { width: 100%; justify-content: center; }
.an-bara small { font-weight: 500; opacity: .85; margin-left: .35rem; }
@media (min-width: 761px) {
    .an-bara { display: none !important; }
}

/* ── Telefon ── */
@media (max-width: 900px) {
    .an-erou-grila, .an-scena, .an-advert { grid-template-columns: minmax(0, 1fr); }
    .an-contra { grid-template-columns: minmax(0, 1fr); }
    .an-erou-text { text-align: center; }
    .an-erou-sub, .an-scut { margin-left: auto; margin-right: auto; }
    .an-erou-actiuni { justify-content: center; }
    .an-scut { text-align: left; }
}
@media (max-width: 620px) {
    /* Pe telefon, primul ecran se termina clar: mai mult aer dedesubt, o umbra la margine si o banda
       de cifre pe alt fond. Altfel cardurile cu cifre pareau inca o bucata din primul ecran. */
    .an-erou { position: relative; z-index: 1; padding-bottom: 3rem; box-shadow: 0 14px 28px -22px rgba(20, 30, 50, .35); }
    .an-dovezi { padding: 2.4rem 0 2.2rem; background: #edf3f0; }
    .an-test { flex-direction: column; }
    .an-test .wlp-buton { width: 100%; justify-content: center; }
    .an-erou-actiuni .wlp-buton { width: 100%; justify-content: center; }
    .an-telefon { width: 240px; }
    .an-telefon-ecran { min-height: 340px; }
    .an-chitanta { max-width: 330px; }
    .an-stampila { right: 0; }
    .an-pentru { font-size: .82rem; }
}

@media (prefers-reduced-motion: reduce) {
    .an-punct { animation: none; }
    .an-contra-vechi li span::after { transition: none; }
    .an-chitanta.is-anim li, .an-chitanta.is-anim .an-chitanta-total, .an-chitanta.is-anim .an-stampila { opacity: 1; transform: none; }
    .an-chitanta.is-anim .an-stampila { transform: rotate(-11deg); }
}

/* Pe telefon titlul curge liber: ruptura forțată lăsa un cuvânt singur pe rând („lei."). */
@media (max-width: 620px) {
    .an-erou h1 br { display: none; }
}

.an-ingust { max-width: 820px; }
.an-nota-mica { max-width: 720px; margin: 1.6rem auto 0; text-align: center; font-size: .92rem; color: var(--wlp-text); }

/* Garanțiile de sub buton: fapte scurte, nu sloganuri. */
.an-garantii { list-style: none; margin: 1.4rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.an-garantii li { display: flex; gap: .55rem; align-items: baseline; font-size: .92rem; color: var(--wlp-titlu); }
.an-garantii i { color: var(--primary-color); font-size: .8rem; }

/* Articolul real din primul ecran: static, clar, se încarcă instant. */
.an-articol {
    margin: 0;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--wlp-bordura);
    box-shadow: 0 2px 6px rgba(20, 30, 50, .06), 0 24px 60px rgba(18, 133, 79, .14);
}
.an-browser-bara { display: flex; align-items: center; gap: 6px; padding: 9px 12px; background: #f3f5f8; border-bottom: 1px solid var(--wlp-bordura); }
.an-browser-bara i { width: 10px; height: 10px; border-radius: 50%; background: #d7dce3; }
.an-browser-bara i:nth-child(1) { background: #f2a3a0; }
.an-browser-bara i:nth-child(2) { background: #f3d08a; }
.an-browser-bara i:nth-child(3) { background: #9fd7b2; }
.an-browser-bara span { margin-left: 10px; padding: 3px 10px; border-radius: 6px; background: #fff; font-size: .74rem; color: var(--wlp-text-slab); }
.an-articol img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; max-height: 280px; }
.an-articol-corp { padding: 1.1rem 1.3rem .4rem; }
.an-articol-tip { margin: 0 0 .35rem; font-size: .74rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--wlp-verde-pe-tenta); }
.an-articol-titlu { margin: 0 0 .5rem; font-size: 1.22rem; font-weight: 800; line-height: 1.3; color: var(--wlp-titlu); }
.an-articol-text {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: .98rem;
    line-height: 1.6;
    color: #3a4252;
    -webkit-mask: linear-gradient(#000 60%, transparent);
            mask: linear-gradient(#000 60%, transparent);
}
.an-articol figcaption { padding: .7rem 1.3rem .9rem; font-size: .8rem; color: var(--wlp-text-slab); border-top: 1px solid var(--wlp-bordura); background: var(--wlp-suprafata-2); }

/* Exemplele reale. */
.an-exemple { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.3rem; }
.an-exemplu { display: flex; flex-direction: column; background: var(--wlp-suprafata); border: 1px solid var(--wlp-bordura); border-radius: 16px; overflow: hidden; box-shadow: var(--wlp-umbra); }
.an-exemplu img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.an-exemplu-corp { display: flex; flex-direction: column; flex: 1; padding: 1.1rem 1.2rem 1.2rem; }
.an-exemplu h3 { font-size: 1.06rem; line-height: 1.35; margin: 0 0 .55rem; }
.an-exemplu-corp > p:not([class]) { margin: 0 0 1rem; font-family: Georgia, "Times New Roman", serif; font-size: .95rem; line-height: 1.6; color: #3a4252; }
.an-exemplu-cum { margin: auto 0 0; padding-top: .8rem; border-top: 1px dashed var(--wlp-bordura); font-size: .84rem; color: var(--wlp-text); }
.an-exemplu-cum i { color: var(--primary-color); margin-right: .2rem; }

/* Pașii, ca text de citit, nu ca iconițe. */
.an-pasi { list-style: none; counter-reset: pas; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1.2rem; }
.an-pasi li { counter-increment: pas; position: relative; padding: 0 0 0 3.4rem; }
.an-pasi li::before {
    content: counter(pas);
    position: absolute;
    left: 0;
    top: -.1rem;
    width: 2.3rem;
    height: 2.3rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--wlp-verde-slab);
    color: var(--wlp-verde-pe-tenta);
    font-weight: 800;
}
.an-pasi h3 { margin: 0 0 .3rem; font-size: 1.1rem; }
.an-pasi p { margin: 0; }

/* Ce facem / ce nu facem. */
.an-doua { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; max-width: 900px; margin: 0 auto; }
.an-doua > div { padding: 1.3rem 1.5rem; border-radius: 16px; }
.an-doua h3 { display: flex; gap: .5rem; align-items: center; font-size: 1.05rem; margin: 0 0 .8rem; }
.an-doua ul { margin: 0; padding-left: 1.1rem; display: flex; flex-direction: column; gap: .45rem; }
.an-doua-da { background: var(--wlp-verde-slab); border: 1px solid rgba(18, 133, 79, .2); }
.an-doua-da h3 i { color: var(--primary-color); }
.an-doua-nu { background: #fbf6f5; border: 1px solid #f0dedb; }
.an-doua-nu h3 i { color: #b42318; }

/* De unde vin articolele. */
.an-surse { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 3vw, 3.5rem); align-items: center; }
.an-refuz { padding: 1.4rem 1.5rem; border-radius: 16px; background: var(--wlp-suprafata); border: 1px solid var(--wlp-bordura); box-shadow: var(--wlp-umbra); }
.an-refuz h3 { font-size: 1.05rem; margin: 0 0 .8rem; }
.an-refuz ul { list-style: none; margin: 0 0 .9rem; padding: 0; display: flex; flex-direction: column; gap: .55rem; }
.an-refuz li { display: flex; gap: .6rem; align-items: baseline; color: var(--wlp-titlu); }
.an-refuz li i { color: #b42318; font-size: .85rem; }
.an-refuz .an-mic { margin: 0; }

/* Cazul de client și firma. */

@media (max-width: 900px) {
    .an-exemple { grid-template-columns: minmax(0, 1fr); max-width: 520px; margin: 0 auto; }
    .an-doua, .an-surse { grid-template-columns: minmax(0, 1fr); }
    .an-garantii { align-items: center; }
    .an-garantii li { text-align: left; }
}
@media (max-width: 620px) {
    .an-articol img { max-height: 200px; }
    .an-pasi li { padding-left: 3rem; }
}

/* ════ v3: elementele vizuale înapoi, plus finisaje ════ */

/* Articolul din primul ecran, cu două etichete care plutesc pe colțuri. */
.an-articol-scena { position: relative; padding: 18px 10px 22px; }
.an-articol-scena::before {
    content: "";
    position: absolute;
    inset: 40px -20px -10px 40px;
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(18, 133, 79, .16), rgba(18, 133, 79, .02));
    z-index: 0;
}
.an-articol-scena .an-articol { position: relative; z-index: 1; }
.an-chip {
    position: absolute;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .9rem;
    border-radius: 999px;
    background: #fff;
    color: var(--wlp-titlu);
    font-size: .84rem;
    font-weight: 700;
    box-shadow: 0 10px 28px rgba(20, 30, 50, .16);
    white-space: nowrap;
}
.an-chip i { color: var(--primary-color); }
.an-chip--sus { top: 92px; left: -16px; }
.an-chip--jos { right: -12px; bottom: 0; }

/* Exemplele: tipul articolului ca etichetă pe imagine. */
.an-exemplu-poza { position: relative; }
.an-exemplu-eticheta {
    position: absolute;
    left: 12px;
    top: 12px;
    padding: .3rem .7rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    color: var(--wlp-verde-pe-tenta);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .02em;
    box-shadow: 0 4px 12px rgba(20, 30, 50, .12);
}
.an-exemplu { transition: transform .2s ease, box-shadow .2s ease; }
.an-exemplu:hover { transform: translateY(-3px); box-shadow: var(--wlp-umbra-ridicat); }

/* Pașii: o linie verticală leagă cercurile numerotate. */
.an-pasi { position: relative; }
.an-pasi::before {
    content: "";
    position: absolute;
    left: calc(1.15rem - 1px);
    top: 1.2rem;
    bottom: 1.6rem;
    width: 2px;
    background: linear-gradient(var(--primary-color), rgba(18, 133, 79, .15));
}
.an-pasi li::before { background: var(--primary-color); color: #fff; box-shadow: 0 0 0 5px var(--wlp-suprafata); }

/* Sfatul cu rolul de Editor. */
.an-sfat {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    max-width: 900px;
    margin: 1.2rem auto 0;
    padding: 1.1rem 1.4rem;
    border-radius: 16px;
    background: var(--wlp-suprafata);
    border: 1px solid var(--wlp-bordura);
}
.an-sfat i { flex: 0 0 auto; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 12px; background: var(--wlp-verde-slab); color: var(--primary-color); }
.an-sfat p { margin: 0; color: var(--wlp-titlu); }

/* Cazul de client: cifre mari pe fundal verde. */
.an-caz {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
    gap: clamp(1.2rem, 1rem + 2vw, 3rem);
    align-items: center;
    padding: clamp(1.6rem, 1.1rem + 2.5vw, 3rem);
    border-radius: 22px;
    background: var(--wlp-gradient);
    color: #fff;
    box-shadow: 0 24px 60px rgba(18, 133, 79, .25);
}
.an-caz h2 { color: #fff; margin-bottom: .5rem; }
.an-caz p { color: rgba(255, 255, 255, .9); margin: 0; }
.an-caz .wlp-eticheta-mica { background: rgba(255, 255, 255, .16); color: #fff; }
.an-caz-cifre { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.an-caz-cifre li { padding: 1.1rem 1rem; border-radius: 16px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .18); }
.an-caz-cifre strong { display: block; font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.an-caz-cifre span { display: block; margin-top: .2rem; font-size: .86rem; color: rgba(255, 255, 255, .88); line-height: 1.35; }

@media (max-width: 900px) {
    .an-caz { grid-template-columns: minmax(0, 1fr); text-align: center; }
    .an-articol-scena::before { inset: 30px -6px -6px 24px; }
    .an-chip--sus { left: 0; top: 70px; }
    .an-chip--jos { right: 0; }
}
@media (max-width: 620px) {
    .an-caz-cifre { grid-template-columns: minmax(0, 1fr); }
    .an-chip { font-size: .76rem; padding: .45rem .75rem; }
    .an-sfat { flex-direction: column; }
}

/* ════ v4: testul în primul ecran, puncte pe articol, capturi la pași, înainte/după ════ */

/* Un cuvânt în italic serif, în culoarea mărcii: titlul se ține minte după el. */
.an-erou h1 em, .wlp-acasa-nou .wlp-antet-sectiune h2 em, .an-caz h2 em {
    font-family: Georgia, "Times New Roman", serif;
    font-style: italic;
    font-weight: 600;
    color: var(--primary-color);
    letter-spacing: -.01em;
}

/* Testul din primul ecran: câmp mare cu butonul pe același rând. */
.an-test--erou {
    display: flex;
    gap: .5rem;
    padding: .45rem;
    margin-top: .4rem;
    border-radius: 16px;
    background: #fff;
    border: 2px solid rgba(18, 133, 79, .28);
    box-shadow: 0 14px 36px rgba(18, 133, 79, .14);
    max-width: 560px;
    transition: border-color .15s, box-shadow .15s;
}
.an-test--erou:focus-within { border-color: var(--primary-color); box-shadow: 0 0 0 5px rgba(18, 133, 79, .12), 0 14px 36px rgba(18, 133, 79, .16); }
.an-test-camp { flex: 1; min-width: 0; display: flex; align-items: center; gap: .55rem; padding-left: .7rem; }
.an-test-camp i { color: var(--wlp-text-slab); }
.an-test--erou input { flex: 1; min-width: 0; border: 0; padding: .7rem 0; box-shadow: none !important; font-size: 1.02rem; background: transparent; }
.an-test--erou input:focus { outline: none; }
.an-test--erou .wlp-buton { border-radius: 12px; }
.an-test-nota { margin: .8rem 0 0; font-size: .88rem; color: var(--wlp-text); max-width: 560px; }

/* Rândul de garanții, identic la fiecare buton. */
.an-asigurari { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; margin: 1.1rem 0 0; padding: 0; }
.an-asigurari li { display: inline-flex; align-items: center; gap: .4rem; font-size: .85rem; color: var(--wlp-titlu); font-weight: 600; }
.an-asigurari i { color: var(--primary-color); font-size: .75rem; }
.wlp-sectiune .an-asigurari { justify-content: center; }
.an-asigurari--alb { justify-content: center; }
.an-asigurari--alb li { color: rgba(255, 255, 255, .92); }
.an-asigurari--alb i { color: #fff; }

/* Punctele numerotate pe articol. */
.an-articol-poza { position: relative; }
.an-pin {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--primary-color);
    color: #fff;
    font: inherit;
    font-size: .8rem;
    cursor: pointer;
    vertical-align: middle;
    box-shadow: 0 0 0 4px rgba(18, 133, 79, .22);
    animation: an-pin-puls 2.6s ease-out infinite;
}
.an-pin b { font-weight: 800; line-height: 1; }
.an-pin:hover, .an-pin.is-deschis { animation: none; box-shadow: 0 0 0 4px rgba(18, 133, 79, .35); }
@keyframes an-pin-puls { 0% { box-shadow: 0 0 0 0 rgba(18, 133, 79, .45); } 70% { box-shadow: 0 0 0 9px rgba(18, 133, 79, 0); } 100% { box-shadow: 0 0 0 0 rgba(18, 133, 79, 0); } }
.an-pin--bara { margin-left: auto; }
.an-pin--poza { position: absolute; left: 14px; bottom: 14px; }
.an-pin--text { position: absolute; right: 18px; bottom: 18px; }
.an-articol-corp { position: relative; }
.an-pin-nota {
    position: absolute;
    z-index: 5;
    left: 50%;
    bottom: calc(100% + 10px);
    width: 230px;
    padding: .7rem .85rem;
    border-radius: 12px;
    background: #1f2633;
    color: #e8ecf2;
    font-size: .82rem;
    font-weight: 400;
    line-height: 1.45;
    text-align: left;
    box-shadow: 0 14px 34px rgba(20, 30, 50, .28);
    transform: translateX(-50%) translateY(4px);
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s, transform .15s;
}
.an-pin-nota strong { display: block; margin-bottom: .15rem; color: #fff; font-size: .86rem; }
.an-pin:hover .an-pin-nota, .an-pin:focus-visible .an-pin-nota, .an-pin.is-deschis .an-pin-nota { opacity: 1; transform: translateX(-50%); pointer-events: auto; }
.an-pin--bara .an-pin-nota { left: auto; right: -8px; transform: translateY(4px); bottom: auto; top: calc(100% + 10px); }
.an-pin--bara:hover .an-pin-nota, .an-pin--bara:focus-visible .an-pin-nota, .an-pin--bara.is-deschis .an-pin-nota { transform: none; }
.an-pin--text .an-pin-nota { left: auto; right: -6px; transform: translateY(4px); }
.an-pin--text:hover .an-pin-nota, .an-pin--text:focus-visible .an-pin-nota, .an-pin--text.is-deschis .an-pin-nota { transform: none; }
.an-pin--poza .an-pin-nota { left: -6px; transform: translateY(4px); }
.an-pin--poza:hover .an-pin-nota, .an-pin--poza:focus-visible .an-pin-nota, .an-pin--poza.is-deschis .an-pin-nota { transform: none; }
.an-pin-indiciu { margin: .9rem 0 0; text-align: center; font-size: .82rem; color: var(--wlp-text-slab); position: relative; z-index: 1; }
.an-pin-indiciu i { color: var(--primary-color); margin-right: .25rem; }

.an-cutie--rez { max-width: 980px; }

.an-comp { margin: 1.4rem 0 0; display: flex; flex-direction: column; gap: .6rem; }
.an-comp-rand { display: grid; grid-template-columns: 190px minmax(0, 1fr) 48px; gap: .8rem; align-items: center; }
.an-comp-eticheta { font-size: .88rem; color: var(--wlp-text); }
.an-comp-bara { height: 14px; border-radius: 999px; background: #edf0f4; overflow: hidden; }
.an-comp-bara i { display: block; height: 100%; border-radius: 999px; transition: width 1.2s cubic-bezier(.3, .9, .4, 1); }
.an-comp-bara i.is-tu { background: #c7ced9; }
.an-comp-bara i.is-noi { background: var(--wlp-gradient); }
.an-comp-rand b { text-align: right; color: var(--wlp-titlu); font-variant-numeric: tabular-nums; }

.an-se-incarca ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .55rem; }
.an-se-incarca li { display: flex; align-items: center; gap: .6rem; color: var(--wlp-text-slab); transition: color .2s; }
.an-se-incarca li::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2px solid #c7ced9; border-top-color: var(--primary-color); animation: an-roata .8s linear infinite; }
.an-se-incarca li.is-gata { color: var(--wlp-titlu); }
.an-se-incarca li.is-gata::before { animation: none; border-color: var(--primary-color); background: var(--primary-color); }
@keyframes an-roata { to { transform: rotate(360deg); } }

/* Pașii cu capturi reale, alternând stânga-dreapta. */
.an-pv { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: clamp(2rem, 1.4rem + 2.4vw, 3.5rem); }
.an-pv-pas { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(1.2rem, 1rem + 2.5vw, 3rem); align-items: center; }
.an-pv-pas:nth-child(even) .an-pv-text { order: 2; }
.an-pv-nr { display: inline-grid; place-items: center; width: 2.4rem; height: 2.4rem; margin-bottom: .7rem; border-radius: 50%; background: var(--primary-color); color: #fff; font-weight: 800; }
.an-pv-text h3 { font-size: 1.25rem; margin: 0 0 .5rem; }
.an-pv-text p { margin: 0; }
.an-pv-captura { margin: 0; border-radius: 14px; overflow: hidden; border: 1px solid var(--wlp-bordura); box-shadow: var(--wlp-umbra-ridicat); background: #fff; }
.an-pv-captura img { display: block; width: 100%; height: auto; }
.an-pv-captura figcaption { padding: .55rem .9rem; font-size: .8rem; color: var(--wlp-text-slab); border-top: 1px solid var(--wlp-bordura); background: var(--wlp-suprafata-2); }

/* Cazul de client: înainte / după. */
.an-caz-bare { display: flex; flex-direction: column; gap: .9rem; }
.an-caz-bara { display: grid; grid-template-columns: 150px minmax(0, 1fr) 56px; gap: .9rem; align-items: center; }
.an-caz-eticheta { font-weight: 700; color: #fff; font-size: .92rem; line-height: 1.25; }
.an-caz-eticheta small { display: block; font-weight: 500; font-size: .76rem; color: rgba(255, 255, 255, .75); }
.an-caz-linie { height: 18px; border-radius: 999px; background: rgba(255, 255, 255, .14); overflow: hidden; }
.an-caz-linie i { display: block; height: 100%; width: var(--l); border-radius: 999px; background: rgba(255, 255, 255, .45); }
.an-caz-linie i.is-acum { background: #fff; }
.an-caz-bara b { font-size: 1.4rem; color: #fff; text-align: right; font-variant-numeric: tabular-nums; }
.an-caz-nota { margin: .2rem 0 0; color: rgba(255, 255, 255, .9); font-size: .92rem; }
.an-caz-nota strong { color: #fff; font-size: 1.05rem; }

/* Recenziile reale (apar doar când există). */
.an-recenzii { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.1rem; }
.an-recenzie { margin: 0; padding: 1.3rem 1.4rem; border-radius: 16px; background: var(--wlp-suprafata); border: 1px solid var(--wlp-bordura); box-shadow: var(--wlp-umbra); }
.an-recenzie blockquote { margin: 0 0 1rem; font-family: Georgia, "Times New Roman", serif; font-size: 1.02rem; line-height: 1.6; color: var(--wlp-titlu); }
.an-recenzie figcaption { display: flex; flex-wrap: wrap; gap: .2rem .6rem; font-size: .86rem; color: var(--wlp-text-slab); }
.an-recenzie figcaption strong { color: var(--wlp-titlu); }

@media (max-width: 900px) {
    .an-pv-pas { grid-template-columns: minmax(0, 1fr); }
    .an-pv-pas:nth-child(even) .an-pv-text { order: 0; }
    .an-erou-text .an-test--erou, .an-test-nota { margin-left: auto; margin-right: auto; }
    .an-erou-text .an-asigurari { justify-content: center; }
}
@media (max-width: 620px) {
    .an-test--erou { flex-direction: column; }
    .an-test--erou .wlp-buton { width: 100%; justify-content: center; }
    .an-comp-rand { grid-template-columns: minmax(0, 1fr) 44px; }
    .an-comp-eticheta { grid-column: 1 / -1; }
    .an-caz-bara { grid-template-columns: minmax(0, 1fr) 52px; }
    .an-caz-eticheta { grid-column: 1 / -1; }
    .an-pin-nota { width: 200px; }
}
@media (prefers-reduced-motion: reduce) {
    .an-pin { animation: none; }
    .an-cadran-ac, .an-comp-bara i { transition: none; }
}

/* ════ v5: primul ecran centrat pe verticală, dovada vie lângă acțiune, cifre în carduri, pași lipicioși ════ */

/* Primul ecran ocupă exact înălțimea ferestrei (fără antet) și își centrează conținutul: pe un laptop
   de 650 px înălțime, varianta cu padding fix lăsa gol sus și tăia articolul jos. */
@media (min-width: 901px) {
    .an-erou {
        min-height: calc(100vh - 67px);
        min-height: calc(100svh - 67px);
        display: flex;
        align-items: center;
        padding: 1.5rem 0;
    }
    .an-erou > .wlp-container { width: 100%; }
}
/* Ferestre joase: același conținut, mai compact, ca să încapă întreg. */
@media (min-width: 901px) and (max-height: 820px) {
    .an-erou h1 { font-size: clamp(1.8rem, 1.2rem + 2vw, 2.5rem); margin-bottom: .35em; }
    .an-erou-sub { font-size: 1rem; margin-bottom: .6rem; }
    .an-articol img { max-height: 210px; }
    .an-articol-corp { padding: .8rem 1.1rem .3rem; }
    .an-articol-titlu { font-size: 1.08rem; }
    .an-articol-text { font-size: .9rem; max-height: 4.8em; overflow: hidden; }
    .an-articol-scena { padding: 10px 6px 12px; }
    .an-pin-indiciu { margin-top: .5rem; }
    .an-asigurari { margin-top: .8rem; }
    .an-test-nota { margin-top: .55rem; }
}
@media (min-width: 901px) and (max-height: 680px) {
    .an-erou .wlp-eticheta-mica { display: none; }
    .an-articol img { max-height: 160px; }
    .an-articol-text { max-height: 3.2em; }
    .an-pin-indiciu { display: none; }
}

/* Dovada vie, între text și acțiune (la uxpeak: ratingul de deasupra butonului). */
.an-erou-viu {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin: 0 0 .9rem;
    padding: .38rem .8rem;
    border-radius: 999px;
    background: var(--wlp-suprafata);
    border: 1px solid var(--wlp-bordura);
    font-size: .85rem;
    color: var(--wlp-text);
    box-shadow: 0 2px 8px rgba(20, 30, 50, .05);
}
.an-erou-viu strong { color: var(--wlp-titlu); }
.an-erou-viu .an-punct { margin: 0; }

/* Cifrele: carduri cu sursa deasupra, cifra mare și explicația dedesubt. */
.an-dovezi { padding: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem) 0; }
.an-cifre--carduri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-width: 980px; margin: 0 auto; }
.an-cifre--carduri li {
    align-items: flex-start;
    text-align: left;
    padding: 1.1rem 1.2rem;
    border-radius: 16px;
    background: var(--wlp-suprafata);
    border: 1px solid var(--wlp-bordura);
    box-shadow: var(--wlp-umbra);
}
.an-cifra-sursa { display: inline-flex; align-items: center; gap: .45rem; margin-bottom: .45rem; font-size: .76rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--wlp-text-slab); }
.an-cifra-sursa i { color: var(--primary-color); }
.an-cifra-sursa .an-punct { margin: 0; }
.an-cifre--carduri strong { font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem); line-height: 1.1; }
.an-cifre--carduri li > span:last-child { margin-top: .25rem; font-size: .86rem; }

/* Pașii: pe desktop, textul curge în stânga, iar captura stă lipită în dreapta și se schimbă
   cu pasul din mijlocul ecranului; punctele arată unde ești. Pe telefon, fiecare pas cu captura lui. */
.an-pv-eticheta { display: none; }
.an-pv-lipicios { display: none; }
@media (min-width: 901px) {
    .an-pv-scena { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 1rem + 3vw, 4rem); align-items: start; }
    .an-pv { gap: 0; }
    .an-pv-pas { display: block; min-height: 62vh; padding: 14vh 0; opacity: .35; transition: opacity .3s ease; }
    .an-pv-pas:first-child { padding-top: 4vh; }
    .an-pv-pas.is-activ { opacity: 1; }
    .an-pv-pas .an-pv-captura { display: none; }
    .an-pv-pas:nth-child(even) .an-pv-text { order: 0; }
    .an-pv-nr { display: none; }
    .an-pv-eticheta { display: block; margin-bottom: .6rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--wlp-verde-pe-tenta); }
    .an-pv-text h3 { font-size: clamp(1.35rem, 1.1rem + .8vw, 1.8rem); }
    .an-pv-text p { font-size: 1.05rem; }
    .an-pv-lipicios { display: flex; gap: 1rem; align-items: center; position: sticky; top: calc(50vh - 220px); }
    /* Cadrele sunt machete 880 × 540 (wlGhidCadru) plus legenda. */
    .an-pv-ecran { position: relative; flex: 1; aspect-ratio: 880 / 580; }
    .an-pv-cadru {
        position: absolute;
        inset: 0;
        margin: 0;
        border-radius: 16px;
        overflow: hidden;
        border: 1px solid var(--wlp-bordura);
        background: #fff;
        box-shadow: 0 2px 6px rgba(20, 30, 50, .06), 0 28px 70px rgba(18, 133, 79, .16);
        opacity: 0;
        transform: translateY(14px) scale(.98);
        transition: opacity .45s ease, transform .45s ease;
    }
    .an-pv-cadru.is-activ { opacity: 1; transform: none; }
    .an-pv-cadru img { display: block; width: 100%; height: auto; }
    .an-pv-cadru figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: .6rem 1rem; font-size: .82rem; color: var(--wlp-text-slab); border-top: 1px solid var(--wlp-bordura); background: var(--wlp-suprafata-2); }
    .an-pv-puncte { display: flex; flex-direction: column; gap: .5rem; }
    .an-pv-puncte i { width: 8px; height: 8px; border-radius: 999px; background: #cfd6e0; transition: height .25s ease, background .25s ease; }
    .an-pv-puncte i.is-activ { height: 26px; background: var(--primary-color); }
}
@media (max-width: 900px) {
    .an-cifre--carduri { grid-template-columns: minmax(0, 1fr); max-width: 420px; }
}
@media (prefers-reduced-motion: reduce) {
    .an-pv-cadru, .an-pv-pas { transition: none; }
}

/* Recenziile: 3 + 3 pe desktop (4 + 2 lăsa două carduri singure, iar cardurile ieșeau prea înguste),
   ghilimea mare în colț și inițiala numelui ca avatar — fără poze inventate. */
.an-recenzii { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.an-recenzie { position: relative; padding-top: 2.2rem; }
.an-recenzie::before {
    content: "\201E";
    position: absolute;
    top: .2rem;
    left: 1.2rem;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 3.4rem;
    line-height: 1;
    color: rgba(18, 133, 79, .25);
}
.an-recenzie figcaption { align-items: center; padding-top: .9rem; border-top: 1px solid var(--wlp-bordura); }
.an-recenzie-avatar {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 2.2rem;
    height: 2.2rem;
    margin-right: .3rem;
    border-radius: 50%;
    background: var(--wlp-verde-slab);
    color: var(--wlp-verde-pe-tenta);
    font-weight: 800;
}
.an-recenzie-cine { display: flex; flex-direction: column; line-height: 1.3; }
@media (max-width: 1000px) {
    .an-recenzii { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .an-recenzii { grid-template-columns: minmax(0, 1fr); }
}

/* ════ v6: „Luni, 08:10" refăcută, „Ce mai include", titlurile exemplelor ════ */

.an-exemplu-titlu { margin: 0 0 .55rem; font-size: 1.06rem; font-weight: 700; line-height: 1.35; color: var(--wlp-titlu); }

/* ── Luni, 08:10: fundal închis, ora mare, telefonul cu site-ul clientului ── */
.an-luni {
    position: relative;
    overflow: hidden;
    padding: clamp(3.5rem, 2rem + 5vw, 6rem) 0;
    background:
        radial-gradient(700px 420px at 85% 20%, rgba(52, 211, 153, .22), transparent 60%),
        radial-gradient(600px 400px at 10% 90%, rgba(18, 133, 79, .35), transparent 60%),
        linear-gradient(160deg, #0b2a1d 0%, #0f3b28 55%, #0c2f20 100%);
    color: #d6e7de;
}
.an-luni-grila { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.an-luni-ora { margin: 0 0 1rem; line-height: .95; letter-spacing: -.03em; color: #fff; font-weight: 800; font-size: clamp(2.6rem, 1.6rem + 4vw, 4.8rem); }
.an-luni-ora span { display: block; font-size: .45em; letter-spacing: 0; font-weight: 600; color: #8fd3b0; margin-bottom: .2rem; }
.an-luni-ora em { font-family: Georgia, "Times New Roman", serif; font-style: italic; font-weight: 600; }
.an-luni-poveste { margin: 0 0 1.6rem; font-size: clamp(1.08rem, 1rem + .45vw, 1.28rem); line-height: 1.6; color: #e4f1ea; max-width: 46ch; }
.an-luni-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .8rem; }
.an-luni-lista li { display: flex; gap: .75rem; align-items: flex-start; font-size: 1rem; line-height: 1.45; }
.an-luni-lista i { flex: 0 0 auto; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: rgba(52, 211, 153, .18); color: #6ee7b7; font-size: .75rem; margin-top: .05rem; }
.an-luni-lista strong { color: #fff; }

.an-luni-vizual { position: relative; display: flex; justify-content: center; padding: 1.5rem 0; }
.an-tel {
    position: relative;
    width: 300px;
    padding: 12px;
    border-radius: 46px;
    background: linear-gradient(145deg, #2b3340, #11161d);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, .06) inset, 0 40px 80px rgba(0, 0, 0, .45), 0 0 120px rgba(52, 211, 153, .18);
    transform: rotate(-3deg);
}
.an-tel-ecran { border-radius: 36px; overflow: hidden; background: #f6f7f9; min-height: 560px; }
.an-tel-stare { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 14px 24px 8px; font-size: .78rem; font-weight: 700; color: #111; }
.an-tel-stare i { position: absolute; left: 50%; top: 10px; width: 92px; height: 26px; margin-left: -46px; border-radius: 20px; background: #0d0f12; }
.an-tel-iconite { letter-spacing: 1px; font-size: .62rem; }
.an-tel-site { padding: 6px 14px 18px; }
.an-tel-antet { display: flex; justify-content: space-between; align-items: center; padding: 10px 4px 12px; border-bottom: 1px solid #e6e8ec; margin-bottom: 12px; color: #1f2633; }
.an-tel-antet b { font-size: .92rem; }
.an-tel-eticheta { margin: 0 0 10px; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #12854f; }
.an-tel-art { display: flex; gap: 10px; align-items: center; padding: 8px; margin-bottom: 10px; border-radius: 14px; background: #fff; box-shadow: 0 4px 14px rgba(20, 30, 50, .08); }
.an-tel-art img { flex: 0 0 auto; width: 84px; height: 64px; object-fit: cover; border-radius: 10px; }
.an-tel-art span { display: block; font-size: .64rem; font-weight: 700; color: #12854f; margin-bottom: 3px; }
.an-tel-art p { margin: 0; font-size: .8rem; font-weight: 700; line-height: 1.3; color: #1f2633; }
.an-tel-art--vechi { opacity: .45; box-shadow: none; background: #eef0f3; }
.an-tel-art--vechi i { flex: 0 0 auto; width: 84px; height: 64px; border-radius: 10px; background: #dde1e6; }
.an-tel-art--vechi span { color: #8a93a3; }
.an-tel-art--vechi p { height: 2.2em; border-radius: 6px; background: linear-gradient(#d3d8de 0 0) top / 90% .7em no-repeat, linear-gradient(#d3d8de 0 0) bottom / 60% .7em no-repeat; }

.an-luni-card {
    position: absolute;
    display: flex;
    gap: .7rem;
    align-items: center;
    padding: .8rem 1rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, .96);
    color: #1f2633;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .28);
    font-size: .82rem;
}
.an-luni-card i { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 10px; background: var(--wlp-verde-slab); color: var(--primary-color); }
.an-luni-card b { display: block; font-size: .9rem; }
.an-luni-card span { color: #6b7385; }
.an-luni-card--sus { top: 12%; left: max(0px, calc(50% - 300px)); }
.an-luni-card--jos { bottom: 10%; right: max(0px, calc(50% - 310px)); }
/* La intrare: telefonul se ridică, cardurile apar pe rând. O singură dată. */
.an-luni-vizual.is-anim .an-tel { opacity: 0; transform: rotate(-3deg) translateY(30px); }
.an-luni-vizual.is-anim .an-luni-card { opacity: 0; transform: translateY(12px); }
.an-luni-vizual.is-vazut .an-tel { opacity: 1; transform: rotate(-3deg); transition: opacity .6s ease, transform .6s ease; }
.an-luni-vizual.is-vazut .an-luni-card { opacity: 1; transform: none; transition: opacity .45s ease .45s, transform .45s ease .45s; }
.an-luni-vizual.is-vazut .an-luni-card--jos { transition-delay: .7s; }

/* ── Ce mai include ── */
.an-include { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }
.an-include-card {
    display: block;
    padding: 1.3rem 1.35rem;
    border-radius: 16px;
    background: var(--wlp-suprafata);
    border: 1px solid var(--wlp-bordura);
    color: inherit;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.an-include-card:hover { transform: translateY(-3px); box-shadow: var(--wlp-umbra-ridicat); border-color: rgba(18, 133, 79, .35); }
.an-include-card > i { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; margin-bottom: .9rem; border-radius: 12px; background: var(--wlp-verde-slab); color: var(--primary-color); font-size: 1.05rem; }
.an-include-card h3 { font-size: 1.05rem; margin: 0 0 .4rem; }
.an-include-card p { margin: 0; font-size: .93rem; line-height: 1.5; }

@media (max-width: 900px) {
    .an-luni-grila { grid-template-columns: minmax(0, 1fr); }
    .an-luni-text { text-align: left; }
    .an-include { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    .an-tel { width: 260px; }
    .an-tel-ecran { min-height: 480px; }
    .an-luni-card { font-size: .76rem; padding: .65rem .8rem; }
    .an-luni-card--sus { left: 0; top: 18%; }
    .an-luni-card--jos { right: 0; bottom: 4%; }
    .an-include { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .an-luni-vizual.is-anim .an-tel, .an-luni-vizual.is-anim .an-luni-card { opacity: 1; transform: none; }
    .an-luni-vizual.is-anim .an-tel { transform: rotate(-3deg); }
}

/* Fără animație de intrare la „Luni, 08:10": pe telefon observatorul nu pornea și telefonul rămânea
   ascuns. Conținutul important nu se ascunde niciodată în așteptarea unui script. */

/* ════ v7 ════ */

/* Nimic din pagină nu are voie s-o lățească: un tooltip ascuns și ștampila bonului ieșeau cu ~30 px în
   dreapta pe telefon, iar bara fixă (cu butonul ei) se lățea odată cu pagina. `clip`, nu `hidden`:
   nu creează un container de derulare, deci elementele lipicioase merg în continuare. */
.wlp-acasa-nou main { overflow-x: clip; }
.an-pin-nota { max-width: min(230px, calc(100vw - 48px)); }

/* Punctul 1 stă în bara browserului, iar regulile pentru textul din bară (`span`) prindeau și nota lui. */
.an-browser-bara .an-pin-nota {
    margin: 0;
    padding: .7rem .85rem;
    border-radius: 12px;
    background: #1f2633;
    color: #e8ecf2;
    font-size: .82rem;
    flex: none;
    max-width: min(230px, calc(100vw - 48px));
}
.an-browser-bara .an-pin { flex: 0 0 auto; }

/* Titluri fără cuvânt colorat în italic. */
.an-erou h1 em, .wlp-acasa-nou .wlp-antet-sectiune h2 em, .an-caz h2 em { font-family: inherit; font-style: normal; color: inherit; font-weight: inherit; }
.an-luni-ora { font-weight: 800; }

/* Cum se face de obicei: fiecare pas cu timpul lui, aliniat în dreapta. */
.an-contra-vechi li { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.an-contra-vechi li em { flex: 0 0 auto; font-style: normal; font-size: .76rem; font-weight: 800; color: #9a3b33; white-space: nowrap; }
.an-contra-vechi li span { flex: 0 1 auto; }

/* Cu Windlinks: tot ce face motorul la fiecare articol. */
.an-motor { display: block; }
.an-motor > p { display: flex; gap: .55rem; align-items: center; margin: 0 0 .6rem; font-weight: 700; }
.an-motor > p i { color: var(--primary-color); }
.an-motor ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: .4rem; }
.an-motor li { position: relative; padding-left: 1.2rem; font-weight: 500; font-size: .92rem; line-height: 1.45; color: var(--wlp-titlu); }
.an-motor li::before { content: ""; position: absolute; left: .2rem; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--primary-color); }

/* Recenziile: prima mare, pe două coloane; fiecare are drept titlu o frază din textul clientului. */
.an-recenzii { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.an-recenzie:first-child { grid-column: span 2; background: var(--wlp-gradient); border-color: transparent; color: #fff; box-shadow: 0 24px 60px rgba(18, 133, 79, .22); }
.an-recenzie:first-child::before { color: rgba(255, 255, 255, .3); }
.an-recenzie:first-child .an-recenzie-titlu { color: #fff; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); }
.an-recenzie:first-child blockquote { color: rgba(255, 255, 255, .92); font-size: 1.08rem; }
.an-recenzie:first-child figcaption { border-top-color: rgba(255, 255, 255, .2); color: rgba(255, 255, 255, .8); }
.an-recenzie:first-child figcaption strong { color: #fff; }
.an-recenzie:first-child .an-recenzie-avatar { background: rgba(255, 255, 255, .18); color: #fff; }
.an-recenzie-titlu { margin: 0 0 .7rem; font-size: 1.15rem; font-weight: 800; line-height: 1.3; color: var(--wlp-titlu); letter-spacing: -.01em; }
.an-recenzie blockquote { font-size: .97rem; }
@media (max-width: 1000px) {
    .an-recenzii { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .an-recenzii { grid-template-columns: minmax(0, 1fr); }
    .an-recenzie:first-child { grid-column: auto; }
}

/* Tăietura pe fiecare rând de text (un pas pe două rânduri primea o singură linie, la mijloc):
   `text-decoration`, cu culoarea care apare la intrarea în ecran, în locul liniei desenate. */
.an-contra-vechi li span::after { display: none; }
.an-contra-vechi li span { text-decoration: line-through; text-decoration-thickness: 2px; text-decoration-color: transparent; transition: text-decoration-color .4s ease; }
.an-contra-vechi.is-taiat li span { text-decoration-color: #c4483d; }
.an-contra-vechi.is-taiat li:nth-child(2) span { transition-delay: .1s; }
.an-contra-vechi.is-taiat li:nth-child(3) span { transition-delay: .2s; }
.an-contra-vechi.is-taiat li:nth-child(4) span { transition-delay: .3s; }
.an-contra-vechi.is-taiat li:nth-child(5) span { transition-delay: .4s; }
.an-contra-vechi.is-taiat li:nth-child(6) span { transition-delay: .5s; }
.an-contra-vechi.is-taiat li:nth-child(7) span { transition-delay: .6s; }
.an-contra-vechi.is-taiat li:nth-child(8) span { transition-delay: .7s; }

/* Recenziile mici: contur verde, ca să se lege vizual de cea mare. */
.an-recenzie:not(:first-child) { border: 2px solid rgba(18, 133, 79, .45); }

