/**
 * Usatomania Child — Design Tokens
 * Fonte di verità per colori, tipografia, spaziature.
 * Caricare PRIMA di qualsiasi altro CSS del progetto.
 */

:root {
  /* ── Colori ─────────────────────────────────────────────── */
  --usm-gold:           #EBBD17;
  --usm-gold-light:     #efc113;
  --usm-gold-dark:      #c9a110;
  --usm-gold-muted:     rgba(235, 189, 23, 0.15);

  --usm-dark:           #151616;
  --usm-dark-alt:       #1b1c19;
  --usm-olive:          #79806e;
  --usm-outline:        #807660;

  --usm-bg:             #fbf9f3;
  --usm-bg-alt:         #F5F2EC;
  --usm-surface:        #efeee8;
  --usm-surface-alt:    #e9e8e2;

  --usm-text:           #1b1c19;
  --usm-text-muted:     #79806e;

  --usm-error:          #ba1a1a;
  --usm-error-muted:    rgba(186, 26, 26, 0.1);
  --usm-success:        #386a20;
  --usm-success-muted:  rgba(56, 106, 32, 0.1);

  /* ── Tipografia ──────────────────────────────────────────── */
  --usm-font-headline:  'Newsreader', Georgia, serif;
  --usm-font-serif:     'Playfair Display', Georgia, serif;
  --usm-font-body:      'Lato', system-ui, sans-serif;
  --usm-font-label:     'Work Sans', system-ui, sans-serif;
  --usm-font-accent:    'Caveat', cursive;
  --usm-font-icons:     'Material Symbols Outlined';

  /* ── Spaziature ──────────────────────────────────────────── */
  --usm-space-xs:       4px;
  --usm-space-sm:       8px;
  --usm-space-md:       16px;
  --usm-space-lg:       24px;
  --usm-space-xl:       40px;
  --usm-space-2xl:      64px;
  --usm-space-3xl:      96px;

  --usm-section-py:     80px;
  --usm-section-py-sm:  48px;

  /* ── Border radius ───────────────────────────────────────── */
  --usm-radius-sm:      4px;
  --usm-radius-md:      8px;
  --usm-radius-lg:      12px;
  --usm-radius:         12px;
  --usm-radius-pill:    999px;

  /* ── Shadows ─────────────────────────────────────────────── */
  --usm-shadow-sm:      0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
  --usm-shadow:         0 4px 20px rgba(0,0,0,.08);
  --usm-shadow-md:      0 4px 12px rgba(0,0,0,.10), 0 2px 4px rgba(0,0,0,.06);
  --usm-shadow-lg:      0 10px 30px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

  /* ── Transizioni ─────────────────────────────────────────── */
  --usm-transition:     150ms ease;
  --usm-transition-md:  250ms ease;

  /* ── Layout ──────────────────────────────────────────────── */
  --usm-container-max:  1280px;
  --usm-header-height:  70px;
}

.container {
    max-width: 100%;
}

.product-inner img.wp-post-image {
    width: 100%;
}