/* ==========================================================================
   RIFTI CYBERSECURITY — DESIGN TOKENS & TYPOGRAPHY SYSTEM (SWISS / SAGE)
   Paleta 60/30/10: 60% Branco (#FFFFFF), 30% Preto (#0A0A0A), 10% Verde (#00BD0E)
   Tipografia: Helvetica Now Text (Thin, ExtraLight, Light, Regular, Medium, Bold)
   ========================================================================== */

/* Font-Faces: Helvetica Now Text */
@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Now Text';
  src: url('../fonts/HelveticaNowText-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ==========================================================================
     PALETA 60 / 30 / 10 OFICIAL RIFTI (WHITE ARCHITECTURAL / SAGE)
     ========================================================================== */
  /* 60% Dominante: Branco Puro & Cinzas Editoriais de Transição */
  --color-bg-primary: #FFFFFF;
  --color-bg-secondary: #F8F9FA;
  --color-bg-subtle: #F0F2F5;
  --color-bg-card: #FFFFFF;
  --color-bg-dot: rgba(10, 10, 10, 0.06);

  /* Dobras de Destaque Contrastante (Dobra 4 e Dobra 7) */
  --color-bg-dark-section: #0A0A0C;
  --color-bg-dark-card: #121216;
  --color-border-dark: rgba(255, 255, 255, 0.1);

  /* 30% Estrutural / Tipográfico: Preto Puro e Grafite Profundo */
  --color-text-primary: #0A0A0C;
  --color-text-secondary: #4A4A54;
  --color-text-muted: #7A7A88;
  --color-text-inverse: #FFFFFF;
  --color-text-inverse-muted: #A0A0B0;

  --color-border-light: rgba(10, 10, 12, 0.08);
  --color-border-medium: rgba(10, 10, 12, 0.14);
  --color-border-strong: rgba(10, 10, 12, 0.28);

  /* 10% Acento Técnico de Precisão: Verde Esmeralda Rifti */
  --color-accent: #00BD0E;
  --color-accent-hover: #00990B;
  --color-accent-light: rgba(0, 189, 14, 0.08);
  --color-accent-glow: rgba(0, 189, 14, 0.22);
  --color-accent-border: rgba(0, 189, 14, 0.35);

  /* Tipografia */
  --font-family-base: 'Helvetica Now Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Espaçamento Editorial Suíço */
  --space-unit: 8px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 128px;
  --space-6xl: 160px;

  /* Container */
  --container-max: 1200px;
  --container-narrow: 860px;
  --container-pad: 32px;

  /* Bordas / Squircles Limpos */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Sombras Precisas (Clean White Theme) */
  --shadow-subtle: 0 2px 10px rgba(0, 0, 0, 0.03);
  --shadow-card: 0 8px 30px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02);
  --shadow-floating: 0 20px 50px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.03);
  --shadow-dark-card: 0 16px 48px rgba(0, 0, 0, 0.6);

  /* Transições Suaves */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Reset Moderno */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  font-size: 16px;
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  font-family: var(--font-family-base);
  scroll-behavior: auto; /* Gerenciado com precisão pelo Lenis */
}

body {
  overflow-x: hidden;
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  line-height: 1.5;
}

/* Background com textura sutil de grid de pontos (Padrão Sage) */
body.sage-bg {
  background-color: #FFFFFF;
  background-image: radial-gradient(var(--color-bg-dot) 1px, transparent 1px);
  background-size: 24px 24px;
  background-position: 0 0;
}

::selection {
  background-color: var(--color-accent);
  color: #0A0A0C;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font-family: inherit;
  border: none;
  background: none;
  cursor: pointer;
}

img, svg {
  display: block;
  max-width: 100%;
}

.container {
  width: 100%;
  max-width: var(--container-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--container-pad);
  padding-right: var(--container-pad);
}

.container--narrow {
  max-width: var(--container-narrow);
}