/* ============================================================
   Cofetăria Prietenia Gustului, Târgu Ocna — demo VisionSite
   (planul de prezentare: catalog fără prețuri + formulare pe WhatsApp)

   Arhetipul e MASA LOR DE FOTOGRAFIAT. Toate pozele de pe pagina lor
   de Facebook sunt făcute în același colț: peretele cu tapet floral
   crem, banda lila de la jumătatea peretelui și, sub fiecare tort,
   tăvița de carton aurie cu marginea festonată.

   De aici cele două semnături ale site-ului:
     * FESTONUL AURIU — dinții tăviței, desfășurați în bandă. Tivesc
       antetul, capul cardurilor, rama pozelor și subsolul.
     * TAPETUL — motivul floral al peretelui lor, redesenat ca dală
       care se repetă (assets/img/marca/tapet.svg).

   Paletă măsurată din pozele lor:
     tapet    #D8CBB8  — peretele din spatele torturilor
     lila     #A98099  — banda de pe perete / tortul Minnie
     auriu    #B8862F  — tăvița festonată, tortul „Nuntă de aur”
     zmeură   #9A2A44  — vișinele și fructele de pădure de pe torturi

   Fără coș, fără preț pe fișe, fără plus/minus: catalog + formular.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Onest:wght@300;400;500;600;700&family=Pinyon+Script&display=swap');

:root{
  --ink:#2B2229;
  --ink-soft:#5A4C56;
  --ink-mute:#8B7D86;
  --crem:#F8F3ED;
  --crem-deep:#F0E7DB;
  --hartie:#FFFCF8;
  --tapet:#D8CBB8;
  --lila:#A98099;
  --lila-soft:#F3E8EF;
  --lila-deep:#4E3446;
  --lila-deeper:#3A2434;
  --auriu:#B8862F;
  --auriu-clar:#E3C67E;
  --auriu-pal:#F6EBD4;
  --zmeura:#9A2A44;
  --zmeura-deep:#7A1E34;
  --linie:rgba(43,34,41,.14);
  --linie-soft:rgba(43,34,41,.07);
  --umbra-s:0 10px 26px rgba(43,34,41,.09);
  --umbra-m:0 24px 58px -18px rgba(43,34,41,.34);
  --rad:20px;
  --rad-s:13px;
  --maxw:1220px;
  --f-display:'Cormorant Garamond', Georgia, serif;
  --f-body:'Onest', system-ui, -apple-system, sans-serif;
  --f-script:'Pinyon Script', cursive;
}

*,*::before,*::after{box-sizing:border-box; margin:0; padding:0;}
html,body{background:var(--crem); color:var(--ink); overflow-x:clip;}
html{scroll-behavior:smooth;}
body{font-family:var(--f-body); font-size:16px; line-height:1.65; font-weight:400; -webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-family:var(--f-display); font-weight:600; line-height:1.2; color:var(--ink); letter-spacing:-.004em;}
h1{line-height:1.14;}
h1 em,h2 em,h3 em{font-style:italic; font-weight:500; color:var(--zmeura);}
a{color:inherit; text-decoration:none;}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer;}
img{max-width:100%; display:block;}
ul{list-style:none;}
[hidden]{display:none!important;}
.container{max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,52px);}
:focus-visible{outline:2.5px solid var(--zmeura); outline-offset:3px;}
::selection{background:var(--auriu-clar); color:var(--ink);}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* ============================================================
   SEMNĂTURA 1 — FESTONUL AURIU
   Marginea tăviței de carton pe care stă fiecare tort de-al lor:
   bandă plină + rândul de bombeuri care atârnă sub ea.
   ============================================================ */
.feston{position:relative; height:14px; z-index:4;
  background:linear-gradient(180deg,var(--auriu-clar) 0%,var(--auriu) 62%,#96691F 100%);}
.feston::after{content:''; position:absolute; top:100%; left:0; right:0; height:11px; pointer-events:none;
  background:radial-gradient(circle at 11px 0, #A9761F 10.6px, transparent 11.1px) 0 0/22px 11px repeat-x;}
.feston.sus{transform:rotate(180deg);}
.feston.mic{height:9px;}
.feston.mic::after{height:7px; background:radial-gradient(circle at 7px 0, #A9761F 6.7px, transparent 7.1px) 0 0/14px 7px repeat-x;}
.feston.pe-lila::after{background:radial-gradient(circle at 11px 0, #A9761F 10.6px, transparent 11.1px) 0 0/22px 11px repeat-x;}

/* ============================================================
   SEMNĂTURA 2 — TAPETUL
   Peretele din spatele torturilor lor, redesenat ca dală.
   ============================================================ */
.tapet{background-color:var(--crem-deep); background-image:url('img/marca/tapet.svg'); background-size:190px 190px;}
.tapet-lila{background-color:var(--lila-deep); background-image:url('img/marca/tapet-lila.svg'); background-size:210px 210px;}

/* ============================================================
   SEMNĂTURA 3 — PECETEA
   N-au siglă vectorială, așa că marca e construită aici: medalion
   auriu cu dinți de tăviță, numele în cursivă gravată la mijloc.
   ============================================================ */
.pecete{position:relative; width:100%; aspect-ratio:1/1; container-type:inline-size;
  background:url('img/marca/medalion.svg') center/contain no-repeat;
  display:flex; align-items:center; justify-content:center;}
.pecete-arc{position:absolute; inset:0; width:100%; height:100%;}
.pecete-arc text{font-family:var(--f-body); font-weight:700; fill:#8A6321;}
.pecete-mijloc{position:relative; text-align:center; line-height:1; padding:0 16%; margin-top:6cqw;}
.pecete-nume{display:block; font-family:var(--f-script); color:#7A5518; line-height:.94; font-size:20cqw;}
.pecete-sub{display:block; font-family:var(--f-body); font-weight:700; color:#9A7226; text-transform:uppercase;
  font-size:5.4cqw; letter-spacing:.2em;}
.pecete-fir{display:block; height:1px; background:linear-gradient(90deg,transparent,var(--auriu),transparent); margin:6cqw 12% 4cqw;}

/* ============================================================
   SUPRATITLURI ȘI SCRIS DE MÂNĂ
   ============================================================ */
.supratitlu{display:inline-flex; align-items:center; gap:10px; font-size:11.5px; font-weight:700;
  letter-spacing:.24em; text-transform:uppercase; color:var(--auriu);}
.supratitlu::before{content:''; width:26px; height:1.5px; background:var(--auriu);}
.supratitlu.pe-inchis{color:var(--auriu-clar);}
.supratitlu.pe-inchis::before{background:var(--auriu-clar);}
.scris{font-family:var(--f-script); font-size:1.5em; color:var(--zmeura); line-height:1.05;}

/* eticheta de pe topper — pastila care stă în colțul fișelor */
.eticheta-topper{position:absolute; top:11px; left:11px; z-index:2;
  background:var(--hartie); color:var(--ink); border:1px solid var(--auriu);
  font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  padding:5px 11px; border-radius:20px; box-shadow:0 4px 12px -6px rgba(43,34,41,.5);}

/* ============================================================
   RAMA AURIE — poza așezată pe tăviță
   ============================================================ */
.rama-aurie{position:relative; padding:10px; background:linear-gradient(150deg,var(--auriu-pal),#E9D6AC 55%,var(--auriu-clar));
  border-radius:calc(var(--rad) + 8px); box-shadow:var(--umbra-m);}
.rama-aurie > img{border-radius:var(--rad); width:100%; height:100%; object-fit:cover;}
.rama-aurie::after{content:''; position:absolute; inset:4px; border-radius:calc(var(--rad) + 3px);
  border:1px solid rgba(255,255,255,.65); pointer-events:none;}

/* ============================================================
   BUTOANE
   ============================================================ */
.btn,.btn-alb,.btn-linie,.btn-wa,.btn-contur{display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; border-radius:38px; font-weight:600; font-size:14px; letter-spacing:.02em; white-space:nowrap;
  transition:transform .3s cubic-bezier(.16,1,.3,1), background .25s, color .25s, border-color .25s, box-shadow .25s;}
.btn{background:var(--zmeura); color:#fff; box-shadow:0 14px 30px -14px rgba(154,42,68,.8);}
.btn:hover{background:var(--zmeura-deep); transform:translateY(-2px);}
.btn-linie{border:1.6px solid var(--ink); color:var(--ink);}
.btn-linie:hover{border-color:var(--zmeura); color:var(--zmeura); transform:translateY(-2px);}
.btn-alb{background:var(--hartie); color:var(--ink); box-shadow:var(--umbra-s);}
.btn-alb:hover{transform:translateY(-2px); color:var(--zmeura);}
.btn-wa{background:#25D366; color:#fff; box-shadow:0 12px 26px -12px rgba(37,211,102,.7);}
.btn-wa:hover{background:#1EBE5A; transform:translateY(-2px);}
.btn-contur{border:1.6px solid rgba(255,255,255,.5); color:#fff;}
.btn-contur:hover{border-color:#fff; background:rgba(255,255,255,.1); transform:translateY(-2px);}
.btn-mic{padding:11px 20px; font-size:12.5px;}
.btn-lat{width:100%;}
.btn svg,.btn-wa svg,.btn-linie svg,.btn-alb svg,.btn-contur svg{width:17px; height:17px; flex:0 0 auto;}

/* ============================================================
   ANTET
   ============================================================ */
.site-header{position:fixed; top:0; left:0; right:0; z-index:200; transition:background .35s, box-shadow .35s;}
.site-header .bara{padding:12px 0; transition:padding .35s;}
/* Festonul e tivul de sus al paginii, nu al barei: se vede cât timp ești în capul
   paginii și se strânge de îndată ce derulezi, ca bara lipită sus să rămână curată. */
.site-header > .feston{transition:height .32s cubic-bezier(.16,1,.3,1), opacity .28s;}
.site-header.is-scrolled > .feston{height:0; opacity:0;}
.site-header.is-scrolled{background:rgba(248,243,237,.95); backdrop-filter:blur(14px); box-shadow:0 1px 0 var(--linie);}
.site-header.is-scrolled .bara{padding:7px 0;}
.site-header .bara .container{display:flex; align-items:center; justify-content:space-between; gap:18px;}
.marca{display:flex; align-items:center; gap:14px; min-width:0;}
.marca .pecete{width:54px; flex:0 0 auto; transition:width .35s;}
.is-scrolled .marca .pecete{width:44px;}
.marca-text{display:flex; flex-direction:column; line-height:1.12; min-width:0;}
.marca-text strong{font-family:var(--f-display); font-weight:600; font-size:19px; letter-spacing:.005em;}
.marca-text span{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute);}
/* pe prima pagină antetul stă peste tapetul închis: text deschis până la derulare */
.site-header.pe-hero:not(.is-scrolled) .marca-text strong,
.site-header.pe-hero:not(.is-scrolled) .nav-linkuri a{color:var(--crem);}
.site-header.pe-hero:not(.is-scrolled) .marca-text span{color:rgba(248,243,237,.7);}
.site-header.pe-hero:not(.is-scrolled) .burger{background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.38);}
.site-header.pe-hero:not(.is-scrolled) .burger span{background:#fff;}


.nav-linkuri{display:flex; align-items:center; gap:26px; font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;}
.nav-linkuri a{position:relative; padding:5px 0;}
.nav-linkuri a::after{content:''; position:absolute; left:0; right:100%; bottom:0; height:1.8px; background:var(--auriu); transition:right .3s cubic-bezier(.16,1,.3,1);}
.nav-linkuri a:hover::after,.nav-linkuri a.is-activ::after{right:0;}
.nav-linkuri a.is-activ{color:var(--zmeura);}
.nav{display:flex; align-items:center; gap:24px;}
.burger{display:none; width:44px; height:44px; border-radius:50%; border:1.6px solid var(--linie); flex-direction:column;
  align-items:center; justify-content:center; gap:5px; background:var(--hartie);}
.burger span{width:18px; height:1.6px; background:var(--ink); transition:transform .3s, opacity .3s;}
.burger.is-open span:nth-child(1){transform:translateY(6.6px) rotate(45deg);}
.burger.is-open span:nth-child(2){opacity:0;}
.burger.is-open span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg);}

.nav-mobil{position:fixed; inset:0; z-index:190; background:var(--crem); display:flex; flex-direction:column;
  padding:100px 30px 34px; transform:translateY(-101%); opacity:0;
  transition:transform .5s cubic-bezier(.16,1,.3,1), opacity .3s;}
.nav-mobil.is-open{transform:translateY(0); opacity:1;}
.nav-mobil a.nm-link{font-family:var(--f-display); font-size:32px; padding:12px 0; border-bottom:1px solid var(--linie);}
.nav-mobil .nm-jos{margin-top:auto; display:flex; flex-direction:column; gap:11px; font-size:13.5px; color:var(--ink-soft);}

/* ============================================================
   HERO — colțul lor de fotografiat, pe tapet închis
   ============================================================ */
.hero{position:relative; padding:128px 0 0; overflow:hidden;}
.hero-fundal{position:absolute; inset:0; background-color:var(--lila-deep); background-image:url('img/marca/tapet-lila.svg'); background-size:210px 210px;}
.hero-fundal::before{content:''; position:absolute; left:0; right:0; bottom:-11px; height:11px; z-index:2;
  background:radial-gradient(circle at 11px 0, var(--lila-deep) 10.6px, transparent 11.1px) 0 0/22px 11px repeat-x;}
.hero-fundal::after{content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(58,36,52,.5) 0%, rgba(58,36,52,0) 42%, rgba(58,36,52,.35) 100%);}
.hero-grid{position:relative; z-index:3; display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(28px,4.6vw,64px); align-items:center; padding-bottom:clamp(48px,6vw,80px);}
.hero-grid > *{min-width:0;}
.hero-copy{padding-top:14px;}
.hero h1{color:var(--crem); font-size:clamp(34px,4.7vw,60px); max-width:15ch; text-wrap:balance; margin-top:16px;}
.hero h1 em{color:var(--auriu-clar);}
.hero .lead{color:rgba(248,243,237,.85); font-size:clamp(15.5px,1.6vw,18px); max-width:44ch; margin-top:18px; line-height:1.75;}
.hero-butoane{display:flex; flex-wrap:wrap; gap:12px; margin-top:30px;}
.hero-foto{position:relative;}
.hero-foto .rama-aurie{aspect-ratio:4/5;}
.hero-pecete{position:absolute; left:-34px; bottom:-30px; width:clamp(96px,11vw,132px); z-index:4;
  filter:drop-shadow(0 16px 30px rgba(43,34,41,.4));}
.hero-jos{position:relative; z-index:3;}

/* ============================================================
   MARCHIZA — ce se face la ei, în cuvintele lor
   ============================================================ */
.marquee-wrap{position:relative; z-index:3; overflow:hidden; background:var(--lila-deeper);}
.marquee{overflow:hidden; white-space:nowrap; padding-block:14px; display:flex; align-items:center;}
.marquee-track{display:inline-flex; animation:marquee var(--mq-dur,30s) linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee span{font-family:var(--f-display); font-style:italic; font-size:1.15rem; color:var(--crem);
  padding-inline:1.1em; display:inline-flex; align-items:center; gap:1.1em;}
.marquee span::after{content:''; width:6px; height:6px; border-radius:50%; background:var(--auriu-clar); display:inline-block;}
@keyframes marquee{from{transform:translateX(0);} to{transform:translateX(calc(-1 * var(--mq-w,50%)));}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;}}

/* ============================================================
   SECȚIUNI
   ============================================================ */
.sectiune{padding:clamp(62px,9vw,104px) 0;}
.sectiune.strans{padding:clamp(44px,6vw,70px) 0;}
.sectiune.pe-crem-adanc{background:var(--crem-deep);}
.sectiune.pe-inchis{background:var(--lila-deep); color:var(--crem);}
.sectiune.pe-inchis h2,.sectiune.pe-inchis h3{color:var(--crem);}
.cap-sectiune{display:flex; align-items:flex-end; justify-content:space-between; gap:28px; flex-wrap:wrap; margin-bottom:clamp(32px,4vw,50px);}
.cap-sectiune > div{min-width:0;}
.cap-sectiune h2{font-size:clamp(31px,4.4vw,54px); max-width:17ch; margin-top:14px;}
.cap-sectiune p{color:var(--ink-soft); max-width:42ch; font-size:15px; line-height:1.75;}
.sectiune.pe-inchis .cap-sectiune p{color:rgba(248,243,237,.72);}
.centrat{text-align:center;}
.centrat .cap-sectiune{flex-direction:column; align-items:center;}
.centrat .cap-sectiune h2,.centrat .cap-sectiune p{margin-inline:auto;}

/* ============================================================
   TREI PILONI
   ============================================================ */
.piloni{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.4vw,26px);}
.piloni > *{min-width:0;}
.pilon{position:relative; background:var(--hartie); border:1px solid var(--linie); border-radius:var(--rad); padding:32px 26px 28px; overflow:hidden;}
.pilon > .feston{position:absolute; top:0; left:0; right:0; height:7px;}
.pilon > .feston::after{height:6px; background:radial-gradient(circle at 6px 0, #A9761F 5.7px, transparent 6.1px) 0 0/12px 6px repeat-x;}
.pilon-nr{font-family:var(--f-display); font-style:italic; font-size:18px; color:var(--auriu); margin-top:12px; display:block;}
.pilon h3{font-size:24px; margin:8px 0 9px;}
.pilon p{font-size:14.5px; color:var(--ink-soft); line-height:1.72;}

/* ============================================================
   FIȘE DE PRODUS — fără preț, fără buton (plan de prezentare)
   ============================================================ */
.filtre{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:clamp(24px,3vw,36px);}
.filtru{padding:11px 20px; border-radius:30px; border:1.6px solid var(--linie); background:var(--hartie);
  font-size:13px; font-weight:600; transition:all .22s;}
.filtru:hover{border-color:var(--auriu);}
.filtru.is-on{background:var(--lila-deep); border-color:var(--lila-deep); color:var(--crem);}
.filtru b{font-weight:600; opacity:.5; margin-left:.45em; font-size:.85em;}

.grid-produse{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.7vw,20px);}
.grid-produse > *{min-width:0;}
.fisa{position:relative; min-width:0; background:var(--hartie); border:1px solid var(--linie); border-radius:var(--rad-s);
  overflow:hidden; display:flex; flex-direction:column; cursor:pointer;
  transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s, border-color .3s;}
.fisa:hover{transform:translateY(-5px); box-shadow:var(--umbra-m); border-color:transparent;}
.fisa-foto{position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--crem-deep);}
.fisa-foto img{width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.16,1,.3,1);}
.fisa:hover .fisa-foto img{transform:scale(1.06);}
.fisa-corp{padding:15px 16px 18px; display:flex; flex-direction:column; gap:6px; flex:1;}
.fisa-corp h3{font-size:1.28rem; line-height:1.22;}
.fisa-nota{font-size:.85rem; color:var(--ink-mute); line-height:1.6; flex:1;}
.fisa-fel{font-size:10.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--auriu);}

.si-mai{display:flex; flex-wrap:wrap; gap:9px; margin-top:26px; align-items:center;}
.si-mai b{font-size:12px; letter-spacing:.15em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; margin-right:4px;}
.si-mai span{padding:8px 15px; border:1.5px dashed var(--linie); border-radius:24px; font-size:13px; color:var(--ink-soft);}

.gol-filtru{padding:40px 0; color:var(--ink-mute); font-size:15px;}

/* ---- lightbox ---- */
.lightbox{position:fixed; inset:0; z-index:400; background:rgba(43,34,41,.94); display:flex; align-items:center; justify-content:center;
  padding:24px; opacity:0; pointer-events:none; transition:opacity .3s;}
.lightbox.is-open{opacity:1; pointer-events:auto;}
.lightbox figure{max-width:min(680px,92vw);}
.lightbox img{width:100%; max-height:72vh; object-fit:contain; border-radius:var(--rad-s);}
.lightbox figcaption{color:var(--crem); text-align:center; margin-top:14px; font-family:var(--f-display); font-size:21px;}
.lightbox-x{position:absolute; top:20px; right:24px; width:44px; height:44px; border-radius:50%; background:rgba(248,243,237,.14);
  color:var(--crem); font-size:20px; display:flex; align-items:center; justify-content:center;}
.lightbox-x:hover{background:rgba(248,243,237,.26);}

/* ============================================================
   PANOU DE POVESTE
   ============================================================ */
.duo{display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,72px); align-items:center;}
.duo > *{min-width:0;}
.duo.ingust-stanga{grid-template-columns:.88fr 1.12fr;}
.duo-foto{position:relative;}
.duo-foto .rama-aurie{aspect-ratio:4/5;}
.duo-foto.lat .rama-aurie{aspect-ratio:4/3;}
.duo-text h2{font-size:clamp(29px,3.8vw,46px); margin:14px 0 18px;}
.duo-text p{color:var(--ink-soft); font-size:15.5px; line-height:1.85;}
.sectiune.pe-inchis .duo-text p{color:rgba(248,243,237,.78);}
.duo-text p + p{margin-top:13px;}

.citat{margin:26px 0 0; padding:22px 24px; background:var(--lila-soft); border-left:3px solid var(--auriu); border-radius:0 var(--rad-s) var(--rad-s) 0;}
.citat p{font-family:var(--f-display); font-style:italic; font-size:19px; color:var(--ink); line-height:1.6;}
.citat cite{display:block; margin-top:10px; font-family:var(--f-body); font-style:normal; font-size:11px;
  letter-spacing:.15em; text-transform:uppercase; color:var(--auriu); font-weight:700;}
.sectiune.pe-inchis .citat{background:rgba(227,198,126,.12); border-left-color:var(--auriu-clar);}
.sectiune.pe-inchis .citat p{color:var(--crem);}
.sectiune.pe-inchis .citat cite{color:var(--auriu-clar);}

.semnatura-foto{position:absolute; right:-12px; bottom:-16px; background:var(--hartie); border:1px solid var(--linie);
  border-radius:16px; padding:12px 20px; box-shadow:var(--umbra-s); text-align:center;}
.semnatura-foto .sf-nume{display:block; font-family:var(--f-script); font-size:30px; color:var(--zmeura);
  line-height:1; text-transform:none; letter-spacing:0;}
.semnatura-foto span:not(.sf-nume){display:block; font-size:10px; letter-spacing:.17em; text-transform:uppercase; color:var(--ink-mute); margin-top:5px;}

/* ============================================================
   PAȘII UNEI COMENZI DE TORT
   ============================================================ */
.pasi{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,2vw,22px); counter-reset:pas;}
.pasi > *{min-width:0;}
.pas{position:relative; padding:26px 22px 24px; background:rgba(255,255,255,.05); border:1px solid rgba(227,198,126,.24); border-radius:var(--rad);}
.pas-nr{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%;
  border:1px solid var(--auriu-clar); color:var(--auriu-clar); font-family:var(--f-display); font-size:19px; font-weight:600;}
.pas h3{font-size:20px; margin:14px 0 8px;}
.pas p{font-size:14px; color:rgba(248,243,237,.72); line-height:1.68;}

/* ============================================================
   REPERE (numai ce se poate verifica pe pagina lor)
   ============================================================ */
.repere{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.repere > *{min-width:0;}
.reper{text-align:center;}
.reper .r-mare{font-family:var(--f-display); font-size:clamp(32px,4.4vw,54px); color:var(--auriu-clar); font-weight:600; line-height:1;}
.reper span{display:block; margin-top:8px; font-size:13px; color:rgba(248,243,237,.74); line-height:1.55; max-width:22ch; margin-inline:auto;}

/* ============================================================
   RECENZII — cuvintele clienților lor, de pe pagina de Facebook
   ============================================================ */
.recenzii{display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:clamp(14px,2vw,22px);
  max-width:900px; margin-inline:auto;}
.recenzii > *{min-width:0;}
.recenzie{position:relative; background:var(--hartie); border:1px solid var(--linie); border-radius:var(--rad); padding:30px 26px 26px;}
.recenzie::before{content:'”'; position:absolute; top:6px; right:20px; font-family:var(--f-display); font-size:74px; color:var(--auriu-pal); line-height:1;}
.recenzie p{position:relative; font-family:var(--f-display); font-style:italic; font-size:18.5px; line-height:1.55; color:var(--ink);}
.recenzie footer{margin-top:16px; font-size:11.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-mute); font-weight:600;}
.stele{color:var(--auriu); letter-spacing:.14em; font-size:14px; margin-bottom:12px;}

/* ============================================================
   MOZAIC DE VITRINĂ
   ============================================================ */
.mozaic{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:clamp(118px,14.6vw,186px); gap:clamp(10px,1.4vw,16px);}
.mozaic > *{min-width:0;}
.mz{position:relative; overflow:hidden; border-radius:var(--rad-s); background:var(--crem-deep); cursor:pointer;}
.mz img{width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.16,1,.3,1);}
.mz:hover img{transform:scale(1.06);}
/* celula mare are nevoie de aspect-ratio explicit, altfel o poză portret
   dictează înălțimea rândurilor și rămân goluri sub celulele mici */
.mz.mare{grid-column:span 2; grid-row:span 2;}

/* ============================================================
   FIȘA DE COMANDĂ — pleacă pe WhatsApp
   ============================================================ */
.fisa-comanda{position:relative; background:var(--hartie); border:1px solid var(--linie); border-radius:var(--rad);
  padding:clamp(26px,4vw,44px); overflow:hidden;}
.fisa-comanda > .feston{position:absolute; top:0; left:0; right:0;}
.fc-cap{display:flex; justify-content:space-between; align-items:flex-start; gap:18px; flex-wrap:wrap; margin:22px 0 24px;}
.fc-cap h2{font-size:clamp(27px,3.4vw,40px); max-width:18ch;}
.fc-cap p{font-size:14.5px; color:var(--ink-soft); max-width:40ch; margin-top:10px;}
.fc-nr{font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; white-space:nowrap;}
.f-grid{display:grid; grid-template-columns:1fr 1fr; gap:17px;}
.f-grid > *{min-width:0;}
.f-rand{display:flex; flex-direction:column; gap:7px;}
.f-rand.tot{grid-column:1/-1;}
.f-rand > label{font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft);}
.f-rand input,.f-rand textarea,.f-rand select{font:inherit; font-size:15px; padding:12px 14px; border-radius:11px;
  border:1.6px solid var(--linie); background:var(--crem); color:var(--ink); width:100%;}
.f-rand input:focus,.f-rand textarea:focus,.f-rand select:focus{outline:none; border-color:var(--zmeura);}
.f-rand textarea{resize:vertical; min-height:106px;}
.f-ajutor{font-size:12.5px; color:var(--ink-mute);}
.bife{display:flex; flex-wrap:wrap; gap:8px;}
/* eticheta stă pe un singur rând, altfel pastila se umflă și iese ovală */
.bifa{display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border:1.6px solid var(--linie); border-radius:28px;
  font-size:12.5px; font-weight:600; color:var(--ink-soft); cursor:pointer; transition:all .2s; white-space:nowrap;}
.bifa input{accent-color:var(--zmeura);}
.bifa:has(input:checked){background:var(--lila-soft); border-color:var(--auriu); color:var(--ink);}
.fc-jos{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-top:24px;}
.fc-jos p{font-size:13.5px; color:var(--ink-mute); max-width:46ch;}
.fc-eroare{color:#9A2A17; font-size:13.5px; margin-top:12px;}

/* ============================================================
   CONTACT
   ============================================================ */
.carduri-contact{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,22px);}
.carduri-contact > *{min-width:0;}
.card-contact{padding:30px 26px; background:var(--hartie); border:1px solid var(--linie); border-radius:var(--rad); text-align:center;}
.card-contact .cc-ico{width:48px; height:48px; margin:0 auto 15px; border-radius:50%; background:var(--lila-soft);
  display:flex; align-items:center; justify-content:center; color:var(--zmeura);}
.card-contact .cc-ico svg{width:21px; height:21px;}
.card-contact h3{font-size:21px; margin-bottom:8px;}
.card-contact p{font-size:14.5px; color:var(--ink-soft); line-height:1.7;}
.card-contact a:hover{color:var(--zmeura);}

.tabel-program{width:100%; border-collapse:collapse; max-width:430px;}
.tabel-program tr{border-bottom:1px solid var(--linie);}
.tabel-program tr:last-child{border-bottom:none;}
.tabel-program td{padding:12px 4px; font-size:14.5px;}
.tabel-program td:first-child{color:var(--ink-soft); font-weight:600;}
.tabel-program td:last-child{text-align:right; font-weight:600;}
.tabel-program tr.is-azi{color:var(--zmeura);}
.tabel-program tr.is-azi td{font-weight:700;}
.stare-program{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:#1B7F3B; margin-bottom:14px;}
.stare-program::before{content:''; width:8px; height:8px; border-radius:50%; background:#1B7F3B;}
.stare-program.is-inchis{color:var(--zmeura);}
.stare-program.is-inchis::before{background:var(--zmeura);}
.harta{border-radius:var(--rad); overflow:hidden; box-shadow:var(--umbra-s); aspect-ratio:16/10; border:0; width:100%;}
.nota-mica{font-size:12.5px; color:var(--ink-mute); margin-top:12px; line-height:1.6;}

/* ============================================================
   CTA
   ============================================================ */
.cta{position:relative; padding:clamp(70px,10vw,116px) 0; text-align:center; background:var(--lila-deeper); color:var(--crem); overflow:hidden;}
.cta h2{color:var(--crem); font-size:clamp(32px,5.2vw,58px); max-width:17ch; margin:16px auto 0;}
.cta p{color:rgba(248,243,237,.76); max-width:46ch; margin:18px auto 0; font-size:15.5px;}
.cta-butoane{display:flex; justify-content:center; gap:14px; margin-top:32px; flex-wrap:wrap;}
.cta-cerc{position:absolute; border:1px solid rgba(227,198,126,.18); border-radius:50%; pointer-events:none;}
.cta-cerc.c1{width:520px; height:520px; top:-260px; left:-150px;}
.cta-cerc.c2{width:320px; height:320px; bottom:-180px; right:-90px;}

/* ============================================================
   SUBSOL
   ============================================================ */
.site-footer{background:var(--lila-deep); color:var(--crem); padding:0 0 26px;}
.footer-grid{display:grid; grid-template-columns:1.35fr 1fr 1fr; gap:44px; padding-top:62px;}
.footer-grid > *{min-width:0;}
.footer-marca{display:flex; align-items:flex-start; gap:16px;}
.footer-marca .pecete{width:82px; flex:0 0 auto;}
.footer-marca-text strong{font-family:var(--f-display); font-size:21px; display:block;}
.footer-marca-text p{margin-top:7px; color:rgba(248,243,237,.62); font-size:14px; line-height:1.7; max-width:32ch;}
.footer-col h4{font-size:11px; letter-spacing:.17em; text-transform:uppercase; color:var(--auriu-clar); margin-bottom:15px; font-weight:700; font-family:var(--f-body);}
.footer-col ul{display:flex; flex-direction:column; gap:9px; font-size:14.5px; color:rgba(248,243,237,.8);}
.footer-col a:hover{color:var(--auriu-clar);}
.footer-jos{margin-top:50px; padding-top:22px; border-top:1px solid rgba(248,243,237,.14); display:flex;
  justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:12.5px; color:rgba(248,243,237,.5);}

.insigna-demo{position:fixed; left:18px; bottom:18px; z-index:150; display:inline-flex; align-items:center; gap:9px;
  padding:10px 17px; border-radius:30px; background:var(--zmeura); color:#fff; font-size:12px; font-weight:600;
  box-shadow:var(--umbra-m);}
.insigna-demo::before{content:''; width:7px; height:7px; border-radius:50%; background:var(--auriu-clar);}
.insigna-demo:hover{background:var(--zmeura-deep);}

/* ============================================================
   ANTET DE PAGINĂ INTERIOARĂ
   ============================================================ */
.antet-pagina{padding:126px 0 0; position:relative;}
.antet-grid{display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(26px,4.5vw,56px); align-items:center; padding-bottom:clamp(44px,6vw,72px);}
.antet-grid > *{min-width:0;}
.firimituri{font-size:12.5px; color:var(--ink-mute); margin-bottom:10px;}
.firimituri a:hover{color:var(--zmeura);}
.antet-pagina h1{font-size:clamp(35px,5.2vw,58px); margin-top:12px;}
.antet-pagina .lead{margin-top:14px; color:var(--ink-soft); max-width:52ch; font-size:15.5px; line-height:1.78;}
.antet-foto .rama-aurie{aspect-ratio:4/3;}

/* ============================================================
   404
   ============================================================ */
.negasit{min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:150px 20px 70px;}
.negasit .pecete{width:120px; margin-bottom:26px;}
.negasit h1{font-size:clamp(66px,14vw,150px); color:var(--zmeura); line-height:1;}
.negasit p{margin-top:14px; color:var(--ink-soft); font-size:16px; max-width:44ch;}
.negasit .btn{margin-top:28px;}

/* ============================================================
   UTILITARE
   ============================================================ */
.reveal{opacity:0; transform:translateY(26px);}
.toast{position:fixed; left:50%; bottom:24px; transform:translate(-50%,150%); background:var(--lila-deep); color:var(--crem);
  padding:14px 24px; border-radius:30px; font-size:13.5px; z-index:600; box-shadow:var(--umbra-m);
  transition:transform .4s cubic-bezier(.16,1,.3,1); max-width:88vw; text-align:center;}
.toast.is-sus{transform:translate(-50%,0);}
.incarcator{position:fixed; inset:0; z-index:500; background:var(--crem); display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:16px; transition:opacity .5s, visibility .5s;}
.incarcator .pecete{width:118px; animation:plutire 1.7s ease-in-out infinite;}
.incarcator p{font-family:var(--f-script); font-size:26px; color:var(--zmeura);}
.incarcator.is-ascuns{opacity:0; visibility:hidden; pointer-events:none;}
@keyframes plutire{0%,100%{transform:translateY(0);} 50%{transform:translateY(-9px);}}
@media (prefers-reduced-motion:reduce){.incarcator .pecete{animation:none;} html{scroll-behavior:auto;}}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1000px){
  .nav-linkuri{display:none;}
  .burger{display:flex;}
  .piloni{grid-template-columns:1fr;}
  .pasi{grid-template-columns:repeat(2,1fr);}
  .duo,.duo.ingust-stanga{grid-template-columns:1fr;}
  .duo-foto{max-width:460px; margin-inline:auto;}
  .semnatura-foto{right:4px;}
  .hero-grid{grid-template-columns:1fr; gap:34px;}
  
  .hero h1{max-width:16ch;}
  .hero-foto{max-width:440px; margin-inline:auto; width:100%;}
  .hero-pecete{left:auto; right:-18px; bottom:-24px;}
  .antet-grid{grid-template-columns:1fr; text-align:center;}
  .antet-foto{max-width:460px; margin-inline:auto; width:100%;}
  .antet-pagina .lead{margin-inline:auto;}
  .carduri-contact,.recenzii{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr; row-gap:34px;}
  .repere{grid-template-columns:repeat(2,1fr); gap:28px 18px;}
  .grid-produse{grid-template-columns:repeat(3,1fr);}
}

@media (max-width:760px){
  .marca-text{display:none;}
  .grid-produse{grid-template-columns:repeat(2,1fr);}
  .mozaic{grid-template-columns:repeat(2,1fr); grid-auto-rows:43vw;}
  .mz.mare{grid-column:span 2; grid-row:span 1; aspect-ratio:auto;}
  .pasi{grid-template-columns:1fr;}
  .f-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr; gap:30px;}
  .footer-jos{flex-direction:column; align-items:flex-start;}
  .tabel-program{max-width:none;}
  .hero{padding-top:112px;}
}

@media (max-width:430px){
  .marca .pecete{width:46px;}
  .fisa-corp{padding:12px 13px 14px;}
  .fisa-corp h3{font-size:1.08rem;}
  .fisa-nota{display:none;}
  .insigna-demo{left:12px; bottom:12px; padding:9px 13px; font-size:11px;}
  .btn,.btn-linie,.btn-alb,.btn-wa,.btn-contur{padding:14px 22px; font-size:13.5px;}
  .hero-pecete{width:88px; right:-8px;}
}