/* ============================================================================
   Chicopet · stilurile paginii
   Motorul (scrollcraft.css / .js) rămâne neatins. Aici sunt doar tokenii mărcii
   și markup-ul propriu al paginii.

   Cromatica: bleumarin, crem și chihlimbar, cerută de proprietar după referința
   Vetricare. Albastrul butoanelor este cel al crucii din sigla Chicopet.
   ========================================================================== */

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

/* ------------------------------------------------------------------- tokeni */
:root {
  --sc-canvas:     #F5F0E6;   /* crem */
  --sc-surface:    #FFFFFF;
  --sc-ink:        #101820;
  --sc-ink-soft:   #46535F;
  --sc-accent:     #124E8C;   /* albastrul crucii din siglă: butoane și legături pe fond deschis */
  --sc-accent-ink: #FFFFFF;
  --sc-font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --sc-font-text:    "Figtree Variable", "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;

  --brand-deep: #0C3A6B;
  --amber:      #E2A44C;      /* chihlimbar: accentul pe fond închis */
  --amber-hi:   #EDB766;
  --amber-soft: #F2D7A8;
  --amber-ink:  #1B1307;
  --dark:       #0A1B2C;      /* bleumarin */
  --dark-card:  #132D44;
  --mist:       #E9EEF4;
  --paw:        #D2332E;

  --focus: var(--sc-accent);
  --em:    var(--sc-accent);

  /* diacriticele (Ș, Ț, Â, Î) au nevoie de aer între rânduri */
  --sc-leading-none: 1.05;
  --sc-leading-tight: 1.12;
  --sc-track-tight: -0.022em;
  --sc-track-snug: -0.015em;

  /* pe pânză deschisă: umbre slabe, tentate spre bleumarin, muchie albă */
  --sc-shadow-color: 212 60% 16%;
  --sc-e1: 0 1px 2px hsl(var(--sc-shadow-color) / 0.07), 0 2px 8px -2px hsl(var(--sc-shadow-color) / 0.10);
  --sc-e2: 0 2px 4px hsl(var(--sc-shadow-color) / 0.07), 0 10px 24px -8px hsl(var(--sc-shadow-color) / 0.18);
  --sc-e3: 0 4px 10px hsl(var(--sc-shadow-color) / 0.08), 0 24px 54px -16px hsl(var(--sc-shadow-color) / 0.30);
  --sc-edge: inset 0 1px 0 rgb(255 255 255 / 0.7);

  --sc-r-sm: 8px; --sc-r-md: 14px; --sc-r-lg: 24px;
  --sc-maxw: 78rem;
  --bar-h: 3.5rem;
  --dock-h: 5rem;
}

/* Secțiunile închise își redefinesc cerneala. `color` se repetă odată cu tokenul,
   altfel textul moștenește cerneala calculată pe <body>. */
.on-dark {
  --sc-ink: #F6F1E7;
  --sc-ink-soft: #B8C4D0;
  --sc-hairline: rgb(255 255 255 / 0.14);
  --sc-hairline-strong: rgb(255 255 255 / 0.24);
  --focus: var(--amber);
  --em: var(--amber);
  color: var(--sc-ink);
}

html { scroll-padding-top: 5.75rem; background: var(--dark); }
body { min-width: 320px; }
h1, h2, h3, p, ul, ol, dl, dd, figure, address { margin: 0; }
ul, ol { padding: 0; list-style: none; }
address { font-style: normal; }
button { border: 0; background: none; padding: 0; cursor: pointer; }
a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline-color: var(--focus); }

.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}
.skip {
  position: fixed; z-index: 100; top: 0.5rem; left: 0.5rem;
  padding: 0.75rem 1rem; border-radius: var(--sc-r-md);
  background: var(--dark); color: #fff; text-decoration: none;
  transform: translateY(-200%);
}
.skip:focus-visible { transform: none; outline-color: var(--amber); }

.ico {
  width: 1.25em; height: 1.25em; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}

/* Fără JS, conținutul nu așteaptă nimic ca să apară. */
.no-js [data-sc-in], .no-js [data-sc-stagger] > *, .no-js [data-sc-cue] { opacity: 1; transform: none; }

/* titlurile: serif, cu un cuvânt-accent în italic */
.sc-display { font-weight: 400; }
.sc-display--lg { font-size: clamp(2.15rem, 1.4rem + 3vw, 3.75rem); }
.sc-display em, .hero__title em { font-style: italic; font-weight: 400; color: var(--em); }
.sc-body { font-size: var(--sc-t-base); }

.label {
  font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--sc-ink-soft);
}
.link {
  display: inline-flex; align-items: center; gap: 0.5rem;
  min-height: 2.75rem; color: var(--sc-ink); font-weight: 600;
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.28em;
  text-decoration-color: var(--em);
}
@media (hover: hover) and (pointer: fine) { .link:hover { color: var(--em); } }

/* ------------------------------------------------------------------ butoane */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
  min-height: 3rem; padding: 0.7rem 1.3rem;
  border-radius: var(--sc-r-pill);
  font-weight: 650; font-size: var(--sc-t-base); line-height: 1.2; letter-spacing: -0.005em;
  text-decoration: none; white-space: nowrap;
  transition: transform 140ms var(--sc-ease-out), background-color 160ms var(--sc-ease-out), box-shadow 160ms var(--sc-ease-out);
}
.btn--primary {
  background: var(--sc-accent); color: var(--sc-accent-ink);
  box-shadow: var(--sc-e2), inset 0 1px 0 rgb(255 255 255 / 0.2);
}
/* pe fond închis, butonul de programare este chihlimbariu */
.btn--amber {
  background: var(--amber); color: var(--amber-ink);
  box-shadow: 0 12px 30px -12px rgb(226 164 76 / 0.55), inset 0 1px 0 rgb(255 255 255 / 0.4);
}
.btn--sm { min-height: 2.75rem; padding: 0.5rem 1.1rem; font-size: var(--sc-t-sm); }
.btn--lg { min-height: 3.6rem; padding: 0.95rem 1.7rem; font-size: clamp(1rem, 0.94rem + 0.3vw, 1.15rem); }
.btn .ico { transition: transform 200ms var(--sc-ease-out); }
@media (hover: hover) and (pointer: fine) {
  .btn--primary:hover { background: var(--brand-deep); transform: translateY(-1px); box-shadow: var(--sc-e3), inset 0 1px 0 rgb(255 255 255 / 0.2); }
  .btn--amber:hover { background: var(--amber-hi); transform: translateY(-1px); box-shadow: 0 16px 36px -12px rgb(226 164 76 / 0.7), inset 0 1px 0 rgb(255 255 255 / 0.45); }
  .btn:hover .ico { transform: rotate(-10deg); }
}
.btn:active { transform: scale(0.97); }
.btn:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: var(--sc-r-pill); }

.round {
  display: inline-grid; place-items: center; width: 3rem; height: 3rem; flex: none;
  border-radius: 50%; background: var(--sc-surface); color: #101820;
  box-shadow: var(--sc-e1), inset 0 0 0 1px rgb(16 24 32 / 0.16);
  transition: transform 140ms var(--sc-ease-out), background-color 160ms var(--sc-ease-out), opacity 160ms;
}
.round--primary { background: var(--sc-accent); color: #fff; box-shadow: var(--sc-e2); }
.round:active { transform: scale(0.94); }
.round:disabled { opacity: 0.38; cursor: default; box-shadow: inset 0 0 0 1px rgb(16 24 32 / 0.1); }
.round:focus-visible { border-radius: 50%; }
@media (hover: hover) and (pointer: fine) {
  .round:not(:disabled):hover { background: var(--mist); }
  .round--primary:not(:disabled):hover { background: var(--brand-deep); }
}

/* numărul de telefon ca text mare, lângă buton */
.tel { display: inline-flex; flex-direction: column; justify-content: center; min-height: 3rem; text-decoration: none; }
.tel__label { font-size: var(--sc-t-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--sc-ink-soft); font-weight: 600; }
.tel__num {
  font-family: var(--sc-font-display); font-weight: 400; font-size: clamp(1.6rem, 1.3rem + 1.1vw, 2.1rem);
  line-height: 1.1; letter-spacing: -0.01em; font-variant-numeric: lining-nums tabular-nums; color: var(--sc-ink);
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.2em;
  text-decoration-color: var(--em);
}
@media (hover: hover) and (pointer: fine) { .tel:hover .tel__num { color: var(--em); } }

/* ---------------------------------------------------------- bara de sus -- */
.bar {
  position: fixed; z-index: var(--sc-z-chrome);
  top: max(0.75rem, env(safe-area-inset-top));
  left: 50%; translate: -50% 0;
  width: min(100% - 1.5rem, 76rem);
  min-height: var(--bar-h);
  display: flex; align-items: center; gap: var(--sc-4);
  padding: 0.4rem 0.45rem 0.4rem 1rem;
  background: rgb(255 255 255 / 0.96);
  border-radius: var(--sc-r-pill);
  box-shadow: var(--sc-e2), inset 0 0 0 1px var(--sc-hairline);
}
.bar__brand { display: inline-flex; align-items: center; gap: 0.55rem; min-height: 2.75rem; text-decoration: none; }
.mark { width: 1.9rem; height: 1.9rem; flex: none; }
.mark__cross { fill: var(--sc-accent); }
.mark__paw { fill: var(--paw); stroke: #fff; stroke-width: 0.9; paint-order: stroke; }
.bar__name { font-family: var(--sc-font-display); font-weight: 400; font-size: 1.4rem; letter-spacing: -0.015em; }
.bar__nav { display: flex; gap: 0.15rem; margin-inline: auto; }
.bar__nav a {
  position: relative; display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 0.85rem;
  border-radius: var(--sc-r-pill); text-decoration: none; font-weight: 550; font-size: var(--sc-t-sm);
  color: var(--sc-ink-soft); transition: color 160ms var(--sc-ease-out), background-color 160ms var(--sc-ease-out);
}
.bar__nav a[aria-current="true"] { color: var(--sc-ink); background: var(--mist); }
@media (hover: hover) and (pointer: fine) { .bar__nav a:hover { color: var(--sc-ink); } }
.bar__tel {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 0.4rem;
  font-weight: 650; font-size: 1.02rem; font-variant-numeric: tabular-nums;
  text-decoration: none; white-space: nowrap;
}
@media (hover: hover) and (pointer: fine) { .bar__tel:hover { color: var(--sc-accent); } }

.menu { display: none; margin-left: auto; }
.menu__toggle {
  display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; padding: 0 1rem;
  border-radius: var(--sc-r-pill); background: var(--mist); font-weight: 600; font-size: var(--sc-t-sm);
  cursor: pointer; list-style: none; user-select: none;
}
.menu__toggle::-webkit-details-marker { display: none; }
.menu__toggle svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.menu__sheet {
  position: absolute; top: calc(100% + 0.5rem); left: 0; right: 0;
  display: grid; gap: 0.25rem; padding: 0.75rem;
  background: var(--sc-surface); border-radius: var(--sc-r-lg);
  box-shadow: var(--sc-e3), inset 0 0 0 1px var(--sc-hairline);
}
.menu__sheet nav { display: grid; }
.menu__sheet a {
  display: flex; align-items: center; min-height: 3rem; padding: 0 0.9rem; border-radius: var(--sc-r-md);
  text-decoration: none; font-weight: 600; font-size: 1.05rem;
}
.menu__sheet nav a + a { border-top: 1px solid var(--sc-hairline); border-radius: 0; }
.menu__tel { margin-top: 0.5rem; background: var(--sc-accent); color: #fff; justify-content: center; }
.menu__route { justify-content: center; background: var(--mist); }

@media (max-width: 960px) { .bar__tel { display: none; } }
@media (max-width: 860px) {
  .bar { padding-left: 0.85rem; }
  .bar__nav, .bar__cta { display: none; }
  .menu { display: block; }
}

/* ---------------------------------------------------------------- 1 · hero
   Fotografia sălii de consultații sub un văl bleumarin, cei doi prieteni desenați în
   contur deschis, apoi textul. Trei planuri care se mișcă diferit la derulare. */
.hero {
  position: relative; isolation: isolate; overflow: clip;
  min-height: 100vh; min-height: 100svh;
  display: grid; grid-template-rows: 1fr auto;
  padding-top: 6rem;
  background: var(--dark);
}
.hero__photo { position: absolute; z-index: -3; inset: -14% 0 -4% 0; }
.hero__photo picture, .hero__photo img { display: block; width: 100%; height: 100%; }
.hero__photo img, .hero__clip { object-fit: cover; object-position: 22% 55%; }
/* clipul stă peste fotografie și apare abia când are primul cadru */
.hero__clip { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 500ms linear; }
.hero__clip.is-on { opacity: 1; }
.hero__shade {
  position: absolute; z-index: -2; inset: 0;
  /* vălul este dens doar unde stă textul; spre dreapta cățelul rămâne la vedere */
  background:
    linear-gradient(90deg, rgb(10 27 44 / 0.95) 0%, rgb(10 27 44 / 0.9) 36%, rgb(10 27 44 / 0.62) 52%, rgb(10 27 44 / 0.3) 68%, rgb(10 27 44 / 0.3) 100%),
    linear-gradient(0deg, rgb(10 27 44 / 0.86) 0%, rgb(10 27 44 / 0) 34%),
    linear-gradient(180deg, rgb(10 27 44 / 0.6) 0%, rgb(10 27 44 / 0) 22%);
}
.hero__pets {
  position: absolute; z-index: -1; pointer-events: none;
  right: 2.5vw; bottom: 5.6rem;
  width: min(19vw, 18rem);
  opacity: 0.9;
}
.hero__copy { align-self: center; display: grid; justify-items: start; padding-block: 1.5rem 2.5rem; }
.hero__copy > * { max-width: min(39rem, 54vw); }
.hero__copy > .hero__title { max-width: none; }
.hero__brand { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 1rem; }
.hero__brand strong { font-family: var(--sc-font-display); font-weight: 400; font-size: 1.7rem; letter-spacing: -0.015em; line-height: 1.1; }
.hero__brand span { font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber-soft); }
.hero__title {
  margin-top: var(--sc-5);
  font-family: var(--sc-font-display); font-weight: 400;
  font-size: clamp(3.1rem, 1.5rem + 5.4vw, 6.4rem); line-height: 1; letter-spacing: -0.032em;
}
.hero__title em { display: block; white-space: nowrap; }
.hero__lede { margin-top: var(--sc-5); font-size: var(--sc-t-lg); line-height: 1.5; color: rgb(246 241 231 / 0.9); text-wrap: pretty; }
.hero__cta { margin-top: var(--sc-6); display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.75rem; }
.hero__note { margin-top: var(--sc-4); font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }

.hero__facts-wrap { padding-bottom: 1.6rem; }
.hero__facts {
  display: grid; grid-template-columns: repeat(3, max-content); gap: 0.25rem clamp(2rem, 5vw, 4.5rem);
  padding-top: 1.1rem; border-top: 1px solid rgb(255 255 255 / 0.18);
}
.hero__facts dt { font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber-soft); }
.hero__facts dd { margin-top: 0.2rem; font-weight: 550; }

@media (max-width: 860px) {
  /* Compoziție separată pentru telefon: textul sus, desenul jos, peste podeaua recepției. */
  .hero { grid-template-rows: auto; padding-top: 5.5rem; padding-bottom: calc(60vw + 0.5rem); }
  /* pe telefon fotografia ocupă doar partea de jos, la formatul ei, 16:9 */
  .hero__photo { inset: auto 0 0 0; height: 66vw; }
  .hero__photo img, .hero__clip { object-position: 64% 50%; }
  .hero__shade {
    background: radial-gradient(ellipse 62% 30vw at 14% 100%, rgb(10 27 44 / 0.62), rgb(10 27 44 / 0) 100%), linear-gradient(180deg, rgb(10 27 44) 0%, rgb(10 27 44) calc(100% - 66vw), rgb(10 27 44 / 0.5) calc(100% - 50vw), rgb(10 27 44 / 0.12) calc(100% - 30vw), rgb(10 27 44 / 0.3) 100%);
  }
  .hero__copy { align-self: start; padding-block: 0.5rem 0; }
  .hero__copy > * { max-width: none; }
  .hero__pets { right: auto; left: 3vw; bottom: 2vw; width: 40vw; opacity: 0.9; }
  .hero__facts-wrap { display: none; }
  .hero__brand strong { font-size: 1.5rem; }
  .hero__title { margin-top: var(--sc-4); font-size: clamp(2.4rem, 12.2vw, 4.2rem); }
  .hero__title em { white-space: normal; }
  .hero__lede { margin-top: var(--sc-4); font-size: 1.08rem; }
  .hero__cta { margin-top: var(--sc-5); gap: 0.85rem; width: 100%; }
  .hero__cta .btn { width: 100%; }
}
@media (max-width: 360px) {
  .book { padding: 1.1rem; }
  .book .btn { padding-inline: 0.6rem; gap: 0.45rem; font-size: 0.95rem; }
  .btn--lg { padding-inline: 1rem; font-size: 1rem; }
  .hero__lede { font-size: 1rem; }
  .hero__brand span { letter-spacing: 0.1em; }
}

/* ---- prietenii desenați: straturi peste aceeași pânză ---- */
.pets { position: relative; width: 100%; aspect-ratio: 2276 / 1353; }
.pets__part { position: absolute; height: auto; max-width: none; user-select: none; -webkit-user-drag: none; }
/* pe fond închis, același contur devine deschis */
.pets--light .pets__part { filter: brightness(0) invert(1); }
.pets__head, .pets__face { position: absolute; inset: 0; }
.pets__head {
  transform-origin: var(--ox) var(--oy);
  transform: skewX(var(--k, 0deg)) scaleY(var(--s, 1));
}
.pets__face { transform: translate3d(var(--fx, 0px), var(--fy, 0px), 0); }
.pets__eye { translate: var(--ex, 0px) var(--ey, 0px); }
.motion .pets__head, .motion .pets__face, .motion .pets__eye { will-change: transform; }
.motion .pets__eye { animation: clipire 6.8s infinite; }
.motion .pets__head[data-animal="pisica"] .pets__eye { animation-delay: -2.9s; animation-duration: 8.2s; }
@keyframes clipire {
  0%, 93.5%, 100% { scale: 1 1; }
  96.5% { scale: 1 0.1; }
}

/* ------------------------------------------------------------ 2 · servicii */
.eyebrow {
  font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--em);
}

/* banda cu ce facem: decor care curge doar când mișcarea este permisă */
.ribbon { overflow: hidden; background: var(--sc-accent); color: #F6F1E7; padding-block: clamp(1.1rem, 2.4vw, 2rem); }
.ribbon__track { display: flex; width: max-content; }
.ribbon__track span {
  display: inline-flex; align-items: center; white-space: nowrap;
  font-family: var(--sc-font-display); font-style: italic; font-weight: 400;
  font-size: clamp(1.5rem, 1rem + 2.4vw, 3rem); line-height: 1.2; letter-spacing: -0.015em;
}
.ribbon__track span::after {
  content: ""; width: 0.36em; height: 0.36em; margin-inline: clamp(1.1rem, 2.6vw, 2.4rem);
  background: var(--amber); rotate: 45deg; border-radius: 2px;
}
.motion .ribbon__track { animation: banda 46s linear infinite; }
@keyframes banda { to { transform: translateX(-50%); } }

.services { --sand: #EFE7D8; background: var(--sand); }
.services__head { max-width: 46rem; }
.services__list { margin-top: clamp(3rem, 6vw, 5.5rem); display: grid; gap: clamp(3.5rem, 7vw, 6.5rem); }

.svc {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr) auto;
  gap: clamp(1.5rem, 4vw, 4.5rem); align-items: center;
}
.svc:nth-child(even) { grid-template-columns: auto minmax(0, 6fr) minmax(0, 5fr); }
.svc:nth-child(even) .svc__photo { order: 3; }
.svc:nth-child(even) .svc__n { order: 1; }
.svc:nth-child(even) .svc__body { order: 2; }

.svc__photo {
  position: relative; overflow: hidden; aspect-ratio: 5 / 4;
  border-radius: var(--sc-r-lg); background: var(--mist); box-shadow: var(--sc-e3);
}
.svc__photo img { width: 100%; height: 100%; object-fit: cover; }
.svc__photo figcaption {
  position: absolute; left: 0.9rem; bottom: 0.9rem; max-width: calc(100% - 1.8rem);
  padding: 0.5rem 0.8rem; border-radius: 6px;
  background: rgb(10 27 44 / 0.88); color: #F6F1E7;
  font-size: 0.72rem; font-weight: 650; letter-spacing: 0.14em; text-transform: uppercase; line-height: 1.35;
}
.svc__body h3 {
  font-family: var(--sc-font-display); font-weight: 400;
  font-size: clamp(1.9rem, 1.2rem + 2.3vw, 3.1rem); line-height: 1.08; letter-spacing: -0.022em;
}
.svc__body h3 em { display: block; color: var(--sc-accent); }
.svc__desc { margin-top: 1rem; max-width: 46ch; color: var(--sc-ink-soft); line-height: 1.6; text-wrap: pretty; }
.svc__list { margin-top: 1.4rem; max-width: 30rem; }
.svc__list li { padding-block: 0.7rem; border-top: 1px solid rgb(16 24 32 / 0.16); font-weight: 550; }
.svc__list li:last-child { border-bottom: 1px solid rgb(16 24 32 / 0.16); }
.svc__more {
  margin-top: 0.9rem; display: inline-flex; align-items: center; gap: 0.45rem; min-height: 2.75rem;
  color: var(--sc-accent); font-size: var(--sc-t-xs); font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  text-decoration: none; white-space: nowrap;
}
.svc__more span { border-bottom: 1px solid currentColor; padding-bottom: 0.15rem; }
.svc__more .ico { transition: transform 180ms var(--sc-ease-out); }
@media (hover: hover) and (pointer: fine) { .svc__more:hover .ico { transform: translateX(4px); } }
.svc__n {
  font-family: var(--sc-font-display); font-weight: 400; line-height: 0.9; letter-spacing: -0.04em;
  font-size: clamp(4.5rem, 2rem + 8vw, 9rem); font-variant-numeric: lining-nums;
  color: var(--sc-accent);
}
@supports (-webkit-text-stroke: 1px black) {
  .svc__n { color: transparent; -webkit-text-stroke: 1.5px var(--sc-accent); }
}

/* cardul de programare încheie lista */
.book {
  margin-top: clamp(3.5rem, 7vw, 6.5rem);
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 2rem clamp(2rem, 5vw, 5rem); align-items: center;
  padding: clamp(1.5rem, 3.4vw, 3.25rem);
  background: var(--dark); border-radius: var(--sc-r-lg); box-shadow: var(--sc-e3);
}
.book__main { display: grid; justify-items: start; min-width: 0; }
.book__label { font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber-soft); }
.book__tel {
  margin-top: 0.35rem; display: inline-flex; align-items: center; min-height: 3rem;
  font-family: var(--sc-font-display); font-weight: 400; font-size: clamp(2rem, 1.4rem + 2.2vw, 3.25rem);
  letter-spacing: -0.015em; font-variant-numeric: lining-nums; text-decoration: none; white-space: nowrap;
}
.book__note { margin-top: 0.5rem; max-width: 34ch; color: var(--sc-ink-soft); line-height: 1.5; }
.book .btn { margin-top: 1.25rem; }
.book__facts { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(1.5rem, 3vw, 3rem); }
.book__facts > div { padding-block: 1rem; border-top: 1px solid var(--sc-hairline); }
.book__facts dt { font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber-soft); }
.book__facts dd { margin-top: 0.3rem; line-height: 1.5; }

@media (max-width: 860px) {
  .svc, .svc:nth-child(even) { grid-template-columns: minmax(0, 1fr); gap: 1.1rem; }
  .svc .svc__photo, .svc:nth-child(even) .svc__photo { order: 1; }
  .svc .svc__n, .svc:nth-child(even) .svc__n { order: 2; font-size: 3.4rem; margin-top: 0.4rem; }
  .svc .svc__body, .svc:nth-child(even) .svc__body { order: 3; }
  .svc__body h3 em { display: inline; }
  .svc__list { max-width: none; }
  .book { grid-template-columns: minmax(0, 1fr); }
  .book .btn { width: 100%; }
  .book__facts { grid-template-columns: minmax(0, 1fr); }
}

/* ------------------------------------------------------ întrebări frecvente */
.faq { background: #FAF6EF; }
.faq__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 2.5rem clamp(2rem, 6vw, 6rem); align-items: start; }
.faq__head { position: sticky; top: 6.5rem; }
.faq__head em { display: block; color: var(--sc-accent); }
.faq__list { border-bottom: 1px solid rgb(16 24 32 / 0.16); }
.q { border-top: 1px solid rgb(16 24 32 / 0.16); }
.q summary {
  display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) 1.5rem; align-items: center; gap: 0.75rem;
  min-height: 4rem; padding-block: 0.9rem; cursor: pointer; list-style: none;
}
.q summary::-webkit-details-marker { display: none; }
.q__n { font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.1em; color: var(--sc-accent); font-variant-numeric: tabular-nums; }
.q__t { font-family: var(--sc-font-display); font-weight: 400; font-size: clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem); line-height: 1.25; letter-spacing: -0.012em; }
.q__ico { width: 1.25rem; height: 1.25rem; color: var(--sc-accent); transition: rotate 200ms var(--sc-ease-out); }
.q[open] .q__ico { rotate: 45deg; }
.q > p { padding: 0 2.25rem 1.4rem 3rem; max-width: 60ch; color: var(--sc-ink-soft); line-height: 1.6; text-wrap: pretty; }
.q summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 6px; }
@media (hover: hover) and (pointer: fine) { .q summary:hover .q__t { color: var(--sc-accent); } }
@media (max-width: 860px) {
  .faq__grid { grid-template-columns: minmax(0, 1fr); }
  .faq__head { position: static; }
  .faq__head em { display: inline; }
  .q summary { grid-template-columns: 1.9rem minmax(0, 1fr) 1.25rem; gap: 0.6rem; }
  .q > p { padding: 0 0 1.25rem 2.5rem; }
}

/* -------------------------------------------------------------- 3 · vizita */
.visit { background: var(--sc-surface); }
.visit__stage { display: grid; align-items: center; padding-block: var(--sc-section); }
.visit__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.steps { margin-top: var(--sc-6); display: grid; gap: 0; }
.step {
  position: relative; padding: 0 0 1.15rem 2.6rem;
  /* --on: 0 sau 1, după cât a înaintat actul. Fără motor (--sc-p lipsă), toți pașii sunt aprinși. */
  --on: clamp(0, (var(--sc-p, 1) - var(--at) + 0.02) * 40, 1);
}
/* fără act fixat (mișcare redusă, ecrane scunde), toți pașii sunt aprinși de la început */
.visit:not(.is-pinned) .step { --on: 1; }
.step::before {              /* firul dintre pași */
  content: ""; position: absolute; left: 0.68rem; top: 1.5rem; bottom: -0.15rem; width: 2px;
  background: var(--sc-hairline-strong);
}
.step:last-child { padding-bottom: 0; }
.step:last-child::before { display: none; }
.step::after {               /* punctul pasului */
  content: ""; position: absolute; left: 0; top: 0.2rem; width: 1.45rem; height: 1.45rem; border-radius: 50%;
  background: color-mix(in oklab, var(--sc-accent) calc(var(--on) * 100%), var(--sc-surface));
  box-shadow: inset 0 0 0 2px color-mix(in oklab, var(--sc-accent) calc(40% + var(--on) * 60%), var(--sc-surface));
  transition: background-color 240ms var(--sc-ease-out), box-shadow 240ms var(--sc-ease-out);
}
.step h3 {
  font-weight: 650; font-size: var(--sc-t-lg); line-height: 1.25; letter-spacing: -0.012em;
  color: color-mix(in oklab, var(--sc-ink) calc(var(--on) * 100%), var(--sc-ink-soft));
  transition: color 240ms var(--sc-ease-out);
}
.step p { margin-top: 0.3rem; color: var(--sc-ink-soft); max-width: 44ch; text-wrap: pretty; }
.inline-tel { color: var(--sc-ink); font-weight: 650; white-space: nowrap; text-decoration-thickness: 1.5px; }

.visit__frame { display: grid; gap: 0.85rem; justify-items: start; }
.visit__media {
  position: relative; width: 100%; aspect-ratio: 4 / 5; overflow: hidden;
  border-radius: var(--sc-r-lg); box-shadow: var(--sc-e3); background: var(--mist);
}
.visit__media img { width: 100%; height: 100%; object-fit: cover; }
.visit__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.visit__frame figcaption { font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }

/* când actul este fixat, scena ține exact un ecran */
.visit.is-pinned .visit__stage { padding-block: calc(var(--bar-h) + 2rem) 2rem; }
.visit.is-pinned .visit__media { width: auto; height: min(68svh, 40rem); max-width: 100%; }

@media (max-width: 860px) {
  .visit__grid { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .visit__frame { order: -1; justify-items: center; }
  .visit__media { aspect-ratio: 1 / 1; max-width: 26rem; }
  .steps { margin-top: var(--sc-5); }
  .visit.is-pinned .visit__stage { align-items: center; padding-block: calc(var(--bar-h) + 1.25rem) calc(var(--dock-h) + 0.5rem); }
  .visit.is-pinned .visit__grid { gap: 0.8rem; }
  .visit.is-pinned .visit__media { height: min(36svh, 20rem); width: auto; }
  .visit.is-pinned .visit__frame figcaption { display: none; }
  .visit.is-pinned .sc-display--lg { font-size: 1.7rem; }
  .visit.is-pinned .steps { margin-top: 0.8rem; }
  .visit.is-pinned .step { padding-bottom: 0.55rem; padding-left: 2.1rem; }
  .visit.is-pinned .step h3 { font-size: 1.04rem; }
  .visit.is-pinned .step::after { width: 1.2rem; height: 1.2rem; top: 0.12rem; }
  .visit.is-pinned .step::before { left: 0.56rem; top: 1.25rem; }
  /* pe telefon, în scena fixată, doar pasul curent își arată textul */
  .visit.is-pinned .step p { display: none; font-size: 0.95rem; }
  .visit.is-pinned .step[data-current] p { display: block; }
}

/* -------------------------------------------------------------- 4 · echipa */
.team { background: linear-gradient(var(--sc-surface), var(--sc-canvas) 14rem); }
.team__stage { margin-top: var(--sc-6); position: relative; }
@media (min-width: 861px) {
  .is-live .team__controls { position: absolute; right: 0; bottom: calc(100% + 0.5rem); margin: 0; }
}

/* varianta statică (fără JS): toată echipa, cu mesajul la final */
.team__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 1.5rem; }
.member__photo { position: relative; overflow: hidden; border-radius: var(--sc-r-md); background: var(--mist); box-shadow: var(--sc-e2); aspect-ratio: 4 / 5; }
.member__photo img { width: 100%; height: 100%; object-fit: cover; }
.member__text { margin-top: 0.9rem; }
.member__name { font-family: var(--sc-font-display); font-weight: 400; font-size: var(--sc-t-xl); line-height: 1.12; letter-spacing: -0.015em; text-wrap: balance; }
.member__role { margin-top: 0.35rem; font-weight: 650; color: var(--sc-accent); }
.member__bio { margin-top: 0.75rem; color: var(--sc-ink-soft); max-width: 36ch; text-wrap: pretty; }
.member__flag { margin-top: 0.75rem; font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }
.team__together {
  margin-top: var(--sc-7);
  font-family: var(--sc-font-display); font-weight: 400; font-style: italic; font-size: var(--sc-t-2xl); line-height: 1.12; letter-spacing: -0.02em;
  color: var(--sc-accent); text-wrap: balance; max-width: 24ch;
}
@media (max-width: 860px) {
  .team__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; }
  .member__name { font-size: 1.25rem; }
}

/* varianta vie: o singură scenă, echipa se strânge pe rând */
.team__controls { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.5rem; }
.team__controls[hidden] { display: none; }
.team__count { min-width: 4.2rem; text-align: center; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--sc-ink-soft); }
.team__hint { margin-left: 0.5rem; font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }

.is-live .team__list {
  display: block; position: relative; overflow: hidden;
  height: var(--stage-h, 34rem);
  touch-action: pan-y;            /* glisarea verticală rămâne a paginii */
  cursor: grab; user-select: none; -webkit-user-select: none;
  outline-offset: 6px; border-radius: var(--sc-r-md);
}
.is-live .team__list.is-dragging { cursor: grabbing; }
.is-live .member { position: static; }
.is-live .member__photo {
  position: absolute; left: 0; top: 0; width: var(--a-w); height: var(--a-h); aspect-ratio: auto;
  transform-origin: 0 0; will-change: transform;
  border-radius: var(--sc-r-md);
}
.is-live .member__photo img { pointer-events: none; -webkit-user-drag: none; }
.is-live .member__text {
  position: absolute; left: var(--t-x); top: var(--t-y); width: var(--t-w); margin: 0;
  opacity: 0; will-change: opacity, transform; pointer-events: none;
}
.is-live .member__cap {
  position: absolute; left: 0; top: 0; margin: 0; transform-origin: 0 0;
  opacity: 0; will-change: opacity, transform; pointer-events: none;
  font-size: 0.82rem; line-height: 1.25; color: var(--sc-ink-soft);
}
.member__cap b { display: block; color: var(--sc-ink); font-weight: 650; font-size: 0.92rem; }
.member__cap--short { font-weight: 600; color: var(--sc-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.is-live .team__together {
  position: absolute; left: 0; right: 0; top: var(--m-y, 70%); margin: 0; max-width: none;
  opacity: 0; will-change: opacity, transform; pointer-events: none;
}
.is-live.is-narrow .member__name { font-size: 1.22rem; }
.is-live.is-narrow .member__role { font-size: 0.95rem; margin-top: 0.2rem; }
.is-live.is-narrow .member__bio, .is-live.is-narrow .member__flag { font-size: 0.92rem; margin-top: 0.5rem; line-height: 1.45; }
.is-live.is-narrow .team__together { font-size: 1.55rem; }
.is-live.is-narrow .member__cap { font-size: 0.74rem; }
.is-live.is-narrow .member__cap b { font-size: 0.8rem; }
@media (max-width: 860px) {
  .team__stage { margin-top: var(--sc-5); }
  .team__controls { margin-bottom: 1.1rem; gap: 0.6rem; }
  .team__hint { margin-left: 0.25rem; }
}

/* -------------------------------------------------------------- 5 · dotări */
.rooms { background: var(--mist); }

/* varianta statică (fără JS sau cu mișcare redusă): galerie pe săli */
.rooms__stage { padding-block: var(--sc-section); }
.rooms__nav {
  display: flex; flex-wrap: wrap; gap: 0.5rem;
  width: 100%; max-width: var(--sc-maxw); margin-inline: auto; padding-inline: var(--sc-gutter);
}
.rooms__nav a {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1rem; border-radius: var(--sc-r-pill);
  background: rgb(255 255 255 / 0.78); box-shadow: inset 0 0 0 1px var(--sc-hairline);
  color: var(--sc-ink); font-weight: 600; font-size: var(--sc-t-sm); text-decoration: none; white-space: nowrap;
  transition: background-color 160ms var(--sc-ease-out), color 160ms var(--sc-ease-out);
}
.rooms__nav a[aria-current="true"] { background: var(--dark); color: #fff; box-shadow: none; }
.rooms__rail { width: 100%; max-width: var(--sc-maxw); margin-inline: auto; padding-inline: var(--sc-gutter); }
.rooms__lead { margin-top: var(--sc-6); display: grid; gap: var(--sc-4); justify-items: start; }
.room { margin-top: var(--sc-8); scroll-margin-top: 6rem; }
.room__label h3 { font-family: var(--sc-font-display); font-weight: 400; font-size: var(--sc-t-2xl); line-height: 1.08; letter-spacing: -0.02em; }
.room__label p { margin-top: 0.5rem; color: var(--sc-ink-soft); max-width: 40ch; text-wrap: pretty; }
.room__tiles { margin-top: var(--sc-5); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem 1.25rem; }
.tile { display: grid; grid-template-rows: auto auto; gap: 0.6rem; align-content: start; min-width: 0; }
.tile__open {
  display: block; width: 100%; aspect-ratio: 4 / 5; overflow: hidden; cursor: zoom-in;
  border-radius: var(--sc-r-md); background: var(--sc-surface); box-shadow: var(--sc-e2);
  transition: transform 180ms var(--sc-ease-out), box-shadow 180ms var(--sc-ease-out);
}
.tile__open img { width: 100%; height: 100%; object-fit: cover; }
.tile__open:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: var(--sc-r-md); }
@media (hover: hover) and (pointer: fine) { .tile__open:hover { transform: translateY(-3px); box-shadow: var(--sc-e3); } }
.tile__open:active { transform: scale(0.985); }
.tile figcaption { font-size: 0.9rem; line-height: 1.32; font-weight: 550; color: var(--sc-ink); text-wrap: pretty; }
.rooms__end { margin-top: var(--sc-8); display: grid; gap: var(--sc-4); justify-items: start; }
.rooms__endline { font-family: var(--sc-font-display); font-weight: 400; font-size: var(--sc-t-2xl); line-height: 1.1; letter-spacing: -0.02em; max-width: 16ch; text-wrap: balance; }
@media (max-width: 860px) {
  .room__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 0.85rem; }
  .tile figcaption { font-size: 0.84rem; }
}

/* varianta „tur”: scena ține un ecran, șina merge lateral odată cu derularea */
.rooms.is-rail .rooms__stage { padding-block: 0; }
.rooms.is-rail {
  --stage-pad-top: calc(var(--bar-h) + 4.6rem);
  --stage-pad-bot: 1.75rem;
  --M: min(100svh - var(--stage-pad-top) - var(--stage-pad-bot), 44rem);
  --g: 0.9rem;
  --cap: 3.4rem;
}
.rooms.is-rail .rooms__nav {
  position: absolute; z-index: 5; top: calc(var(--bar-h) + 1.6rem); left: 0; right: 0;
  flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: none;
}
.rooms.is-rail .rooms__nav::-webkit-scrollbar { display: none; }
.rooms.is-rail .rooms__rail {
  max-width: none; width: max-content; height: 100%;
  display: flex; align-items: center; gap: clamp(2.5rem, 5vw, 5rem);
  padding: var(--stage-pad-top) var(--sc-gutter) var(--stage-pad-bot);
}
.rooms.is-rail .rooms__lead { margin: 0; width: min(78vw, 27rem); height: var(--M); align-content: center; flex: none; }
.rooms.is-rail .room { margin: 0; display: flex; gap: 1.75rem; flex: none; }
.rooms.is-rail .room__label { width: 15.5rem; height: var(--M); flex: none; display: grid; align-content: end; padding-bottom: var(--cap); }
.rooms.is-rail .room__label h3 { font-size: clamp(1.9rem, 1.3rem + 1.5vw, 2.7rem); }
.rooms.is-rail .room__tiles {
  margin: 0; height: var(--M);
  grid-template-columns: none; grid-template-rows: repeat(2, minmax(0, 1fr));
  grid-auto-flow: column dense; grid-auto-columns: max-content; gap: var(--g);
}
.rooms.is-rail .tile { grid-template-rows: minmax(0, 1fr) var(--cap); gap: 0; height: 100%; }
.rooms.is-rail .tile__open { width: auto; height: 100%; aspect-ratio: 4 / 5; }
.rooms.is-rail .tile figcaption { width: 0; min-width: 100%; padding-top: 0.5rem; font-size: 0.86rem; overflow: hidden; }
.rooms.is-rail .tile--big { grid-row: span 2; }
.rooms.is-rail .tile--big figcaption { font-size: 0.98rem; }
.rooms.is-rail .rooms__end { margin: 0; width: min(80vw, 24rem); height: var(--M); align-content: center; flex: none; padding-right: 4vw; }

@media (max-width: 860px) {
  .rooms.is-rail {
    --stage-pad-top: calc(var(--bar-h) + 4.4rem);
    --stage-pad-bot: calc(var(--dock-h) + 0.6rem);
    --M: calc(100svh - var(--stage-pad-top) - var(--stage-pad-bot));
    --g: 0.7rem;
    --cap: 3.3rem;
  }
  .rooms.is-rail .rooms__rail { gap: 2rem; }
  .rooms.is-rail .room { gap: 1rem; }
  .rooms.is-rail .room__label { width: 9.75rem; padding-bottom: 0; align-content: center; }
  .rooms.is-rail .room__label h3 { font-size: 1.65rem; }
  .rooms.is-rail .room__label p { font-size: 0.92rem; }
  /* pe telefon: toate la aceeași mărime, cu un cadru înalt în sălile cu număr impar */
  .rooms.is-rail .tile--big { grid-row: auto; }
  .rooms.is-rail .tile--big figcaption { font-size: 0.82rem; }
  .rooms.is-rail .tile figcaption { font-size: 0.82rem; line-height: 1.28; }
  .rooms.is-rail .tile--tall { grid-row: span 2; }
  .rooms.is-rail .tile--tall .tile__open { aspect-ratio: auto; width: min(84vw, 22rem); }
}
/* telefoane scunde: un singur rând, ca fotografiile să rămână mari */
@media (max-width: 860px) and (max-height: 640px) {
  .rooms.is-rail .room__tiles { grid-template-rows: minmax(0, 1fr); }
  .rooms.is-rail .tile--tall { grid-row: auto; }
  .rooms.is-rail .tile--tall .tile__open { aspect-ratio: 4 / 5; width: auto; }
}

/* ---------------------------------------------------------- 6 · programare
   Banda închisă de la final, în aceeași limbă cu hero-ul. */
.arrive { background: var(--dark); padding-top: var(--sc-section); }
.arrive__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.arrive__copy { display: grid; justify-items: start; }
.arrive__copy .sc-display--lg { font-size: clamp(2.6rem, 1.5rem + 4.4vw, 5rem); }
.arrive__copy .sc-body { max-width: 46ch; }
.arrive__cta { margin-top: var(--sc-6); display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.75rem; }
.arrive__facts { margin-top: var(--sc-7); width: 100%; max-width: 38rem; display: grid; }
.arrive__facts > div {
  display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 1rem;
  padding-block: 1.1rem; border-top: 1px solid var(--sc-hairline-strong);
}
.arrive__facts dt { font-size: var(--sc-t-xs); font-weight: 650; letter-spacing: 0.14em; text-transform: uppercase; color: var(--amber-soft); padding-top: 0.25rem; }
.arrive__facts dd { line-height: 1.55; color: var(--sc-ink); }
.arrive__facts .link { margin-top: 0.25rem; }
.arrive__pets { margin-top: var(--sc-6); width: min(100%, 19rem); opacity: 0.9; pointer-events: none; }
.arrive__photo { overflow: hidden; border-radius: var(--sc-r-lg); box-shadow: 0 30px 70px -24px rgb(0 0 0 / 0.6); aspect-ratio: 4 / 5; background: var(--dark-card); }
.arrive__photo img { width: 100%; height: 100%; object-fit: cover; }
.foot { margin-top: var(--sc-section); border-top: 1px solid var(--sc-hairline); }
.foot__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 2rem; padding-block: 1.5rem; font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }
.foot__row a { display: inline-flex; align-items: center; min-height: 2.75rem; color: var(--sc-ink); font-weight: 600; }
@media (max-width: 860px) {
  .arrive__grid { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; }
  .arrive__cta { gap: 0.85rem; width: 100%; }
  .arrive__cta .btn { width: 100%; }
  .arrive__facts { margin-top: var(--sc-6); }
  .arrive__facts > div { grid-template-columns: 6.5rem minmax(0, 1fr); }
  .arrive__pets { width: min(70%, 16rem); margin-top: var(--sc-5); }
  .arrive__photo { max-width: 30rem; }
  .foot__row { padding-bottom: calc(var(--dock-h) + 1.5rem); }
}

/* ------------------------------------------------------------ docul de apel */
.dock { display: none; }
@media (max-width: 860px) {
  .dock {
    display: block; position: fixed; z-index: calc(var(--sc-z-chrome) - 1); left: 0; right: 0; bottom: 0;
    padding: 0.75rem 0.75rem calc(0.75rem + env(safe-area-inset-bottom));
    transition: transform 260ms var(--sc-ease-drawer), opacity 200ms var(--sc-ease-out);
    pointer-events: none;
  }
  .dock__btn { width: 100%; min-height: 3.4rem; pointer-events: auto; box-shadow: var(--sc-e3), 0 0 0 4px rgb(255 255 255 / 0.55), inset 0 1px 0 rgb(255 255 255 / 0.2); }
  .dock[data-hidden] { transform: translateY(110%); opacity: 0; }
  .dock[data-hidden] .dock__btn { pointer-events: none; }
}

/* -------------------------------------------------------- fotografia mărită */
.zoom {
  border: 0; padding: 0; margin: 0; background: transparent; color: #fff;
  width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; overflow: hidden;
  --focus: #fff;
}
.zoom::backdrop { background: rgb(7 18 30 / 0.94); }
.zoom[open] { display: grid; grid-template-rows: minmax(0, 1fr) auto; justify-items: center; padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom)); gap: 0.75rem; }
.zoom__fig { min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; justify-items: center; gap: 0.75rem; }
.zoom__fig img { max-width: 100%; max-height: 100%; width: auto; height: auto; min-height: 0; object-fit: contain; border-radius: var(--sc-r-md); }
.zoom__fig figcaption { font-weight: 600; text-align: center; max-width: 40ch; text-wrap: balance; }
.zoom__bar { display: flex; align-items: center; gap: 0.75rem; }
.zoom__count { min-width: 4.5rem; text-align: center; font-variant-numeric: tabular-nums; color: rgb(255 255 255 / 0.82); }
.zoom__close { margin-left: 0.75rem; }

/* ----------------------------------------------------------- mișcare redusă */
@media (prefers-reduced-motion: reduce) {
  .btn, .round, .tile__open, .dock, .btn .ico, .svc__more .ico { transition-duration: 1ms; }
  .pets__eye { animation: none; }
}