/* Palazzo Auralia, versione «flex»: contratto dei token.
   Unica fonte di colori, caratteri, spazi, bordi, profondità e movimento.
   style.css usa solo questi nomi; un valore nuovo nasce qui, con il suo ruolo.
   I colori vengono dalle foto (velluto prugna, onice blu, calcare avorio, lanterne ottone), non da una moda. */

@font-face{font-family:Jakarta;src:url('assets/fonts/plus-jakarta-sans.woff2') format('woff2');font-weight:200 800;font-display:swap}
/* Pinyon Script: la calligrafia del palazzo, solo per saluti, firme e titoli grandi. SIL OFL, assets/fonts/OFL-pinyon-script.txt */
@font-face{font-family:Pinyon;src:url('assets/fonts/pinyon-script.woff2') format('woff2');font-weight:400;font-display:swap}

:root{
  /* Moduli locali: superfici autonome, stessa identità; nessun valore nel loader. */
  --module-page:1120px; --module-chat:440px; --module-copy:65ch;
  --module-pad:clamp(24px,5vw,64px); --module-gap:24px; --module-tight:12px;
  --module-title:clamp(48px,6vw,80px); --module-heading:clamp(22px,3vw,28px);
  --module-reading:16px; --module-small:13px; --module-line:1.65; --line-heading:1.2;
  --module-control:48px; --module-border:1px; --module-radius:0px;
  --module-max-height:100dvh; --module-focus:4px; --module-inline-focus-gap:8px; --module-timeout:5000ms;
  --module-report-height:420px;
  --module-receipt-ttl:600000ms; --module-loading-delay:300ms;
  --weight-reading:400; --weight-control:500; --room-name:clamp(26px,2.3vw,36px);
  --room-caption-measure:36ch;
  --layer-mobile-menu:19;
  --layer-booking-bar:10;   /* fixed demo launchers: under menu(19) and header(20), above content */
  --layer-booking-top:20;    /* booking page top bar, same plane as the site header */
  --layer-booking-skip:30;    /* skip link above all booking chrome */
  --booking-disabled-opacity:.55;
  --booking-demo-delay:600ms;      /* la conferma simulata risponde dopo questo tempo */
  --booking-ready-timeout:6000ms;  /* senza modulo pronto entro questo tempo compare il ripiego */
  --booking-link-offset:6px;   /* sopra il contenuto, sotto header e anello del toggle */
  --layer-module-link:3;
  /* Colore: quattro fondi che escono dalle foto, un inchiostro, un ottone. */
  --paper:#fffdf9;           /* luce quasi bianca: la fotografia porta il calore */
  --blush:#e8d3cb;           /* cipria, il fondo dei dettagli */
  --plum:#3d1a2c;            /* velluto prugna: la richiesta di soggiorno */
  --night:#14213a;           /* onice blu: i fatti della suite e la spa */
  --stage:#0e0a09;           /* l'ingresso, prima che la luce arrivi */
  --ink:#231a17;             /* testo su carta, 15:1 */
  --ink-soft:#5a4d44;        /* testo secondario su carta, 6,6:1 */
  --brass:#d2ad63;           /* ottone: calligrafia e filetti su fondi scuri, 8:1 sulla notte */
  --bronze:#7a5a2d;          /* ottone scurito per le etichette su carta, 5,3:1 */
  --wine:#5b2340;            /* calligrafia su carta, 11:1 */

  --text:var(--ink);
  --text-muted:var(--ink-soft);
  --text-on-dark:var(--paper);
  --text-on-dark-muted:#d9d0c3;     /* 11:1 sulla notte, 10:1 sulla prugna */
  --text-on-photo:#faf6ef;
  --text-on-photo-muted:#e6ddd0;
  --text-disabled:#8f8377;
  --rule:#bda99a;            /* filetti su carta */
  --rule-strong:#7a6c60;     /* bordi dei campi, 4,5:1 su carta */
  --rule-dark:rgb(243 236 226 / .28);
  --state-error:#8e1b35;
  --sky-ink:#1d0c17;         /* il nome nel cielo del cortile */

  --action:var(--ink);
  --action-hover:var(--wine);
  --action-text:var(--paper);
  --plum-day:#5b2340;
  --range-wash:#e1cfc3;
  --hover-wash:rgb(35 26 23 / .07);
  --header-solid:#fffdf9;
  --scrim:rgb(14 10 9 / .94);
  --surface-photo:#d6c8b8;

  /* Veli: scuri solo dove sta il testo; la foto resta viva altrove. */
  --shade-header:linear-gradient(180deg,rgb(14 10 9 / .78) 0%,rgb(14 10 9 / .4) 62%,transparent 100%);
  --shade-facade:linear-gradient(0deg,rgb(14 10 9 / .9) 0%,rgb(14 10 9 / .7) 20%,rgb(14 10 9 / .28) 40%,transparent 60%);
  --shade-court:radial-gradient(ellipse 95% 95% at 0% 100%,rgb(14 10 9 / .9) 0%,rgb(14 10 9 / .74) 34%,rgb(14 10 9 / .36) 62%,transparent 86%);
  --shade-court-low:linear-gradient(0deg,rgb(14 10 9 / .92) 0%,rgb(14 10 9 / .82) 30%,rgb(14 10 9 / .46) 54%,transparent 76%);
  --shade-big-top:linear-gradient(180deg,rgb(14 10 9 / .86) 0%,rgb(14 10 9 / .62) 30%,rgb(14 10 9 / .2) 56%,transparent 72%),linear-gradient(0deg,rgb(14 10 9 / .88) 0%,rgb(14 10 9 / .74) 20%,rgb(14 10 9 / .38) 34%,transparent 46%);
  --big-film-ratio:56.25vw;
  --shade-big:linear-gradient(0deg,rgb(14 10 9 / .9) 0%,rgb(14 10 9 / .72) 36%,rgb(14 10 9 / .36) 64%,transparent 88%);
  --elev-card:0 1px 2px rgb(35 26 23 / .08),0 22px 44px -24px rgb(35 26 23 / .5);

  /* Fuoco: due anelli, inchiostro dentro e carta fuori; su qualunque sfondo uno dei due stacca. */
  --focus-in:var(--ink);
  --focus-out:var(--paper);
  --focus-spread-in:2px;
  --focus-spread-out:4px;

  /* Tipografia: Jakarta per leggere, nomi e controlli; Pinyon invariato per titoli grandi e calligrafia. */
  --font-display:Jakarta,Arial,sans-serif;
  --font-script:Pinyon,'Snell Roundhand','Apple Chancery',cursive;
  --font-text:Jakarta,Arial,sans-serif;

  --text-xs:14px;
  --text-sm:14px;
  --text-md:17px;
  --text-lg:18px;
  --text-letter:clamp(18px,1.5vw,22px);   /* il testo dei fatti della suite */
  --title:22px;

  --display-hero:clamp(56px,min(9vw,17svh),150px);
  --display-hero-stacked:min(19vw,22svh);
  --leading-hero-stacked:.88;
  --tracking-hero-stacked:-.03em;
  --script-1:clamp(64px,10vw,168px);      /* titoli in calligrafia, grandi */
  --script-2:clamp(48px,6.4vw,104px);
  --script-3:clamp(40px,4.2vw,64px);
  --display-2:clamp(34px,3.8vw,60px);
  --display-3:clamp(26px,2.1vw,32px);
  --giant:clamp(52px,17vw,330px);         /* la parola enorme che attraversa la foto */
  --sky-name:min(15cqh,26vw);              /* il nome nel cielo del cortile: sta nell'altezza del cielo (15% della foto), mai più largo dello schermo */
  --wordmark:clamp(96px,17vw,280px);      /* il nome, in calligrafia, nel piede */

  --leading-display:1.08;
  --leading-heading:1.1;
  --leading-text:1.65;
  --leading-relaxed:1.8;
  --leading-script:1.05;
  --tracking-display:-.015em;
  --tracking-hero:-.03em;
  --tracking-label:.14em;
  --tracking-giant:-.04em;

  /* Spazio: base 4, passi crescenti. */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px;
  --space-7:32px; --space-8:40px; --space-10:64px; --space-12:96px; --space-16:160px;
  --frame:32px;
  --section-y:clamp(96px,11vw,176px);
  --section-x:7%;
  --header-h:96px;
  --header-bar-h:68px;
  --tap:48px;

  --radius:0;
  --hairline:1px solid;
  --arch:999px 999px 0 0;                 /* arco a tutto sesto: il segno del portone */
  --vault:clamp(48px,9vw,180px);

  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-scene:cubic-bezier(.2,.7,.2,1);
  --ease-color:ease;
  --dur-press:140ms;
  --dur-hover:200ms;
  --dur-ui:240ms;
  --dur-exit:160ms;
  --dur-film-fade:1200ms; /* cortile prima della fine, sul film ancora in moto */
  --film-fade-at:8200ms;
  --film-loading-timeout:5000ms;
  --film-stall-timeout:2500ms;
  --dur-clip-fade:700ms;  /* il clip di una sezione compare sulla foto */
  --clip-loading-timeout:6000ms;
  --clip-stall-timeout:2500ms;
  --clip-visible-ratio:.4;  /* quanta parte della sezione deve vedersi perché il clip parta */
  --clip-wide-position:50% 78%;  /* colazione: il tavolo sta in basso nel fotogramma */
  --breakfast-position:50% 78%;
  --clip-wide-min-ratio:1.1;  /* sotto questo rapporto larghezza/altezza il riquadro è verticale: parte il clip verticale */
  --bar-h:72px;
  --request-timeout:5000ms;
  --film-mobile-position:50%;
  --hero-mobile-copy-reserve:260px;
  --hero-mobile-media:min(72svh,calc(100svh - var(--hero-mobile-copy-reserve)));
  --lion-position:56%;
  --lion-arch:50% 50% 0 0 / 15% 15% 0 0;
  --lion-width:30%;
  --lion-mobile-width:88%;
  --details-height:1180px;
  --details-heading-measure:9ch;
  --lion-top:28%;
  --tea-top:67%;
  --linen-top:82%;
  --information-measure:68ch;
  --field-gap:var(--space-5);
  --hero-mobile-title:clamp(44px,15vw,66px);
  --hero-title-measure:6ch;
  --dur-photo:900ms;
  --dur-reveal:1000ms;
  --dur-line:1100ms;
  --dur-write:1600ms;                      /* la calligrafia si scrive da sinistra a destra */
  --dur-stroke:700ms;                      /* l'ovale del bottone si disegna */
  --dur-none:0s;
  --ease-step:linear;
  --stagger:90ms;
  --reveal-shift:24px;
  --press-scale:.98;
  --press-scale-icon:.94;
  --hover-zoom:1.03;
  --enter-scale:.97;
  --court-scale-start:1.14;
  --image-overscan:1.12;
  --ratio-wide:4 / 3;
  --ratio-square:1 / 1;
  --ratio-tall:4 / 5;
  --ratio-arch:3 / 4;
  --suite-position:95% center;

  color-scheme:light;
}

@media(min-width:1800px){:root{--frame:56px}}
@media(max-width:1000px){:root{--section-x:5%}}
@media(max-width:760px){
  :root{
    --frame:20px; --header-h:76px; --header-bar-h:60px; --section-x:20px;
    --script-1:clamp(56px,17vw,96px); --script-2:clamp(44px,13vw,72px); --script-3:clamp(36px,10vw,52px);
    --display-2:38px; --display-3:28px;
    --text-md:17px; --text-sm:15px; --text-xs:14px; --text-lg:19px; --text-letter:19px;
    --giant:clamp(44px,13.5vw,68px);
    --ratio-arch:4 / 5; --image-overscan:1.04;
  }
}
@media(max-width:350px){:root{--frame:15px; --display-2:34px}}
@media(max-height:599px){:root{--display-2:32px;--display-3:24px;--hero-mobile-media:50svh}}