/* Direcția nouă, după Brand book, Ediția 3: ce au în comun paginile trecute pe ea (homepage-ul, /specialitati/), încărcat doar
   pe ele, după chrome.css. Bleumarin, alb și accente aurii; Lora pentru titluri, Hanken Grotesk pentru text; gradientul
   multicolor rămâne în siglă. Mobil întâi. Aici: variabilele, perechea de fonturi, antetul insulă (subsolul are foaia lui, foot-brand.css) și
   piesele mici (butoane, săgeți, iconițe). Fiecare pagină își aduce apoi foaia ei. */
:root {
  --oxc-brand: #3b86d1;
  --oxc-navy: #0d2340;
  --oxc-blue: #13315b;
  --oxc-teal: #a67c43;
  --oxc-deep: #0d2340;
  --oxc-deep-2: #13315b;
  --oxc-ink: #14243c;
  --oxc-body: #4d5a6b;
  --oxc-mute: #5f6b7c;
  --oxc-line: #e4e9f1;
  --oxc-line-2: #d5dce6;
  --oxc-soft: #f5f8fc;
  --oxc-tint: #eef3fa;
  --oxc-spectrum: linear-gradient(90deg, #b8935a, #b8935a);
  --oxc-font: "Hanken Grotesk", "Hanken Grotesk Fallback", ui-sans-serif, system-ui, sans-serif;
  --oh-serif: Lora, "Lora Fallback", Georgia, serif;
  --oh-gold: #b8935a;
  --oh-gold-d: #a67c43;
  --oh-sec: clamp(52px, 3vw + 40px, 96px);
  --oh-r: 14px;
}
/* Tema veche (clinic.css) dă fonturile prin variabile și pune titlurile pe 800: aici, pereche Lora + Hanken. */
.oxx.is-clinic { --p-display: Lora, "Lora Fallback", Georgia, serif; --p-text: "Hanken Grotesk", "Hanken Grotesk Fallback", ui-sans-serif, system-ui, sans-serif; }
.oxx.is-clinic main :is(h1, h2) { font-weight: 400; letter-spacing: -.01em; }
.oxx main { font: 400 16px/1.6 var(--oxc-font); color: var(--oxc-body); -webkit-font-smoothing: antialiased; }
.oxx main p { color: inherit; }
@media (min-width: 768px) { .oxx main { font-size: 17px; } }
.oxx main :is(h1, h2, h3, p, ul, ol, figure, blockquote) { margin: 0; padding: 0; }
.oxx main :is(ul, ol) { list-style: none; }
.oxx main a { text-decoration: none; }
.oxx main img { display: block; max-width: 100%; height: auto; }
.oxx main :focus-visible { outline: 2px solid var(--oxc-brand); outline-offset: 2px; border-radius: 6px; }
.oxx main h2 { font: 400 clamp(1.625rem, 1.25rem + 1.6vw, 2.5rem)/1.16 var(--oh-serif); letter-spacing: -.01em; color: var(--oxc-navy); }
.oxx main h3 { font-family: var(--oxc-font); color: var(--oxc-ink); }

/* Antetul site-ului: o insulă albă peste fotografie; sigla rămâne pe alb, la cel puțin 160 px lățime */
.oxx .oxc-head { position: fixed; inset: 0 0 auto; padding: 8px 8px 0; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; border: 0; pointer-events: none; }
/* După prima derulare, o bară albă pe toată lățimea, lipită sus: pe secțiunile albe, textul paginii s-ar vedea pe lângă insulă */
.oxx .oxc-head[data-scrolled] { padding: 0; border: 0; background: #fff; box-shadow: 0 1px 0 var(--oxc-line), 0 12px 24px -22px rgb(13 35 64 / .45); }
.oxx .oxc-head[data-scrolled] .oxc-head-in { border-radius: 0; box-shadow: none; }
.oxx .oxc-head[data-scrolled] .oxc-mega { top: 100%; border-width: 1px 0 0; border-radius: 0 0 var(--oh-r) var(--oh-r); }
/* La derulare, antetul dispare de tot: fără fâșia de 2 px a antetului obișnuit și fără umbra lui peste pagină */
.oxx .oxc-head.is-away { transform: translateY(-100%); box-shadow: none; }
.oxx .oxc-head.is-away .oxc-head-in { box-shadow: none; }
.oxx .oxc-head-in { max-width: 1360px; padding: 0 8px 0 12px; border-radius: var(--oh-r); background: #fff; pointer-events: auto; box-shadow: 0 18px 40px -26px rgb(13 35 64 / .55), 0 0 0 1px rgb(13 35 64 / .04); }
.oxx .oxc-progress { display: none; }
.oxx .oxc-mega { left: 0; right: 0; }
@media (min-width: 1024px) { .oxx .oxc-palette { padding: calc(var(--oxc-head-h) + 20px) 16px 16px; } .oxx .oxc-palette-box { width: min(1440px, 100%); max-height: calc(100dvh - var(--oxc-head-h) - 36px); } }
@media (min-width: 1024px) { .oxx .oxc-head { padding: 12px 16px 0; } .oxx .oxc-head-in { padding: 0 10px 0 16px; } .oxx .oxc-top { font-family: var(--oxc-font); } .oxx .oxc-cta { border-radius: 10px; } }
@media (min-width: 1024px) and (max-width: 1199px) { .oxx .oxc-top { padding: 0 5px; } .oxx .oxc-logo { margin-right: 4px; } .oxx .oxc-actions { gap: 4px; } }


/* Butoane: dreptunghiuri discret rotunjite, săgeata într-un cerc */
.oxx .oh-btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 52px; padding: 6px 8px 6px 20px; border: 1px solid transparent; border-radius: 10px; font: 600 16px/1.25 var(--oxc-font); transition: background .15s, color .15s, border-color .15s; }
.oxx .oh-btn > svg:first-child { flex: none; margin: 0 -2px 0 -6px; }
.oxx .oh-btn:has(> svg:first-child) { justify-content: center; padding-right: 20px; }
.oxx .oh-go { display: inline-grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 8px; transition: transform .2s; }
.oxx .oh-btn:hover .oh-go { transform: translateX(2px); }
.oxx .oh-btn.is-navy { background: var(--oxc-navy); color: #fff; }
.oxx .oh-btn.is-navy .oh-go { background: rgb(255 255 255 / .12); }
.oxx .oh-btn.is-navy:hover { background: var(--oxc-blue); }
.oxx .oh-btn.is-light { background: #fff; color: var(--oxc-navy); }
.oxx .oh-btn.is-light .oh-go { background: var(--oxc-navy); color: #fff; }
.oxx .oh-btn.is-light:hover { background: var(--oxc-tint); }
.oxx .oh-btn.is-glass { background: rgb(255 255 255 / .08); border-color: rgb(255 255 255 / .34); color: #fff; }
.oxx .oh-btn.is-glass .oh-go { background: rgb(255 255 255 / .12); }
.oxx .oh-btn.is-glass:hover { background: rgb(255 255 255 / .16); }
.oxx .oh-btn.is-line { background: #fff; border-color: var(--oxc-line-2); color: var(--oxc-navy); }
.oxx .oh-btn.is-line .oh-go { background: var(--oxc-tint); }
.oxx .oh-btn.is-line:hover { border-color: var(--oxc-navy); }
.oxx .oh-more { display: inline-flex; align-items: center; gap: 4px; font-size: .94em; font-weight: 600; color: var(--oxc-navy); }
.oxx .oh-more .oh-go { width: 26px; height: 26px; }
.oxx .oh-more:hover .oh-go { transform: translateX(3px); }
.oxx .oh-ic { display: inline-grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 10px; background: var(--oxc-tint); color: var(--oxc-navy); }
.oxx .oh-where { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; }
.oxx .oh-stars { display: inline-flex; gap: 2px; color: var(--oh-gold); }
.oxx .oh-stars svg { display: block; fill: currentColor; stroke: none; }
.oxx .oh-stars i { display: block; opacity: .35; }
.oxx .oh-stars i.is-on { opacity: 1; }
.oxx .oh-tel { display: inline-flex; align-items: center; gap: 10px; font: 400 clamp(1.3rem, 1.15rem + .6vw, 1.6rem)/1.2 var(--oh-serif); color: var(--oxc-navy); white-space: nowrap; }
.oxx .oh-tel svg { color: var(--oh-gold-d); }

/* Listele cu căutare (directorul de specialități, echipa): firul de navigare și reperele din antet, caseta cu căutarea și filtrele */
.oxx .os-crumbs ol { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-bottom: 8px; font-size: 13.5px; font-weight: 500; }
.oxx .os-crumbs li { display: inline-flex; align-items: center; gap: 8px; color: #c4cfde; }
.oxx .os-crumbs li + li::before { content: ""; width: 5px; height: 5px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; opacity: .6; transform: rotate(45deg); }
.oxx .os-crumbs a { color: #fff; }
.oxx .os-crumbs a:hover { text-decoration: underline; text-underline-offset: 3px; }
.oxx .os-numbers { display: none; }
.oxx .os-finder { display: grid; gap: 12px; padding: 12px; border-radius: var(--oh-r); background: #fff; box-shadow: 0 30px 60px -36px rgb(13 35 64 / .5), 0 0 0 1px rgb(13 35 64 / .05); }
.oxx .os-q { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 0 12px; border: 1px solid var(--oxc-line-2); border-radius: 10px; color: var(--oxc-navy); transition: border-color .15s, box-shadow .15s; }
.oxx .os-q > svg { flex: none; }
.oxx .os-q:focus-within { border-color: var(--oxc-navy); box-shadow: 0 0 0 1px var(--oxc-navy); }
.oxx .os-q input { flex: 1; min-width: 0; height: 52px; padding: 0; border: 0; background: none; font: 400 16px/1.2 var(--oxc-font); color: var(--oxc-ink); }
.oxx .os-q input::placeholder { color: var(--oxc-mute); opacity: 1; }
.oxx.oxx .os-q input:focus-visible { outline: 0; box-shadow: none; border-radius: 0; }
.oxx .os-filters { display: grid; gap: 8px; }
.oxx .os-seg { display: grid; grid-template-columns: 54px minmax(0, 1fr); align-items: center; gap: 6px; }
.oxx .os-seg > span { font-size: 13.5px; font-weight: 600; color: var(--oxc-mute); }
.oxx .os-seg > div { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2px; padding: 3px; border-radius: 10px; background: var(--oxc-soft); box-shadow: inset 0 0 0 1px var(--oxc-line); }
.oxx .os-seg button { min-height: 40px; padding: 0 6px; border: 0; border-radius: 8px; background: none; font: 600 14px/1.2 var(--oxc-font); color: var(--oxc-ink); cursor: pointer; transition: background .15s, color .15s; }
.oxx .os-seg button:hover { background: var(--oxc-tint); }
.oxx .os-seg button[aria-pressed="true"] { background: var(--oxc-navy); color: #fff; }
.oxx .os-count { font-size: 14px; line-height: 1.3; color: var(--oxc-mute); }
@media (min-width: 768px) {
  .oxx .os-numbers { flex: none; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); border: 1px solid rgb(255 255 255 / .2); border-radius: var(--oh-r); background: rgb(13 35 64 / .5); -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2); overflow: hidden; }
  .oxx .os-numbers li + li { border-left: 1px solid rgb(255 255 255 / .16); }
  .oxx .os-numbers a { display: block; padding: 14px 18px 12px; font-size: 13.5px; line-height: 1.3; color: #d9e2ee; white-space: nowrap; transition: background .15s; }
  .oxx .os-numbers a:hover { background: rgb(255 255 255 / .07); }
  .oxx .os-numbers b { display: block; margin-bottom: 6px; font: 400 1.75rem/1 var(--oh-serif); color: #fff; }
  .oxx .os-finder { grid-template-columns: minmax(0, 1fr) auto; gap: 12px 20px; align-items: center; padding: 16px; }
  .oxx .os-q { grid-column: 1 / -1; min-height: 58px; }
  .oxx .os-filters { display: flex; flex-wrap: wrap; gap: 8px 24px; }
  .oxx .os-seg { grid-template-columns: 54px auto; gap: 10px; }
  .oxx .os-seg button { padding: 0 14px; }
}
@media (min-width: 1024px) {
  .oxx .os-seg { grid-template-columns: auto auto; }
}

/* Cartonașul unui medic: portretul, cu numele și rolul pe un voal care coboară în bleumarin; numărul care închide o grilă */
.oxx .ot-doc { position: relative; isolation: isolate; display: flex; align-items: flex-end; width: 100%; aspect-ratio: 4 / 5; border-radius: 12px; overflow: hidden; background: var(--oxc-blue); color: #fff; }
.oxx .ot-doc figure { position: absolute; inset: 0; z-index: -2; }
.oxx .ot-doc img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 8%; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.oxx .ot-doc:hover img { transform: scale(1.03); }
/* O fotografie lată, cu o scenă întreagă, nu un portret: apropiată de persoană, la aceeași scară cu portretele, fără sigla din fundal */
.oxx .is-scene img { transform: scale(1.6); transform-origin: 50% 12%; }
.oxx .ot-doc:hover .is-scene img { transform: scale(1.64); }
.oxx .ot-doc::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, #0d2340 14%, rgb(13 35 64 / .86) 36%, rgb(13 35 64 / 0) 62%); }
.oxx .ot-doc-txt { display: grid; gap: 3px; justify-items: start; padding: 10px 12px 12px; }
.oxx .ot-doc h3 { font: 400 clamp(1.02rem, .95rem + .35vw, 1.22rem)/1.2 var(--oh-serif); color: #fff; }
.oxx .ot-doc p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; font-size: 13px; line-height: 1.3; color: #d9e2ee; }
.oxx .ot-doc p::first-letter { text-transform: uppercase; }
.oxx .ot-mono { display: grid; place-items: center; width: 100%; height: 100%; padding-bottom: 30%; background: var(--oxc-blue); color: #d9bd8f; font: 400 2.4rem/1 var(--oh-serif); }
.oxx .ot-more a { display: flex; flex-direction: column; align-items: flex-start; width: 100%; aspect-ratio: 4 / 5; padding: 14px; border: 1px solid rgb(255 255 255 / .22); border-radius: 12px; color: #fff; transition: background .15s; }
.oxx .ot-more a:hover { background: rgb(255 255 255 / .08); }
.oxx .ot-more b { font: 400 2.5rem/1 var(--oh-serif); }
.oxx .ot-more span { margin-top: 4px; font-size: 14px; line-height: 1.3; color: #c4cfde; }
.oxx .ot-more .oh-go { margin-top: auto; background: #fff; color: var(--oxc-navy); }
@media (min-width: 640px) { .oxx .ot-doc p { font-size: 13.5px; } }

/* Clipurile (site.js, [data-player]) */
.oxx .oh-stories { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.oxx .oh-story { position: relative; display: flex; align-items: flex-end; aspect-ratio: 9 / 14; border-radius: 12px; overflow: hidden; background: var(--oxc-navy); color: #fff; isolation: isolate; }
.oxx .oh-story figure { position: absolute; inset: 0; z-index: -2; }
.oxx .oh-story img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.oxx .oh-story:hover img { transform: scale(1.03); }
.oxx .oh-story::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgb(13 35 64 / .92), rgb(13 35 64 / 0) 58%); }
.oxx .oh-story b { padding: 12px; font-size: 14.5px; font-weight: 600; line-height: 1.3; }
.oxx .oh-play { position: absolute; top: 10px; left: 10px; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgb(255 255 255 / .94); color: var(--oxc-navy); }
.oxx .oh-play svg { fill: currentColor; margin-left: 2px; }
@media (min-width: 640px) { .oxx .oh-stories { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } }
@media (min-width: 1100px) { .oxx .oh-stories { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.oxx .oh-player { position: fixed; inset: 0; width: min(420px, 92vw); height: fit-content; max-width: none; max-height: none; margin: auto; padding: 0; border: 0; background: transparent; overflow: visible; }
.oxx .oh-player::backdrop { background: rgb(13 35 64 / .84); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.oxx .oh-player-box { position: relative; border-radius: var(--oh-r); overflow: hidden; background: #000; }
.oxx .oh-player video { display: block; width: 100%; max-height: 80vh; aspect-ratio: 9 / 16; background: #000; }
.oxx .oh-player-x { position: absolute; top: 10px; right: 10px; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgb(255 255 255 / .94); color: var(--oxc-navy); cursor: pointer; }
.oxx .oh-player [data-player-title] { padding: 12px 16px; background: var(--oxc-navy); color: #fff; font: 600 15px/1.4 var(--oxc-font); }

@media (prefers-reduced-motion: reduce) { .oxx main * { transition: none !important; } }