/* Hallmark · macrostructure: Split Studio · H2 diptych knobs: ratio=7/5, right=photo, divider=negative-space
 * theme: custom · vibe: "acolhedor, universitário, marca viva" · paper: oklch(97.5% 0.008 300) · accent: oklch(48% 0.185 302)
 * display: Bricolage Grotesque · body: Geist · axes: light / geometric-sans / chromatic-violet ~302°
 * genre: playful · nav: N7 · footer: Ft5 · enrichment: none (fotografia real)
 * studied: no · context: inferred (público) + explícito (uso, tom) · v0.8.0
 */

/* ==========================================================================
   CDU Coliving — design tokens
   Fonte única de verdade. Nenhum valor de cor ou fonte pode aparecer
   solto em style.css — tudo passa por var(--token).
   ========================================================================== */

:root {
  /* --- Cor ---------------------------------------------------------------
     Âncora de matiz: 300 (roxo CDU). Todo neutro é tingido nessa direção,
     por isso os cinzas "parecem" da marca sem serem coloridos.
     Disciplina de acento: o roxo do arco carrega AÇÃO (botões, foco, link
     ativo) e também as superfícies escuras. Ciano identifica o CDU Rooms,
     amarelo identifica o CDU Studios — só como marca sólida pequena.
     Nenhum laranja: não existe no logo nem no prédio.
  */
  --color-paper:        oklch(97.5% 0.008 300);
  --color-paper-2:      oklch(94.5% 0.012 300);
  --color-paper-3:      oklch(91%   0.016 300);

  --color-ink:          oklch(21%   0.045 300);
  --color-ink-2:        oklch(38%   0.030 300);
  --color-muted:        oklch(52%   0.022 300);

  --color-rule:         oklch(86%   0.014 300);
  --color-rule-2:       oklch(91.5% 0.010 300);

  /* Roxo escuro — superfície de marca (faixa de visita, rodapé) */
  --color-deep:         oklch(30%   0.115 302);
  --color-deep-2:       oklch(24%   0.100 302);
  --color-on-deep:      oklch(96%   0.014 300);
  --color-on-deep-2:    oklch(79%   0.030 300);
  --color-rule-deep:    oklch(41%   0.075 302);

  /* Roxo do arco do logo — AÇÃO. Das três cores da marca é a única
     que aguenta texto por cima: L 48 sobre texto claro dá ~7:1.
     Ciano e amarelo em pastel dariam ~2:1 e reprovariam. */
  --color-accent:       oklch(48%   0.185 302);
  --color-accent-hover: oklch(42%   0.180 302);
  --color-accent-ink:   oklch(97.5% 0.010 300);
  --color-focus:        oklch(52%   0.215 302);

  /* Ciano e amarelo da marca — identificam as duas unidades.
     Só aparecem como marca sólida pequena, nunca sob texto. */
  --color-rooms:        oklch(78%   0.105 215);
  --color-rooms-deep:   oklch(45%   0.105 230);
  --color-studios:      oklch(86%   0.140 92);
  --color-studios-deep: oklch(48%   0.105 80);

  /* --- Tipografia --------------------------------------------------------
     Duas famílias. Contraste de peso 800 vs 400 — não 600 vs 400.
  */
  --font-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --font-body:    "Geist", ui-sans-serif, system-ui, sans-serif;

  /* Escala 1.25 (terça maior), a partir de 17px de corpo */
  --text-xs:        0.75rem;
  --text-sm:        0.875rem;
  --text-base:      1.0625rem;
  --text-md:        1.25rem;
  --text-lg:        1.5rem;
  --text-xl:        1.875rem;
  --text-2xl:       2.375rem;
  --text-3xl:       3rem;
  --text-display:   clamp(2.5rem, 5vw + 1rem, 4.5rem);
  --text-display-s: clamp(2rem, 3.5vw + 0.75rem, 3.25rem);

  /* --- Espaço (escala 4pt) ----------------------------------------------- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2rem;
  --space-xl:  3rem;
  --space-2xl: 4.5rem;
  --space-3xl: 7rem;
  --space-4xl: 10rem;

  /* --- Linhas e raios ----------------------------------------------------- */
  --rule-hair:  1px;
  --rule-slab:  2px;
  --radius-sm:   8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --radius-pill: 999px;

  /* --- Movimento ---------------------------------------------------------- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  420ms;

  /* --- Camadas ------------------------------------------------------------ */
  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 100;
  --z-nav: 200;
  --z-overlay: 300;

  /* --- Medidas ------------------------------------------------------------ */
  --measure: 62ch;
  --container: 76rem;
  --gutter: clamp(1.25rem, 5vw, 3rem);
}
