/* ==========================================================================
   Magalhães Advocacia — design tokens v2  ·  "A torre à noite"
   The whole site is the Edifício Itália at night: warm window light (lamp),
   brass fittings, concrete slabs, deep night sky. Consume these; never
   redefine them in other files.
   ========================================================================== */

:root {
  /* Night (backgrounds) */
  --bg:        #0a0b11;   /* page base, deepest night */
  --bg-2:      #10121b;   /* raised surfaces without glass */
  --bg-3:      #171a26;   /* hover / pressed */
  --sky-low:   #1b1420;   /* street-level haze (sodium + city glow) */
  --sky-high:  #05060b;   /* altitude */

  /* Glass (content sits on frosted glass panels over the 3D world) */
  --glass:       rgba(16, 18, 28, .58);
  --glass-2:     rgba(22, 25, 38, .72);
  --glass-edge:  rgba(240, 214, 160, .14);   /* warm hairline on glass */
  --glass-blur:  14px;

  /* Concrete (floor slabs, structure) */
  --concrete:   #1d1e24;
  --concrete-2: #26272e;
  --hatch:      rgba(240, 231, 216, .07);

  /* Text */
  --text:    #f0e8d9;                  /* warm ivory */
  --text-2:  rgba(240, 232, 217, .74);
  --muted:   rgba(240, 232, 217, .52);
  --faint:   rgba(240, 232, 217, .16);
  --line:    rgba(240, 232, 217, .11);
  --line-2:  rgba(240, 232, 217, .22);

  /* Light & metal */
  --lamp:     #f2b65a;   /* warm window light — primary accent, CTAs, glows */
  --lamp-2:   #ffd48a;   /* hot core of the light, hover */
  --lamp-dim: rgba(242, 182, 90, .18);
  --lamp-glow: 0 0 24px rgba(242, 182, 90, .35), 0 0 80px rgba(242, 182, 90, .12);
  --brass:    #c9a25e;   /* fittings, numerals, hairlines, citations */
  --brass-2:  #e0c084;
  --oxblood:  #8e2a2f;   /* the firm's colour: seals, small fills, the 272C beacon */
  --oxblood-2:#b5434a;   /* oxblood readable on night (emphasis text) */
  --cool:     #9fb7d9;   /* rare cool window light / LED */
  --whatsapp: #2c8a5a;

  /* Type */
  --f-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --f-body:    "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  --f-mono:    "IBM Plex Mono", ui-monospace, Menlo, monospace;

  --fs-hero:  clamp(44px, 8vw, 128px);
  --fs-h2:    clamp(34px, 5vw, 74px);
  --fs-h3:    clamp(22px, 2.2vw, 30px);
  --fs-lead:  clamp(18px, 1.5vw, 22px);
  --fs-body:  17px;
  --fs-small: 14px;
  --fs-mono:  11.5px;

  /* Motion */
  --ease-out:  cubic-bezier(.16, 1, .3, 1);
  --ease-io:   cubic-bezier(.77, 0, .175, 1);
  --ease-door: cubic-bezier(.83, 0, .17, 1);
  --dur-1: .25s;
  --dur-2: .6s;
  --dur-3: 1.1s;

  /* Layout */
  --gutter:   clamp(16px, 4vw, 56px);
  --maxw:     1360px;
  --measure:  68ch;
  --radius:   4px;
  --radius-2: 10px;
  --header-h: 76px;
  --rail-w:   clamp(0px, 9vw, 132px);   /* desktop right rail reserved for the tower nav */
  --shadow:   0 30px 80px -30px rgba(0, 0, 0, .7);

  /* Legacy aliases (v1 names) mapped to the night palette — do not use in new code */
  --paper: var(--bg); --paper-2: var(--bg-2); --paper-3: var(--bg-3); --card: var(--glass-2);
  --ink: var(--text); --ink-2: var(--text-2); --night: var(--bg); --night-2: var(--bg-2);
  --on-night: var(--text); --on-night-2: var(--text-2); --line-night: var(--line);
  --brass-text: var(--brass);
}

/* Shared micro-utilities */
.mono  { font-family: var(--f-mono); font-size: var(--fs-mono); letter-spacing: .08em; text-transform: uppercase; }
.cite  { font-family: var(--f-mono); font-size: 12px; letter-spacing: .02em; color: var(--brass); }
.serif { font-family: var(--f-display); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
::selection { background: var(--lamp); color: var(--bg); }
:focus-visible { outline: 2px solid var(--lamp); outline-offset: 3px; border-radius: 2px; }
