/* ia-comanda.ro · stilul paginii de prezentare
   Fonturi locale (fără internet): Fraunces (titluri) + Inter (text), aceleași ca în meniul clienților. */

@font-face{font-family:'Fraunces';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../fonts/fraunces-normal-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../fonts/fraunces-normal-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400 700;font-display:swap;
  src:url(../fonts/fraunces-italic-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400 700;font-display:swap;
  src:url(../fonts/fraunces-italic-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../fonts/inter-normal-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../fonts/inter-normal-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  --crem:#F6F1E8;
  --crem-2:#FBF8F2;
  --verde:#2F4B3C;
  --verde-inchis:#233A2E;
  --teracota:#A4603E;
  --teracota-inchis:#8A4C2F;
  --salvie:#CBD8C4;
  --salvie-2:#B6C9AE;
  --salvie-inchis:#7E9C79;
  --text:#5C665F;
  --text-slab:#8B918A;
  --maro-cald:#8C6A4D;
  --umbra:0 30px 60px -28px rgba(35,58,46,.5);
  --rotund:999px;
  --latime:1200px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:'Inter',system-ui,sans-serif;color:var(--text);background:var(--crem);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--teracota);outline-offset:3px}
.invelis{max-width:var(--latime);margin:0 auto;padding:0 32px}
h1,.sigla strong,.nota{font-family:'Fraunces',Georgia,serif;font-optical-sizing:auto;color:var(--verde-inchis)}

/* ── bara de sus ─────────────────────────────────────────── */
.bara{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 32px}
.sigla{display:flex;flex-direction:column;line-height:1}
.sigla strong{font-size:26px;font-weight:600;letter-spacing:-.01em}
.sigla small{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--text-slab);margin-top:6px;padding-left:2px}
.meniu-bara{display:flex;gap:28px;list-style:none}
.meniu-bara a{font-size:15px;color:var(--verde-inchis);opacity:.85}
.meniu-bara a:hover{opacity:1}

/* ── butoane ─────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:var(--rotund);font-weight:600;font-size:15px;line-height:1;border:1.5px solid transparent;transition:background .2s,color .2s,transform .15s;white-space:nowrap}
.btn svg{width:18px;height:18px;flex:none}
.btn-plin{background:var(--verde);color:#fff}
.btn-plin:hover{background:var(--verde-inchis)}
.btn-teracota{background:var(--teracota);color:#fff}
.btn-teracota:hover{background:var(--teracota-inchis)}
.btn-contur{border-color:var(--teracota);color:var(--teracota-inchis)}
.btn-contur:hover{background:rgba(164,96,62,.08)}
.btn:active{transform:translateY(1px)}

/* ── secțiunea de sus ────────────────────────────────────── */
/* ca în macheta lui: scena iese din coloană și se întinde până la marginea din dreapta a ferestrei, telefonul mare pe ea,
   nota sus-dreapta lângă telefon, suportul QR jos-dreapta */
/* înălțimea urmează telefonul (38% din scenă, scena = jumătatea din dreapta a ferestrei): 1280 -> 626, 1440 -> 689, 1920 -> 840 */
.sus-cadru{--sus-h:min(840px,calc(39.4vw + 122px));position:relative;min-height:var(--sus-h);overflow:hidden}   /* poza iese peste margine; aici se taie, nu în pagină */
.sus{display:grid;grid-template-columns:minmax(0,560px) 1fr;align-items:center;padding:30px 32px 56px;min-height:var(--sus-h)}
.sus-text{max-width:560px}
.eticheta{font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--maro-cald);font-weight:600;margin-bottom:22px}
h1{font-size:clamp(2.6rem,5vw,4.3rem);line-height:1.04;font-weight:500;letter-spacing:-.015em;font-variation-settings:"opsz" 144}
h1 em{font-style:normal;color:var(--teracota-inchis)}
.intro{font-size:17.5px;line-height:1.6;margin:26px 0 34px;max-width:470px}
.butoane{display:flex;flex-wrap:wrap;gap:14px}
.bife{display:flex;flex-wrap:wrap;gap:16px 30px;margin-top:38px;list-style:none;font-size:13.5px}
.bife li{display:flex;align-items:center;gap:9px}
.bife svg{width:20px;height:20px;color:var(--salvie-inchis)}

/* partea vizuală: poza lui Alex (masa cu suportul QR, decupată ca o pată), telefonul cu meniul real peste ea, nota */
/* scena pornește de la mijlocul paginii (chiar după coloana de text, Alex: «să apropiem») și ține până la marginea din
   dreapta; pe monitoare late se oprește la 940 px, dar poza iese 6% peste ea */
.sus-vizual{position:absolute;left:calc(50vw - 40px);top:0;width:min(calc(50vw + 40px),940px);height:100%;pointer-events:none}
@media (max-width:1200px){.sus-vizual{left:calc(50vw + 10px);width:calc(50vw - 10px)}}   /* titlul mai are nevoie de loc */
.sus-scena{position:relative;width:100%;height:100%}
/* poza e lată cât scena și iese 6% peste marginea ei din dreapta (pata tăiată de fereastră, ca în machetă). În poză, florile
   sunt la 10-25% din lățime, suportul QR la 50-60%: telefonul stă între ele, la procente din scenă, ca așezarea să fie
   aceeași la orice lățime (scena 10%..48% = poza 4%..42%) */
.scena-poza{position:absolute;right:-6%;top:110px;width:100%;max-width:none;height:auto;z-index:1}

.telefon{position:absolute;left:10%;top:60px;width:38%;aspect-ratio:276/572;z-index:3;
  border-radius:46px;background:#17191c;padding:11px;
  box-shadow:var(--umbra),0 0 0 1px rgba(255,255,255,.08) inset}
.telefon::before{content:"";position:absolute;left:50%;top:22px;width:84px;height:24px;margin-left:-42px;border-radius:14px;background:#0c0d0f;z-index:2}
.ecran{width:100%;height:100%;border-radius:36px;overflow:hidden;background:#F5F2EB;padding-top:34px}  /* banda de stare a telefonului, sub insula camerei */
.ecran img{width:100%;height:calc(100% - 34px);object-fit:cover;object-position:top}

.nota{position:absolute;left:51%;top:120px;width:190px;z-index:4;font-style:italic;font-size:22px;line-height:1.15;transform:rotate(-6deg)}
.nota svg{width:62px;height:54px;margin:4px 0 0 4px;color:var(--verde)}

/* ── secțiunile de după ──────────────────────────────────── */
h2{font-family:'Fraunces',Georgia,serif;font-optical-sizing:auto;color:var(--verde-inchis);font-size:clamp(2rem,3.4vw,2.9rem);line-height:1.08;font-weight:500;letter-spacing:-.012em;font-variation-settings:"opsz" 144}
h3{font-size:15.5px;font-weight:600;color:var(--verde-inchis);line-height:1.3}

/* beneficii */
.sectiune-strip{padding:0 32px 24px}
.beneficii{display:grid;grid-template-columns:repeat(6,1fr);list-style:none;background:var(--crem-2);border:1px solid rgba(35,58,46,.08);border-radius:22px;padding:26px 8px;box-shadow:0 24px 50px -40px rgba(35,58,46,.5)}
.beneficiu{padding:6px 18px;border-right:1px solid rgba(35,58,46,.08)}
.beneficiu:last-child{border-right:0}
.beneficiu p{font-size:13px;line-height:1.5;margin-top:6px}
.ico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;margin-bottom:14px}
.ico svg{width:22px;height:22px}
.ico-verde{background:#E9EEE3;color:var(--salvie-inchis)}
.ico-piersica{background:#F6E6D8;color:var(--teracota)}

/* identitatea restaurantului: cele 4 aspecte reale */
.identitate{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:48px;padding:80px 32px}
.identitate .intro{margin:22px 0 18px}
.lista-bife{list-style:none;margin:0 0 30px;display:grid;gap:10px;font-size:15px}
.lista-bife li{display:flex;gap:10px;align-items:flex-start}
.lista-bife li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--salvie-inchis);margin-top:8px}
.sabloane{position:relative;display:flex;justify-content:center;align-items:flex-start;gap:12px;padding:40px 0 20px}
.pata-mica{position:absolute;inset:10% 4% 6%;border-radius:48% 52% 56% 44% / 46% 42% 58% 54%;background:radial-gradient(circle at 30% 30%,#E3EADC,var(--salvie) 60%,var(--salvie-2));transform:rotate(6deg);z-index:0}
/* crenguța de măslin din poza lui, o singură dată. În poză frunzele sunt întregi sus și în dreapta; tulpina iese din cadru
   jos-stânga (măsurat: 298 px opaci pe marginea de jos, 109 pe cea din stânga). Poza e oglindită, ca frunzele să iasă
   spre stânga, de după primul telefon, iar capătul tăiat al tulpinii rămâne în spatele telefonului și se stinge prin mască. */
.maslin{position:absolute;left:-70px;bottom:-72px;width:270px;height:auto;z-index:1;pointer-events:none;
  transform:scaleX(-1) rotate(8deg);
  -webkit-mask-image:radial-gradient(ellipse 85% 85% at 72% 28%,#000 42%,rgba(0,0,0,.7) 62%,transparent 88%);
  mask-image:radial-gradient(ellipse 85% 85% at 72% 28%,#000 42%,rgba(0,0,0,.7) 62%,transparent 88%)}
.mini{position:relative;z-index:2;width:128px;flex:none;border-radius:22px;background:#17191c;padding:6px;box-shadow:0 24px 44px -24px rgba(35,58,46,.6)}
.mini img{border-radius:17px;width:100%;height:auto;aspect-ratio:390/844;object-fit:cover;object-position:top}
.mini.m1,.mini.m3{transform:translateY(28px)}

/* cum funcționează */
.cum{padding:40px 32px 72px}
.cum-cap{max-width:620px;margin-bottom:36px}
.pasi{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.pasi li{background:var(--crem-2);border:1px solid rgba(35,58,46,.08);border-radius:18px;padding:24px 22px}
.pasi .nr{display:block;font-family:'Fraunces',Georgia,serif;font-size:34px;color:var(--teracota-inchis);line-height:1;margin-bottom:14px}
.pasi p{font-size:14px;line-height:1.55;margin-top:8px}
/* O SINGURĂ ZONĂ (Alex: «pare că am făcut două zone»): un card lat; verdele cu textul, în stânga, curge în poza de pe salvie
   din dreapta, iar telefonul clientului stă pe cusătura dintre ele, deasupra amândurora */
/* ca în macheta lui (31.10.2026): verdele adânc al pozei (#0e2d27..#14352c) cu un luciu pe diagonală, scena tăiată din machetă
   în dreapta, cu marginea stângă topită în verde (mască), și o linie aurie care trece din poză în verde */
.fara-false{position:relative;display:grid;grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);align-items:stretch;margin-top:22px;
  min-height:380px;border-radius:24px;overflow:hidden;color:#fff;isolation:isolate;
  background:radial-gradient(120% 90% at 18% 0%,rgba(66,120,96,.38),transparent 55%),
    linear-gradient(118deg,#123a2f 0%,#0f3129 38%,#0c2924 62%,#11352c 100%);
  box-shadow:0 34px 70px -42px rgba(14,45,39,.7)}
/* linia aurie: un arc subțire care pleacă de jos din stânga textului și urcă spre poză */
.fara-false::before{content:"";position:absolute;left:30%;bottom:-120%;width:120%;height:220%;border-radius:50%;
  border-top:1.5px solid rgba(214,178,106,.55);transform:rotate(-14deg);pointer-events:none;z-index:1}
.fara-false-text{position:relative;z-index:2;padding:40px 12px 40px 48px;display:flex;flex-direction:column;justify-content:center}
.ff-ico{display:grid;place-items:center;width:58px;height:58px;border-radius:14px;margin-bottom:22px;color:#E7EFE6;
  background:linear-gradient(160deg,#3c7056,#24533f);box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 14px 26px -14px rgba(0,0,0,.6)}
.ff-ico svg{width:30px;height:30px}
.fara-false-text h3{color:#fff;font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:clamp(30px,2.9vw,40px);line-height:1.08;white-space:nowrap;
  letter-spacing:-.01em;margin:0 0 18px;padding-bottom:16px;position:relative}
.fara-false-text h3::after{content:"";position:absolute;left:0;bottom:0;width:88px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,#D6B26A,#B88F45)}
.fara-false-text p{color:rgba(255,255,255,.86);font-size:16.5px;line-height:1.6;margin:0;max-width:400px}
.ff-pastila{display:inline-flex!important;align-items:center;gap:10px;align-self:flex-start;margin-top:26px!important;
  padding:11px 20px;border-radius:999px;border:1px solid rgba(201,214,195,.38);background:rgba(255,255,255,.03);
  color:#D9E5D6!important;font-size:15px!important}
.ff-pastila svg{width:20px;height:20px;flex:none;color:#C9D6C3}
/* scena: plină pe înălțime, ancorată în stânga (telefonul), cu marginea stângă topită în verde */
.fara-false-poza{position:relative;z-index:0;margin-left:-4%}
.fara-false-poza img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%);mask-image:linear-gradient(90deg,transparent 0,#000 7%)}

/* preț */
.pret{text-align:center;padding:72px 32px 40px}
.pret .intro{margin:18px auto 30px;max-width:560px}
.pret-carduri{display:grid;grid-template-columns:repeat(2,minmax(0,360px));justify-content:center;gap:18px;text-align:left}
.card{background:var(--crem-2);border:1px solid rgba(35,58,46,.08);border-radius:18px;padding:26px 26px 24px}
.card h3{font-size:18px;font-family:'Fraunces',Georgia,serif;font-weight:500}
.card p{font-size:14.5px;margin:8px 0 18px}
.card-accent{border-color:var(--salvie-inchis);box-shadow:0 20px 40px -30px rgba(35,58,46,.5)}
.card .suma{font-family:'Fraunces',Georgia,serif;font-size:34px;line-height:1;color:var(--verde-inchis);margin:14px 0 6px}
.card .suma .perioada{font-family:'Inter',system-ui,sans-serif;font-size:13px;color:var(--text-slab);margin-left:4px}

/* banda de îndemn */
#demo{padding:32px 32px 0}
/* banda cu pastele și măslinul din poza lui: verdele închis vine din poză, textul stă pe partea stângă, întunecată */
.banda{position:relative;overflow:hidden;color:#fff;border-radius:26px;padding:60px 64px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;
  background:linear-gradient(90deg,rgba(35,58,46,1) 0%,rgba(35,58,46,.94) 42%,rgba(35,58,46,.35) 68%,rgba(35,58,46,0) 100%),var(--verde-inchis) url(../img/banda-medie.avif) right center/cover no-repeat}
@media (min-width:1100px){.banda{background-image:linear-gradient(90deg,rgba(35,58,46,1) 0%,rgba(35,58,46,.94) 42%,rgba(35,58,46,.35) 68%,rgba(35,58,46,0) 100%),url(../img/banda-mare.avif)}}
.banda-text{position:relative;z-index:1}
.banda h2{color:#fff;max-width:620px}
.banda .intro{color:rgba(255,255,255,.8);margin:18px 0 28px}
.eticheta-deschisa{color:#D9C7B0}
.btn-crem{background:var(--crem);color:var(--verde-inchis)}
.btn-crem:hover{background:#fff}
.btn-contur-alb{border-color:rgba(255,255,255,.55);color:#fff}
.btn-contur-alb:hover{background:rgba(255,255,255,.1)}
.bife-deschise{color:rgba(255,255,255,.85);margin-top:30px}
.bife-deschise svg{color:#C9D6C3}

/* subsol */
.subsol{padding:56px 32px 28px}
.subsol-sus{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:start;padding-bottom:28px;border-bottom:1px solid rgba(35,58,46,.12)}
.despre{font-size:14px;max-width:460px;margin-top:16px}
.meniu-subsol{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:flex-end;font-size:14.5px;padding-top:8px}
.meniu-subsol a{color:var(--verde-inchis)}
.subsol-jos{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding-top:22px;font-size:12.5px;color:var(--text-slab)}
.legal{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px}
.legal a:hover{color:var(--verde-inchis)}
.firma{font-size:12px;color:var(--text-slab);margin-top:10px}

/* ── ecrane mici ─────────────────────────────────────────── */
@media (max-width:1040px){
  .bara{flex-wrap:wrap;gap:14px 24px}            /* sigla și butonul pe primul rând, legăturile dedesubt */
  .meniu-bara{order:3;width:100%;gap:22px}
  .sus-cadru{min-height:0}
  .sus{grid-template-columns:1fr;min-height:0;padding-bottom:0}
  .sus-text{max-width:620px}
  .sus-vizual{position:relative;left:auto;right:auto;top:auto;width:576px;max-width:100%;height:620px;margin:0 auto 40px}
  .scena-poza{right:auto;left:-40px;top:56px;width:760px}
  .telefon{left:40px;top:20px;width:276px}
  .nota{left:350px;top:150px;width:170px;font-size:20px}
  .beneficii{grid-template-columns:repeat(3,1fr);row-gap:22px}
  .beneficiu:nth-child(3n){border-right:0}
  .identitate{grid-template-columns:1fr;gap:28px}
  .pasi{grid-template-columns:repeat(2,1fr)}
  .banda{grid-template-columns:1fr;padding:48px 40px}
  .subsol-sus{grid-template-columns:1fr}
  .meniu-subsol{justify-content:flex-start}
}
@media (max-width:640px){
  .invelis{padding-left:20px;padding-right:20px}
  .bara{padding:18px 20px}
  .meniu-bara,.bara .btn{display:none}
  h1 br,h2 br{display:none}
  .sus-vizual{width:100%;height:380px;margin:0 0 16px;overflow:hidden}
  .sus-scena{width:576px;transform:scale(.6);transform-origin:top left}
  .nota{display:none}   /* pe telefon scena e mică și nota ar ieși din ea */
  .scena-poza{width:560px;left:24px;top:110px}
  .telefon{left:16px}
  .beneficii{grid-template-columns:1fr 1fr;padding:18px 4px}
  .beneficiu{border-right:0;padding:10px 12px}
  .identitate{padding:48px 20px}
  .sabloane{flex-wrap:wrap;gap:14px;padding:20px 0}
  .mini{width:calc(50% - 7px)}
  .mini.m1,.mini.m3{transform:none}
  .pasi{grid-template-columns:1fr}
  .fara-false{grid-template-columns:1fr;min-height:0}
  .fara-false-text{padding:32px 24px 8px}
  .fara-false-text h3{white-space:normal}
  .fara-false::before{left:-20%;bottom:-150%;width:180%}
  /* pe telefon scena vine sub text, cu marginea de sus topită în verde */
  .fara-false-poza{margin-left:0;aspect-ratio:1142/638}
  .fara-false-poza img{object-position:center;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%);
    mask-image:linear-gradient(180deg,transparent 0,#000 14%)}
  .maslin{width:200px;left:-70px;bottom:-40px}
  .pret{padding:48px 20px 24px}
  .pret-carduri{grid-template-columns:1fr}
  .banda{padding:36px 24px 230px;border-radius:18px;
    background-image:linear-gradient(180deg,rgba(35,58,46,1) 0%,rgba(35,58,46,1) 48%,rgba(35,58,46,0) 100%),url(../img/banda-mica.avif);
    background-position:center top,right bottom;background-size:100% 100%,auto 60%;background-repeat:no-repeat}
}

/* ANUNȚUL DE PREVIZUALIZARE (31.10.2026): card mic în colțul din dreapta jos, nu acoperă pagina; × îl închide */
.anunt{position:fixed;right:18px;bottom:18px;z-index:1000;width:260px;max-width:calc(100vw - 36px);
  background:var(--crem-2);border:1px solid rgba(35,58,46,.14);border-left:4px solid var(--teracota);border-radius:14px;
  padding:12px 34px 12px 14px;box-shadow:0 10px 30px rgba(35,58,46,.18);animation:anunt-sus .28s cubic-bezier(.2,.8,.2,1)}
.anunt[hidden]{display:none}
@keyframes anunt-sus{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.anunt-eticheta{margin:0 0 2px;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--teracota);font-weight:700}
.anunt-titlu{margin:0 0 2px;font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:17px;line-height:1.2;color:var(--verde-inchis)}
.anunt-text{margin:0;color:var(--text);font-size:13.5px;line-height:1.45}
.anunt-x{position:absolute;top:6px;right:6px;width:26px;height:26px;border:0;border-radius:50%;background:transparent;
  color:var(--verde-inchis);font-size:20px;line-height:1;cursor:pointer;opacity:.6}
.anunt-x:hover,.anunt-x:focus-visible{opacity:1;background:rgba(35,58,46,.08)}


/* ──────────────────────────────────────────────────────────────
   MOBILE REWORK 31.10.2026: only presentation layout; desktop intact.
   ────────────────────────────────────────────────────────────── */
.mobile-nav-toggle{display:none}
@media(max-width:640px){
  html{scroll-behavior:smooth;scroll-padding-top:72px}
  body{overflow-x:clip}
  .invelis{padding-left:22px;padding-right:22px}
  .bara{position:relative;z-index:30;display:flex;flex-wrap:nowrap;align-items:center;gap:10px;padding:18px 22px 16px;border-bottom:1px solid rgba(35,58,46,.08)}
  .sigla strong{font-size:24px;letter-spacing:-.035em}
  .sigla small{font-size:8px;margin-top:5px;letter-spacing:.2em}
  .mobile-nav-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;margin-left:auto;width:42px;height:42px;background:#fff9;border:1px solid rgba(35,58,46,.12);border-radius:13px;cursor:pointer}
  .mobile-nav-toggle span{width:19px;height:2px;background:var(--verde-inchis);border-radius:2px;transition:transform .2s,opacity .2s}
  .mobile-nav-toggle[aria-expanded=true] span:first-child{transform:translateY(7px) rotate(45deg)}
  .mobile-nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
  .mobile-nav-toggle[aria-expanded=true] span:last-child{transform:translateY(-7px) rotate(-45deg)}
  .bara nav{display:none;position:absolute;top:calc(100% - 1px);left:14px;right:14px;padding:14px;background:#FBF8F2;border:1px solid #e6ded0;border-radius:0 0 20px 20px;box-shadow:0 18px 30px #233a2e22}
  .bara nav.nav-open{display:block}
  .meniu-bara{display:flex;flex-direction:column;gap:0;width:100%}
  .meniu-bara a{display:block;padding:12px 14px;font-size:15px;font-weight:500}
  .sus-cadru{overflow:hidden}
  .sus{display:block;min-height:0;padding:43px 22px 0}
  .sus-text{max-width:520px;margin:0 auto}
  .eticheta{font-size:10px;letter-spacing:.19em;margin-bottom:14px;line-height:1.6}
  h1{font-size:clamp(36px,9.4vw,49px);line-height:1.055;letter-spacing:-.036em;font-weight:500}
  h1 br{display:none}
  .sus .intro{font-size:15.5px;line-height:1.65;margin:20px 0 22px;max-width:440px}
  .sus .butoane{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .sus .btn{justify-content:center;padding:13px 12px;font-size:12.5px;gap:6px;white-space:normal;text-align:center;min-height:46px}
  .sus .btn svg{width:16px;height:16px}
  .sus .bife{margin-top:20px;gap:9px 16px;font-size:11.5px}
  .sus .bife li{gap:5px}
  .sus .bife svg{width:15px;height:15px}
  /* Real responsive scale, instead of fixed 576px scene shrunk to 60%. */
  .sus-vizual{position:relative;width:100%;height:auto;aspect-ratio:1.19;margin:20px 0 8px;overflow:visible}
  .sus-scena{position:relative;width:100%;height:100%;transform:none}
  .scena-poza{left:23%;top:12%;width:91%;height:auto;max-width:none}
  .telefon{left:9%;top:2%;width:39%;max-width:188px;aspect-ratio:276/572;padding:5px;border-radius:24px;box-shadow:0 16px 25px -12px #172b2b55}
  .telefon::before{width:36%;height:9px;top:11px;left:32%;margin:0;border-radius:6px}
  .ecran{border-radius:19px;padding-top:16px}
  .ecran img{height:calc(100% - 16px)}
  .nota{display:block;left:55%;top:8%;width:42%;font-size:clamp(16px,4.4vw,21px);transform:rotate(-5deg)}
  .nota svg{width:40px;height:34px;margin-top:5px}
  .sectiune-strip{padding:18px 16px 34px}
  .beneficii{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:9px 8px;border-radius:22px;box-shadow:0 10px 34px -28px #233a2e66}
  .beneficiu{padding:17px 13px 19px;border-right:0;border-bottom:1px solid rgba(35,58,46,.09)}
  .beneficiu:nth-child(odd){border-right:1px solid rgba(35,58,46,.09)}
  .beneficiu:nth-last-child(-n+2){border-bottom:0}
  .ico{width:38px;height:38px;margin-bottom:10px}
  .ico svg{width:19px;height:19px}
  .beneficiu h3{font-size:13.5px;line-height:1.24}
  .beneficiu p{font-size:11.8px;line-height:1.48;margin-top:7px}
  h2{font-size:clamp(31px,8vw,40px);line-height:1.1;letter-spacing:-.025em}
  h2 br{display:none}
  .identitate{display:flex;flex-direction:column;gap:14px;padding:50px 22px 38px}
  .identitate .intro,.pret .intro{font-size:14.5px;line-height:1.65;margin:18px 0}
  .lista-bife{gap:12px;font-size:13px;line-height:1.5;margin:0 0 22px}
  .lista-bife li::before{margin-top:6px}
  .identitate .btn{font-size:13px;padding:13px 19px}
  .sabloane{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:22px 10px 10px;align-items:start}
  .mini{width:100%;margin:0;transform:none!important}
  .pata-mica{inset:9% 0 6%}
  .maslin{width:145px;left:-44px;bottom:-17px}
  .cum{padding:48px 22px 45px}
  .cum-cap{margin-bottom:25px}
  .pasi{grid-template-columns:1fr;gap:0;position:relative;padding-left:22px}
  .pasi::before{content:"";position:absolute;top:29px;bottom:29px;left:5px;width:1px;background:#c5cfc0}
  .pasi li{position:relative;display:grid;grid-template-columns:48px 1fr;gap:3px 12px;padding:17px 17px 17px 18px;margin-bottom:11px;border-radius:15px}
  .pasi li::before{content:"";position:absolute;left:-22px;top:32px;width:11px;height:11px;background:var(--teracota);border:3px solid var(--crem);border-radius:50%}
  .pasi .nr{grid-row:span 2;font-size:29px;margin:0}
  .pasi h3{align-self:end;font-size:14px}
  .pasi p{font-size:12.4px;line-height:1.55;margin:2px 0 0}
  .fara-false{margin-top:25px;border-radius:21px;box-shadow:none}
  .fara-false-text{padding:29px 24px 0}
  .ff-ico{width:45px;height:45px;margin-bottom:17px}
  .ff-ico svg{width:25px;height:25px}
  .fara-false-text h3{font-size:32px;margin-bottom:16px;padding-bottom:13px}
  .fara-false-text p{font-size:13.8px;line-height:1.65}
  .ff-pastila{font-size:11.5px!important;gap:7px;padding:9px 11px;margin-top:17px!important}
  .ff-pastila svg{width:16px;height:16px}
  .fara-false-poza{aspect-ratio:1142/638;margin-top:7px}
  .pret{padding:45px 22px 30px;text-align:left}
  .pret-carduri{gap:12px;margin-top:24px}
  .card{padding:23px;border-radius:17px}
  .card h3{font-size:19px}
  .card p{font-size:13px;line-height:1.55}
  .card .suma{font-size:40px;margin:15px 0}
  .card .btn{font-size:13px}
  #demo{padding:28px 16px 0}
  .banda{border-radius:22px;padding:34px 23px 205px;background-size:100% 100%,auto 54%}
  .banda h2{font-size:34px}
  .banda .intro{font-size:14px;line-height:1.6;margin:16px 0 21px}
  .banda .butoane{display:flex;gap:10px}
  .banda .btn{font-size:12.5px;padding:12px 14px;white-space:normal}
  .banda .bife{margin-top:21px;gap:10px 13px;font-size:11.5px}
  .subsol{padding:43px 22px 25px}
  .subsol-sus{gap:20px;padding-bottom:25px}
  .despre{font-size:13px;line-height:1.65}
  .meniu-subsol{gap:12px 20px;font-size:12.5px}
  .subsol-jos{font-size:11.5px;gap:16px}
  .legal{gap:10px 16px}
  .firma{font-size:10.5px;line-height:1.6;margin-top:17px}
  .anunt{width:230px;right:10px;bottom:10px;padding:10px 30px 10px 12px}
  .anunt-titlu{font-size:15px}
  .anunt-text{font-size:12px}
}
@media(max-width:365px){
  .sus .butoane{grid-template-columns:1fr}
  .sus .btn{font-size:13px}
  .beneficiu{padding:14px 9px}
  .beneficiu h3{font-size:12.5px}
  .nota{font-size:15px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ==============================================================
   SHOWROOM / 8 modele · 31.10.2026
   Separat de stilurile existente; nu modifică alte secțiuni.
   ============================================================= */
.showcase{padding-top:92px;padding-bottom:92px}
.showcase-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin:0 0 36px}
.showcase-heading-text{max-width:710px}
.showcase-heading .eticheta{margin-bottom:17px}
.showcase-heading h2{font-size:clamp(38px,4.2vw,57px);line-height:1.08;letter-spacing:-.033em;max-width:695px}
.showcase-heading h2 em{font-weight:500;color:var(--teracota-inchis)}
.showcase-intro{font-size:16px;line-height:1.75;max-width:620px;margin-top:20px}
.showcase-count{display:flex;align-items:center;gap:12px;padding-bottom:4px;flex:none}
.showcase-count strong{font:500 69px/.9 'Fraunces',Georgia,serif;letter-spacing:-.06em;color:var(--verde-inchis)}
.showcase-count span{font-size:12px;line-height:1.6;color:var(--maro-cald);border-left:1px solid #d5cabc;padding-left:12px}
.showcase-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid #d9d6cb;padding:18px 0 19px;font-size:11px;color:#797e70}
.showcase-meta>span:first-child{font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:var(--verde-inchis);display:inline-flex;align-items:center;gap:9px}
.showcase-meta-dot{width:7px;height:7px;background:var(--teracota);border-radius:50%}
.showcase-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.showcase-card{min-width:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid #e5dfd3;border-radius:18px;background:var(--crem-2);padding:0;text-align:left;font-family:inherit;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}
.showcase-card:hover{transform:translateY(-4px);border-color:#c6b8a1;box-shadow:0 20px 35px -22px rgba(39,56,42,.35)}
.showcase-card:focus-visible{outline:3px solid var(--teracota);outline-offset:3px}
.showcase-art{--art-bg:#e8e2d3;--art-paper:#f8f5ec;--art-ink:#344034;--art-accent:#7a8447;--art-pill:#e1e5d7;--art-radius:8px;--art-family:'Fraunces',Georgia,serif;position:relative;display:block;width:100%;aspect-ratio:1.09;background:var(--art-bg);overflow:hidden;isolation:isolate}
.showcase-art::before{content:"";position:absolute;width:115%;height:90%;left:-40%;top:-50%;border-radius:50%;background:rgba(255,255,255,.18)}
.art-orbit{position:absolute;width:170px;height:170px;border:1px solid rgba(255,255,255,.28);border-radius:50%;right:-78px;bottom:-90px}
.art-browser{position:absolute;left:9%;top:16%;width:74%;height:75%;background:var(--art-paper);border:1px solid #2d261d20;border-radius:7px 7px 3px 3px;box-shadow:0 14px 28px #201b1530;overflow:hidden;display:flex;flex-direction:column}
.art-browser-bar{height:15%;padding:4% 5%;display:flex;align-items:center;gap:3%;border-bottom:1px solid #998f721e;color:var(--art-ink);font-family:var(--art-family);background:var(--art-paper)}
.art-browser-bar i{width:4px;height:4px;background:var(--art-accent);border-radius:50%;opacity:.4;flex:none}
.art-browser-bar b{font-size:clamp(5px,.6vw,8px);line-height:1;white-space:nowrap;margin-left:3%;letter-spacing:-.04em}
.art-browser-bar small{font:600 8px 'Inter',sans-serif;margin-left:auto}
.art-hero{display:flex;flex-direction:column;gap:4%;padding:8% 8% 5%;background:var(--art-paper);color:var(--art-ink)}
.art-hero .art-eyebrow{font-size:5px;letter-spacing:.14em;text-transform:uppercase;opacity:.6}
.art-hero strong{font:600 clamp(13px,1.65vw,23px)/1.05 var(--art-family);letter-spacing:-.035em}
.art-hero em{font-size:6px;font-style:normal;opacity:.65}
.art-nav{display:flex;gap:4px;padding:2% 8% 4%}
.art-nav i{width:19%;height:6px;border-radius:10px;background:var(--art-pill)}
.art-nav i:first-child{background:var(--art-accent)}
.art-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5%;padding:1% 7% 5%}
.art-products>span{display:flex;flex-direction:column;gap:4px;background:#ffffff22;border-radius:var(--art-radius);overflow:hidden}
.art-products img{width:100%;aspect-ratio:1.45;object-fit:cover;border-radius:calc(var(--art-radius) * .5)}
.art-products i{display:block;height:3px;width:76%;background:var(--art-ink);opacity:.25;border-radius:3px}
.art-products i:last-child{width:35%;background:var(--art-accent);opacity:.9}
.art-phone{position:absolute;z-index:2;width:27%;height:68%;right:5.5%;bottom:4%;background:#222621;border-radius:14px;padding:4px;border:1px solid #44483f;box-shadow:-8px 11px 24px #1e242940;display:block;overflow:hidden}
.art-phone::before{content:"";position:absolute;z-index:3;top:5px;left:36%;right:36%;height:5px;background:#222621;border-radius:0 0 6px 6px}
.art-phone-screen{display:flex;flex-direction:column;gap:5px;width:100%;height:100%;background:var(--art-paper);border-radius:10px;overflow:hidden;padding:13px 6px 6px;color:var(--art-ink)}
.art-phone-head{display:flex;justify-content:space-between;gap:3px;font:700 5px var(--art-family);white-space:nowrap;overflow:hidden}
.art-phone-head i{width:6px;height:1px;background:var(--art-accent);flex:none;margin-top:3px;box-shadow:0 2px 0 var(--art-accent),0 4px 0 var(--art-accent)}
.art-phone-title{font:600 9px/1.1 var(--art-family);letter-spacing:-.02em}
.art-phone img{width:100%;height:27%;object-fit:cover;border-radius:3px}
.art-phone-lines{display:flex;flex-direction:column;gap:3px}
.art-phone-lines i{height:3px;width:92%;background:var(--art-ink);opacity:.24;border-radius:4px}
.art-phone-lines i:nth-child(2){width:56%}
.art-phone-lines i:nth-child(3){width:32%;background:var(--art-accent);opacity:.8}
.art-zoom{position:absolute;display:grid;place-items:center;z-index:3;top:9px;right:9px;width:30px;height:30px;border:1px solid #ffffff55;border-radius:50%;background:#fffffff0;color:#263b2d;opacity:0;transform:translateY(5px);transition:opacity .2s,transform .2s}
.art-zoom svg{width:15px;height:15px}
.showcase-card:hover .art-zoom,.showcase-card:focus-visible .art-zoom{opacity:1;transform:none}
.showcase-card-foot{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:16px 16px 18px;min-height:94px}
.showcase-card-info{display:grid;gap:3px}
.showcase-card-no{color:#a07e6a;font-size:10px;letter-spacing:.11em;font-weight:600;margin-bottom:3px}
.showcase-card-no span{color:#a8a69b;font-weight:400}
.showcase-card-info strong{font-family:'Fraunces',Georgia,serif;font-size:21px;line-height:1.1;font-weight:550;color:var(--verde-inchis)}
.showcase-card-info small{font-size:11.5px;color:#8a8e80}
.showcase-card-arrow{display:grid;place-items:center;align-self:end;width:29px;height:29px;border:1px solid #dcd5c8;border-radius:50%;font-size:17px;color:var(--verde-inchis);transition:background .2s,color .2s}
.showcase-card:hover .showcase-card-arrow{background:var(--verde-inchis);color:#fff}
/* Stilurile miniaturilor sunt concepte grafice, nu copii ale altor pagini. */
.skin-oliv{--art-bg:#dbe6d2;--art-paper:#f6f8ef;--art-ink:#445f43;--art-accent:#6e9c6a;--art-pill:#dce8d2;--art-radius:11px;--art-family:'Fraunces',Georgia,serif}
.skin-cafe{--art-bg:#d9c3b5;--art-paper:#f1e9e1;--art-ink:#4d3328;--art-accent:#95694e;--art-pill:#e1d3c7;--art-radius:4px;--art-family:Georgia,serif}
.skin-urban{--art-bg:#f7bd80;--art-paper:#fff2d9;--art-ink:#2d241c;--art-accent:#e86630;--art-pill:#f0d3b0;--art-radius:2px;--art-family:'Inter',sans-serif}
.skin-urban .art-hero strong{font-weight:800;text-transform:uppercase;letter-spacing:-.07em}
.skin-atelier{--art-bg:#dfddda;--art-paper:#fbfaf7;--art-ink:#222320;--art-accent:#a29578;--art-pill:#e9e7df;--art-radius:1px;--art-family:'Fraunces',Georgia,serif}
.skin-atelier .art-hero{padding-top:12%;padding-bottom:10%;text-align:center}
.skin-atelier .art-hero strong{font-weight:400;letter-spacing:.11em}
.skin-forno{--art-bg:#ddad89;--art-paper:#f7eee0;--art-ink:#623f2e;--art-accent:#b05e35;--art-pill:#ebd4bd;--art-radius:9px;--art-family:Georgia,serif}
.skin-forno .art-hero strong{font-style:italic}
.skin-nocturne{--art-bg:#37312e;--art-paper:#24231f;--art-ink:#efe7d8;--art-accent:#c3a06e;--art-pill:#524940;--art-radius:3px;--art-family:'Fraunces',Georgia,serif}
.skin-nocturne .art-browser,.skin-nocturne .art-phone{border-color:#c2a67677}
.skin-nocturne .art-hero strong{font-weight:400;letter-spacing:.04em}
.skin-sunday{--art-bg:#f2cbd1;--art-paper:#fffbef;--art-ink:#914e5b;--art-accent:#db8390;--art-pill:#f7dce2;--art-radius:14px;--art-family:'Inter',sans-serif}
.skin-sunday .art-hero strong{font-weight:800;letter-spacing:-.06em}
.showcase-note{margin-top:24px;display:flex;align-items:center;gap:15px;background:#e9ecdf;border:1px solid #dce3d2;border-radius:17px;padding:17px 23px;color:#3b5143}
.showcase-note-icon{font-family:Georgia,serif;font-size:32px;color:#82977b;line-height:1}
.showcase-note p{font-size:13.5px;line-height:1.55;flex:1}
.showcase-note strong{color:var(--verde-inchis)}
.showcase-device-icons{width:66px;color:#72906f}

/* Overlay de previzualizare: un singur iframe încărcat la cerere. */
body.showcase-locked{overflow:hidden}
.showcase-dialog{position:fixed;inset:0;margin:auto;padding:0;border:0;background:transparent;width:min(1200px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 36px);color:var(--verde-inchis);overflow:hidden;border-radius:21px;box-shadow:0 24px 95px #0a1716aa}
.showcase-dialog::backdrop{background:#121b19ba;backdrop-filter:blur(5px)}
.showcase-dialog[open]{display:flex;flex-direction:column}
.showcase-viewer{display:flex;flex-direction:column;width:100%;max-height:calc(100dvh - 36px);background:#faf8f3;overflow:hidden}
.viewer-topline{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 24px;background:#fdfbf7;border-bottom:1px solid #e9e5db}
.viewer-caption{font-size:9.5px;font-weight:700;letter-spacing:.18em;color:#9b846a}
.viewer-title-block h3{font:500 27px/1.2 'Fraunces',Georgia,serif;margin-top:3px;color:#2e3f32}
.viewer-top-actions{display:flex;align-items:center;gap:7px}
.viewer-icon{display:grid;place-items:center;width:38px;height:38px;font:300 28px/1 'Inter',sans-serif;border:1px solid #dddacf;border-radius:10px;background:#fffdf8;color:#425246;cursor:pointer}
.viewer-icon:hover{background:#edf0e8}
.viewer-close{font-size:25px;margin-left:8px}
.viewer-toolbar{padding:11px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #e9e5db}
.viewer-devices{display:flex;align-items:center;gap:4px;background:#e9e8e0;border-radius:12px;padding:4px}
.viewer-device{display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 14px;border:0;border-radius:9px;background:transparent;color:#6a7368;font:600 12px 'Inter',sans-serif;cursor:pointer}
.viewer-device svg{width:17px;height:17px}
.viewer-device.is-current{background:#fffdf8;color:var(--verde-inchis);box-shadow:0 1px 5px #2235281a}
.viewer-external{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--teracota-inchis)}
.viewer-external svg{width:16px;height:16px}
.viewer-external:hover{text-decoration:underline}
.viewer-stage{height:min(690px,calc(100dvh - 225px));min-height:300px;background:radial-gradient(ellipse 60% 75% at 50% 40%,#e9e6dc,#d9ddd2);display:flex;align-items:flex-start;justify-content:center;overflow:hidden;position:relative;padding-top:16px}
.viewer-stage::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.38;background-image:radial-gradient(#9da69d 0.65px,transparent 0.65px);background-size:17px 17px}
.viewer-device-shell{--frame-scale:1;--frame-width:390px;--frame-height:740px;position:relative;z-index:1;flex:none;width:calc(var(--frame-width) * var(--frame-scale) + 12px);height:calc(var(--frame-height) * var(--frame-scale) + 12px);background:#222820;border:6px solid #222820;border-radius:29px;box-shadow:0 24px 55px -16px #111c1b44;overflow:hidden;transition:border-radius .15s}
.viewer-device-shell.mode-tablet{border-radius:17px}
.viewer-device-shell.mode-desktop{border-radius:10px;border-color:#353a35}
.viewer-phone-camera{position:absolute;z-index:3;top:0;left:36%;right:36%;height:13px;background:#222820;border-radius:0 0 12px 12px;pointer-events:none}
.viewer-device-shell.mode-tablet .viewer-phone-camera,.viewer-device-shell.mode-desktop .viewer-phone-camera{display:none}
.viewer-viewport{position:relative;width:calc(var(--frame-width) * var(--frame-scale));height:calc(var(--frame-height) * var(--frame-scale));overflow:hidden;background:#fff}
.viewer-viewport iframe{display:block;width:var(--frame-width);height:var(--frame-height);border:0;transform:scale(var(--frame-scale));transform-origin:top left;background:#fff}
.viewer-bottom{padding:12px 24px 14px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fdfbf7;border-top:1px solid #e9e5db}
.viewer-bottom strong{display:block;font-size:12px;color:#3b4e3f}
.viewer-bottom p{font-size:11px;color:#8b8d83;margin-top:2px}
.viewer-bottom-counter{display:flex;flex-direction:column;align-items:flex-end;gap:2px;white-space:nowrap}
.viewer-bottom-counter span:first-child{font-size:11px;font-weight:700;color:#5a695e}
.viewer-bottom-counter span:last-child{font-size:10px;color:#a5a79a}
@media(max-width:1040px){
  .showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .showcase-art{aspect-ratio:1.35}
  .art-hero strong{font-size:clamp(20px,2.5vw,27px)}
  .art-browser-bar b{font-size:9px}
}
@media(max-width:640px){
  .showcase{padding:55px 18px 63px}
  .showcase-heading{display:block;margin-bottom:25px}
  .showcase-heading h2{font-size:clamp(34px,8.7vw,44px);max-width:440px}
  .showcase-heading .eticheta{margin-bottom:13px}
  .showcase-intro{font-size:14px;line-height:1.65;margin-top:15px}
  .showcase-count{display:none}
  .showcase-meta{font-size:10px;gap:9px;padding:13px 0}
  .showcase-meta>span:last-child{font-size:10px;text-align:right;max-width:145px}
  .showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
  .showcase-card{border-radius:14px}
  .showcase-art{aspect-ratio:.98}
  .art-browser{top:18%;left:6%;width:77%;height:73%}
  .art-browser-bar{padding:3% 4%}
  .art-browser-bar b{font-size:5px}
  .art-hero{padding:8% 6% 4%}
  .art-hero strong{font-size:clamp(11px,3.9vw,16px)}
  .art-hero .art-eyebrow{font-size:4px}
  .art-hero em{font-size:5px}
  .art-nav{padding:2% 7% 5%}
  .art-phone{right:4%;bottom:4%;width:30%;height:64%;border-radius:10px;padding:3px}
  .art-phone-screen{border-radius:7px;padding:12px 4px 4px;gap:4px}
  .art-phone-title{font-size:7px}
  .art-phone-head{font-size:4px}
  .showcase-card-foot{padding:12px 11px 13px;min-height:77px}
  .showcase-card-no{font-size:9px;margin-bottom:2px}
  .showcase-card-info strong{font-size:clamp(15px,4.2vw,19px)}
  .showcase-card-info small{font-size:10px}
  .showcase-card-arrow{width:25px;height:25px;font-size:15px}
  .showcase-note{padding:15px 15px;gap:9px;margin-top:16px;border-radius:13px}
  .showcase-note p{font-size:12px}
  .showcase-note-icon{font-size:23px}
  .showcase-device-icons{display:none}
  .showcase-dialog{inset:0;width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .showcase-viewer{height:100dvh;max-height:100dvh}
  .viewer-topline{padding:13px 15px}
  .viewer-caption{font-size:8px}
  .viewer-title-block h3{font-size:23px}
  .viewer-top-actions{gap:5px}
  .viewer-icon{width:32px;height:34px;font-size:24px;border-radius:9px}
  .viewer-close{margin-left:3px}
  .viewer-toolbar{padding:9px 12px;gap:5px}
  .viewer-devices{gap:0}
  .viewer-device{font-size:10px;padding:8px 10px;gap:4px}
  .viewer-device svg{height:15px;width:15px}
  .viewer-external{font-size:10px;max-width:95px;gap:3px}
  .viewer-external svg{width:13px;height:13px;flex:none}
  .viewer-stage{height:auto;flex:1;min-height:0;padding-top:10px}
  .viewer-device-shell{border-width:4px;border-radius:21px;box-shadow:0 14px 30px #14271e3d}
  .viewer-device-shell.mode-tablet{border-radius:12px}
  .viewer-device-shell.mode-desktop{border-radius:7px}
  .viewer-bottom{padding:12px 15px 16px}
  .viewer-bottom p{max-width:230px;line-height:1.45}
  .viewer-bottom-counter{display:none}
}
@media(max-width:360px){
 .viewer-device{padding:7px;font-size:9px}
 .viewer-external{font-size:9px;max-width:80px}
 .showcase-card-info strong{font-size:15px}
}
@media(prefers-reduced-motion:reduce){.showcase-card,.art-zoom{transition:none}}
/* Variații de compoziție între cele 8 vignete, nu doar de culoare. */
.skin-oliv .art-products img{border-radius:12px 12px 3px 3px}
.skin-cafe .art-hero{background:linear-gradient(90deg,#554033b9,#55403318),url(../img/poze/MNU-CI2.jpg) center 45%/cover;padding-top:11%;padding-bottom:12%;color:#fff2de;min-height:34%}
.skin-cafe .art-nav{padding-top:5%}
.skin-cafe .art-hero .art-eyebrow{color:#fff2de}
.skin-cafe .art-hero em{color:#fff3e5}
.skin-urban .art-hero{background:#ef6934;color:#271f16;padding:10% 6% 6%;margin:0 5%}
.skin-urban .art-hero .art-eyebrow{color:#271f16}
.skin-urban .art-nav{padding-top:5%}
.skin-atelier .art-nav{justify-content:center;padding:5% 8%}
.skin-atelier .art-products img{filter:grayscale(.75)}
.skin-forno .art-hero{padding-top:6%;padding-bottom:7%}
.skin-forno .art-products{grid-template-columns:1.25fr .75fr;gap:6%}
.skin-forno .art-products>span:nth-child(3){display:none}
.skin-forno .art-products>span:first-child img{aspect-ratio:1.55}
.skin-nocturne .art-hero{padding-top:12%;padding-bottom:9%;text-align:center}
.skin-nocturne .art-products img{filter:brightness(.69) saturate(.72)}
.skin-sunday .art-products img{border-radius:50%;aspect-ratio:1}
.skin-sunday .art-nav i{border-radius:8px}