@charset "UTF-8";
/* ==========================================================================
   TechTeam Pitesti
   Structura, miscarea si componentele citite de pe bel-dent.ro, portate pe
   paleta DESCHISA a TechTeam. Tema nu se schimba: intunericul traieste
   exclusiv INAUNTRUL ramelor foto, ca tratament de imagine, niciodata ca
   fundal de sectiune.

   Reguli tinute explicit:
     THEME LOCK  o singura tema pe toata pagina. Deschisa.
     COLOR LOCK  un singur accent, folosit identic peste tot.
     CURVE LOCK  o singura curba: --ease. Fara overshoot.
     ZERO em-dash si zero en-dash, nicaieri.
     Fara numerotare de sectiuni ca index de catalog, fara legende FIG.
     Fiecare SVG inline primeste width si height in atribut.
   ========================================================================== */

/* ---------- Fonturi self-hosted. Doua familii, nu trei. ---------- */
@font-face{font-family:'Bricolage';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('/assets/fonts/bricolage-var-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:'Bricolage';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('/assets/fonts/bricolage-var-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:'Archivo';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/assets/fonts/archivo-400700-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:'Archivo';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/assets/fonts/archivo-400700-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;}

/* ---------- Jetoane ---------- */
:root{
  /* Tema unica, deschisa. Neutru rece la croma aproape zero, NU crem sau bej. */
  --bg:#F4F4F5;
  --bg2:#E9E9EB;
  --surface:#FFFFFF;
  --ink:#16181C;
  --ink2:#585C63;
  --ink3:#8A8E96;
  --line:#DBDCDF;
  --line2:#C6C8CC;
  /* Un singur accent pe tot site-ul. Portocaliu de semnal, exista fizic in atelierul lor. */
  --accent:#E8590C;
  --accent-ink:#B7420A;      /* varianta care trece 4.5:1 pe fundal deschis */
  /* Suprafata inchisa, folosita DOAR pe subsol, pe butoane si ca scrim peste fotografie. */
  --deep:#16181C;
  --on-deep:#EDEDEF;
  --on-deep2:#9A9DA4;
  --deep-line:#2B2E34;

  --display:'Bricolage',ui-sans-serif,system-ui,sans-serif;
  --sans:'Archivo',system-ui,-apple-system,sans-serif;

  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:72px;--s9:112px;
  --wrap:1280px;
  --t-fast:150ms; --t:260ms; --t-slow:620ms;
  --ease:cubic-bezier(.16,1,.3,1);          /* o singura curba pe tot site-ul */
  --z-nav:100; --z-drawer:200;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.65 var(--sans);
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
/* SVG-urile inline sunt pictograme, nu imagini. Fara o dimensiune implicita,
   regula de mai sus le lasa sa creasca cat containerul. */
svg{display:block;max-width:100%}
.tel svg,.go svg,.has__chev svg,.drawer__x svg{width:1em;height:1em;flex:0 0 auto}
iframe{max-width:100%;display:block;border:0}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:700;line-height:1.05;
  letter-spacing:-.03em;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding-left:1.2em}
table{border-collapse:collapse;width:100%}
a{color:var(--accent-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:#fff}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s5)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--s5);top:var(--s2);z-index:300;background:var(--deep);color:#fff;padding:var(--s3) var(--s4)}

/* ==========================================================================
   MISCARE. Fiecare animatie are un motiv. Continutul e vizibil implicit:
   starea ascunsa exista DOAR sub html.js, deci fara JS nu dispare nimic.
   ========================================================================== */
.js .rv{opacity:0;transform:translate3d(0,20px,0)}
.js .rv.in{opacity:1;transform:none;
  transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease)}
.js .rv-s{opacity:0;transform:scale(.97)}
.js .rv-s.in{opacity:1;transform:none;
  transition:opacity 720ms var(--ease),transform 720ms var(--ease)}
[data-d="1"]{transition-delay:60ms!important}
[data-d="2"]{transition-delay:120ms!important}
[data-d="3"]{transition-delay:180ms!important}
[data-d="4"]{transition-delay:240ms!important}
[data-d="5"]{transition-delay:300ms!important}

/* Stagger pe copiii unei grile, in CSS, nu in JS (pattern .other-grid Bel-Dent) */
.stag>*{transition-delay:0ms}
.stag>*:nth-child(2){transition-delay:80ms}
.stag>*:nth-child(3){transition-delay:160ms}
.stag>*:nth-child(4){transition-delay:240ms}
.stag>*:nth-child(5){transition-delay:320ms}
.stag>*:nth-child(6){transition-delay:400ms}
.stag>*:nth-child(7){transition-delay:480ms}
.stag>*:nth-child(8){transition-delay:560ms}

/* ==========================================================================
   ANTET. Telefonul e singurul element de conversie si apare o singura data.
   Singura schimbare fata de varianta anterioara: bordura de la derulare
   devine 3px accent, echivalentul semnaturii Bel-Dent .nav.scrolled.
   ========================================================================== */
.hdr{position:sticky;top:0;z-index:var(--z-nav);background:rgba(244,244,245,.9);
  backdrop-filter:blur(12px) saturate(1.3);-webkit-backdrop-filter:blur(12px) saturate(1.3);
  border-bottom:3px solid transparent;transition:border-color var(--t) var(--ease)}
.hdr.stuck{border-bottom-color:var(--accent)}
/* Alex, 2026-07-29: navigatia sta putin mai jos pe desktop. Se face din inaltimea
   barii, nu prin mutarea elementelor, ca sa nu se dezalinieze nimic. */
.hdr .wrap{display:flex;align-items:center;gap:var(--s5);min-height:96px;min-width:0}
/* nimic din antet nu are voie sa impinga latimea peste ecran */
.brand{min-width:0}
.brand span{min-width:0;overflow:hidden}
.brand b,.brand small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Sigla reala a firmei, primita de la client. Se afiseaza EXACT cum e: nu se
   recoloreaza, nu se decupeaza, nu se pune pe alt fundal. Contine deja numele
   TECH TEAM, deci numele nu se mai scrie inca o data langa ea. */
.brand{display:flex;align-items:center;gap:13px;color:var(--ink);flex:0 0 auto;text-decoration:none}
.brand:hover{text-decoration:none}
.brand__logo{display:block;flex:0 0 auto}
.brand__logo img{height:72px;width:auto;display:block}
.brand small{font:400 11.5px/1.3 var(--sans);color:var(--ink3);display:block;
  padding-left:13px;border-left:1px solid var(--line2)}

.nav{margin-left:auto}
.nav>ul{display:flex;list-style:none;margin:0;padding:0;gap:2px}
.nav>ul>li{position:relative}
.nav a,.nav .has__btn{display:flex;align-items:center;gap:6px;padding:9px 13px;color:var(--ink);
  font:500 15px/1 var(--sans);background:none;border:0;cursor:pointer;text-decoration:none;
  transition:color var(--t-fast) var(--ease)}
.nav a:hover,.nav .has__btn:hover{color:var(--accent-ink);text-decoration:none}
.nav a[aria-current="page"],.nav .has.is-active>.has__btn{color:var(--accent-ink);font-weight:650}
.has__chev{display:flex;line-height:0;transition:transform var(--t) var(--ease)}
.has__chev svg{width:13px;height:13px}
.nav .has:hover .has__chev{transform:rotate(180deg)}
.nav .subw{display:none;position:absolute;top:calc(100% + 4px);left:0;min-width:300px;
  background:var(--surface);border:1px solid var(--line);padding:var(--s2);
  box-shadow:0 16px 40px -18px rgba(22,24,28,.35)}
.nav .sub{list-style:none;margin:0;padding:0}
.nav .has:hover .subw,.nav .has:focus-within .subw{display:block}
.nav .sub a{padding:11px 12px;font-size:14.5px}

.hdr__act{display:flex;align-items:center;gap:var(--s3);flex:0 0 auto}
.tel{display:inline-flex;align-items:center;gap:9px;font:650 15px/1 var(--sans);color:#fff;
  background:var(--deep);padding:14px 20px;border-radius:999px;white-space:nowrap;text-decoration:none;
  transition:background-color var(--t) var(--ease),transform var(--t) var(--ease)}
.tel svg{width:16px;height:16px;flex:0 0 auto}
.tel:hover{background:var(--accent);text-decoration:none;transform:translateY(-1px)}

/* Butonul de meniu: pastila rotunda, ca butonul de telefon de langa el, nu o
   cutie cu chenar. Liniile se transforma in x la deschidere. */
.burger{display:none;place-items:center;width:48px;height:48px;padding:0;cursor:pointer;
  background:var(--surface);border:1px solid var(--line2);border-radius:50%;
  transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease)}
.burger:hover{border-color:var(--ink)}
.burger[aria-expanded="true"]{background:var(--deep);border-color:var(--deep)}
.burger i{display:block;width:17px;height:2px;border-radius:2px;background:var(--ink);
  transition:transform var(--t) var(--ease),opacity var(--t) var(--ease),
             background-color var(--t) var(--ease)}
.burger i+i{margin-top:4px}
.burger[aria-expanded="true"] i{background:#fff}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ==========================================================================
   PANOUL DE MENIU. Ramane pe tema paginii, dar nu mai e o lista goala:
   antet cu sigla, elemente mari cu sageata, bara de accent pe pagina curenta,
   intrare esalonata. Alex, 2026-07-29: "felul in care arata acel burger menu
   e oribil, fa ceva decent".
   ========================================================================== */
.drawer{position:fixed;inset:0;z-index:var(--z-drawer);background:var(--bg);display:flex;
  flex-direction:column;overflow-y:auto;opacity:0;transform:translateY(-8px);
  transition:opacity 240ms var(--ease),transform 240ms var(--ease);
  padding:max(env(safe-area-inset-top),10px) 0 max(env(safe-area-inset-bottom),10px)}
.drawer.is-open{opacity:1;transform:none}
.drawer[hidden]{display:none}
html.menu-open{overflow:hidden}

.drawer__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);
  padding:var(--s3) var(--s5) var(--s4);border-bottom:1px solid var(--line)}
.drawer__x{width:48px;height:48px;display:grid;place-items:center;cursor:pointer;flex:0 0 auto;
  background:var(--deep);border:0;border-radius:50%;color:#fff;
  transition:background-color var(--t) var(--ease),transform var(--t) var(--ease)}
.drawer__x:hover{background:var(--accent);transform:rotate(90deg)}
.drawer__x svg{width:18px;height:18px}

.drawer__nav{flex:1 1 auto;padding:var(--s5) var(--s5) var(--s7)}
.drawer__nav ul{list-style:none;margin:0;padding:0}
.drawer__nav>ul>li{border-bottom:1px solid var(--line);position:relative}
.drawer__nav>ul>li:last-child{border-bottom:0}
/* bara de accent pe pagina pe care esti */
.drawer__nav>ul>li>a[aria-current="page"]::before,
.drawer__nav>ul>li.is-active>.has__btn::before{content:"";position:absolute;left:calc(var(--s5) * -1);
  top:50%;width:4px;height:26px;margin-top:-13px;border-radius:0 3px 3px 0;background:var(--accent)}
.drawer__nav a,.drawer__nav .has__btn{display:flex;align-items:center;justify-content:space-between;
  gap:var(--s4);width:100%;padding:17px 0;min-height:60px;background:none;border:0;cursor:pointer;
  color:var(--ink);font-family:var(--display);font-weight:700;font-size:26px;letter-spacing:-.035em;
  text-align:left;text-decoration:none;transition:color var(--t-fast) var(--ease)}
.drawer__nav a:hover,.drawer__nav .has__btn:hover{color:var(--accent-ink);text-decoration:none}
.drawer__nav a[aria-current="page"],.drawer__nav .has.is-active>.has__btn{color:var(--accent-ink)}
/* sageata discreta pe elementele simple, chevron rotitor pe cele cu subpagini */
.drawer__nav>ul>li>a::after{content:"";width:9px;height:9px;flex:0 0 auto;
  border-right:2px solid var(--ink3);border-bottom:2px solid var(--ink3);
  transform:rotate(-45deg);transition:transform var(--t) var(--ease),border-color var(--t) var(--ease)}
.drawer__nav>ul>li>a:hover::after{transform:rotate(-45deg) translate(3px,3px);border-color:var(--accent)}
.drawer__nav .has__chev svg{width:20px;height:20px}
.drawer__nav .has.is-open .has__chev{transform:rotate(180deg)}
.drawer__nav .subw{display:grid;grid-template-rows:0fr;transition:grid-template-rows 260ms var(--ease)}
.drawer__nav .has.is-open .subw{grid-template-rows:1fr}
.drawer__nav .subw>.sub{overflow:hidden;min-height:0}
.drawer__nav .sub{border-left:2px solid var(--line);margin-left:var(--s2)}
.drawer__nav .sub a{font-family:var(--sans);font-weight:500;font-size:16.5px;color:var(--ink2);
  min-height:48px;padding:11px 0 11px var(--s4);letter-spacing:0}
.drawer__nav .sub a::after{display:none}
.drawer__nav .sub li:last-child a{margin-bottom:var(--s4)}

/* intrarea esalonata a elementelor, ca panoul sa nu apara ca un bloc */
.drawer__nav>ul>li{opacity:0;transform:translateY(10px)}
.drawer.is-open .drawer__nav>ul>li{opacity:1;transform:none;
  transition:opacity 380ms var(--ease),transform 380ms var(--ease)}
.drawer.is-open .drawer__nav>ul>li:nth-child(1){transition-delay:60ms}
.drawer.is-open .drawer__nav>ul>li:nth-child(2){transition-delay:110ms}
.drawer.is-open .drawer__nav>ul>li:nth-child(3){transition-delay:160ms}
.drawer.is-open .drawer__nav>ul>li:nth-child(4){transition-delay:210ms}
.drawer.is-open .drawer__nav>ul>li:nth-child(5){transition-delay:260ms}
.drawer.is-open .drawer__nav>ul>li:nth-child(6){transition-delay:310ms}
.drawer.is-open .drawer__nav>ul>li:nth-child(7){transition-delay:360ms}

/* ==========================================================================
   RITUALUL DE ANTET DE SECTIUNE (Bel-Dent .cin-tag + h2 + lede, centrat).
   Se repeta identic si tine pagina coerenta.
   ========================================================================== */
.sec{padding:var(--s9) 0;position:relative}
.sec--tight{padding:var(--s8) 0}
.sec--band{background:var(--bg2)}
.sec h2{font-size:clamp(32px,4.6vw,54px);margin-bottom:var(--s5)}
.lede{font-size:clamp(17px,1.4vw,19px);line-height:1.6;max-width:62ch;color:var(--ink2)}

.kicker{display:block;font:700 11px/1 var(--sans);color:var(--accent-ink);
  letter-spacing:.32em;text-transform:uppercase;margin-bottom:var(--s4)}
/* Un kicker care urmeaza un titlu are nevoie de aer: titlurile au line-height
   sub 1, deci fara asta eticheta se lipeste de ultimul rand. */
h1+.kicker,h2+.kicker,h1+div>.kicker:first-child{margin-top:var(--s6)}

.sec-head{text-align:center;max-width:760px;margin:0 auto var(--s8)}
.sec-head h2{margin-bottom:var(--s4)}
.sec-head .lede{margin:0 auto;max-width:62ch}
.sec-head--left{text-align:left;margin-left:0;max-width:820px}
.sec-head--left .lede{margin-left:0}

/* ==========================================================================
   1. HERO. Structura este CLONATA de pe bel-dent.ro, selector cu selector:
   .hero-wrap pe inaltimea ecranului cu passe-partout, .ah-stage cu raza 32px,
   fotografie full-bleed cu scrim dublu, rama fina inset, sweep de lumina,
   granulatie, badge cu punct, kicker, titlu pe masti de linie cu subliniere
   desenata, doua butoane pastila, trei jetoane plutitoare pozitionate absolut,
   randul de subtitrare cu doua liniute si indiciul de derulare.
   Singurele schimbari: culorile sunt ale noastre (portocaliu in locul auriului,
   carbon in locul verdelui) si continutul respecta regulile clientului, deci
   zero telefon, zero adresa, zero program si zero rating in hero.
   ========================================================================== */
/* Bel-Dent are antet pe doua randuri, deci 122px sus. Al nostru are un singur
   rand de 72px, deci passe-partout-ul de sus se ajusteaza ca sa nu ramana o
   fasie goala intre antet si scena. */
.hero-wrap{position:relative;z-index:10;height:100vh;min-height:720px;display:flex;
  flex-direction:column;padding:114px 18px 18px;background:var(--bg)}
.hero-wrap .ah-stage{position:relative;flex:1;min-height:540px;border-radius:32px;
  overflow:hidden;isolation:isolate;
  background:linear-gradient(158deg,#2B2E34 0%,#22252B 26%,#1B1E23 48%,#16181C 74%,#0E1013 112%);
  box-shadow:0 30px 90px rgba(22,24,28,.22),0 6px 24px rgba(22,24,28,.12)}

.hero-wrap .ah-immersive{position:absolute;inset:0;z-index:0;overflow:hidden;
  transform-origin:50% 42%}
.hero-wrap .ah-immersive img{display:block;width:100%;height:100%;object-fit:cover;
  object-position:center;transform:translateZ(0)}
/* Fotografia noastra e mult mai colorata si mai aglomerata decat coridorul calm
   de la Bel-Dent, deci scrim-ul are nevoie de mai multa greutate ca textul alb
   sa ramana lizibil. Aceleasi doua straturi, alte opacitati. */
.hero-wrap .ah-immersive::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(10,11,13,.94) 0%,rgba(14,16,19,.86) 32%,rgba(14,16,19,.55) 58%,rgba(22,24,28,.24) 82%,rgba(22,24,28,.14) 100%),
             linear-gradient(180deg,rgba(14,16,19,.45) 0%,rgba(22,24,28,.08) 42%,rgba(10,11,13,.72) 100%)}

.hero-wrap .ah-sky{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-wrap .ah-sweep{position:absolute;inset:-20%;mix-blend-mode:screen;
  background:linear-gradient(115deg,transparent 44%,rgba(232,89,12,.10) 50%,rgba(232,89,12,.05) 53%,transparent 60%);
  animation:ahSweep 15s ease-in-out infinite alternate}
@keyframes ahSweep{from{transform:translate3d(-8%,-4%,0)}to{transform:translate3d(8%,4%,0)}}
.hero-wrap .ah-grain{position:absolute;inset:0;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

/* rama fina inset, ca la Bel-Dent, in portocaliu in loc de auriu */
.hero-wrap .ah-frame{position:absolute;inset:14px;border:1px solid rgba(232,89,12,.24);
  border-radius:22px;pointer-events:none;z-index:3}

.hero-wrap .ah-inner{position:relative;z-index:2;width:100%;height:100%;max-width:1380px;
  margin:0 auto;display:grid;grid-template-columns:minmax(420px,1.02fr) minmax(360px,.98fr);
  align-items:center;gap:clamp(28px,4vw,60px);padding:clamp(32px,4vw,60px) clamp(36px,5vw,84px)}

.hero-wrap .ah-copy{min-width:0}
.hero-wrap .ah-badge{display:inline-flex;align-items:center;gap:9px;font-size:10.5px;
  font-weight:700;letter-spacing:4px;text-transform:uppercase;color:#F1F1F3;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:22px;
  padding:9px 20px;margin-bottom:26px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.hero-wrap .ah-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);
  flex-shrink:0;animation:ahPulse 2.6s ease-out infinite}
@keyframes ahPulse{0%{box-shadow:0 0 0 0 rgba(232,89,12,.55)}70%{box-shadow:0 0 0 9px rgba(232,89,12,0)}100%{box-shadow:0 0 0 0 rgba(232,89,12,0)}}

.hero-wrap .hero-title{font-family:var(--display);font-weight:800;
  font-size:clamp(54px,8.6vw,124px);line-height:.92;letter-spacing:-.045em;color:#fff}
.hero-wrap .ah-kicker{display:block;font-family:var(--sans);font-size:11px;font-weight:700;
  letter-spacing:4px;text-transform:uppercase;color:var(--accent);
  text-shadow:0 2px 10px rgba(14,16,19,.45);margin-bottom:18px}
.hero-wrap .ah-mask{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.hero-wrap .ah-word{display:inline-block;position:relative}
.hero-wrap .ah-hyphen{color:var(--accent)}
.hero-wrap .ah-underline{position:absolute;left:4%;bottom:-.01em;width:92%;height:.13em;
  overflow:visible;pointer-events:none}
.hero-wrap .ah-underline path{fill:none;stroke:var(--accent);stroke-width:2.6;
  stroke-linecap:round;opacity:.95}

.hero-wrap .ah-sub{font-size:16.5px;font-weight:400;line-height:1.75;
  color:rgba(241,241,243,.88);max-width:540px;margin:26px 0 34px}

.hero-wrap .ah-btns{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hero-wrap .ah-btn-p{display:inline-flex;align-items:center;gap:10px;font-size:13px;
  font-weight:700;letter-spacing:.4px;color:var(--deep);background:#fff;padding:16px 30px;
  border-radius:30px;text-decoration:none;box-shadow:0 10px 30px rgba(14,16,19,.28);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.hero-wrap .ah-btn-p:hover{transform:translateY(-2px);text-decoration:none;
  box-shadow:0 16px 40px rgba(14,16,19,.36),0 0 0 1.5px rgba(232,89,12,.55)}
.hero-wrap .ah-btn-arrow{transition:transform .3s var(--ease)}
.hero-wrap .ah-btn-p:hover .ah-btn-arrow{transform:translateX(4px)}
.hero-wrap .ah-btn-o{display:inline-flex;align-items:center;gap:9px;font-size:13px;
  font-weight:700;letter-spacing:.4px;color:#fff;background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.26);padding:15px 26px;border-radius:30px;
  text-decoration:none;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:background-color .3s var(--ease),transform .3s var(--ease)}
.hero-wrap .ah-btn-o:hover{background:rgba(255,255,255,.16);transform:translateY(-2px);
  color:#fff;text-decoration:none}
.hero-wrap .ah-btn-o svg{color:var(--accent);flex-shrink:0}

.hero-wrap .ah-visual{position:relative;height:min(58vh,560px);min-height:420px}
.hero-wrap .ah-chip{position:absolute;z-index:4}
.hero-wrap .ah-chip-in{display:flex;align-items:center;gap:10px;padding:12px 18px;
  border-radius:16px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:0 14px 36px rgba(14,16,19,.35);animation:ahFloat 8s ease-in-out infinite alternate}
@keyframes ahFloat{from{transform:translateY(-5px)}to{transform:translateY(5px)}}
.hero-wrap .ah-chip strong{font-size:15px;font-weight:700;color:#fff;letter-spacing:.2px;line-height:1}
.hero-wrap .ah-chip small{font-size:11px;font-weight:500;color:rgba(241,241,243,.8);line-height:1.2}
.hero-wrap .ah-chip svg{color:var(--accent);flex-shrink:0}
.hero-wrap .ah-chip--a{left:4%;top:12%}
.hero-wrap .ah-chip--b{right:0;bottom:30%}
.hero-wrap .ah-chip--c{left:28%;bottom:4%}
.hero-wrap .ah-chip--b .ah-chip-in{animation-duration:11s;animation-delay:-6s}
.hero-wrap .ah-chip--c .ah-chip-in{animation-duration:9.5s;animation-delay:-3s}

.hero-wrap .ah-stats-caption{position:absolute;left:0;right:0;bottom:-46px;margin:0;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;
  font-size:11px;font-weight:500;letter-spacing:.6px;line-height:1.6;
  color:rgba(241,241,243,.72);text-align:center}
.hero-wrap .ah-caption-rule{display:inline-block;width:26px;height:1px;
  background:rgba(232,89,12,.55);flex-shrink:0}

.hero-wrap .ah-scrollhint{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);
  z-index:4;display:flex;flex-direction:column;align-items:center;gap:8px}
.hero-wrap .ah-scrollhint-line{position:relative;display:block;width:1px;height:42px;
  border-radius:1px;background:rgba(241,241,243,.28);overflow:hidden}
.hero-wrap .ah-scrollhint-dot{position:absolute;left:-1px;top:-8px;width:3px;height:8px;
  border-radius:2px;background:var(--accent);animation:ahScrollDot 2.2s ease-in-out infinite}
@keyframes ahScrollDot{0%{top:-8px;opacity:0}25%{opacity:1}75%{opacity:1}100%{top:42px;opacity:0}}
.hero-wrap .ah-scrollhint-txt{font-size:9px;font-weight:700;letter-spacing:4px;
  text-transform:uppercase;color:rgba(241,241,243,.55)}

/* Coregrafia de intrare. Starile initiale traiesc sub .ah-armed, care se pune cu JS
   si se scoate in primul rAF; fara JS nu se pune deloc, deci nimic nu ramane ascuns. */
.hero-wrap.ah-armed .ah-badge,.hero-wrap.ah-armed .ah-kicker,.hero-wrap.ah-armed .ah-sub,
.hero-wrap.ah-armed .ah-btns a,.hero-wrap.ah-armed .ah-chip,
.hero-wrap.ah-armed .ah-stats-caption,.hero-wrap.ah-armed .ah-scrollhint{opacity:0}
.hero-wrap.ah-armed .ah-word{transform:translateY(118%)}
.hero-wrap.ah-armed .ah-underline path{stroke-dasharray:1;stroke-dashoffset:1}
.hero-wrap.ah-armed .ah-immersive img{transform:scale(1.07)}
.hero-wrap .ah-badge,.hero-wrap .ah-kicker,.hero-wrap .ah-sub,.hero-wrap .ah-btns a,
.hero-wrap .ah-chip,.hero-wrap .ah-stats-caption,.hero-wrap .ah-scrollhint{
  transition:opacity .7s var(--ease),transform .7s var(--ease)}
.hero-wrap .ah-word{transition:transform .9s var(--ease)}
.hero-wrap .ah-underline path{transition:stroke-dashoffset .7s var(--ease) 1.02s}
.hero-wrap .ah-immersive img{transition:transform 1.6s var(--ease)}
.hero-wrap .ah-badge{transition-delay:.12s}
.hero-wrap .ah-kicker{transition-delay:.2s}
.hero-wrap .ah-mask:nth-of-type(1) .ah-word{transition-delay:.26s}
.hero-wrap .ah-mask:nth-of-type(2) .ah-word{transition-delay:.38s}
.hero-wrap .ah-sub{transition-delay:.62s}
.hero-wrap .ah-btns a:nth-child(1){transition-delay:.74s}
.hero-wrap .ah-btns a:nth-child(2){transition-delay:.83s}
.hero-wrap .ah-chip--a{transition-delay:.8s}
.hero-wrap .ah-chip--b{transition-delay:.92s}
.hero-wrap .ah-chip--c{transition-delay:1.04s}
.hero-wrap .ah-stats-caption{transition-delay:1.1s}
.hero-wrap .ah-scrollhint{transition-delay:1.2s}
/* cand hero-ul iese din ecran sau fila e ascunsa, tot ce misca se opreste */
.hero-wrap.ah-paused .ah-sweep,.hero-wrap.ah-paused .ah-chip-in,
.hero-wrap.ah-paused .ah-badge-dot,.hero-wrap.ah-paused .ah-scrollhint-dot{animation-play-state:paused}

/* ==========================================================================
   1b. CARDURI PE TELEFON, unul pentru fiecare serviciu.
   Clonat de pe .lh-slide de la Bel-Dent: fiecare serviciu ocupa un ecran
   intreg, fotografia umple cadrul cu Ken Burns, panoul urca de jos cu stagger
   pe copii, iar o bara de progres arata la al catelea card esti.
   Traieste DOAR sub 901px. Pe desktop ramane grila de carduri.
   ========================================================================== */
.lh{display:none}
/* Carduri VERTICALE, in fluxul normal al paginii. Fiecare ocupa un ecran intreg.
   Nu exista niciun derulator imbricat: varianta aceea se batea cu derularea
   paginii si parea ca hero-ul se suprapune. Nici carusel orizontal: pe orizontala
   observatorul nu vedea cardurile iesite lateral si panourile lor ramaneau
   ascunse, adica dispareau. Delimitarea vine din contor, din muchia portocalie
   si din bara de progres, nu dintr-un mecanism de derulare. */
.lh-scroller{display:flex;flex-direction:column;width:100%}
.lh-slide{position:relative;min-height:100svh;overflow:hidden;background:var(--deep);
  display:flex;flex-direction:column}
/* muchia dintre carduri, ca sa se vada trecerea */
.lh-slide+.lh-slide{border-top:3px solid var(--accent)}
/* contorul: al catelea card, din cate. Sub antetul lipit. */
.lh-count{position:absolute;z-index:3;top:78px;right:16px;display:inline-flex;
  align-items:baseline;gap:3px;padding:7px 13px;border-radius:999px;
  background:rgba(14,16,19,.55);border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  font:700 13px/1 var(--sans);color:#fff;letter-spacing:.5px}
.lh-count i{font-style:normal;opacity:.5;margin:0 1px}
.lh-photo{position:absolute;inset:0;overflow:hidden}
.lh-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;
  transform:scale(1.08);transition:transform 8s cubic-bezier(.4,0,.2,1)}
.lh-slide.in-view .lh-photo img{transform:scale(1);
  animation:lhKenBurns 18s ease-in-out infinite alternate 2s}
@keyframes lhKenBurns{from{transform:scale(1) translate3d(0,0,0)}to{transform:scale(1.08) translate3d(0,-2%,0)}}
.lh-photo--pack{background:#fff}
.lh-photo--pack img{object-fit:contain;padding:12% 14% 34%;mix-blend-mode:multiply}
.lh-photo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(14,16,19,.42) 0%,rgba(22,24,28,.14) 20%,rgba(14,16,19,.62) 42%,rgba(10,11,13,.9) 62%,rgba(10,11,13,.99) 80%,rgba(10,11,13,1) 100%)}
.lh-panel{position:relative;z-index:2;width:100%;margin-top:auto;padding:22px 22px 88px;
  display:flex;flex-direction:column;align-items:flex-start;color:var(--on-deep);
  opacity:0;transform:translateY(28px);
  transition:opacity .9s var(--ease),transform .9s var(--ease)}
.lh-slide.in-view .lh-panel{opacity:1;transform:translateY(0)}
.lh-panel>*{opacity:0;transform:translateY(14px);
  transition:opacity .6s var(--ease),transform .6s var(--ease)}
.lh-slide.in-view .lh-panel>*{opacity:1;transform:translateY(0)}
.lh-slide.in-view .lh-panel>*:nth-child(1){transition-delay:.35s}
.lh-slide.in-view .lh-panel>*:nth-child(2){transition-delay:.45s}
.lh-slide.in-view .lh-panel>*:nth-child(3){transition-delay:.55s}
.lh-slide.in-view .lh-panel>*:nth-child(4){transition-delay:.65s}
.lh-slide.in-view .lh-panel>*:nth-child(5){transition-delay:.75s}
.lh-ofer{display:flex;flex-direction:column;margin-bottom:14px}
.lh-ofer-name{font-family:var(--display);font-size:clamp(30px,7.6vw,40px);font-weight:800;
  line-height:.95;letter-spacing:-.03em;color:#fff}
.lh-ofer-tier{font-family:var(--sans);font-size:clamp(12px,3.4vw,14px);font-weight:700;
  letter-spacing:3px;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.lh-title{font-family:var(--sans);font-size:clamp(15px,4vw,17px);font-weight:400;
  line-height:1.55;color:rgba(241,241,243,.86);margin-bottom:14px;max-width:94%}
.lh-list{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-direction:column;
  gap:6px;max-width:94%}
.lh-list li{position:relative;padding-left:18px;font-size:clamp(14px,3.7vw,15.5px);
  line-height:1.5;color:rgba(241,241,243,.8)}
.lh-list li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:2px;
  background:var(--accent)}
.lh-link{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:800;
  letter-spacing:2px;color:#fff;padding:13px 24px;border:0;border-radius:28px;
  text-transform:uppercase;text-decoration:none;background:var(--accent);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.lh-link:hover{transform:translateY(-1px);color:#fff;text-decoration:none;
  box-shadow:0 12px 26px rgba(232,89,12,.4)}
.lh-link svg{transition:transform .25s var(--ease)}
.lh-link:hover svg{transform:translateX(3px)}
.lh-progress{position:sticky;bottom:0;z-index:5;display:flex;gap:5px;padding:12px 22px 16px;
  background:linear-gradient(180deg,rgba(14,16,19,0),rgba(14,16,19,.9) 45%);
  margin-top:-56px;pointer-events:none}
.lh-pbar{flex:1;height:3px;border-radius:2px;border:0;padding:0;
  background:rgba(241,241,243,.24);transition:background-color .3s var(--ease)}
.lh-pbar.active{background:var(--accent)}

/* ==========================================================================
   2. SERVICIILE: lista editoriala cu fotografie care se schimba.
   Stanga, cele sapte directii ca linii mari de text; dreapta, un singur cadru
   de fotografie care se schimba dupa randul peste care esti. Randul activ isi
   deschide descrierea. Fiecare text apare O SINGURA DATA in pagina, deci nu se
   mai dubleaza titlurile la selectare.
   A treia forma pentru aceasta sectiune: grila de carduri si panourile-evantai
   au fost respinse amandoua.
   ========================================================================== */
.svc-hover{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(32px,4vw,72px);
  align-items:start}

.svc-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line2)}
.svc-list li{border-bottom:1px solid var(--line)}
.svc-list a{display:block;padding:var(--s5) 0;color:var(--ink);text-decoration:none}
.svc-list a:hover{text-decoration:none}
.svc-list__row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4)}
.svc-list__t{font-family:var(--display);font-weight:700;
  font-size:clamp(21px,2.05vw,29px);letter-spacing:-.03em;line-height:1.12;
  transition:color var(--t) var(--ease),transform 420ms var(--ease)}
.svc-list__go{flex:0 0 auto;display:inline-flex;align-items:center;
  font:700 10.5px/1 var(--sans);letter-spacing:2px;text-transform:uppercase;
  color:var(--accent-ink);opacity:0;transform:translateX(-6px);
  transition:opacity 320ms var(--ease),transform 320ms var(--ease)}
.svc-list__go svg{width:13px;height:13px;margin-left:7px}
/* descrierea se deschide doar pe randul activ, deci nu se dubleaza nimic */
.svc-list__d{display:grid;grid-template-rows:0fr;
  transition:grid-template-rows 420ms var(--ease)}
.svc-list__d>span{overflow:hidden;min-height:0;display:block;
  font-size:15.5px;line-height:1.55;color:var(--ink2);max-width:46ch}
.svc-list li.is-on .svc-list__d{grid-template-rows:1fr}
.svc-list li.is-on .svc-list__d>span{padding-top:10px}
.svc-list li.is-on .svc-list__t{color:var(--accent-ink);transform:translateX(6px)}
.svc-list li.is-on .svc-list__go{opacity:1;transform:none}

/* cadrul de fotografie, unul singur, lipit cat trece lista pe langa el */
.svc-view{position:relative;position:sticky;top:132px;aspect-ratio:4/3;
  border-radius:20px;overflow:hidden;background:var(--deep);isolation:isolate;
  box-shadow:0 28px 64px -34px rgba(22,24,28,.5)}
.svc-view__f{position:absolute;inset:0;opacity:0;transform:scale(1.04);
  transition:opacity 620ms var(--ease),transform 900ms var(--ease)}
.svc-view__f.is-on{opacity:1;transform:none}
.svc-view__f img{width:100%;height:100%;object-fit:cover}
.svc-view__f--foto img{object-fit:cover}
.svc-view__f--pack{background:#fff}
.svc-view__f--pack img{object-fit:contain;padding:9%;mix-blend-mode:multiply}
/* linia de accent care marcheaza cadrul */
.svc-view::after{content:"";position:absolute;z-index:2;left:20px;bottom:20px;
  width:46px;height:3px;border-radius:2px;background:var(--accent)}

/* intrarea: randurile se compun de sus in jos, cadrul creste usor */
.js .svc-hover.rv{opacity:1;transform:none}
.js .svc-hover.rv .svc-list li{opacity:0;transform:translateY(14px)}
.js .svc-hover.rv.in .svc-list li{opacity:1;transform:none;
  transition:opacity 520ms var(--ease),transform 520ms var(--ease)}
.js .svc-hover.rv.in .svc-list li:nth-child(2){transition-delay:70ms}
.js .svc-hover.rv.in .svc-list li:nth-child(3){transition-delay:140ms}
.js .svc-hover.rv.in .svc-list li:nth-child(4){transition-delay:210ms}
.js .svc-hover.rv.in .svc-list li:nth-child(5){transition-delay:280ms}
.js .svc-hover.rv.in .svc-list li:nth-child(6){transition-delay:350ms}
.js .svc-hover.rv.in .svc-list li:nth-child(7){transition-delay:420ms}
.js .svc-hover.rv .svc-view{opacity:0;clip-path:inset(0 0 100% 0)}
.js .svc-hover.rv.in .svc-view{opacity:1;clip-path:inset(0 0 0 0);
  transition:opacity 620ms var(--ease),clip-path 820ms var(--ease)}

/* ==========================================================================
   3. SIMPTOMELE, pe doua coloane: titlul ramane fix in stanga cat timp
   randurile trec prin dreapta. Randul se descopera printr-o stergere de la
   stanga la dreapta, iar la trecerea mouse-ului o banda il umple din stanga.
   ========================================================================== */
.symp-split{display:grid;grid-template-columns:minmax(300px,.82fr) 1.18fr;
  gap:clamp(32px,5vw,88px);align-items:start}
.symp-side{position:sticky;top:132px}
.symp-side h2{font-size:clamp(30px,3.6vw,46px);margin-bottom:var(--s4)}
.symp-side .lede{max-width:34ch}

.symp{list-style:none;padding:0;margin:0;border-top:1px solid var(--line2)}
.symp li{position:relative}
.symp a{position:relative;z-index:1;display:flex;align-items:baseline;
  justify-content:space-between;gap:var(--s5);padding:var(--s5) var(--s4);
  border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;
  font-family:var(--display);font-weight:650;font-size:clamp(18px,1.7vw,24px);
  letter-spacing:-.025em;transition:color var(--t) var(--ease),padding-left var(--t) var(--ease)}
/* banda care umple randul de la stanga la dreapta la trecerea mouse-ului */
.symp li::before{content:"";position:absolute;inset:0;z-index:0;background:var(--surface);
  transform:scaleX(0);transform-origin:left;
  transition:transform 460ms var(--ease)}
.symp li:hover::before{transform:scaleX(1)}
.symp a:hover{color:var(--accent-ink);text-decoration:none;padding-left:var(--s5)}
.symp .s-t{display:inline-block;max-width:100%}
.symp .go{font:400 13px/1 var(--sans);color:var(--ink3);flex:0 0 auto;white-space:nowrap;
  letter-spacing:1px;text-transform:uppercase;
  transition:transform var(--t) var(--ease),color var(--t) var(--ease)}
.symp a:hover .go{color:var(--accent-ink);transform:translateX(5px)}

/* Intrarea: fiecare rand se sterge de la stanga la dreapta, unul dupa altul. */
.js .symp.rv{opacity:1;transform:none}
.js .symp.rv li{clip-path:inset(0 100% 0 0)}
.js .symp.rv.in li{clip-path:inset(0 0 0 0);transition:clip-path 720ms var(--ease)}
.js .symp.rv.in li:nth-child(2){transition-delay:90ms}
.js .symp.rv.in li:nth-child(3){transition-delay:180ms}
.js .symp.rv.in li:nth-child(4){transition-delay:270ms}
.js .symp.rv.in li:nth-child(5){transition-delay:360ms}
.js .symp.rv.in li:nth-child(6){transition-delay:450ms}

/* ==========================================================================
   4. RANDURI ALTERNANTE cu fotografie circulara care se deschide
   (Bel-Dent .diff-row, style.css 456-470)
   ========================================================================== */
.diff{display:flex;flex-direction:column;gap:var(--s8)}
.diff-row{display:grid;grid-template-columns:340px 1fr;gap:var(--s8);align-items:center}
.diff-row--flip{grid-template-columns:1fr 340px}
.diff-row--flip .diff-row__img{order:2}
/* Cutia e patrata, deci procentul din clip-path se raporteaza la latura, nu la
   jumatatea ei: 50% este exact cercul inscris. Peste 50% cercul iese din cutie
   si nu mai decupeaza nimic, adica medalionul apare patrat. */
.diff-row__img{position:relative;aspect-ratio:1/1;overflow:hidden;
  clip-path:circle(40% at 50% 50%);transition:clip-path 900ms var(--ease)}
.diff-row.in .diff-row__img{clip-path:circle(50% at 50% 50%)}
.diff-row__img img{width:100%;height:100%;object-fit:cover}
.diff-row__n{display:block;font:700 11px/1 var(--sans);letter-spacing:.28em;
  text-transform:uppercase;color:var(--accent-ink);margin-bottom:var(--s3)}
.diff-row h3{font-size:clamp(22px,2.5vw,32px);margin-bottom:var(--s3)}
.diff-row p{color:var(--ink2);font-size:17px;line-height:1.62;max-width:56ch}
.js .diff-row__txt{opacity:0;transform:translateY(16px)}
.js .diff-row.in .diff-row__txt{opacity:1;transform:none;
  transition:opacity 500ms var(--ease) 200ms,transform 500ms var(--ease) 200ms}

/* ==========================================================================
   5. PROCES. Linie care se umple la derulare, pasi cu punct care pop-uie.
   Numerotarea se scrie "Pasul N", nu ca index de catalog.
   ========================================================================== */
.process-track{position:relative;padding-top:var(--s7)}
.process-line{position:absolute;top:var(--s2);left:0;right:0;height:3px;background:var(--line);
  border-radius:2px;overflow:hidden}
.process-line-fill{position:absolute;inset:0;background:var(--accent);
  transform:scaleX(var(--progress,0));transform-origin:left;
  transition:transform 150ms linear}
.process-steps{display:grid;grid-template-columns:repeat(var(--n,4),1fr);gap:var(--s6)}
.process-step{position:relative}
.process-step::before{content:"";position:absolute;top:calc(var(--s7) * -1 + var(--s2) - 5px);left:0;
  width:13px;height:13px;border-radius:50%;background:var(--accent);
  transform:scale(0);transition:transform 350ms var(--ease)}
.process-step[data-active="1"]::before{transform:scale(1)}
.process-num{display:block;font:700 11px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;
  color:var(--ink3);margin-bottom:var(--s3)}
.process-step[data-active="1"] .process-num{color:var(--accent-ink)}
.process-step h3{font-size:19px;margin-bottom:var(--s2)}
.process-step p{font-size:15.5px;color:var(--ink2);line-height:1.55}

/* ==========================================================================
   6. FIGURI-CARD cu legenda (forma ba-home, fara slider: nu exista perechi)
   ========================================================================== */
.proof-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.proof-cards .shot{background:var(--surface);border:1px solid var(--line);border-radius:18px;
  padding:var(--s3);overflow:hidden}
.proof-cards .shot img{border-radius:12px;aspect-ratio:4/3;object-fit:cover}
.proof-cards .shot figcaption{padding:var(--s4) var(--s2) var(--s2);text-align:center;
  font-size:14px;color:var(--ink2)}

/* ==========================================================================
   7. MARCHIZA DUBLA IN CONTRA-SENS peste fotografie (Bel-Dent .test-section)
   ========================================================================== */
.band-mq{position:relative;padding:var(--s8) 0;overflow:hidden;isolation:isolate;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.band-mq__bg{position:absolute;inset:0;z-index:0}
.band-mq__bg img{width:100%;height:100%;object-fit:cover;opacity:.18}
.band-mq::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,var(--bg) 0%,rgba(244,244,245,.55) 22%,rgba(244,244,245,.55) 78%,var(--bg) 100%)}
.band-mq__in{position:relative;z-index:2;display:grid;gap:var(--s5)}
.band-mq .sec-head{margin-bottom:var(--s6)}
.mq-row{overflow:hidden}
.mq-track{display:flex;gap:var(--s8);width:max-content;will-change:transform}
.mq-track--a{animation:mqa 40s linear infinite}
.mq-track--b{animation:mqb 46s linear infinite}
.band-mq:hover .mq-track{animation-play-state:paused}
.mq-track span{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.4vw,30px);
  letter-spacing:-.03em;color:var(--ink3);white-space:nowrap}
@keyframes mqa{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mqb{from{transform:translateX(-50%)}to{transform:translateX(0)}}

/* ==========================================================================
   8. FASIE DE PRODUSE cu derulare pe orizontala
   ========================================================================== */
.rail{display:flex;gap:var(--s4);overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:var(--s4)}
.rail>*{scroll-snap-align:start;flex:0 0 210px}
.rail::-webkit-scrollbar{height:6px}
.rail::-webkit-scrollbar-thumb{background:var(--line2)}

/* ==========================================================================
   PAGINA DE SERVICIU: antet cu fotografie portret (Bel-Dent .spec-hero)
   ========================================================================== */
.p-hero{padding:var(--s6) 0 var(--s8);position:relative}
.p-hero__g{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--s8);align-items:center}
.p-hero h1{font-size:clamp(34px,5vw,56px);font-weight:800;letter-spacing:-.04em;line-height:1.03}
.p-hero .tldr{margin-top:var(--s5);font-size:clamp(16.5px,1.3vw,18.5px);line-height:1.62;
  color:var(--ink2);max-width:56ch;font-weight:500}
.p-hero__photo{justify-self:end;width:100%;max-width:380px;aspect-ratio:4/5;overflow:hidden;
  border-radius:24px;background:var(--bg2);box-shadow:0 32px 80px -40px rgba(22,24,28,.45)}
.p-hero__photo img{width:100%;height:100%;object-fit:cover}
.p-hero__photo--pack{background:#fff;border:1px solid var(--line)}
.p-hero__photo--pack img{object-fit:contain;padding:var(--s6);mix-blend-mode:multiply}
.p-hero__trust{display:inline-flex;align-items:center;gap:var(--s3);margin-top:var(--s6);
  padding:var(--s3) var(--s5);border:1px solid var(--line);border-radius:999px;
  background:var(--surface);font-size:14.5px;color:var(--ink2);text-decoration:none;
  transition:border-color var(--t) var(--ease)}
.p-hero__trust:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.p-hero__trust b{color:var(--ink);font-weight:650}
/* hairline centrat sub antet, echivalentul page-hero::after de la Bel-Dent */
.p-hero::after{content:"";display:block;width:140px;height:3px;background:var(--accent);
  margin:var(--s8) auto 0;border-radius:2px}

/* grila hairline "ce cuprinde" (Bel-Dent .what-section, fara carduri umbrite) */
.what-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.what-card{padding:var(--s6) var(--s5);border-bottom:1px solid var(--line);
  border-right:1px solid var(--line)}
.what-card:nth-child(3n){border-right:0}
.what-card h3{font-size:18px;margin-bottom:var(--s2);letter-spacing:-.02em}
.what-card p{font-size:15px;color:var(--ink2);line-height:1.55}

/* carduri foto spre paginile surori (Bel-Dent .other-card) */
.nav-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4)}
.nav-card{position:relative;display:block;border-radius:18px;overflow:hidden;
  aspect-ratio:4/3;text-decoration:none;isolation:isolate;background:var(--bg2);
  transition:transform 350ms var(--ease),box-shadow 350ms var(--ease)}
.nav-card:hover{text-decoration:none;transform:translateY(-4px);
  box-shadow:0 22px 48px -26px rgba(22,24,28,.42)}
.nav-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
  transition:transform 600ms var(--ease)}
.nav-card:hover img{transform:scale(1.06)}
.nav-card--pack{background:#fff}
.nav-card--pack img{object-fit:contain;padding:var(--s5);mix-blend-mode:multiply}
.nav-card::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(22,24,28,0) 34%,rgba(22,24,28,.86) 100%)}
.nav-card span{position:absolute;z-index:2;left:var(--s4);right:var(--s4);bottom:var(--s4);
  color:#fff;font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:-.02em;
  line-height:1.2;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s3)}
.nav-card span svg{width:15px;height:15px;flex:0 0 auto;margin-bottom:3px;
  transition:transform var(--t) var(--ease)}
.nav-card:hover span svg{transform:translateX(4px)}
.nav-card--pack::after{background:linear-gradient(180deg,rgba(22,24,28,0) 40%,rgba(22,24,28,.72) 100%)}

/* pasii "prima vizita" cu hairline si nota (Bel-Dent .first-visit) */
.fv-step{border-top:1px solid var(--line);padding:var(--s5) 0}
.fv-step h3{font-size:18px;margin-bottom:var(--s2)}
.fv-step p{font-size:16px;color:var(--ink2)}
.fv-note{border-left:3px solid var(--accent);padding:var(--s3) 0 var(--s3) var(--s5);
  margin-top:var(--s6);color:var(--ink2);font-size:16px}

/* ==========================================================================
   Lista de servicii de pe /servicii: randuri alternante imagine si text.
   ========================================================================== */
.srv-list{display:flex;flex-direction:column;gap:var(--s8)}
.srv{display:grid;grid-template-columns:0.95fr 1.05fr;gap:var(--s7);align-items:center;
  padding-bottom:var(--s8);border-bottom:1px solid var(--line)}
.srv:last-child{border-bottom:0;padding-bottom:0}
.srv--flip .srv__media{order:2}
.srv__media{overflow:hidden;background:var(--bg2);border-radius:18px}
.srv__media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;
  transition:transform 700ms var(--ease)}
.srv:hover .srv__media img{transform:scale(1.03)}
.srv__media--foto img{object-fit:cover}
.srv__media--pack{background:#fff}
.srv__media--pack img{object-fit:contain;padding:var(--s6);mix-blend-mode:multiply}
.srv__body h2{font-size:clamp(24px,2.8vw,34px);margin-bottom:var(--s3)}
.srv__body h2 a{color:var(--ink);text-decoration:none}
.srv__body h2 a:hover{color:var(--accent-ink)}
.srv__lede{font-size:17px;color:var(--ink2);line-height:1.6;max-width:52ch}
.srv__list{margin:var(--s5) 0 0;padding:0;list-style:none;display:grid;gap:9px}
.srv__list li{position:relative;padding-left:20px;font-size:15.5px}
.srv__list li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:2px;
  background:var(--accent)}
.srv__meta{margin-top:var(--s5);font-size:14px;color:var(--ink3)}
.srv__go{display:inline-block;margin-top:var(--s5);font-weight:650;color:var(--accent-ink)}

/* ---------- fotografii ---------- */
.shot{margin:0;overflow:hidden;background:var(--bg2);border-radius:18px}
.shot img{width:100%;transition:transform 900ms var(--ease)}
.shot:hover img{transform:scale(1.03)}
.shot figcaption{font:400 13.5px/1.55 var(--sans);color:var(--ink2);padding:var(--s3) 0 0}
.ill-tag{color:var(--ink3);font-size:12.5px}

.pack{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:var(--s4);display:flex;flex-direction:column;
  transition:border-color var(--t) var(--ease),transform var(--t) var(--ease)}
.pack:hover{border-color:var(--ink);transform:translateY(-3px)}
.pack img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;mix-blend-mode:multiply}
.pack figcaption{font:400 13px/1.45 var(--sans);color:var(--ink2);padding-top:var(--s3);margin-top:auto}
.pack b{display:block;color:var(--ink);font-weight:650;font-size:13.5px;margin-bottom:2px}
.grid-pack{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:var(--s4)}
.grid-shot{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:var(--s5);align-items:start}
.grid-shot .shot img{aspect-ratio:4/3;object-fit:cover}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8);align-items:center}

/* ---------- continut de pagina ---------- */
.prose{max-width:68ch;font-size:17.5px}
.prose p+p{margin-top:var(--s4)}
.prose h3{font-size:23px;margin:var(--s7) 0 var(--s3)}
.prose ul,.prose ol{margin-top:var(--s3)}
.prose li+li{margin-top:7px}
.prose strong{font-weight:650}

.tbl{margin:var(--s6) 0;overflow-x:auto;border:1px solid var(--line);border-radius:14px;
  background:var(--surface)}
.tbl table{min-width:560px}
.tbl th{text-align:left;font:650 13px/1.4 var(--sans);padding:var(--s4);background:var(--deep);
  color:#fff;white-space:nowrap}
.tbl td{padding:var(--s4);border-bottom:1px solid var(--line);font-size:15.5px;vertical-align:top}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:var(--bg)}

.steps{list-style:none;padding:0;margin:var(--s6) 0;counter-reset:st}
.steps li{counter-increment:st;position:relative;padding:0 0 var(--s6) 54px}
.steps li::before{content:counter(st);position:absolute;left:0;top:-1px;width:34px;height:34px;
  border-radius:50%;border:1px solid var(--ink);color:var(--ink);
  font:650 14px/32px var(--sans);text-align:center}
.steps b{display:block;font-family:var(--display);font-size:19px;font-weight:700;margin-bottom:5px;
  letter-spacing:-.02em}
.steps p{color:var(--ink2);font-size:16px}

/* FAQ pe anatomia Bel-Dent: plus din doua pseudo-elemente, rotit la deschidere */
.faq{margin-top:var(--s6);border-top:1px solid var(--line2)}
.faq details,.faq .faq-item{border-bottom:1px solid var(--line)}
.tldr{font-weight:500}
.shot--ill figcaption{font-style:normal}
.faq summary{cursor:pointer;list-style:none;padding:var(--s5) var(--s7) var(--s5) 0;position:relative;
  font-family:var(--display);font-weight:650;font-size:19px;letter-spacing:-.025em;
  transition:color var(--t-fast) var(--ease)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover,.faq details[open] summary{color:var(--accent-ink)}
.faq .plus{position:absolute;right:4px;top:50%;width:18px;height:18px;
  transform:translateY(-50%);transition:transform 300ms var(--ease);pointer-events:none}
.faq .plus::before,.faq .plus::after{content:"";position:absolute;background:currentColor;
  border-radius:1px}
.faq .plus::before{left:0;right:0;top:8px;height:2px}
.faq .plus::after{top:0;bottom:0;left:8px;width:2px}
.faq details[open] .plus{transform:translateY(-50%) rotate(45deg)}
.faq .a{padding:0 var(--s7) var(--s5) 0;color:var(--ink2);max-width:70ch;font-size:16.5px}

.crumb{font:400 14px/1.5 var(--sans);color:var(--ink3);padding:var(--s5) 0 0}
.crumb a{color:var(--ink3);text-decoration:none}
.crumb a:hover{color:var(--accent-ink);text-decoration:underline}
.crumb i{font-style:normal;margin:0 8px;opacity:.5}

.brief{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--s5);
  padding:var(--s6);border:1px solid var(--line2);border-radius:18px;background:var(--surface);
  margin:var(--s7) 0}
.brief dt{font:650 12.5px/1 var(--sans);color:var(--ink3);text-transform:uppercase;letter-spacing:.06em}
.brief dd{margin:9px 0 0;font-size:16px;line-height:1.45}
.brief dd b{font:650 18px/1.2 var(--sans);display:block}

.hours{width:100%;max-width:400px}
.hours td{padding:11px 0;border-bottom:1px solid var(--line);font-size:16px}
.hours td:last-child{text-align:right;font-weight:650;font-variant-numeric:tabular-nums}
.hours .off{color:var(--ink3);font-weight:400}
.map{border:1px solid var(--line);border-radius:18px;overflow:hidden}
.map iframe{width:100%;height:430px;filter:grayscale(1) contrast(1.05)}
/* Clicul in interiorul hartii deschidea coordonate, nu fisa firmei. Butonul de
   sub ea duce direct la fisa, prin identificatorul locului. */
.map-go{display:inline-flex;align-items:center;gap:9px;margin-top:var(--s4);
  padding:13px 22px;border-radius:999px;background:var(--deep);color:#fff;
  font:650 14.5px/1 var(--sans);text-decoration:none;
  transition:background-color var(--t) var(--ease),transform var(--t) var(--ease)}
.map-go:hover{background:var(--accent);color:#fff;text-decoration:none;transform:translateY(-2px)}
.map-go svg{flex:0 0 auto}

/* ==========================================================================
   SUBSOL. Singura suprafata inchisa, si e o incheiere, nu o sectiune de pagina.
   Adresa apare AICI si numai aici, o singura data pe pagina.
   ========================================================================== */
.ftr{position:relative;background:var(--deep);color:var(--on-deep2);
  padding:var(--s9) 0 var(--s6);font-size:15px;line-height:1.75}
.ftr::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(232,89,12,.35),transparent)}
.ftr a{color:var(--on-deep);text-decoration:none}
.ftr a:hover{color:var(--accent);text-decoration:underline}
.ftr-g{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr .9fr;gap:var(--s7)}
/* Sigla din subsol este lockup-ul complet, ca in antet: monograma PLUS numele
   firmei. Doar monograma, la 38px, nu se citea ca sigla. */
.ftr-lockup{display:inline-flex;background:#fff;border-radius:12px;padding:12px 16px;
  margin-bottom:var(--s5);line-height:0;
  transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.ftr-lockup:hover{transform:translateY(-2px);box-shadow:0 10px 26px -10px rgba(0,0,0,.6)}
.ftr-lockup__logo img{height:76px;width:auto;display:block}
.ftr-hours{margin-bottom:var(--s3)}
.ftr-brand{min-width:0}
.ftr h4{font:650 12.5px/1 var(--sans);text-transform:uppercase;letter-spacing:.08em;color:#71757D;margin-bottom:var(--s5)}
.ftr ul{list-style:none;padding:0;margin:0}
.ftr li{margin-bottom:11px}
.ftr svg{height:38px;width:auto;margin-bottom:var(--s5)}
.ftr .fadr{display:inline-block;margin-top:var(--s4);color:var(--on-deep)}
/* Datele de identificare si conturile bancare, cerute explicit de client
   (2026-07-30). IBAN-ul se scrie cu cifre tabulare ca sa se poata citi si copia. */
.ftr-firma{margin-top:var(--s8);padding-top:var(--s6);border-top:1px solid var(--deep-line);
  display:grid;grid-template-columns:1.25fr 1fr;gap:var(--s7)}
.ftr-dl{margin:0;display:grid;gap:var(--s3)}
.ftr-dl>div{display:grid;grid-template-columns:minmax(150px,auto) 1fr;gap:var(--s4);
  align-items:baseline}
.ftr-dl dt{font-size:13px;color:#71757D}
.ftr-dl dd{margin:0;font-size:14.5px;color:var(--on-deep)}
.iban{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13.5px;letter-spacing:.4px;font-variant-numeric:tabular-nums;
  color:#fff;white-space:nowrap}
.ftr-b{margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid var(--deep-line);
  display:flex;justify-content:space-between;gap:var(--s5);flex-wrap:wrap;font-size:13.5px;color:#71757D}
/* Banerele oficiale ANPC, cele reale, nu text. Sunt fotografii pe alb, deci
   stau pe o placuta alba ca sa se citeasca pe subsolul intunecat. */
.ftr-legal{display:inline-flex;align-items:center;gap:var(--s4);flex-wrap:wrap}
.ftr-legal a{display:inline-flex;background:#fff;border-radius:6px;padding:5px 7px;
  line-height:0;transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.ftr-legal a:hover{transform:translateY(-2px);box-shadow:0 8px 20px -8px rgba(0,0,0,.55)}
.ftr-legal img{width:auto;height:26px;display:block}

/* ==========================================================================
   RESPONSIV
   ========================================================================== */
@media (max-width:1080px){
  .srv{grid-template-columns:1fr;gap:var(--s5);padding-bottom:var(--s7)}
  .srv--flip .srv__media{order:0}
  .srv__media img{aspect-ratio:16/9}
  .grid-2{grid-template-columns:1fr;gap:var(--s6)}
  .ftr-g{grid-template-columns:1fr 1fr 1fr;gap:var(--s6)}
  .ftr-firma{grid-template-columns:1fr;gap:var(--s6)}
  /* sub 1080px lista si cadrul se aseaza unul sub altul */
  .svc-hover{grid-template-columns:1fr;gap:var(--s6)}
  .svc-view{position:relative;top:auto;order:-1;aspect-ratio:16/10}
  .symp-split{grid-template-columns:1fr;gap:var(--s6)}
  .symp-side{position:static}
  .what-grid{grid-template-columns:repeat(2,1fr)}
  .what-card:nth-child(3n){border-right:1px solid var(--line)}
  .what-card:nth-child(2n){border-right:0}
  .nav-cards{grid-template-columns:repeat(2,1fr)}
  .p-hero__g{grid-template-columns:1fr;gap:var(--s6)}
  .p-hero__photo{justify-self:start;max-width:320px}
  .proof-cards{grid-template-columns:1fr 1fr}
  .diff-row,.diff-row--flip{grid-template-columns:260px 1fr;gap:var(--s6)}
  .diff-row--flip .diff-row__img{order:0}
}
@media (max-width:900px){
  .nav{display:none}
  .burger{display:grid}
  .hdr .wrap{min-height:64px;gap:var(--s3)}
  .brand__logo img{height:52px}
  .brand small{font-size:10px;padding-left:10px}
  .hdr__act{margin-left:auto}
  .tel{padding:12px 15px;font-size:14px;gap:8px;flex:0 0 auto}
  .hdr__act{flex:0 0 auto;min-width:0}
  .sec{padding:var(--s8) 0}
  .sec--tight{padding:var(--s7) 0}
  .sec-head{margin-bottom:var(--s7)}
  /* Sub 901px hero-ul devine o singura coloana, jetoanele coboara sub butoane
     si intra in randul lor, iar grila de servicii cedeaza locul cardurilor
     pe ecran intreg, cate unul pentru fiecare serviciu. */
  /* Antetul e sticky si ocupa loc in flux, deci hero-ul NU mai are nevoie de
     passe-partout de sus. Alex: prea mult spatiu intre nav si prima imagine. */
  .hero-wrap{height:auto;min-height:0;padding:10px 12px 12px}
  .hero-wrap .ah-stage{min-height:78svh;border-radius:24px}
  /* Pe o coloana textul ocupa toata latimea, deci degradeul orizontal nu mai
     ajuta. Se trece pe unul vertical, care intuneca exact sub text. */
  .hero-wrap .ah-immersive::after{
    background:linear-gradient(180deg,rgba(10,11,13,.62) 0%,rgba(14,16,19,.72) 26%,rgba(10,11,13,.88) 58%,rgba(10,11,13,.96) 100%)}
  .hero-wrap .ah-inner{grid-template-columns:1fr;align-items:end;
    padding:clamp(24px,5vw,40px) clamp(20px,5vw,32px) clamp(28px,6vw,44px)}
  .hero-wrap .hero-title{font-size:clamp(46px,15vw,76px)}
  .hero-wrap .ah-sub{font-size:15px;margin:20px 0 26px;max-width:none}
  .hero-wrap .ah-btns a{flex:1 1 100%;justify-content:center}
  .hero-wrap .ah-visual{height:auto;min-height:0;margin-top:22px}
  .hero-wrap .ah-chip{position:static;display:block}
  .hero-wrap .ah-chip-in{animation:none;width:100%}
  .hero-wrap .ah-visual{display:flex;flex-direction:column;gap:8px}
  .hero-wrap .ah-stats-caption{position:static;margin-top:16px;justify-content:flex-start;
    text-align:left}
  .hero-wrap .ah-scrollhint{display:none}
  .svc-hover{display:none}
  .lh{display:block}
  .process-steps{grid-template-columns:repeat(2,1fr);gap:var(--s5)}
  .process-line{display:none}
  .process-track{padding-top:0}
  .process-step{border-left:2px solid var(--line);padding-left:var(--s5)}
  .process-step[data-active="1"]{border-left-color:var(--accent)}
  .process-step::before{display:none}
}
@media (max-width:640px){
  body{font-size:16.5px}
  .wrap{padding:0 var(--s4)}
  .sec{padding:var(--s7) 0}
  .sec--tight{padding:var(--s6) 0}
  .sec h2{font-size:clamp(26px,7.4vw,36px)}
  .hero-wrap{padding:8px 10px 10px}
  .hero-wrap .ah-stage{border-radius:20px}
  .hero-wrap .ah-frame{inset:10px;border-radius:14px}
  .hero-wrap .ah-badge{font-size:9.5px;letter-spacing:3px;padding:8px 15px;margin-bottom:20px}
  .hero-wrap .ah-kicker{font-size:10px;letter-spacing:3px}
  .what-grid{grid-template-columns:1fr}
  .what-card{border-right:0!important}
  .nav-cards{grid-template-columns:1fr 1fr;gap:var(--s3)}
  .nav-card span{font-size:14px;left:var(--s3);right:var(--s3);bottom:var(--s3)}
  .proof-cards{grid-template-columns:1fr}
  .diff-row,.diff-row--flip{grid-template-columns:1fr;gap:var(--s5)}
  .diff-row__img{max-width:260px;margin:0 auto}
  /* Pe telefon lista tipografica nu functioneaza: intrebarile lungi se rup pe
     doua randuri si totul citeste ca un bloc gri. Fiecare simptom devine un card
     apasabil, cu eticheta deasupra si sageata in dreapta. */
  .symp{border-top:0;display:grid;gap:var(--s3)}
  .symp li{border-radius:16px;overflow:hidden;background:var(--surface);
    border:1px solid var(--line)}
  .symp li::before{display:none}
  .symp a{display:grid;grid-template-columns:1fr auto;align-items:center;
    gap:var(--s3) var(--s4);padding:var(--s4) var(--s4);border-bottom:0;
    font-family:var(--sans);font-weight:600;font-size:16px;line-height:1.4;
    letter-spacing:0}
  .symp a:hover{padding-left:var(--s4)}
  .symp .s-t{grid-column:1;order:2}
  .symp .go{grid-column:1;order:1;display:block;font:700 10.5px/1 var(--sans);
    letter-spacing:2px;text-transform:uppercase;color:var(--accent-ink);
    margin-bottom:2px}
  .symp li::after{content:"";grid-column:2;position:absolute;right:var(--s4);
    top:50%;width:9px;height:9px;margin-top:-5px;border-right:2px solid var(--ink3);
    border-bottom:2px solid var(--ink3);transform:rotate(-45deg)}
  .symp li{position:relative}
  .symp a{padding-right:var(--s7)}
  .grid-pack{grid-template-columns:1fr 1fr;gap:var(--s3)}
  .grid-shot{grid-template-columns:1fr}
  .brief{padding:var(--s5);grid-template-columns:1fr;gap:var(--s4)}
  .ftr-g{grid-template-columns:1fr;gap:var(--s6)}
  .ftr-dl>div{grid-template-columns:1fr;gap:2px}
  .ftr-lockup__logo img{height:64px}
  .iban{white-space:normal;word-break:break-all}
  .ftr{padding:var(--s8) 0 var(--s5)}
  .prose{font-size:16.5px}
  /* Tabelele nu incap pe latimea unui telefon. Fiecare rand devine un card, iar
     fiecare valoare isi poarta numele coloanei deasupra. Fara derulare laterala. */
  .tbl{border:0;background:none;border-radius:0;overflow:visible;margin:var(--s5) 0}
  .tbl table{min-width:0;width:100%}
  .tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .tbl table,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
  .tbl tr{background:var(--surface);border:1px solid var(--line);border-radius:14px;
    padding:var(--s4);margin-bottom:var(--s3)}
  .tbl tr:last-child{margin-bottom:0}
  .tbl tbody tr:hover{background:var(--surface)}
  .tbl td{border:0;padding:0;font-size:15.5px;line-height:1.55}
  .tbl td:first-child{font-family:var(--display);font-weight:700;font-size:17.5px;
    letter-spacing:-.02em;line-height:1.25;padding-bottom:var(--s3);margin-bottom:var(--s3);
    border-bottom:1px solid var(--line)}
  .tbl td+td{margin-top:var(--s4)}
  .tbl td[data-th]:not(:first-child)::before{content:attr(data-th);display:block;
    font:700 10.5px/1 var(--sans);letter-spacing:1.6px;text-transform:uppercase;
    color:var(--accent-ink);margin-bottom:6px}
  .map iframe{height:300px}
  .steps li{padding-left:46px}
  .rail>*{flex:0 0 160px}
  .p-hero{padding:var(--s5) 0 var(--s7)}
  .p-hero::after{margin-top:var(--s7)}
  .mq-track{gap:var(--s6)}
}
@media (max-width:430px){
  /* numarul scris nu mai incape langa sigla si burger. Ramane butonul cu
     iconita, care suna la fel. Numarul complet e in subsol. */
  .tel__n{display:none}
  .tel{padding:13px;border-radius:50%;gap:0}
  .tel svg{width:19px;height:19px}
  .brand small{display:none}
  .brand__logo img{height:46px}
}
@media (max-width:380px){
  .hero-wrap .hero-title{font-size:clamp(40px,14vw,58px)}
  .grid-pack{grid-template-columns:1fr}
  .nav-cards{grid-template-columns:1fr}
}

/* ==========================================================================
   MISCARE REDUSA. Tot ce misca se opreste, nimic nu ramane ascuns.
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  .js .rv,.js .rv-s{opacity:1!important;transform:none!important;transition:none!important}
  .hero-wrap.ah-armed .ah-badge,.hero-wrap.ah-armed .ah-kicker,.hero-wrap.ah-armed .ah-sub,
  .hero-wrap.ah-armed .ah-btns a,.hero-wrap.ah-armed .ah-chip,
  .hero-wrap.ah-armed .ah-stats-caption,.hero-wrap.ah-armed .ah-scrollhint,
  .lh-panel,.lh-panel>*,
  .js .symp.rv li,
  .js .diff-row__txt{opacity:1!important;transform:none!important}
  .js .svc-hover.rv .svc-list li{opacity:1!important;transform:none!important}
  .js .svc-hover.rv .svc-view{opacity:1!important;clip-path:none!important}
  .js .symp.rv li{clip-path:none!important}
  .hero-wrap.ah-armed .ah-word{transform:none!important}
  .hero-wrap.ah-armed .ah-underline path{stroke-dasharray:none!important;stroke-dashoffset:0!important}
  .hero-wrap .ah-immersive img,.hero-wrap.ah-armed .ah-immersive img,
  .lh-photo img,.lh-slide.in-view .lh-photo img{transform:none!important;animation:none!important}
  .ah-sweep,.ah-chip-in,.ah-badge-dot,.ah-scrollhint-dot{animation:none!important}
  .mq-track{animation:none!important}
  .mq-row{overflow-x:auto}
  .diff-row__img{clip-path:none!important}
  .process-line-fill{transform:scaleX(1)!important}
  .process-step::before{transform:scale(1)!important}
  *{transition-duration:1ms!important;animation-duration:1ms!important}
}

@media print{
  .hdr,.burger,.nav,.band-mq,iframe,.drawer{display:none!important}
  body{background:#fff;color:#000}
  .ftr{background:none;color:#000;border-top:1px solid #000}
  .ftr a{color:#000}
  .sec{padding:12pt 0;break-inside:avoid}
  .faq .a{display:block!important}
}