/* ============================================================
   Digital Valor — Colors & Type Foundations
   "Aquisição previsível de alunos para academias."
   ============================================================ */

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

/* Glacial Indifference — official brand body face, OTF files in fonts/ */
@font-face {
  font-family: 'Glacial Indifference';
  src: url('fonts/GlacialIndifference-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Glacial Indifference';
  src: url('fonts/GlacialIndifference-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---------- Brand Palette ---------- */
  --dv-green:        #9DFF00;   /* Verde Digital — CTAs, highlights, headlines accent */
  --dv-green-soft:   #b6ff3e;
  --dv-green-deep:   #7ad900;
  --dv-purple:       #8A2BE2;   /* Roxo Estratégico — secondary, gradients */
  --dv-purple-soft:  #a55cf0;
  --dv-purple-deep:  #5b1aa0;
  --dv-black:        #050505;   /* Preto Base — primary surface */
  --dv-white:        #ffffff;
  --dv-gray:         #BDBDBD;   /* Cinza Apoio — secondary text */

  /* ---------- Surface scale (derived) ---------- */
  --dv-surface-0:    #050505;   /* base canvas */
  --dv-surface-1:    #0e0e10;   /* raised */
  --dv-surface-2:    #17171a;   /* card */
  --dv-surface-3:    #222227;   /* hover / popover */
  --dv-line:         #2a2a2f;   /* hairline border */
  --dv-line-strong:  #3a3a42;

  /* ---------- Semantic foreground ---------- */
  --fg-1:            var(--dv-white);          /* primary text on dark */
  --fg-2:            #e5e5e8;                  /* body */
  --fg-3:            var(--dv-gray);           /* meta, captions */
  --fg-mute:         #7a7a82;
  --fg-on-green:     var(--dv-black);
  --fg-on-purple:    var(--dv-white);

  /* ---------- Semantic background ---------- */
  --bg-page:         var(--dv-black);
  --bg-card:         var(--dv-surface-2);
  --bg-elev:         var(--dv-surface-3);

  /* ---------- Accent / state ---------- */
  --accent:          var(--dv-green);
  --accent-fg:       var(--dv-black);
  --strategic:       var(--dv-purple);
  --success:         var(--dv-green);
  --danger:          #ff3b5c;
  --warning:         #ffb020;

  /* ---------- Brand gradients ---------- */
  --grad-strategic:  linear-gradient(135deg, #8A2BE2 0%, #5b1aa0 60%, #050505 100%);
  --grad-velocity:   linear-gradient(120deg, #9DFF00 0%, #8A2BE2 100%);
  --grad-fade-down:  linear-gradient(180deg, rgba(5,5,5,0) 0%, rgba(5,5,5,.85) 70%, #050505 100%);
  --glow-green:      0 0 0 1px rgba(157,255,0,.35), 0 0 32px -4px rgba(157,255,0,.55);
  --glow-purple:     0 0 0 1px rgba(138,43,226,.45), 0 0 40px -6px rgba(138,43,226,.55);

  /* ---------- Type ---------- */
  --font-display:    'Poppins', 'Helvetica Neue', system-ui, sans-serif;
  --font-body:       'Glacial Indifference', 'Inter', system-ui, sans-serif;
  --font-mono:       'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Type scale — display goes BIG and TIGHT (fitness-tech vibe) */
  --fs-display-xl:   clamp(64px, 9vw, 144px);
  --fs-display:      clamp(48px, 6vw, 96px);
  --fs-h1:           clamp(40px, 4.5vw, 72px);
  --fs-h2:           clamp(32px, 3.4vw, 52px);
  --fs-h3:           28px;
  --fs-h4:           20px;
  --fs-body-lg:      18px;
  --fs-body:         16px;
  --fs-sm:           14px;
  --fs-xs:           12px;
  --fs-eyebrow:      13px;

  --lh-tight:        0.95;
  --lh-snug:         1.1;
  --lh-normal:       1.45;
  --lh-loose:        1.6;

  --tracking-tight:  -0.02em;
  --tracking-normal: 0;
  --tracking-wide:   0.08em;
  --tracking-eyebrow:0.18em;

  /* ---------- Spacing scale ---------- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* ---------- Radius ---------- */
  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  16px;
  --r-xl:  24px;
  --r-pill:999px;

  /* ---------- Shadows / elevation ---------- */
  --shadow-1: 0 1px 0 rgba(255,255,255,.04) inset, 0 1px 2px rgba(0,0,0,.6);
  --shadow-2: 0 8px 24px -8px rgba(0,0,0,.7), 0 2px 0 rgba(255,255,255,.03) inset;
  --shadow-3: 0 24px 64px -16px rgba(0,0,0,.8), 0 2px 0 rgba(255,255,255,.04) inset;

  /* ---------- Motion ---------- */
  --ease-out:   cubic-bezier(.2,.7,.2,1);
  --ease-in:    cubic-bezier(.5,0,.85,.4);
  --ease-snap:  cubic-bezier(.2,.9,.1,1.2);
  --dur-fast:   140ms;
  --dur-base:   220ms;
  --dur-slow:   420ms;
}

/* ============================================================
   Semantic type classes — drop on any element
   ============================================================ */

.dv-eyebrow {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--dv-green);
}

.dv-display-xl,
.dv-display {
  font-family: var(--font-display);
  font-weight: 800;
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--fg-1);
  text-wrap: balance;
}
.dv-display-xl { font-size: var(--fs-display-xl); font-weight: 900; }
.dv-display    { font-size: var(--fs-display); }

.dv-h1, .dv-h2, .dv-h3, .dv-h4 {
  font-family: var(--font-display);
  color: var(--fg-1);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-tight);
  text-wrap: balance;
}
.dv-h1 { font-size: var(--fs-h1); font-weight: 800; }
.dv-h2 { font-size: var(--fs-h2); font-weight: 700; }
.dv-h3 { font-size: var(--fs-h3); font-weight: 700; }
.dv-h4 { font-size: var(--fs-h4); font-weight: 600; }

.dv-body-lg, .dv-body, .dv-sm {
  font-family: var(--font-body);
  color: var(--fg-2);
  line-height: var(--lh-normal);
  text-wrap: pretty;
}
.dv-body-lg { font-size: var(--fs-body-lg); }
.dv-body    { font-size: var(--fs-body); }
.dv-sm      { font-size: var(--fs-sm); color: var(--fg-3); }

.dv-accent  { color: var(--dv-green); }
.dv-strategic { color: var(--dv-purple); }
.dv-mute    { color: var(--fg-3); }

/* Inline accent — italic-style for a single emphasized word */
.dv-highlight {
  color: var(--dv-green);
  font-weight: inherit;
}

/* ============================================================
   Base reset for design previews
   ============================================================ */
.dv-reset, .dv-reset * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}