/* ============================================================
   Sicily Home Rentals — Design system
   "Mediterranean Editorial": luce, pietra chiara, mare, verde d'ulivo.

   Qui stanno SOLO le decisioni. Nessuna regola di componente: quelle
   vivono negli altri fogli e leggono da qui. Cambiare un valore in
   questo file cambia tutto il portale in modo coerente.

   Ogni colore di testo è stato verificato sul fondo su cui viene usato:
   i rapporti annotati sono misurati, non stimati.
   ============================================================ */

:root{
  /* ---------------------------------------------------- colore: base */
  --c-ink:        #10222E;   /* 16.3:1 su bianco — titoli e testo forte  */
  --c-ink-soft:   #4A5F6E;   /*  6.7:1 su bianco — testo secondario      */
  --c-ink-faint:  #7B8D99;   /*  3.5:1 — SOLO decoro, mai testo corrente */

  --c-sea:        #1C6E8C;   /*  5.7:1 — collegamenti e accenti          */
  --c-sea-deep:   #134E66;   /*  9.1:1 — stato attivo, fondi scuri       */
  --c-terra:      #B84A25;   /*  5.2:1 — richiamo all'azione             */
  --c-terra-deep: #94391B;   /*  7.3:1 — richiamo premuto                */
  --c-olive:      #4F6B3E;   /*  6.0:1 — conferme, disponibile           */
  --c-gold:       #B08636;   /*  3.3:1 — DECORO soltanto, mai testo piccolo */

  /* --------------------------------------------------- colore: superfici */
  --s-page:       #FFFFFF;
  --s-sand:       #F7F2EA;   /* sezioni alternate, pietra chiara         */
  --s-sand-deep:  #EFE7DA;
  --s-ink:        #10222E;   /* piè di pagina, fondi scuri               */
  --s-line:       #E4DCD0;   /* bordi tenui                              */
  --s-line-soft:  #F0E9DE;

  /* ------------------------------------------------------- tipografia
     Fraunces per i titoli: è un serif editoriale con dimensione ottica
     variabile, quindi resta elegante nei titoli grandi e non si sfalda
     in quelli piccoli. Inter per il resto, perché deve reggere cinque
     lingue con accenti, dieresi e cediglie senza sorprese. */
  --f-display: Fraunces, Georgia, 'Times New Roman', serif;
  --f-text:    Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Scala fluida: cresce con lo schermo, senza salti fra i punti di rottura */
  --t-hero:  clamp(2.4rem, 1.4rem + 4.4vw, 4.6rem);
  --t-h1:    clamp(2rem,   1.4rem + 2.6vw, 3.1rem);
  --t-h2:    clamp(1.6rem, 1.2rem + 1.7vw, 2.4rem);
  --t-h3:    clamp(1.15rem, 1rem + 0.6vw, 1.4rem);
  --t-lead:  clamp(1.05rem, 1rem + 0.3vw, 1.2rem);
  --t-body:  1rem;      /* 16px: sotto questa misura iOS ingrandisce da solo */
  --t-small: 0.875rem;
  --t-micro: 0.75rem;

  --lh-tight: 1.08;
  --lh-head:  1.2;
  --lh-body:  1.65;
  --ls-eyebrow: .16em;

  /* ---------------------------------------------------------- spazio
     Scala su base 4, così i valori si combinano senza numeri a caso. */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 24px;  --sp-6: 32px;  --sp-7: 44px;  --sp-8: 64px;
  --sp-9: 88px;  --sp-10: 120px;

  --wrap:      1180px;  /* larghezza massima del contenuto              */
  --wrap-text: 68ch;    /* misura di lettura: 65-75 caratteri per riga  */

  /* ------------------------------------------------------------ forma */
  --r-sm: 8px;  --r-md: 14px;  --r-lg: 20px;  --r-pill: 999px;

  /* Ombre basse e diffuse: la luce del Mediterraneo non fa aloni duri */
  --sh-1: 0 1px 2px rgba(16,34,46,.06), 0 2px 8px rgba(16,34,46,.05);
  --sh-2: 0 4px 12px rgba(16,34,46,.07), 0 12px 32px rgba(16,34,46,.07);
  --sh-3: 0 8px 20px rgba(16,34,46,.09), 0 24px 56px rgba(16,34,46,.10);

  /* ----------------------------------------------------------- moto */
  --ms-fast: 150ms;  --ms-base: 220ms;  --ms-slow: 320ms;
  --ease: cubic-bezier(.2,.7,.3,1);

  /* --------------------------------------------------------- livelli
     Scala dichiarata: senza, si finisce a scrivere 9999 e a litigare
     con il proprio stesso codice. */
  --z-base: 1;  --z-sticky: 20;  --z-nav: 40;  --z-overlay: 60;  --z-modal: 80;

  /* --------------------------------------------------- proporzioni foto */
  --ar-card: 4/3;
  --ar-wide: 3/2;
  --ar-hero: 16/9;
}

/* Chi ha chiesto meno movimento al sistema operativo spesso ha un motivo
   medico. Si azzera tutto in un punto solo, invece che foglio per foglio. */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}