﻿/* ============================================================================
   Redesign pagina de prezentare a clinicii (Landing-Page-Clinica.aspx).

   Stilurile vin din mockup-ul primit, pastrate cat mai aproape de original.
   Fisierul se incarca DUPA vechile PrezentareClinica*.css, ca sa le suprascrie
   acolo unde se suprapun, fara sa le stergem (le mai folosesc alte pagini,
   de exemplu Landing-Page-Clinica-vechi.aspx).

   Tot ce tine de redesign e prefixat cu .clsRedesign pe containerul paginii,
   ca stilurile sa nu scape in alte pagini care includ aceleasi fisiere.
   ============================================================================ */
/* ------------------------------------------------------------
   Paleta portalului: mov + alb, verde pentru „Sună", portocaliu pentru stele
   ------------------------------------------------------------ */
:root{
  --violet-deep:#4a3fbd;
  --violet:#5b4bd2;
  --violet-bright:#6c5ce7;
  --violet-soft:#a89ef7;
  --lav-2:#e9e5fa;
  --lav:#f4f2fc;
  --lav-line:#e4e0f6;
  --green:#28c344;
  --green-dark:#1eaa3a;
  --wa:#25d366;
  --star:#f5a623;
  --ink:#24263a;
  --slate:#646880;
  --muted:#9a9db3;
  --line:#ebe9f4;
  --top:64px;
}
#paginaClinicaNoua{color-scheme:light;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
#paginaClinicaNoua *,#paginaClinicaNoua *::before,#paginaClinicaNoua *::after{box-sizing:border-box}
#paginaClinicaNoua{
  margin:0;background:#fff;color:var(--ink);
  font-family:'Raleway','Segoe UI',system-ui,-apple-system,sans-serif;
  font-size:15px;line-height:1.55;font-variant-numeric:lining-nums;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
#paginaClinicaNoua svg{display:block}
#paginaClinicaNoua a{color:var(--violet)}
#paginaClinicaNoua button{font-family:inherit;color:inherit}
#paginaClinicaNoua :focus-visible{outline:3px solid var(--violet-soft);outline-offset:2px;border-radius:6px}
#paginaClinicaNoua .visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#paginaClinicaNoua .container{max-width:1200px;margin:0 auto;padding:0 28px}
#paginaClinicaNoua .icon{width:20px;height:20px;flex:none}
#paginaClinicaNoua .num{font-variant-numeric:lining-nums tabular-nums}
#paginaClinicaNoua section{scroll-margin-top:calc(var(--top) + 20px)}

/* Butoane: pilule, ca în pagina actuală */
#paginaClinicaNoua .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:42px;padding:0 18px;border-radius:999px;border:1px solid transparent;
  font-family:inherit;font-weight:600;font-size:14px;line-height:1;letter-spacing:.01em;
  text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-color .12s,border-color .12s;
}
#paginaClinicaNoua .btn .icon{width:17px;height:17px}
#paginaClinicaNoua .btn--violet{background:var(--violet-bright);color:#fff}
#paginaClinicaNoua .btn--violet:hover{background:var(--violet)}
#paginaClinicaNoua .btn--green{background:var(--green);color:#fff}
#paginaClinicaNoua .btn--green:hover{background:var(--green-dark)}
#paginaClinicaNoua .btn--wa{background:#fff;color:#149a48;border-color:#bfe9cf}
#paginaClinicaNoua .btn--wa:hover{background:#eefaf1}
#paginaClinicaNoua .btn--soft{background:var(--lav);color:var(--violet)}
#paginaClinicaNoua .btn--soft:hover{background:var(--lav-2)}
#paginaClinicaNoua .btn--outline{background:#fff;color:var(--ink);border-color:var(--lav-line)}
#paginaClinicaNoua .btn--outline:hover{border-color:var(--violet-soft);color:var(--violet)}
#paginaClinicaNoua .btn--sm{height:34px;padding:0 13px;font-size:13px}
#paginaClinicaNoua .linkbtn{background:none;border:0;padding:0;color:var(--violet);font-weight:600;font-size:14px;cursor:pointer;font-family:inherit}
#paginaClinicaNoua .linkbtn:hover{text-decoration:underline}

/* ------------------------------------------------------------
   Header mov, sticky: înapoi · clinica · tab-urile de acum ca ancore · cont
   ------------------------------------------------------------ */
#paginaClinicaNoua .topbar{position:sticky;top:0;z-index:60;background:linear-gradient(90deg,var(--violet-deep),var(--violet-bright));color:#fff}
#paginaClinicaNoua .topbar .container{display:flex;align-items:center;gap:22px;min-height:var(--top)}
#paginaClinicaNoua .back{width:40px;height:40px;border-radius:10px;border:0;flex:none;cursor:pointer;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center}
#paginaClinicaNoua .back:hover{background:rgba(255,255,255,.26)}
#paginaClinicaNoua .brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;min-width:0}
#paginaClinicaNoua .brand__logo{width:34px;height:34px;border-radius:9px;background:#fff;color:#2b2b2b;flex:none;display:grid;place-items:center;font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:15px;letter-spacing:-.04em}
#paginaClinicaNoua .brand__name{font-weight:700;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#paginaClinicaNoua .nav{display:flex;align-items:center;gap:2px;margin:0 auto;height:var(--top)}
#paginaClinicaNoua .nav a{position:relative;display:inline-flex;align-items:center;height:100%;padding:0 12px;color:rgba(255,255,255,.8);font-weight:500;font-size:14px;text-decoration:none;white-space:nowrap}
#paginaClinicaNoua .nav a:hover{color:#fff}
#paginaClinicaNoua .nav a.is-active{color:#fff;font-weight:600}
#paginaClinicaNoua .nav a.is-active::after{content:"";position:absolute;left:12px;right:12px;bottom:15px;height:2px;border-radius:2px;background:#fff}
#paginaClinicaNoua .avatar{width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);font-weight:700;font-size:14px}

/* ------------------------------------------------------------
   Grila paginii: conținut la stânga, card de acțiuni sticky la dreapta
   ------------------------------------------------------------ */
#paginaClinicaNoua .page{
  display:grid;grid-template-columns:minmax(0,1fr) 340px;
  grid-template-areas:"head side" "content side";
  column-gap:56px;padding-top:32px;padding-bottom:56px;
}
#paginaClinicaNoua .head{grid-area:head}
#paginaClinicaNoua .content{grid-area:content}
#paginaClinicaNoua .side{grid-area:side}

/* Identitate */
#paginaClinicaNoua .identity{display:flex;align-items:center;gap:18px}
#paginaClinicaNoua .logo{width:76px;height:76px;border-radius:18px;background:#fff;border:1px solid var(--lav-line);flex:none;display:grid;place-items:center;text-align:center;color:#2b2b2b}
#paginaClinicaNoua .logo__mono{font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:30px;line-height:1;letter-spacing:-.06em}
#paginaClinicaNoua .logo__sub{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:10px;color:#8a6f5a;margin-top:3px}
#paginaClinicaNoua .identity h1{margin:0;font-size:27px;line-height:1.2;font-weight:700;letter-spacing:-.012em}
#paginaClinicaNoua .identity__kind{margin:4px 0 0;color:var(--slate);font-size:15px}
#paginaClinicaNoua .rating{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px;font-size:14px;color:var(--slate)}
#paginaClinicaNoua .stars{display:inline-flex;gap:1px;color:var(--star)}
#paginaClinicaNoua .stars .icon{width:16px;height:16px}
#paginaClinicaNoua .rating b{color:var(--ink);font-size:15px;font-weight:800}
#paginaClinicaNoua .rating a{font-weight:600;text-decoration:none}
#paginaClinicaNoua .rating a:hover{text-decoration:underline}

/* Foto de copertă */
#paginaClinicaNoua .cover{position:relative;margin-top:22px;aspect-ratio:16/7;border-radius:18px;overflow:hidden}
#paginaClinicaNoua .cover .ph{position:absolute;inset:0;border:0}
#paginaClinicaNoua .cover__pill{
  position:absolute;right:14px;bottom:14px;height:34px;padding:0 13px;border-radius:999px;
  background:#fff;color:var(--ink);font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:7px;
  text-decoration:none;box-shadow:0 4px 14px rgba(36,38,58,.12);
}
#paginaClinicaNoua .cover__pill .icon{width:16px;height:16px;color:var(--violet)}

/* Placeholder foto: suprafață calmă, cu etichetă — se înlocuiește cu imaginile reale */
#paginaClinicaNoua .ph{position:relative;background:var(--lav);border:1px solid var(--lav-line);overflow:hidden}
#paginaClinicaNoua .ph::after{content:attr(data-label);position:absolute;left:10px;bottom:7px;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--violet-soft)}

/* Titluri de secțiune: mov, majuscule, cu linie — ca în pagina de acum */
#paginaClinicaNoua .sec{margin-top:46px}
#paginaClinicaNoua .stitle{display:flex;align-items:center;gap:14px;margin:0 0 16px}
#paginaClinicaNoua .stitle h2,#paginaClinicaNoua .stitle h3,#paginaClinicaNoua .stitle h4{margin:0;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--violet)}
#paginaClinicaNoua .stitle .rule{flex:1;height:1px;background:var(--line)}
#paginaClinicaNoua .stitle .count{font-size:13px;font-weight:600;color:var(--muted);letter-spacing:0}
#paginaClinicaNoua .stitle .act{font-size:13.5px;font-weight:600;color:var(--violet);text-decoration:none;background:none;border:0;padding:0;cursor:pointer;font-family:inherit;white-space:nowrap}
#paginaClinicaNoua .stitle .act:hover{text-decoration:underline}
#paginaClinicaNoua .sub{margin-top:30px}
#paginaClinicaNoua [data-collapsed] > .is-extra{display:none}

/* Descriere */
#paginaClinicaNoua .prose p{margin:0 0 12px;font-size:15.5px;line-height:1.7;max-width:70ch}
#paginaClinicaNoua .prose p.note{color:var(--slate)}
#paginaClinicaNoua .clamp{position:relative;max-height:calc(1.7em * 5);overflow:hidden}
#paginaClinicaNoua .clamp::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.6em;background:linear-gradient(180deg,rgba(255,255,255,0),#fff)}
#paginaClinicaNoua .clamp.is-open{max-height:none}
#paginaClinicaNoua .clamp.is-open::after{display:none}

/* Servicii: iconițe line-art + etichete mov, ca acum, dar clickabile */
#paginaClinicaNoua .svcs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
#paginaClinicaNoua .svc{
  display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 8px 14px;border-radius:12px;
  text-decoration:none;color:var(--violet);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-align:center;line-height:1.3;
}
#paginaClinicaNoua .svc .icon{width:34px;height:34px}
#paginaClinicaNoua .svc:hover{background:var(--lav)}

/* Facilități */
#paginaClinicaNoua .facs{display:flex;flex-wrap:wrap;gap:12px 34px}
#paginaClinicaNoua .fac{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:500}
#paginaClinicaNoua .fac .icon{width:22px;height:22px;color:var(--violet)}

/* Echipă */
#paginaClinicaNoua .doc{display:flex;align-items:center;gap:16px;padding:14px 0;border-top:1px solid var(--line)}
#paginaClinicaNoua .doc:last-of-type{border-bottom:1px solid var(--line)}
#paginaClinicaNoua .doc__photo{width:64px;height:64px;border-radius:50%;background:var(--lav);border:1px solid var(--lav-line);color:var(--violet);font-weight:700;font-size:18px;display:grid;place-items:center;flex:none}
#paginaClinicaNoua .doc__name{margin:0;font-size:16px;font-weight:700;color:var(--violet)}
#paginaClinicaNoua .doc__name a{color:inherit;text-decoration:none}
#paginaClinicaNoua .doc__name a:hover{text-decoration:underline}
#paginaClinicaNoua .doc__spec{margin:2px 0 0;color:var(--slate);font-size:14px}
#paginaClinicaNoua .doc .btn{margin-left:auto}

/* Listă de prețuri: categorii la stânga (ca acum), tabel cu puncte de ghidare la dreapta */
#paginaClinicaNoua .prices{display:grid;grid-template-columns:220px minmax(0,1fr);gap:34px;align-items:start}
#paginaClinicaNoua .catlist{display:grid;gap:2px}
#paginaClinicaNoua .cat{
  display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;width:100%;
  border:0;background:none;padding:10px 12px;border-radius:10px;font-weight:600;font-size:14.5px;color:var(--slate);cursor:pointer;
}
#paginaClinicaNoua .cat .icon{width:16px;height:16px;opacity:0}
#paginaClinicaNoua .cat:hover{background:var(--lav);color:var(--violet)}
#paginaClinicaNoua .cat.is-active{background:var(--lav);color:var(--violet)}
#paginaClinicaNoua .cat.is-active .icon{opacity:1}
#paginaClinicaNoua .search{position:relative}
#paginaClinicaNoua .search .icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--muted)}
#paginaClinicaNoua .search input{width:100%;height:42px;border-radius:999px;border:1px solid var(--lav-line);background:#fff;padding:0 16px 0 42px;font-family:inherit;font-size:14px;color:var(--ink)}
#paginaClinicaNoua .search input:focus{outline:none;border-color:var(--violet-soft);box-shadow:0 0 0 3px var(--lav)}
#paginaClinicaNoua .pgroup{display:flex;align-items:baseline;justify-content:space-between;margin:22px 0 2px;padding-bottom:6px;border-bottom:1.5px solid var(--violet-soft);color:var(--violet);font-weight:700;font-size:14px}
#paginaClinicaNoua .pgroup .num{font-size:12.5px;color:var(--muted);font-weight:600}
#paginaClinicaNoua .prow{display:flex;align-items:baseline;gap:10px;padding:9px 0}
#paginaClinicaNoua .prow__name{font-size:14.5px}
#paginaClinicaNoua .prow__dots{flex:1;min-width:24px;border-bottom:1px dotted #cbc6ea;margin-bottom:4px}
#paginaClinicaNoua .prow__price{font-variant-numeric:lining-nums tabular-nums;font-weight:700;font-size:14.5px;white-space:nowrap}
#paginaClinicaNoua .prow__price small{font-weight:600;color:var(--slate);font-size:12px;margin-left:3px}
#paginaClinicaNoua mark{background:#fff1b8;color:inherit;border-radius:3px;padding:0 1px}
#paginaClinicaNoua .pmore{margin-top:14px}
#paginaClinicaNoua .pempty{padding:26px 0;color:var(--slate)}
#paginaClinicaNoua .pempty p{margin:0 0 12px}
#paginaClinicaNoua .pnote{margin:12px 0 0;font-size:12.5px;color:var(--muted)}

/* Galerie */
#paginaClinicaNoua .strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
#paginaClinicaNoua .tile{position:relative;display:block;aspect-ratio:1;border-radius:12px;overflow:hidden;text-decoration:none}
#paginaClinicaNoua .tile .ph{position:absolute;inset:0}
#paginaClinicaNoua .tile__more{position:absolute;inset:0;display:grid;place-items:center;text-align:center;background:rgba(91,75,210,.8);color:#fff;font-weight:700;font-size:16px;line-height:1.25}
#paginaClinicaNoua .tile__more small{display:block;font-size:12px;font-weight:500;opacity:.92}
#paginaClinicaNoua .strip:not([data-collapsed]) .tile__more{display:none}

/* Review-uri */
#paginaClinicaNoua .rsum{display:flex;align-items:center;gap:28px;padding:4px 0 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
#paginaClinicaNoua .rbig{font-size:44px;font-weight:800;line-height:1;letter-spacing:-.03em}
#paginaClinicaNoua .rsum__meta p{margin:4px 0 0;color:var(--slate);font-size:13.5px}
#paginaClinicaNoua .rbars{display:grid;gap:5px;min-width:230px}
#paginaClinicaNoua .bar{display:grid;grid-template-columns:42px minmax(0,1fr) 24px;gap:8px;align-items:center;font-size:12px;color:var(--slate)}
#paginaClinicaNoua .bar__track{height:6px;border-radius:999px;background:var(--lav-2)}
#paginaClinicaNoua .bar__fill{height:100%;border-radius:999px;background:var(--green)}
#paginaClinicaNoua .bar__n{text-align:right;font-weight:600}
#paginaClinicaNoua .rsum .btn{margin-left:auto}
#paginaClinicaNoua .rev{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
#paginaClinicaNoua .rev__avatar{width:44px;height:44px;border-radius:50%;background:var(--lav);border:1px solid var(--lav-line);color:var(--violet);font-weight:700;font-size:14px;display:grid;place-items:center}
#paginaClinicaNoua .rev__head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
#paginaClinicaNoua .rev__name{font-weight:700;font-size:14.5px}
#paginaClinicaNoua .rev__date{color:var(--muted);font-size:13px}
#paginaClinicaNoua .rev .stars{margin-top:4px}
#paginaClinicaNoua .rev .stars .icon{width:14px;height:14px}
#paginaClinicaNoua .rev__text{margin:8px 0 0;color:var(--slate);font-size:14.5px;line-height:1.6}
#paginaClinicaNoua .rev__text.clamp{max-height:calc(1.6em * 3)}
#paginaClinicaNoua .rev .linkbtn{margin-top:6px;font-size:13.5px}
#paginaClinicaNoua .more{margin-top:16px}

/* Articole */
#paginaClinicaNoua .art{display:grid;grid-template-columns:136px minmax(0,1fr);gap:18px;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
#paginaClinicaNoua .art:first-of-type{border-top:1px solid var(--line)}
#paginaClinicaNoua .art .ph{height:96px;border-radius:10px}
#paginaClinicaNoua .art__cat{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--violet)}
#paginaClinicaNoua .art h3{margin:5px 0 4px;font-size:16.5px;font-weight:700;line-height:1.3}
#paginaClinicaNoua .art:hover h3{color:var(--violet)}
#paginaClinicaNoua .art p{margin:0;color:var(--slate);font-size:14px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#paginaClinicaNoua .art__meta{display:flex;align-items:center;gap:14px;margin-top:8px;font-size:12.5px;color:var(--muted)}
#paginaClinicaNoua .art__meta .react{margin-left:auto;display:inline-flex;gap:12px}
#paginaClinicaNoua .react span{display:inline-flex;align-items:center;gap:4px;font-weight:600}
#paginaClinicaNoua .react .icon{width:15px;height:15px}

/* Contact */
#paginaClinicaNoua .contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:36px}
#paginaClinicaNoua .contact .stitle{margin-bottom:10px}
#paginaClinicaNoua .contact .stitle + .stitle{margin-top:22px}
#paginaClinicaNoua .block + .block{margin-top:22px}
#paginaClinicaNoua .addr{margin:0;font-size:15px;line-height:1.5}
#paginaClinicaNoua .addr strong{font-weight:700}
#paginaClinicaNoua .addr .zone{display:block;color:var(--slate);font-size:14px}
#paginaClinicaNoua .addr + .btn{margin-top:12px}
#paginaClinicaNoua .tlist{display:grid;gap:8px}
#paginaClinicaNoua .titem{display:flex;align-items:center;gap:10px;font-size:14.5px}
#paginaClinicaNoua .titem .icon{width:20px;height:20px;color:var(--violet)}
#paginaClinicaNoua .titem .no{color:var(--muted)}
#paginaClinicaNoua .reveal{display:grid;gap:4px}
#paginaClinicaNoua .reveal button{display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:6px 0;color:var(--violet);font-weight:600;font-size:14.5px;cursor:pointer;text-align:left}
#paginaClinicaNoua .reveal button .icon{width:18px;height:18px}
#paginaClinicaNoua .reveal button:hover .lbl{text-decoration:underline}
#paginaClinicaNoua .reveal .val{color:var(--ink);font-weight:700;font-variant-numeric:lining-nums tabular-nums}
#paginaClinicaNoua .social{display:flex;gap:10px;margin-top:14px}
#paginaClinicaNoua .social a{width:38px;height:38px;border-radius:10px;border:1px solid var(--lav-line);display:grid;place-items:center;color:var(--violet)}
#paginaClinicaNoua .social a:hover{background:var(--lav)}
#paginaClinicaNoua .map{
  position:relative;min-height:340px;height:100%;border-radius:14px;overflow:hidden;border:1px solid var(--lav-line);
  background-color:#f8f7fd;
  background-image:
    linear-gradient(var(--line) 1px,transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px),
    linear-gradient(115deg,transparent 46%,var(--lav-2) 47%,var(--lav-2) 51%,transparent 52%),
    linear-gradient(20deg,transparent 60%,var(--lav-2) 61%,var(--lav-2) 64%,transparent 65%);
  background-size:36px 36px,36px 36px,100% 100%,100% 100%;
}
#paginaClinicaNoua .map__pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-90%);color:var(--violet)}
#paginaClinicaNoua .map__pin .icon{width:44px;height:44px}
#paginaClinicaNoua .map__label{position:absolute;left:12px;bottom:9px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--violet-soft)}
#paginaClinicaNoua .eval{margin-top:28px;border:1px solid var(--lav-line);border-radius:14px;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;background:var(--lav)}
#paginaClinicaNoua .eval h3{margin:0;font-size:15.5px;font-weight:700;color:var(--violet)}
#paginaClinicaNoua .eval p{margin:5px 0 0;font-size:13.5px;color:var(--slate);display:flex;align-items:center;gap:6px}
#paginaClinicaNoua .eval p .icon{width:14px;height:14px}

/* Footer */
#paginaClinicaNoua .foot{margin-top:52px;padding-top:18px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px}
#paginaClinicaNoua .foot__nav{display:flex;gap:18px}
#paginaClinicaNoua .foot__nav a{display:inline-flex;align-items:center;gap:6px;color:var(--violet);font-weight:600;text-decoration:none}
#paginaClinicaNoua .foot__nav a:hover{text-decoration:underline}
#paginaClinicaNoua .foot__nav .icon{width:16px;height:16px}

/* ------------------------------------------------------------
   Cardul de acțiuni: singurul element cu umbră; rămâne pe ecran la scroll
   ------------------------------------------------------------ */
#paginaClinicaNoua .card{position:sticky;top:calc(var(--top) + 20px);background:#fff;border:1px solid var(--lav-line);border-radius:18px;padding:20px;box-shadow:0 14px 44px rgba(74,63,189,.10)}
#paginaClinicaNoua .card__status{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--slate)}
#paginaClinicaNoua .card__status .dot{width:9px;height:9px;border-radius:50%;background:var(--muted);flex:none}
#paginaClinicaNoua .card__status.is-open{color:var(--green-dark)}
#paginaClinicaNoua .card__status.is-open .dot{background:var(--green)}
#paginaClinicaNoua .card__hours{margin:3px 0 16px 17px;font-size:13.5px;color:var(--slate)}
#paginaClinicaNoua .card .btn{width:100%;height:46px}
#paginaClinicaNoua .card .btn + .btn{margin-top:8px}
#paginaClinicaNoua .card hr{border:0;border-top:1px solid var(--line);margin:18px 0}
#paginaClinicaNoua .card .stitle{margin-bottom:8px}
#paginaClinicaNoua .sched{list-style:none;margin:0;padding:0}
#paginaClinicaNoua .sched li{display:flex;align-items:baseline;gap:8px;padding:5px 0;font-size:13.5px;color:var(--slate)}
#paginaClinicaNoua .sched li .dots{flex:1;border-bottom:1px dotted #d6d2ee;margin-bottom:4px}
#paginaClinicaNoua .sched li b{font-weight:600;color:var(--ink);font-variant-numeric:lining-nums tabular-nums}
#paginaClinicaNoua .sched li.is-closed b{color:var(--muted);font-weight:500}
#paginaClinicaNoua .sched li.is-today{color:var(--violet);font-weight:700}
#paginaClinicaNoua .sched li.is-today b{color:var(--violet);font-weight:800}
#paginaClinicaNoua .card__addr{margin:0;font-size:13.5px;line-height:1.5;color:var(--slate)}
#paginaClinicaNoua .card__addr strong{color:var(--ink);font-weight:600}
#paginaClinicaNoua .card__nav{display:inline-flex;align-items:center;gap:7px;margin-top:8px;color:var(--violet);font-weight:600;text-decoration:none;font-size:13.5px}
#paginaClinicaNoua .card__nav .icon{width:16px;height:16px}
#paginaClinicaNoua .card__nav:hover{text-decoration:underline}

/* Flotante */
#paginaClinicaNoua .wa{position:fixed;left:22px;bottom:22px;z-index:55;width:56px;height:56px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 10px 26px rgba(37,211,102,.35);text-decoration:none}
#paginaClinicaNoua .wa .icon{width:28px;height:28px}
#paginaClinicaNoua .mobilebar{position:fixed;left:0;right:0;bottom:0;z-index:58;display:none;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line);box-shadow:0 -10px 30px rgba(36,38,58,.08)}
#paginaClinicaNoua .mobilebar .btn{flex:1;height:46px;padding:0 10px}

/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */
@media (max-width:1060px){
  :root{--top:108px}
  #paginaClinicaNoua .topbar .container{flex-wrap:wrap;row-gap:0;min-height:0;padding-top:12px}
  #paginaClinicaNoua .brand{flex:1}
  #paginaClinicaNoua .nav{order:10;flex:1 0 100%;height:44px;margin:4px 0 0;overflow-x:auto;scrollbar-width:none;justify-content:flex-start}
  #paginaClinicaNoua .nav::-webkit-scrollbar{display:none}
  #paginaClinicaNoua .nav a{padding:0 11px;font-size:13.5px}
  #paginaClinicaNoua .nav a.is-active::after{bottom:6px}
  #paginaClinicaNoua .page{column-gap:36px;grid-template-columns:minmax(0,1fr) 310px}
}
@media (max-width:900px){
  #paginaClinicaNoua{padding-bottom:78px}
  #paginaClinicaNoua .page{grid-template-columns:1fr;grid-template-areas:"head" "side" "content";padding-top:22px}
  #paginaClinicaNoua .card{position:static;box-shadow:none;margin-top:22px}
  #paginaClinicaNoua .cover{aspect-ratio:16/8;margin-top:18px}
  #paginaClinicaNoua .identity h1{font-size:23px}
  #paginaClinicaNoua .logo{width:64px;height:64px;border-radius:15px}
  #paginaClinicaNoua .logo__mono{font-size:26px}
  #paginaClinicaNoua .prices{grid-template-columns:1fr;gap:16px}
  #paginaClinicaNoua .catlist{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
  #paginaClinicaNoua .catlist::-webkit-scrollbar{display:none}
  #paginaClinicaNoua .cat{flex:none;width:auto;padding:8px 13px;border:1px solid var(--lav-line);border-radius:999px;font-size:13.5px}
  #paginaClinicaNoua .cat.is-active{border-color:var(--violet);background:var(--violet);color:#fff}
  #paginaClinicaNoua .cat .icon{display:none}
  #paginaClinicaNoua .contact{grid-template-columns:1fr}
  #paginaClinicaNoua .map{min-height:260px}
  #paginaClinicaNoua .rsum .btn{margin-left:0}
  #paginaClinicaNoua .mobilebar{display:flex}
  #paginaClinicaNoua .wa{bottom:92px;left:16px;width:52px;height:52px}
}
@media (max-width:600px){
  #paginaClinicaNoua .container{padding:0 18px}
  #paginaClinicaNoua .svcs{grid-template-columns:repeat(2,minmax(0,1fr))}
  #paginaClinicaNoua .strip{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:104px}
  #paginaClinicaNoua .tile{aspect-ratio:auto}
  #paginaClinicaNoua .strip > .tile:first-child{grid-column:span 2;grid-row:span 2}
  #paginaClinicaNoua .strip > .tile:nth-child(5){grid-column:span 2}
  #paginaClinicaNoua .art{grid-template-columns:96px minmax(0,1fr);gap:14px}
  #paginaClinicaNoua .art .ph{height:72px}
  #paginaClinicaNoua .doc{flex-wrap:wrap}
  #paginaClinicaNoua .doc .btn{margin-left:80px}
  #paginaClinicaNoua .rbars{min-width:0;width:100%}
}

/* ============================================================================
   PUNTE CU MARKUP-UL EXISTENT
   Mockup-ul are markup curat; pagina reala are clasele ei vechi pe aceleasi
   elemente. Aici legam clasele vechi de aspectul nou, ca sa nu fie nevoie sa
   redenumim controale server (si sa stricam code-behind-ul).
   ============================================================================ */

/* scroll lin catre ancore; trebuie pe html, nu pe wrapper */
html.htmlPrezentareClinicaNoua { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html.htmlPrezentareClinicaNoua { scroll-behavior: auto; } }

/* Bara de sus: #navbarHeader poarta acum si clasa .topbar */
#paginaClinicaNoua .topbar .navbar-container-main {
    display: flex;
    align-items: center;
    gap: 22px;
    min-height: var(--top);
}

/* butonul de inapoi e infasurat intr-un LinkButton (tag <a>) */
#paginaClinicaNoua .navGoBack {
    display: inline-flex;
    flex: none;
    text-decoration: none;
}

#paginaClinicaNoua .navGoBack:hover,
#paginaClinicaNoua .navGoBack:focus { text-decoration: none; }

#paginaClinicaNoua .back {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.16);
    color: #fff;
}

#paginaClinicaNoua .navGoBack:hover .back { background: rgba(255,255,255,.26); }

/* logo-ul clinicii in bara: fie imagine, fie initialele */
#paginaClinicaNoua .brand__logo { overflow: hidden; }
#paginaClinicaNoua .brand__img { width: 100%; height: 100%; object-fit: cover; display: block; }
#paginaClinicaNoua .brand__mono {
    font-family: Georgia,'Times New Roman',serif;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -.04em;
}

/* meniul de sectiuni: div-uri .navCategorie in loc de <a> */
#paginaClinicaNoua .navMeniu {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 auto;
    min-width: 0;
}

#paginaClinicaNoua .nav.navSublista { display: flex; align-items: center; gap: 2px; margin: 0; }

#paginaClinicaNoua .navCategorie {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: var(--top);
    padding: 0 12px;
    color: rgba(255,255,255,.8);
    font-weight: 500;
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
}

#paginaClinicaNoua .navCategorie:hover { color: #fff; }

#paginaClinicaNoua .navCategorie.showCategorie { color: #fff; font-weight: 600; }

#paginaClinicaNoua .navCategorie.showCategorie::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 15px;
    height: 2px;
    border-radius: 2px;
    background: #fff;
}


/* zona de cont din dreapta */
#paginaClinicaNoua .navZonaCont { display: flex; align-items: center; gap: 10px; flex: none; }
#paginaClinicaNoua .navZonaCont > a { color: #fff; font-weight: 600; font-size: 14px; text-decoration: none; }
#paginaClinicaNoua .navZonaCont > a:hover { text-decoration: underline; }
#paginaClinicaNoua .avatar { text-decoration: none; color: #fff; }
#paginaClinicaNoua .avatar:hover { color: #fff; text-decoration: none; }

/* sagetile vechi de paginare nu mai au rost intr-o pagina cu scroll continuu */
#paginaClinicaNoua #grupArrows { display: none; }

/* --- Identitate: logo, denumire, rating ------------------------------------ */
#paginaClinicaNoua .identity__info { min-width: 0; }

#paginaClinicaNoua .logo.divLogoSiRating { padding: 0; overflow: hidden; }
#paginaClinicaNoua .logo .imgLogoClinica { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: inherit; }

#paginaClinicaNoua .identity h1 { margin: 0; font-size: 27px; line-height: 1.2; font-weight: 700; letter-spacing: -.012em; }

/* badge-ul "Clinica cu suflet" sta sub denumire, pe rand propriu */
#paginaClinicaNoua .badgeClinicaCuSuflet {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--lav);
    color: var(--violet);
    font-size: 12.5px;
    font-weight: 600;
}

#paginaClinicaNoua .badgeClinicaCuSuflet .iconInimaSuflet { width: 14px; height: 14px; fill: currentColor; }

/* denumirea si inima de favorit pe acelasi rand; inima e un buton rotund, ca restul actiunilor */
#paginaClinicaNoua .identity__titlu { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
#paginaClinicaNoua .identity__titlu h1 { min-width: 0; overflow-wrap: anywhere; }

#paginaClinicaNoua #lnkAdaugaClinicaLaFavorite.fav { flex: none; margin-top: 1px; }
#paginaClinicaNoua #lnkAdaugaClinicaLaFavorite.fav:empty { display: none; }

#paginaClinicaNoua #lnkAdaugaClinicaLaFavorite.fav i {
    position: static;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--lav-line);
    border-radius: 50%;
    background: #fff;
    color: var(--violet);
    font-size: 15px;
    cursor: pointer;
    transform: none;
}

#paginaClinicaNoua #lnkAdaugaClinicaLaFavorite.fav i:hover { border-color: var(--violet-soft); background: var(--lav); }
#paginaClinicaNoua #lnkAdaugaClinicaLaFavorite.fav i.fa-solid { border-color: var(--violet-soft); background: var(--lav); }

/* clinica asociata in iStoma Benefits a pacientului: ramane favorita, fara click */
#paginaClinicaNoua #lnkAdaugaClinicaLaFavorite.fav i.iconFavoritaBenefits,
#paginaClinicaNoua #lnkAdaugaClinicaLaFavorite.fav i.iconFavoritaBenefits:hover { cursor: default; }

/* badge-urile de sub denumire ("Clinica cu suflet" si cele din iStoma Benefits), pe un rand */
#paginaClinicaNoua .identity__badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
#paginaClinicaNoua .identity__badges:not(:has(span)) { display: none; }
#paginaClinicaNoua .identity__badges .badgeClinicaCuSuflet { margin: 0; border: 1px solid transparent; line-height: 1.5; }

#paginaClinicaNoua .identity__badges .badgeParteneraBenefits,
#paginaClinicaNoua .identity__badges .badgeClinicaAsociataBenefits {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: auto;
    margin: 0;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.5;
}

#paginaClinicaNoua .identity__badges .badgeParteneraBenefits { border: 1px solid #CFE8BF; background: #fff; color: #4F9D31; }
#paginaClinicaNoua .identity__badges .badgeClinicaAsociataBenefits { border: 1px solid transparent; background: #EFF7E9; color: #4F9D31; }

/* invitatia iStoma Benefits din Descriere (ControlIncentiveIstomaBenefits), doar la clinicile partenere */
#paginaClinicaNoua .descriere__benefits { margin-top: 18px; }
#paginaClinicaNoua .descriere__benefits:not(:has(.incBenefits)) { display: none; }

/* #paginaClinicaNoua a / button (culoarea mov a linkurilor din pagina) bateau culorile controlului:
   butoanele magazinelor raman albe pe fundal inchis, iar x-ul de inchidere gri */
#paginaClinicaNoua .incBenefitsMagazine a.incBenefitsMagazin,
#paginaClinicaNoua .incBenefitsMagazine a.incBenefitsMagazin:visited,
#paginaClinicaNoua .incBenefitsMagazine a.incBenefitsMagazin:hover,
#paginaClinicaNoua .incBenefitsMagazine a.incBenefitsMagazin:focus { color: #fff; }
#paginaClinicaNoua .incBenefitsInchide { color: #8A93A6; }
#paginaClinicaNoua .incBenefitsInchide:hover,
#paginaClinicaNoua .incBenefitsInchide:focus { color: #1F2433; }

/* ratingul vine ca HTML din code-behind */
#paginaClinicaNoua .rating .divRatingContainer { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }

/* --- Coperta: caruselul bootstrap de acum ---------------------------------- */
#paginaClinicaNoua .cover #divCaruselImagini,
#paginaClinicaNoua .cover #myCarousel,
#paginaClinicaNoua .cover .carousel-inner,
#paginaClinicaNoua .cover .carousel-inner > .item { height: 100%; }

#paginaClinicaNoua .cover .imgCarousel { width: 100%; height: 100%; object-fit: cover; display: block; }
#paginaClinicaNoua .cover .carousel-indicators { bottom: 10px; }

/* --- Cardul de actiuni ------------------------------------------------------ */
/* display:flex: butoanele stau fiecare pe randul lui fara spatiul de linie al inline-flex,
   iar distanta dintre ele ramane cei 8px din .btn + .btn, ca in macheta */
#paginaClinicaNoua .card .btn { display: flex; width: 100%; margin-bottom: 0; text-decoration: none; }
#paginaClinicaNoua .card .btn:hover { text-decoration: none; }
#paginaClinicaNoua .card hr { border: 0; border-top: 1px solid var(--line); margin: 16px 0; }

/* programul vine ca lista .sched din code-behind (HtmlProgramCard); statusul "Deschis acum"
   sta deasupra butoanelor (.card__status), nu mai e eticheta sub program */
#paginaClinicaNoua .card .divProgramLucru { font-size: 14px; gap: 0; }

#paginaClinicaNoua .card .divDescriereConcediu { margin-top: 10px; color: var(--slate); font-size: 13px; }

#paginaClinicaNoua .card__addr { display: block; color: var(--slate); font-size: 14px; line-height: 1.5; }
/* in card, "Pornește navigația" e link simplu, nu butonul mov din .lblDirectii (stilul vechi) */
#paginaClinicaNoua .card .card__nav,
#paginaClinicaNoua .card .card__nav:visited,
#paginaClinicaNoua .card .card__nav:focus,
#paginaClinicaNoua .card .card__nav:active {
    display: inline-flex;
    width: auto;
    margin-top: 8px;
    padding: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    transform: none;
    color: var(--violet);
    font-size: 13.5px;
    font-weight: 600;
    text-transform: none;
    text-decoration: none;
}
#paginaClinicaNoua .card .card__nav:hover { background: none; box-shadow: none; color: var(--violet); text-decoration: underline; }

/* --- Sectiunile de continut ------------------------------------------------- */
/* panourile vechi devin sectiuni una sub alta, nu mai sunt "pagini" schimbate cu sageti */
/* Distanta dintre sectiuni vine din marginea de sus, ca in macheta (.sec).
   Tot ea lasa aer si intre coperta si prima sectiune, Descriere. */
#paginaClinicaNoua .content .pnlCategoriePagina {
    display: block;
    width: 100%;
    min-height: 0;
    height: auto;
    margin: 46px 0 0;
    padding: 0;
    background: none;
    scroll-margin-top: calc(var(--top) + 20px);
}

/* --- Neutralizam regulile vechi pe ID ---------------------------------------
   Selectorii pe ID din PrezentareClinica*.css bat clasele noastre, asa ca ii
   anulam explicit pe elementele mutate in noul layout. Fisierele vechi raman
   neatinse: le mai folosesc alte pagini. */
#paginaClinicaNoua .contentAll {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    transform: none;
}

#paginaClinicaNoua .head #divLogoSiRatingDescriere {
    width: 76px;
    height: 76px;
    min-width: 0;
    min-height: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    display: grid;
    place-items: center;
    background: #fff;
    border: 1px solid var(--lav-line);
    border-radius: 18px;
    box-shadow: none;
}

#paginaClinicaNoua .cover #divCaruselImagini {
    width: 100%;
    height: 100%;
    min-height: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
    background: none;
}

@media (max-width: 900px) {
    #paginaClinicaNoua .head #divLogoSiRatingDescriere { width: 64px; height: 64px; border-radius: 15px; }
}

/* ============================================================================
   SECTIUNEA DESCRIERE + SERVICII + FACILITATI
   Listele vin ca HTML din code-behind, direct cu clasele .svc / .fac din macheta
   (clasele vechi .divServiciu / .divFacilitate nu mai sunt folosite aici).
   ============================================================================ */

#paginaClinicaNoua .prose #descriereClinica { margin: 0; }
#paginaClinicaNoua .prose #descriereClinica p { margin: 0 0 12px; }
#paginaClinicaNoua .prose #descriereClinica p:last-child { margin-bottom: 0; }
#paginaClinicaNoua .prose .linkbtn { margin-top: 10px; }

/* Servicii, ca in macheta: iconita line-art deasupra, eticheta mov cu majuscule dedesubt,
   fara chenar; la hover tile-ul primeste fundal lavanda. Aspectul vine din .svc (sus, in
   partea copiata din macheta); aici doar grila si starile linkului. */
/* align-items: stretch - stilul vechi centra vertical, iar pe randul cu "Stomatologie generală"
   (eticheta pe doua randuri) iconitele nu mai erau la aceeasi inaltime */
#paginaClinicaNoua .svcs.divServiciiSiFacilitati {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
    gap: 6px;
    max-height: none;
    overflow: visible;
    padding: 0;
    margin: 0;
}

/* pe telefon, stilul vechi ascundea listele (display:none !important) pana la tap pe titlu,
   iar titlul nou nu mai are sageata de deschidere; in macheta ele se vad mereu */
@media (max-width: 767px) {
    #paginaClinicaNoua #divListaServicii { display: grid !important; padding: 0; }
    #paginaClinicaNoua #divListaFacilitati { display: flex !important; padding: 0; }
}

#paginaClinicaNoua .svcs a.svc { cursor: pointer; transition: background-color .12s; }

/* fara lista de preturi tile-ul e div, nu link: nu arata ca si cum s-ar putea apasa */
#paginaClinicaNoua .svcs div.svc,
#paginaClinicaNoua .svcs div.svc:hover { cursor: default; background: none; }

/* bootstrap coloreaza si subliniaza linkurile la hover/focus */
#paginaClinicaNoua .svcs .svc:hover,
#paginaClinicaNoua .svcs .svc:focus { color: var(--violet); text-decoration: none; }
#paginaClinicaNoua .svcs .svc:focus-visible { background: var(--lav); }

/* imaginea veche, doar pentru o specializare care n-are inca iconita in sprite */
#paginaClinicaNoua .svcs .svc__img { width: 34px; height: 34px; object-fit: contain; }

/* Facilitati, ca in macheta: iconita mov + text, una langa alta, fara pastila.
   Aspectul vine din .fac (sus, in partea copiata din macheta); aici doar spatierea. */
#paginaClinicaNoua .facs.divServiciiSiFacilitati {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 34px;
    max-height: none;
    overflow: visible;
    padding: 0;
    margin: 0;
}

#paginaClinicaNoua .facs .fac { color: var(--ink); line-height: 1.4; }
#paginaClinicaNoua .facs .fac .icon { flex: none; }

/* mesajul "clinica nu a furnizat informatii..." ocupa tot randul */
#paginaClinicaNoua .svcs .divFaraInfo,
#paginaClinicaNoua .facs .divFaraInfo {
    grid-column: 1 / -1;
    width: 100%;
    padding: 14px 16px;
    border: 1px dashed var(--lav-line);
    border-radius: 12px;
    background: #fff;
    color: var(--muted);
    font-size: 14px;
}

@media (max-width: 1060px) {
    #paginaClinicaNoua .svcs.divServiciiSiFacilitati { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
    #paginaClinicaNoua .svcs.divServiciiSiFacilitati { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============================================================================
   SECTIUNEA ECHIPA
   ============================================================================ */

/* Logo + rating se repetau in fiecare panou, din structura veche cu "pagini".
   In pagina noua identitatea apare o singura data, sus, deci le ascundem.
   Controalele raman in pagina, ca sa nu stricam code-behind-ul care le completeaza. */
#paginaClinicaNoua .content .divLogoSiRating { display: none; }

#paginaClinicaNoua .divContainerEchipa {
    display: block;
    width: 100%;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    background: none;
    box-shadow: none;
    border: 0;
}

#paginaClinicaNoua .team {
    display: block;
    max-height: none;
    overflow: visible;
    padding: 0;
    margin: 0;
}

#paginaClinicaNoua .team .divMedicEchipa {
    display: flex;
    align-items: center;
    gap: 16px;
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 14px 0;
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
    background: none;
    box-shadow: none;
    cursor: pointer;
}

#paginaClinicaNoua .team .divMedicEchipa:last-of-type { border-bottom: 1px solid var(--line); }

/* restransa (data-restrans): doar primii 2 medici; ultimul vizibil tine linia de jos,
   pentru ca :last-of-type ar fi un medic ascuns */
#paginaClinicaNoua #divListaMedici[data-restrans] .medicExtra { display: none; }
#paginaClinicaNoua #divListaMedici[data-restrans] .medicUltimVizibil { border-bottom: 1px solid var(--line); }

/* poza rotunda a medicului; sub ea stau initialele, care se vad cand nu exista poza
   sau cand fisierul nu se incarca (onerror scoate clasa arePoza), ca in macheta ("CM") */
#paginaClinicaNoua .team .doc__avatar {
    position: relative;
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    flex: none;
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid var(--lav-line);
    background: var(--lav);
    color: var(--violet);
    font-size: 19px;
    font-weight: 700;
}

#paginaClinicaNoua .team .doc__avatar.arePoza .doc__initiale { visibility: hidden; }

#paginaClinicaNoua .team .imgMedic {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0;
    object-fit: cover;
    margin: 0;
}

#paginaClinicaNoua .team .doc__info { min-width: 0; display: block; }

#paginaClinicaNoua .team .txtNumeMedic {
    display: block;
    margin: 0;
    color: var(--violet);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

#paginaClinicaNoua .team .divMedicEchipa:hover .txtNumeMedic { text-decoration: underline; }

#paginaClinicaNoua .team .txtSpecializareMedic {
    display: block;
    margin: 2px 0 0;
    color: var(--slate);
    font-size: 14px;
    font-weight: 400;
}

#paginaClinicaNoua .team .doc__cta { margin-left: auto; flex: none; }

@media (max-width: 600px) {
    #paginaClinicaNoua .team .divMedicEchipa { flex-wrap: wrap; }
    #paginaClinicaNoua .team .doc__cta { margin-left: 80px; }
}

/* ============================================================================
   SECTIUNEA LISTA DE PRETURI - ca in macheta
   Categorii (tab-uri) la stanga, cautare + preturi la dreapta. Aspectul de baza
   (.cat, .search, .pgroup, .prow, .pmore) vine din partea copiata din macheta,
   sus in fisier; aici anulam regulile vechi pe ID din PrezentareClinicaPanelPreturi.css
   (padding 50px, umbre, lista de categorii ascunsa sub 1250px) si legam starile.
   ============================================================================ */

#paginaClinicaNoua .divContainerPreturi {
    display: block;
    width: 100%;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    background: none;
    box-shadow: none;
    border: 0;
}

#paginaClinicaNoua .divContinutPreturi.prices {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 34px;
    align-items: start;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
}

/* --- coloana de categorii --- */
#paginaClinicaNoua #divListaCategoriiPreturi.catlist {
    position: relative;
    display: grid;
    gap: 2px;
    align-items: stretch;
    min-width: 0;
    width: auto;
    height: auto;
    max-height: none;
    overflow: visible;
    margin: 0;
    padding: 0;
    background: none;
    box-shadow: none;
    border: 0;
}

#paginaClinicaNoua .catlist .cat { font-family: inherit; line-height: 1.3; transition: background-color .12s, color .12s; }
#paginaClinicaNoua .catlist .cat span { min-width: 0; }

/* --- coloana de preturi --- */
#paginaClinicaNoua .divColoanaPreturi { min-width: 0; }
/* font-weight: regula bootstrap pe <label> facea textul din camp bold;
   max-width: Site.css limita campurile la 400px, iar cautarea se oprea inainte de preturi */
#paginaClinicaNoua .divColoanaPreturi .search { display: block; margin: 0; font-weight: 400; }
#paginaClinicaNoua .divColoanaPreturi .search input { max-width: none; font-weight: 400; }
#paginaClinicaNoua .divColoanaPreturi .search input::-webkit-search-cancel-button { cursor: pointer; }

#paginaClinicaNoua #divListaDetaliiPreturi.ptable {
    display: block;
    width: auto;
    min-width: 0;
    margin: 6px 0 0;
    padding: 0;
    background: none;
    box-shadow: none;
    border: 0;
    border-radius: 0;
}

/* doar categoria aleasa; primul grup lipit de cautare */
#paginaClinicaNoua .pcat { display: none; }
#paginaClinicaNoua .pcat.is-active { display: block; }
#paginaClinicaNoua .pcat .pcat__titlu + .pgroup { margin-top: 16px; }
#paginaClinicaNoua .prow__name { min-width: 0; overflow-wrap: anywhere; }
#paginaClinicaNoua .prow__price { color: var(--ink); }

/* primele 8 preturi; restul la "Vezi toate cele N prețuri" */
#paginaClinicaNoua .pcat[data-restrans] .is-extra { display: none; }

/* titlul categoriei apare doar in cautare, cand rezultatele vin din mai multe categorii */
#paginaClinicaNoua .pcat__titlu {
    display: none;
    margin: 22px 0 0;
    color: var(--ink);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

/* in cautare: toate categoriile cu rezultate, toate potrivirile, fara "Vezi toate" */
#paginaClinicaNoua .ptable.inCautare .pcat { display: none; }
#paginaClinicaNoua .ptable.inCautare .pcat.areRezultate { display: block; }
#paginaClinicaNoua .ptable.inCautare .pcat__titlu { display: block; }
/* primul grup cu rezultate (nu neaparat primul din categorie) sta aproape de titlu, urmatoarele la distanta obisnuita */
#paginaClinicaNoua .ptable.inCautare .pcat .pcat__titlu ~ .pgroup:not(.faraRezultate) { margin-top: 10px; }
#paginaClinicaNoua .ptable.inCautare .pcat .pcat__titlu ~ .pgroup:not(.faraRezultate) ~ .pgroup:not(.faraRezultate) { margin-top: 22px; }
#paginaClinicaNoua .ptable.inCautare .pcat[data-restrans] .pgroup.is-extra { display: flex; }
#paginaClinicaNoua .ptable.inCautare .pcat[data-restrans] .prow.is-extra { display: flex; }
#paginaClinicaNoua .ptable.inCautare .nuSePotriveste,
#paginaClinicaNoua .ptable.inCautare .pgroup.faraRezultate,
#paginaClinicaNoua .ptable.inCautare .pmore { display: none !important; }

#paginaClinicaNoua #divFaraRezultatePreturi { padding: 22px 0 0; }

/* telefon: categoriile devin o banda orizontala de pastile, cea aleasa plina (ca in macheta) */
@media (max-width: 900px) {
    #paginaClinicaNoua .divContinutPreturi.prices { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    /* flex-direction: regula veche pe ID le punea una sub alta (column) */
    #paginaClinicaNoua #divListaCategoriiPreturi.catlist {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        gap: 6px;
        overflow-x: auto;
        padding-bottom: 6px;
        scrollbar-width: none;
    }
    #paginaClinicaNoua #divListaCategoriiPreturi.catlist::-webkit-scrollbar { display: none; }
    #paginaClinicaNoua #divListaCategoriiPreturi .cat { flex: none; width: auto; white-space: nowrap; }
}

/* ============================================================================
   SECTIUNEA GALERIE (galerie foto + cazuri clinice + testimoniale)
   Cele trei liste nu mai sunt sub-taburi comutate cu .active, ci apar una sub
   alta. De aceea le fortam vizibile, indiferent de clasele puse de JS-ul vechi.
   ============================================================================ */

#paginaClinicaNoua .divContainerGalerie {
    display: block;
    width: 100%;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    background: none;
    box-shadow: none;
    border: 0;
}

#paginaClinicaNoua .divContainerGalerie .divCol1 { display: none; }
#paginaClinicaNoua .divContainerGalerie .divCol2 { display: block; width: 100%; margin: 0; padding: 0; }

/* titlurile fostelor sub-taburi devin antete de sectiune, in stilul machetei */
#paginaClinicaNoua .divHeaderGalerie {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: var(--violet);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: default;
}

/* Listele sunt mereu vizibile: nu mai depind de clasa .active pusa de taburi.
   ATENTIE: cele doua liste de imagini sunt GRILE, nu blocuri. Daca le prindem
   aici, display:block le strica: pozele se insiruie una sub alta, pe toata
   latimea. Pentru ele exista o regula separata, mai jos. */
#paginaClinicaNoua .divListaImgGalerieContainer,
#paginaClinicaNoua .divListaImgTestimonialeContainer,
#paginaClinicaNoua #divListaCazuriClinice {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none;
    overflow: visible;
    margin: 0;
    padding: 0;
}

/* grila de imagini (.strip din mockup) */
#paginaClinicaNoua .clsListaImagini.strip {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}

#paginaClinicaNoua .clsListaImagini.strip > * {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    margin: 0;
    border-radius: 12px;
    overflow: hidden;
    object-fit: cover;
    cursor: pointer;
}

#paginaClinicaNoua .clsListaImagini.strip img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 900px) {
    /* doar testimonialele: galeria ramane pe 5 casute, ca placa "+N" sa nu ramana singura pe rand */
    #paginaClinicaNoua #divListaTestimoniale.clsListaImagini.strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
    /* si selectorul cu ID, ca sa bata regula de 4 coloane de la 900px a testimonialelor */
    #paginaClinicaNoua .clsListaImagini.strip,
    #paginaClinicaNoua #divListaTestimoniale.clsListaImagini.strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ============================================================================
   SECTIUNEA REVIEW-URI - ca in macheta
   Rezumat (media mare, distributia pe stele, butonul verde), apoi lista: initiale,
   nume, data, stele, textul strans la 3 randuri. Primele 3 review-uri, restul la
   "Vezi toate cele N review-uri". Stilurile de baza (.rsum, .bar, .rev) vin din
   partea copiata din macheta; aici anulam ce ramane din designul vechi.
   ============================================================================ */

/* background cu !important: intre 768 si 1100px o regula veche (tot cu !important) punea fundal gri */
#paginaClinicaNoua .divContainerReviewuri {
    display: block;
    width: 100%;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    background: transparent !important;
    box-shadow: none;
    border: 0;
}

/* --- starea "nicio nota inca" --- */
#paginaClinicaNoua #pnlFaraRating {
    display: block;
    padding: 28px 24px;
    border: 1px dashed var(--lav-line);
    border-radius: 14px;
    background: #fff;
    text-align: center;
}

#paginaClinicaNoua .divFaraReviewText { color: var(--slate); font-size: 15px; line-height: 1.6; }
#paginaClinicaNoua #divAddReviewPanelFaraRating { margin-top: 14px; display: flex; justify-content: center; }

/* --- rezumatul: fara cutie, cu linie dedesubt (ca in macheta) --- */
#paginaClinicaNoua .rsum {
    margin: 0;
    padding: 4px 0 20px;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: none;
}

#paginaClinicaNoua .rsum__nota { flex: none; }
#paginaClinicaNoua .rsum__nota .rbig { color: var(--ink); }
#paginaClinicaNoua .rsum__meta { margin-top: 4px; }
#paginaClinicaNoua .rsum__meta p { margin: 4px 0 0; color: var(--slate); font-size: 13.5px; }
#paginaClinicaNoua .rsum__meta #lblNrVoturiReview { color: inherit; font-size: inherit; font-weight: 400; }

#paginaClinicaNoua .rbars { flex: 0 1 240px; }
#paginaClinicaNoua .rbars .bar__n { color: var(--ink); }

/* butonul verde cu stea, in dreapta */
#paginaClinicaNoua .rsum #btnAddReview { margin-left: auto; width: auto; min-width: 0; height: 42px; text-transform: none; }
#paginaClinicaNoua #btnAddReview .icon,
#paginaClinicaNoua #divAddReviewPanelFaraRating .icon { width: 16px; height: 16px; }

/* --- stelele (desenate de Site.css cu ★ si un strat plin taiat la procentul notei):
   le lipim la stanga si le dam marimea din macheta --- */
/* color: transparent - altfel stelele goale din rezumat ieseau pline, in culoarea textului */
#paginaClinicaNoua .rsum__stele,
#paginaClinicaNoua .rev__stele {
    color: transparent;
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    margin: 0;
    line-height: 1;
    white-space: nowrap;
}

#paginaClinicaNoua .rsum__stele .divListaRatingMedie,
#paginaClinicaNoua .rev__stele .divListaRatingMedie { left: 0; top: 0; transform: none; }

#paginaClinicaNoua .rsum__stele .empty-stars::before,
#paginaClinicaNoua .rsum__stele .full-stars::before { font-size: 17px; letter-spacing: 1px; }
#paginaClinicaNoua .rsum__stele .full-stars { letter-spacing: 1px; }

#paginaClinicaNoua .rev__stele { margin-top: 4px; }
#paginaClinicaNoua .rev__stele .empty-stars::before,
#paginaClinicaNoua .rev__stele .full-stars::before { font-size: 14px; letter-spacing: 1px; }
#paginaClinicaNoua .rev__stele .full-stars { letter-spacing: 1px; }

/* --- lista de review-uri --- */
#paginaClinicaNoua .revList { margin: 0; }
#paginaClinicaNoua .revList #listaMesajeReview { max-height: none; overflow: visible; margin: 0; padding: 0; }

/* primele 3; restul la "Vezi toate cele N review-uri" */
#paginaClinicaNoua #divListaReviewuri[data-restrans] #listaMesajeReview > .rev:nth-child(n+4) { display: none; }

#paginaClinicaNoua .rev__avatar { font-variant-numeric: lining-nums; }
#paginaClinicaNoua .rev__corp { min-width: 0; }
#paginaClinicaNoua .rev__name { color: var(--ink); overflow-wrap: anywhere; }
#paginaClinicaNoua .rev__date { white-space: nowrap; }
#paginaClinicaNoua .rev__text { overflow-wrap: anywhere; }
#paginaClinicaNoua .rev__text.clamp.is-open,
#paginaClinicaNoua .rev__text.clamp.rev__text--incape { max-height: none; }
#paginaClinicaNoua .rev__text.clamp.rev__text--incape::after { display: none; }

/* "Citește tot" apare doar cand textul chiar trece de 3 randuri (aplicaClampReviewuri) */
#paginaClinicaNoua .rev__toggle { display: none; }

/* raspunsul clinicii: caseta lavanda sub review */
#paginaClinicaNoua .rev__raspuns {
    margin-top: 12px;
    padding: 12px 14px;
    border-left: 3px solid var(--violet-soft);
    border-radius: 0 10px 10px 0;
    background: var(--lav);
}

#paginaClinicaNoua .rev__raspunsTitlu {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    color: var(--violet);
    font-size: 13px;
    font-weight: 700;
}

#paginaClinicaNoua .rev__raspuns p { margin: 6px 0 0; color: var(--slate); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }

#paginaClinicaNoua .revList .more { margin-top: 16px; }
#paginaClinicaNoua .revList .more:empty { display: none; }
#paginaClinicaNoua #btnReviewuriComplete { height: 42px; }

#paginaClinicaNoua .review-embed { margin-top: 22px; }

/* ca in macheta: sub 900px butonul nu mai e impins in dreapta, sta dupa bare */
@media (max-width: 900px) {
    #paginaClinicaNoua .rsum #btnAddReview { margin-left: 0; }
}

@media (max-width: 600px) {
    #paginaClinicaNoua .rsum { gap: 18px; }
    #paginaClinicaNoua .rbars { flex: 1 1 100%; }
    #paginaClinicaNoua .rev { grid-template-columns: 38px minmax(0, 1fr); gap: 12px; }
    #paginaClinicaNoua .rev__avatar { width: 38px; height: 38px; font-size: 13px; }
}

/* ============================================================================
   SECTIUNEA ARTICOLE
   ControlArticole e folosit de opt pagini: in control am adaugat doar lucruri
   care nu schimba celelalte pagini (contorul, eticheta "Publicat:" intr-un span,
   ascunderea pozei care nu se incarca). Aspectul nou vine din CSS, limitat la pagina asta.
   ============================================================================ */

#paginaClinicaNoua .divListaArticole {
    display: block;
    margin: 0;
    padding: 0;
}

/* scoatem grila bootstrap: articolele stau unul sub altul, pe toata latimea */
#paginaClinicaNoua .divListaArticole .boxArticol {
    width: 100%;
    max-width: none;
    min-width: 0;
    float: none;
    margin: 0;
    padding: 0;
}

#paginaClinicaNoua .lnkArticol {
    display: grid;
    grid-template-columns: 136px minmax(0, 1fr);
    gap: 18px;
    width: auto;
    height: auto;
    margin: 0;
    padding: 16px 0;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: inherit;
    text-decoration: none;
}

#paginaClinicaNoua .boxArticol:first-child .lnkArticol { border-top: 1px solid var(--line); }
#paginaClinicaNoua .lnkArticol:hover { text-decoration: none; background: none; }

#paginaClinicaNoua .divLogoArticol {
    width: 136px;
    height: 96px;
    margin: 0;
    padding: 0;
    border-radius: 10px;
    overflow: hidden;
    background: var(--lav);
}

#paginaClinicaNoua .divLogoArticol .imgStyleLogo { width: 100%; height: 100%; object-fit: cover; display: block; }

#paginaClinicaNoua .divArticolBody {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0 14px;
    min-width: 0;
    margin: 0;
    padding: 0;
}

#paginaClinicaNoua .divArticolBody > .divCategorieArticol,
#paginaClinicaNoua .divArticolBody > .divTitluArticol,
#paginaClinicaNoua .divArticolBody > .divArticolContinut { flex: 0 0 100%; }

#paginaClinicaNoua .divCategorieArticol {
    margin: 0;
    color: var(--violet);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

/* eticheta "Categorie:" nu mai e nevoie: categoria se citeste ca supratitlu */
#paginaClinicaNoua .divCategorieArticol .spanCategorieArticol { display: none; }

#paginaClinicaNoua .divTitluArticol {
    margin: 5px 0 4px;
    color: var(--ink);
    font-size: 16.5px;
    font-weight: 700;
    line-height: 1.3;
    white-space: normal;
    overflow: visible;
    overflow-wrap: anywhere;
}

#paginaClinicaNoua .lnkArticol:hover .divTitluArticol { color: var(--violet); }

#paginaClinicaNoua .divArticolContinut {
    margin: 0;
    color: var(--slate);
    font-size: 14px;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* autorul si data pe acelasi rand, ca in macheta ("Stoma Art   23.04.2026"), fara etichete */
#paginaClinicaNoua .divAutor,
#paginaClinicaNoua .divPublicat { margin: 8px 0 0; color: var(--muted); font-size: 12.5px; }
#paginaClinicaNoua .divAutor b,
#paginaClinicaNoua .divPublicat .spanPublicat { display: none; }
#paginaClinicaNoua .divPublicat { font-variant-numeric: lining-nums tabular-nums; }

/* padding-right: locul reactiilor, care stau pe acelasi rand, in dreapta.
   flex-shrink 0: cand nu mai incape data langa autor, trece pe randul urmator
   (altfel s-ar strange si data ar intra sub reactii) */
#paginaClinicaNoua .divPublicatContainer {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1 0 auto;
    min-width: 0;
    margin: 0;
    padding-right: 110px;
}

/* vizualizarile si al doilea contor de like-uri nu apar in macheta */
#paginaClinicaNoua .divPublicatIcons,
#paginaClinicaNoua .divFavoritContainer { display: none; }

/* casuta pozei: lavanda cu eticheta "Foto" cand poza lipseste */
#paginaClinicaNoua .divLogoArticol { position: relative; border: 1px solid var(--lav-line); }
#paginaClinicaNoua .divLogoArticol::after {
    content: "Foto";
    position: absolute;
    left: 10px;
    bottom: 7px;
    color: var(--violet-soft);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}
#paginaClinicaNoua .divLogoArticol .imgStyleLogo { position: relative; z-index: 1; }

/* reactiile (like, favorite, share): mici, gri, in dreapta randului cu autorul si data */
#paginaClinicaNoua .lnkArticol { position: relative; }

#paginaClinicaNoua .lnkArticol .divArticolFooter {
    position: absolute;
    right: 0;
    bottom: 16px;
    margin: 0;
    padding: 0;
}

#paginaClinicaNoua .lnkArticol .divArticolFooterBtn {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 0;
    border: 0;
}

#paginaClinicaNoua .lnkArticol .divBtnLike,
#paginaClinicaNoua .lnkArticol .divBtnFavorit,
#paginaClinicaNoua .lnkArticol .divBtnShare { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; color: var(--muted); cursor: pointer; }

#paginaClinicaNoua .lnkArticol .divBtnLike .iconLike,
#paginaClinicaNoua .lnkArticol .divBtnShare .iconShare { color: var(--muted); font-size: 16px !important; }
#paginaClinicaNoua .lnkArticol .imgArticolFavorit { display: inline-flex; width: auto; height: auto; font-size: 14px; color: var(--muted); }
#paginaClinicaNoua .lnkArticol .iconActiv { color: var(--violet) !important; }
#paginaClinicaNoua .lnkArticol .divBtnLike:hover .iconLike,
#paginaClinicaNoua .lnkArticol .divBtnShare:hover .iconShare,
#paginaClinicaNoua .lnkArticol .imgArticolFavorit:hover { color: var(--violet); }

#paginaClinicaNoua .lnkArticol .spnNrLike {
    color: var(--muted);
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    text-transform: none;
}

/* primele 5 articole; restul la "Vezi toate articolele" */
#paginaClinicaNoua #divListaArticoleClinica[data-restrans] .divListaArticole > .boxArticol:nth-child(n+6) { display: none; }

/* paginatia articolelor devine randul de "mai multe" din mockup */
#paginaClinicaNoua .divPaginatieArticole { margin-top: 16px; }

@media (max-width: 600px) {
    #paginaClinicaNoua .lnkArticol { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; }
    #paginaClinicaNoua .divLogoArticol { width: 96px; height: 72px; }
    #paginaClinicaNoua .divPublicatContainer { padding-right: 100px; }
    #paginaClinicaNoua .lnkArticol .divArticolFooterBtn { gap: 10px; }

    /* ca la galerie si cazuri: la 320px butonul trece sub titlu, altfel iese din coloana */
    #paginaClinicaNoua #panelArticole .stitle { flex-wrap: wrap; row-gap: 6px; }
    #paginaClinicaNoua #panelArticole .stitle .rule { min-width: 24px; }
    #paginaClinicaNoua #panelArticole .stitle .act { margin-left: auto; }
}

/* telefoane mici: data si reactiile nu mai incap pe acelasi rand, reactiile coboara sub data */
@media (max-width: 360px) {
    #paginaClinicaNoua .divPublicatContainer { padding-right: 0; }
    #paginaClinicaNoua .divArticolBody { padding-bottom: 26px; }
}

/* ============================================================================
   SECTIUNEA CONTACT - ca in macheta
   Stanga: Adresa, Transport si Contact (datele se dezvaluie la click, plus
   social media). Dreapta: harta, cat coloana din stanga. Dedesubt: banda
   "Solicita o evaluare preliminara". Stilurile de baza (.contact, .addr, .tlist,
   .reveal, .social, .map, .eval) vin din partea copiata din macheta; aici le
   potrivim pe markup-ul real si batem ce ramane din PrezentareClinicaPanelContact.css
   (reguli pe ID si cu !important).
   ============================================================================ */

#paginaClinicaNoua .divRand1Contact.contact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 36px;
    align-items: stretch;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    background: none;
}

#paginaClinicaNoua .divGroup1.contact__col {
    display: block;
    width: auto;
    min-width: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    background: none;
}

/* blocurile Adresa / Transport / Contact: fara casete, cu 22px intre ele */
#paginaClinicaNoua .contact .block {
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

#paginaClinicaNoua .contact .block + .block { margin-top: 22px; }

/* --- adresa: strada ingrosata, localitatea dedesubt, zona pe randul ei --- */
#paginaClinicaNoua #lblAdresaClinicaContact.addr {
    display: block;
    margin: 0;
    color: var(--ink);
    font-size: 15px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

/* distanta pana la clinica: apare doar cand stim unde e utilizatorul (initDistance) */
#paginaClinicaNoua #containerDistanta {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin: 0;
    color: var(--green-dark);
    font-size: 13.5px;
    font-weight: 600;
}

#paginaClinicaNoua #containerDistanta:has(> div:not(:empty)) { margin-top: 6px; }
#paginaClinicaNoua #divKmDistanta { font-weight: 700; font-variant-numeric: lining-nums tabular-nums; }

#paginaClinicaNoua .contact__adresa .btn { margin-top: 12px; }

/* --- transport: lista simpla cu iconuri mov --- */
#paginaClinicaNoua .contact .tlist { display: grid; gap: 8px; margin: 0; }

#paginaClinicaNoua .contact .titem {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    color: var(--ink);
    font-size: 14.5px;
    font-weight: 400;
    line-height: 1.45;
}

#paginaClinicaNoua .contact .titem .icon { width: 20px; height: 20px; color: var(--violet); }
#paginaClinicaNoua .titem__text { min-width: 0; overflow-wrap: anywhere; }
#paginaClinicaNoua .titem__val { font-weight: 600; }

/* parcarea: tipul pe primul rand, explicatia clinicii dedesubt, mai mic */
#paginaClinicaNoua .titem__parcare { display: block; }
#paginaClinicaNoua .titem__parcare:empty { display: none; }
#paginaClinicaNoua .titem__detalii { display: block; color: var(--slate); font-size: 13.5px; }
#paginaClinicaNoua .titem__parcare:empty + .titem__detalii { color: var(--ink); font-size: inherit; }

/* --- contact: link-uri mov cu icon; dupa click apare valoarea, ingrosata --- */
#paginaClinicaNoua .contact .reveal {
    display: grid;
    justify-items: start;
    gap: 4px;
    max-height: none;
    overflow: visible;
    margin: 0;
    padding: 0;
}

/* fiecare rand e UpdatePanel-ul lui: icon + link (+ bifa verde) */
#paginaClinicaNoua .contact .reveal > div {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    max-width: 100%;
    padding: 6px 0;
    color: var(--violet);
}

#paginaClinicaNoua .contact .reveal > div > .icon { width: 18px; height: 18px; }

#paginaClinicaNoua .contact .reveal .reveal__link {
    min-width: 0;
    color: var(--violet);
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
    overflow-wrap: anywhere;
}

/* tot randul e clicabil, si iconul (linkul se intinde peste rand) */
#paginaClinicaNoua .contact .reveal .reveal__link::after { content: ""; position: absolute; inset: 0; }

/* numerele de telefon nu se rup pe doua randuri (mailul si site-ul lung, da) */
#paginaClinicaNoua .contact .reveal #upTelMobilClinica .reveal__link,
#paginaClinicaNoua .contact .reveal #upTelFixClinica .reveal__link { flex-shrink: 0; white-space: nowrap; overflow-wrap: normal; }

#paginaClinicaNoua .contact .reveal .reveal__link:hover,
#paginaClinicaNoua .contact .reveal .reveal__link:focus { color: var(--violet); text-decoration: underline; }

#paginaClinicaNoua .contact .reveal .reveal__link--val,
#paginaClinicaNoua .contact .reveal .reveal__link--val:hover,
#paginaClinicaNoua .contact .reveal .reveal__link--val:focus {
    color: var(--ink);
    font-weight: 700;
    font-variant-numeric: lining-nums tabular-nums;
}

/* bifa "verificat" sta deasupra linkului intins, ca sa-si pastreze tooltip-ul */
#paginaClinicaNoua .contact .reveal .iconVerified {
    position: relative;
    z-index: 1;
    color: var(--green-dark);
    font-size: 18px !important;
    cursor: default;
}

/* randul e pozitionat (pentru linkul intins), deci tooltip-ul bifei s-ar ingusta la latimea randului */
#paginaClinicaNoua .contact .reveal .tooltip { white-space: nowrap; }

/* clinica si-a ascuns datele in concediu / in afara programului */
#paginaClinicaNoua .contact__nota { margin: 0; color: var(--slate); font-size: 14px; line-height: 1.5; }

/* --- social media: patrate mici cu colturi rotunjite --- */
#paginaClinicaNoua #groupSocialMedia.social {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: auto;
    height: auto;
    margin: 14px 0 0;
}

#paginaClinicaNoua #groupSocialMedia.social > a {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--lav-line);
    border-radius: 10px;
    background: #fff;
    color: var(--violet);
    text-decoration: none;
}

#paginaClinicaNoua #groupSocialMedia.social > a:hover,
#paginaClinicaNoua #groupSocialMedia.social > a:focus { background: var(--lav); color: var(--violet); }

#paginaClinicaNoua #groupSocialMedia.social > a > i { font-size: 16px; color: inherit; }

/* --- harta: cat coloana din stanga, minim 340px --- */
#paginaClinicaNoua .contact .map {
    width: 100%;
    height: 100%;
    min-height: 340px;
    margin: 0;
    border: 1px solid var(--lav-line);
    border-radius: 14px;
    overflow: hidden;
}

/* --- banda "Solicita o evaluare preliminara": text in stanga, butonul in dreapta --- */
#paginaClinicaNoua .divRand2Contact { display: block; width: 100%; margin: 28px 0 0; padding: 0; background: none; }
#paginaClinicaNoua #panelSolicitariSiHarta { width: 100%; margin: 0; padding: 0; }

#paginaClinicaNoua #divContactClinica.eval {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 18px 20px;
    border: 1px solid var(--lav-line);
    border-radius: 14px;
    background: var(--lav);
}

#paginaClinicaNoua .eval__text { flex: 1 1 320px; min-width: 0; }

#paginaClinicaNoua #divContactClinica h3 {
    margin: 0;
    color: var(--violet);
    font-size: 15.5px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
}

#paginaClinicaNoua #divContactClinica #divNotaContact {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 5px 0 0;
    color: var(--slate);
    font-size: 13.5px;
    font-weight: 400;
    line-height: 1.5;
}

#paginaClinicaNoua #divNotaContact .icon { width: 14px; height: 14px; margin-top: 3px; }

/* grupul de butoane se poate strange, ca "Solicitare existentă" sa treaca sub primul buton pe telefon */
#paginaClinicaNoua .eval__act { display: flex; flex-wrap: wrap; gap: 10px; flex: 0 1 auto; min-width: 0; }

/* UpdatePanel-ul din jurul butonului "Solicitare existentă" nu e o cutie in plus */
#paginaClinicaNoua .eval__act > div { display: contents; }

/* clinica logata nu are butoane aici: nu lasam un loc gol in banda */
#paginaClinicaNoua .eval__act:not(:has(.btn)) { display: none; }

/* programul se repeta: e deja in cardul sticky din dreapta paginii */
#paginaClinicaNoua #divProgramContact { display: none; }

/* o coloana si intre 901 si 991px: acolo continutul are doar ~350px langa cardul din dreapta,
   iar doua coloane de ~150px rupeau adresa si numerele de telefon */
@media (max-width: 991px) {
    #paginaClinicaNoua .divRand1Contact.contact { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    #paginaClinicaNoua .contact .map { height: 260px; min-height: 260px; }
}

/* ============================================================================
   SECTIUNILE PROMOTII SI PUBLICITATE
   ControlPromotii e folosit de sapte pagini, deci nu i-am atins nici markup-ul,
   nici code-behind-ul: cardurile de promotie isi pastreaza designul lor
   (Control-Promotii.css). Aici doar asezam sectiunea in pagina noua.
   ============================================================================ */

#paginaClinicaNoua .divContainerPromotii {
    display: block;
    width: 100%;
    max-width: none;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 0;
    background: none;
    box-shadow: none;
    border: 0;
    overflow: visible;
}

/* lista de promotii nu mai are scroll propriu: curge in pagina */
#paginaClinicaNoua #divListaPromo { max-height: none; overflow: visible; margin: 0; padding: 0; }

/* Zona de reclama din sectiunea proprie (#panelReclama). Sectiunea e ascunsa din
   PrezentareClinicaGeneral.css; publicitatea care se vede e cea de sub Facilitati
   (#divZonaReclamaPatrataPanelDescriere, stilata mai jos). */

#paginaClinicaNoua .zonaReclama {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

#paginaClinicaNoua .zonaReclama .reclamaPatrata {
    width: 100%;
    max-width: 520px;
    float: none;
    margin: 0;
    padding: 0;
    border-radius: 14px;
    overflow: hidden;
}

#paginaClinicaNoua .zonaReclama img { max-width: 100%; height: auto; display: block; border-radius: 14px; }

/* ============================================================================
   CORECTII DUPA VERIFICAREA IN BROWSER
   Fisierele vechi folosesc selectori pe ID, iar unele se incarca din controale,
   deci DUPA fisierul asta. De aceea tot ce e aici e ancorat in #paginaClinicaNoua:
   asa batem si regulile pe ID, indiferent de ordinea de incarcare.
   ============================================================================ */

/* --- Bara de sus: era position:fixed, deci continutul intra sub ea ---------- */
/* height auto: invelisul ia inaltimea barei noi (--top). Inaltimile fixe vechi (100px, 80px pe telefon)
   lasau pe desktop o banda goala sub bara, iar pe telefon bara acoperea denumirea si inima de favorit. */
#paginaClinicaNoua #pnlTopHeader { position: sticky; top: 0; z-index: 60; height: auto; }

/* sub 600px, .container{padding:0 18px} (din macheta) anula si spatiul de sus al paginii,
   iar denumirea clinicii statea lipita de bara */
@media (max-width: 600px) {
    #paginaClinicaNoua main.container.page { padding-top: 18px; }
}

#paginaClinicaNoua #navbarHeader.topbar {
    position: static;
    width: 100%;
    height: auto;
    min-height: var(--top);
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: linear-gradient(90deg, var(--violet-deep), var(--violet-bright));
}

#paginaClinicaNoua #navbarHeader.topbar .navbar-container-main {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 28px;
}


/* logo-ul clinicii din bara */
#paginaClinicaNoua .brand { min-width: 0; max-width: 260px; }
#paginaClinicaNoua .brand__logo { width: 34px; height: 34px; flex: none; }

/* --- Listele de servicii si facilitati erau late cat continutul lor -------- */
#paginaClinicaNoua .svcs.divServiciiSiFacilitati,
#paginaClinicaNoua .facs.divServiciiSiFacilitati {
    width: 100%;
    max-width: none;
    min-width: 0;
    height: auto;
    min-height: 0;
}

/* --- Titlurile de sectiune, exact ca in macheta: mici, mov, majuscule, spatiate.
   (Le repetam aici, cu specificitate mai mare, ca sa bata regulile vechi pe
   .pnlCategoriePagina h3 din PrezentareClinica*.css.) --- */
#paginaClinicaNoua .stitle > h2,
#paginaClinicaNoua .stitle > h3,
#paginaClinicaNoua .stitle > h4 {
    margin: 0;
    color: var(--violet);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* --- Coperta nu avea inaltime, pentru ca elementele bootstrap erau goale --- */
#paginaClinicaNoua .cover { min-height: 260px; background: var(--lav); }
#paginaClinicaNoua .cover .carousel { height: 100%; }
#paginaClinicaNoua .cover .item { height: 100%; }

/* ============================================================================
   ANULAREA REGULILOR VECHI PE ID (lista obtinuta inspectand pagina in browser)
   Regulile astea veneau din structura cu "pagini" late cat ecranul si se bat cu
   grila noua. Nu atingem fisierele vechi (le folosesc alte pagini) si nu atingem
   regulile de modale: modalele isi pastreaza designul.
   ============================================================================ */

/* --- panourile erau coloane centrate, cat tot ecranul --- */
#paginaClinicaNoua #panelDescriere,
#paginaClinicaNoua #panelContact {
    display: block;
    align-items: stretch;
    gap: 0;
}

/* doar fundalul, nu si marginile: distanta dintre sectiuni o da regula comuna */
#paginaClinicaNoua #panelReviewuri { background-color: transparent; }

/* --- Descriere --- */
#paginaClinicaNoua #descriereClinica {
    position: static;
    display: block;
    -webkit-line-clamp: none;
    font-size: 15px;
    line-height: 1.6;
    color: var(--slate);
}

/* clamp-ul il punem noi, pe containerul textului, ca sa-l putem desface la click */
/* Restrangerea descrierii, ca in macheta: cinci randuri si o estompare spre alb
   la baza, nu taiere seaca. Deschiderea se face prin clasa .is-open. */
#paginaClinicaNoua .prose .clamp {
    position: relative;
    display: block;
    max-height: calc(1.7em * 5);
    overflow: hidden;
}

#paginaClinicaNoua .prose .clamp::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2.6em;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);
    pointer-events: none;
}

#paginaClinicaNoua .prose .clamp.is-open { max-height: none; }
#paginaClinicaNoua .prose .clamp.is-open::after { display: none; }

/* textul descrierii */
#paginaClinicaNoua .prose #descriereClinica,
#paginaClinicaNoua .prose #descriereClinica p {
    font-size: 15.5px;
    line-height: 1.7;
    max-width: 70ch;
    color: var(--ink);
}

/* height/max-height: sub 1100px stilul vechi limita #divServicii la 325px si ultimul rand
   de servicii intra peste Facilitati */
#paginaClinicaNoua #divServicii,
#paginaClinicaNoua #divFacilitati {
    width: 100%;
    max-width: none;
    height: auto;
    max-height: none;
    padding: 0;
    margin: 28px 0 0;
}

/* --- Echipa --- */
#paginaClinicaNoua #divListaMedici {
    display: block;
    grid-template-columns: none;
    column-gap: 0;
    max-height: none;
    overflow: visible;
    padding: 0;
}

/* --- Review-uri --- */
#paginaClinicaNoua #upRev { display: block; }

#paginaClinicaNoua #pnlRating {
    display: block;
    width: 100%;
    height: auto;
    gap: 0;
}

#paginaClinicaNoua #listaMesajeReview {
    display: block;
    flex-direction: row;
    gap: 0;
    padding: 0;
    height: auto;
}

/* ratingul din identitate e pe orizontala, nu pe verticala */
#paginaClinicaNoua .head .divRatingContainer { flex-direction: row; align-items: center; gap: 6px; }

/* --- Galerie --- */
#paginaClinicaNoua #divListaGalerieFoto,
#paginaClinicaNoua #divListaTestimoniale {
    grid-auto-rows: auto;
    padding: 0;
    max-height: none;
    overflow: visible;
}

/* --- Reclame: lasam exact comportamentul dinainte ------------------------- */
/* #panelReclama era ascuns cu !important si bannerul din Descriere la fel:
   reclama apare doar acolo unde o arata regulile vechi (pe mobil). Nu fortam
   nimic in plus, ca sa nu schimbam unde se vede publicitatea. */
/* Nu mai fortam afisarea: regula veche (display:none pe desktop, vizibil pe mobil)
   ramane asa cum era. Bannerul e intr-o coloana bootstrap care are float, iar
   containerul se prabusea, lasand reclama peste continutul de dedesubt. */

/* cardul de medic era coloana centrata; il intoarcem pe orizontala */
#paginaClinicaNoua .team .divMedicEchipa {
    flex-direction: row;
    width: auto;
    text-align: left;
    border-radius: 0;
}

#paginaClinicaNoua .team .divMedicEchipa:hover { background: none; box-shadow: none; transform: none; }

#paginaClinicaNoua .team .imgMedic { aspect-ratio: auto; }

/* --- aspect-ratio ramas din cardurile patrate ale designului vechi --------- */
#paginaClinicaNoua .team .divMedicEchipa { aspect-ratio: auto; }
#paginaClinicaNoua .divReviewMedieFinala { aspect-ratio: auto; }

/* programul din card nu mai are scroll propriu */
#paginaClinicaNoua .card .divProgramLucru { flex: none; overflow: visible; max-height: none; }

/* --- Bara de sus trebuie sa iasa din padding-ul .container-fluid al master-ului.
   Inainte scapa pentru ca era position:fixed cu width:100vw; acum, fiind sticky,
   o intindem pe toata latimea cu marginile negative (body are deja overflow-x
   hidden, deci nu apare bara de derulare orizontala). ------------------------ */
#paginaClinicaNoua #pnlTopHeader {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    width: auto;
}

/* --- .navMeniu era position:absolute, deci butoanele se suprapuneau peste
   zona de cont. In bara noua totul se aseaza cu flex. --------------------- */
#paginaClinicaNoua .navMeniu {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    transform: none;
    width: auto;
    max-width: none;
    height: auto;
    padding: 0;
    background: none;
    box-shadow: none;
    overflow: visible;
    flex: 1;
}

#paginaClinicaNoua .navListaCategorii {
    position: static;
    display: flex;
    align-items: center;
    width: auto;
    height: auto;
    margin: 0 auto;
    padding: 0;
    background: none;
    overflow: visible;
}

/* meniul de mobil (contul, inchidere) apare doar in panoul de sub 1060px */
#paginaClinicaNoua .navOptiuniMobile { display: none; }

@media (max-width: 1060px) {
    #paginaClinicaNoua .navMeniu { flex: 1 0 100%; order: 10; }
}

/* --- Corectie full-bleed: cu 50vw bara iesea 7px in stanga si lasa dunga alba
   in dreapta, pentru ca vw include si bara de derulare. Folosim exact padding-ul
   parintelui (.container-fluid din master, 15px), deci se aliniaza perfect. --- */
#paginaClinicaNoua #pnlTopHeader {
    margin-left: -15px;
    margin-right: -15px;
    width: auto;
}

/* --- Suprapunerea Programare / Contul meu: .navMeniu avea flex-basis 0, deci se
   micsora sub latimea continutului, iar butoanele ieseau peste zona de cont. --- */
#paginaClinicaNoua .navMeniu { flex: 1 1 auto; min-width: 0; }

#paginaClinicaNoua .navListaCategorii { min-width: 0; flex: 1 1 auto; }

#paginaClinicaNoua .nav.navSublista {
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

#paginaClinicaNoua .nav.navSublista::-webkit-scrollbar { display: none; }

#paginaClinicaNoua .navZonaCont { flex: none; margin-left: 4px; }

/* --- Dublu underline pe sectiunea curenta -----------------------------------
   Designul vechi desena o linie pe toata latimea elementului (.navCategorie::before,
   bottom:0). Noi avem deja linia scurta, lipita sub text (::after). O scoatem pe
   cea veche, ca sa ramana una singura. */
#paginaClinicaNoua .navCategorie::before { content: none; }

/* --- Sageata de inapoi avea doua chenare ------------------------------------
   Link-ul care o infasoara (.navGoBack) are in CSS-ul vechi 60x40, colturi
   rotunjite si fundal propriu, peste patratul nostru. Il lasam simplu wrapper. */
#paginaClinicaNoua .navGoBack {
    width: auto;
    height: auto;
    padding: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

#paginaClinicaNoua .navGoBack:hover { background: none; }

/* --- Patratelul cu logo-ul clinicii din bara -------------------------------
   Initialele sunt mereu in pagina, sub imagine. Le ascundem doar cat timp
   imaginea chiar exista si s-a incarcat (clasa .areLogo, scoasa de onerror). */
#paginaClinicaNoua .brand__logo.areLogo .brand__mono { display: none; }

#paginaClinicaNoua .brand__logo {
    display: grid;
    place-items: center;
    background: #fff;
    color: #2b2b2b;
}

/* --- Cerculetul de cont ---------------------------------------------------- */
#paginaClinicaNoua .avatar {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .18);
    border: 1px solid rgba(255, 255, 255, .3);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
}

#paginaClinicaNoua .avatar:hover { background: rgba(255, 255, 255, .28); color: #fff; text-decoration: none; }

/* iconita generica apare doar cand nu avem initiala (vizitator nelogat) */
#paginaClinicaNoua .avatar__icon { width: 20px; height: 20px; }
#paginaClinicaNoua .avatar > span:not(:empty) + .avatar__icon { display: none; }
#paginaClinicaNoua .avatar > span:empty { display: none; }

/* initialele din patratul mare de identitate, aratate cand logo-ul nu se incarca */
#paginaClinicaNoua .head .logo.areLogo .logo__mono { display: none; }

#paginaClinicaNoua .head .logo__mono {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: 700;
    font-size: 28px;
    line-height: 1;
    letter-spacing: -.06em;
    color: #2b2b2b;
}

/* Cerculetul de cont avea padding 15px din .lnkIconUserLog (CSS-ul vechi). Cu
   box-sizing: border-box, continutul primea doar 8px si iesea descentrat. */
#paginaClinicaNoua .avatar {
    padding: 0;
    line-height: 1;
    text-align: center;
}

/* --- Panourile erau fortate la inaltimea ecranului --------------------------
   PrezentareClinicaGeneral.css are, peste 1101px:
       .pnlCategoriePagina { height: 100vh !important; }
   Era logic in designul vechi, unde fiecare sectiune ocupa exact un ecran. In
   pagina cu scroll continuu, tot ce depaseste un ecran iese din panou si se
   suprapune peste sectiunea urmatoare. Fiind !important, il putem invinge doar
   tot cu !important. */
#paginaClinicaNoua .content .pnlCategoriePagina {
    height: auto !important;
    max-height: none !important;
}

/* aceleasi inaltimi mostenite, pe containerele din interiorul panourilor */
#paginaClinicaNoua .divContainerEchipa,
#paginaClinicaNoua .divContainerPreturi,
#paginaClinicaNoua .divContainerGalerie,
#paginaClinicaNoua .divContainerGalerie .divCol2,
#paginaClinicaNoua .divContainerReviewuri,
#paginaClinicaNoua .divRand1Contact,
#paginaClinicaNoua .divRand2Contact {
    height: auto !important;
    max-height: none !important;
}

/* containerul de reclama tine si coloana bootstrap care are float, altfel se prabuseste */
#paginaClinicaNoua #divZonaReclamaPatrataPanelDescriere,
#paginaClinicaNoua .zonaReclama { display: flow-root; }

/* --- Publicitatea de sub Facilitati ----------------------------------------
   Code-behind-ul pune ambele formate. Ca in restul site-ului, pe desktop si tableta
   se vede bannerul landscape, iar pe telefon patratul. PrezentareClinicaGeneral.css
   forteaza .reclamaPatrata cu display:block !important pe toata pagina, deci aici
   il ascundem tot cu !important, doar in zona asta (modalele raman neatinse). */
#paginaClinicaNoua #divZonaReclamaPatrataPanelDescriere { margin: 28px 0 0; }

#paginaClinicaNoua #divZonaReclamaPatrataPanelDescriere .reclamaPatrata { display: none !important; }

#paginaClinicaNoua #divZonaReclamaPatrataPanelDescriere .reclamaOrizontala {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    float: none;
}

/* formatul bannerului landscape din restul site-ului e 1100x170; cu inaltimea fixa
   de acolo (170px) bannerul s-ar fi taiat pe latime in coloana de continut, mai ingusta */
#paginaClinicaNoua #divZonaReclamaPatrataPanelDescriere .reclamaOrizontala .imgReclama {
    flex: none;
    width: 100%;
    height: auto;
    aspect-ratio: 1100 / 170;
    object-fit: cover;
    border-radius: 14px;
}

@media (max-width: 767px) {
    #paginaClinicaNoua #divZonaReclamaPatrataPanelDescriere .reclamaOrizontala { display: none; }
    #paginaClinicaNoua #divZonaReclamaPatrataPanelDescriere .reclamaPatrata { display: block !important; }
}

/* nota mare din rezumatul de review-uri iesea cateva pixeli sub cutia ei */
#paginaClinicaNoua .divNrReviewMedieFinala { line-height: 1; }
#paginaClinicaNoua .divNrReviewMedieFinala #lblTotalReview { display: block; line-height: 1; }

/* --- Scroll orizontal pe mobil ---------------------------------------------
   Sub 900px grila trecea pe o coloana "1fr", care are minim implicit min-content.
   Coperta (caruselul cu imaginea clinicii) impingea coloana la latimea ei
   intrinseca, iar toata pagina devenea mai lata decat ecranul. minmax(0,1fr)
   plus min-width:0 pe elementele grilei taie legatura cu min-content. */
@media (max-width: 900px) {
    #paginaClinicaNoua .page { grid-template-columns: minmax(0, 1fr); }
}

#paginaClinicaNoua .head,
#paginaClinicaNoua .side,
#paginaClinicaNoua .content { min-width: 0; }

#paginaClinicaNoua .identity,
#paginaClinicaNoua .cover,
#paginaClinicaNoua .cover #divCaruselImagini,
#paginaClinicaNoua .cover #myCarousel,
#paginaClinicaNoua .cover .carousel-inner,
#paginaClinicaNoua .cover .item { min-width: 0; max-width: 100%; }

#paginaClinicaNoua .cover .imgCarousel { max-width: 100%; }

/* randul de autor / data / iconuri din articole nu incapea pe telefon */
#paginaClinicaNoua .divPublicatContainer { flex-wrap: wrap; min-width: 0; }
#paginaClinicaNoua .divAutor { min-width: 0; }

@media (max-width: 600px) {
    #paginaClinicaNoua .divPublicatIcons { margin-left: 0; }
}

/* pe ecrane mici, data + iconurile trec pe rand propriu sub autor */
@media (max-width: 700px) {
    #paginaClinicaNoua .divPublicatContainer { flex: 1 0 100%; margin-top: 2px; }
}

/* --- Bara de sus pe ecrane mici ---------------------------------------------
   In designul vechi, sub 1060px meniul devenea un panou care acoperea ecranul,
   deschis cu hamburgerul. In mockup ramane vizibil, ca rand orizontal cu derulare
   sub numele clinicii. Rescriem aici toata zona, ancorat in ID ca sa batem
   regulile vechi. */
@media (max-width: 1060px) {
    #paginaClinicaNoua #navbarHeader.topbar .navbar-container-main {
        flex-wrap: wrap;
        row-gap: 0;
        min-height: 0;
        padding-top: 10px;
        padding-bottom: 0;
    }

    #paginaClinicaNoua .brand { flex: 1; }

    #paginaClinicaNoua .navMeniu {
        position: static;
        display: block;
        flex: 1 0 100%;
        order: 10;
        width: 100%;
        max-width: none;
        height: auto;
        margin: 4px 0 0;
        padding: 0;
        background: none;
        box-shadow: none;
        transform: none;
        opacity: 1;
        visibility: visible;
        overflow: visible;
    }

    #paginaClinicaNoua .navListaCategorii {
        display: block;
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
        background: none;
    }

    #paginaClinicaNoua .nav.navSublista {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 0;
        width: 100%;
        height: 44px;
        margin: 0;
        padding: 0;
        overflow-x: auto;
        overflow-y: hidden;
    }

    #paginaClinicaNoua .navCategorie {
        flex: none;
        height: 44px;
        padding: 0 11px;
        font-size: 13.5px;
    }

    #paginaClinicaNoua .navCategorie.showCategorie::after { bottom: 6px; }

    /* hamburgerul si panoul lui nu mai au rost: meniul e mereu vizibil */
    #paginaClinicaNoua #btnDeschideMeniuPrincipal,
    #paginaClinicaNoua .navOptiuniMobile,
    #paginaClinicaNoua #navTitluMobile { display: none !important; }

    #paginaClinicaNoua .navZonaCont { display: flex !important; }
}

/* --- Bara fixa de jos, pe mobil (.mobilebar din mockup) ---------------------
   Regula veche #panelButoaneFooter o facea inalta de 90px, cu butoane pe
   verticala si textul taiat. O rescriem ca doua pastile pe un rand. */
#paginaClinicaNoua #panelButoaneFooter.mobilebar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: rgba(255, 255, 255, .96);
    border-top: 1px solid var(--line);
    box-shadow: 0 -2px 12px rgba(36, 38, 58, .06);
}

#paginaClinicaNoua #panelButoaneFooter .lnkFooter {
    flex: 1;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-transform: none;
    text-decoration: none;
}

#paginaClinicaNoua #panelButoaneFooter #lnkSunaFooter { background: var(--green); color: #fff; }
#paginaClinicaNoua #panelButoaneFooter #lnkProgrameazaFooter { background: var(--violet-bright); color: #fff; }
#paginaClinicaNoua #panelButoaneFooter .lnkFooter .icon,
#paginaClinicaNoua #panelButoaneFooter .lnkFooter .iconSuna { width: 18px; height: 18px; font-size: 18px; }

/* lasam loc barei, ca ultimul continut sa nu ramana sub ea */
@media (max-width: 900px) {
    #paginaClinicaNoua { padding-bottom: 78px; }
}

/* --- Identitate: randul cu tip + localitate, subtitlul din logo, randul de rating --- */
#paginaClinicaNoua .identity__kind {
    margin: 4px 0 0;
    color: var(--slate);
    font-size: 15px;
}

#paginaClinicaNoua .logo .logo__text { text-align: center; line-height: 1; }
#paginaClinicaNoua .head .logo.areLogo .logo__text { display: none; }

#paginaClinicaNoua .logo__sub {
    margin-top: 3px;
    max-width: 66px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 10px;
    color: #8a6f5a;
}

/* randul de rating: stele, media ingrosata, numarul de review-uri ca link, nota finala */
#paginaClinicaNoua .rating .divRatingContainer {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

#paginaClinicaNoua .rating .review-text-container {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

#paginaClinicaNoua .rating .divTotalReview {
    color: var(--ink);
    font-size: 15px;
    font-weight: 800;
    font-variant-numeric: lining-nums tabular-nums;
}

#paginaClinicaNoua .rating .divNrVoturiReview {
    color: var(--violet);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

#paginaClinicaNoua .rating .divRatingContainer:hover .divNrVoturiReview { text-decoration: underline; }

#paginaClinicaNoua .rating .divNotaUnanima { color: var(--slate); font-size: 14px; }

/* ============================================================================
   PROFILUL MEDICULUI - sertar lateral peste pagina (ecran intreg pe telefon)
   #divDetaliiMedic e fundalul intunecat, .pm e sertarul. Regulile vechi pe ID din
   PrezentareClinicaPanelEchipa.css (position:absolute, top 100/170px, padding 130px,
   translateX(100%), 100vh, z-index 200) sunt anulate aici, la toate latimile.
   z-index 1030: peste bara de sus si bara de jos, sub modalele Bootstrap (ridicate in
   Clinica.Master la 10040/10050), deci programarea, videoul si "Suna" se deschid peste
   sertar. Subsolul din master are z-index 9999; il coboram cat timp sertarul e deschis.
   ============================================================================ */
#paginaClinicaNoua #divDetaliiMedic {
    position: fixed;
    inset: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;
    display: block;
    width: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: rgba(36, 38, 58, 0);
    transform: none;
    transition: background-color .2s ease;
}

#paginaClinicaNoua #divDetaliiMedic.active { background: rgba(36, 38, 58, .42); transform: none; }

/* in cele 260ms de animatie de inchidere, fundalul transparent nu mai prinde click-uri */
#paginaClinicaNoua #divDetaliiMedic:not(.active) { pointer-events: none; }

/* pagina din spate nu se mai deruleaza; overflow pe body (nu pe html), ca bara si cardul sticky sa ramana.
   scrollbar-gutter pastreaza locul barei de derulare, altfel pagina din spate sare lateral cand dispare */
html.htmlPrezentareClinicaNoua { scrollbar-gutter: stable; }
body.medicDeschis { overflow: hidden; }
body.medicDeschis #panelWhatsAppFlotant,
body.medicDeschis jdiv { display: none !important; }
body.medicDeschis .footerMaster { z-index: 0 !important; }

#paginaClinicaNoua .pm {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(600px, calc(100vw - 48px));
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 18px 0 0 18px;
    box-shadow: -14px 0 44px rgba(74, 63, 189, .16);
    transform: translateX(32px);
    opacity: 0;
    transition: transform .24s cubic-bezier(.2, .8, .2, 1), opacity .24s ease;
}

#paginaClinicaNoua #divDetaliiMedic.active .pm { transform: none; opacity: 1; }

/* antet: eticheta (sau numele, dupa derulare), "2 din 5", sagetile si X */
#paginaClinicaNoua .pm__bar {
    flex: none;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 64px;
    padding: 0 20px 0 32px;
    border-bottom: 1px solid transparent;
    transition: border-color .15s;
}

#paginaClinicaNoua .pm__eticheta {
    flex: 1;
    min-width: 0;
    color: var(--violet);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

#paginaClinicaNoua .pm__numeScurt { display: none; flex: 1; min-width: 0; color: var(--ink); font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#paginaClinicaNoua .pm.is-derulat .pm__bar { border-bottom-color: var(--line); }
#paginaClinicaNoua .pm.is-derulat .pm__eticheta { display: none; }
#paginaClinicaNoua .pm.is-derulat .pm__numeScurt { display: block; }

#paginaClinicaNoua .pm__nav { display: flex; align-items: center; gap: 6px; flex: none; }
#paginaClinicaNoua .pm__poz { margin-right: 4px; color: var(--muted); font-size: 13px; font-weight: 600; white-space: nowrap; }

#paginaClinicaNoua .pm__navbtn,
#paginaClinicaNoua .pm__close {
    display: grid;
    place-items: center;
    padding: 0;
    border-radius: 10px;
    color: var(--violet);
    cursor: pointer;
    font-family: inherit;
}

#paginaClinicaNoua .pm__navbtn { width: 36px; height: 36px; border: 1px solid var(--lav-line); background: #fff; }
#paginaClinicaNoua .pm__navbtn:hover:not([disabled]) { background: var(--lav); }
#paginaClinicaNoua .pm__navbtn[disabled] { opacity: .4; cursor: default; }
#paginaClinicaNoua .pm__navbtn .icon { width: 18px; height: 18px; }

#paginaClinicaNoua .pm__close { order: 5; width: 40px; height: 40px; margin-left: 6px; border: 0; background: var(--lav); }
#paginaClinicaNoua .pm__close:hover { background: var(--lav-2); }
#paginaClinicaNoua .pm__close .icon { width: 20px; height: 20px; }
#paginaClinicaNoua .pm__icoBack { display: none; }

/* corpul se deruleaza singur; antetul si butoanele de jos raman pe loc */
#paginaClinicaNoua .pm__body {
    position: relative;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 12px 32px 28px;
}

#paginaClinicaNoua .pm__id { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 18px; align-items: center; }

/* poza rotunda; fara poza (sau daca nu se incarca) raman initialele pe lavanda */
#paginaClinicaNoua .pm__foto {
    position: relative;
    display: grid;
    place-items: center;
    width: 96px;
    height: 96px;
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid var(--lav-line);
    background: var(--lav);
    color: var(--violet);
    font-size: 30px;
    font-weight: 700;
}

#paginaClinicaNoua .pm__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: none; }
#paginaClinicaNoua .pm__foto.arePoza img { display: block; }
#paginaClinicaNoua .pm__foto.arePoza #lblInitialeProfilMedic { visibility: hidden; }

#paginaClinicaNoua .pm__nume {
    margin: 0;
    color: var(--ink);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.01em;
    text-transform: none;
    overflow-wrap: anywhere;
}

#paginaClinicaNoua .pm__nume:focus { outline: none; }

#paginaClinicaNoua .pm__specs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

#paginaClinicaNoua .pm__spec {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 26px;
    padding: 0 11px;
    border-radius: 999px;
    background: var(--lav);
    color: var(--violet);
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
}

#paginaClinicaNoua .pm__spec .icon { width: 15px; height: 15px; }

#paginaClinicaNoua .pm__clinica { margin: 8px 0 0; color: var(--slate); font-size: 14px; }
#paginaClinicaNoua .pm__clinica strong { color: var(--ink); font-weight: 600; }

/* "Despre medic": CV-ul pe paragrafe, strans la 8 randuri cu "Vezi tot" */
#paginaClinicaNoua .pm__cv {
    max-width: 64ch;
    color: var(--ink);
    font-size: 15.5px;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

#paginaClinicaNoua .pm__cv p { margin: 0 0 12px; }
#paginaClinicaNoua .pm__cv p:last-child { margin-bottom: 0; }
#paginaClinicaNoua .pm__cv ul { margin: 0 0 12px; padding-left: 20px; }
#paginaClinicaNoua .pm__cv.clamp { max-height: calc(1.7em * 8); }
#paginaClinicaNoua .pm__cv.clamp.is-open { max-height: none; }
#paginaClinicaNoua #btnVeziTotCvMedic { margin-top: 8px; }

#paginaClinicaNoua .pm__gol {
    margin: 0;
    padding: 14px 16px;
    border: 1px dashed var(--lav-line);
    border-radius: 12px;
    color: var(--muted);
    font-size: 14px;
}

/* "Interviu video": card 16:9 cu play, deschide modalul video existent */
#paginaClinicaNoua .pm__video {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--lav-line);
    border-radius: 14px;
    background: var(--lav);
    cursor: pointer;
}

#paginaClinicaNoua .pm__video img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s ease; }
#paginaClinicaNoua .pm__video.faraImagine { background: linear-gradient(135deg, var(--lav), var(--lav-2)); }
#paginaClinicaNoua .pm__video.faraImagine img { display: none; }

#paginaClinicaNoua .pm__play {
    position: absolute;
    left: 50%;
    top: 50%;
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    color: var(--violet-bright);
    box-shadow: 0 8px 24px rgba(36, 38, 58, .22);
    transform: translate(-50%, -50%);
    transition: background-color .15s, color .15s;
}

#paginaClinicaNoua .pm__play .icon { width: 26px; height: 26px; margin-left: 3px; }
#paginaClinicaNoua .pm__video:hover .pm__play,
#paginaClinicaNoua .pm__video:focus-visible .pm__play { background: var(--violet-bright); color: #fff; }
#paginaClinicaNoua .pm__video:hover img { transform: scale(1.02); }

/* butoanele de jos raman vizibile oricat de lung e CV-ul */
#paginaClinicaNoua .pm__foot {
    flex: none;
    padding: 14px 32px 16px;
    border-top: 1px solid var(--line);
    border-radius: 0 0 0 18px;
    background: #fff;
}

#paginaClinicaNoua .pm__btns { display: flex; gap: 8px; }
#paginaClinicaNoua .pm__foot .btn { display: flex; height: 46px; margin: 0; text-decoration: none; }
#paginaClinicaNoua .pm__foot .pm__cta { flex: 1 1 auto; min-width: 0; }
#paginaClinicaNoua .pm__foot .pm__suna:only-child { flex: 1; }
#paginaClinicaNoua .pm__foot .pm__cta:hover,
#paginaClinicaNoua .pm__foot .pm__cta:focus { color: #fff; text-decoration: none; }

#paginaClinicaNoua .pm__nota { display: flex; align-items: center; gap: 6px; margin: 10px 0 0; color: var(--slate); font-size: 13px; }
#paginaClinicaNoua .pm__nota .icon { width: 15px; height: 15px; color: var(--green-dark); }

/* telefon: ecran intreg, antetul mov ca bara paginii, cu sageata de inapoi */
@media (max-width: 600px) {
    #paginaClinicaNoua .pm {
        width: 100%;
        border-radius: 0;
        box-shadow: none;
        transform: translateX(100%);
        opacity: 1;
        transition: transform .26s cubic-bezier(.2, .8, .2, 1);
    }

    #paginaClinicaNoua .pm__bar {
        height: 56px;
        padding: 0 10px 0 8px;
        background: linear-gradient(90deg, var(--violet-deep), var(--violet-bright));
        border-bottom: 0;
    }

    #paginaClinicaNoua .pm__close { order: 0; margin: 0; background: rgba(255, 255, 255, .16); color: #fff; }
    #paginaClinicaNoua .pm__close:hover { background: rgba(255, 255, 255, .24); }
    #paginaClinicaNoua .pm__icoX { display: none; }
    #paginaClinicaNoua .pm__icoBack { display: block; }

    #paginaClinicaNoua .pm__eticheta { color: #fff; font-size: 12px; letter-spacing: .1em; }
    #paginaClinicaNoua .pm__numeScurt { color: #fff; }
    #paginaClinicaNoua .pm__poz { color: rgba(255, 255, 255, .8); }
    #paginaClinicaNoua .pm__navbtn { border: 0; background: rgba(255, 255, 255, .16); color: #fff; }
    #paginaClinicaNoua .pm__navbtn:hover:not([disabled]) { background: rgba(255, 255, 255, .24); }

    #paginaClinicaNoua .pm__body { padding: 18px 16px 24px; }
    #paginaClinicaNoua .pm__id { grid-template-columns: 72px minmax(0, 1fr); gap: 14px; }
    #paginaClinicaNoua .pm__foto { width: 72px; height: 72px; font-size: 24px; }
    #paginaClinicaNoua .pm__nume { font-size: 21px; }
    #paginaClinicaNoua .pm__cv { font-size: 15px; }

    #paginaClinicaNoua .pm__foot {
        padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
        border-radius: 0;
        box-shadow: 0 -10px 30px rgba(36, 38, 58, .08);
    }

    #paginaClinicaNoua .pm__nota { display: none; }
}

/* pe ecrane foarte inguste "Suna" ramane doar iconita, ca programarea sa incapa pe un rand */
@media (max-width: 420px) {
    #paginaClinicaNoua .pm__poz { display: none; }
    #paginaClinicaNoua .pm__foot .pm__suna:not(:only-child) { width: 46px; flex: none; padding: 0; }
    #paginaClinicaNoua .pm__foot .pm__suna:not(:only-child) .pm__sunaText { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    #paginaClinicaNoua #divDetaliiMedic,
    #paginaClinicaNoua .pm,
    #paginaClinicaNoua .pm__video img { transition: none; }
}

/* modalul video: playerul 16:9 pe toata latimea, nu o banda cu inaltime fixa */
#paginaClinicaNoua #ytplayerEchipa { width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: 80vh; }

/* acelasi tratament pentru ecranul de descriere, ramas in pagina */
#paginaClinicaNoua #divDescriereClinicaModal {
    position: fixed;
    top: var(--top);
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: auto;
    padding: 24px 28px;
    overflow-y: auto;
    background: #fff;
    z-index: 200;
}

@media (max-width: 900px) {
    #paginaClinicaNoua #divDescriereClinicaModal { padding: 18px 16px; }
}

/* --- Sectiunea Contact: elemente scoase din flux de stilurile vechi ---------
   "Pornește navigația" si iconurile de social media erau position:absolute,
   asezate fata de casetele vechi. In layout-ul nou pluteau peste adresa,
   respectiv peste butoanele de contact. Le readucem in flux. */
#paginaClinicaNoua .lblDirectii,
#paginaClinicaNoua #groupSocialMedia {
    position: static;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    transform: none;
}

#paginaClinicaNoua #groupSocialMedia { width: auto; height: auto; }

/* grilele de imagini raman grile, dar mereu vizibile */
#paginaClinicaNoua #divListaGalerieFoto,
#paginaClinicaNoua #divListaTestimoniale {
    display: grid !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none;
    overflow: visible;
    margin: 0;
    padding: 0;
}

/* ============================================================================
   GALERIE: 5 casute, peste a cincea placa "+N", extinsa la click (ca in macheta)
   Starea sta in atributul data-restrans de pe lista (comutaGalerieCompleta).
   ============================================================================ */

/* titlul: stilul vechi .divHeaderGalerie (width:100%, height:50px) ocupa tot randul,
   iar linia disparea si "9 fotografii" se rupea pe doua randuri */
#paginaClinicaNoua .stitle > .divHeaderGalerie { flex: none; width: auto; height: auto; line-height: 1.3; }
#paginaClinicaNoua .stitle .count { white-space: nowrap; }

/* pe telefon randul nu incape intreg: "Galerie foto completă" trece pe randul doi, la dreapta,
   in loc sa iasa din coloana (la 320px lata toata pagina) */
@media (max-width: 600px) {
    #paginaClinicaNoua #divSectiuneGalerieFoto .stitle { flex-wrap: wrap; row-gap: 6px; }
    #paginaClinicaNoua #divSectiuneGalerieFoto .stitle .rule { min-width: 24px; }
    #paginaClinicaNoua #divSectiuneGalerieFoto .stitle .act { margin-left: auto; }
}

/* restrans: pozele de la a sasea incolo sunt ascunse, placa "+N" se vede peste a cincea */
#paginaClinicaNoua #divListaGalerieFoto[data-restrans] .galerieExtra { display: none; }
#paginaClinicaNoua #divListaGalerieFoto[data-restrans] .tile__more { display: grid; cursor: pointer; }
#paginaClinicaNoua #divListaGalerieFoto:not([data-restrans]) .tile__more { display: none; }
#paginaClinicaNoua #divListaGalerieFoto .tile__more:hover { background: rgba(74, 63, 189, .88); }
/* sub placa nu mai aratam eticheta "Foto", ar iesi prin textul "vezi toate fotografiile" */
#paginaClinicaNoua #divListaGalerieFoto[data-restrans] .tileCuPlaca::after { content: none; }

/* casuta: lavanda cu eticheta "Foto" pana se incarca poza; poza o acopera cand exista */
#paginaClinicaNoua #divListaGalerieFoto .tile { border: 1px solid var(--lav-line); background: var(--lav); }
#paginaClinicaNoua #divListaGalerieFoto .tile .imgGalerieFoto {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    border-radius: 0;
    background: none;
    object-fit: cover;
}
#paginaClinicaNoua #divListaGalerieFoto .tile__more { z-index: 2; }

/* telefon: mozaic ca in macheta, prima poza mare, a cincea pe doua coloane */
@media (max-width: 600px) {
    #paginaClinicaNoua #divListaGalerieFoto.strip { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 104px; }
    #paginaClinicaNoua #divListaGalerieFoto.strip > .tile { aspect-ratio: auto; height: 100%; }
    #paginaClinicaNoua #divListaGalerieFoto.strip > .tile:first-child { grid-column: span 2; grid-row: span 2; }
    #paginaClinicaNoua #divListaGalerieFoto.strip > .tile:nth-child(5) { grid-column: span 2; }
}

/* ============================================================================
   CAZURI CLINICE - in limbajul paginii noi
   Cardurile vin din ControlCazuriClinice (folosit si in contul clinicii si pe pagina
   de detalii a cazului), deci le restilizam doar aici, pe pagina clinicii. Stilurile
   vechi (Control-Cazuri-Clinice.css, PrezentareClinicaPanelGalerie.css) au latimi
   fixe si padding cu !important, de aceea unele reguli de mai jos au si ele !important.
   ============================================================================ */

#paginaClinicaNoua #divSectiuneCazuriClinice { scroll-margin-top: calc(var(--top) + 20px); }

#paginaClinicaNoua #divListaCazuriClinice { height: auto; }

/* UpdatePanel-ul din control avea padding 20px, iar cardurile nu mai ajungeau la marginile coloanei */
#paginaClinicaNoua #pnlControlCazuriClinice { height: auto; padding: 0; }

/* grila: 2 carduri pe rand (1 pe telefon); .row din bootstrap are ::before/::after de clearfix,
   care intr-o grila ar deveni celule goale */
/* justify-items: sub 768px o regula veche le centra (justify-items:center), iar cardurile
   cu titlu scurt se ingustau pana la latimea textului */
#paginaClinicaNoua #divListaCazuri {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: stretch;
    gap: 12px;
    width: auto;
    max-width: none !important;
    max-height: none;
    overflow: visible;
    margin: 0;
    padding: 0;
    justify-content: stretch;
}

#paginaClinicaNoua #divListaCazuri::before,
#paginaClinicaNoua #divListaCazuri::after { content: none; display: none; }

#paginaClinicaNoua #divListaCazuri .divBlockColCaz {
    float: none;
    width: auto;
    min-width: 0;
    max-width: none;
    margin: 0;
    padding: 0 !important;
}

/* primele 2 cazuri, ca la echipa; restul la "Vezi tot" */
#paginaClinicaNoua #divListaCazuriClinice[data-restrans] #divListaCazuri > .divBlockColCaz:nth-child(n+3) { display: none; }

/* cardul: pozele inainte / dupa una langa alta, titlul, apoi aprecierile */
/* randul 3 ia spatiul ramas, ca aprecierile sa stea jos si cand titlul are un singur rand */
#paginaClinicaNoua #divListaCazuri .lnkBlockCazClinic {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto auto 1fr;
    gap: 8px;
    align-items: start;
    width: auto;
    max-width: none !important;
    height: 100%;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--lav-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
    color: var(--ink);
    cursor: pointer;
    transition: border-color .12s, box-shadow .12s;
}

#paginaClinicaNoua #divListaCazuri .lnkBlockCazClinic:hover {
    border-color: var(--violet-soft);
    box-shadow: 0 8px 24px rgba(74, 63, 189, .08);
}

/* casutele de poza: lavanda cat se incarca poza sau daca lipseste */
#paginaClinicaNoua #divListaCazuri .divBlockZonaImgCazClinic {
    position: relative;
    height: auto;
    aspect-ratio: 1;
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--lav-line);
    border-radius: 10px;
    background: var(--lav);
}

#paginaClinicaNoua #divListaCazuri .imgCazClinic {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 0;
    object-fit: cover;
}

/* "Înainte" / "După": pastila mica, ca eticheta de pe coperta */
#paginaClinicaNoua #divListaCazuri .divBlockHintCazClinic {
    left: 8px;
    right: auto;
    bottom: 8px;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    color: var(--violet);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    box-shadow: 0 2px 8px rgba(36, 38, 58, .12);
}

/* titlul pe cel mult doua randuri, nu taiat dupa cateva cuvinte */
#paginaClinicaNoua #divListaCazuri .divBlockTitluCazClinic {
    grid-column: 1 / -1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin: 4px 2px 0;
    padding: 0;
    overflow: hidden;
    white-space: normal;
    text-align: left;
    color: var(--ink);
    font-family: inherit;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.4;
}

#paginaClinicaNoua #divListaCazuri .lnkBlockCazClinic:hover .divBlockTitluCazClinic { color: var(--violet); }

/* aprecierile la stanga, "Vezi cazul" la dreapta */
#paginaClinicaNoua #divListaCazuri .divContainerButoane {
    grid-column: 1 / -1;
    align-self: end;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 2px 2px;
}

#paginaClinicaNoua #divListaCazuri .divContainerButoane::after {
    content: "Vezi cazul ›";
    color: var(--violet);
    font-size: 13px;
    font-weight: 600;
}

#paginaClinicaNoua #divListaCazuri .divContainerLike { display: inline-flex; align-items: center; gap: 5px; }
#paginaClinicaNoua #divListaCazuri .btnLikeCazClinic { font-size: 18px; color: var(--muted); }
#paginaClinicaNoua #divListaCazuri .btnLikeCazClinic.iconActiv { color: var(--violet); }
#paginaClinicaNoua #divListaCazuri .btnLikeCazClinic:hover { color: var(--violet); }
#paginaClinicaNoua #divListaCazuri .spnNrLikeCazClinic { margin: 0; color: var(--muted); font-size: 13px; font-weight: 600; vertical-align: baseline; }

@media (max-width: 600px) {
    #paginaClinicaNoua #divListaCazuri { grid-template-columns: minmax(0, 1fr); }

    /* antetul: daca nu incape, "Vezi tot" trece pe randul doi, ca la galerie */
    #paginaClinicaNoua #divSectiuneCazuriClinice .stitle { flex-wrap: wrap; row-gap: 6px; }
    #paginaClinicaNoua #divSectiuneCazuriClinice .stitle .rule { min-width: 24px; }
    #paginaClinicaNoua #divSectiuneCazuriClinice .stitle .act { margin-left: auto; }
}

/* --- Fereastra unui caz clinic -----------------------------------------------
   Controlul muta modalul in <body>, deci e in afara #paginaClinicaNoua; il legam de
   pagina prin clasa pusa pe <html> (htmlPrezentareClinicaNoua). Aspectul urmeaza
   profilul medicului: eticheta mica, titlu la stanga, X lavanda, butoane din pagina. */
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic { padding-left: 0; font-family: Raleway, sans-serif; }

/* width: pastreaza 24px de fiecare parte si pe tableta, nu doar pe telefon */
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-dialog {
    display: block;
    width: calc(100% - 48px);
    max-width: 880px;
    margin: 40px auto;
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-content {
    max-width: none;
    border: 0;
    border-radius: 18px;
    box-shadow: 0 24px 60px rgba(36, 38, 58, .25);
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-header {
    position: relative;
    display: block;
    padding: 22px 72px 6px 28px;
    border: 0;
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-header::before {
    content: "Caz clinic";
    display: block;
    margin-bottom: 6px;
    color: var(--violet);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

html.htmlPrezentareClinicaNoua #titluModalDetaliiCaz {
    margin: 0;
    color: var(--ink);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    overflow-wrap: anywhere;
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic #btnInchideDetaliiCaz.close {
    position: absolute;
    top: 16px;
    right: 16px;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--lav);
    box-shadow: none;
    color: var(--violet);
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic #btnInchideDetaliiCaz.close:hover { background: var(--lav-2); }
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .iconCloseModal { font-size: 20px; color: var(--violet); }

/* corpul: pozele in stanga, medicul si studiul de caz in dreapta */
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-body {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 28px;
    align-items: start;
    padding: 14px 28px 8px;
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .lnkBlockCazClinic {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    min-width: 0;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    cursor: default;
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .divBlockZonaImgCazClinic {
    position: relative;
    height: auto;
    aspect-ratio: 1;
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--lav-line);
    border-radius: 12px;
    background: var(--lav);
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .imgCazClinic { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; object-fit: cover; }

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .divBlockHintCazClinic {
    left: 10px;
    right: auto;
    bottom: 10px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    color: var(--violet);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    box-shadow: 0 2px 8px rgba(36, 38, 58, .12);
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .iconWrapper {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 6px;
    text-align: left;
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .btnLikeCazClinic { font-size: 20px; color: var(--muted); }
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .btnLikeCazClinic.iconActiv,
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .btnLikeCazClinic:hover { color: var(--violet); }
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .spnNrLikeCazClinic { margin: 0; color: var(--muted); font-size: 14px; font-weight: 600; vertical-align: baseline; }

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .divContainerDetaliiCaz { gap: 18px; min-width: 0; padding: 0; width: auto; }
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .divDetaliiCaz { padding: 0; width: auto; }

/* "Medic:" / "Studiu de caz:" ca titlurile mici de sectiune din pagina */
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .divDetaliiCaz > div:first-child {
    margin-bottom: 6px;
    color: var(--violet);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

html.htmlPrezentareClinicaNoua #divModalNumeMedicCaz { color: var(--ink); font-size: 15.5px; font-weight: 600; }

html.htmlPrezentareClinicaNoua #divModalDescriereCaz {
    max-height: 340px;
    padding-right: 6px;
    overflow-y: auto;
    color: var(--ink);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

/* jos: butonul de programare ca in pagina (pastila violet), nu cu majuscule */
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
    padding: 14px 28px 18px;
    border-top: 1px solid var(--line);
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic #lnkToProgrameazaModalCazClinic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    height: 46px;
    margin: 0;
    padding: 0 22px;
    border-radius: 999px;
    background: var(--violet-bright);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-transform: none;
    text-decoration: none;
}

html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic #lnkToProgrameazaModalCazClinic:hover { background: var(--violet); color: #fff; }
html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic #lnkToProgrameazaModalCazClinic .icon { font-size: 19px; }

@media (max-width: 992px) {
    html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
    html.htmlPrezentareClinicaNoua #divModalDescriereCaz { max-height: none; }
}

@media (max-width: 600px) {
    html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-dialog { width: auto; max-width: none; margin: 12px; }
    html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-header { padding: 18px 64px 4px 16px; }
    html.htmlPrezentareClinicaNoua #titluModalDetaliiCaz { margin: 0; font-size: 18px; }
    html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic #btnInchideDetaliiCaz.close { top: 12px !important; right: 12px !important; }
    html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-body { padding: 12px 16px 4px; }
    html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic .modal-footer { padding: 12px 16px 16px; }
    html.htmlPrezentareClinicaNoua #modalDetaliiCazClinic #lnkToProgrameazaModalCazClinic { width: 100%; }
}

/* butonul din antetul sectiunii (dreapta, langa contor) */
#paginaClinicaNoua .stitle .act {
    margin-left: 4px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--violet);
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

#paginaClinicaNoua .stitle .act:hover { text-decoration: underline; }

/* coperta: o singura fotografie, fara controale de carusel */
#paginaClinicaNoua .cover .carousel-indicators,
#paginaClinicaNoua .cover .carousel-control { display: none; }
