/* Anissa Kaori — estilos do site (fontes + tokens). Gerado automaticamente. */

/* === tokens/fonts.css === */
/* Anissa Kaori — Webfonts
 * Two typographic voices from the brand manual:
 *   Cormorant Garamond — títulos (the warm, editorial voice)
 *   Archivo           — textos & rótulos (the precise, contemporary/sporty voice)
 * Both are Google Fonts originals; loaded from the Google Fonts CDN so the exact
 * families ship to consumers. No substitution was required.
 */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Archivo:wght@400;500;600;700&display=swap');


/* === tokens/colors.css === */
/* Anissa Kaori — Color
 * "Base neutra, alma quente." A neutral ink-to-paper base sustains the intimate
 * black-and-white of the essays; one warm accent carries the energy.
 */
:root {
  /* ---- Neutros (base) ---- */
  --ak-tinta:        #17130F; /* Tinta — near-black ink, the darkest note */
  --ak-grafite:      #4A423A; /* Grafite — graphite brown-gray */
  --ak-cinza-quente: #857B70; /* Cinza quente — warm mid gray */
  --ak-papel:        #F6F1EA; /* Papel — warm off-white paper */

  /* Paper tints derived for surfaces & hairlines */
  --ak-papel-2:      #EFE8DE; /* slightly deeper paper for cards on paper */
  --ak-linha:        #DED4C6; /* hairline / border on paper */

  /* ---- Destaques quentes (choose one) ---- */
  --ak-terracota:    #B85C38; /* Terracota — the preferred/default accent */
  --ak-ambar:        #CE8A3D; /* Âmbar */
  --ak-dourado:      #DBA94E; /* Dourado pôr-do-sol */

  /* The live accent. Swap this one line (or the three-way in the panel) to
     re-tint the whole brand. Default = Terracota. */
  --ak-accent:        var(--ak-terracota);
  --ak-accent-press:  #9E4B2C; /* terracota, pressed/darker */
  --ak-accent-soft:   #EBD9CE; /* terracota wash on paper */

  /* ---- Semantic aliases ---- */
  --text-strong:   var(--ak-tinta);      /* headlines, primary text on paper */
  --text-body:     var(--ak-grafite);    /* body copy */
  --text-muted:    var(--ak-cinza-quente);/* captions, meta, labels */
  --text-on-dark:  var(--ak-papel);      /* text over ink */
  --text-on-accent:#FBF6EF;              /* text over the warm accent */

  --surface-page:   var(--ak-papel);     /* default page */
  --surface-card:   #FFFFFF;             /* raised card */
  --surface-ink:    var(--ak-tinta);     /* dark/immersive sections */
  --surface-sunk:   var(--ak-papel-2);   /* recessed panels */

  --border-hair:    var(--ak-linha);     /* 1px rules on paper */
  --border-strong:  var(--ak-grafite);   /* emphatic frames */
  --border-on-dark: rgba(246,241,234,0.18);

  --accent:        var(--ak-accent);
  --accent-press:  var(--ak-accent-press);
  --accent-soft:   var(--ak-accent-soft);
}


/* === tokens/typography.css === */
/* Anissa Kaori — Typography
 * "Duas vozes tipográficas."
 *   Cormorant Garamond  → títulos, nomes, frases de destaque (elegant, editorial)
 *   Archivo             → legendas, rótulos CAIXA-ALTA espaçada, texto corrido (precise, sporty)
 *
 * Signature move: Archivo labels are UPPERCASE with wide letter-spacing
 * (the "R Ó T U L O S" treatment seen throughout the manual).
 */
:root {
  /* ---- Families ---- */
  --font-display: 'Cormorant Garamond', 'Georgia', serif;
  --font-sans:    'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    var(--font-sans);

  /* ---- Weights ---- */
  --fw-display-regular: 400; /* @kind other */
  --fw-display-medium:  500; /* @kind other */
  --fw-display-semi:    600; /* @kind other */
  --fw-sans-regular:    400; /* @kind other */
  --fw-sans-medium:     500; /* @kind other */
  --fw-sans-semi:       600; /* @kind other */
  --fw-sans-bold:       700; /* @kind other */

  /* ---- Display scale (Cormorant) ---- */
  --fs-display-1: 88px;  /* hero wordmark / cover */
  --fs-display-2: 64px;
  --fs-title-1:   44px;
  --fs-title-2:   32px;
  --fs-title-3:   24px;
  --lh-display:   1.02; /* @kind other */
  --lh-title:     1.1; /* @kind other */

  /* ---- Text scale (Archivo) ---- */
  --fs-lead:  20px;  /* intro paragraphs */
  --fs-body:  16px;
  --fs-small: 14px;
  --fs-meta:  13px;
  --lh-body:  1.6; /* @kind other */
  --lh-tight: 1.3; /* @kind other */

  /* ---- Label / rótulo (Archivo uppercase, spaced) ---- */
  --fs-label:   12px;
  --fs-label-sm:10.5px;
  --ls-label:   0.28em; /* @kind other */
  --ls-label-lg:0.42em; /* @kind other */
  --fw-label:   var(--fw-sans-semi); /* @kind other */

  /* Display tracking is tight & elegant */
  --ls-display: -0.01em; /* @kind other */
  --ls-title:   0em; /* @kind other */
}


/* === tokens/spacing.css === */
/* Anissa Kaori — Spacing
 * A calm, editorial rhythm. Base unit 4px; generous whitespace lets the
 * photography breathe. "Respiro mínimo" (minimum breathing room) around the
 * monogram equals the width of the K — captured here as --space-monogram-clear.
 */
:root {
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* Semantic */
  --gutter:          var(--space-5);  /* grid gutter */
  --section-pad-y:   var(--space-9);  /* vertical section padding */
  --section-pad-x:   var(--space-7);
  --card-pad:        var(--space-6);
  --stack:           var(--space-4);  /* default vertical stack gap */

  /* Clear space around the AK monogram = width of the K */
  --space-monogram-clear: 1em;

  /* Layout */
  --measure:      68ch;   /* comfortable reading width */
  --content-max:  1200px; /* content column */
  --wide-max:     1440px; /* full-bleed inner max */
}


/* === tokens/effects.css === */
/* Anissa Kaori — Effects: radii, borders, shadows, motion
 * The brand is editorial and photographic: sharp/minimal corners, hairline
 * rules, soft low shadows. No glossy or heavy elevation.
 */
:root {
  /* ---- Radii ---- (mostly square; slight softening at most) */
  --radius-0:   0px;      /* photo frames, editorial blocks — squared */
  --radius-sm:  2px;      /* buttons, inputs — barely rounded */
  --radius-md:  4px;
  --radius-pill: 999px;   /* avatar, circular monogram, pills */

  /* ---- Borders ---- */
  --bw-hair:   1px;
  --bw-strong: 1.5px;

  /* ---- Shadows ---- (soft, warm, low — ink-tinted, never black) */
  --shadow-sm: 0 1px 2px rgba(23,19,15,0.06);
  --shadow-md: 0 8px 24px rgba(23,19,15,0.08);
  --shadow-lg: 0 24px 60px rgba(23,19,15,0.12);
  --shadow-frame: 0 30px 70px rgba(23,19,15,0.18); /* lifted photo/print */

  /* ---- Motion ---- (unhurried, cinematic; fades & gentle rises, no bounce) */
  --ease-out:   cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-inout: cubic-bezier(0.65, 0.05, 0.36, 1); /* @kind other */
  --dur-fast:   160ms; /* @kind other */
  --dur-base:   300ms; /* @kind other */
  --dur-slow:   600ms;  /* @kind other */

  /* ---- Focus ---- */
  --focus-ring: 0 0 0 2px var(--surface-page), 0 0 0 4px var(--accent);
}

