/* ==========================================================================
   FOR-DADY VET — cabinet și farmacie veterinară, Vaslui
   Temă modernă, animată. Stylesheet comun pentru toate paginile.
   ========================================================================== */

:root {
  --bg: #f4f7fb;
  --surface: #ffffff;
  --surface-2: #eaf1f9;
  --navy: #132a4a;
  --navy-2: #1b3557;
  --blue: #2f6fb5;
  --blue-2: #4b8fd8;
  --teal: #1fb6c9;
  --yellow: #f6c945;
  /* roșul folosit deja pentru hartă/locație, ca „Important” să se vadă de departe */
  --red: #d93025;
  --red-dark: #c0271d;
  --text: #3f4c5e;
  --muted: #6b7a8c;
  --line: #dde5ee;
  --radius: 24px;
  --radius-sm: 16px;
  --shadow-sm: 0 2px 10px rgba(19, 42, 74, .06);
  --shadow: 0 18px 40px -14px rgba(19, 42, 74, .22);
  --shadow-lg: 0 40px 80px -30px rgba(19, 42, 74, .35);
  --grad: linear-gradient(135deg, #2f6fb5 0%, #1fb6c9 100%);
  --grad-soft: linear-gradient(135deg, rgba(47, 111, 181, .12), rgba(31, 182, 201, .12));
  --container: 1240px;
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-h: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* --- reset ---------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 90px; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family: var(--font); font-size: 16px; line-height: 1.7;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3 { margin: 0; font-family: var(--font-h); font-weight: 800; color: var(--navy); letter-spacing: -.02em; line-height: 1.1; }
table { border-collapse: collapse; }
::selection { background: rgba(31, 182, 201, .25); }

.container { width: min(var(--container), 100% - 48px); margin-inline: auto; position: relative; }
.icon {
  width: 1em; height: 1em; flex: none;
  fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
/* iconițe colorate: degrade albastru→turcoaz, cu rezervă pe culoare plină */
.icon--grad { stroke: var(--blue); stroke: url(#icon-grad); }
.icon--grad-light { stroke: #7fd3ff; stroke: url(#icon-grad-light); }
.br-lg { display: inline; }

/* --- tipografie ----------------------------------------------------------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px;
  font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--blue);
}
.eyebrow::before { content: ""; width: 22px; height: 2px; border-radius: 2px; background: var(--grad); }
.eyebrow--sm { font-size: 11px; margin-bottom: 4px; letter-spacing: .12em; }
.eyebrow--sm::before { width: 12px; }
.eyebrow--light { color: rgba(255, 255, 255, .8); }
.eyebrow--light::before { background: var(--yellow); }

/* line-height 1.2, nu mai strâns: la 1.04 sedila de la „ș” din rândul de sus
   se lipea de căciula lui „ă” din rândul următor și textul părea stricat, iar
   la 1.14 căciula lui „î” (din „într-un”) stătea atât de aproape de rândul de
   deasupra încât părea retezată — deși fontul o desenează întreagă, doar cu
   vârful plat */
.h-display { font-size: clamp(40px, 5.3vw, 80px); line-height: 1.2; letter-spacing: -.03em; }
.h-section { font-size: clamp(30px, 3.1vw, 46px); line-height: 1.1; letter-spacing: -.025em; }
.lead { max-width: 640px; margin-top: 28px; font-size: 19px; line-height: 1.75; color: var(--text); }
.intro { max-width: 600px; margin-top: 22px; font-size: 17px; line-height: 1.8; }
.intro + .intro { margin-top: 14px; }
.note { margin-top: 16px; font-size: 15px; line-height: 1.6; color: var(--muted); }
.num { display: block; font-size: 13px; font-weight: 800; letter-spacing: .08em; color: var(--blue); }

/* Textul în degrade se vede doar unde fundalul acoperă glifa, iar cutia
   fundalului se oprește la descendentul fontului: coada lui „g” (din „singur”)
   trecea dincolo și i se tăia buclorul. Padding-ul coboară cutia exact atât cât
   trebuie — 0,06em ajunge, ținem 0,08em ca rezervă. Crește rândul cu ~5px, iar
   textul în degrade e mereu pe ultimul rând al titlului, deci doar aerul de sub
   titlu se mărește cu atât. */
.grad-text {
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
  padding-bottom: .08em;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* --- animații de bază ----------------------------------------------------- */
@keyframes rise { from { transform: translateY(150%); } to { transform: translateY(0); } }
@keyframes fade-up { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes drift { from { transform: translate(0, 0) scale(1); } to { transform: translate(50px, -36px) scale(1.12); } }
@keyframes ecg-draw {
  0%   { stroke-dashoffset: 1000; opacity: 1; }
  65%  { stroke-dashoffset: 0; opacity: 1; }
  85%  { stroke-dashoffset: 0; opacity: 0; }
  100% { stroke-dashoffset: 1000; opacity: 0; }
}
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes shine { from { transform: translateX(-130%) skewX(-18deg); } to { transform: translateX(130%) skewX(-18deg); } }

/* elemente care intră la încărcarea paginii */
.anim-in { opacity: 0; animation: fade-up .9s var(--ease) forwards; animation-delay: calc(var(--i, 0) * 110ms + 120ms); }
/* Masca pentru animația de intrare taie tot ce iese din chenarul rândului, iar
   line-height-ul strâns lasă codițele literelor („g”, virgula) și accentele în
   afara lui. Lărgim masca cu padding și anulăm creșterea cu marginea negativă,
   deci textul se vede întreg fără să se schimbe spațierea.
   Sus nu mai putem crește padding-ul: marginile negative dintre rânduri se
   comasează, așa că fiecare pixel adăugat acolo ar depărta rândurile. Lăsăm
   deci aer doar în zona desenată, cu „overflow: clip”, care nu atinge deloc
   așezarea în pagină — plasă de siguranță pentru căciulile literelor („î”, „ă”)
   dacă pagina se deschide cu alt font decât cel încărcat de la Google. */
.hero__title .line {
  display: block; overflow: hidden;
  overflow: clip; overflow-clip-margin: .34em;
  padding-bottom: .26em; margin-bottom: -.26em;
  padding-top: .08em; margin-top: -.08em;
}
.hero__title .line > span { display: block; transform: translateY(150%); animation: rise 1s var(--ease) forwards; }
/* Pentru rândurile care încep cu o literă al cărei accent iese în stânga („î”,
   „Î”): le împingem la dreapta exact cât iese accentul, ca marginea din stânga a
   titlului să rămână dreaptă. */
.hero__title .line--optic { padding-left: .03em; }
.hero__title .line:nth-child(2) > span { animation-delay: .1s; }
.hero__title .line:nth-child(3) > span { animation-delay: .2s; }

/* elemente care intră la scroll */
html.js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
html.js [data-reveal="left"]  { transform: translateX(-34px); }
html.js [data-reveal="right"] { transform: translateX(34px); }
html.js [data-reveal="scale"] { transform: scale(.96); }
html.js [data-reveal].is-visible { opacity: 1; transform: none; }
[data-delay="1"] { transition-delay: .08s !important; }
[data-delay="2"] { transition-delay: .16s !important; }
[data-delay="3"] { transition-delay: .24s !important; }
[data-delay="4"] { transition-delay: .32s !important; }
[data-delay="5"] { transition-delay: .40s !important; }
[data-delay="6"] { transition-delay: .48s !important; }

/* forme gradient blurate în fundal */
.blobs { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.blobs span {
  position: absolute; border-radius: 50%; filter: blur(70px); opacity: .6;
  animation: drift 20s ease-in-out infinite alternate;
}
.blobs span:nth-child(1) { width: 560px; height: 560px; background: #bfdcf7; top: -200px; right: -140px; }
.blobs span:nth-child(2) { width: 460px; height: 460px; background: #c6f1f3; bottom: -180px; left: -160px; animation-delay: -7s; }
.blobs span:nth-child(3) { width: 320px; height: 320px; background: #fdeaa8; top: 45%; left: 42%; opacity: .2; animation-delay: -13s; }
.blobs--dark span:nth-child(1) { background: #2f6fb5; opacity: .5; }
.blobs--dark span:nth-child(2) { background: #1fb6c9; opacity: .35; }
.blobs--dark span:nth-child(3) { display: none; }

/* --- butoane & link-uri --------------------------------------------------- */
.btn {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 17px 28px; border: 1px solid transparent; border-radius: 999px;
  font-size: 16px; font-weight: 700; line-height: 1; letter-spacing: -.01em;
  white-space: nowrap; cursor: pointer;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), background-color .3s, border-color .3s, color .3s;
}
.btn .icon { width: 17px; height: 17px; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn--primary { background: var(--grad); color: #fff; box-shadow: 0 12px 26px -10px rgba(47, 111, 181, .7); }
.btn--primary:hover { box-shadow: 0 18px 34px -12px rgba(47, 111, 181, .8); }
.btn--primary::after, .btn--light::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 45%; z-index: -1;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent);
  transform: translateX(-130%) skewX(-18deg);
}
.btn--primary:hover::after, .btn--light:hover::after { animation: shine .8s var(--ease); }
.btn--outline { background: rgba(255, 255, 255, .7); color: var(--navy); border-color: var(--line); backdrop-filter: blur(8px); }
.btn--outline:hover { border-color: var(--blue); color: var(--blue); box-shadow: var(--shadow-sm); }
.btn--light { background: #fff; color: var(--navy); box-shadow: 0 14px 30px -12px rgba(0, 0, 0, .45); }
.btn--sm { padding: 12px 20px; font-size: 15px; }
.btn--sm .icon { width: 16px; height: 16px; }
.btn--lg { padding: 20px 34px; font-size: 17px; }
.btn--lg .icon { width: 19px; height: 19px; }
.btn-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }

.link-arrow {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 26px;
  font-size: 16px; font-weight: 700; color: var(--blue);
}
.link-arrow .icon { width: 16px; height: 16px; color: var(--teal); transition: transform .35s var(--ease); }
.link-arrow:hover { color: var(--teal); }
.link-arrow:hover .icon { transform: translateX(5px); }

/* --- chip-uri ------------------------------------------------------------- */
.chip {
  display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px; border-radius: 999px;
  background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm);
  font-family: var(--font-h); font-weight: 700; font-size: 17px; color: var(--navy); white-space: nowrap;
  transition: transform .35s var(--ease), box-shadow .35s, border-color .3s;
}
.chip:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: transparent; }

/* --- header --------------------------------------------------------------- */
.site-header {
  position: sticky; top: 0; z-index: 60;
  background: rgba(255, 255, 255, .78); backdrop-filter: saturate(180%) blur(16px); -webkit-backdrop-filter: saturate(180%) blur(16px);
  border-bottom: 1px solid rgba(19, 42, 74, .06);
  transition: box-shadow .4s, background-color .4s;
}
.site-header.is-scrolled { box-shadow: 0 10px 30px -14px rgba(19, 42, 74, .25); background: rgba(255, 255, 255, .9); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; min-height: 92px; transition: min-height .4s var(--ease); }
.is-scrolled .site-header__inner { min-height: 72px; }
.brand { display: block; line-height: 0; }
.brand img { height: 58px; width: auto; transition: height .4s var(--ease), transform .4s var(--ease); }
.is-scrolled .brand img { height: 46px; }
.brand:hover img { transform: scale(1.04); }
.nav { display: flex; align-items: center; gap: 22px; }
.nav__links { display: flex; gap: 4px; }
.nav__links a {
  position: relative; display: block; padding: 9px 15px; border-radius: 999px;
  font-size: 15px; font-weight: 600; color: var(--navy-2); transition: color .3s, background-color .3s;
}
.nav__links a::after {
  content: ""; position: absolute; left: 15px; right: 15px; bottom: 5px; height: 2px; border-radius: 2px;
  background: var(--grad); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease);
}
.nav__links a:hover { color: var(--blue); }
.nav__links a:hover::after { transform: scaleX(1); }
.nav__links a.is-active { color: var(--blue); background: rgba(47, 111, 181, .09); }

.nav-toggle {
  display: none; position: relative; width: 46px; height: 46px; padding: 0;
  background: #fff; border: 1px solid var(--line); border-radius: 14px; cursor: pointer;
}
.nav-toggle span {
  position: absolute; left: 13px; width: 20px; height: 2px; border-radius: 2px; background: var(--navy);
  transition: transform .35s var(--ease), opacity .3s, top .35s var(--ease);
}
.nav-toggle span:nth-child(1) { top: 15px; }
.nav-toggle span:nth-child(2) { top: 22px; }
.nav-toggle span:nth-child(3) { top: 29px; }
.is-open .nav-toggle span:nth-child(1) { top: 22px; transform: rotate(45deg); }
.is-open .nav-toggle span:nth-child(2) { opacity: 0; }
.is-open .nav-toggle span:nth-child(3) { top: 22px; transform: rotate(-45deg); }

/* --- hero ----------------------------------------------------------------- */
.hero { position: relative; padding: 84px 0 0; overflow: hidden; }
.hero > .container { position: relative; z-index: 1; }
.hero__grid { display: grid; grid-template-columns: 1.3fr .8fr; gap: 56px; align-items: center; }
.hero__grid .h-display { font-size: clamp(38px, 4.3vw, 68px); }
.hero__center { max-width: 900px; }

/* ==========================================================================
   Animalul din hero — decupaj PNG, animat din mai multe straturi
   Fiecare strat mișcă o singură proprietate, cu durate diferite și
   neîmpărțite între ele, deci mișcarea nu se repetă identic și pare vie.
   ========================================================================== */
@keyframes pet-enter {
  from { opacity: 0; transform: translateY(52px) scale(.84) rotate(-6deg); }
  70%  { opacity: 1; transform: translateY(-10px) scale(1.03) rotate(1.5deg); }
  to   { opacity: 1; transform: none; }
}
@keyframes pet-float   { from { transform: translateY(16px); }  to { transform: translateY(-22px); } }
@keyframes pet-tilt    { from { transform: rotate(-5deg); }     to { transform: rotate(5deg); } }
@keyframes pet-breathe { from { transform: scale(1); }          to { transform: scale(1.05); } }
@keyframes pet-glow {
  0%, 100% { transform: translate(-50%, -50%) scale(.88); opacity: .42; }
  50%      { transform: translate(-50%, -50%) scale(1.16); opacity: .85; }
}
/* umbra de pe sol respiră invers față de plutire: se strânge când animalul urcă */
@keyframes pet-shadow {
  from { transform: translateX(-50%) scaleX(1.1);  opacity: .32; }
  to   { transform: translateX(-50%) scaleX(.72);  opacity: .12; }
}
/* amprente care se ridică în jurul animalului */
@keyframes pet-paw {
  0%   { opacity: 0;   transform: translate(0, 0) rotate(var(--r)) scale(.5); }
  18%  { opacity: .8; }
  72%  { opacity: .45; }
  100% { opacity: 0;   transform: translate(var(--dx), -130px) rotate(calc(var(--r) + 45deg)) scale(1.1); }
}

.pet {
  position: relative; margin: 0; justify-self: center; width: 100%;
  animation: pet-enter 1.2s var(--ease) .1s both;
}
.pet--dog { max-width: 384px; }
.pet--cat { max-width: 336px; }

/* halou colorat în spate, pulsând */
.pet__glow {
  position: absolute; left: 50%; top: 45%; width: 120%; aspect-ratio: 1;
  border-radius: 50%; pointer-events: none; opacity: .6;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle at 55% 42%, rgba(31, 182, 201, .45), rgba(47, 111, 181, .16) 52%, transparent 72%);
  filter: blur(26px);
  animation: pet-glow 5.4s ease-in-out infinite;
}
.pet__shadow {
  position: absolute; left: 50%; bottom: 1%; width: 56%; height: 24px;
  border-radius: 50%; pointer-events: none; opacity: .26;
  transform: translateX(-50%);
  background: radial-gradient(50% 50% at 50% 50%, rgba(19, 42, 74, .45), transparent 70%);
  filter: blur(5px);
  animation: pet-shadow 3.4s ease-in-out infinite alternate;
}
.pet__paws { position: absolute; inset: 0; pointer-events: none; }
.pet__paws .paw {
  position: absolute; width: 26px; height: 26px; opacity: 0;
  fill: var(--teal); stroke: none;
  animation: pet-paw 4.6s ease-in-out infinite;
}
.pet__paws .paw:nth-child(1) { left: -5%;   bottom: 24%; width: 26px; height: 26px; --dx: -28px; --r: -18deg; animation-delay: .3s; }
.pet__paws .paw:nth-child(2) { right: -3%;  bottom: 15%; width: 20px; height: 20px; --dx: 24px;  --r: 16deg;  animation-delay: 1.5s; }
.pet__paws .paw:nth-child(3) { left: 8%;    bottom: 3%;  width: 31px; height: 31px; --dx: -12px; --r: 26deg;  animation-delay: 2.7s; }
.pet__paws .paw:nth-child(4) { right: 12%;  bottom: 32%; width: 16px; height: 16px; --dx: 20px;  --r: -24deg; animation-delay: 3.6s; }

/* straturile animalului: salt la hover, plutire, legănare, respirație */
.pet__lift { position: relative; z-index: 1; display: block; transition: transform .55s var(--ease); }
.pet:hover .pet__lift { transform: translateY(-18px) scale(1.06); }
.pet__float { display: block; animation: pet-float 3.4s ease-in-out infinite alternate; }
.pet__tilt  { display: block; transform-origin: 50% 86%; animation: pet-tilt 5.1s ease-in-out infinite alternate; }
.pet__img {
  width: 100%; transform-origin: 50% 90%;
  filter: drop-shadow(0 18px 26px rgba(19, 42, 74, .22));
  animation: pet-breathe 2.7s ease-in-out infinite alternate;
  transition: filter .55s var(--ease);
}
.pet:hover .pet__img { filter: drop-shadow(0 26px 36px rgba(19, 42, 74, .3)); }

.ecg-wrap { margin: 64px 0 40px; position: relative; }
.ecg-wrap::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--line); }
.ecg-line { display: block; width: 100%; height: 60px; position: relative; }
.ecg-path {
  fill: none; stroke: url(#ecg-grad); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
  vector-effect: non-scaling-stroke; stroke-dasharray: 1000; stroke-dashoffset: 1000;
  animation: ecg-draw 5s linear infinite; filter: drop-shadow(0 0 6px rgba(31, 182, 201, .55));
}

.hero__photo {
  position: relative; margin: 0; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg);
}
.hero__photo img { width: 100%; transform: scale(1.02); transition: transform 1.2s var(--ease); }
.hero__photo:hover img { transform: scale(1.06); }

/* --- statistici ----------------------------------------------------------- */
.stats { padding: 72px 0 0; }
.stats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.stat__num {
  display: block; font-family: var(--font-h); font-size: 48px; font-weight: 800;
  letter-spacing: -.03em; line-height: 1; margin-bottom: 10px;
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.stat__label { font-size: 14px; line-height: 1.5; color: var(--muted); font-weight: 500; }

/* --- carduri -------------------------------------------------------------- */
.card {
  position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 30px; box-shadow: var(--shadow-sm);
  transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s;
}
.card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: transparent; }
.card-spot::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(31, 182, 201, .16), transparent 45%);
  transition: opacity .45s;
}
.card-spot:hover::before { opacity: 1; }

/* pastile cu iconiță: simbol alb pe culoarea reprezentativă a serviciului */
.icon-badge {
  width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; flex: none;
  background: var(--grad); color: #fff; box-shadow: 0 12px 24px -12px rgba(19, 42, 74, .55);
  transition: transform .45s var(--ease), box-shadow .45s;
}
.icon-badge .icon { width: 26px; height: 26px; }
.card:hover .icon-badge { transform: rotate(-8deg) scale(1.06); box-shadow: 0 16px 28px -12px rgba(19, 42, 74, .6); }

/* culori reprezentative pentru fiecare mijloc de contact */
.icon-badge--phone { background: linear-gradient(135deg, #2ec26a, #109b4d); }
.icon-badge--pin   { background: linear-gradient(135deg, #f4655a, #d93025); }
.icon-badge--mail  { background: linear-gradient(135deg, #ffb020, #f08c00); }
.icon-badge--fb    { background: linear-gradient(135deg, #3b8bff, #1877f2); }

/* --- secțiuni ------------------------------------------------------------- */
.section { position: relative; padding: 104px 0; }
.section--alt { background: linear-gradient(180deg, #fff 0%, var(--bg) 100%); }
.section--tight { padding-top: 24px; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: 44px; }
.section-head__text { max-width: 420px; color: var(--muted); font-size: 16px; line-height: 1.7; padding-bottom: 6px; }
.cols-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; }
.cols-2--center { align-items: center; }

/* --- grilă servicii (acasă) ----------------------------------------------- */
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.svc-card { display: flex; flex-direction: column; gap: 14px; padding: 32px 30px; }
.svc-card__num { font-size: 13px; font-weight: 800; letter-spacing: .08em; color: var(--blue); }
.svc-card h3 { font-size: 24px; letter-spacing: -.02em; }
.svc-card p { font-size: 15.5px; line-height: 1.7; flex: 1; }
.svc-card__link { font-size: 14px; font-weight: 700; color: var(--blue); }
.svc-card:hover .svc-card__link { color: var(--teal); }
.svc-card--cta { background: var(--grad); border-color: transparent; color: #fff; overflow: hidden; }
.svc-card--cta::after {
  content: ""; position: absolute; width: 260px; height: 260px; right: -90px; bottom: -110px; border-radius: 50%;
  background: rgba(255, 255, 255, .12); transition: transform .6s var(--ease);
}
.svc-card--cta:hover::after { transform: scale(1.25); }
.svc-card--cta h3, .svc-card--cta p { color: #fff; }
.svc-card--cta p { opacity: .9; }
.svc-card--cta .btn { align-self: flex-start; margin-top: 4px; position: relative; z-index: 1; }

/* --- farmacie (card gradient) --------------------------------------------- */
.pharma-card {
  position: relative; overflow: hidden; padding: 40px; border-radius: var(--radius); color: #fff;
  background: radial-gradient(600px 300px at 110% -20%, rgba(31, 182, 201, .5), transparent 60%), linear-gradient(160deg, #1b3557, #2f6fb5);
  box-shadow: var(--shadow-lg);
}
.pharma-card::before {
  content: ""; position: absolute; width: 340px; height: 340px; left: -140px; bottom: -180px; border-radius: 50%;
  background: rgba(255, 255, 255, .06);
}
.pharma-list li { padding: 20px 0; border-top: 1px solid rgba(255, 255, 255, .14); }
.pharma-list li:first-child { border-top: 0; padding-top: 4px; }
.pharma-list strong { display: block; font-family: var(--font-h); font-size: 20px; font-weight: 800; }
.pharma-list span { font-size: 14px; opacity: .8; }
.pharma-card__note { margin-top: 18px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 13px; opacity: .8; }

/* --- pacienți: marquee ---------------------------------------------------- */
/* bandă continuă: patru grupuri identice, deplasare de exact două grupuri,
   deci bucla se reia fără salt și fără spațiu gol; nu se oprește la hover */
.patients { margin-top: 72px; }
.marquee { margin-top: 22px; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__track { display: flex; width: max-content; padding: 6px 0; animation: marquee 46s linear infinite; }
.marquee__group { display: flex; }
.marquee__group .chip { margin-right: 16px; }

/* --- lista detaliată (pagina Servicii) ------------------------------------ */
.svc-detail { display: grid; gap: 22px; }
.svc-row { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; padding: 38px 40px; align-items: stretch; }
.svc-row h2 { font-size: 34px; letter-spacing: -.025em; margin-top: 6px; }
.svc-row .sub { display: block; margin-top: 8px; font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
/* fotografia umple pe verticală coloana din stânga, ca să nu rămână gol */
.svc-row__head { display: flex; flex-direction: column; }
.svc-row__photo {
  flex: 1 1 0; min-height: 250px; margin-top: 24px; width: 100%; object-fit: cover;
  border-radius: var(--radius-sm); box-shadow: var(--shadow); transition: transform .6s var(--ease);
}
.svc-row:hover .svc-row__photo { transform: scale(1.02); }
/* descrierea sus, caseta „Bine de știut” lipită de baza cardului */
.svc-row__body { display: flex; flex-direction: column; }
.svc-row__body > p { margin-bottom: 20px; font-size: 17px; line-height: 1.7; }
.tip {
  margin-top: auto; margin-bottom: 0; padding: 18px 22px; border-radius: var(--radius-sm);
  background: var(--grad-soft); border-left: 3px solid var(--teal);
  font-size: 15px; line-height: 1.65;
}
.tip strong { color: var(--navy); }

/* --- timeline / pași ------------------------------------------------------ */
.timeline { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 10px; padding-top: 30px; }
.timeline::before, .timeline::after { content: ""; position: absolute; z-index: 0; top: 58px; left: 10%; right: 10%; height: 2px; border-radius: 2px; }
.timeline::before { background: var(--line); }
.timeline::after { background: var(--grad); transform: scaleX(0); transform-origin: left; transition: transform 1.4s var(--ease) .3s; }
.timeline.is-visible::after { transform: scaleX(1); }
.step { position: relative; }
.step__num {
  position: absolute; top: -30px; left: 30px; z-index: 2; width: 58px; height: 58px; border-radius: 50%;
  display: grid; place-items: center; background: var(--grad); color: #fff;
  font-family: var(--font-h); font-weight: 800; font-size: 17px; box-shadow: 0 12px 26px -10px rgba(47, 111, 181, .8);
  border: 4px solid var(--bg);
}
.step .card { position: relative; z-index: 1; padding: 52px 30px 32px; height: 100%; }
/* varianta cu fotografie: imaginea umple lățimea cardului, textul stă dedesubt */
.step .step__card { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.step__photo { margin: 0; overflow: hidden; background: var(--surface-2); }
.step__photo img {
  width: 100%; aspect-ratio: 16 / 9; object-fit: cover;
  transition: transform .8s var(--ease);
}
.step:hover .step__photo img { transform: scale(1.06); }
.step__body { padding: 26px 30px 30px; }
.step h3 { font-size: 23px; }
.step p { margin-top: 10px; font-size: 16px; line-height: 1.7; }
html.js .timeline .step { opacity: 0; transform: translateY(26px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
html.js .timeline.is-visible .step { opacity: 1; transform: none; }
.timeline .step:nth-child(2) { transition-delay: .18s; }
.timeline .step:nth-child(3) { transition-delay: .36s; }

/* --- categorii farmacie --------------------------------------------------- */
.cat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.cat-card h3 { font-size: 24px; }
.cat-card p { margin-top: 10px; font-size: 16px; line-height: 1.7; }
.callout-row { display: grid; grid-template-columns: 1.3fr 1fr; gap: 22px; margin-top: 22px; }
.callout { border-left: 4px solid var(--red); }
.callout h3 { font-size: 15px; letter-spacing: .12em; text-transform: uppercase; color: var(--red-dark); }
.callout p { margin-top: 10px; font-size: 16px; line-height: 1.7; }
.bring h3 { font-size: 15px; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); }
.bring__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.bring .chip { font-size: 15px; padding: 10px 18px; }

/* --- contact -------------------------------------------------------------- */
.cols-2--contact { grid-template-columns: 1.25fr 1fr; gap: 40px; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.contact-card { display: flex; flex-direction: column; gap: 14px; padding: 28px 26px; }
.contact-card .eyebrow { margin: 0; }
.contact-card__value { font-family: var(--font-h); font-size: 19px; font-weight: 800; color: var(--navy); letter-spacing: -.02em; line-height: 1.3; }
.contact-card__value--big { font-size: 28px; color: #111; }
.contact-card__value--break { font-size: 17px; overflow-wrap: anywhere; }
.contact-card small { font-size: 14px; color: var(--muted); line-height: 1.5; }
.contact-card .link-arrow { margin-top: auto; font-size: 14px; padding-top: 6px; }

.hours-card { padding: 30px 32px; }
.hours-card__top { margin-bottom: 16px; }
.hours-card__top .eyebrow { margin: 0; }
.hours { width: 100%; }
.hours th { text-align: left; padding: 0 0 12px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid var(--line); }
.hours td { padding: 14px 12px; font-size: 16px; border-bottom: 1px solid var(--line); transition: background-color .3s; }
.hours td:first-child { padding-left: 12px; font-weight: 500; color: var(--navy); }
.hours th:first-child, .hours td:first-child { width: 40%; }
.hours .closed { color: var(--muted); }
.hours tbody tr:hover td { background-color: rgba(47, 111, 181, .05); }

.map { margin: 24px 0 0; }
.map__frame { border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg); border: 1px solid var(--line); background: #e4e9ef; }
.map iframe { display: block; width: 100%; height: 520px; border: 0; }

/* --- bandă CTA + subsol --------------------------------------------------- */
.cta {
  position: relative; overflow: hidden; margin-top: 40px; padding: 110px 0 44px; color: #fff;
  background: linear-gradient(160deg, #10233f 0%, #1b3557 55%, #23477a 100%);
}
.cta > .container { position: relative; z-index: 1; }
.cta__inner { display: grid; grid-template-columns: 1.3fr auto; gap: 40px; align-items: center; }
.cta h2 { color: #fff; font-size: clamp(34px, 4vw, 62px); line-height: 1.08; letter-spacing: -.03em; }
.cta h2 .grad-text { background: linear-gradient(90deg, #7fd3ff, #5fe1e9); -webkit-background-clip: text; background-clip: text; }
.footer { margin-top: 90px; padding-top: 56px; border-top: 1px solid rgba(255, 255, 255, .14); }
.footer__grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 48px; }
.footer__logo-box {
  display: inline-block; padding: 18px 24px; background: #fff; border-radius: var(--radius-sm);
  box-shadow: 0 16px 34px -18px rgba(0, 0, 0, .6);
}
.footer__logo-box img { width: 170px; }
.footer__tag { margin-top: 20px; max-width: 300px; font-size: 14px; line-height: 1.7; color: rgba(255, 255, 255, .7); }
.footer .eyebrow { color: #9cc7f0; margin-bottom: 16px; }
.footer .eyebrow::before { background: var(--teal); }
.footer p { font-size: 16px; line-height: 1.75; color: #fff; }
.footer__links { margin-top: 14px; }
.footer__links li + li { margin-top: 8px; }
.footer__links a { display: inline-flex; align-items: center; gap: 9px; font-size: 16px; color: #fff; transition: color .3s, transform .3s var(--ease); }
.footer__links a .icon { width: 16px; height: 16px; color: #5fe1e9; }
.footer__links a:hover { color: #7fd3ff; transform: translateX(4px); }
.footer__bottom { margin-top: 56px; padding-top: 26px; border-top: 1px solid rgba(255, 255, 255, .14); }
.footer__bottom nav { display: flex; flex-wrap: wrap; gap: 22px; }
.footer__bottom a { font-size: 14px; color: #b9d3ee; transition: color .3s; }
.footer__bottom a:hover { color: #fff; }

/* --- butoane plutitoare --------------------------------------------------- */
.to-top {
  position: fixed; right: 28px; bottom: 104px; z-index: 55; width: 50px; height: 50px; border-radius: 50%;
  display: grid; place-items: center; background: #fff; color: var(--blue); border: 1px solid var(--line);
  box-shadow: var(--shadow); opacity: 0; transform: translateY(16px); pointer-events: none;
  transition: opacity .4s, transform .4s var(--ease), background .3s, color .3s;
}
.to-top .icon { width: 20px; height: 20px; }
.to-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.to-top:hover { background: var(--grad); color: #fff; border-color: transparent; }
.fab-call {
  display: none; position: fixed; right: 22px; bottom: 98px; z-index: 55; width: 54px; height: 54px; border-radius: 50%;
  place-items: center; background: linear-gradient(135deg, #2ec26a, #109b4d); color: #fff;
  box-shadow: 0 16px 34px -10px rgba(16, 155, 77, .75);
}
.fab-call .icon { width: 22px; height: 22px; }
.fab-call::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #2ec26a; animation: fab-ring 2s ease-out infinite; }
@keyframes fab-ring { from { transform: scale(1); opacity: .8; } to { transform: scale(1.7); opacity: 0; } }

/* --- responsive ----------------------------------------------------------- */
@media (max-width: 1100px) {
  .hero__grid { grid-template-columns: 1fr; gap: 36px; }
  .pet--dog { max-width: 330px; }
  .pet--cat { max-width: 290px; }
  .stats__grid { grid-template-columns: repeat(2, 1fr); }
  .svc-grid, .cat-grid { grid-template-columns: repeat(2, 1fr); }
  .svc-row { grid-template-columns: 1fr; gap: 24px; }
  .svc-row__photo { flex: none; min-height: 0; aspect-ratio: 16 / 10; }
  .section-head { flex-direction: column; align-items: flex-start; gap: 14px; }
}
@media (max-width: 860px) {
  html { scroll-padding-top: 74px; }
  .br-lg { display: none; }
  .hero { padding-top: 56px; }
  .section { padding: 72px 0; }
  .cols-2, .cols-2--contact, .footer__grid, .contact-grid, .callout-row { grid-template-columns: 1fr; gap: 28px; }
  .cols-2 { gap: 44px; }
  .timeline { grid-template-columns: 1fr; gap: 44px; }
  .timeline::before, .timeline::after { display: none; }
  .cta__inner { grid-template-columns: 1fr; }
  .cta { padding-top: 80px; }
  .footer { margin-top: 64px; }
  .ecg-wrap { margin: 44px 0 28px; }
  .chip { font-size: 15px; padding: 10px 18px; }
}
@media (max-width: 760px) {
  .site-header__inner { min-height: 74px; }
  .brand img { height: 46px; }
  .nav-toggle { display: block; }
  .nav {
    position: absolute; left: 0; right: 0; top: 100%; display: flex; flex-direction: column; align-items: stretch; gap: 8px;
    padding: 14px 24px 22px; background: rgba(255, 255, 255, .96); backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--line); box-shadow: var(--shadow);
    opacity: 0; transform: translateY(-10px); pointer-events: none; transition: opacity .35s, transform .35s var(--ease);
  }
  .is-open .nav { opacity: 1; transform: none; pointer-events: auto; }
  .nav__links { flex-direction: column; gap: 2px; }
  .nav__links a { padding: 12px 14px; font-size: 16px; }
  .nav .btn { justify-content: center; margin-top: 8px; }
  .btn-row .btn { width: 100%; justify-content: center; white-space: normal; }
  .stats__grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .stat__num { font-size: 38px; }
  .pet--dog { max-width: 268px; }
  .pet--cat { max-width: 236px; }
  .pet__paws .paw { transform-origin: 50% 50%; }
  .pet__paws .paw:nth-child(1) { width: 20px; height: 20px; }
  .pet__paws .paw:nth-child(3) { width: 24px; height: 24px; }
  .svc-grid, .cat-grid { grid-template-columns: 1fr; }
  .svc-row { padding: 26px 22px; }
  .svc-row h2 { font-size: 27px; }
  .pharma-card { padding: 28px 24px; }
  .map iframe { height: 380px; }
  .hours th:first-child, .hours td:first-child { width: 44%; }
  .to-top { display: none; }
  .fab-call { display: grid; }
}

/* ==========================================================================
   Asistent de chat — meniu de întrebări cu răspunsuri predefinite
   ========================================================================== */
@keyframes chat-pop   { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes chat-in    { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes chat-ring  { from { transform: scale(1); opacity: .55; } to { transform: scale(1.75); opacity: 0; } }
@keyframes chat-dot   { 0%, 60%, 100% { transform: translateY(0); opacity: .45; } 30% { transform: translateY(-5px); opacity: 1; } }
@keyframes chat-wiggle{ 0%, 88%, 100% { transform: rotate(0); } 92% { transform: rotate(-10deg); } 96% { transform: rotate(10deg); } }

.chat { position: fixed; right: 24px; bottom: 24px; z-index: 70; font-family: var(--font); }

/* --- butonul rotund de deschidere, cu logo-ul din antet ------------------- */
.chat__launcher {
  position: relative; display: grid; place-items: center; width: 78px; height: 78px; padding: 3px;
  border: 0; border-radius: 50%; cursor: pointer; background: var(--grad);
  box-shadow: 0 18px 38px -12px rgba(19, 42, 74, .6);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
/* discul alb pe care stă logo-ul, ca scrisul albastru să rămână lizibil */
.chat__launcher::after {
  content: ""; position: absolute; inset: 3px; border-radius: 50%; background: #fff;
}
.chat__launcher:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 22px 44px -12px rgba(19, 42, 74, .7); }
.chat__launcher:active { transform: scale(.96); }
.chat__logo {
  position: relative; z-index: 1; width: 56px; height: auto;
  animation: chat-wiggle 5s ease-in-out infinite;
}
.chat__launcher::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--teal);
  animation: chat-ring 2.4s ease-out infinite; pointer-events: none;
}
.chat.is-open .chat__launcher::before { display: none; }
.chat__badge {
  position: absolute; z-index: 2; top: -3px; right: -3px; min-width: 20px; height: 20px; padding: 0 5px;
  display: grid; place-items: center; border-radius: 999px; background: #e8433a; color: #fff;
  font-size: 11px; font-weight: 800; border: 2px solid var(--bg);
}
.chat.is-open .chat__badge { display: none; }

/* bula de invitație care apare o dată, lângă buton */
.chat__nudge {
  position: absolute; right: 84px; bottom: 16px; width: max-content; max-width: 232px;
  padding: 12px 16px; border-radius: 16px 16px 4px 16px; background: #fff; color: var(--navy);
  font-size: 14px; line-height: 1.45; font-weight: 500; border: 1px solid var(--line);
  box-shadow: var(--shadow); animation: chat-pop .5s var(--ease) both;
}
.chat__nudge b { font-weight: 800; }
.chat.is-open .chat__nudge, .chat__nudge[hidden] { display: none; }

/* --- fereastra de conversație --------------------------------------------- */
.chat__panel {
  position: absolute; right: 0; bottom: 88px; width: 384px; max-width: calc(100vw - 32px);
  height: min(560px, calc(100vh - 140px)); display: none; flex-direction: column; overflow: hidden;
  background: #fff; border: 1px solid var(--line); border-radius: 22px;
  box-shadow: 0 40px 90px -28px rgba(19, 42, 74, .55);
}
.chat.is-open .chat__panel { display: flex; animation: chat-pop .38s var(--ease) both; }

.chat__header {
  display: flex; align-items: center; gap: 12px; padding: 16px 16px 16px 18px; color: #fff;
  background: radial-gradient(420px 160px at 110% -30%, rgba(31, 182, 201, .6), transparent 60%), linear-gradient(135deg, #1b3557, #2f6fb5);
}
.chat__avatar {
  width: 46px; height: 46px; border-radius: 50%; flex: none; display: grid; place-items: center;
  background: #fff; overflow: hidden;
}
.chat__avatar img { width: 38px; height: auto; }
.chat__title { flex: 1; min-width: 0; }
.chat__title strong { display: block; font-family: var(--font-h); font-size: 15px; font-weight: 800; letter-spacing: -.01em; }
.chat__close {
  width: 34px; height: 34px; flex: none; display: grid; place-items: center; cursor: pointer;
  border: 0; border-radius: 50%; background: rgba(255, 255, 255, .16); color: #fff;
  transition: background-color .25s, transform .25s var(--ease);
}
.chat__close svg { width: 16px; height: 16px; }
.chat__close:hover { background: rgba(255, 255, 255, .3); transform: rotate(90deg); }

.chat__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px 16px 14px; background: var(--bg); }
.chat__body::-webkit-scrollbar { width: 8px; }
.chat__body::-webkit-scrollbar-thumb { background: #c9d6e4; border-radius: 8px; }

.chat__msg { display: flex; margin-bottom: 10px; animation: chat-in .35s var(--ease) both; }
.chat__msg--bot { justify-content: flex-start; }
.chat__msg--user { justify-content: flex-end; }
.chat__bubble {
  max-width: 86%; padding: 12px 16px; font-size: 14.5px; line-height: 1.6;
  border-radius: 18px 18px 18px 6px; background: #fff; color: var(--text);
  border: 1px solid var(--line); box-shadow: var(--shadow-sm);
}
.chat__bubble strong { color: var(--navy); font-weight: 700; }
.chat__bubble ul { margin: 8px 0 0; padding-left: 2px; }
.chat__bubble li { position: relative; padding-left: 18px; margin-top: 5px; }
.chat__bubble li::before {
  content: ""; position: absolute; left: 0; top: 9px; width: 7px; height: 7px;
  border-radius: 2px; background: var(--grad);
}
.chat__msg--user .chat__bubble {
  background: var(--grad); color: #fff; border-color: transparent;
  border-radius: 18px 18px 6px 18px; font-weight: 600;
}

/* indicator „scrie…” */
.chat__typing { display: inline-flex; gap: 5px; padding: 15px 18px; }
.chat__typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--blue); animation: chat-dot 1.3s infinite; }
.chat__typing i:nth-child(2) { animation-delay: .18s; }
.chat__typing i:nth-child(3) { animation-delay: .36s; }

/* butoanele de acțiune de la finalul fiecărui răspuns */
.chat__cta { display: flex; flex-direction: column; gap: 8px; max-width: 86%; margin: 2px 0 14px; animation: chat-in .35s var(--ease) both; }
.chat__cta a {
  display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-radius: 14px;
  font-size: 14px; font-weight: 700; line-height: 1.3;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), background-color .3s;
}
.chat__cta a svg { width: 17px; height: 17px; flex: none; }
.chat__cta a:hover { transform: translateY(-2px); }
.chat__cta .cta--call { background: linear-gradient(135deg, #2ec26a, #109b4d); color: #fff; box-shadow: 0 12px 24px -12px rgba(16, 155, 77, .95); }
.chat__cta .cta--map  { background: linear-gradient(135deg, #f4655a, #d93025); color: #fff; box-shadow: 0 12px 24px -12px rgba(217, 48, 37, .9); }
.chat__cta .cta--fb   { background: linear-gradient(135deg, #3b8bff, #1877f2); color: #fff; box-shadow: 0 12px 24px -12px rgba(24, 119, 242, .9); }
.chat__cta .cta--page { background: #fff; color: var(--navy); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.chat__cta .cta--page:hover { border-color: var(--blue); color: var(--blue); }

/* meniul de întrebări */
.chat__options { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px 16px; border-top: 1px solid var(--line); background: #fff; }
.chat__options button {
  padding: 10px 15px; border-radius: 999px; cursor: pointer;
  border: 1px solid #c9dcf1; background: #f2f8ff; color: var(--blue);
  font-family: inherit; font-size: 13.5px; font-weight: 600; line-height: 1.2;
  animation: chat-in .3s var(--ease) both;
  transition: transform .25s var(--ease), background-color .25s, color .25s, border-color .25s, box-shadow .25s;
}
.chat__options button:nth-child(2) { animation-delay: .04s; }
.chat__options button:nth-child(3) { animation-delay: .08s; }
.chat__options button:nth-child(4) { animation-delay: .12s; }
.chat__options button:nth-child(5) { animation-delay: .16s; }
.chat__options button:nth-child(6) { animation-delay: .20s; }
.chat__options button:nth-child(n+7) { animation-delay: .24s; }
.chat__options button:hover { background: var(--grad); color: #fff; border-color: transparent; transform: translateY(-2px); box-shadow: 0 10px 20px -10px rgba(47, 111, 181, .85); }
.chat__options button.is-back { background: #fff; color: var(--muted); border-color: var(--line); }
.chat__options button.is-back:hover { background: var(--navy); color: #fff; border-color: transparent; }

@media (max-width: 760px) {
  .chat { right: 18px; bottom: 18px; }
  .chat__launcher { width: 68px; height: 68px; }
  .chat__logo { width: 48px; }
  .chat__panel { right: -2px; bottom: 78px; width: calc(100vw - 32px); height: min(72vh, calc(100vh - 130px)); }
  .chat__nudge { display: none; }
}

/* --- accesibilitate: mișcare redusă --------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html { scroll-behavior: auto; }
  html.js [data-reveal], html.js .timeline .step, .anim-in, .hero__title .line > span { opacity: 1 !important; transform: none !important; }
  .marquee__track { animation: none !important; }
  /* animalul din hero rămâne pe loc: fără plutire, fără amprente, fără salt */
  .pet__paws { display: none; }
  .pet:hover .pet__lift { transform: none; }
}


