/* ============================================================================
   tokens.css  ·  tacoshermanos.com
   COLORS + FONTS ONLY. The single file to edit to re-skin the site.
   Nothing else in the project hard-codes a hex value.

   The values below are the REAL brand colours, sampled directly from the
   official brand manual (GRAFICA MARZO2022_TACOS HERMANOS, palette page).
   ========================================================================= */

/* ---------------------------------------------------------------------------
   Brand typeface: Causten (the client owns the full 18-weight family).
   Self-hosting it on a public site needs a WEBFONT licence, still unconfirmed,
   so the stack tries Causten first and falls back to Outfit, a close geometric
   sans from Google Fonts.

   TO SWITCH TO REAL CAUSTEN: drop Causten-Regular.woff2, Causten-Medium.woff2,
   Causten-Bold.woff2 and Causten-ExtraBold.woff2 into assets/fonts/ and
   uncomment the four @font-face blocks. Nothing else needs to change.
--------------------------------------------------------------------------- */

/*
@font-face{font-family:'Causten';src:url('../fonts/Causten-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Causten';src:url('../fonts/Causten-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Causten';src:url('../fonts/Causten-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Causten';src:url('../fonts/Causten-ExtraBold.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}
*/

/* Fallback typeface, self-hosted so the site never waits on a third party.
   Outfit is a geometric sans chosen to sit as close to Causten as a free face gets. */
@font-face{
  font-family:'Outfit';
  src:url('../fonts/outfit-latin-variable.woff2') format('woff2-variations');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Outfit';
  src:url('../fonts/outfit-latin-ext-variable.woff2') format('woff2-variations');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  /* ===== OFFICIAL BRAND PALETTE (from the brand manual) ================== */
  --verde:        #2D8769;   /* verde hermano, the primary brand green       */
  --verde-hondo:  #266E54;   /* deep green, covers and footer                */
  --verde-claro:  #389975;   /* lighter green tint                           */
  --crema:        #F6E2B4;   /* crema, the brand cream                       */
  --durazno:      #F7CC91;   /* peach tint                                   */
  --rojo:         #F0512A;   /* rojo tatemado. USED SPARINGLY, see note below */
  --rojo-hondo:   #CC3D26;   /* deep red                                     */

  /* Somos Hermanos, the foundation, has its own blue identity. Sampled from
     their in-store stand artwork. Only used inside foundation sections.     */
  --azul-sh:       #3D79C6;
  --azul-sh-hondo: #2F5F9E;
  --azul-sh-crema: #EFDD9F;
  /* =======================================================================
     COLOUR RULE, from Erika Silva on the 31 July call: "nosotros no ocupamos
     mucho el naranja, ocupamos más el verde y las tonalidades de verde".
     Green and its tints carry the site. Orange (--rojo) appears ONLY on
     primary call-to-action buttons and on the final "¡Ya somos hermanos!"
     line, which is orange in their own official Concepto artwork.
     Do not reintroduce orange anywhere else.
     ======================================================================= */

  /* Semantic roles used across the site */
  --bg:        #FFFBF1;   /* page background, cream lifted almost to white   */
  --ink:       #16352C;   /* main text, a green-black drawn from the brand   */
  --ink-soft:  #1E4438;   /* layered dark surfaces                           */
  --surface:   var(--crema);
  --accent:    var(--verde);
  --accent-2:  var(--rojo);
  --muted:     #6E7B72;
  --line:      #E6DCC6;

  /* Footer credit colors, read by the EKY logo */
  --footer-bg: var(--verde-hondo);
  --footer-fg: var(--crema);

  /* Fonts */
  --font-display: 'Causten', 'Outfit', system-ui, -apple-system, sans-serif;
  --font-body:    'Causten', 'Outfit', system-ui, -apple-system, sans-serif;

  /* Layout */
  --max: 1180px;
  --max-narrow: 760px;
}
