/* =============================================================
   Arcan Pro Class — Design Tokens
   Pronto para uso. Importe junto com fonts.css.

   @import './fonts.css';
   @import './tokens.css';
   ============================================================= */

:root {
  /* ===== Warm neutrals — paleta oficial (7 tons) ===== */
  --pearl:       #FFFCF6;
  --paper:       #FBF6EC;
  --bone:        #F4ECDD;   /* canvas primário */
  --cream:       #EADFC8;
  --sand:        #DCCDB0;
  --taupe-soft:  #C7B698;
  --taupe:       #A89175;   /* ★ acento principal */

  /* ===== Texto (não-decorativos) ===== */
  --ink:         #3F3527;   /* texto primário */
  --ink-soft:    #6B5E4B;   /* texto secundário */
  --whisper:     #BCAA8A;   /* texto terciário / hairlines */

  /* ===== Tipografia ===== */
  --logo:      'Kenao', 'Italiana', serif;                              /* logo "A" + wordmark ARCAN (exclusivo) */
  --display:   'TAN Garland', 'Italiana', serif;                        /* títulos display */
  --body-caps: 'Copperplate 29BC', 'Cinzel', 'Cormorant Garamond', serif; /* caixas-altas estruturais */
  --subline:   'Montserrat', sans-serif;                                /* PRO CLASS, sublabels, UI */
  --editorial: 'Cormorant Garamond', serif;                             /* pull quotes, ledes itálicos */
  --hand:      'Biro Script Plus', 'Caveat', cursive;                   /* manuscrito longo */
  --signature: 'Simple Serenity', 'Abramo', 'Sail', cursive;            /* assinaturas curtas */
  --sans:      'Outfit', sans-serif;                                    /* utilitário (forms, micro UI) */

  /* ===== Layout ===== */
  --max:    1240px;
  --gutter: 56px;
  --grid-cols: 12;
  --grid-gap:  32px;
  --rhythm:    8px;     /* baseline vertical */

  /* ===== Espaçamento (escala) ===== */
  --space-1:  6px;
  --space-2:  14px;
  --space-3:  24px;
  --space-4:  32px;
  --space-5:  48px;
  --space-6:  64px;
  --space-7:  80px;
  --space-8:  120px;

  /* ===== Borders ===== */
  --hairline:    rgba(168,145,117,.16);
  --hairline-strong: rgba(168,145,117,.35);
  --radius-pill: 999px;
  --radius-soft: 2px;     /* máximo permitido — sem cantos arredondados em cards */
}

/* Reset minimal */
*,
*::before,
*::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  background: var(--bone);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}

/* ===== Primitivos tipográficos ===== */
.eyebrow {
  font-family: var(--body-caps);
  font-weight: 400;
  font-size: 11px;
  letter-spacing: .38em;
  text-transform: uppercase;
  color: var(--taupe);
}

.label {
  font-family: var(--body-caps);
  font-weight: 400;
  font-size: 10px;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

.editorial {
  font-family: var(--editorial);
  font-weight: 300;
  font-style: italic;
  color: var(--taupe);
}

.display {
  font-family: var(--display);
  font-weight: 400;
  color: var(--ink);
  letter-spacing: .02em;
  text-transform: uppercase;
  line-height: 1.1;
}

.signature {
  font-family: var(--signature);
  color: var(--taupe);
  font-size: 44px;
  line-height: 1;
}

.handwritten {
  font-family: var(--hand);
  color: var(--taupe);
  line-height: 1.35;
}

.rule       { height: 1px; background: var(--whisper); opacity: .55; border: 0; }
.rule-soft  { height: 1px; background: var(--whisper); opacity: .30; border: 0; }