/* =============================================================
   TESS CAPITAL — Design tokens
   Pre-manual editorial system. Cormorant Garamond + Inter,
   deep institutional green, no gradients, no startup tropes.
   ============================================================= */

/* Subsets explicitly include latin-ext to guarantee full coverage of
   Portuguese diacritics: ã õ â ê ô ç á é í ó ú à. */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Inter:wght@400;500;600;700&display=swap&subset=latin,latin-ext');

:root {
  /* ---------- Brand / Greens ---------- */
  --tess-primary:           #183528;   /* verde profundo — brand */
  --tess-primary-dark:      #0F2A20;   /* footer / dense bands */
  --tess-primary-soft:      #234536;   /* secondary surface */
  --tess-malachite-dark:    #0B5D45;   /* accent / CTA / link */
  --tess-malachite-deep:    #064533;   /* hover / active */
  --tess-malachite-muted:   #2F7A5F;   /* chart / small detail */
  --tess-gold-muted:        #B79B5B;   /* sparing premium accent */

  /* ---------- Surface / Canvas ---------- */
  --tess-canvas:            #F5F1E8;   /* primary ivory */
  --tess-canvas-warm:       #EFE8DC;   /* alternating section */
  --tess-surface-soft:      #EAE5DA;   /* quiet block */
  --tess-surface-card:      #FFFFFF;   /* card / panel */
  --tess-surface-muted:     #D8D4CB;   /* pedra / neutral block */
  --tess-sage:              #A8B3A3;   /* chart / soft tag */

  /* ---------- Text ---------- */
  --tess-ink:               #183528;   /* primary text */
  --tess-body:              #34483D;   /* body */
  --tess-body-soft:         #52665B;   /* subtitle */
  --tess-muted:             #7A827A;   /* meta / caption */
  --tess-muted-soft:        #A2A79F;   /* disclaimer */
  --tess-logo-gray:         #717272;   /* descriptor under wordmark */

  /* ---------- Lines ---------- */
  --tess-hairline:          #C9C5BA;   /* quiet rule */
  --tess-hairline-strong:   #8D968C;   /* structural divider */
  --tess-hairline-green:    #183528;   /* lockup / institutional */

  /* ---------- Reverse / on-dark ---------- */
  --tess-on-primary:        #F5F1E8;
  --tess-on-malachite:      #F5F1E8;
  --tess-on-light:          #183528;

  /* ---------- Semantic ---------- */
  --tess-link:              #0B5D45;
  --tess-success:           #0B5D45;
  --tess-warning:           #B79B5B;

  /* Legacy aliases (turquoise → malachite mapping for any leftover refs) */
  --tess-turquoise:         #0B5D45;
  --tess-turquoise-deep:    #064533;
  --tess-turquoise-muted:   #2F7A5F;
  --tess-on-turquoise:      #F5F1E8;

  /* ---------- Spacing — 4px base ---------- */
  --tess-space-xxs:         4px;
  --tess-space-xs:          8px;
  --tess-space-sm:          12px;
  --tess-space-md:          16px;
  --tess-space-lg:          24px;
  --tess-space-xl:          40px;
  --tess-space-xxl:         64px;
  --tess-space-section:     112px;

  /* ---------- Radii ---------- */
  --tess-radius-none:       0px;
  --tess-radius-subtle:     2px;
  --tess-radius-soft:       6px;
  --tess-radius-pill:       9999px;
  --tess-radius-full:       9999px;

  /* ---------- Elevation — minimal ---------- */
  --tess-shadow-none:       none;
  --tess-shadow-soft:       0 1px 2px rgba(15, 42, 32, 0.06),
                            0 12px 24px rgba(15, 42, 32, 0.06);

  /* ---------- Type families ---------- */
  --tess-font-display:      'Cormorant Garamond', 'Libre Baskerville', 'EB Garamond', Georgia, serif;
  --tess-font-ui:           'Inter', 'Neue Haas Grotesk', 'Helvetica Neue', Arial, sans-serif;

  /* ---------- Type scale ---------- */
  --tess-display-xl-size:   64px;
  --tess-display-xl-lh:     1.05;
  --tess-display-xl-ls:     1.5px;
  --tess-display-xl-weight: 400;

  --tess-display-lg-size:   48px;
  --tess-display-lg-lh:     1.12;
  --tess-display-lg-ls:     1.2px;
  --tess-display-lg-weight: 400;

  --tess-display-md-size:   36px;
  --tess-display-md-lh:     1.18;
  --tess-display-md-ls:     0.8px;
  --tess-display-md-weight: 400;

  --tess-display-sm-size:   26px;
  --tess-display-sm-lh:     1.25;
  --tess-display-sm-ls:     0.5px;
  --tess-display-sm-weight: 500;

  --tess-wordmark-size:     24px;
  --tess-wordmark-ls:       2.5px;
  --tess-wordmark-weight:   500;

  --tess-title-md-size:     22px;
  --tess-title-md-weight:   400;
  --tess-title-sm-size:     16px;
  --tess-title-sm-weight:   500;

  --tess-body-md-size:      16px;
  --tess-body-sm-size:      14px;

  --tess-caption-size:      11px;
  --tess-caption-ls:        2px;

  --tess-button-size:       12px;
  --tess-button-ls:         1.8px;

  --tess-nav-size:          11px;
  --tess-nav-ls:            1.6px;

  /* ---------- Layout ---------- */
  --tess-container:         1200px;
  --tess-container-wide:    1280px;
  --tess-gutter:            32px;
  --tess-nav-height:        72px;

  /* ---------- Motion ---------- */
  --tess-ease:              cubic-bezier(0.2, 0.6, 0.2, 1);
  --tess-duration-fast:     180ms;
  --tess-duration:          240ms;
  --tess-duration-slow:     560ms;
}

/* =============================================================
   Semantic resets
   ============================================================= */

html, body {
  background: var(--tess-canvas);
  color: var(--tess-ink);
  font-family: var(--tess-font-ui);
  font-size: var(--tess-body-md-size);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ---------- Display / heading semantics ---------- */
.tess-display-xl, .tess-display-lg, .tess-display-md, .tess-display-sm,
.tess-title-md, .tess-wordmark,
h1, h2, h3, h4 {
  font-family: var(--tess-font-display);
  font-weight: 400;
  color: var(--tess-ink);
  margin: 0;
  text-wrap: balance;
}

h1, .tess-display-xl {
  font-size: var(--tess-display-xl-size);
  line-height: var(--tess-display-xl-lh);
  letter-spacing: var(--tess-display-xl-ls);
  font-weight: var(--tess-display-xl-weight);
}
h2, .tess-display-lg {
  font-size: var(--tess-display-lg-size);
  line-height: var(--tess-display-lg-lh);
  letter-spacing: var(--tess-display-lg-ls);
  font-weight: var(--tess-display-lg-weight);
}
h3, .tess-display-md {
  font-size: var(--tess-display-md-size);
  line-height: var(--tess-display-md-lh);
  letter-spacing: var(--tess-display-md-ls);
  font-weight: var(--tess-display-md-weight);
}
h4, .tess-display-sm {
  font-size: var(--tess-display-sm-size);
  line-height: var(--tess-display-sm-lh);
  letter-spacing: var(--tess-display-sm-ls);
  font-weight: var(--tess-display-sm-weight);
}
.tess-title-md {
  font-size: var(--tess-title-md-size);
  line-height: 1.3;
  letter-spacing: 0.4px;
}
.tess-wordmark {
  font-family: var(--tess-font-display);
  font-size: var(--tess-wordmark-size);
  letter-spacing: var(--tess-wordmark-ls);
  font-weight: var(--tess-wordmark-weight);
  font-variant-caps: small-caps;
  line-height: 1;
  text-transform: uppercase;
}

/* ---------- UI semantics ---------- */
.tess-title-sm {
  font-family: var(--tess-font-ui);
  font-size: var(--tess-title-sm-size);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.2px;
  color: var(--tess-ink);
}
p, .tess-body-md {
  font-family: var(--tess-font-ui);
  font-size: var(--tess-body-md-size);
  line-height: 1.6;
  color: var(--tess-body);
  margin: 0;
  text-wrap: pretty;
}
.tess-body-sm {
  font-family: var(--tess-font-ui);
  font-size: var(--tess-body-sm-size);
  line-height: 1.55;
  color: var(--tess-body);
}
.tess-caption {
  font-family: var(--tess-font-ui);
  font-size: var(--tess-caption-size);
  font-weight: 500;
  letter-spacing: var(--tess-caption-ls);
  line-height: 1.4;
  text-transform: uppercase;
  color: var(--tess-muted);
}
.tess-eyebrow {
  font-family: var(--tess-font-ui);
  font-size: var(--tess-caption-size);
  font-weight: 500;
  letter-spacing: var(--tess-caption-ls);
  line-height: 1.4;
  text-transform: uppercase;
  color: var(--tess-malachite-dark);
}
.tess-nav-link {
  font-family: var(--tess-font-ui);
  font-size: var(--tess-nav-size);
  font-weight: 500;
  letter-spacing: var(--tess-nav-ls);
  line-height: 1.4;
  text-transform: uppercase;
  color: var(--tess-primary);
  text-decoration: none;
}
.tess-button-label {
  font-family: var(--tess-font-ui);
  font-size: var(--tess-button-size);
  font-weight: 600;
  letter-spacing: var(--tess-button-ls);
  line-height: 1;
  text-transform: uppercase;
}

/* ---------- Hairlines ---------- */
.tess-rule        { border: 0; border-top: 1px solid var(--tess-hairline); margin: 0; }
.tess-rule-strong { border: 0; border-top: 1px solid var(--tess-hairline-strong); margin: 0; }
.tess-rule-green  { border: 0; border-top: 1px solid var(--tess-hairline-green); margin: 0; }

/* ---------- Focus ---------- */
:focus-visible {
  outline: 2px solid var(--tess-malachite-muted);
  outline-offset: 2px;
}