/* =============================================================
   AIP Cards, Design Tokens (v1.0)
   by Botto Digital, Luxo Tecnologico, WCAG AA, mobile-first
   Fonte canonica: brand/visual-identity-system.md
   Serve a landing E a app. Zero hardcoded values: usar sempre var(--aip-*).
   ============================================================= */

:root {
  /* ----------------------------------------------------------
     COR, base escura e superficies (palco)
     ---------------------------------------------------------- */
  --aip-base-900: #0B0B0F;   /* Obsidian, background dominante */
  --aip-base-800: #121218;   /* Onyx, seccoes alternadas, modais */
  --aip-surface-700: #1A1A22;/* Graphite, cards, paineis */
  --aip-surface-600: #24242E;/* Slate, card elevado, hover, inputs */
  --aip-border: rgba(245, 243, 232, 0.10);        /* hairline */
  --aip-border-strong: rgba(245, 243, 232, 0.16); /* foco, separadores */

  /* ----------------------------------------------------------
     COR, ouro e metal (acento de prestigio, <10% do ecra)
     ---------------------------------------------------------- */
  --aip-gold-300: #F4E2B8;   /* Champagne, highlight, topo do gradiente */
  --aip-gold-500: #D4AF37;   /* Core gold, icones, bordas, texto pequeno */
  --aip-gold-600: #B8902A;   /* Antique, meio-tom, hover do ouro */
  --aip-gold-800: #7A5C16;   /* Bronze deep, sombra, base do gradiente */
  --aip-gold-gradient: linear-gradient(135deg, #F4E2B8 0%, #D4AF37 38%, #B8902A 62%, #7A5C16 100%);

  /* ----------------------------------------------------------
     COR, tinta de texto
     ---------------------------------------------------------- */
  --aip-ink: #F5F3E8;        /* Cream, texto e titulos primarios */
  --aip-ink-muted: #A8A8B3;  /* texto secundario, legendas */
  --aip-ink-faint: #6E6E78;  /* placeholder, desactivado (so texto grande) */
  --aip-ink-on-gold: #1A140A;/* texto/icone sobre ouro solido (AA garantido) */

  /* ----------------------------------------------------------
     COR, semanticas (discretas, nunca competem com o ouro)
     ---------------------------------------------------------- */
  --aip-success: #3FB984;
  --aip-warning: #E0A52E;
  --aip-danger:  #E5604D;
  --aip-info:    #5AA6D6;
  /* fundos de badge (semantica a baixa opacidade) */
  --aip-success-bg: rgba(63, 185, 132, 0.14);
  --aip-warning-bg: rgba(224, 165, 46, 0.14);
  --aip-danger-bg:  rgba(229, 96, 77, 0.14);
  --aip-info-bg:    rgba(90, 166, 214, 0.14);
  --aip-gold-bg:    rgba(212, 175, 55, 0.12); /* fundo de badge de cupao/destaque */
  --aip-gold-border-soft: rgba(212, 175, 55, 0.30);

  /* ----------------------------------------------------------
     TIPOGRAFIA, familias (Google Fonts)
     ---------------------------------------------------------- */
  --aip-font-display: "Fraunces", Georgia, serif;
  --aip-font-body: "Inter", -apple-system, "Segoe UI", Roboto, sans-serif;
  --aip-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;

  /* TIPOGRAFIA, escala mobile-first (valores mobile; ver --*-desktop) */
  --aip-fs-display-xl: 40px;  --aip-fs-display-xl-desktop: 64px;  /* Fraunces 900, lh 1.05 */
  --aip-fs-display-l: 30px;   --aip-fs-display-l-desktop: 44px;   /* Fraunces 700, lh 1.10 */
  --aip-fs-heading: 22px;     --aip-fs-heading-desktop: 28px;     /* Fraunces 600, lh 1.20 */
  --aip-fs-title: 18px;       --aip-fs-title-desktop: 20px;       /* Inter 600, lh 1.30 */
  --aip-fs-body-l: 17px;      --aip-fs-body-l-desktop: 18px;      /* Inter 400, lh 1.55 */
  --aip-fs-body: 15px;        --aip-fs-body-desktop: 16px;        /* Inter 400, lh 1.55 */
  --aip-fs-caption: 13px;     /* Inter 500, lh 1.40 */
  --aip-fs-overline: 12px;    /* JetBrains Mono 500, lh 1.30, uppercase */
  --aip-fs-price-hero: 48px;  --aip-fs-price-hero-desktop: 72px; /* Fraunces 900, lh 1.0 */
  --aip-fs-price-strike: 22px;--aip-fs-price-strike-desktop: 28px;/* Inter 500, lh 1.0 */

  /* TIPOGRAFIA, pesos */
  --aip-fw-regular: 400;
  --aip-fw-medium: 500;
  --aip-fw-semibold: 600;
  --aip-fw-display: 700;
  --aip-fw-black: 900;

  /* TIPOGRAFIA, line-heights */
  --aip-lh-tight: 1.05;
  --aip-lh-display: 1.10;
  --aip-lh-heading: 1.20;
  --aip-lh-title: 1.30;
  --aip-lh-body: 1.55;
  --aip-lh-flat: 1.0;

  /* TIPOGRAFIA, tracking */
  --aip-tracking-mono: 0.08em; /* overline / labels mono uppercase */

  /* ----------------------------------------------------------
     ESPACAMENTO (escala 4px)
     ---------------------------------------------------------- */
  --aip-space-0: 0;
  --aip-space-1: 4px;
  --aip-space-2: 8px;
  --aip-space-3: 12px;
  --aip-space-4: 16px;
  --aip-space-5: 24px;
  --aip-space-6: 32px;
  --aip-space-7: 48px;
  --aip-space-8: 64px;
  --aip-space-9: 96px;

  /* ----------------------------------------------------------
     RAIOS
     ---------------------------------------------------------- */
  --aip-radius-sm: 8px;    /* inputs, badges */
  --aip-radius-md: 14px;   /* cards, botoes */
  --aip-radius-lg: 22px;   /* paineis, cartao de contacto */
  --aip-radius-card: 16px; /* proporcao do cartao fisico, simbolo */
  --aip-radius-pill: 999px;/* pills/badges de estado */

  /* ----------------------------------------------------------
     SOMBRAS E BRILHOS
     ---------------------------------------------------------- */
  --aip-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --aip-shadow-2: 0 8px 28px rgba(0, 0, 0, 0.55);
  --aip-glow-gold: 0 0 0 1px rgba(212, 175, 55, 0.4), 0 6px 24px rgba(212, 175, 55, 0.22);
  --aip-glow-nfc: 0 0 32px rgba(244, 226, 184, 0.28);

  /* ----------------------------------------------------------
     MOTION
     ---------------------------------------------------------- */
  --aip-motion-fast: 120ms;
  --aip-motion-base: 220ms;
  --aip-motion-slow: 420ms;
  --aip-motion-nfc: 1400ms;
  --aip-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --aip-ease-emphasis: cubic-bezier(0.2, 0.7, 0.2, 1);

  /* ----------------------------------------------------------
     LAYOUT
     ---------------------------------------------------------- */
  --aip-container-max: 1200px;
  --aip-container-pad: 20px;     /* mobile */
  --aip-tap-target-min: 44px;    /* alvo de toque minimo, acessibilidade */
}

/* Desktop: subir escala tipografica, padding e separacao de seccoes */
@media (min-width: 768px) {
  :root {
    --aip-fs-display-xl: var(--aip-fs-display-xl-desktop);
    --aip-fs-display-l: var(--aip-fs-display-l-desktop);
    --aip-fs-heading: var(--aip-fs-heading-desktop);
    --aip-fs-title: var(--aip-fs-title-desktop);
    --aip-fs-body-l: var(--aip-fs-body-l-desktop);
    --aip-fs-body: var(--aip-fs-body-desktop);
    --aip-fs-price-hero: var(--aip-fs-price-hero-desktop);
    --aip-fs-price-strike: var(--aip-fs-price-strike-desktop);
    --aip-container-pad: 32px;
  }
}

/* Acessibilidade: desligar movimento nao-essencial */
@media (prefers-reduced-motion: reduce) {
  :root {
    --aip-motion-fast: 0ms;
    --aip-motion-base: 0ms;
    --aip-motion-slow: 0ms;
    --aip-motion-nfc: 0ms;
  }
}
