/* ============================================================
   De Repente 15 — Colors & Type
   Source of truth: assets/identidade-visual.pdf, assets/mini-manual.pdf
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Yellowtail&display=swap');

/* ---------- Poppins — official brand font (TTF) ---------- */
@font-face { font-family: "Poppins"; font-weight: 100; font-style: normal; src: url("../fonts/Poppins-Thin.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 100; font-style: italic; src: url("../fonts/Poppins-ThinItalic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 200; font-style: normal; src: url("../fonts/Poppins-ExtraLight.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 200; font-style: italic; src: url("../fonts/Poppins-ExtraLightItalic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 300; font-style: normal; src: url("../fonts/Poppins-Light.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 300; font-style: italic; src: url("../fonts/Poppins-LightItalic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 400; font-style: normal; src: url("../fonts/Poppins-Regular.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 400; font-style: italic; src: url("../fonts/Poppins-Italic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 500; font-style: normal; src: url("../fonts/Poppins-Medium.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 500; font-style: italic; src: url("../fonts/Poppins-MediumItalic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 600; font-style: normal; src: url("../fonts/Poppins-SemiBold.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 600; font-style: italic; src: url("../fonts/Poppins-SemiBoldItalic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 700; font-style: normal; src: url("../fonts/Poppins-Bold.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 700; font-style: italic; src: url("../fonts/Poppins-BoldItalic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 800; font-style: normal; src: url("../fonts/Poppins-ExtraBold.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 800; font-style: italic; src: url("../fonts/Poppins-ExtraBoldItalic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 900; font-style: normal; src: url("../fonts/Poppins-Black.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 900; font-style: italic; src: url("../fonts/Poppins-BlackItalic.ttf") format("truetype"); font-display: swap; }

:root {
  /* ---------- BRAND COLOR — primary ---------- */
  --dr-pink:        #DD2655;   /* primary action / impact (mini-manual) */
  --dr-pink-bright: #DD385D;   /* identidade visual hex (display variant) */
  --dr-wine:        #6A0A33;   /* primary brand bg / serif text */
  --dr-wine-deep:   #50061f;   /* deepest wine, used for shadows/contrast */
  --dr-vinho-pdf:   #760F3D;   /* CMYK match from identidade visual */
  --dr-support:     #BF1F4C;   /* mid pink — gradients, icons, accents */

  /* ---------- NEUTRALS ---------- */
  --dr-white:       #FFFFFF;
  --dr-paper:       #FAF7F8;   /* off-white background, slight pink cast */
  --dr-cream:       #F4ECEE;   /* warmer paper tone */
  --dr-rose-mist:   #F7E6EB;   /* tinted card background */
  --dr-ink:         #1A1A1A;   /* body text on light bg */
  --dr-ink-soft:    #3A2730;   /* secondary text on light */
  --dr-line:        #E6D6DB;   /* hairline borders on paper */

  /* ---------- METALLIC ACCENTS (from imagery) ---------- */
  --dr-gold:        #C9A24A;   /* sparing — frames, fine rules */
  --dr-gold-soft:   #E2C988;
  --dr-pearl:       #F2E9DC;

  /* ---------- SEMANTIC FG / BG ---------- */
  --fg-1: var(--dr-wine);
  --fg-2: var(--dr-ink);
  --fg-3: var(--dr-ink-soft);
  --fg-on-wine: var(--dr-paper);
  --fg-on-pink: var(--dr-white);

  --bg-paper: var(--dr-paper);
  --bg-card:  var(--dr-white);
  --bg-wine:  var(--dr-wine);
  --bg-pink:  var(--dr-pink);
  --bg-tint:  var(--dr-rose-mist);

  /* TYPE FAMILIES
     ----------------------------------------------------------
     Decision (May 2026): the active display family is POPPINS
     Black / ExtraBold, all-caps. Cinzel Decorative is kept as a
     heritage option for the original-logo lockup only. The
     identity was created 16+ years ago and has been refreshed
     for a modern, editorial feel.
     ---------------------------------------------------------- */

  /* Display: Poppins Black/ExtraBold caps — modern, fresh */
  --font-display: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Heritage display — only for the original Cinzel-based logo lockup */
  --font-display-heritage: "Cinzel Decorative", "Trajan Pro", "Cormorant Garamond", serif;

  /* Editorial italic accent — Poppins Italic (medium for ledes/quotes) */
  --font-serif:   "Poppins", system-ui, sans-serif;

  /* Script accent — Poppins Light Italic for signatures/flourishes
     (originally Yellowtail / Fingbanger; unified into the Poppins family). */
  --font-script:  "Poppins", system-ui, sans-serif;

  /* UI / sans for product surfaces — POPPINS is the official brand font (mini-manual). */
  --font-sans:    "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-ui:      "Poppins", system-ui, sans-serif;

  /* ---------- TYPE SCALE (semantic) ---------- */
  --h1-size: clamp(2.75rem, 6vw, 5rem);
  --h1-line: 0.95;
  --h1-track: 0.02em;

  --h2-size: clamp(2rem, 4vw, 3rem);
  --h2-line: 1.05;
  --h2-track: 0.03em;

  --h3-size: clamp(1.4rem, 2.4vw, 1.875rem);
  --h3-line: 1.15;

  --eyebrow-size: 0.78rem;
  --eyebrow-track: 0.28em;

  --body-size: 1.0625rem;
  --body-line: 1.6;

  --small-size: 0.875rem;

  /* ---------- RADII ---------- */
  --r-sm: 4px;
  --r-md: 10px;
  --r-lg: 18px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* ---------- SHADOWS — soft, editorial, never dramatic ---------- */
  --shadow-card:   0 1px 2px rgba(106,10,51,0.06), 0 8px 24px rgba(106,10,51,0.08);
  --shadow-lift:   0 2px 4px rgba(106,10,51,0.10), 0 16px 40px rgba(106,10,51,0.14);
  --shadow-pink:   0 10px 30px rgba(221,38,85,0.28);
  --shadow-inner:  inset 0 0 0 1px rgba(106,10,51,0.08);

  /* ---------- SPACING (8px base, +editorial 4) ---------- */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;

  /* ---------- MOTION ---------- */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur-base: 240ms;
  --dur-slow: 480ms;
}

/* ============================================================
   SEMANTIC TYPE — apply directly to elements
   ============================================================ */

body.dr {
  font-family: var(--font-sans);
  font-size: var(--body-size);
  line-height: var(--body-line);
  color: var(--fg-2);
  background: var(--bg-paper);
  -webkit-font-smoothing: antialiased;
}

.dr-display {
  /* Modern, fresh display: Poppins Black caps */
  font-family: var(--font-display);
  font-weight: 900;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

.dr-serif {
  font-family: var(--font-sans);
  font-weight: 500;
  font-style: italic;
}

.dr-script {
  font-family: var(--font-sans);
  font-weight: 300;
  font-style: italic;
}

.dr-eyebrow {
  font-family: var(--font-sans);
  font-size: var(--eyebrow-size);
  letter-spacing: var(--eyebrow-track);
  text-transform: uppercase;
  font-weight: 600;
  color: var(--dr-pink);
}

h1.dr, .h1.dr {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: var(--h1-size);
  line-height: var(--h1-line);
  letter-spacing: var(--h1-track);
  text-transform: uppercase;
  color: var(--dr-wine);
  margin: 0;
}

h2.dr, .h2.dr {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--h2-size);
  line-height: var(--h2-line);
  letter-spacing: var(--h2-track);
  text-transform: uppercase;
  color: var(--dr-wine);
  margin: 0;
}

h3.dr, .h3.dr {
  font-family: var(--font-sans);
  font-weight: 600;
  font-style: italic;
  font-size: var(--h3-size);
  line-height: var(--h3-line);
  color: var(--dr-wine);
  margin: 0;
}

p.dr, .p.dr {
  font-family: var(--font-sans);
  font-size: var(--body-size);
  line-height: var(--body-line);
  color: var(--fg-2);
  text-wrap: pretty;
  margin: 0 0 1em 0;
}

.dr-lede {
  font-family: var(--font-sans);
  font-style: italic;
  font-weight: 500;
  font-size: 1.375rem;
  line-height: 1.5;
  color: var(--dr-ink-soft);
}

small.dr, .small.dr {
  font-size: var(--small-size);
  color: var(--dr-ink-soft);
}

/* Editorial "rule" — the gold hairline used between sections */
.dr-rule {
  display: block;
  width: 64px;
  height: 1px;
  border: 0;
  background: var(--dr-gold);
  margin: var(--s-5) 0;
}

/* The signature treatment: brand-name lockup with "15" pulled red */
.dr-lockup { color: var(--dr-wine); }
.dr-lockup .num { color: var(--dr-pink); }