/* ==========================================================================
   The Special Beauty – foaia de stiluri
   Cuprins: 1. Fonturi  2. Variabile  3. Bază  4. Utilitare  5. Componente
            6. Antet  7. Secțiuni  8. Subsol și butoanele fixe  9. Animații
            10. Mișcare redusă
   Toate culorile, spațierile și fonturile se schimbă DOAR din blocul :root.
   ========================================================================== */

/* 1. Fonturi găzduite local (SIL Open Font License, vezi assets/fonts/OFL-*.txt).
   Fiecare font are două fișiere: „latin” și „latin-ext” (ă, ș, ț). Browserul
   descarcă doar fișierul de care are nevoie, datorită unicode-range.
   Playfair Display = titluri, Plus Jakarta Sans = text, JetBrains Mono = cifre (telefon, ore). */
@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/playfair-display-latin-700-normal.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: "Playfair Display";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/playfair-display-latin-ext-700-normal.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: "Playfair Display";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/playfair-display-latin-700-italic.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: "Playfair Display";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/playfair-display-latin-ext-700-italic.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: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans-latin-400-normal.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: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans-latin-ext-400-normal.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: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans-latin-600-normal.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: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans-latin-ext-600-normal.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: "JetBrains Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin-500-normal.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: "JetBrains Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-latin-ext-500-normal.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;
}

/* 2. Variabile de design */
:root {
  /* Culori – stil industrial & vintage: negru, maro „piele”, auriu patinat și cupru.
     Contrast verificat (WCAG): text/fundal 15,32:1; text/secundară 13,72:1;
     text secundar/fundal 8,99:1; auriu/fundal 8,31:1; text buton/buton 8,31:1;
     text buton/hover 10,36:1; focus/fundal 11,98:1.
     Pe sticla închisă, chiar și peste luminile aurii: text 12,59:1, text secundar 7,38:1, auriu 6,83:1. */
  --culoare-fundal: #14110F;
  --culoare-text: #EFE7DA;
  --culoare-text-secundar: #BCB2A3;
  --culoare-principala: #0B0908;
  --culoare-secundara: #221C18;
  --culoare-accent: #CDA75E;
  --culoare-aur-deschis: #F1DCA7;
  --culoare-buton: #CDA75E;
  --culoare-text-buton: #14110F;
  --culoare-text-pe-principala: #EFE7DA;
  --culoare-buton-hover: #DDBC7E;
  --culoare-focus: #E9CB8B;
  --culoare-contur: rgb(239 231 218 / 0.15);    /* textul la 15% opacitate */
  --culoare-mortar: rgb(11 9 8 / 0.85);         /* rosturile texturii de cărămidă */
  --culoare-fundal-dialog: rgb(11 9 8 / 0.94);  /* fundalul din spatele galeriei mărite */

  /* Sticlă (glassmorphism) închisă la culoare, ca textul să rămână ușor de citit */
  --sticla-fundal: rgb(28 23 20 / 0.55);
  --sticla-fundal-dens: rgb(11 9 8 / 0.72);
  --sticla-contur: rgb(255 255 255 / 0.12);
  --sticla-lumina: rgb(255 255 255 / 0.1);
  --sticla-luciu: linear-gradient(140deg, rgb(255 255 255 / 0.07), transparent 45%);

  /* Lumini, umbre și reflexe */
  --culoare-lumina-aur: rgb(205 167 94 / 0.16);
  --culoare-lumina-cupru: rgb(184 115 51 / 0.14);
  --culoare-raza: rgb(241 220 167 / 0.55);
  --culoare-luciu-buton: rgb(255 255 255 / 0.4);
  --culoare-stralucire: rgb(255 240 210 / 0.1);
  --culoare-umbra: rgb(0 0 0 / 0.55);
  --culoare-umbra-buton: rgb(205 167 94 / 0.28);
  --culoare-auriu-fin: rgb(205 167 94 / 0.07);       /* hover pe rândurile din lista de prețuri */
  --culoare-auriu-selectat: rgb(205 167 94 / 0.13);  /* rând bifat (contrast text auriu ≥ 6:1) */
  --culoare-auriu-contur: rgb(205 167 94 / 0.45);

  /* Fonturi */
  --font-titluri: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-text: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  /* Scara de spațiere */
  --spatiu-1: 4px;
  --spatiu-2: 8px;
  --spatiu-3: 12px;
  --spatiu-4: 16px;
  --spatiu-5: 24px;
  --spatiu-6: 32px;
  --spatiu-7: 48px;
  --spatiu-8: 64px;
  --spatiu-9: 96px;

  /* Layout și componente */
  --spatiu-sectiune: var(--spatiu-8);
  --latime-container: 1200px;
  --padding-container: var(--spatiu-4);
  --rotunjire: 8px;
  --rotunjire-card: 16px;
  --rotunjire-buton: 999px;
  --inaltime-buton: 48px;
  --inaltime-bara-mobila: 73px; /* 12 + 48 + 12 + 1px linia de sus */
  --tranzitie: 180ms ease;
  --usurare: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* Variabilele care se schimbă pe ecrane mai mari (CSS-ul pornește de la mobil) */
@media (min-width: 768px) {
  :root {
    --padding-container: var(--spatiu-5);
  }
}

@media (min-width: 1024px) {
  :root {
    --spatiu-sectiune: var(--spatiu-9);
  }
}

/* 3. Bază */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  color-scheme: dark;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

body {
  margin: 0;
  background-color: var(--culoare-fundal);
  color: var(--culoare-text);
  font-family: var(--font-text);
  font-size: 1rem;
  line-height: 1.6;
  word-spacing: 0.06em; /* Plus Jakarta Sans are spațiile dintre cuvinte puțin prea strânse */
}

@media (min-width: 1024px) {
  body {
    font-size: 1.125rem;
  }
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

h1,
h2,
h3 {
  margin: 0 0 var(--spatiu-4);
  font-family: var(--font-titluri);
  font-weight: 700;
  font-variant-numeric: lining-nums;
  line-height: 1.15;
  letter-spacing: -0.01em;
  text-wrap: balance;
}

h1 {
  font-size: clamp(2rem, 1.4rem + 3vw, 3.5rem);
}

h2 {
  font-size: clamp(1.5rem, 1.2rem + 1.5vw, 2.25rem);
}

h3 {
  font-size: 1.25rem;
}

p {
  max-width: 70ch;
  margin: 0 0 var(--spatiu-4);
}

a {
  color: var(--culoare-accent);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  transition: color var(--tranzitie);
}

a:hover {
  color: var(--culoare-buton-hover);
}

:focus-visible {
  outline: 3px solid var(--culoare-focus);
  outline-offset: 2px;
}

::selection {
  background-color: var(--culoare-accent);
  color: var(--culoare-text-buton);
}

address {
  font-style: normal;
}

main:focus {
  outline: none;
}

/* 4. Utilitare */
/* Pe telefoanele cu „notch” ținute orizontal, conținutul nu intră sub decupajul ecranului */
.container {
  width: 100%;
  max-width: calc(var(--latime-container) + 2 * var(--padding-container));
  margin-inline: auto;
  padding-inline:
    max(var(--padding-container), env(safe-area-inset-left))
    max(var(--padding-container), env(safe-area-inset-right));
}

.container--ingust {
  max-width: calc(760px + 2 * var(--padding-container));
}

/* Setul de pictograme de la începutul paginii: nu ocupă loc (pictogramele se afișează prin <use>) */
.sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.ascuns-vizual {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.sari-la-continut {
  position: absolute;
  top: var(--spatiu-2);
  left: var(--spatiu-2);
  z-index: 100;
  padding: var(--spatiu-3) var(--spatiu-4);
  border-radius: var(--rotunjire);
  background-color: var(--culoare-buton);
  color: var(--culoare-text-buton);
  font-weight: 600;
  transform: translateY(-200%);
}

.sari-la-continut:focus {
  transform: none;
}

/* Ține împreună un grup de cuvinte (de ex. un interval orar) */
.fara-rupere {
  white-space: nowrap;
}

/* Cifre și detalii tehnice (telefon, ore, Plus Code) */
.mono {
  font-family: var(--font-mono);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}

/* Textura de cărămidă: doar rosturile, desenate cu o mască SVG și colorate din variabile */
.textura-caramida {
  position: relative;
  isolation: isolate;
}

.textura-caramida::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-color: var(--culoare-mortar);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='64'%3E%3Cpath d='M0 1h104M0 33h104M1 0v32M53 32v32' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='64'%3E%3Cpath d='M0 1h104M0 33h104M1 0v32M53 32v32' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E");
  -webkit-mask-size: 104px 64px;
  mask-size: 104px 64px;
}

/* Lumini aurii care plutesc încet în fundal (hero și îndemnul de final) */
.lumini {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

.lumini__raza {
  position: absolute;
  left: -20%;
  width: 140%;
  rotate: -16deg;
}

.lumini__raza--lata {
  top: 18%;
  height: 160px;
  background-image: linear-gradient(90deg, transparent, var(--culoare-lumina-aur) 45%, var(--culoare-lumina-cupru) 60%, transparent);
  filter: blur(40px);
  animation: raza-plutire 16s ease-in-out infinite alternate;
}

.lumini__raza--fina {
  top: 62%;
  height: 2px;
  background-image: linear-gradient(90deg, transparent 20%, var(--culoare-raza) 50%, transparent 80%);
  opacity: 0.5;
  animation: raza-trecere 9s ease-in-out infinite;
}

.lumini__glob {
  position: absolute;
  top: 10%;
  right: -10%;
  width: min(560px, 90vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background-image: radial-gradient(circle, var(--culoare-lumina-aur), transparent 65%);
  animation: glob-respiratie 10s ease-in-out infinite alternate;
}

/* Apariție la scroll, o singură dată per element (clasa e pusă din JavaScript doar pe elementele aflate sub ecran) */
.apare {
  transition:
    opacity 700ms var(--usurare) var(--intarziere, 0ms),
    translate 700ms var(--usurare) var(--intarziere, 0ms);
}

.apare--ascuns {
  opacity: 0;
  translate: 0 28px;
}

/* Înclinare 3D la mișcarea mouse-ului (doar pe dispozitive cu mouse; variabilele vin din main.js) */
[data-inclinare] {
  position: relative;
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform 450ms var(--usurare);
}

.apare[data-inclinare] {
  transition:
    opacity 700ms var(--usurare) var(--intarziere, 0ms),
    translate 700ms var(--usurare) var(--intarziere, 0ms),
    transform 450ms var(--usurare);
}

/* Reflexul de lumină care urmărește mouse-ul */
[data-inclinare]::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), var(--culoare-stralucire), transparent 60%);
  opacity: 0;
  transition: opacity 300ms ease;
  pointer-events: none;
}

[data-inclinare]:hover::after {
  opacity: 1;
}

/* 5. Componente */

/* Pictograme SVG (setul e inclus la începutul fiecărei pagini, în <svg class="sprite">) */
.iconita {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

/* Butoane: pastilă, text centrat; se ridică ușor la hover, iar butonul auriu are o lucire */
.buton {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spatiu-2);
  min-height: var(--inaltime-buton);
  padding: var(--spatiu-3) var(--spatiu-5);
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: var(--rotunjire-buton);
  font-family: var(--font-text);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color var(--tranzitie),
    color var(--tranzitie),
    border-color var(--tranzitie),
    box-shadow 300ms ease,
    translate 300ms var(--usurare);
}

.buton:hover {
  translate: 0 -2px;
}

.buton:active {
  translate: 0 1px;
  scale: 0.97;
}

/* Pe telefon: fără pata albastră a browserului la atingere; butoanele „se apasă” vizibil (scale) */
.buton,
.galerie__buton,
.logo,
.meniu__lista a,
.lightbox__inchide,
.lightbox__sageata {
  -webkit-tap-highlight-color: transparent;
}

.buton:disabled,
.buton[aria-disabled="true"] {
  opacity: 0.5;
  cursor: not-allowed;
}

.buton--principal {
  background-color: var(--culoare-buton);
  color: var(--culoare-text-buton);
}

.buton--principal:hover {
  background-color: var(--culoare-buton-hover);
  color: var(--culoare-text-buton);
  box-shadow: 0 10px 28px var(--culoare-umbra-buton);
}

.buton--principal::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: linear-gradient(110deg, transparent 30%, var(--culoare-luciu-buton) 50%, transparent 70%);
  translate: -120% 0;
  transition: translate 700ms var(--usurare);
}

.buton--principal:hover::after {
  translate: 120% 0;
}

.buton--secundar {
  border-color: var(--culoare-buton);
  background-color: transparent;
  color: var(--culoare-accent);
}

.buton--secundar:hover {
  background-color: var(--culoare-buton);
  color: var(--culoare-text-buton);
  box-shadow: 0 10px 28px var(--culoare-umbra-buton);
}

/* Buton doar cu pictogramă (cerc de 48 × 48px) */
.buton--iconita {
  width: var(--inaltime-buton);
  padding: 0;
}

/* Grup de butoane: pe mobil unul sub altul, la aceeași lățime; de la 768px, unul lângă altul */
.grup-butoane {
  display: flex;
  flex-direction: column;
  gap: var(--spatiu-3);
}

.grup-butoane--centrat {
  align-items: center;
  margin-top: var(--spatiu-6);
}

.grup-butoane--centrat .buton {
  width: 100%;
  max-width: 360px;
}

@media (min-width: 768px) {
  .grup-butoane {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .grup-butoane--centrat {
    justify-content: center;
  }

  .grup-butoane--centrat .buton {
    width: auto;
  }
}

/* Grup vertical: butoane de aceeași lățime, unul sub altul, pe orice ecran */
.grup-butoane.grup-butoane--vertical {
  flex-direction: column;
  max-width: 360px;
}

/* Card: sticlă închisă la culoare, cu muchie luminoasă */
.card {
  padding: var(--spatiu-5);
  border: 1px solid var(--sticla-contur);
  border-radius: var(--rotunjire-card);
  background-color: var(--sticla-fundal);
  background-image: var(--sticla-luciu);
  box-shadow: inset 0 1px 0 var(--sticla-lumina), 0 24px 48px -24px var(--culoare-umbra);
}

/* Sticlă cu blur: doar unde în spate sunt lumini sau textură */
.sticla {
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
}

/* Supratitlu mic, auriu, cu liniuțe care „cresc” la apariție */
.supratitlu {
  display: flex;
  align-items: center;
  gap: var(--spatiu-3);
  max-width: none; /* fără limita de 70ch a paragrafelor, ca supratitlurile centrate să fie chiar la mijloc */
  margin-bottom: var(--spatiu-3);
  color: var(--culoare-accent);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.supratitlu::before {
  content: "";
  width: var(--spatiu-6);
  height: 2px;
  background-color: currentColor;
  transform-origin: right;
  transition: scale 800ms var(--usurare) 200ms;
}

.apare--ascuns .supratitlu::before,
.apare--ascuns .supratitlu::after {
  scale: 0 1;
}

/* Text auriu, italic, cu o lucire care trece încet peste el */
.text-auriu {
  color: var(--culoare-accent);
  font-style: italic;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .text-auriu {
    background-image: linear-gradient(100deg, var(--culoare-accent) 35%, var(--culoare-aur-deschis) 50%, var(--culoare-accent) 65%);
    background-size: 250% 100%;
    background-position: 100% 0;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: luciu-text 7s ease-in-out 1.2s infinite;
  }
}

/* Logo-ul firmei (PNG/WebP transparent, extras din logo-ul primit de la client) */
.logo {
  display: inline-flex;
  align-items: center;
  min-height: var(--inaltime-buton);
}

.logo img {
  width: auto;
  height: 56px;
  transition: scale 400ms var(--usurare);
}

.logo:hover img {
  scale: 1.04;
}

@media (min-width: 1024px) {
  .antet .logo img {
    height: 68px;
  }
}

/* 6. Antet */
.antet {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid var(--culoare-contur);
  background-color: var(--culoare-fundal);
}

.antet__interior {
  display: flex;
  align-items: center;
  gap: var(--spatiu-2);
  min-height: 72px;
}

.antet__interior .logo {
  margin-right: auto;
}

.antet__actiuni {
  display: flex;
  gap: var(--spatiu-2);
}

.antet__text-buton {
  display: none;
}

.meniu__buton[aria-expanded="true"] .iconita--deschide,
.meniu__buton[aria-expanded="false"] .iconita--inchide {
  display: none;
}

/* Pe mobil, lista meniului apare sub antet (din sticlă) doar când butonul are aria-expanded="true" */
.meniu__lista {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: 0;
  padding:
    var(--spatiu-2)
    max(var(--padding-container), env(safe-area-inset-right))
    var(--spatiu-4)
    max(var(--padding-container), env(safe-area-inset-left));
  border-bottom: 1px solid var(--sticla-contur);
  background-color: var(--sticla-fundal-dens);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  list-style: none;
}

.meniu__buton[aria-expanded="true"] + .meniu__lista {
  display: block;
  animation: meniu-intrare 300ms var(--usurare);
}

.meniu__lista a {
  display: flex;
  align-items: center;
  min-height: var(--inaltime-buton);
  padding-inline: var(--spatiu-2);
  border-bottom: 1px solid var(--culoare-contur);
  color: var(--culoare-text);
  font-weight: 600;
  text-decoration: none;
}

.meniu__lista a:hover {
  color: var(--culoare-accent);
}

@media (min-width: 1024px) {
  .antet__interior {
    gap: var(--spatiu-5);
    min-height: 88px;
  }

  .antet__interior .logo {
    margin-right: 0;
  }

  .meniu {
    margin-left: auto;
  }

  .meniu__buton {
    display: none;
  }

  .meniu__lista,
  .meniu__buton[aria-expanded="true"] + .meniu__lista {
    display: flex;
    position: static;
    gap: var(--spatiu-1);
    padding: 0;
    border: 0;
    background: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    animation: none;
  }

  /* Linkurile din meniu: o liniuță aurie crește sub ele la hover */
  .meniu__lista a {
    position: relative;
    padding-inline: var(--spatiu-2);
    border: 0;
    font-size: 0.9375rem;
  }

  .meniu__lista a::after {
    content: "";
    position: absolute;
    right: var(--spatiu-2);
    bottom: 10px;
    left: var(--spatiu-2);
    height: 2px;
    background-color: var(--culoare-accent);
    scale: 0 1;
    transition: scale 300ms var(--usurare);
  }

  .meniu__lista a:hover::after {
    scale: 1 1;
  }

  .antet__whatsapp {
    width: auto;
    padding-inline: var(--spatiu-4);
  }

  .antet__whatsapp .antet__text-buton {
    display: inline;
  }
}

@media (min-width: 1280px) {
  .antet__telefon {
    width: auto;
    padding-inline: var(--spatiu-4);
  }

  .antet__telefon .antet__text-buton {
    display: inline;
  }
}

/* 7. Secțiuni */
.sectiune {
  padding-block: var(--spatiu-sectiune);
}

/* Secțiunile alternante au două lumini statice în colțuri (dau adâncime sticlei) */
.sectiune--alternanta {
  background-color: var(--culoare-secundara);
  background-image:
    radial-gradient(55% 60% at 0% 0%, var(--culoare-lumina-aur), transparent 70%),
    radial-gradient(45% 55% at 100% 100%, var(--culoare-lumina-cupru), transparent 70%);
}

/* Antet de secțiune centrat, cu liniuțe de o parte și de alta a supratitlului */
.sectiune__antet {
  margin-bottom: var(--spatiu-7);
  text-align: center;
}

.sectiune__antet .supratitlu {
  justify-content: center;
}

.sectiune__antet .supratitlu::after,
.cta-final .supratitlu::after,
.pagina-404 .supratitlu::after {
  content: "";
  width: var(--spatiu-6);
  height: 2px;
  background-color: currentColor;
  transform-origin: left;
  transition: scale 800ms var(--usurare) 200ms;
}

.sectiune__antet h2 {
  margin-bottom: var(--spatiu-3);
}

.sectiune__antet p:not(.supratitlu) {
  margin-inline: auto;
  margin-bottom: 0;
  color: var(--culoare-text-secundar);
}

/* Hero */
.hero {
  overflow: hidden;
  padding-block: var(--spatiu-7) var(--spatiu-8);
  background-color: var(--culoare-secundara);
}

.hero__grila {
  display: grid;
  gap: var(--spatiu-7);
  align-items: center;
}

.hero__descriere {
  color: var(--culoare-text-secundar);
  font-size: 1.0625rem;
}

.hero .grup-butoane {
  margin-top: var(--spatiu-5);
}

/* Cardul de sticlă din hero: programul de azi, nota Google, adresa */
.hero__card {
  justify-self: stretch;
  width: 100%;
  max-width: 420px;
  padding: var(--spatiu-6);
}

.hero__card-titlu {
  margin-bottom: var(--spatiu-5);
  font-family: var(--font-titluri);
  font-size: 1.5rem;
  font-style: italic;
  font-weight: 700;
  line-height: 1.2;
}

.hero__card-lista {
  display: grid;
  gap: var(--spatiu-4);
  margin: 0;
  padding: 0;
  list-style: none;
}

.hero__card-lista li {
  display: flex;
  align-items: center;
  gap: var(--spatiu-3);
}

.hero__card-iconita {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--sticla-contur);
  border-radius: 50%;
  background-color: var(--sticla-fundal);
  color: var(--culoare-accent);
}

.hero__card-eticheta {
  display: block;
  color: var(--culoare-text-secundar);
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hero__card-ore {
  display: block;
}

.hero__card-stele {
  display: inline-flex;
  gap: 2px;
  margin-right: var(--spatiu-2);
  color: var(--culoare-accent);
  vertical-align: -2px;
}

.hero__card-stele .iconita {
  width: 16px;
  height: 16px;
}

@media (min-width: 768px) {
  .hero {
    padding-block: var(--spatiu-9);
  }

  .hero__grila {
    grid-template-columns: 1.25fr 0.75fr;
  }

  .hero__card {
    justify-self: end;
  }
}

@media (min-width: 1024px) {
  .hero__grila {
    grid-template-columns: 1.4fr 0.6fr;
  }
}

/* Despre noi */
.despre__grila {
  display: grid;
  gap: var(--spatiu-6);
  align-items: center;
}

.despre__subtitlu {
  color: var(--culoare-accent);
  font-style: italic;
}

.atuuri {
  display: grid;
  gap: var(--spatiu-4);
  margin: 0;
  list-style: none;
}

.atuuri li {
  display: flex;
  align-items: flex-start;
  gap: var(--spatiu-3);
  font-weight: 600;
}

.atuuri .iconita {
  width: 24px;
  height: 24px;
  color: var(--culoare-accent);
}

@media (min-width: 1024px) {
  .despre__grila {
    grid-template-columns: 1.3fr 0.7fr;
    gap: var(--spatiu-7);
  }
}

/* Lista de prețuri interactivă: fiecare rând e o bifă; totalul și mesajul WhatsApp se actualizează din main.js.
   Fără JavaScript rămâne o listă obișnuită de prețuri, cu butonul WhatsApp normal. */
.lista-preturi__indicatie {
  margin: 0 auto var(--spatiu-4);
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
  text-align: center;
}

.lista-preturi__randuri {
  display: grid;
  gap: var(--spatiu-1);
  margin: 0;
  padding: 0;
  list-style: none;
}

.lista-preturi__eticheta {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: var(--spatiu-3);
  padding: var(--spatiu-3) var(--spatiu-3);
  border: 1px solid transparent;
  border-radius: var(--rotunjire-card);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition:
    background-color 250ms ease,
    border-color 250ms ease,
    translate 300ms var(--usurare);
}

/* Bifa reală e ascunsă vizual, dar rămâne accesibilă din tastatură (Tab + Space) */
.lista-preturi__bifa {
  position: absolute;
  top: var(--spatiu-4);
  left: var(--spatiu-4);
  width: 1px;
  height: 1px;
  opacity: 0;
}

.lista-preturi__cerc {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin-top: 1px;
  border: 2px solid var(--culoare-accent);
  border-radius: 50%;
  color: var(--culoare-text-buton);
  transition: background-color 250ms ease;
}

.lista-preturi__cerc .iconita {
  width: 16px;
  height: 16px;
  opacity: 0;
  scale: 0.3;
  transition: opacity 200ms ease, scale 350ms var(--usurare);
}

.lista-preturi__continut {
  flex: 1;
  min-width: 0;
}

.lista-preturi__linie {
  display: flex;
  align-items: baseline;
  gap: var(--spatiu-2);
}

.lista-preturi__serviciu {
  font-weight: 600;
}

.lista-preturi__punctat {
  flex: 1;
  min-width: var(--spatiu-5);
  border-bottom: 2px dotted var(--culoare-accent);
  opacity: 0.4;
  translate: 0 -0.3em;
  transition: opacity 250ms ease;
}

.lista-preturi__pret {
  flex-shrink: 0;
  color: var(--culoare-accent);
  font-family: var(--font-mono);
  font-size: 1.125rem;
  font-weight: 500;
  white-space: nowrap;
  transition: scale 300ms var(--usurare);
}

.lista-preturi__detaliu {
  display: block;
  margin-top: 2px;
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
}

/* Hover (calculator) și apăsare (telefon) */
@media (hover: hover) {
  .lista-preturi__eticheta:hover {
    background-color: var(--culoare-auriu-fin);
    translate: var(--spatiu-1) 0;
  }

  .lista-preturi__eticheta:hover .lista-preturi__punctat {
    opacity: 0.9;
  }
}

.lista-preturi__eticheta:active {
  scale: 0.99;
}

/* Rând bifat: fundal auriu discret, cerc plin cu bifă, preț mărit */
.lista-preturi__eticheta:has(.lista-preturi__bifa:checked) {
  border-color: var(--culoare-auriu-contur);
  background-color: var(--culoare-auriu-selectat);
}

.lista-preturi__bifa:checked + .lista-preturi__cerc {
  background-color: var(--culoare-accent);
}

.lista-preturi__bifa:checked + .lista-preturi__cerc .iconita {
  opacity: 1;
  scale: 1;
}

.lista-preturi__bifa:checked ~ .lista-preturi__continut .lista-preturi__punctat {
  opacity: 0.9;
}

.lista-preturi__bifa:checked ~ .lista-preturi__continut .lista-preturi__pret {
  scale: 1.08;
}

.lista-preturi__bifa:focus-visible + .lista-preturi__cerc {
  outline: 3px solid var(--culoare-focus);
  outline-offset: 3px;
}

/* Sumarul: totalul animat, serviciile alese și butonul WhatsApp cu alegerea inclusă */
.lista-preturi__sumar {
  display: flex;
  flex-direction: column;
  gap: var(--spatiu-4);
  margin-top: var(--spatiu-5);
  padding-top: var(--spatiu-5);
  border-top: 1px solid var(--culoare-contur);
}

.lista-preturi__total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--spatiu-3);
  margin: 0;
}

.lista-preturi__total-eticheta {
  color: var(--culoare-text-secundar);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.lista-preturi__total-suma {
  color: var(--culoare-accent);
  font-size: 1.75rem;
  line-height: 1.2;
}

.lista-preturi__alese {
  margin: var(--spatiu-1) 0 0;
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
}

.lista-preturi--cu-alegere .lista-preturi__alese {
  color: var(--culoare-text);
}

.lista-preturi__trimite {
  width: 100%;
}

/* Pe telefon: margini mai mici, ca numele serviciilor să încapă pe cât mai puține rânduri */
@media (max-width: 767px) {
  .lista-preturi {
    padding: var(--spatiu-5) var(--spatiu-3);
  }

  .lista-preturi__eticheta {
    gap: var(--spatiu-2);
    padding-inline: var(--spatiu-2);
  }

  .lista-preturi__punctat {
    min-width: var(--spatiu-3);
  }

  .lista-preturi__pret {
    font-size: 1rem;
  }
}

.lista-preturi__nota {
  margin: var(--spatiu-4) auto 0;
  color: var(--culoare-text-secundar);
  font-size: 0.875rem;
  text-align: center;
}

@media (min-width: 768px) {
  .lista-preturi {
    padding: var(--spatiu-6) var(--spatiu-6);
  }

  .lista-preturi__eticheta {
    padding: var(--spatiu-3) var(--spatiu-4);
  }

  .lista-preturi__sumar {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .lista-preturi__total-bloc {
    flex: 1;
  }

  .lista-preturi__total {
    justify-content: flex-start;
  }

  .lista-preturi__trimite {
    width: auto;
  }
}

/* Secțiune care continuă vizual secțiunea de deasupra (același fundal, fără spațiu dublu) */
.sectiune--continuare {
  padding-top: 0;
}

/* Banda „Programări, prețuri sau întrebări?” */
.banda-whatsapp {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--spatiu-5);
  padding: var(--spatiu-6) var(--spatiu-5);
  text-align: center;
}

.banda-whatsapp__iconita {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  align-self: center;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background-color: var(--culoare-buton);
  color: var(--culoare-text-buton);
}

/* Inel care pulsează în jurul pictogramei WhatsApp */
.banda-whatsapp__iconita::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid var(--culoare-accent);
  border-radius: 50%;
  animation: puls-inel 2.6s ease-out infinite;
}

.banda-whatsapp__iconita .iconita {
  width: 32px;
  height: 32px;
}

.banda-whatsapp h2 {
  margin-bottom: var(--spatiu-2);
}

.banda-whatsapp p {
  margin: 0 auto;
  color: var(--culoare-text-secundar);
}

@media (min-width: 768px) {
  .banda-whatsapp {
    flex-direction: row;
    align-items: center;
    gap: var(--spatiu-6);
    padding: var(--spatiu-6) var(--spatiu-7);
    text-align: left;
  }

  .banda-whatsapp__text {
    flex: 1;
  }

  .banda-whatsapp p {
    margin: 0;
  }
}

/* Galerie: 2 coloane pe mobil, 4 coloane de la 768px; prima fotografie este mai mare */
.galerie {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--spatiu-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

.galerie__element--mare {
  grid-column: span 2;
}

.galerie__buton {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: var(--rotunjire-card);
  background-color: var(--culoare-fundal);
  cursor: zoom-in;
}

.galerie__buton img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: scale 900ms var(--usurare);
}

/* La hover: fotografia se apropie, apare o umbră aurie și cercul cu lupa */
.galerie__buton::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background-image: linear-gradient(to top, var(--culoare-umbra), transparent 55%);
  opacity: 0;
  transition: opacity 400ms ease;
}

.galerie__zoom {
  position: absolute;
  right: var(--spatiu-3);
  bottom: var(--spatiu-3);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--sticla-contur);
  border-radius: 50%;
  background-color: var(--sticla-fundal-dens);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  color: var(--culoare-accent);
  opacity: 0;
  scale: 0.7;
  transition: opacity 300ms ease, scale 400ms var(--usurare);
}

.galerie__buton:hover img,
.galerie__buton:focus-visible img {
  scale: 1.07;
}

.galerie__buton:active {
  scale: 0.98;
  transition: scale 150ms ease;
}

.galerie__buton:hover::before,
.galerie__buton:focus-visible::before,
.galerie__buton:hover .galerie__zoom,
.galerie__buton:focus-visible .galerie__zoom {
  opacity: 1;
  scale: 1;
}

/* Pe telefon (fără hover) cercul cu lupa e mereu vizibil, ca să se înțeleagă că poza se mărește */
@media (hover: none) {
  .galerie__zoom {
    opacity: 1;
    scale: 1;
  }
}

@media (min-width: 768px) {
  .galerie {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--spatiu-4);
  }

  .galerie__element--mare {
    grid-row: span 2;
  }

  .galerie__element--mare .galerie__buton {
    height: 100%;
    aspect-ratio: auto;
  }
}

/* Fereastra cu fotografia mărită (<dialog>) */
.lightbox {
  max-width: calc(100vw - var(--spatiu-6));
  max-height: calc(100vh - var(--spatiu-6));
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  color: var(--culoare-text);
}

.lightbox[open] {
  display: flex;
  align-items: center;
  justify-content: center;
}

.lightbox::backdrop {
  background-color: var(--culoare-fundal-dialog);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.lightbox[open]::backdrop {
  animation: apare-simplu 300ms ease;
}

/* Fotografia lasă loc sus pentru X și jos pentru săgeți (200px în total);
   pe telefon se poate glisa stânga/dreapta (pan-y lasă browserul să facă doar zoom și scroll vertical) */
.lightbox img {
  width: min(calc(100vw - var(--spatiu-6)), calc((100vh - 200px) * 0.75), 720px);
  aspect-ratio: 3 / 4;
  object-fit: contain;
  border-radius: var(--rotunjire-card);
  touch-action: pan-y pinch-zoom;
  animation: foto-intrare 450ms var(--usurare);
}

@supports (height: 100dvh) {
  .lightbox img {
    width: min(calc(100vw - var(--spatiu-6)), calc((100dvh - 200px) * 0.75), 720px);
  }
}

/* Săgețile și contorul („2 / 5”), într-o pastilă de sticlă jos, la mijloc */
.lightbox__comenzi {
  position: fixed;
  bottom: calc(var(--spatiu-5) + env(safe-area-inset-bottom));
  left: 50%;
  display: flex;
  align-items: center;
  gap: var(--spatiu-2);
  padding: var(--spatiu-1);
  border: 1px solid var(--sticla-contur);
  border-radius: var(--rotunjire-buton);
  background-color: var(--sticla-fundal-dens);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  translate: -50% 0;
}

.lightbox__sageata {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background-color: transparent;
  color: var(--culoare-text);
  cursor: pointer;
  transition: background-color var(--tranzitie), color var(--tranzitie), scale 150ms ease;
}

.lightbox__sageata:hover {
  background-color: var(--culoare-buton);
  color: var(--culoare-text-buton);
}

.lightbox__sageata:active {
  scale: 0.92;
}

.lightbox__sageata .iconita {
  width: 24px;
  height: 24px;
}

.lightbox__numar {
  min-width: 5ch;
  margin: 0;
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
  text-align: center;
}

/* X-ul de închidere: cerc de sticlă, mereu în colțul din dreapta-sus al ecranului */
.lightbox__inchide {
  position: fixed;
  top: calc(var(--spatiu-4) + env(safe-area-inset-top));
  right: calc(var(--spatiu-4) + env(safe-area-inset-right));
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  padding: 0;
  border: 1px solid var(--sticla-contur);
  border-radius: 50%;
  background-color: var(--sticla-fundal-dens);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  color: var(--culoare-text);
  cursor: pointer;
  transition: background-color var(--tranzitie), color var(--tranzitie), rotate 300ms var(--usurare);
}

.lightbox__inchide:hover {
  background-color: var(--culoare-buton);
  color: var(--culoare-text-buton);
  rotate: 90deg;
}

.lightbox__inchide .iconita {
  width: 26px;
  height: 26px;
}

body:has(.lightbox[open]) {
  overflow: hidden;
}

/* Recenzii: nota de pe Google */
.recenzii-rezumat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spatiu-5);
  max-width: 560px;
  margin-inline: auto;
  padding: var(--spatiu-6);
  text-align: center;
}

.recenzii-rezumat__nota {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spatiu-2);
  margin: 0;
}

.recenzii-rezumat__cifra {
  color: var(--culoare-accent);
  font-family: var(--font-titluri);
  font-size: 3.5rem;
  font-weight: 700;
  font-variant-numeric: lining-nums;
  line-height: 1;
}

/* „/5” mai mic, ca nota să se citească clar „din 5” */
.recenzii-rezumat__din {
  margin-left: 0.05em;
  font-size: 0.55em;
}

.recenzii-rezumat__stele {
  display: flex;
  gap: var(--spatiu-1);
  color: var(--culoare-accent);
}

.recenzii-rezumat__stele .iconita {
  width: 28px;
  height: 28px;
}

/* Stelele „apar” pe rând când secțiunea intră în ecran */
.recenzii-rezumat:not(.apare--ascuns) .recenzii-rezumat__stele .iconita {
  animation: stea-aparitie 500ms var(--usurare) both;
}

.recenzii-rezumat__stele .iconita:nth-child(2) { animation-delay: 80ms; }
.recenzii-rezumat__stele .iconita:nth-child(3) { animation-delay: 160ms; }
.recenzii-rezumat__stele .iconita:nth-child(4) { animation-delay: 240ms; }
.recenzii-rezumat__stele .iconita:nth-child(5) { animation-delay: 320ms; }

.recenzii-rezumat__text {
  color: var(--culoare-text-secundar);
}

/* Recenziile cu text (copiate exact de pe Google) */
.recenzii {
  display: grid;
  gap: var(--spatiu-4);
  margin: var(--spatiu-6) 0 0;
  padding: 0;
  list-style: none;
}

.recenzie {
  display: flex;
  flex-direction: column;
  gap: var(--spatiu-3);
}

.recenzie__stele {
  display: flex;
  gap: 2px;
  margin: 0;
  color: var(--culoare-accent);
}

.recenzie__stele .iconita {
  width: 18px;
  height: 18px;
}

.recenzie__text {
  flex: 1;
  margin: 0;
}

/* Ghilimea decorativă (textul alternativ gol: cititoarele de ecran n-o citesc) */
.recenzie__text::before {
  content: "\201C" / "";
  display: block;
  height: 0.6em;
  color: var(--culoare-accent);
  font-family: var(--font-titluri);
  font-size: 3rem;
  font-weight: 700;
  line-height: 1;
}

.recenzie__text p {
  margin: 0;
  font-size: 1.0625rem;
}

.recenzie__autor {
  margin: 0;
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
}

.recenzie__nume {
  color: var(--culoare-text);
  font-weight: 600;
}

@media (min-width: 1024px) {
  .recenzii {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--spatiu-5);
  }
}

/* Program de lucru */
.program {
  margin: 0;
  list-style: none;
}

.program__rand {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spatiu-2) var(--spatiu-4);
  padding-block: var(--spatiu-4);
  border-bottom: 1px solid var(--culoare-contur);
}

.program__rand:first-child {
  padding-top: 0;
}

.program__rand:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.program__zi {
  display: flex;
  align-items: center;
  gap: var(--spatiu-3);
  font-weight: 600;
}

.program__ore {
  color: var(--culoare-accent);
  font-family: var(--font-mono);
  font-size: 1.125rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.program__rand--inchis .program__ore {
  color: var(--culoare-text-secundar);
  font-family: var(--font-text);
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.program__nota {
  margin: var(--spatiu-5) auto 0;
  color: var(--culoare-text-secundar);
  text-align: center;
}

@media (min-width: 768px) {
  .program {
    padding: var(--spatiu-6) var(--spatiu-7);
  }
}

/* Hartă în doi pași */
.harta__grila {
  display: grid;
  gap: var(--spatiu-6);
  align-items: center;
}

.harta__adresa {
  display: flex;
  gap: var(--spatiu-3);
  margin-bottom: var(--spatiu-5);
  font-size: 1.125rem;
  font-weight: 600;
}

.harta__adresa .iconita {
  width: 24px;
  height: 24px;
  margin-top: var(--spatiu-1);
  color: var(--culoare-accent);
}

.harta__pluscode {
  display: block;
  margin-top: var(--spatiu-2);
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
}

.harta__cadru {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  border: 1px solid var(--sticla-contur);
  border-radius: var(--rotunjire-card);
  background-color: var(--culoare-fundal);
  /* Caroiaj discret, ca o hartă tehnică */
  background-image:
    linear-gradient(var(--culoare-contur) 1px, transparent 1px),
    linear-gradient(90deg, var(--culoare-contur) 1px, transparent 1px);
  background-size: 32px 32px;
}

.harta__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spatiu-4);
  padding: var(--spatiu-5);
  text-align: center;
}

.harta__placeholder p {
  max-width: 46ch;
  margin: 0;
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
}

.harta__iconita {
  width: 40px;
  height: 40px;
  color: var(--culoare-accent);
  animation: pin-saritura 2.4s var(--usurare) infinite;
}

.harta__cadru iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (min-width: 768px) {
  .harta__cadru {
    min-height: 0;
    aspect-ratio: 16 / 10;
  }
}

@media (min-width: 1024px) {
  .harta__grila {
    grid-template-columns: 0.8fr 1.2fr;
    gap: var(--spatiu-7);
  }
}

/* Îndemnul de final */
.cta-final {
  overflow: hidden;
  padding-block: var(--spatiu-sectiune);
  border-top: 1px solid var(--culoare-contur);
  background-color: var(--culoare-secundara);
}

.cta-final__interior {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.cta-final p:not(.supratitlu) {
  color: var(--culoare-text-secundar);
}

.cta-final .grup-butoane--centrat {
  width: 100%;
  margin-top: var(--spatiu-3);
}

/* Paginile legale și pagina 404 */
.pagina-legala h2 {
  margin-top: var(--spatiu-7);
  font-size: 1.5rem;
}

.pagina-legala__actualizare {
  color: var(--culoare-text-secundar);
}

.pagina-legala h3 {
  margin-bottom: var(--spatiu-3);
  font-size: 1.125rem;
}

/* Caseta „pe scurt” de la începutul Politicii de confidențialitate */
.pagina-legala__pe-scurt {
  display: grid;
  gap: var(--spatiu-2);
  margin: var(--spatiu-5) 0;
  padding-left: calc(var(--spatiu-5) + var(--spatiu-4));
}

.pagina-legala__pe-scurt li::marker {
  color: var(--culoare-accent);
}

.pagina-legala__lista {
  margin: 0 0 var(--spatiu-4);
  padding-left: var(--spatiu-5);
}

.pagina-legala__lista a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

/* Rezumatul din Politica de cookie-uri: câte un card pentru fiecare element */
.rezumat-cookie {
  display: grid;
  gap: var(--spatiu-4);
  margin: var(--spatiu-5) 0 var(--spatiu-4);
  padding: 0;
  list-style: none;
}

.rezumat-cookie p {
  margin: 0 0 var(--spatiu-1);
  color: var(--culoare-text-secundar);
  font-size: 0.9375rem;
}

.rezumat-cookie__eticheta {
  color: var(--culoare-text);
  font-weight: 600;
}

@media (min-width: 768px) {
  .rezumat-cookie {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Nume tehnice în text (de exemplu cheia tsb_acord_harta) */
.pagina-legala code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  overflow-wrap: anywhere;
}

.pagina-404 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.pagina-404 .grup-butoane--centrat {
  width: 100%;
  margin-top: var(--spatiu-3);
}

/* 8. Subsol și butoanele fixe */
.subsol {
  padding-block: var(--spatiu-7) var(--spatiu-5);
  border-top: 1px solid var(--culoare-contur);
  background-color: var(--culoare-principala);
  color: var(--culoare-text-pe-principala);
}

.subsol__grila {
  display: grid;
  gap: var(--spatiu-6);
}

.subsol .logo img {
  height: 96px;
}

.subsol__titlu {
  margin-bottom: var(--spatiu-3);
  color: var(--culoare-accent);
  font-family: var(--font-text);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.subsol p,
.subsol address {
  margin: 0 0 var(--spatiu-2);
  color: var(--culoare-text-secundar);
}

.subsol__contact a {
  display: inline-flex;
  align-items: center;
  gap: var(--spatiu-2);
  min-height: 44px;
  color: var(--culoare-text);
}

.subsol__program {
  margin: 0;
  color: var(--culoare-text-secundar);
}

.subsol__program div {
  display: flex;
  justify-content: space-between;
  gap: var(--spatiu-4);
  max-width: 280px;
}

.subsol__program dt,
.subsol__program dd {
  margin: 0;
}

.subsol__jos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spatiu-3) var(--spatiu-5);
  margin-top: var(--spatiu-7);
  padding-top: var(--spatiu-4);
  border-top: 1px solid var(--culoare-contur);
}

.subsol__jos p {
  margin: 0;
}

/* Pictograma SAL a ANPC (Ordinul ANPC nr. 449/2022, modificat prin Ordinul nr. 270/2026): fișierul oficial
   de pe anpc.ro/sal, într-o casetă de 250 × 50 px, fără să fie deformat; sub ea, linkul spre anpc.ro */
.subsol__anpc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spatiu-1);
  margin-top: var(--spatiu-5);
}

.subsol__anpc-pictograma {
  display: block;
  border-radius: var(--spatiu-2);
  transition: translate 300ms var(--usurare);
}

.subsol__anpc img {
  display: block;
  width: 250px;
  height: 50px;
  object-fit: contain;
}

@media (hover: hover) {
  .subsol__anpc-pictograma:hover {
    translate: 0 -2px;
  }
}

.subsol__anpc-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--culoare-text-secundar);
  font-size: 0.875rem;
  text-align: center;
}

.subsol__anpc-link:hover {
  color: var(--culoare-accent);
}

/* Semnătura autorului site-ului, la final; inimioara „bate” la hover */
.subsol .subsol__credit {
  max-width: none;
  margin: var(--spatiu-5) 0 0;
  padding-top: var(--spatiu-4);
  border-top: 1px solid var(--culoare-contur);
  color: var(--culoare-text-secundar);
  font-size: 0.8125rem;
  text-align: center;
}

.subsol__inima {
  width: 14px;
  height: 14px;
  margin-inline: var(--spatiu-1);
  color: var(--culoare-accent);
  vertical-align: -2px;
}

.subsol__credit:hover .subsol__inima {
  animation: inima-bataie 800ms ease-in-out infinite;
}

/* Datele de identificare ale firmei (cerute de Legea 365/2002 pentru site-urile firmelor) */
.subsol__jos .subsol__date-firma {
  margin-top: var(--spatiu-1);
  color: var(--culoare-text-secundar);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.subsol__legale {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--spatiu-5);
  margin: 0;
  padding: 0;
  list-style: none;
}

.subsol__legale a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--culoare-text-secundar);
}

.subsol__legale a:hover {
  color: var(--culoare-accent);
}

/* „Setări cookie-uri” e un buton (face o acțiune), dar arată ca linkurile de lângă el */
.subsol__buton-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--culoare-text-secundar);
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 0.2em;
  cursor: pointer;
  transition: color var(--tranzitie);
}

.subsol__buton-link:hover {
  color: var(--culoare-accent);
}

/* Mesajul de acord pentru harta Google: pe mobil deasupra barei de jos, pe desktop în stânga-jos
   (ca butonul WhatsApp din dreapta să rămână vizibil). Butoanele Refuz și Accept au aceeași mărime. */
.acord-harta {
  position: fixed;
  right: max(var(--spatiu-3), env(safe-area-inset-right));
  bottom: calc(var(--inaltime-bara-mobila) + var(--spatiu-3) + env(safe-area-inset-bottom));
  left: max(var(--spatiu-3), env(safe-area-inset-left));
  z-index: 30;
  max-width: 440px;
  margin-inline: auto;
  padding: var(--spatiu-5);
  background-color: var(--sticla-fundal-dens);
  animation: intrare-sus 500ms var(--usurare);
}

.acord-harta__text {
  margin: 0 0 var(--spatiu-4);
  font-size: 0.9375rem;
}

.acord-harta__butoane {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--spatiu-3);
}

@media (min-width: 1024px) {
  .acord-harta {
    right: auto;
    bottom: calc(var(--spatiu-5) + env(safe-area-inset-bottom));
    left: calc(var(--spatiu-5) + env(safe-area-inset-left));
    margin: 0;
  }
}

@media (min-width: 768px) {
  .subsol__grila {
    grid-template-columns: 1.2fr 1fr 1fr;
  }
}

/* Butoanele fixe (WhatsApp are prioritate):
   pe mobil, o bară de sticlă jos cu „Sună” + „Scrie-ne pe WhatsApp”, una lângă alta;
   de la 1024px, doar butonul WhatsApp, fix în colțul din dreapta-jos, cu un inel care pulsează. */
.contact-fix {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--spatiu-2);
  /* env(safe-area-inset-*): spațiul pentru bara de gesturi și colțurile rotunjite ale iPhone-urilor */
  padding:
    var(--spatiu-3)
    max(var(--padding-container), env(safe-area-inset-right))
    calc(var(--spatiu-3) + env(safe-area-inset-bottom))
    max(var(--padding-container), env(safe-area-inset-left));
  border-top: 1px solid var(--sticla-contur);
  background-color: var(--sticla-fundal-dens);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
}

.contact-fix .buton {
  padding-inline: var(--spatiu-4);
}

/* Spațiu la finalul paginii, ca bara să nu acopere ultimul rând din subsol */
.subsol {
  padding-bottom: calc(var(--spatiu-5) + var(--inaltime-bara-mobila) + env(safe-area-inset-bottom));
}

/* Pe ecranele foarte înguste rămâne doar cuvântul „WhatsApp” */
.contact-fix__lung {
  display: none;
}

@media (min-width: 375px) {
  .contact-fix__lung {
    display: inline;
  }
}

@media (min-width: 1024px) {
  .contact-fix {
    right: calc(var(--spatiu-5) + env(safe-area-inset-right));
    bottom: calc(var(--spatiu-5) + env(safe-area-inset-bottom));
    left: auto;
    display: flex;
    padding: 0;
    border: 0;
    border-radius: var(--rotunjire-buton);
    background: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .contact-fix::before {
    content: "";
    position: absolute;
    inset: 0;
    border: 2px solid var(--culoare-accent);
    border-radius: var(--rotunjire-buton);
    animation: puls-inel-buton 3s ease-out infinite;
    pointer-events: none;
  }

  .contact-fix__telefon {
    display: none;
  }

  .contact-fix__whatsapp {
    box-shadow: 0 10px 30px var(--culoare-umbra);
  }

  .subsol {
    padding-bottom: calc(var(--spatiu-5) + var(--inaltime-buton) + var(--spatiu-6));
  }
}

/* 9. Animații */

/* Intrarea elementelor din hero, pe rând, la încărcarea paginii */
.hero__text > *,
.hero__card {
  animation: intrare-sus 800ms var(--usurare) both;
}

.hero__text > :nth-child(2) { animation-delay: 80ms; }
.hero__text > :nth-child(3) { animation-delay: 180ms; }
.hero__text > :nth-child(4) { animation-delay: 280ms; }
.hero__card { animation-delay: 380ms; }

/* Titlul principal doar alunecă, fără să pornească invizibil: e cel mai mare element de la încărcare (LCP),
   iar Chrome nu măsoară textul cu opacitate 0, așa că o intrare cu fade îl făcea să pară încărcat mai târziu */
.hero__text > h1 {
  animation-name: intrare-sus-vizibil;
}

@keyframes intrare-sus {
  from {
    opacity: 0;
    translate: 0 24px;
  }
}

@keyframes intrare-sus-vizibil {
  from {
    translate: 0 24px;
  }
}

@keyframes apare-simplu {
  from {
    opacity: 0;
  }
}

@keyframes meniu-intrare {
  from {
    opacity: 0;
    translate: 0 -8px;
  }
}

@keyframes foto-intrare {
  from {
    opacity: 0;
    scale: 0.94;
  }
}

@keyframes luciu-text {
  0% {
    background-position: 100% 0;
  }
  45%,
  100% {
    background-position: 0% 0;
  }
}

@keyframes raza-plutire {
  from {
    translate: -6% -20px;
  }
  to {
    translate: 6% 30px;
  }
}

@keyframes raza-trecere {
  0% {
    translate: -40% 0;
    opacity: 0;
  }
  30%,
  70% {
    opacity: 0.6;
  }
  100% {
    translate: 40% 0;
    opacity: 0;
  }
}

@keyframes glob-respiratie {
  from {
    scale: 0.9;
    opacity: 0.7;
  }
  to {
    scale: 1.1;
    opacity: 1;
  }
}

@keyframes puls-inel {
  0% {
    opacity: 0.8;
    scale: 1;
  }
  70%,
  100% {
    opacity: 0;
    scale: 1.6;
  }
}

@keyframes puls-inel-buton {
  0% {
    opacity: 0.7;
    scale: 1;
  }
  60%,
  100% {
    opacity: 0;
    scale: 1.15 1.4;
  }
}

@keyframes inima-bataie {
  0%,
  100% {
    scale: 1;
  }
  30% {
    scale: 1.3;
  }
  60% {
    scale: 0.95;
  }
}

@keyframes stea-aparitie {
  from {
    opacity: 0;
    scale: 0.3;
    rotate: -30deg;
  }
}

@keyframes pin-saritura {
  0%,
  60%,
  100% {
    translate: 0 0;
  }
  30% {
    translate: 0 -8px;
  }
}

/* 10. Mișcare redusă: fără animații și tranziții neesențiale */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
    transition-delay: 0s !important;
    animation-duration: 0.01ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }

  .apare--ascuns {
    opacity: 1;
    translate: none;
  }

  .lumini__raza--fina,
  .contact-fix::before,
  .banda-whatsapp__iconita::before {
    display: none;
  }
}
