/* ============================================================
   BURGER SUMMIT 2026 — Design Tokens
   "A Nação do Hambúrgueiro"
   Colors + Typography foundations.
   Import this file first in any Burger Summit artifact.
   ============================================================ */

/* ---------- FONTS ----------
   Industry      = primary display + text family (geometric squared sans).
                   Production files from fonnts.com. Available weights:
                   Book 400 · Medium 500 · Demi 600 · Bold 700 · Ultra 900
                   (+ matching italics). Thin/Light/Black were dropped — those
                   cuts are incomplete. Do not use font-weight 100/300/800.
   Industry Inc  = decorative LAYERED display (Base + Inline Stroke). Use for
                   premium athletic/varsity lettering — overlay the Inline
                   Stroke layer on the Base in an accent color. Display only.
   Basketball    = decorative / compositional accent ONLY. UPPERCASE + DIGITS
                   ONLY (no accented glyphs). NEVER for titles, headlines,
                   numbers or body — Industry owns all of those.
*/
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Book.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Book_Italic.otf") format("opentype");font-weight:400;font-style:italic;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Medium.otf") format("opentype");font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Medium_Italic.otf") format("opentype");font-weight:500;font-style:italic;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/IndustryTest-Demi.otf") format("opentype");font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Demi_Italic.otf") format("opentype");font-weight:600;font-style:italic;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Bold.otf") format("opentype");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Bold_Italic.otf") format("opentype");font-weight:700;font-style:italic;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Ultra.otf") format("opentype");font-weight:900;font-style:normal;font-display:swap;}
@font-face{font-family:"Industry";src:url("fonts/fonnts.com-Industry_Ultra_Italic.otf") format("opentype");font-weight:900;font-style:italic;font-display:swap;}
@font-face{font-family:"Industry Inc";src:url("fonts/fonnts.com-Industry_Inc_Base.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Industry Inc Inline";src:url("fonts/fonnts.com-Industry_Inc_Inline_Stroke.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Basketball";src:url("fonts/Basketball.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap;}

:root{
  /* ============ CORE PALETTE ============ */
  /* Brasa Orange — the signature. Dominant key-visual background, energy,
     primary CTAs, the heat of the chapa. This is the brand's hero color. */
  --bs-brasa:        #D94A1A;
  --bs-brasa-deep:   #C2400F;   /* shadowed / pressed orange */
  --bs-brasa-bright: #EA5A22;   /* hover / highlight orange */

  /* Vermelho Brasa — true red. Patches, pennants, alert accents. */
  --bs-red:          #E6192B;
  --bs-red-deep:     #B11320;

  /* Mostarda / Gold — subtitles, big numbers, info cards, accents. */
  --bs-gold:         #F9B208;
  --bs-gold-bright:  #FFC800;   /* brand-book "Amarelo Mostarda Vibrante" */
  --bs-gold-deep:    #E09600;

  /* Verde Campo — the field. Section panels, secondary surfaces. */
  --bs-green:        #00693B;   /* deep field green (panels, backgrounds) */
  --bs-green-bright: #00A859;   /* fresh accent green (ingredients, tags) */
  --bs-green-deep:   #04502E;

  /* Asphalt / Black — weight, institutional surfaces, body text. */
  --bs-asphalt:      #18222C;   /* dark blue-charcoal — primary dark surface */
  --bs-black:        #141414;   /* near-black "Preto Asfalto" */
  --bs-navy:         #14304A;   /* ink navy — text on light/gold, accents */

  /* Neutrals */
  --bs-white:        #FFFFFF;
  --bs-paper:        #F2F1ED;   /* off-white page background (jersey paper) */
  --bs-paper-2:      #E7E4DC;
  --bs-ash:          #6B7280;   /* muted gray text */

  /* ============ SEMANTIC ROLES ============ */
  --bg:              var(--bs-paper);
  --bg-dark:         var(--bs-asphalt);
  --bg-hot:          var(--bs-brasa);
  --bg-field:        var(--bs-green);

  --fg:              var(--bs-black);     /* body text on light */
  --fg-2:            #3A4450;             /* secondary text on light */
  --fg-inverse:      var(--bs-white);     /* text on dark / color */
  --fg-muted:        var(--bs-ash);

  --accent:          var(--bs-brasa);
  --accent-2:        var(--bs-gold);
  --accent-3:        var(--bs-green-bright);

  --line:            rgba(20,20,20,.12);
  --line-inverse:    rgba(255,255,255,.16);

  /* ============ TYPE FAMILIES ============ */
  --font-display: "Industry", "Arial Narrow", system-ui, sans-serif;   /* headlines */
  --font-text:    "Industry", system-ui, "Helvetica Neue", sans-serif; /* body/UI   */
  --font-varsity: "Basketball", "Industry", sans-serif;                /* DECORATIVE ACCENT ONLY — never titles/numbers (use --font-display) */
  --font-inc:     "Industry Inc", "Industry", sans-serif;              /* layered athletic display; overlay "Industry Inc Inline" */

  /* ============ TYPE SCALE (fluid-ish, px) ============ */
  --fs-display:  clamp(56px, 7vw, 104px); /* hero shout, all caps */
  --fs-h1:       clamp(40px, 5vw, 68px);
  --fs-h2:       clamp(30px, 3.4vw, 46px);
  --fs-h3:       28px;
  --fs-title:    22px;
  --fs-body-lg:  19px;
  --fs-body:     17px;
  --fs-small:    14px;
  --fs-eyebrow:  13px;

  --lh-tight:    0.92;   /* display headlines stack tight */
  --lh-snug:     1.05;
  --lh-body:     1.5;

  --tracking-display: -0.01em;
  --tracking-caps:    0.04em;   /* uppercase eyebrows / labels */

  /* ============ RADII / SHADOW / SPACING ============ */
  --r-xs: 4px; --r-sm: 8px; --r-md: 14px; --r-lg: 22px; --r-pill: 999px;
  --r-card: 18px;

  --shadow-sm: 0 2px 6px rgba(20,20,20,.12);
  --shadow-md: 0 10px 26px rgba(20,20,20,.18);
  --shadow-lg: 0 24px 60px rgba(20,20,20,.28);
  --shadow-hot: 0 14px 34px rgba(217,74,26,.36);   /* glow under orange CTAs */

  /* 8px base spacing unit */
  --sp-1: 8px; --sp-2: 16px; --sp-3: 24px; --sp-4: 32px;
  --sp-5: 48px; --sp-6: 64px; --sp-7: 96px; --sp-8: 128px;
}

/* ============ BASE ELEMENT STYLES ============ */
body{
  font-family: var(--font-text);
  font-weight: 400;
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--fg);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Display headlines — uppercase, ultra-heavy, tight, often a period at the end. */
.bs-display, h1.bs, .bs-h1{
  font-family: var(--font-display);
  font-weight: 900;
  text-transform: uppercase;
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-display);
  margin: 0;
}
.bs-display{ font-size: var(--fs-display); }
.bs-h1{ font-size: var(--fs-h1); }
.bs-h2{ font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: var(--fs-h2); line-height: var(--lh-snug); letter-spacing: var(--tracking-display); margin: 0; }
.bs-h3{ font-family: var(--font-display); font-weight: 700; text-transform: uppercase; font-size: var(--fs-h3); line-height: 1.1; margin: 0; }

/* Big numbers & shout words use the DISPLAY face (Industry Ultra). */
.bs-numeral{ font-family: var(--font-display); font-weight: 900; letter-spacing: -.01em; line-height: .88; }
/* Basketball — decorative accent ONLY. Do not use for titles or numbers. */
.bs-varsity{ font-family: var(--font-varsity); font-weight: 400; text-transform: uppercase; letter-spacing: .01em; }

/* Eyebrow / label */
.bs-eyebrow{
  font-family: var(--font-text);
  font-weight: 700;
  text-transform: uppercase;
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tracking-caps);
}

/* Body */
.bs-body{ font-family: var(--font-text); font-weight: 400; font-size: var(--fs-body); line-height: var(--lh-body); }
.bs-body-lg{ font-size: var(--fs-body-lg); line-height: 1.55; }
.bs-lead{ font-family: var(--font-text); font-weight: 600; font-size: var(--fs-body-lg); }

/* Color-word helpers — headlines mix white + a single accent word. */
.bs-word-gold{ color: var(--bs-gold); }
.bs-word-orange{ color: var(--bs-brasa); }
.bs-word-green{ color: var(--bs-green-bright); }
.bs-word-white{ color: var(--bs-white); }
.bs-word-navy{ color: var(--bs-navy); }