/* ============================================================
   VARIÁVEIS DE DESIGN — FitTrack
   Edite aqui para mudar cores, fontes e espaçamentos globais.
============================================================ */

/* ---------- DARK MODE (padrão) ---------- */
:root {
  /* Fundos — três camadas de profundidade, nunca preto puro */
  --bg:          #050505;
  --bg2:         #080809;
  --bg3:         #0c0c0d;
  --bg4:         #121214;

  /* Tipografia */
  --text:        #f0f0f2;
  --text2:       #8e8e96;
  --text3:       #55555d;

  /* Destaque (verde FitTrack) */
  --accent:      #30d158;
  --accent2:     #34c759;
  --accent-dim:  rgba(48, 209, 88, .10);

  /* Bordas / Glass */
  --border:      rgba(255, 255, 255, .06);
  --border2:     rgba(255, 255, 255, .10);
  --border-hi:   rgba(255, 255, 255, .13);

  /* Gradient border — duas paradas para o truque padding-box/border-box */
  --border-shine: rgba(255, 255, 255, .12), rgba(255, 255, 255, .02);

  --glass:       rgba(255, 255, 255, .025);
  --glass2:      rgba(255, 255, 255, .05);

  /* Sombra global — multicamada para profundidade real */
  --shadow:
    0 0 0 0.5px rgba(255,255,255,.07),
    0 8px 24px  rgba(0,0,0,.40),
    0 40px 100px rgba(0,0,0,.70);

  /* Componente Phone */
  --phone-bg:    #0a0a0b;
  --phone-screen:#0d0d0e;

  /* Navbar blur */
  --nav-blur:    rgba(5, 5, 5, .82);

  /* Border-radius scale */
  --radius-sm:   10px;
  --radius-md:   18px;
  --radius-lg:   28px;
  --radius-xl:   48px;

  /* Fonte */
  --font: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Easings — spring premium que transmite tátilidade */
  --ease:        cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-sharp:  cubic-bezier(0.4,  0,   0.2, 1);

  /* Espaçamento de seção "Apple Style" */
  --section-pad: clamp(140px, 16vw, 220px);
}

/* ---------- LIGHT MODE ---------- */
[data-theme="light"] {
  --bg:          #fafafa;
  --bg2:         #f4f4f6;
  --bg3:         #ebebee;
  --bg4:         #ffffff;

  --text:        #1a1a1c;
  --text2:       #606066;
  --text3:       #8a8a90;

  --accent:      #1a7f37;
  --accent2:     #248a3d;
  --accent-dim:  rgba(26, 127, 55, .08);

  --border:      rgba(0, 0, 0, .06);
  --border2:     rgba(0, 0, 0, .10);
  --border-hi:   rgba(0, 0, 0, .14);
  --border-shine: rgba(0, 0, 0, .10), rgba(0, 0, 0, .02);

  --glass:       rgba(0, 0, 0, .015);
  --glass2:      rgba(0, 0, 0, .04);

  --shadow:
    0 0 0 0.5px rgba(0,0,0,.06),
    0 8px 24px  rgba(0,0,0,.08),
    0 40px 100px rgba(0,0,0,.14);

  --phone-bg:    #1a1a1a;
  --phone-screen:#111111;

  --nav-blur:    rgba(250, 250, 250, .85);
}