/* ============================================================================
   NOVUM 1979 — continutul paginilor existente adus la aspectul nou
   (1:1 simpluceramics): titlu de pagina urias, carduri rotunjite cu subsol
   deschis, butoane-pastila, campuri pline fara chenar, galeria produsului.
   Se incarca dupa novum.css + zone.css si inaintea foilor proprii ale paginii.
   ============================================================================ */

/* fontul nou si pe continutul paginilor vechi */
:root { --font-display: 'Urbanist', 'Helvetica Neue', Arial, sans-serif; --font-ui: var(--font-display); }
.v2 h1, .v2 h2, .v2 h3, .v2 .h2, .v2 .h3 { font-family: var(--font-display); letter-spacing: -0.035em; }

/* ---------------------------------------------------------------- titlul paginii (ca „Contact us" / „FAQ") */
.v2 .zh { padding: clamp(48px, 6.6vw, 100px) 0 clamp(36px, 4vw, 64px); }
.v2 .zh h1 { font-size: clamp(44px, 5.4vw + 12px, 96px); font-weight: 700; line-height: .95; letter-spacing: -0.045em; max-width: 14em; }
.v2 .zh p { margin-top: clamp(18px, 2vw, 28px); max-width: 60em; font-size: clamp(16px, .4vw + 13px, 18px); line-height: 1.6; color: var(--ink); }

/* ---------------------------------------------------------------- butoane */
.v2 .z-btn, .v2 .btn { border-radius: 60px; min-height: 56px; padding: 18px 26px; font-size: 15.27px; font-weight: 700; letter-spacing: 0;
    text-transform: none; box-shadow: none; transition: background .25s, color .25s, box-shadow .25s; }
.v2 .z-btn:hover, .v2 .btn:hover { transform: none; }
.v2 .z-btn { background: var(--ink); color: #fff; }
.v2 .z-btn:hover { background: #3A3F4B; box-shadow: none; }
.v2 .z-btn.ghost, .v2 .btn-ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); border-color: transparent; }
.v2 .z-btn.ghost:hover, .v2 .btn-ghost:hover { background: var(--ink); color: #fff; }
.v2 .btn-dark, .v2 .btn-accent { background: var(--ink); color: #fff; }
.v2 .btn-dark:hover, .v2 .btn-accent:hover { background: #3A3F4B; box-shadow: none; }
@media (max-width: 760px) { .v2 .z-btn, .v2 .btn { min-height: 48px; padding: 14px 20px; font-size: 14px; } }

/* ---------------------------------------------------------------- campuri (pline, fara chenar, ca la referinta) */
.v2 main :where(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):not([type=range]):not([type=submit]):not([type=button]), select, textarea) {
    min-height: 56px; padding: 14px 22px; border: 0; border-radius: 12px; background: var(--v-card); color: var(--ink); font-size: 16px; box-shadow: none; }
.v2 main :where(textarea) { min-height: 140px; }
.v2 main :where(input, select, textarea):focus { outline: 2px solid var(--ink); outline-offset: 0; background: #fff; }

/* ---------------------------------------------------------------- magazinul: filtre in sertar + grila de carduri */
.v2 .sh-layout { grid-template-columns: minmax(0, 1fr); gap: 0; }
/* magazinul: filtrele in sertar pe orice ecran („Arată filtrele", ca la referinta); paharele gravate:
   filtrul ramane in stanga pe desktop (cerut de client, modelul Altex/Elefant) si e sertar doar pe telefon */
.v2 .sh-layout .sh-filters, .v2 .gv-layout .sh-filters.v-sertar-tel { position: fixed; z-index: 140; top: 0; left: 0; bottom: 0; width: min(420px, 100%); overflow: auto; padding: 96px 40px 40px;
    background: var(--hartie); border-radius: 0 var(--r-lg) var(--r-lg) 0; box-shadow: 30px 0 80px -40px rgba(20, 22, 27, .45);
    transform: translateX(-105%); transition: transform .45s cubic-bezier(.2, .8, .2, 1); display: block !important; }
.v2 .sh-layout .sh-filters.open, .v2 .gv-layout .sh-filters.v-sertar-tel.open { transform: none; }
.v2 .sh-layout .sh-filters .filter-apply { display: block !important; position: sticky; bottom: -40px; margin: 24px -40px -40px; padding: 18px 40px 24px; background: var(--hartie); }
.v2 .sh-layout .sh-filtre-btn { display: inline-flex !important; align-items: center; gap: 10px; height: 56px; padding: 0 26px; border: 1px solid var(--ink); border-radius: 60px;
    background: transparent; font-size: 16px; cursor: pointer; }
.v2 .sh-filtre-btn::before { content: ''; width: 20px; height: 14px; background:
    linear-gradient(currentColor, currentColor) 0 2px / 100% 1.5px no-repeat, linear-gradient(currentColor, currentColor) 0 11px / 100% 1.5px no-repeat; }
.v2 .sh-top { margin: 0 0 42px; min-height: 56px; }
.v2 .sh-count { font-size: 16px; color: var(--ink); }
.v2 .sh-group + .sh-group { margin-top: clamp(56px, 6vw, 100px); }
.v2 .sh-group-head { align-items: baseline; gap: 14px; padding: 0 0 22px; border: 0; }
.v2 .sh-group-head h2 { font-size: clamp(30px, 2vw + 16px, 48.5px); letter-spacing: -0.04em; }
.v2 .sh-group-head .use { font-size: 16px; }
.v2 .sh-group-head .nr { font-size: 14px; }
/* fundalul intunecat al filtrelor: vezi „sertarul de filtre” mai jos (sta in acelasi strat cu sertarul, nu peste el) */

/* cardul de produs: poza patrata pe gri cald, subsol deschis cu numele si pretul pe acelasi rand */
.v2 .pg { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; }
.v2 .pc { border-radius: var(--r); overflow: hidden; background: var(--hartie); transition: box-shadow .3s; }
.v2 .pc:hover { box-shadow: 0 22px 50px -30px rgba(28, 31, 38, .45); }
.v2 .pc-media { border-radius: 0; background: #EDEBE6; }
.v2 .pc-body { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; gap: 6px 16px; padding: 22px 26px 26px; }
.v2 .pc-sub { grid-column: 1; grid-row: 1; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-60); }
.v2 .pc-name { grid-column: 1; grid-row: 2; font-size: 18px; font-weight: 400; line-height: 1.3; letter-spacing: -0.01em; }
.v2 .pc-price { grid-column: 2; grid-row: 2; margin: 0; font-size: 16px; font-weight: 400; white-space: nowrap; }
.v2 .pc-tag { border-radius: 99px; }
@media (max-width: 1100px) { .v2 .pg { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
@media (max-width: 560px) {
    .v2 .pc { border-radius: 10px; }
    .v2 .pc-body { grid-template-columns: 1fr; padding: 14px 14px 16px; gap: 4px; }
    .v2 .pc-sub { font-size: 10px; letter-spacing: .1em; }
    .v2 .pc-name { grid-row: 2; font-size: 15px; }
    .v2 .pc-price { grid-column: 1; grid-row: 3; font-size: 15px; }
}

/* bannerul „set de 6" din magazin */
.v2 .sh-set { border-radius: var(--r); overflow: hidden; background: var(--noapte); color: #fff; }
.v2 .sh-set-txt p { color: rgba(255, 255, 255, .78); }
.v2 .sh-set .z-btn { background: #fff; color: var(--ink); }

/* ---------------------------------------------------------------- pagina produsului: galerie mare, rotunjita */
.v2 .pgal-main { border-radius: var(--r); }
.v2 .pgal-thumbs button { border-radius: 10px; }
.v2 .pgal-nav { width: 56px; height: 56px; border-radius: 50%; background: #fff; border: 0; box-shadow: none; }

/* ---------------------------------------------------------------- carduri de seturi / gravate (pcard) */
.v2 .pg .pc .pc-media.contain { background: #EDEBE6; }

/* ---------------------------------------------------------------- paharele gravate: filtrul din stanga ramane (cerut de client) */
.v2 .gv-layout .gv-col { scroll-margin-top: calc(var(--hdr-h) + 24px); }
.v2 .sh-layout .sh-filtre-cap { position: absolute; left: 40px; right: 24px; top: 24px; display: flex; align-items: center; justify-content: space-between; }
.v2 .sh-layout .sh-filtre-cap h2 { font-size: 30px; letter-spacing: -0.03em; }
/* paharele gravate pe telefon: acelasi sertar */
@media (max-width: 1100px) {
    .v2 .gv-layout .sh-filters { position: fixed; z-index: 140; top: 0; left: 0; bottom: 0; width: min(420px, 100%); overflow: auto; padding: 32px 24px 40px;
        background: var(--hartie); border-radius: 0 var(--r-lg) var(--r-lg) 0; transform: translateX(-105%); transition: transform .45s cubic-bezier(.2, .8, .2, 1); display: block !important; }
    .v2 .gv-layout .sh-filters.open { transform: none; }
    .v2 .gv-layout .sh-filtre-btn { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 22px; border: 1px solid var(--ink); border-radius: 60px; background: transparent; font-size: 15px; }
}

/* ---------------------------------------------------------------- titlurile celorlalte pagini (contact, despre, mostre, cos, legal) */
.v2 .page-head { padding: clamp(48px, 6.6vw, 100px) 0 clamp(28px, 3vw, 48px); text-align: left; }
.v2 .page-head h1 { font-size: clamp(44px, 5.4vw + 12px, 96px); font-weight: 700; line-height: .95; letter-spacing: -0.045em; max-width: 14em; }
.v2 .page-head .section-sub, .v2 .page-head .lead, .v2 .page-head p { margin-inline: 0; margin-top: clamp(16px, 2vw, 26px); max-width: 60em; font-size: clamp(16px, .4vw + 13px, 18px); color: var(--ink); }
.v2 .page-head .hero-cta { justify-content: flex-start; }
.v2 .page-head.slim h1 { font-size: clamp(40px, 4.4vw + 10px, 80px); }

/* cardurile de contact: pline, rotunjite, ca blocurile de la referinta */
.v2 .contact-card { border: 0; border-radius: var(--r); background: var(--hartie); padding: 30px; box-shadow: none; }
.v2 .contact-card h4 { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-60); font-weight: 400; margin-bottom: 10px; }
.v2 .contact-card p { font-size: 17px; line-height: 1.55; }
.v2 .contact-card a { text-decoration: underline; text-underline-offset: 4px; }

/* ---------------------------------------------------------------- contact (asezarea referintei: formularul stanga, datele dreapta) */
.v2 .ct { padding: 0 0 clamp(70px, 8vw, 120px); }
.v2 .ct-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); gap: clamp(36px, 5vw, 76px); align-items: start; }
.v2 .ct-randuri { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.v2 .ct-camp { display: block; }
.v2 .ct-camp input, .v2 .ct-camp select, .v2 .ct-camp textarea { width: 100%; min-height: 62px; padding: 18px 26px; border: 0; border-radius: 12px;
    background: var(--hartie); font: inherit; font-size: 16px; color: var(--ink); box-shadow: inset 0 0 0 1px rgba(28, 31, 38, .05); }
.v2 .ct-camp textarea { min-height: 210px; resize: vertical; }
.v2 .ct-camp ::placeholder { color: rgba(28, 31, 38, .55); }
.v2 .ct-camp :focus { outline: 2px solid var(--ink); outline-offset: 0; background: #fff; }
.v2 .ct-lat { grid-column: 1 / -1; }
.v2 .ct-select { position: relative; }
.v2 .ct-select select { appearance: none; padding-right: 64px; cursor: pointer; }
.v2 .ct-select select:invalid { color: rgba(28, 31, 38, .55); }
.v2 .ct-select::after { content: ''; position: absolute; right: 30px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border: solid var(--ink);
    border-width: 0 1.6px 1.6px 0; transform: rotate(45deg); pointer-events: none; }
.v2 .ct-momeala { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.v2 .ct-gdpr { display: flex; gap: 12px; align-items: flex-start; margin: 22px 0 8px; font-size: 14px; line-height: 1.45; }
.v2 .ct-gdpr input { margin-top: 2px; width: 18px; height: 18px; flex: none; accent-color: var(--ink); }
.v2 .ct-gdpr a { text-decoration: underline; text-underline-offset: 3px; }
.v2 .ct-eroare { color: #8E2A22; font-size: 14px; margin: 8px 0; }
.v2 .ct-form .v-btn { margin-top: 18px; min-width: 240px; }
.v2 .ct-info { display: grid; gap: 34px; padding-top: 8px; }
.v2 .ct-info h2 { font-size: 13px; font-weight: 500; letter-spacing: .02em; color: var(--ink-60); margin-bottom: 10px; }
.v2 .ct-info p { font-size: 17px; line-height: 1.55; }
.v2 .ct-info p + p { margin-top: 8px; }
.v2 .ct-info a { text-decoration: underline; text-underline-offset: 4px; }
.v2 .ct-social { display: flex; gap: 18px; }
.v2 .ct-social a { text-decoration: none; display: grid; place-items: center; width: 32px; height: 32px; }
.v2 .page-contact .page-head p + p { margin-top: 12px; }
@media (max-width: 900px) {
    .v2 .ct-grid { grid-template-columns: 1fr; }
    .v2 .ct-randuri { grid-template-columns: 1fr; gap: 14px; }
    .v2 .ct-form .v-btn { width: 100%; }
}

/* ---------------------------------------------------------------- sertarul de filtre (Dan: „filtrele nu se vad ok")
   1) fundalul intunecat statea pe <html> (stratul de sus al paginii) si acoperea si sertarul, care e in panoul paginii:
      acum e .v-drop-fond, in acelasi panou, sub sertar; bara de sus coboara sub panou cat e deschis sertarul
   2) optiunile erau radio-uri cu accent alb (nu se vedea ce e ales): acum pastile, cea aleasa plina */
html.v-filtre-deschise .v-drop-fond { z-index: 139; opacity: 1; visibility: visible; pointer-events: auto; background: rgba(20, 22, 27, .45);
    transition: opacity .45s cubic-bezier(.2, .8, .2, 1), visibility 0s; }
html.v-filtre-deschise .v-anunt { z-index: 0; }
html.v-filtre-deschise .nvc-widget { display: none !important; }
.v2 .sh-layout .sh-filters .filter-group { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0; border: 0; }
.v2 .sh-layout .sh-filters .filter-group + .filter-group { margin-top: 32px; }
.v2 .sh-layout .sh-filters .filter-group h4 { flex: 0 0 100%; margin: 0 0 6px; font-family: var(--font); font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-60); }
.v2 .sh-layout .sh-filters .filter-option { position: relative; display: inline-flex; padding: 0; color: var(--ink); cursor: pointer; }
.v2 .sh-layout .sh-filters .filter-option input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.v2 .sh-layout .sh-filters .filter-option span { display: inline-flex; align-items: center; height: 42px; padding: 0 18px; border-radius: 99px; font-size: 15px; font-weight: 500;
    box-shadow: inset 0 0 0 1px rgba(28, 31, 38, .2); transition: background .25s, color .25s, box-shadow .25s; }
.v2 .sh-layout .sh-filters .filter-option:hover span { box-shadow: inset 0 0 0 1px var(--ink); }
.v2 .sh-layout .sh-filters .filter-option input:checked + span { background: var(--ink); color: #fff; box-shadow: none; font-weight: 600; }
.v2 .sh-layout .sh-filters .filter-option input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 2px; }
.v2 .sh-layout .sh-filters .filter-swatches { flex: 0 0 100%; display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.v2 .sh-layout .sh-filters .filter-swatch { position: relative; display: block; }
.v2 .sh-layout .sh-filters .filter-swatch input { display: block; position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.v2 .sh-layout .sh-filters .filter-swatch i { width: 36px; height: 36px; border: 0; box-shadow: inset 0 0 0 1px rgba(28, 31, 38, .14), inset 0 -4px 8px rgba(0, 0, 0, .18);
    transition: box-shadow .2s, transform .2s; }
.v2 .sh-layout .sh-filters .filter-swatch:hover i { transform: scale(1.07); }
.v2 .sh-layout .sh-filters .filter-swatch input:checked + i { box-shadow: 0 0 0 3px var(--hartie), 0 0 0 5px var(--ink), inset 0 -4px 8px rgba(0, 0, 0, .18); }
.v2 .sh-layout .sh-filters .filter-swatch input:focus-visible + i { outline: 2px solid var(--ink); outline-offset: 5px; }
.v2 .sh-layout .sh-filters .filter-apply { border: 0; }

/* ============================================================================
   Pagina „Pentru business" v2 (03.10, Dan: „mult mai profi"): fotografia de sus pe tot ecranul, cifrele,
   lucrari reale (mozaic), randuri alternate pe segmente, volumele randate la scara, glazurile reale,
   fabrica, fisa comenzii, banda configuratorului cu filmul paharului, contact.
   Doar continut real: poze cu pahare gravate pentru clienti, poze din fabrica, randari din profilurile masurate.
   ============================================================================ */
.page-business [id] { scroll-margin-top: 110px; }

/* butonul alb pe contur (peste fotografie) */
.v-btn--contur-alb { background: transparent; color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .72); transition: color .45s; }
.v-btn--contur-alb .v-btn__f { background: #fff; }
.v-btn--contur-alb.is-plin { color: var(--ink); }

/* 1. fotografia de sus: pe tot ecranul, textul jos-stanga pe umbra fotografiei */
.bp-erou { min-height: max(620px, min(calc(100svh - 48px), 940px)); }
.bp-erou picture, .bp-erou picture img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bp-erou picture img { object-position: 28% 50%; }
.bp-erou::after { background:
    linear-gradient(180deg, rgba(20, 22, 27, .55) 0%, rgba(20, 22, 27, 0) 26%),
    linear-gradient(90deg, rgba(20, 22, 27, .8) 0%, rgba(20, 22, 27, .5) 36%, rgba(20, 22, 27, 0) 66%),
    linear-gradient(0deg, rgba(20, 22, 27, .5) 0%, rgba(20, 22, 27, 0) 42%); }
.bp-erou__txt { max-width: 900px; gap: 24px; padding-bottom: calc(clamp(56px, 7vw, 110px) + var(--r-lg)); }
.v2 .bp-erou__txt h1 { max-width: 9.2em; font-size: clamp(44px, 4.3vw + 10px, 90px); font-weight: 300; line-height: .98; letter-spacing: .01em; text-transform: uppercase; }
.v-pag-erou__txt.bp-erou__txt p { max-width: 35em; font-size: clamp(16px, .4vw + 12px, 19px); font-weight: 400; line-height: 1.55; color: rgba(255, 255, 255, .88); }
.bp-erou__btn { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }

/* 2. cifrele */
.bp { padding-top: clamp(56px, 6vw, 96px); }
.bp-cifre { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; max-width: 1440px; margin: 0 auto; padding: 0 var(--pagina); }
.bp-cifre > div { display: grid; gap: 12px; align-content: start; }
.bp-cifre b { font-size: clamp(30px, 2.4vw + 8px, 54px); font-weight: 300; line-height: 1; letter-spacing: -0.01em; white-space: nowrap; }
.bp-cifre span { max-width: 16em; font-size: 15px; line-height: 1.45; color: var(--ink-60); }

/* sectiunile */
.bp-sectiune { max-width: 1440px; margin: 0 auto; padding: clamp(84px, 9vw, 150px) var(--pagina) 0; }
.bp-h2 { font-size: clamp(34px, 2.6vw + 12px, 62px); font-weight: 700; line-height: 1.02; letter-spacing: -0.045em; }
.bp-cap { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(20px, 5vw, 96px); align-items: end; margin-bottom: clamp(32px, 4vw, 56px); }
.bp-cap p { max-width: 34em; font-size: clamp(16px, .3vw + 13px, 18px); line-height: 1.6; opacity: .78; }
.bp-mic { font-size: 13px; color: var(--ink-60); }

/* 3. lucrarile: mozaic (una mare, patru mici, doua late) — totul la vedere, fara slider */
.bp-galerie { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(170px, 15vw, 270px); gap: clamp(10px, 1.2vw, 18px); }
.bp-galerie__el { margin: 0; overflow: hidden; border-radius: var(--r); background: var(--v-card); }
.bp-galerie__el img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2, .8, .2, 1); }
.bp-galerie__el:hover img { transform: scale(1.04); }
.bp-galerie__el:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.bp-galerie__el:nth-child(6), .bp-galerie__el:nth-child(7) { grid-column: span 2; }

/* 4. pentru cine: randuri mari, poza alternand stanga/dreapta */
.bp-cine > .bp-h2 { margin-bottom: clamp(32px, 4vw, 60px); }
.bp-seg { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 88px); align-items: center; }
.bp-seg + .bp-seg { margin-top: clamp(56px, 7vw, 110px); }
.bp-seg:nth-of-type(even) .bp-seg__img { order: 2; }
.bp-seg__img { overflow: hidden; aspect-ratio: 4 / 3; border-radius: var(--r); background: var(--v-card); }
.bp-seg__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2, .8, .2, 1); }
.bp-seg:hover .bp-seg__img img { transform: scale(1.03); }
.bp-seg__txt { display: grid; gap: 14px; justify-items: start; }
.bp-seg__txt h3 { font-size: clamp(28px, 1.6vw + 12px, 42px); font-weight: 700; line-height: 1.04; letter-spacing: -0.04em; }
.bp-seg__txt .bp-seg__lead { font-size: clamp(18px, .5vw + 13px, 22px); font-weight: 500; letter-spacing: -0.01em; opacity: 1; }
.bp-seg__txt p { max-width: 32em; line-height: 1.6; opacity: .8; }
.bp-seg__txt ul { display: grid; gap: 10px; margin: 4px 0 10px; padding: 0; list-style: none; }
.bp-seg__txt li { position: relative; padding-left: 28px; line-height: 1.5; }
.bp-seg__txt li::before { content: ''; position: absolute; left: 2px; top: .38em; width: 12px; height: 6px; border: solid var(--ink); border-width: 0 0 1.6px 1.6px; transform: rotate(-45deg); }

/* 5. volumele (randate la aceeasi scara: latimea fiecarei coloane = latimea paharului), glazurile, gravura */
.bp-vol { display: flex; align-items: flex-end; gap: clamp(14px, 3vw, 56px); padding: clamp(32px, 4.4vw, 64px) clamp(16px, 4.4vw, 80px) clamp(24px, 3vw, 40px);
    border-radius: var(--r-lg); background: var(--hartie); }
.bp-vol figure { display: grid; gap: 18px; justify-items: center; min-width: 0; margin: 0; }
.bp-vol picture, .bp-vol img { display: block; width: 100%; height: auto; }
.bp-vol img { filter: drop-shadow(0 18px 16px rgba(20, 22, 27, .2)); }
.bp-vol figcaption { display: grid; gap: 2px; text-align: center; }
.bp-vol figcaption b { font-size: clamp(16px, .6vw + 12px, 22px); font-weight: 700; }
.bp-vol figcaption span { font-size: 15px; }
.bp-vol figcaption small { font-size: 13px; color: var(--ink-60); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bp-doua { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(14px, 1.6vw, 24px); margin-top: clamp(14px, 1.6vw, 24px); }
.bp-panou { --pad: clamp(24px, 3vw, 44px); display: grid; gap: 14px; align-content: start; padding: var(--pad); border-radius: var(--r-lg); background: var(--hartie); overflow: hidden; }
.bp-panou h3 { font-size: clamp(24px, 1.2vw + 12px, 32px); font-weight: 700; letter-spacing: -0.035em; }
.bp-panou p { max-width: 34em; line-height: 1.6; }
.bp-panou p.bp-glazuri__et { margin-top: 10px; font-size: 14px; font-weight: 600; }
.bp-glazuri { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 12px 10px; margin: 0; padding: 0; list-style: none; }
.bp-glazuri li { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: 13px; line-height: 1.25; }
.bp-glazuri i { flex: none; width: 30px; height: 30px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(28, 31, 38, .12), inset 0 -4px 8px rgba(0, 0, 0, .18); }
.bp-glazuri i.is-lucios { background-image: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, .75) 0, rgba(255, 255, 255, 0) 40%) !important; }
.bp-gravura__img { margin: calc(-1 * var(--pad)) calc(-1 * var(--pad)) 10px; aspect-ratio: 16 / 9; overflow: hidden; }
.bp-gravura__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.bp-gravura__m { display: grid; gap: 10px; margin: 6px 0 0; padding: 0; list-style: none; }
.bp-gravura__m li { display: grid; grid-template-columns: minmax(0, 1fr) 64px; align-items: center; gap: 14px; }
.bp-gravura__m i { width: var(--l); height: 10px; border-radius: 99px; background: var(--ink); }
.bp-gravura__m span { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }

/* 6. fabrica */
.bp-fabrica { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 96px); align-items: center; }
.bp-fabrica__txt { display: grid; gap: 18px; }
.bp-fabrica__txt p { max-width: 32em; font-size: clamp(16px, .3vw + 13px, 18px); line-height: 1.65; }
.bp-fabrica__poze { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(10px, 1.2vw, 18px); }
.bp-fabrica__poze figure { margin: 0; overflow: hidden; border-radius: var(--r); background: var(--v-card); }
.bp-fabrica__poze picture, .bp-fabrica__poze img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bp-fabrica__p1 { grid-row: span 2; aspect-ratio: 3 / 4.4; }
.bp-fabrica__p2, .bp-fabrica__p3 { aspect-ratio: 4 / 3.3; }

/* 7. cum comanzi (pasii chiar sunt in ordine) + fisa comenzii */
.bp-comanda { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); gap: clamp(32px, 5vw, 96px); align-items: start; }
.bp-pasi { display: grid; gap: clamp(22px, 2.4vw, 34px); margin: clamp(28px, 3vw, 44px) 0 0; padding: 0; list-style: none; counter-reset: pas; }
.bp-pasi li { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 20px; row-gap: 6px; counter-increment: pas; }
.bp-pasi li::before { content: counter(pas); grid-row: span 2; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--ink); color: #fff;
    font-size: 17px; font-weight: 600; }
.bp-pasi b { align-self: end; font-size: clamp(19px, .6vw + 14px, 24px); font-weight: 700; letter-spacing: -0.02em; }
.bp-pasi span { max-width: 32em; line-height: 1.55; opacity: .78; }
.bp-fisa { position: sticky; top: 110px; display: grid; gap: 20px; padding: clamp(26px, 3vw, 44px); border-radius: var(--r-lg); background: #fff; }
.bp-fisa h3 { font-size: clamp(22px, 1vw + 12px, 28px); font-weight: 700; letter-spacing: -0.03em; }
.bp-fisa dl { display: grid; gap: 18px; margin: 0; }
.bp-fisa dl > div { display: grid; grid-template-columns: minmax(0, 10em) minmax(0, 1fr); gap: 16px; align-items: baseline; }
.bp-fisa dt { font-size: 14px; color: var(--ink-60); }
.bp-fisa dd { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; font-size: 17px; font-weight: 600; }
.bp-fisa dd small { font-size: 14px; font-weight: 400; color: var(--ink-60); }
.bp-treapta { font-weight: 500; }
.bp-treapta b { font-weight: 700; }

/* 8. banda configuratorului */
.bp-config { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 88px); align-items: center;
    width: min(calc(1440px - 2 * var(--pagina)), calc(100% - 2 * var(--pagina))); margin: clamp(84px, 9vw, 150px) auto 0;
    padding: clamp(28px, 5vw, 80px); border-radius: var(--r-lg); background: var(--noapte); color: #fff; }
.bp-config .bp-h2 { color: #fff; }
.bp-config__txt { display: grid; gap: 20px; justify-items: start; }
.bp-config__txt p { max-width: 30em; font-size: clamp(16px, .3vw + 13px, 18px); line-height: 1.6; color: rgba(255, 255, 255, .78); }
/* captura reala a configuratorului, ca o fereastra deschisa */
.bp-config__ecran { display: block; overflow: hidden; border-radius: var(--r); background: var(--fond); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .7);
    transition: transform .6s cubic-bezier(.16, 1, .3, 1); }
.bp-config__ecran:hover { transform: translateY(-4px); }
.bp-config__ecran picture, .bp-config__ecran img { display: block; width: 100%; height: auto; }

/* 9. contact */
.bp-contact { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 96px); align-items: start; padding-bottom: clamp(84px, 9vw, 140px); }
.bp-contact__info { display: grid; gap: 20px; }
.bp-contact__info > p { max-width: 28em; font-size: clamp(16px, .3vw + 13px, 18px); line-height: 1.6; }
.bp-contact__info dl { display: grid; gap: 18px; margin: 12px 0 0; }
.bp-contact__info dt { font-size: 14px; color: var(--ink-60); }
.bp-contact__info dd { margin: 4px 0 0; font-size: 18px; font-weight: 500; line-height: 1.45; }
.bp-contact__info a { text-decoration: underline; text-underline-offset: 4px; }
.bp-contact__form { display: grid; gap: 18px; }

@media (max-width: 1100px) {
    .bp-cifre { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 34px; }
    .bp-cap, .bp-fabrica, .bp-comanda, .bp-config, .bp-contact, .bp-doua { grid-template-columns: minmax(0, 1fr); }
    .bp-cap { align-items: start; }
    .bp-fisa { position: static; }
}
@media (max-width: 900px) {
    .bp-seg { grid-template-columns: minmax(0, 1fr); }
    .bp-seg:nth-of-type(even) .bp-seg__img { order: 0; }
}
@media (max-width: 760px) {
    /* telefon: fotografia sus, textul dedesubt pe fundal inchis (nu peste pahare) */
    .bp-erou { min-height: max(600px, calc(100svh - 40px)); background: var(--noapte); }
    .bp-erou picture { inset: 0 0 auto 0; height: 60%; }
    .bp-erou picture img { object-position: 50% 62%; }
    .bp-erou::after { background: linear-gradient(180deg, rgba(20, 22, 27, .5) 0%, rgba(20, 22, 27, 0) 20%, rgba(28, 31, 38, 0) 40%, rgb(28, 31, 38) 60%); }
    .v2 .bp-erou__txt h1 { font-size: 38px; }
    .bp-erou__btn .v-btn { flex: 1 1 auto; }
    .bp-cifre b { font-size: 30px; }
    .bp-galerie { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 150px; }
    .bp-galerie__el:nth-child(6), .bp-galerie__el:nth-child(7) { grid-column: span 1; }
    .bp-vol { gap: 8px; padding: 26px 12px 18px; }
    .bp-vol figure { gap: 10px; }
    .bp-vol figcaption span { font-size: 12px; }
    .bp-vol figcaption small { font-size: 10px; white-space: normal; }
    .bp-glazuri { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bp-fisa dl > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .bp-pasi li { grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; }
    .bp-pasi li::before { width: 40px; height: 40px; font-size: 15px; }
}

/* ---------------------------------------------------------------- descrierea produsului (model ceramicaromania.ro, Dan 03.10):
   povestea, materialul, tabelul cu toate volumele (fara linii: randuri alternate), caracteristicile, „Vezi mai mult", GPSR */
.v2 .pd-desc { position: relative; display: grid; }
/* asezare de text (nu grila): intr-o grila stransa (max-height), randul tabelului derulabil se turtea la 0 */
.v2 .pd-desc__in { display: flow-root; }
.v2 .pd-desc__in > * + * { margin-top: 14px; }
.v2 .pd-desc__in p { line-height: 1.65; }
.v2 .pd-desc.is-strans .pd-desc__in { max-height: 420px; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, #000 68%, transparent); mask-image: linear-gradient(180deg, #000 68%, transparent); }
.v2 .pd-mai { justify-self: start; margin-top: 12px; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.v2 .pd-h { margin: 14px 0 0; font-size: 17px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.3; }
.v2 .pd-tabel { overflow-x: auto; border-radius: 12px; }
.v2 .pd-tabel table { width: 100%; border-collapse: collapse; font-size: 14.5px; font-variant-numeric: tabular-nums; }
.v2 .pd-tabel th, .v2 .pd-tabel td { padding: 10px 12px; border: 0; text-align: left; white-space: nowrap; }
.v2 .pd-tabel tbody tr:nth-child(odd) { background: rgba(28, 31, 38, .045); }
.v2 .pd-tabel thead th { font-weight: 700; }
.v2 .pd-tabel th[scope=row] { font-weight: 500; color: var(--ink-60); white-space: normal; }
.v2 .pd-tabel .is-acum { background: rgba(28, 31, 38, .075); font-weight: 700; color: var(--ink); }
.v2 .pd-nota { font-size: 13.5px; line-height: 1.55; color: var(--ink-60); }
.v2 .pd-lista { display: grid; gap: 6px; margin: 0; padding-left: 20px; line-height: 1.55; }
.v2 .pd-gpsr { display: grid; gap: 18px; }
.v2 .pd-gpsr .pd-h { margin-top: 0; margin-bottom: 4px; }
.v2 .pd-gpsr p + p { margin-top: 8px; }
.v2 .pd-gpsr a { text-decoration: underline; text-underline-offset: 3px; }

/* coșul pe telefon (QA PWA 04.10): „×" sus în dreapta rândului (nu singur pe un rând), ținte de 44 px */
@media (max-width: 760px) {
    .v2 .cart-row { grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "media detalii sterge" "media cant pret"; column-gap: 14px; row-gap: 10px; }
    .v2 .cart-media { grid-area: media; align-self: start; }
    .v2 .cart-details { grid-area: detalii; min-width: 0; }
    .v2 .cart-qty { grid-area: cant; justify-content: flex-start; flex-wrap: wrap; }
    .v2 .cart-price { grid-area: pret; }
    .v2 .cart-row > form:last-child { grid-area: sterge; align-self: start; }
    .v2 .cart-remove { width: 44px; height: 44px; margin: -10px -10px 0 0; }
    .v2 .cart-qty .qty-stepper { flex: none; }
    .v2 .qty-stepper.small button { flex: none; width: 44px; height: 44px; }
    .v2 .qty-stepper.small input { flex: none; width: 44px; }
    .v2 .cart-qty .link-btn { padding: 12px 6px; }
}