/* ============================================================
   'A Vineria - design tokens
   Concept: la locandina che prende vita. Il locale comunica con
   locandine su carta grigia, scritte a pennello rosso vino, disegni
   a tratto e onde rosse in fondo: il sito parla la stessa lingua,
   e le onde rosse diventano vino vero (js/vino.js).
   Colori presi dalle locandine: carta #dcdcd4, rosso #9f2f2b.
   Forme: i pulsanti sono "adesivi" a pillola, le foto sono adesivi
   con il bordo bianco e 4px di angolo. Nient'altro è arrotondato.
   ============================================================ */
:root {
  color-scheme: light dark;

  /* il rosso delle locandine: fascia del programma, vino, pulsanti.
     Non cambia col tema scuro (è il colore del marchio) */
  --c-vino:       #9f2f2b;
  --c-vino-cupo:  #7c2120;   /* hover dei pulsanti */
  --c-on-vino:    #fbfbf8;
  --c-adesivo:    #fbfbf8;   /* il bordo bianco di foto e logo */

  /* colori - tema chiaro: la carta della locandina */
  --c-bg:      #dcdcd4;
  --c-surface: #e6e6df;      /* mappa, note: un foglio sopra la carta */
  --c-text:    #1f1c1b;
  --c-muted:   #4d4946;
  --c-line:    #bdbcb3;
  --c-accent:  #9f2f2b;      /* testo e tratti rossi su carta (5,2:1) */
  --c-tratto:  #9f2f2b;      /* i disegni ritagliati dalla locandina */
  --shadow-adesivo: 0 1px 0 rgb(31 28 27 / .08), 0 16px 30px -20px rgb(60 20 18 / .55);

  /* tipografia */
  --f:         "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-pennello: "Kaushan Script", "Brush Script MT", cursive;

  /* spazi (base 8) */
  --s-1: .5rem;
  --s-2: .75rem;
  --s-3: 1rem;
  --s-4: 1.5rem;
  --s-5: 2rem;
  --s-6: 3rem;
  --s-7: 4rem;
  --s-8: 6rem;

  /* forma */
  --r-foto: 4px;

  /* movimento */
  --ease-out:    cubic-bezier(.23, 1, .32, 1);
  --ease-in-out: cubic-bezier(.77, 0, .175, 1);

  /* livelli */
  --z-vino:   1;
  --z-header: 20;
  --z-dock:   30;

  --wrap: 1160px;
  --gutter: clamp(1rem, 4vw, 2rem);
  --header-h: 68px;
}

/* tema scuro: "la sera in vineria". Stessa carta, ma al buio */
@media (prefers-color-scheme: dark) {
  :root {
    --c-bg:      #1b1716;
    --c-surface: #262020;
    --c-text:    #ece8e3;
    --c-muted:   #b4aca6;
    --c-line:    #3d3533;
    --c-accent:  #e46a62;    /* il rosso schiarito: su fondo scuro 5,6:1 */
    --c-tratto:  #d8554e;
    --shadow-adesivo: 0 18px 34px -20px rgb(0 0 0 / .8);
  }
}