/* ═══════════════════════════════════════════════════════════════════════
   EliteRak — /home-v2/ — terza stesura, sul pacchetto ELITERAK_HOME_V2.

   Token e proporzioni vengono da docs/DESIGN_AND_MOTION.md del pacchetto.
   La pagina e' una sequenza compatta di scene, non un documento: le stesure
   precedenti erano un folio da rivista (indice, capitoli, 29 schede) e poi
   una versione giusta nello spirito ma con corse di scorrimento vuote lunghe
   due schermate e mezzo.

   ALTEZZE DELLE IMMAGINI. Il tema dichiara img{height:auto} e su questo sito
   ha gia' schiacciato delle immagini a piena larghezza: ogni lastra ha
   altezza esplicita sul contenitore e height:100%+object-fit sull'immagine,
   con specificita' di classe.

   MOVIMENTO. Niente GSAP e nessun CDN: parallasse leggera con rAF, comparse
   con IntersectionObserver, dissolvenza delle atmosfere, linea del tempo che
   si disegna. Gli stati di partenza vivono sotto html.erh2-js, classe che
   assets/home-v2.js aggiunge come prima cosa: senza JavaScript la pagina e'
   gia' finita e non resta niente di invisibile.

   LITESPEED. Se la pagina esce senza animazioni, UCSS ha tolto le regole
   .erh2-js che non vede usate: escludere /home-v2/.
   ═══════════════════════════════════════════════════════════════════════ */

.erh2 {
  --ink:       #12120f;
  --ink-2:     #191814;
  --ink-3:     #211f1a;
  --cream:     #e9e1d2;
  --cream-2:   #f2ece0;
  --light:     #f5efe5;
  --gold:      #b9985e;
  --on-cream:  #22201b;
  --rule-dark: rgba(245,239,229,.18);
  --rule-light:rgba(34,32,27,.16);

  --display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --ui:      'Jost', system-ui, -apple-system, 'Helvetica Neue', sans-serif;

  --inset: 5.8vw;
  --ease: cubic-bezier(.22,.61,.36,1);

  margin: 0; padding: 0;
  background: var(--ink); color: var(--light);
  font-family: var(--ui); font-weight: 300; font-size: 16px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
.erh2 *, .erh2 *::before, .erh2 *::after { box-sizing: border-box; }
.erh2 img { max-width: 100%; }
.erh2 a { color: inherit; text-decoration: none; }
.erh2 h1, .erh2 h2, .erh2 h3 { margin: 0; font-weight: 300; }
.erh2 p { margin: 0 0 1em; }
.erh2 ul, .erh2 ol { margin: 0; padding: 0; list-style: none; }
.erh2 :focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

html:has(.erh2) { scroll-padding-top: 88px; }
@media (max-width: 700px) { html:has(.erh2) { scroll-padding-top: 70px; } }
.erh2 [id] { scroll-margin-top: 88px; }

.erh2-sr, .erh2-offscreen {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.erh2-skip { position: absolute; left: -9999px; top: 0; z-index: 999; background: var(--gold); color: var(--ink); padding: 14px 22px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.erh2-skip:focus { left: 8px; top: 8px; }

/* ───────── tipografia ───────── */

.erh2-display { font-family: var(--display); font-weight: 300; line-height: 1; letter-spacing: -.015em; }
.erh2-h2 { font-size: clamp(34px, 3.4vw, 49px); margin: 0 0 22px; }

.erh2-eyebrow {
  font-size: 10px; letter-spacing: .34em; text-transform: uppercase;
  color: var(--gold); margin: 0 0 18px; font-weight: 400;
  display: flex; align-items: center; gap: 12px;
}
.erh2-num { font-family: var(--display); font-size: 15px; letter-spacing: .04em; }
.erh2-eyebrow .erh2-num::after { content: ''; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin-left: 12px; opacity: .6; }

.erh2-lede { font-size: 14.5px; line-height: 1.75; color: rgba(245,239,229,.66); max-width: 40ch; }

.erh2-mask { display: block; overflow: hidden; padding-bottom: .06em; }
.erh2-line { display: block; }.erh2 
/* ═══════════════════════════════════════════════════════════════════════
   PERCHE' OGNI SELETTORE INTERATTIVO QUI SOTTO E' PREFISSATO CON .erh2
   reset.css del tema si carica DOPO questo foglio e dichiara:
     [type=button],[type=submit],button { border:1px solid #c36; color:#c36 }
     input[type=text],input[type=email],... { border:1px solid #666; padding:.5rem 1rem }
   `[type=button]` pesa (0,1,0) esattamente come una classe, e `input[type=text]`
   pesa (0,1,1) come `.erh2-f input`. A parita' di peso vince l'ultimo foglio
   caricato, cioe' il tema: i bottoni uscivano col bordo rosa e diventavano
   fucsia al passaggio del mouse, gli input col bordo grigio del tema.
   Il prefisso porta a (0,2,0)/(0,2,1) e chiude la questione.
   Terza volta che questo sito inciampa qui: maggiore specificita', non pari.
   ═══════════════════════════════════════════════════════════════════════ */
/* ───────── bottoni ───────── */

.erh2-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 11px;
  font-family: var(--ui); font-size: 10.5px; font-weight: 400; letter-spacing: .2em;
  text-transform: uppercase; padding: 15px 28px; min-height: 44px;
  border: 1px solid transparent; cursor: pointer; white-space: nowrap;
  transition: background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}.erh2 .erh2-btn i { font-style: normal; transition: transform .35s var(--ease); }.erh2 .erh2-btn:hover i { transform: translateX(4px); }.erh2 .erh2-btn.is-solid { background: var(--light); color: var(--ink); }.erh2 .erh2-btn.is-solid:hover { background: #fff; }.erh2 .erh2-btn.is-line { border-color: rgba(245,239,229,.4); color: var(--light); }.erh2 .erh2-btn.is-line:hover { border-color: var(--light); background: rgba(245,239,229,.08); }.erh2 .erh2-btn.is-line.is-dark { border-color: rgba(34,32,27,.3); color: var(--on-cream); }.erh2 .erh2-btn.is-line.is-dark:hover { border-color: var(--gold); color: var(--gold); background: transparent; }.erh2 .erh2-btn.is-sm { padding: 11px 20px; font-size: 10px; min-height: 40px; }.erh2 .erh2-round {
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(245,239,229,.34);
  background: transparent; color: var(--light); cursor: pointer; font-size: 15px;
  display: inline-flex; align-items: center; justify-content: center;
  transition: border-color .3s, background .3s;
}.erh2 .erh2-round:hover { border-color: var(--light); background: rgba(245,239,229,.08); }.erh2 .erh2-round[disabled] { opacity: .32; cursor: default; }


/* Il reset del tema arrotonda gli angoli e colora l'hover di fucsia: qui gli
   angoli sono vivi e l'hover lo decidono le regole sopra. */
.erh2 .erh2-btn, .erh2 .erh2-stepbtn, .erh2 .erh2-steps-go, .erh2 .erh2-mood,
.erh2 .erh2-f input, .erh2 .erh2-f select, .erh2 .erh2-f textarea,
.erh2 .erh2-step input, .erh2 .erh2-step select { border-radius: 0; }
.erh2 .erh2-round { border-radius: 50%; }
.erh2 .erh2-btn:hover, .erh2 .erh2-btn:focus,
.erh2 .erh2-stepbtn:hover, .erh2 .erh2-mood:hover, .erh2 .erh2-round:hover { text-decoration: none; }

/* ───────── navigazione ───────── */

.erh2-nav {
  position: fixed; inset: 0 0 auto 0; z-index: 90;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 18px var(--inset);
  transition: background .4s var(--ease), padding .4s var(--ease), border-color .4s var(--ease);
  border-bottom: 1px solid transparent;
}
.erh2-nav.is-stuck { background: rgba(18,18,15,.92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); padding-top: 12px; padding-bottom: 12px; border-bottom-color: var(--rule-dark); }
body.admin-bar .erh2-nav { top: 32px; }
@media (max-width: 782px) { body.admin-bar .erh2-nav { top: 46px; } }

.erh2-mark { display: flex; align-items: center; gap: 10px; }
.erh2-mark-arch { display: block; width: 19px; color: var(--gold); flex: 0 0 auto; }
.erh2-mark-arch svg { width: 100%; height: auto; display: block; }
.erh2-mark-txt { display: flex; flex-direction: column; line-height: 1; }
.erh2-mark-name { font-family: var(--display); font-size: 17px; letter-spacing: .3em; color: var(--light); }
.erh2-mark-sub { font-size: 7.5px; letter-spacing: .46em; color: var(--gold); margin-top: 5px; }

.erh2-menu { display: flex; align-items: center; gap: 30px; }
.erh2-menu ul { display: flex; gap: 30px; }
.erh2-menu a { font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: rgba(245,239,229,.76); padding: 6px 0; border-bottom: 1px solid transparent; transition: color .3s, border-color .3s; }
.erh2-menu ul a:hover { color: var(--light); border-bottom-color: var(--gold); }.erh2 .erh2-burger { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; background: transparent; border: 0; color: var(--light); cursor: pointer; }.erh2 .erh2-burger-bars { display: block; width: 22px; }.erh2 .erh2-burger-bars i { display: block; height: 1px; background: currentColor; margin: 5px 0; transition: transform .3s var(--ease); }.erh2 .erh2-burger[aria-expanded="true"] .erh2-burger-bars i:first-child { transform: translateY(3px) rotate(45deg); }.erh2 .erh2-burger[aria-expanded="true"] .erh2-burger-bars i:last-child { transform: translateY(-3px) rotate(-45deg); }

/* ───────── HERO ───────── */

.erh2-hero { position: relative; height: 100svh; min-height: 540px; overflow: hidden; display: flex; align-items: flex-end; }
.erh2-hero-frame { position: absolute; inset: 0; overflow: hidden; }
.erh2 .erh2-hero-frame .erh2-img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; display: block; }
.erh2-hero-scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(to top, rgba(18,18,15,.9) 0%, rgba(18,18,15,.44) 34%, rgba(18,18,15,.05) 60%, rgba(18,18,15,.44) 100%),
    linear-gradient(to right, rgba(18,18,15,.6) 0%, rgba(18,18,15,0) 58%);
}
.erh2-hero-in { position: relative; z-index: 2; padding: 0 var(--inset) clamp(92px, 12vh, 150px); max-width: 1180px; }
.erh2-hero-h1 { font-size: clamp(40px, 5.3vw, 76px); margin: 0 0 20px; }
.erh2-hero-sub { font-size: clamp(12.5px, 1.05vw, 14.5px); letter-spacing: .16em; color: rgba(245,239,229,.8); margin: 0 0 30px; }
.erh2-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.erh2-hero-side { position: absolute; right: var(--inset); top: 46%; z-index: 2; margin: 0; font-size: 9px; letter-spacing: .28em; text-transform: uppercase; color: rgba(245,239,229,.5); text-align: right; line-height: 2.1; }
.erh2-scrollcue { position: absolute; left: var(--inset); bottom: 38px; z-index: 3; display: flex; align-items: center; gap: 12px; font-size: 8.5px; letter-spacing: .28em; text-transform: uppercase; color: rgba(245,239,229,.56); }
.erh2-scrollcue-ring { position: relative; width: 24px; height: 24px; border: 1px solid rgba(245,239,229,.34); border-radius: 50%; display: block; flex: 0 0 auto; }
.erh2-scrollcue-ring i { position: absolute; left: 50%; top: 50%; width: 1px; height: 8px; background: var(--gold); transform: translate(-50%,-60%); }

/* ───────── 01 ARRIVAL — crema 36% / foto 64% ───────── */

.erh2-arrival { display: grid; grid-template-columns: 36% 64%; background: var(--cream); color: var(--on-cream); align-items: center; }
.erh2-arrival-text { padding: clamp(46px, 6vw, 84px) clamp(22px, 3vw, 54px) clamp(46px, 6vw, 84px) var(--inset); }
.erh2-arrival .erh2-eyebrow { color: #8a6a3a; }
.erh2-arrival .erh2-lede { color: rgba(34,32,27,.68); }
.erh2-ticks { margin: 24px 0 28px; }
.erh2-ticks li { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--rule-light); font-size: 12.5px; letter-spacing: .08em; color: rgba(34,32,27,.8); }
.erh2-ticks li::before { content: ''; width: 17px; height: 1px; background: #8a6a3a; flex: 0 0 auto; }
.erh2-arrival-media { position: relative; overflow: hidden; min-height: clamp(360px, 46vw, 560px); }
.erh2 .erh2-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.erh2 .erh2-arrival-media .erh2-img { object-position: 58% 50%; }

/* ───────── 02 STAYS — titolo 33% / tre schede 67% ───────── */

.erh2-stays { background: var(--ink); display: grid; grid-template-columns: 33% 67%; align-items: center; gap: 0; padding: clamp(54px, 7vw, 96px) 0; }
.erh2-stays-head { padding: 0 clamp(20px, 2.6vw, 46px) 0 var(--inset); }
.erh2-stays-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; padding-right: var(--inset); }
/* I cinque tipi di soggiorno, come riga di testo sotto le schede.
   `grid-column: 1 / -1` perche .erh2-stays e una griglia 33%/67%: senza, il
   blocco e il TERZO figlio e finisce nella colonna del titolo, incolonnato su
   quattro righe in meta pagina. */
.erh2-stays-more { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline;
  gap: 10px 18px; padding: 30px var(--inset) 0; font-size: 14px; line-height: 1.5; }
.erh2-stays-more-lead { opacity: .62; }
.erh2-stays-more a { text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 1px; }
.erh2-stays-more a:hover { opacity: .68; }
.erh2-staycard { position: relative; display: block; height: clamp(300px, 27vw, 400px); overflow: hidden; }
.erh2-staycard-media { position: absolute; inset: 0; display: block; background: var(--ink-3); }
.erh2-staycard-scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(18,18,15,.88) 0%, rgba(18,18,15,.2) 54%, rgba(18,18,15,.06) 100%); }
.erh2-staycard-in { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 22px clamp(16px, 1.5vw, 24px); display: block; transition: transform .5s var(--ease); }
.erh2-staycard:hover .erh2-staycard-in { transform: translateY(-5px); }
.erh2-staycard-name { display: block; font-family: var(--ui); font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--light); margin-bottom: 8px; }
.erh2-staycard-copy { display: block; font-size: 12.5px; line-height: 1.55; color: rgba(245,239,229,.6); }

/* ───────── 03 HANDPICKED ───────── */

.erh2-props { position: relative; overflow: hidden; padding: clamp(60px, 8vw, 110px) 0; }
.erh2-props-bg { position: absolute; inset: 0; }
.erh2 .erh2-props-bg .erh2-img { object-position: 50% 56%; }
.erh2-props-scrim { position: absolute; inset: 0; background: linear-gradient(to right, rgba(18,18,15,.92) 0%, rgba(18,18,15,.7) 46%, rgba(18,18,15,.5) 100%); }
.erh2-props-in { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(26px, 4vw, 70px); align-items: center; padding: 0 var(--inset); }
.erh2-props-text .erh2-lede { margin-bottom: 26px; }

.erh2-carousel { position: relative; }
.erh2-carousel-track { position: relative; }
.erh2-slide { display: grid; grid-template-columns: 1fr; gap: 16px; }
.erh2-slide[aria-hidden="true"] { display: none; }
.erh2-slide-media { display: block; position: relative; height: clamp(230px, 22vw, 330px); overflow: hidden; background: var(--ink-3); }
.erh2-slide-name { font-size: clamp(22px, 1.9vw, 30px); margin: 0 0 6px; }
.erh2-slide-kind { font-size: 9.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin: 0 0 12px; }
.erh2-slide-facts { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.erh2-slide-facts li { font-size: 12.5px; color: rgba(245,239,229,.66); }
.erh2-slide-facts li.is-soft { color: rgba(245,239,229,.44); font-style: italic; }
.erh2-carousel-ui { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 20px; }
.erh2-carousel-count { font-family: var(--display); font-size: 19px; color: var(--gold); margin: 0; letter-spacing: .06em; }
.erh2-carousel-count span + span { font-size: 12px; color: rgba(245,239,229,.4); }
.erh2-carousel-btns { display: flex; gap: 10px; }

/* ───────── 04 EXPERIENCES — titolo 32.5% / quattro verticali ───────── */

.erh2-exp { background: var(--cream-2); color: var(--on-cream); display: grid; grid-template-columns: 32.5% 67.5%; align-items: center; padding: clamp(54px, 7vw, 96px) 0; }
.erh2-exp-head { padding: 0 clamp(20px, 2.6vw, 46px) 0 var(--inset); }
.erh2-exp .erh2-eyebrow { color: #8a6a3a; }
.erh2-exp .erh2-lede { color: rgba(34,32,27,.64); }
.erh2-exp-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; padding-right: var(--inset); }
.erh2-expcard { position: relative; display: block; height: clamp(260px, 24vw, 360px); overflow: hidden; }
.erh2-expcard-media { position: absolute; inset: 0; display: block; background: var(--ink-3); }
.erh2-expcard-scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(18,18,15,.9) 0%, rgba(18,18,15,.2) 56%, rgba(18,18,15,.04) 100%); }
.erh2-expcard-in { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 20px clamp(14px, 1.2vw, 20px); display: block; transition: transform .5s var(--ease); }
.erh2-expcard:hover .erh2-expcard-in { transform: translateY(-5px); }
.erh2-expcard-name { display: block; font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--light); margin-bottom: 7px; }
.erh2-expcard-copy { display: block; font-size: 12px; line-height: 1.55; color: rgba(245,239,229,.6); }

/* ───────── 05 EVENTS ───────── */

.erh2-events { position: relative; overflow: hidden; min-height: clamp(380px, 40vw, 560px); display: flex; align-items: center; }
.erh2-events-bg { position: absolute; inset: 0; }
.erh2 .erh2-events-bg .erh2-img { object-position: 50% 59%; }
.erh2-events-scrim { position: absolute; inset: 0; background: linear-gradient(to right, rgba(18,18,15,.9) 0%, rgba(18,18,15,.5) 48%, rgba(18,18,15,.22) 100%); }
.erh2-events-in { position: relative; z-index: 2; padding: clamp(50px, 6vw, 90px) var(--inset); max-width: 760px; }
.erh2-events-list { display: flex; flex-wrap: wrap; gap: 9px 24px; margin: 0 0 26px; }
.erh2-events-list li { font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase; color: rgba(245,239,229,.68); }
.erh2-events-list li a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(201,168,76,.55); padding-bottom: 2px; transition: color .3s, border-color .3s; }
.erh2-events-list li a:hover { color: var(--gold-light, #E8D5A3); border-color: currentColor; }

/* ───────── 06 FINDER ───────── */

.erh2-finder { background: var(--cream); color: var(--on-cream); padding: clamp(44px, 5.5vw, 76px) var(--inset); }
.erh2-finder-in { max-width: 1360px; margin: 0 auto; display: grid; grid-template-columns: minmax(240px, 32%) 1fr; gap: clamp(26px, 4vw, 60px); align-items: center; }
.erh2-finder .erh2-eyebrow { color: #8a6a3a; }
.erh2-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--rule-light); border: 1px solid var(--rule-light); }.erh2-step { background: var(--cream); padding: 16px clamp(12px, 1.2vw, 20px); display: flex; flex-direction: column; gap: 7px; }
.erh2-step-n { font-family: var(--display); font-size: 14px; color: #8a6a3a; }.erh2 .erh2-step label { font-size: 9px; letter-spacing: .2em; text-transform: uppercase; color: rgba(34,32,27,.54); }.erh2 .erh2-step select, .erh2 .erh2-step input {
  font-family: var(--ui); font-size: 16px; font-weight: 300; color: var(--on-cream);
  background: transparent; border: 0; padding: 3px 0; border-radius: 0;
  appearance: none; -webkit-appearance: none; width: 100%; min-height: 28px;
}.erh2 .erh2-step select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' stroke='%238a6a3a'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 2px center; padding-right: 18px; cursor: pointer; }.erh2 .erh2-stepper { display: flex; align-items: center; gap: 4px; }.erh2 .erh2-stepper input { text-align: center; -moz-appearance: textfield; }.erh2 .erh2-stepper input::-webkit-outer-spin-button, .erh2 .erh2-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }.erh2 .erh2-stepbtn { width: 30px; height: 30px; border: 1px solid var(--rule-light); background: transparent; color: var(--on-cream); cursor: pointer; font-size: 14px; line-height: 1; flex: 0 0 auto; }.erh2 .erh2-stepbtn:hover { border-color: #8a6a3a; color: #8a6a3a; }.erh2 .erh2-steps-go { grid-column: 1 / -1; width: 100%; background: var(--ink); color: var(--light); border: 1px solid var(--ink); }.erh2 .erh2-steps-go:hover { background: var(--ink-2); }
.erh2-steps-note { grid-column: 1 / -1; margin: 10px 0 0; font-size: 11.5px; color: rgba(34,32,27,.56); }

/* ───────── 07 DREAM ───────── */

.erh2-dream { position: relative; overflow: hidden; min-height: clamp(400px, 42vw, 600px); display: flex; align-items: center; }
.erh2-dream-bg { position: absolute; inset: 0; }
.erh2-dream-bg .erh2-img { position: absolute; inset: 0; object-position: 50% 45%; }
.erh2-dream-over { opacity: 0; transition: opacity .7s var(--ease); }
.erh2-dream-scrim { position: absolute; inset: 0; background: linear-gradient(to right, rgba(18,18,15,.92) 0%, rgba(18,18,15,.6) 48%, rgba(18,18,15,.3) 100%); }
.erh2-dream-in { position: relative; z-index: 2; padding: clamp(50px, 6vw, 88px) var(--inset); max-width: 980px; }.erh2 .erh2-moods { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 30px; }.erh2 .erh2-mood { display: flex; align-items: center; gap: 10px; padding: 7px 16px 7px 7px; border: 1px solid rgba(245,239,229,.28); background: transparent; color: rgba(245,239,229,.78); cursor: pointer; font-family: var(--ui); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; min-height: 44px; transition: border-color .3s, color .3s, background .3s; }.erh2 .erh2-mood:hover { border-color: rgba(245,239,229,.6); color: var(--light); }.erh2 .erh2-mood[aria-pressed="true"] { background: var(--light); border-color: var(--light); color: var(--ink); }.erh2 .erh2-mood-thumb { display: block; width: 44px; height: 30px; overflow: hidden; flex: 0 0 auto; }.erh2 .erh2-mood-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ───────── 08 CONCIERGE ───────── */

.erh2-conc { position: relative; overflow: hidden; min-height: clamp(380px, 40vw, 560px); display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.erh2-conc-bg { position: absolute; inset: 0; background: #060605; }
.erh2 .erh2-conc-bg .erh2-img { object-position: 66% 47%; }
.erh2-conc-scrim { position: absolute; inset: 0; background: linear-gradient(to right, rgba(6,6,5,.93) 0%, rgba(6,6,5,.6) 42%, rgba(6,6,5,.24) 100%); }
.erh2-conc-in { position: relative; z-index: 2; padding: clamp(50px, 6vw, 88px) 0 clamp(50px, 6vw, 88px) var(--inset); max-width: 640px; }
.erh2-conc-langs { font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; color: rgba(245,239,229,.56); margin: 0 0 24px; }
.erh2-conc-langs span { display: block; margin-top: 9px; color: var(--gold); letter-spacing: .13em; }
.erh2-conc-list { position: relative; z-index: 2; padding: 0 var(--inset) 0 0; text-align: right; }
.erh2-conc-list li { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: rgba(245,239,229,.58); padding: 9px 0; }

/* ───────── 09 ITINERARY ───────── */

.erh2-itin { background: var(--cream-2); color: var(--on-cream); padding: clamp(54px, 7vw, 96px) var(--inset); }
.erh2-itin-in { max-width: 1360px; margin: 0 auto; display: grid; grid-template-columns: minmax(230px, 30%) 1fr minmax(220px, 30%); gap: clamp(26px, 4vw, 66px); align-items: center; }
.erh2-itin .erh2-eyebrow { color: #8a6a3a; }
.erh2-itin .erh2-lede { color: rgba(34,32,27,.64); }
.erh2-timeline { position: relative; padding-left: 34px; }
.erh2-timeline-rail { position: absolute; left: 6px; top: 14px; bottom: 14px; width: 1px; background: var(--rule-light); display: block; }
.erh2-timeline-rail i { position: absolute; inset: 0 auto 0 0; width: 1px; height: 100%; background: #8a6a3a; transform-origin: top; transform: scaleY(var(--erh2-progress, 1)); display: block; }
.erh2-tl-row { position: relative; padding: 16px 0; border-bottom: 1px solid var(--rule-light); }
.erh2-tl-dot { position: absolute; left: -34px; top: 23px; width: 9px; height: 9px; border-radius: 50%; border: 1px solid #8a6a3a; background: var(--cream-2); }
.erh2-tl-day { display: block; font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; color: #8a6a3a; margin-bottom: 6px; }
.erh2-tl-txt { display: block; font-family: var(--display); font-size: clamp(19px, 1.7vw, 26px); color: var(--on-cream); }
.erh2-itin-media { height: clamp(240px, 22vw, 320px); overflow: hidden; }

/* ───────── FINAL CTA ───────── */

.erh2-story { position: relative; overflow: hidden; min-height: clamp(400px, 42vw, 600px); display: flex; align-items: center; }
.erh2-story-bg { position: absolute; inset: 0; }
.erh2 .erh2-story-bg .erh2-img { object-position: 50% 48%; }
.erh2-story-scrim { position: absolute; inset: 0; background: linear-gradient(to right, rgba(18,18,15,.88) 0%, rgba(18,18,15,.5) 50%, rgba(18,18,15,.24) 100%); }
.erh2-story-in { position: relative; z-index: 2; padding: clamp(50px, 6vw, 90px) var(--inset); max-width: 820px; }
.erh2-story-h2 { font-size: clamp(36px, 4.2vw, 62px); margin: 0 0 20px; }
.erh2-story-copy { font-size: 14px; line-height: 1.8; color: rgba(245,239,229,.76); margin: 0 0 28px; }
.erh2-story-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.erh2-story-sign { position: absolute; right: var(--inset); bottom: clamp(40px, 7vh, 80px); z-index: 2; margin: 0; font-family: var(--display); font-style: italic; font-size: clamp(20px, 2vw, 30px); color: rgba(245,239,229,.7); text-align: right; line-height: 1.3; transform: rotate(-6deg); }

/* ───────── richiesta ───────── */

.erh2-ask { background: var(--ink-3); padding: clamp(46px, 6vw, 84px) var(--inset); }
.erh2-ask-in { max-width: 1100px; margin: 0 auto; }
.erh2-askform { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px 22px; margin-top: 10px; }.erh2-f { display: flex; flex-direction: column; gap: 7px; }
.erh2-f.is-wide { grid-column: 1 / -1; }.erh2 .erh2-f label { font-size: 9px; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); }.erh2 .erh2-f input, .erh2 .erh2-f select, .erh2 .erh2-f textarea {
  font-family: var(--ui); font-size: 16px; font-weight: 300; color: var(--light);
  background: transparent; border: 0; border-bottom: 1px solid var(--rule-dark);
  padding: 9px 0; border-radius: 0; appearance: none; -webkit-appearance: none; transition: border-color .3s;
}.erh2 .erh2-f select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' stroke='%23b9985e'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 2px center; padding-right: 18px; cursor: pointer; }.erh2 .erh2-f select option { background: var(--ink-3); color: var(--light); }.erh2 .erh2-f textarea { resize: vertical; min-height: 64px; }.erh2 .erh2-f input:focus, .erh2 .erh2-f select:focus, .erh2 .erh2-f textarea:focus { border-bottom-color: var(--gold); outline: none; }.erh2 .erh2-f input.is-bad { border-bottom-color: #c07a50; }
.erh2-asksend { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 4px; }
.erh2-asknote { font-size: 11.5px; color: rgba(245,239,229,.46); margin: 0; max-width: 56ch; }
.erh2-asknote a { color: var(--cream); text-decoration: underline; text-underline-offset: 2px; }
.erh2-ask.is-lit { box-shadow: inset 0 0 0 1px rgba(185,152,94,.5); }

/* ───────── footer ───────── */

.erh2-foot { background: #0c0c0a; padding: clamp(40px, 5vw, 64px) var(--inset) 0; }
.erh2-foot-in { max-width: 1360px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 26px; flex-wrap: wrap; }
.erh2-foot-links { display: flex; flex-wrap: wrap; gap: 10px 26px; }
.erh2-foot-links a { font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: rgba(245,239,229,.6); transition: color .3s; }
.erh2-foot-links a:hover { color: var(--light); }
.erh2-foot-wa { font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.erh2-foot-legal { max-width: 1360px; margin: clamp(32px, 4vw, 52px) auto 0; padding: 18px 0 26px; border-top: 1px solid var(--rule-dark); display: flex; flex-wrap: wrap; align-items: center; gap: 9px 22px; font-size: 10.5px; color: rgba(245,239,229,.36); }
.erh2-foot-legal p { margin: 0; }
.erh2-foot-legal ul { display: flex; gap: 18px; }
.erh2-foot-legal a { color: rgba(245,239,229,.54); }
.erh2-foot-v2 { margin-left: auto; color: rgba(185,152,94,.58); }

/* ═══════════════════════════════════════════════════════════════════════
   STATI DI PARTENZA — SOLO SOTTO html.erh2-js
   La classe la mette assets/home-v2.js come prima istruzione. Senza
   JavaScript, o se lo script non arriva, questo blocco non esiste e la
   pagina e' gia' nel suo stato finale: niente resta invisibile.
   ═══════════════════════════════════════════════════════════════════════ */

html.erh2-js .erh2-line   { transform: translate3d(0, 108%, 0); }
html.erh2-js .erh2-reveal { opacity: 0; transform: translate3d(0, 20px, 0); }
html.erh2-js .erh2-timeline-rail i { transform: scaleY(0); }

html.erh2-js .erh2-line.is-in,
html.erh2-js .erh2-reveal.is-in {
  opacity: 1; transform: none;
  transition: opacity .8s var(--ease), transform .9s var(--ease);
}
html.erh2-js .erh2-line { transition: transform .95s var(--ease); }
html.erh2-js .erh2-reveal.is-in .erh2-line { transform: none; }

/* La maschera serve finche' la riga e' fuori posto: dopo si libera, cosi'
   una riga che va a capo su schermo stretto non resta tagliata. */
html.erh2-js .erh2-mask.is-done { overflow: visible; }

/* Il movimento di parallasse lo scrive il JS come variabile: se non gira,
   la variabile non esiste e la trasformazione vale zero. */
html.erh2-js .erh2-scene-img { transform: translate3d(0, var(--erh2-shift, 0px), 0) scale(var(--erh2-zoom, 1)); will-change: transform; }

/* ───────── movimento ridotto ─────────
   Non basta accorciare le durate: gli stati di partenza vanno annullati,
   altrimenti chi disattiva le animazioni vede una pagina vuota. */
@media (prefers-reduced-motion: reduce) {
  html.erh2-js .erh2-line,
  html.erh2-js .erh2-reveal,
  html.erh2-js .erh2-timeline-rail i,
  html.erh2-js .erh2-scene-img {
    opacity: 1 !important; transform: none !important; transition: none !important; will-change: auto !important;
  }
  html.erh2-js .erh2-mask { overflow: visible; }
  .erh2 *, .erh2 *::before, .erh2 *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   BREAKPOINT
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 1100px) {
  .erh2-props-in { grid-template-columns: 1fr; gap: 30px; }
  .erh2-itin-in { grid-template-columns: 1fr 1fr; }
  .erh2-itin-media { grid-column: 1 / -1; height: clamp(200px, 40vw, 300px); }
  .erh2-askform { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .erh2-arrival, .erh2-stays, .erh2-exp { grid-template-columns: 1fr; }
  .erh2-stays-head, .erh2-exp-head { padding: 0 var(--inset) 28px; }
  .erh2-stays-grid, .erh2-exp-grid { padding: 0 var(--inset); }
  .erh2-conc { flex-direction: column; align-items: flex-start; }
  .erh2-conc-in { padding-bottom: 20px; }
  .erh2-conc-list { text-align: left; padding: 0 var(--inset) clamp(40px, 6vw, 70px); display: flex; flex-wrap: wrap; gap: 6px 22px; }
  .erh2-finder-in { grid-template-columns: 1fr; }
  .erh2-story-sign { position: static; text-align: left; margin: 26px 0 0; transform: none; padding: 0 var(--inset); }
}

@media (max-width: 700px) {
  .erh2 { --inset: 24px; }
  .erh2-menu {
    position: fixed; inset: 0 0 auto 0; flex-direction: column; align-items: stretch; gap: 0;
    background: rgba(18,18,15,.97); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
    padding: 76px var(--inset) 28px; transform: translateY(-101%); transition: transform .4s var(--ease);
    border-bottom: 1px solid var(--rule-dark);
  }
  .erh2-menu.is-open { transform: translateY(0); }
  .erh2-menu ul { flex-direction: column; gap: 0; }
  .erh2-menu ul a { display: block; padding: 15px 0; border-bottom: 1px solid var(--rule-dark); font-size: 12px; }
  .erh2-navcta { margin-top: 18px; align-self: flex-start; }.erh2 .erh2-burger { display: inline-flex; position: relative; z-index: 2; }

  .erh2-hero-in { padding-bottom: 150px; }
  .erh2-hero-cta { gap: 10px; }.erh2 .erh2-hero-cta .erh2-btn { flex: 1 1 100%; }
  .erh2 .erh2-hero-frame .erh2-img { object-position: 61% 50%; }
  .erh2-hero-side { display: none; }
  .erh2-scrollcue { bottom: 96px; }

  .erh2 .erh2-arrival-media .erh2-img { object-position: 61% 50%; }
  .erh2-arrival-media { min-height: 58svh; }
  .erh2 .erh2-props-bg .erh2-img,
  .erh2 .erh2-events-bg .erh2-img { object-position: 61% 50%; }
  .erh2 .erh2-conc-bg .erh2-img { object-position: 60% 50%; }
  .erh2 .erh2-story-bg .erh2-img { object-position: 57% 50%; }

  /* Stays e Dream diventano strisce che si scorrono, non griglie schiacciate. */
  .erh2-stays-grid {
    grid-auto-flow: column; grid-auto-columns: 78vw; grid-template-columns: none;
    overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .erh2-stays-grid::-webkit-scrollbar { display: none; }
  .erh2-staycard { scroll-snap-align: start; height: 58svh; }

  .erh2-exp-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
  .erh2-expcard { height: 40svh; }

  .erh2-steps { grid-template-columns: 1fr 1fr; }
  .erh2-askform { grid-template-columns: 1fr; }
  .erh2-itin-in { grid-template-columns: 1fr; }.erh2 .erh2-moods { gap: 8px; }.erh2 .erh2-mood { font-size: 10px; padding: 6px 13px 6px 6px; }
  .erh2-foot-in { flex-direction: column; align-items: flex-start; gap: 18px; }
  .erh2-foot-v2 { margin-left: 0; width: 100%; }
}

/* Il banner cookie e' fisso in basso, su telefono quasi 200px: senza questo
   la seconda CTA dell'hero ci finisce completamente sotto. */
@media (max-width: 900px) {
  body:has(#erleg-cc:not([hidden])) .erh2-hero-in { padding-bottom: 236px; }
  body:has(#erleg-cc:not([hidden])) .erh2-scrollcue { opacity: 0; }
}

@media (max-width: 400px) {
  .erh2 { font-size: 15.5px; }.erh2 .erh2-btn { padding: 14px 20px; font-size: 10px; letter-spacing: .16em; }
  .erh2-eyebrow { font-size: 9px; letter-spacing: .28em; }
  .erh2-staycard, .erh2-expcard { height: 50svh; }
}

@media (hover: none) {
  .erh2-staycard:hover .erh2-staycard-in,
  .erh2-expcard:hover .erh2-expcard-in { transform: none; }
}

@media print {.erh2-nav, .erh2-scrollcue, .erh2-hero-side, .erh2 .erh2-burger { display: none !important; }
  .erh2 { background: #fff; color: #000; }
}

/* ═══════════════════════════════════════════════════════════════════════
   FIND YOUR PERFECT VILLA · DREAM ARCHITECT · CONCIERGE · PROPRIETARI
   Ogni bottone e ogni campo qui sotto e' prefissato con .erh2 : reset.css
   del tema si carica dopo e pareggia la specificita' con [type=button].
   ═══════════════════════════════════════════════════════════════════════ */

.erh2-finder-main { display: block; }
.erh2-bands-label { font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; color: #8a6a3a; margin: 0 0 12px; }
.erh2-bands { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; background: var(--rule-light); border: 1px solid var(--rule-light); margin-bottom: 18px; }
.erh2 .erh2-band {
  position: relative; display: flex; flex-direction: column; gap: 5px; text-align: left;
  background: var(--cream); border: 0; border-radius: 0; cursor: pointer;
  padding: 15px clamp(13px, 1.3vw, 19px); min-height: 44px; font-family: var(--ui);
  transition: background .3s var(--ease), color .3s var(--ease);
}
.erh2 .erh2-band:hover { background: var(--cream-2); }
.erh2 .erh2-band[aria-pressed="true"] { background: var(--ink); color: var(--light); }
.erh2-band-n { font-family: var(--display); font-size: clamp(17px, 1.6vw, 22px); line-height: 1.1; color: var(--on-cream); }
.erh2 .erh2-band[aria-pressed="true"] .erh2-band-n { color: var(--light); }
.erh2-band-hint { font-size: 11px; color: rgba(34,32,27,.52); }
.erh2 .erh2-band[aria-pressed="true"] .erh2-band-hint { color: rgba(245,239,229,.6); }
.erh2-band-count { position: absolute; top: 12px; right: 13px; font-size: 10px; letter-spacing: .1em; color: #8a6a3a; }
.erh2 .erh2-band[aria-pressed="true"] .erh2-band-count { color: var(--gold); }

.erh2-results { margin-bottom: 20px; }
.erh2-results-head { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: #8a6a3a; margin: 0 0 12px; }
.erh2-results-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(146px, 1fr)); gap: 14px; }
.erh2-res { display: block; }
.erh2-res[hidden] { display: none; }
.erh2-res-media { display: block; height: 104px; overflow: hidden; background: var(--ink-3); margin-bottom: 9px; }
.erh2 .erh2-res-media .erh2-img { transition: transform 1s var(--ease); }
.erh2-res:hover .erh2-img { transform: scale(1.05); }
.erh2-res-name { display: block; font-family: var(--display); font-size: 17px; line-height: 1.15; color: var(--on-cream); margin-bottom: 3px; }
.erh2-res-meta { display: block; font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: #8a6a3a; margin-bottom: 4px; }
.erh2-res-fact { display: block; font-size: 11.5px; color: rgba(34,32,27,.56); }
.erh2-results-note { font-size: 11.5px; color: rgba(34,32,27,.54); margin: 14px 0 0; max-width: 62ch; }

/* ───────── dream: gruppi, chip, moodboard ───────── */

.erh2-dgroup { margin-bottom: 18px; }
.erh2-dlabel { font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); margin: 0 0 9px; }
.erh2-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.erh2 .erh2-chip {
  font-family: var(--ui); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  padding: 11px 17px; min-height: 44px; border: 1px solid rgba(245,239,229,.26); border-radius: 0;
  background: transparent; color: rgba(245,239,229,.76); cursor: pointer;
  transition: border-color .3s, color .3s, background .3s;
}
.erh2 .erh2-chip:hover { border-color: rgba(245,239,229,.6); color: var(--light); }
.erh2 .erh2-chip[aria-pressed="true"] { background: var(--light); border-color: var(--light); color: var(--ink); }

.erh2-board { margin-top: 26px; padding: 22px clamp(18px, 2vw, 28px); background: rgba(18,18,15,.72); border: 1px solid var(--rule-dark); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); max-width: 720px; }
.erh2-board[hidden] { display: none; }
.erh2-board-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.erh2-board-title { font-family: var(--display); font-size: clamp(19px, 1.9vw, 26px); color: var(--light); margin: 0; }
.erh2-board-colors { display: flex; gap: 5px; }
.erh2-sw { display: block; width: 20px; height: 20px; border: 1px solid rgba(245,239,229,.22); }
.erh2-board-atmos { font-size: 14px; line-height: 1.75; color: rgba(245,239,229,.72); margin: 0 0 16px; }
.erh2-board-rows { margin: 0 0 14px; }
.erh2-board-rows > div { display: grid; grid-template-columns: 96px 1fr; gap: 14px; padding: 9px 0; border-top: 1px solid var(--rule-dark); }
.erh2-board-rows dt { font-size: 9.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); padding-top: 2px; }
.erh2-board-rows dd { margin: 0; font-size: 13.5px; line-height: 1.7; color: rgba(245,239,229,.76); }
.erh2-board-note { font-size: 11.5px; color: rgba(245,239,229,.46); margin: 0 0 16px; }
.erh2-board-cta { display: flex; gap: 10px; flex-wrap: wrap; }

/* ───────── concierge ───────── */

.erh2-conc-points { margin: 22px 0 0; }
.erh2-conc-points li { padding: 11px 0; border-top: 1px solid var(--rule-dark); }
.erh2-conc-points span { display: block; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--light); margin-bottom: 4px; }
.erh2-conc-points em { display: block; font-style: normal; font-size: 12.5px; color: rgba(245,239,229,.54); }

.erh2-ask-panel { position: relative; z-index: 2; margin: 0 var(--inset) clamp(44px, 6vw, 80px) 0; padding: 18px clamp(16px, 1.8vw, 24px) 20px; background: rgba(12,12,10,.78); border: 1px solid var(--rule-dark); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); max-width: 420px; align-self: center; }
.erh2-ask-head { display: flex; align-items: center; gap: 9px; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--light); padding-bottom: 12px; border-bottom: 1px solid var(--rule-dark); margin-bottom: 12px; }
.erh2-ask-dot { width: 7px; height: 7px; border-radius: 50%; background: #6fbf73; flex: 0 0 auto; }
.erh2-ask-intro { font-size: 11.5px; line-height: 1.6; color: rgba(245,239,229,.5); margin: 0 0 12px; }
.erh2-ask-list { margin: 0 0 14px; }
.erh2-ask-list li { border-top: 1px solid rgba(245,239,229,.08); }
.erh2-ask-list a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 0; font-size: 13px; color: rgba(245,239,229,.82); min-height: 44px; transition: color .3s; }
.erh2-ask-list a:hover { color: var(--gold); }
.erh2-ask-own { display: flex; gap: 8px; align-items: stretch; }
.erh2 .erh2-ask-own input {
  flex: 1; min-width: 0; font-family: var(--ui); font-size: 16px; font-weight: 300; color: var(--light);
  background: rgba(245,239,229,.05); border: 1px solid var(--rule-dark); border-radius: 0;
  padding: 10px 12px; appearance: none; -webkit-appearance: none; transition: border-color .3s;
}
.erh2 .erh2-ask-own input:focus { border-color: var(--gold); outline: none; }
.erh2 .erh2-ask-own input::placeholder { color: rgba(245,239,229,.38); }

/* ───────── banner proprietari ───────── */

.erh2-owners { background: var(--ink-2); border-top: 1px solid var(--rule-dark); padding: clamp(44px, 6vw, 78px) var(--inset); }
.erh2-owners-in { max-width: 1360px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: clamp(24px, 4vw, 60px); flex-wrap: wrap; }
.erh2-owners-h2 { font-size: clamp(28px, 3vw, 44px); margin: 0 0 14px; }
.erh2-owners-h2 em { font-style: italic; color: var(--gold); }
.erh2-owners-copy { font-size: 14px; line-height: 1.75; color: rgba(245,239,229,.6); max-width: 54ch; margin: 0; }
.erh2-owners .erh2-btn { flex: 0 0 auto; }

/* ───────── responsive delle nuove parti ───────── */

@media (max-width: 900px) {
  .erh2-ask-panel { margin: 0 var(--inset) clamp(40px, 6vw, 64px); max-width: none; }
}
@media (max-width: 700px) {
  .erh2-bands { grid-template-columns: 1fr 1fr; }
  .erh2-results-grid { grid-template-columns: 1fr 1fr; }
  .erh2-board-rows > div { grid-template-columns: 1fr; gap: 4px; }
  .erh2-owners-in { flex-direction: column; align-items: flex-start; }
  .erh2-owners .erh2-btn { width: 100%; }
}
@media (max-width: 400px) {
  .erh2-bands { grid-template-columns: 1fr; }
}

/* Rifiniture finali.
   La nota del finder e' una cella della griglia dei quattro campi, che usa il
   colore delle fughe come sfondo: senza un fondo proprio usciva come una
   fascia grigia. */
.erh2-steps-note { background: var(--cream); padding: 9px 14px 11px; margin: 0; }
.erh2-asksend { justify-content: flex-start; text-align: left; }
.erh2-asknote { text-align: left; }
.erh2 .erh2-ask-own input { min-width: 120px; }
.erh2-ask-panel { max-width: 460px; }

/* Segnaposto per le ancore storiche (/#contact e compagnia): altezza zero, non
   occupano spazio. scroll-margin-top tiene conto della barra in alto, altrimenti
   il titolo della sezione finisce sotto di essa. */
.erh2 .erh2-anchor{display:block;height:0;overflow:hidden;scroll-margin-top:92px}