/*
Theme Name: Kalpna
Theme URI:
Author: Ristorante Kalpna
Author URI:
Description: Tema WordPress custom per il ristorante indiano Kalpna a Martina Franca. Tema leggero e su misura, senza dipendenze da page builder.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kalpna
*/

/* ==========================================================================
   Variabili tema e reset di base. Un solo tema, scuro: il fondo è il
   marrone del legno delle foto, il crema è il colore del testo, il
   curcuma l'unico accento. I layout sono in assets/css/main.css.
   ========================================================================== */

:root {
  --fondo: #211a13;           /* carbone caldo, non nero puro */
  --fondo-rilievo: #2b2219;
  --fondo-profondo: #17120d;  /* prenotazione e footer */
  --testo: rgba(242, 230, 200, 0.9);
  --testo-tenue: rgba(242, 230, 200, 0.62);
  --bordo: rgba(242, 230, 200, 0.14);
  --curcuma: #e0bb70;         /* titoli, prezzi, dettagli */
  --curcuma-pieno: #c9973a;   /* solo superfici piene: bottoni, chip attiva */
  --marsala: #7a1a2f;         /* accento raro */

  /* Pallini dietetici: toni accesi abbastanza da leggersi sul fondo scuro */
  --pallino-veg: #4fae87;
  --pallino-vegano: #9ccf63;
  --pallino-senza-glutine: #c79ad6;
  --pallino-frutta-guscio: #e08a4f;
  --pallino-molluschi: #5fb0cf;

  --font-titoli: 'Young Serif', Georgia, 'Times New Roman', serif;
  --font-testo: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-devanagari: 'Tiro Devanagari Hindi', serif;

  --spaziatura-sezione: clamp(4rem, 9vw, 7.5rem);
  --raggio: 4px;
  --durata: 250ms;

  /* Grana di fondo: rumore finissimo (feTurbulence), come carta o legno
     opaco, cosi il fondo non è un piatto digitale. Tile piccolo ripetuto,
     niente fixed né blend mode: nessun costo di scroll su Safari iOS. */
  --grana: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.95 0 0 0 0 0.9 0 0 0 0 0.78 0 0 0 0.15 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}

*,
*::before,
*::after {
  box-sizing: border-box;
  /* iOS: niente flash grigio al tocco, gli stati attivi sono nostri. */
  -webkit-tap-highlight-color: transparent;
}

html {
  scroll-behavior: smooth;
  /* Le ancore non finiscono sotto header (e barra categorie nel menu):
     altezze reali misurate da main.js. */
  scroll-padding-top: calc(var(--header-h, 4rem) + var(--menu-nav-h, 0px) + 1rem);
}

body {
  margin: 0;
  overflow-x: hidden;
  font-family: var(--font-testo);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--testo);
  background: var(--fondo) var(--grana);
  -webkit-font-smoothing: antialiased;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

figure {
  margin: 0;
}

h1,
h2,
h3 {
  font-family: var(--font-titoli);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.005em;
  color: var(--curcuma);
  margin: 0 0 1rem;
  text-wrap: balance;
}

a {
  color: inherit;
}

.container {
  width: min(100% - 2rem, 1200px);
  margin-inline: auto;
}

/* Etichetta editoriale in maiuscolo sopra i titoli */
.kicker {
  display: block;
  margin: 0 0 0.9rem;
  font-family: var(--font-testo);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--curcuma);
}

/* Rispetta la preferenza utente di ridurre le animazioni */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}