/*
Theme Name: Ambulatorio Bertone & Oropallo
Description: Tema a blocchi custom. Desktop: design 1920 scalato in proporzione (tutto scala insieme, niente zoom). Mobile: design 393 che riempie la larghezza (fluid). Pixel-perfect a 1920 e 393.
Author: Ambulatorio Veterinario Bertone & Oropallo
Version: 3.0
Requires at least: 6.3
Requires PHP: 7.4
Text Domain: amb-theme
*/

/* ============================================================
   SCALING PROPORZIONALE (come la prima versione, "solo le misure"):
   1rem = 100vw/192 fino a 10px → il design 1920 viene rimpicciolito/ingrandito
   IN PROPORZIONE alla larghezza. TUTTO (testo, immagini, hero, spazi) scala
   insieme, quindi niente sensazione di "zoom".
   Mobile <1000: 1rem = 100vw/39.3 fino a 10px del design telefono; il contenuto
   RIEMPIE la larghezza (fluid), pixel-perfect a 393.
   ============================================================ */
html {
  font-size: min(calc(100vw / 192), 10px);
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  overflow-x: clip;
}
@media (max-width: 999px) {
  html { font-size: min(calc(100vw / 39.3), 10px); }
}

:root {
  --navy: #1F507E;
  --blue: #7CB2DB;
  --accent: #95CBF4;
  --sky:  #C6E6FC;
  --ice:  #EAF4FA;
}

*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: var(--navy);
  background: #fff;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, ul, figure { margin: 0; padding: 0; }
.sec { color: var(--accent); }

/* TESTO LEGGIBILE: dimensioni in px+vw che NON scalano col layout (restano leggibili
   sui laptop), con floor minimo e cap alla misura del design a 1920. Il LAYOUT invece
   scala in proporzione (rem), così niente zoom ma testo sempre leggibile. */
h1 { font-size: clamp(32px, 3.125vw, 60px); line-height: 1.16; font-weight: 700; }
h2 { font-size: clamp(28px, 2.7vw, 50px); line-height: 1.2; font-weight: 700; }
h3 { font-size: clamp(15px, 0.94vw, 18px); line-height: 1.33; font-weight: 700; text-transform: uppercase; }
body { font-size: clamp(15px, 0.94vw, 18px); line-height: 1.55; }
p { line-height: 1.55; }

.amb-wrap { max-width: 174.4rem; margin-left: auto; margin-right: auto; padding-left: 8.8rem; padding-right: 8.8rem; }
@media (min-width: 1000px) {
  .amb-wrap { padding-left: 0; padding-right: 0; width: 174.4rem; }
}

[id] { scroll-margin-top: 12rem; }

.wp-block-post-content > * {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

p.amb-sub { margin-top: 0.8rem; }
.amb-center { text-align: center; }

/* ============ HEADER ============ */
.amb-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  transition: background .25s ease, box-shadow .25s ease;
}
.amb-header.scrolled { background: rgba(255,255,255,.96); box-shadow: 0 2px 14px rgba(31,80,126,.10); }
.amb-header-in {
  max-width: 174.4rem;
  margin: 0 auto;
  padding: 2.1rem 8.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 1000px) { .amb-header-in { padding-left: 0; padding-right: 0; width: 174.4rem; } }
.amb-logo img { height: 10.2rem; width: auto; }
.amb-nav { display: flex; gap: 2.4rem; }
.amb-nav a {
  background: var(--sky);
  color: var(--navy);
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: 1rem 3rem;
  border-radius: 2rem;
  white-space: nowrap;
  transition: background .25s ease, color .25s ease;
}
.amb-nav a:hover { background: var(--navy); color: #fff; }
.amb-burger { display: none; }

/* ============ 01 HERO ============ */
.amb-hero {
  height: 108.9rem;
  background: #f4f3f1 url('assets/img/bg-hero.jpg') no-repeat top center / cover;
  background-image: image-set(url('assets/img/bg-hero.webp') type('image/webp'), url('assets/img/bg-hero.jpg') type('image/jpeg'));
  /* 28.1rem a 1920 (pixel-perfect), ma si riduce fluido sotto i ~1720 così il testo
     — che non scala — non resta troppo in basso sui desktop stretti */
  padding-top: min(28.1rem, calc(19.7vw - 87px));
}
.amb-hero h1 { margin-bottom: 1.6rem; }
.amb-hero p { max-width: 71.5rem; margin-bottom: 2.2rem; }
.amb-hero p:last-of-type { margin-bottom: 3.2rem; }
.amb-hero .wp-block-button__link,
.amb-btn {
  display: inline-block;
  width: auto;
  min-width: 42.1rem;
  max-width: 100%;
  height: 6.7rem;
  line-height: 6.7rem;
  padding: 0 3rem;
  white-space: nowrap;
  text-align: center;
  background: var(--navy);
  color: var(--sky);
  font-family: 'Poppins', sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  border-radius: 3.4rem;
  border: none;
  transition: background .25s ease;
}
.amb-hero .wp-block-button__link:hover, .amb-btn:hover { background: #16436C; color: #fff; }
.amb-hero .wp-block-buttons { margin: 0; }

/* ============ 02 CHI SIAMO ============ */
.amb-chi { margin-top: -7.4rem; position: relative; z-index: 2; }
.amb-chi .amb-cols {
  display: grid;
  grid-template-columns: 86.2rem 71.5rem;
  gap: 16.7rem;
  align-items: start;
}
.amb-col-txt { padding-top: 4rem; }
.amb-chi figure img { width: 100%; aspect-ratio: 862/598; object-fit: cover; border-radius: 2rem; }
.amb-chi h2 { max-width: 60rem; line-height: 1.05; margin-bottom: 3rem; }
.amb-chi h2 + p { max-width: 57.5rem; line-height: 1.4; margin-bottom: 4.8rem; }
.amb-label {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  margin-bottom: 1.4rem;
}
.amb-pills {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.4rem 2rem;
}
.amb-pill {
  display: flex;
  align-items: center;
  gap: 3.2rem;
  background: var(--ice);
  border-radius: 2rem;
  min-height: 9rem;
  padding: 1.6rem 2rem 1.6rem 3.3rem;
  font-size: 1.8rem;
}
.amb-pill img { width: 5rem; height: auto; flex: 0 0 5rem; }
/* decorazione dog+cat+turtle ancorata alla TERZA card servizi, così l'angolo della card
   la copre sempre (a ogni larghezza), come nel design. z-index:-1 = dietro la card */
.amb-servizi .amb-cards > *:nth-child(3) { position: relative; }
.amb-servizi .amb-cards > *:nth-child(3)::before {
  content: '';
  position: absolute;
  right: -6.5rem; top: -19.5rem;
  width: 28.5rem; height: 37.5rem;
  background: url('assets/img/raggruppa_19.svg') no-repeat center / contain;
  opacity: .14;
  pointer-events: none;
  z-index: -1;
}

/* ============ 03 SERVIZI ============ */
.amb-servizi { padding-top: 20.1rem; position: relative; z-index: 3; }
.amb-servizi .amb-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin-top: 2rem;
  align-items: stretch;   /* card della stessa riga tutte alte uguali */
}
.amb-card {
  background: var(--ice);
  border-radius: 2rem;
  padding: 1.7rem 2.9rem 2.9rem;
}
.amb-card figure img { width: 100%; aspect-ratio: 510/320; object-fit: cover; border-radius: 1.4rem; }
.amb-card h3 { margin: 4.6rem 0 1rem; }

/* ============ 04+05 FASCIA NAVY ============ */
.amb-navy {
  margin-top: -32rem;
  min-height: 265rem;
  background-image:
    url('assets/img/v2-navy-top.svg'),
    url('assets/img/v2-navy-bottom.svg'),
    linear-gradient(var(--navy), var(--navy));
  background-repeat: no-repeat;
  background-position: top center, bottom center, left 33.9rem;
  background-size: 100% 34rem, 100% 19rem, 100% calc(100% - 52.8rem);
  position: relative;
  z-index: 1;
  color: #fff;
}
.amb-navy h2, .amb-navy h3, .amb-navy p { color: #fff; }
.amb-navy .amb-cols {
  display: grid;
  grid-template-columns: 86.2rem 71.5rem;
  gap: 16.7rem;
  align-items: start;
}
.amb-tutti-left { padding-top: 48.2rem; }
.amb-tutti-imgs { padding-top: 47.8rem; }

.amb-acc { display: grid; gap: 2rem; margin-top: 3.6rem; }
.amb-acc details {
  background: #fff;
  border-radius: 4.6rem;
  box-shadow: 0 0 1rem rgba(0,0,0,.12);
  overflow: hidden;
  color: var(--navy);
}
.amb-acc details[open] { border-radius: 3rem; }
.amb-acc summary {
  list-style: none;
  cursor: pointer;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 9.2rem;
  padding: 1rem 12rem 1rem 12.8rem;
  font-size: 1.8rem;
  line-height: 1.33;
  font-weight: 700;
  text-transform: uppercase;
}
.amb-acc summary::-webkit-details-marker { display: none; }
.amb-acc summary::marker { content: none; }
.amb-acc summary::after {
  display: block;
  font-weight: 400;
  font-size: 1.8rem;
  line-height: 1.3;
  text-transform: none;
  margin-top: .2rem;
}
.amb-acc details:nth-of-type(1) summary::after { content: 'Visite generali, vaccinazioni e piani di salute personalizzati.'; }
.amb-acc details:nth-of-type(2) summary::after { content: 'Medicina interna, chirurgia e gestione dei casi più complessi.'; }
.amb-acc details:nth-of-type(3) summary::after { content: 'Esami del sangue, urine, feci e altri test di laboratorio.'; }
.amb-acc details:nth-of-type(4) summary::after { content: 'Radiografie, ecografie e monitoraggio delle patologie nel tempo.'; }
.amb-acc details:nth-of-type(5) summary::after { content: 'Consigli nutrizionali, certificazioni e consulenze.'; }
.amb-acc summary::before {
  content: '';
  position: absolute;
  left: 4rem; top: 50%;
  transform: translateY(-50%);
  width: 5.6rem; height: 5.6rem;
  background: no-repeat center / contain;
}
.amb-acc details:nth-of-type(1) summary::before { background-image: url('assets/img/medicina.svg'); }
.amb-acc details:nth-of-type(2) summary::before { background-image: url('assets/img/servizi_specialistici.svg'); }
.amb-acc details:nth-of-type(3) summary::before { background-image: url('assets/img/diagnostica_laboratorio.svg'); }
.amb-acc details:nth-of-type(4) summary::before { background-image: url('assets/img/diagnostica_immagini.svg'); }
.amb-acc details:nth-of-type(5) summary::before { background-image: url('assets/img/servizi.svg'); }
.amb-acc summary .amb-plus {
  position: absolute;
  right: 2.2rem; top: 50%;
  transform: translateY(-50%);
  width: 6.3rem; height: 6.3rem;
  border-radius: 50%;
  background: #CEEEFF;
  color: var(--navy);
  font-weight: 300;
  font-size: 3rem;
  line-height: 6.3rem;
  text-align: center;
  text-transform: none;
}
.amb-acc summary .amb-plus::before { content: '+'; }
.amb-acc details[open] summary .amb-plus::before { content: '−'; }
.amb-acc details ul {
  list-style: none;
  margin: 0 3.2rem 2.8rem;
  background: var(--ice);
  border-radius: 2rem;
  padding: 2.6rem 3.4rem;
}
.amb-acc details li {
  position: relative;
  padding-left: 2.6rem;
  font-size: 1.7rem;
  line-height: 1.45;
  margin-bottom: 1.2rem;
  color: var(--navy);
}
.amb-acc details li:last-child { margin-bottom: 0; }
.amb-acc details li::before {
  content: '';
  position: absolute;
  left: 0; top: .85rem;
  width: .8rem; height: .8rem;
  border-radius: 50%;
  background: var(--navy);
}

.amb-tutti-imgs figure img { border-radius: 2rem; object-fit: cover; width: 100%; }
.amb-tutti-imgs > figure img { aspect-ratio: 715/309; }
.amb-timgs-row {
  display: grid;
  grid-template-columns: 42.1rem 28rem;
  gap: 1.4rem;
  margin-top: 1.4rem;
}
.amb-timgs-row figure:first-child img { aspect-ratio: 421/355; }
.amb-timgs-row figure:last-child img { aspect-ratio: 280/355; }

.amb-tecno-head { clear: both; padding-top: 18.5rem; }
.amb-grid { display: grid; gap: 2rem; margin-top: 2.5rem; }
.amb-grid + .amb-grid { margin-top: 1.8rem; }
.amb-grid figure img { width: 100%; height: 34.4rem; object-fit: cover; border-radius: 2rem; }
.amb-tecno-r1 { grid-template-columns: 39.6fr 29.9fr 42.1fr 27.4fr 27.4fr; margin-top: 3.7rem; }
.amb-tecno-r2 { grid-template-columns: 27.4fr 42.1fr 27.4fr 42.1fr 27.4fr; }
.amb-tecno-r2 figure img { height: 33.9rem; }

.amb-navy::before {
  content: '';
  position: absolute;
  left: 161.7rem; top: 122.1rem;
  width: 26.5rem; height: 30.2rem;
  background: url('assets/img/deco-gatto.png') no-repeat center / 100% 100%;
  pointer-events: none;
}
.amb-navy::after {
  content: '';
  position: absolute;
  left: 2.6rem; top: 235.1rem;
  width: 18.2rem; height: 41.8rem;
  background: url('assets/img/deco-cane.png') no-repeat top center / 100% 100%;
  clip-path: polygon(0rem 0rem, 18.2rem 0rem, 18.2rem 20.1rem, 16.9rem 20.4rem, 15.6rem 20.7rem, 14.3rem 21rem, 13rem 21.3rem, 11.7rem 21.7rem, 10.4rem 22rem, 9.1rem 22.4rem, 7.8rem 22.8rem, 6.5rem 23.2rem, 5.2rem 23.6rem, 3.9rem 24rem, 2.6rem 24.5rem, 1.3rem 24.9rem, 0rem 25.4rem);
  pointer-events: none;
}

/* ============ 06 TEAM ============ */
.amb-team { margin-top: -33rem; padding-top: .3rem; position: relative; z-index: 2; }
.amb-team-panel {
  max-width: 145rem;
  margin: 0 auto;
  background: var(--ice);
  border-radius: 3rem;
  padding: 8.2rem 4rem 6.6rem;
}
.amb-team-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 56.8rem));
  gap: 2rem;
  justify-content: center;
  margin-top: 1.9rem;
  margin-block-end: -21.8rem !important;
}
.amb-team-card {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 0 1rem rgba(0,0,0,.10);
  padding: 4.1rem;
}
.amb-team-card figure img { width: 100%; aspect-ratio: 486/283; object-fit: cover; border-radius: 1.4rem; }
.amb-team-card h3 { margin: 2.6rem 0 1rem; }
.amb-team-card p { line-height: 2.4rem; }
.amb-team::after {
  content: '';
  position: absolute;
  left: 178rem; top: 14.7rem;
  width: 35.8rem; height: 45.1rem;
  background: url('assets/img/deco-onda2.png') no-repeat center / 100% 100%;
  clip-path: polygon(0rem 6.8rem, 1.4rem 6.5rem, 2.8rem 6.2rem, 4.2rem 5.9rem, 5.6rem 5.5rem, 7rem 5.2rem, 8.4rem 4.8rem, 9.8rem 4.4rem, 11.2rem 4rem, 12.6rem 3.6rem, 14rem 3.2rem, 35.8rem 3.2rem, 35.8rem 45.1rem, 0rem 45.1rem);
  pointer-events: none;
}

/* ============ 07 STORIE ============ */
.amb-storie {
  padding-top: 26.9rem;
  padding-bottom: 10rem;
  background: linear-gradient(180deg, #ffffff 0%, #F0F7FD 26%, #E5F0FA 41%, #E9F3FA 60%, #F0F6FC 80%, #F3F8FD 92%, #FCFDFF 100%);
  position: relative;
  z-index: 0;
}
.amb-storie::before {
  content: '';
  position: absolute;
  left: -16.4rem; top: 18.2rem;
  width: 50.1rem; height: 39.7rem;
  background: url('assets/img/deco-onda1.png') no-repeat center / 100% 100%;
  pointer-events: none;
  z-index: -1;
}
.amb-storie::after {
  content: '';
  position: absolute;
  left: 173.6rem; top: 65.5rem;
  width: 39.8rem; height: 50.2rem;
  background: url('assets/img/deco-onda2.png') no-repeat center / 100% 100%;
  pointer-events: none;
  z-index: -1;
}
.amb-intro { max-width: 90rem; margin: 1.3rem auto 0; text-align: center; }
.amb-carousel {
  display: flex;
  gap: 2rem;
  overflow-x: auto;
  overflow-y: hidden;
  touch-action: pan-x;
  scroll-snap-type: x proximity;
  scroll-behavior: smooth;
  padding: 2.7rem max(calc((100% - 115.6rem)/2), 2rem) 3.3rem;
  scrollbar-width: none;
}
.amb-carousel::-webkit-scrollbar { display: none; }

/* frecce prev/next dei caroselli (aggiunte via JS) */
.amb-slider { position: relative; }
.amb-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  z-index: 5;
  width: 5.4rem; height: 5.4rem;
  border-radius: 50%;
  border: none; cursor: pointer;
  background: rgba(255,255,255,.92);
  box-shadow: 0 .3rem 1.2rem rgba(31,80,126,.28);
  color: var(--navy);
  display: flex; align-items: center; justify-content: center;
  transition: background .2s ease, opacity .2s ease;
}
.amb-arrow:hover { background: #fff; }
.amb-arrow svg { width: 2.2rem; height: 2.2rem; }
.amb-arrow--prev { left: 1rem; }
.amb-arrow--next { right: 1rem; }
.amb-arrow[disabled] { opacity: 0; pointer-events: none; }
.amb-story {
  flex: 0 0 115.6rem;
  min-height: 45.1rem;
  scroll-snap-align: center;
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 0 2rem rgba(31,80,126,.25);
  display: grid !important;
  grid-template-columns: 56.8fr 47.6fr;
  gap: 2rem;
  padding: 3.7rem 2.4rem;
  align-items: center;
}
.amb-story figure { height: 37.6rem; align-self: center; }
.amb-story figure img { width: 100%; height: 100%; object-fit: cover; border-radius: 1.4rem; }
.amb-story h3 { margin-bottom: 1rem; }
.amb-story p { font-size: 1.8rem; line-height: 1.33; }
.amb-story .amb-story-txt { align-self: center; }
.amb-dots { display: flex; justify-content: center; align-items: center; gap: 1.6rem; }
.amb-dots button {
  width: 1.3rem; height: 1.3rem;
  border-radius: 50%;
  background: #8AACC6;
  border: none; padding: 0; cursor: pointer;
}
.amb-dots button.active {
  width: 2.3rem; height: 2.3rem;
  background: transparent;
  border: .6rem solid var(--navy);
}
/* area di tocco ampia attorno ai pallini (il pallino visibile resta piccolo):
   i pallini da 10-13px sono difficili da centrare col dito → il tap "non funzionava" */
.amb-dots button, .amb-mdots button { position: relative; }
.amb-dots button::before, .amb-mdots button::before {
  content: ''; position: absolute; inset: -1.4rem;
}

/* ============ 08 PAZIENTI ============ */
.amb-pazienti { padding-top: 7.2rem; position: relative; z-index: 2; }
.amb-pazienti .amb-grid { margin-top: 3.3rem; }
.amb-pazienti .amb-grid + .amb-grid { margin-top: 1.3rem; }
.amb-paz-r1 { grid-template-columns: 56.8fr 27.4fr 42.1fr 42.1fr; }
.amb-paz-r2 { grid-template-columns: 27.4fr 71.5fr 42.1fr 27.4fr; }
.amb-paz-r3 { grid-template-columns: 34.6fr 32.7fr 69.5fr 31.4fr; }
.amb-pazienti::before {
  content: '';
  position: absolute;
  left: 12rem; top: -2.2rem;
  width: 19.4rem; height: 44.5rem;
  background: url('assets/img/deco-cane-bianco.png') no-repeat top center / 100% 100%;
  pointer-events: none;
  z-index: -1;
}

/* ============ 09 CONTATTI + FOOTER ============ */
.amb-contatti {
  margin-top: -40.4rem;
  background-image: url('assets/img/v2-contatti-top.svg'), linear-gradient(var(--navy), var(--navy));
  background-repeat: no-repeat;
  background-position: top center, left 20.9rem;
  background-size: 100% 21rem, 100% calc(100% - 20.8rem);
  position: relative;
  z-index: 1;
  color: #fff;
  padding-top: 54rem;
  padding-bottom: 0;   /* il cane/gatto/onda restano attaccati al fondo pagina */
}
.amb-contatti h2, .amb-contatti p, .amb-contatti h3 { color: #fff; }
.amb-contatti .amb-cols {
  display: grid;
  grid-template-columns: 73.5rem 86.2rem;
  gap: 14.7rem;
  align-items: start;
}
.amb-map figure img { width: 100%; aspect-ratio: 735/619; object-fit: cover; border-radius: 2rem; }
.amb-addr { display: block; margin-top: 1.6rem; text-align: center; font-style: normal; font-size: clamp(15px, 0.94vw, 18px); line-height: 1.5; color: #fff; }
.amb-addr a { color: #fff; text-decoration: none; }
.amb-addr a:hover { text-decoration: underline; text-underline-offset: .3rem; }
.amb-contatti-txt { padding-top: 1.6rem; }
.amb-contatti-txt h2 { white-space: nowrap; }
.amb-contatti-txt h2 + p { margin-top: .8rem; }
.amb-ccards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.1rem 2rem;
  margin-top: 4.7rem;
}
.amb-ccard {
  display: flex;
  align-items: center;
  gap: 2.2rem;
  background: var(--ice);
  border-radius: 4.1rem;
  min-height: 8.2rem;
  padding: 1rem 2.5rem;
}
.amb-ccard img {
  width: 5rem; height: 5rem;
  flex: 0 0 5rem;
  object-fit: contain;
}
.amb-ccard strong { display: block; font-size: 1.6rem; line-height: 1.3; text-transform: uppercase; color: var(--navy); }
.amb-ccard a, .amb-ccard span.v { font-size: 1.8rem; color: var(--navy); }
.amb-hours {
  margin-top: 3.5rem;
  background: rgba(255,255,255,.14);
  border-radius: 2rem;
  padding: 2rem 2.5rem;
  min-height: 19.6rem;
}
.amb-hours-head { display: flex; align-items: center; gap: 1.7rem; margin-bottom: 1.4rem; }
.amb-hours-head img {
  width: 5.5rem; height: 5.5rem;
  filter: brightness(0) invert(1);
}
.amb-hours-head p { font-size: 1.6rem; text-transform: uppercase; }
.amb-hours-cols { display: grid; grid-template-columns: 38.8rem 1fr; gap: .4rem 0; margin-left: 7.2rem; }
.amb-hours-cols .r { display: flex; gap: 3rem; font-size: 1.8rem; line-height: 3.2rem; color: #fff; }
.amb-hours-cols .r b { font-weight: 600; min-width: 4.2rem; }

.amb-contatti::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 44.4rem;
  background: url('assets/img/v3-footer-wave.svg') bottom center / 100% 100% no-repeat;
  pointer-events: none;
  z-index: 0;
}
.amb-contatti .amb-wrap { position: relative; z-index: 1; }
.amb-footer { text-align: center; position: relative; padding-top: 9.5rem; padding-bottom: 5rem; z-index: 1; }
.amb-footer .amb-logo-f img { height: 16.8rem; width: auto; margin: 0 auto; }
.amb-footer hr.amb-sep {
  width: 27rem;
  border: none;
  border-top: 1px solid rgba(255,255,255,.75);
  margin: 2.6rem auto 0;
}
.amb-footer .amb-piva { margin-top: 2.3rem; font-size: 1.6rem; line-height: 2.7rem; }
.amb-footer .amb-links { display: flex; justify-content: center; gap: 3.4rem; font-size: 1.6rem; margin-top: 3rem; color: #90AFC5; }
.amb-footer .amb-links a { color: #90AFC5; }
.amb-deco-dog {
  position: absolute;
  left: 5.6rem; bottom: 0;
  width: 24.2rem; height: 29rem;
  background: url('assets/img/deco-cane-white.png') no-repeat top center / 24.2rem auto;
  pointer-events: none;
  z-index: 2;
}
.amb-deco-cat {
  position: absolute;
  right: 1.8rem; bottom: 2.4rem;   /* gatto+tartaruga appoggiati sull'onda, non a filo fondo (come nel design) */
  width: 28.7rem; height: 33rem;
  background: url('assets/img/raggruppa_48.svg') no-repeat bottom center / contain;
  pointer-events: none;
  z-index: 2;
}

.amb-mcar, .amb-mdots { display: none; }
/* frecce dei caroselli foto mobile: nascoste su desktop (lì mostra le griglie) */
@media (min-width: 1000px) { .amb-slider:has(.amb-mcar) .amb-arrow { display: none; } }

/* pagine interne (privacy ecc.): contenuto + footer riempiono ESATTAMENTE 100vh (il contenuto
   cresce per 100vh MENO il footer, che resta della sua altezza naturale, in fondo alla viewport) */
.wp-site-blocks:has(.amb-page-plain) { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.amb-page-plain { box-sizing: border-box; flex: 1 0 auto; padding: 16rem 0 8rem; }
.amb-page-plain h1 { margin-bottom: 3rem; }
.amb-footer-min { background: var(--navy); color: #fff; text-align: center; padding: 2.4rem; font-size: 1.4rem; margin-top: 6rem; }
.amb-footer-min a { color: #fff; }

/* footer pagine interne = IDENTICO al footer homepage (.amb-footer dentro un contenitore
   navy con la stessa onda di .amb-contatti). Nessuna altezza forzata: la definisce .amb-footer. */
.amb-sitefooter { position: relative; background: var(--navy); color: #fff; overflow: hidden; }  /* testo bianco (in home lo dà .amb-contatti) */
.amb-sitefooter .amb-wrap { position: relative; z-index: 1; }  /* contenuto+decorazioni sopra l'onda, larghezza vincolata = home */
.amb-sitefooter::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 44.4rem;
  background: url('assets/img/v3-footer-wave.svg') bottom center / 100% 100% no-repeat;
  pointer-events: none;
  z-index: 0;
}

.amb-team .sec { color: var(--blue); }

/* floor leggibile in PX per i testi piccoli sul desktop (NON scalano col layout) */
.amb-nav a { font-size: clamp(13px, 0.78vw, 15px); }
.amb-hero .wp-block-button__link, .amb-btn { font-size: clamp(15px, 0.94vw, 18px); }
.amb-pill { font-size: clamp(15px, 0.94vw, 18px); }
.amb-acc summary { font-size: clamp(15px, 0.94vw, 18px); }
.amb-acc summary::after { font-size: clamp(15px, 0.94vw, 18px); }
.amb-acc details li { font-size: clamp(14px, 0.89vw, 17px); }
.amb-story p { font-size: clamp(15px, 0.94vw, 18px); }
.amb-ccard strong { font-size: clamp(13px, 0.83vw, 16px); }
.amb-ccard a, .amb-ccard span.v { font-size: clamp(15px, 0.94vw, 18px); }
.amb-hours-head p { font-size: clamp(13px, 0.83vw, 16px); }
.amb-hours-cols .r { font-size: clamp(15px, 0.94vw, 18px); }
.amb-footer .amb-piva, .amb-footer .amb-links { font-size: clamp(13px, 0.83vw, 16px); }

/* ============ 10 ANIMAZIONI + HOVER ============ */
/* rivelazione a scomparsa allo scroll (solo elementi sotto la piega, vedi amb.js) */
@media (prefers-reduced-motion: no-preference) {
  .amb-anim .amb-reveal { opacity: 0; transform: translateY(2.6rem); transition: opacity .7s ease, transform .7s cubic-bezier(.22,.61,.36,1); }
  .amb-anim .amb-reveal.amb-in { opacity: 1; transform: none; }
  .amb-anim .amb-cards > .amb-reveal:nth-child(2) { transition-delay: .08s; }
  .amb-anim .amb-cards > .amb-reveal:nth-child(3) { transition-delay: .16s; }
}
/* hover: sollevamento card + ombra */
.amb-card, .amb-team-card, .amb-ccard, .amb-pill, .amb-acc details { transition: transform .32s cubic-bezier(.22,.61,.36,1), box-shadow .32s ease; }
.amb-card:hover, .amb-team-card:hover { transform: translateY(-.8rem); box-shadow: 0 1.4rem 3.2rem rgba(31,80,126,.18); }
.amb-ccard:hover, .amb-pill:hover { transform: translateY(-.4rem); box-shadow: 0 1rem 2.4rem rgba(31,80,126,.14); }
.amb-acc details:hover { box-shadow: 0 .6rem 1.8rem rgba(0,0,0,.16); }
.amb-acc summary .amb-plus { transition: background .25s ease; }
.amb-acc summary:hover .amb-plus { background: #b9e4ff; }
/* zoom leggero delle foto al hover */
.amb-card figure, .amb-team-card figure { overflow: hidden; }
.amb-card figure img, .amb-team-card figure img, .amb-grid figure img { transition: transform .5s cubic-bezier(.22,.61,.36,1); }
.amb-card:hover figure img, .amb-team-card:hover figure img, .amb-grid figure:hover img { transform: scale(1.05); }
/* hover link testuali: sottolineatura + grassetto */
.amb-nav a { transition: color .2s ease; }
.amb-nav a:hover { text-decoration: underline; text-underline-offset: .3rem; text-decoration-thickness: .1em; text-shadow: .02em 0 0 currentColor; }
.amb-links a, .amb-ccard a, .amb-contatti-txt a, .amb-page-plain a { transition: color .2s ease; }
.amb-links a:hover, .amb-ccard a:hover, .amb-contatti-txt a:hover, .amb-page-plain a:hover { text-decoration: underline; text-underline-offset: .3rem; text-decoration-thickness: .1em; font-weight: 700; }

/* ============================================================
   MOBILE (<1000px) — design telefono 393 che RIEMPIE la larghezza (fluid).
   Pixel-perfect a 393.
   ============================================================ */
@media (max-width: 999px) {
  body { font-size: 1.5rem; line-height: 2rem; }
  h1 { font-size: 2.6rem; line-height: 3rem; }
  h2 { font-size: 2.6rem; line-height: 3rem; }
  h3 { font-size: 1.4rem; line-height: 2rem; }
  .amb-wrap { padding-left: 2rem; padding-right: 2rem; }

  .amb-header-in { padding: 1.8rem 2rem; }
  .amb-logo img { height: 6.95rem; }
  .amb-nav {
    display: none;
    position: absolute;
    top: 100%; left: 0; right: 0;
    background: #fff;
    flex-direction: column;
    gap: 1rem;
    padding: 2rem;
    box-shadow: 0 1rem 2rem rgba(31,80,126,.15);
  }
  .amb-nav.open { display: flex; }
  .amb-nav a { text-align: center; }
  .amb-burger {
    display: block;
    position: relative;
    width: 5rem; height: 5rem;
    border-radius: 50%;
    background: var(--sky);
    border: none;
    cursor: pointer;
    padding: 0;
  }
  .amb-burger span, .amb-burger span::before, .amb-burger span::after {
    content: '';
    position: absolute;
    height: .2rem;
    border-radius: .1rem;
    background: var(--navy);
  }
  .amb-burger span { top: 2.45rem; left: 1.28rem; width: 2.45rem; }
  .amb-burger span::before { top: -.55rem; left: 0; width: 2.45rem; }
  .amb-burger span::after { top: .55rem; left: 0; width: 1.75rem; }

  /* hero mobile: immagine SEMPRE di background (cover), altezza fissa ~818px
     (NON aspect-ratio, altrimenti su tablet diventava altissima) */
  /* l'immagine bg-hero-mobile.png È il maschera: foto opaca + taglio a ONDA trasparente in basso.
     Mettendo il NAVY come colore di sfondo, l'onda trasparente mostra il navy = l'arco (forma del
     design, dentro l'immagine stessa). Niente SVG sopra. `right bottom` tiene l'arco al fondo. */
  .amb-hero {
    height: 81.8rem;
    background: #fff url('assets/img/bg-hero-mobile.png') no-repeat right bottom / cover;
    background-image: image-set(url('assets/img/bg-hero-mobile.webp') type('image/webp'), url('assets/img/bg-hero-mobile.png') type('image/png'));
    padding-top: 12.4rem;
  }
  /* spazi ridotti per alzare la CTA sopra la faccia del gatto (con cover il gatto sale un po'
     alle larghezze grandi; alzando la CTA resta libero) */
  .amb-hero h1 { margin-bottom: 2.3rem; }
  .amb-hero p { max-width: 35.2rem; margin-bottom: 0; }
  .amb-hero p:first-of-type { margin-bottom: 1.8rem; }
  .amb-hero p:last-of-type { margin-bottom: 1.3rem; }
  .amb-hero .wp-block-button__link, .amb-btn {
    width: auto; min-width: 0; max-width: 100%;   /* niente più overflow (la base aveva min-width 42.1rem = 421px) */
    height: 4.45rem; line-height: 4.45rem;
    font-size: 1.4rem; border-radius: 2.3rem; padding: 0 2.6rem;
  }

  .amb-chi { margin-top: 5.6rem; }
  .amb-navy .amb-cols, .amb-contatti .amb-cols { grid-template-columns: 1fr; gap: 0; }
  /* chi-siamo: row-gap stacca la foto dalla lista pill (il margin perde contro il reset WP .is-layout-flow) */
  .amb-chi .amb-cols { grid-template-columns: 1fr; row-gap: 6rem; }
  .amb-col-txt { padding-top: 0; }
  .amb-col-img { order: 2; }
  .amb-chi h2 { max-width: 34rem; line-height: 3rem; margin-bottom: 2.9rem; }
  .amb-chi h2 + p { max-width: 35.2rem; line-height: 2rem; margin-bottom: 3.2rem; }
  .amb-label { margin-bottom: 1.7rem; }
  .amb-chi figure img { aspect-ratio: 353/245; }
  .amb-servizi .amb-cards > *:nth-child(3)::before { display: none; }  /* decorazione solo su desktop */
  .amb-pills { grid-template-columns: 1fr; gap: .8rem; }
  .amb-pill { min-height: 6.9rem; border-radius: 2rem; padding: 0 2rem 0 2.95rem; gap: 1.7rem; font-size: 1.5rem; }
  .amb-pill img { width: 4.6rem; flex-basis: 4.6rem; }
  .amb-pills .amb-pill:nth-child(1) { order: 1; }
  .amb-pills .amb-pill:nth-child(2) { order: 3; }
  .amb-pills .amb-pill:nth-child(3) { order: 2; }
  .amb-pills .amb-pill:nth-child(4) { order: 4; }

  .amb-servizi { padding-top: 7.4rem; padding-bottom: 5.5rem; }  /* stacca il bianco dalla fascia blu */
  .amb-servizi .amb-cards { grid-template-columns: 1fr; gap: 1.85rem; }
  .amb-card { padding: .9rem .9rem 1.4rem; border-radius: 1.6rem; }
  .amb-card figure img { aspect-ratio: 334/180; border-radius: 1.5rem; }
  .amb-card h3 { margin: 2.6rem 0 1.2rem; font-size: 1.4rem; line-height: 1.4rem; }
  .amb-card p { font-size: 1.4rem; line-height: 2rem; }

  .amb-navy {
    margin-top: 0;
    min-height: 0;
    background: var(--navy);
    background-image: none;
    padding-bottom: 41rem;
  }
  .amb-navy::before, .amb-navy::after { display: none; }
  .amb-tutti-left { padding-top: 8rem; }
  .amb-tutti-imgs { padding-top: 4.5rem; }
  .amb-acc { margin-top: 3.9rem; gap: 1.3rem; }
  .amb-acc details { border-radius: 3.6rem; }
  .amb-acc summary { min-height: 9.9rem; padding: 1rem 5.2rem 1rem 7.25rem; font-size: 1.4rem; line-height: 1.29; }
  .amb-acc summary::after { font-size: 1.35rem; line-height: 1.41; }
  .amb-acc summary::before { left: 1.35rem; width: 4rem; height: 4rem; }
  .amb-acc summary .amb-plus { width: 4.2rem; height: 4.2rem; line-height: 4.2rem; font-size: 2.4rem; right: .8rem; }
  .amb-acc details ul { margin: 0 1.6rem 2rem; padding: 1.8rem 2rem; }
  .amb-acc details li { font-size: 1.4rem; line-height: 1.43; }
  .amb-tutti-imgs > figure img { aspect-ratio: 353/153; }
  .amb-timgs-row { grid-template-columns: 208fr 138fr; gap: .7rem; margin-top: .5rem; }
  .amb-timgs-row figure:first-child img { aspect-ratio: 208/175; }
  .amb-timgs-row figure:last-child img { aspect-ratio: 138/175; }
  .amb-tecno-head { clear: none; padding-top: 8.4rem; }

  .amb-tecno-r1, .amb-tecno-r2, .amb-paz-r1, .amb-paz-r2, .amb-paz-r3 { display: none; }
  .amb-mcar {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    touch-action: pan-x;          /* swipe orizzontale pulito su mobile */
    scroll-snap-type: x proximity;
    scroll-behavior: smooth;
    scrollbar-width: none;
    margin: 2.5rem -2rem 0;
    padding: 0 2rem;
  }
  .amb-mcar::-webkit-scrollbar { display: none; }
  .amb-mcar figure { margin: 0; scroll-snap-align: start; }
  .amb-mcar figure img { width: 100%; object-fit: cover; border-radius: 2rem; }
  .amb-mcar--tecno figure { flex: 0 0 24.5rem; }
  .amb-mcar--tecno figure img { height: 21.3rem; }
  .amb-mcar--paz figure { flex: 0 0 30.15rem; }
  .amb-mcar--paz figure img { height: 18.25rem; }
  .amb-mdots { display: flex; justify-content: center; align-items: center; gap: 1.6rem; margin-top: 2.1rem; }
  .amb-mdots button { width: 1rem; height: 1rem; border-radius: 50%; border: none; padding: 0; cursor: pointer; background: rgba(255,255,255,.5); }
  /* carosello su fascia NAVY: pallino attivo con bordo BIANCO (l'anello navy non si vedeva).
     .amb-dots.amb-mdots vince su .amb-dots button.active (che è navy, per lo slider storie su chiaro) */
  .amb-dots.amb-mdots button.active { width: 1.75rem; height: 1.75rem; background: transparent; border: .35rem solid #fff; }

  .amb-team { margin-top: -33.4rem; padding-top: 0; }
  .amb-team-panel { max-width: none; margin: 0; padding: 4.75rem 2.2rem 0; border-radius: 2rem; }
  .amb-team-cards { grid-template-columns: 1fr; gap: 2.1rem; margin-top: 3.5rem; margin-block-end: -21.4rem !important; }
  .amb-team-card { padding: 1.1rem .8rem 1.9rem; border-radius: 2rem; }
  .amb-team-card figure img { aspect-ratio: 291/168; border-radius: 1.8rem; }
  .amb-team-card h3 { margin: 3.15rem 0 2.4rem; font-size: 1.5rem; line-height: 1.5rem; }
  .amb-team-card p { max-width: none; font-size: 1.5rem; line-height: 2rem; }
  .amb-team::after { display: none; }

  .amb-storie {
    padding-top: 27.7rem;
    padding-bottom: 8rem;
    background: linear-gradient(180deg, #FBFCFE 0%, #E9F3FC 20%, #EDF5FC 50%, #F3F8FD 85%, #F7FAFE 100%);
  }
  .amb-storie::before, .amb-storie::after { display: none; }
  .amb-intro { max-width: 35.2rem; margin-top: 2rem; }
  .amb-carousel { padding: 3rem 2.7rem 3.4rem; gap: 1.9rem; }
  .amb-story {
    flex: 0 0 33.9rem;
    min-height: 0;
    grid-template-columns: 1fr;
    gap: 2.35rem;
    padding: 1.45rem 2rem 2.1rem;
    box-shadow: 0 0 1.4rem rgba(31,80,126,.16);
  }
  .amb-story figure { height: auto; }
  .amb-story figure img { aspect-ratio: 299/174; height: auto; }
  .amb-story .amb-story-txt { align-self: start; }
  .amb-story h3 { margin-bottom: 1.6rem; line-height: 2rem; }
  .amb-story p { font-size: 1.4rem; line-height: 2rem; }
  .amb-dots { gap: 1.1rem; }
  .amb-dots button { width: 1rem; height: 1rem; background: #88ABC5; }
  .amb-dots button.active { width: 1.75rem; height: 1.75rem; background: transparent; border: .35rem solid var(--navy); }

  .amb-pazienti { padding-top: 6.7rem; }
  .amb-pazienti .amb-mcar { margin-top: 2.1rem; }
  .amb-pazienti::before { display: none; }

  .amb-contatti {
    margin-top: -8.6rem;
    padding-top: 19.6rem;
    background-image: none;
    background-color: var(--navy);
  }
  .amb-contatti-txt { padding-top: 0; }
  .amb-contatti-txt h2 { white-space: normal; }
  .amb-contatti-txt h2 + p { margin-top: 1.6rem; max-width: 35.2rem; margin-left: auto; margin-right: auto; }
  .amb-contatti .amb-cols { text-align: center; }
  .amb-map { order: 2; }
  .amb-map figure img { aspect-ratio: 353/297; }
  .amb-ccards { grid-template-columns: 1fr; gap: 1.15rem; margin-top: 3.5rem; }
  .amb-ccard { min-height: 6.5rem; border-radius: 3.25rem; padding: 1rem 2.5rem; gap: 2.3rem; text-align: left; }
  .amb-ccard img { width: 4rem; height: 4rem; flex-basis: 4rem; }
  .amb-hours { min-height: 0; margin-top: 3.15rem; padding: 1.9rem 2.7rem; background: #4A7499; }
  .amb-hours-head { gap: 2.1rem; margin-bottom: 3.4rem; justify-content: flex-start; }
  .amb-hours-head img { width: 4.65rem; height: 3.65rem; }
  .amb-hours-head p { font-size: 1.5rem; text-align: left; }  /* titolo orari allineato a sinistra, non centrato */
  .amb-hours-cols { grid-template-columns: 1fr; gap: 0; margin-left: 2.8rem; }
  .amb-hours-cols .r { font-size: 1.5rem; line-height: 3.2rem; gap: 1.6rem; white-space: nowrap; }
  .amb-hours-cols .r b { min-width: 3.4rem; }
  .amb-map { margin-top: 2.8rem; }
  .amb-footer { padding-top: 7.45rem; padding-bottom: 16.5rem; }  /* più aria tra privacy/copyright e le decorazioni al fondo */
  .amb-footer .amb-logo-f img { height: 7.75rem; }
  .amb-footer hr.amb-sep { width: 18.8rem; margin: 1.8rem auto 0; }
  .amb-footer .amb-piva { margin-top: 2.3rem; font-size: 1.6rem; line-height: 2.65rem; }
  .amb-footer .amb-links { gap: 4.25rem; font-size: 1.5rem; margin-top: 3.25rem; }
  .amb-deco-dog { left: 2rem; width: 9rem; height: 11rem; background: url('assets/img/deco-cane-white.png') no-repeat top center / 9rem auto; z-index: 2; }
  .amb-deco-cat { right: 2rem; bottom: 3rem; width: 9.5rem; height: 11rem; background: url('assets/img/raggruppa_48.svg') no-repeat bottom center / contain; z-index: 2; }  /* rialzato: testa del gatto sempre sul navy, sopra l'onda azzurra */
  .amb-contatti::after { height: 13.4rem; background: url('assets/img/mobile-footer-wave.svg') bottom center / 100% 100% no-repeat; }
  /* footer pagine interne su mobile: onda mobile + altezza definita dal contenuto */
  .amb-sitefooter { min-height: 0; }
  .amb-sitefooter::after { height: 13.4rem; background: url('assets/img/mobile-footer-wave.svg') bottom center / 100% 100% no-repeat; }
}

/* ---- tablet 600-999: le card non restano enormi in colonna singola ---- */
@media (min-width: 600px) and (max-width: 999px) {
  .amb-servizi .amb-cards { grid-template-columns: 1fr 1fr; }
  .amb-team-cards { grid-template-columns: 1fr 1fr; }
  .amb-ccards { grid-template-columns: 1fr 1fr; }
  /* contatti resta a colonna singola anche su tablet: la mappa va sotto (order:2), non a fianco */
  .amb-chi .amb-cols { grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
  .amb-col-img { order: -1; margin-top: 0; }
  .amb-mcar--tecno figure { flex: 0 0 32rem; }
  .amb-mcar--tecno figure img { height: 26rem; }
  .amb-mcar--paz figure { flex: 0 0 38rem; }
  .amb-mcar--paz figure img { height: 24rem; }
}

@media (min-width: 1921px) {
  .amb-hero { background-size: cover; }
}