/* ===========================================================
   CHARLES WALTER — Tokens de design
   Derivados do acervo real: estúdio high-key (fundo claro),
   estúdio low-key (fundo preto), luz natural em exteriores,
   vermelho e azul cobalto das peças de roupa.
   =========================================================== */

:root {
  /* --- Cor --------------------------------------------------
     ink      : quase-preto quente. Base do site e das séries low-key.
     paper    : off-white quente. Base das séries high-key (estúdio claro).
     acento   : vermelho do blazer da série de retratos (#F02838 amostrado
                direto das fotografias). Para superfícies escuras.
     acento-forte : mesma família, escurecido para superfícies claras.
  */
  --ink:        #0B0A09;
  --ink-2:      #131110;
  --ink-3:      #1E1B18;
  --paper:      #F2EEE8;
  --paper-2:    #E3DCD2;

  --on-ink:     #EDE7DD;
  --on-ink-dim: #9A9188;
  --on-paper:   #17140F;
  --on-paper-dim: #6B655C;

  --acento:        #F02838;
  --acento-forte:  #C81530;

  --line-ink:   rgba(237, 231, 221, .16);
  --line-paper: rgba(23, 20, 15, .14);

  /* --- Tipografia ------------------------------------------- */
  --font-display: "Cormorant Garamond", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --fs-hero:  clamp(3.2rem, 11vw, 9.5rem);
  --fs-h1:    clamp(2.4rem, 6.2vw, 5.4rem);
  --fs-h2:    clamp(1.9rem, 4.2vw, 3.4rem);
  --fs-h3:    clamp(1.35rem, 2.4vw, 2rem);
  --fs-lead:  clamp(1.05rem, 1.55vw, 1.35rem);
  --fs-body:  clamp(0.98rem, 1.15vw, 1.075rem);
  --fs-label: 0.70rem;

  --tracking-label: .22em;
  --tracking-logo:  .38em;

  /* --- Espaço ------------------------------------------------
     Espaçamento generoso: o acervo tem muito espaço negativo.   */
  --gutter:      clamp(1.25rem, 4.5vw, 4.5rem);
  --section-y:   clamp(5.5rem, 13vh, 11rem);
  --stack-sm:    clamp(.75rem, 1.4vw, 1.1rem);
  --stack-md:    clamp(1.5rem, 3vw, 2.5rem);
  --stack-lg:    clamp(3rem, 7vw, 6rem);
  --maxw:        1560px;
  --maxw-text:   62ch;

  /* --- Movimento ---------------------------------------------
     Personalidade: a luz entra devagar. Aberturas verticais,
     nunca saltos. Nada acelerado, nada elástico.                */
  --ease-out:   cubic-bezier(.22, .61, .36, 1);
  --ease-inout: cubic-bezier(.65, .02, .18, 1);
  --t-micro:    220ms;
  --t-reveal:   720ms;
  --t-scene:    1200ms;

  --radius: 0px;           /* nenhum canto arredondado: moldura fotográfica */
  --header-h: 84px;
}

@media (max-width: 860px) {
  :root { --header-h: 64px; }
}

/* Superfícies: dois temas de seção, não dois temas de sistema.
   O site é assumidamente escuro; as seções "paper" são uma
   decisão editorial que espelha o estúdio high-key do Charles. */
.surface-ink   { background: var(--ink);   color: var(--on-ink); }
.surface-ink-2 { background: var(--ink-2); color: var(--on-ink); }
.surface-paper { background: var(--paper); color: var(--on-paper); }

.surface-ink   ::selection { background: var(--acento); color: var(--ink); }
.surface-paper ::selection { background: var(--ink); color: var(--paper); }
