/* ============================================================
   SANSIL BROKER — Design System
   Sovereign Geometry · Proteção. Precisão. Confiança.
   ------------------------------------------------------------
   Global entry point. Consumers link THIS file only.
   It is a manifest of @imports — no rules live here.
   ============================================================ */

/* ============================================================
   SANSIL BROKER — Fonts
   All four families ship from Google Fonts. They are the exact
   families used across the production brand (carousels, stories,
   cards, the identity sheet). No substitutions.
   ------------------------------------------------------------
   Gloock      — display serif (wordmark, headlines)
   Work Sans   — sans-serif (body, UI, buttons)
   DM Mono     — monospace (eyebrow labels, codes, captions)
   Crimson Pro — serif italic (editorial pull-quotes)
   ============================================================ */

/* vietnamese */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic-d117.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic-e777.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic-d117.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic-e777.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic-d117.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Pro';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/CrimsonPro-400-italic-e777.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/DMMono-400-italic.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/DMMono-400-italic-5dbb.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/DMMono-400.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/DMMono-400-c8d5.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/DMMono-500.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/DMMono-500-86da.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Gloock';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/Gloock-400.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* latin-ext */
@font-face {
  font-family: 'Gloock';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/Gloock-400-14ed.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Gloock';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/Gloock-400-9d99.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Work Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-400-italic.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Work Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-400-italic-45bb.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-400-italic-566f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-7fc1.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-2989.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-7fc1.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-2989.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-7fc1.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-2989.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-7fc1.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-2989.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-7fc1.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../assets/fonts/WorkSans-300-2989.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ============================================================
   SANSIL BROKER — Color tokens
   "A Dualidade de Ouro e Noite" — depth of midnight navy and
   the warmth of hammered gold. Navy + white/cream is the
   absolute base; gold is an accent applied with parsimony,
   never as a dominant fill (a hairline, a label, a small mark).
   Source of truth: the Identidade Visual sheet + production
   social/print artifacts.
   ============================================================ */

:root {
  /* ---- Base palette (the five named brand colors) ---- */
  --marinha:        #122044;  /* Navy — primary, weight, grounds the eye        */
  --ouro:           #B99650;  /* Gold — accent, hairlines, small marks, titles  */
  --champanhe:      #D7B978;  /* Champagne — secondary detail, lighter gold      */
  --creme:          #EEE8DA;  /* Cream — warm light surface, "respiro"           */
  --ardosia:        #5F6C87;  /* Slate — support text, captions on light         */

  /* ---- Navy ramp ---- */
  --marinha-ink:    #0C1C44;  /* Production wordmark navy (a hair deeper)        */
  --marinha-900:    #0B1734;  /* Deepest — footers, "#1C0C07"-equivalent shade  */
  --marinha-700:    #122044;
  --marinha-500:    #25386A;  /* Lifted navy — hover on navy surfaces           */
  --navy-light:     #3C548C;  /* Secondary text on light, links                 */

  /* ---- Gold ramp ---- */
  --ouro-deep:      #9A7A3E;  /* Pressed / darker gold                          */
  --ouro-600:       #B99650;
  --ouro-400:       #D7B978;  /* = champanhe                                     */
  --ouro-200:       #E8D7AE;  /* Faint gold wash                                */

  /* ---- Neutrals / surfaces ---- */
  --branco:         #FFFFFF;
  --creme-pale:     #FAF8F4;  /* Lightest cream (carousel light slides)         */
  --creme-200:      #EEE8DA;
  --creme-300:      #E4DCC9;  /* Cream border / hairline on cream               */
  --prata:          #949AA8;  /* Silver — muted subtitles, placeholder          */

  /* ---- Semantic: surfaces ---- */
  --surface-page:        var(--branco);
  --surface-cream:       var(--creme-pale);
  --surface-card:        var(--branco);
  --surface-navy:        var(--marinha);
  --surface-navy-deep:   var(--marinha-900);

  /* ---- Semantic: text on light ---- */
  --text-strong:    var(--marinha);    /* headlines, primary text               */
  --text-body:      #2B3550;           /* long-form body on light               */
  --text-muted:     var(--ardosia);    /* secondary / captions                  */
  --text-faint:     var(--prata);      /* tertiary / placeholders               */
  --text-link:      var(--navy-light);

  /* ---- Text on navy ---- */
  --on-navy-strong: var(--branco);
  --on-navy-body:   rgba(255,255,255,0.74);
  --on-navy-muted:  rgba(255,255,255,0.52);
  --on-navy-faint:  rgba(255,255,255,0.34);

  /* ---- Accent / lines ---- */
  --accent-gold:    var(--ouro);
  --hairline:       rgba(18,32,68,0.12);   /* divider on light                   */
  --hairline-gold:  rgba(185,150,80,0.55); /* the signature thin gold rule       */
  --hairline-onnavy:rgba(255,255,255,0.12);
  --gold-wash:      rgba(185,150,80,0.10);  /* faint gold fill for chips/feats    */
  --navy-wash:      rgba(18,32,68,0.05);

  /* ---- Focus ---- */
  --focus-ring:     rgba(185,150,80,0.40);

  /* ---- Status (used sparingly; saúde/insurance UI) ---- */
  --positive:       #2F7A5B;
  --positive-soft:  #E3F0EA;
  --warning:        #B98A2E;
  --danger:         #A23A38;
}

/* ============================================================
   SANSIL BROKER — Typography tokens
   "Typography as Architecture." Gloock builds the monuments
   (display, headlines). Work Sans carries the load of body and
   interface. DM Mono whispers in tracked capitals (eyebrows,
   codes). Crimson Pro italic is reserved for editorial quotes.
   Two families per piece, maximum. The wordmark "sansil" is
   ALWAYS Gloock Regular — never bold.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-display: 'Gloock', 'Times New Roman', Georgia, serif;
  --font-sans:    'Work Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'DM Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --font-quote:   'Crimson Pro', Georgia, serif;

  /* ---- Weights ---- */
  --fw-light:     300; /* @kind font */
  --fw-regular:   400; /* @kind font */
  --fw-medium:    500; /* @kind font */
  --fw-semibold:  600; /* @kind font */
  --fw-bold:      700; /* @kind font */

  /* ---- Display scale (Gloock — set tight, never bold) ----
     Built on a ~1.22 ratio. Display is always Regular weight;
     its presence comes from size and air, not weight.          */
  --fs-display:   clamp(3.25rem, 6vw, 5.5rem);   /* @kind font */
  --fs-h1:        clamp(2.5rem, 4.6vw, 4rem); /* @kind font */
  --fs-h2:        clamp(2rem, 3.4vw, 2.9rem); /* @kind font */
  --fs-h3:        clamp(1.5rem, 2.2vw, 2rem); /* @kind font */
  --fs-h4:        1.3rem; /* @kind font */

  /* ---- Body scale (Work Sans) ---- */
  --fs-lead:      1.18rem;   /* @kind font */
  --fs-body:      1rem;      /* @kind font */
  --fs-body-sm:   0.9rem; /* @kind font */
  --fs-caption:   0.8rem; /* @kind font */

  /* ---- Eyebrow / label (DM Mono, uppercase, tracked) ---- */
  --fs-eyebrow:   0.72rem; /* @kind font */
  --fs-eyebrow-sm:0.64rem; /* @kind font */

  /* ---- Line heights ---- */
  --lh-display:   1.06; /* @kind font */
  --lh-heading:   1.16; /* @kind font */
  --lh-snug:      1.35; /* @kind font */
  --lh-body:      1.7; /* @kind font */
  --lh-relaxed:   1.85; /* @kind font */

  /* ---- Letter-spacing ---- */
  --ls-display:  -0.015em;   /* @kind font */
  --ls-heading:  -0.01em; /* @kind font */
  --ls-body:      0; /* @kind font */
  --ls-eyebrow:   0.22em;    /* @kind font */
  --ls-eyebrow-wide: 0.32em; /* @kind font */
  --ls-wordmark-sub: 0.18em; /* @kind font */
}

/* ---- Optional helper classes (tokens are the contract; these
   are conveniences for specimen cards and quick markup) ---- */
.t-display { font-family: var(--font-display); font-weight: var(--fw-regular);
  font-size: var(--fs-display); line-height: var(--lh-display);
  letter-spacing: var(--ls-display); color: var(--text-strong); }
.t-h1 { font-family: var(--font-display); font-weight: var(--fw-regular);
  font-size: var(--fs-h1); line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading); color: var(--text-strong); }
.t-h2 { font-family: var(--font-display); font-weight: var(--fw-regular);
  font-size: var(--fs-h2); line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading); color: var(--text-strong); }
.t-h3 { font-family: var(--font-display); font-weight: var(--fw-regular);
  font-size: var(--fs-h3); line-height: var(--lh-snug); color: var(--text-strong); }
.t-lead { font-family: var(--font-sans); font-weight: var(--fw-light);
  font-size: var(--fs-lead); line-height: var(--lh-relaxed); color: var(--text-muted); }
.t-body { font-family: var(--font-sans); font-weight: var(--fw-regular);
  font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text-body); }
.t-eyebrow { font-family: var(--font-mono); font-weight: var(--fw-medium);
  font-size: var(--fs-eyebrow); letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase; color: var(--accent-gold); }
.t-quote { font-family: var(--font-quote); font-style: italic;
  font-weight: var(--fw-medium); font-size: 1.5rem; line-height: var(--lh-snug);
  color: var(--text-strong); }

/* ============================================================
   SANSIL BROKER — Spacing, radius, shadow, layout
   "Espaço negativo é design." The system breathes: generous,
   intentional air. Corners are barely-there (the brand is
   architectural, not bubbly). Shadows are soft and sparse —
   the kit forbids heavy shadows; elevation is a whisper.
   ============================================================ */

:root {
  /* ---- Spacing scale (4px base) ---- */
  --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;

  /* ---- Section rhythm ---- */
  --section-y:      clamp(64px, 9vw, 128px);  /* @kind spacing */
  --container-max:  1180px;
  --container-pad:  5vw;
  --measure:        62ch;     /* @kind spacing */

  /* ---- Radius (restrained; never bubbly) ---- */
  --radius-xs:  2px;
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  14px;   /* cards on light                                    */
  --radius-xl:  22px;   /* large feature cards / photo crops                 */
  --radius-pill: 999px;

  /* ---- Border widths ---- */
  --bar:        3px;    /* @kind spacing */
  --bar-thick:  12px;   /* @kind spacing */
  --hairline-w: 1px;    /* @kind spacing */

  /* ---- Shadows (soft, navy-tinted, used sparingly) ---- */
  --shadow-xs:  0 1px 2px rgba(18,32,68,0.06);
  --shadow-sm:  0 4px 18px rgba(18,32,68,0.08);
  --shadow-md:  0 12px 36px rgba(18,32,68,0.12);
  --shadow-lg:  0 24px 60px rgba(18,32,68,0.16);
  --shadow-gold: 0 6px 22px rgba(185,150,80,0.28); /* only under a gold CTA  */

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-in-out:cubic-bezier(0.45, 0, 0.25, 1); /* @kind other */
  --dur-fast:   140ms; /* @kind other */
  --dur:        220ms; /* @kind other */
  --dur-slow:   420ms; /* @kind other */

  /* ---- Z ---- */
  --z-nav: 100; /* @kind other */
  --z-float: 200; /* @kind other */
  --z-modal: 1000; /* @kind other */
}

/* ---- The signature pattern: a faint diamond grid in gold,
   for navy surfaces. Apply via background-image. ---- */
:root {
  --pattern-diamond:
    repeating-linear-gradient(45deg,  rgba(185,150,80,0.06) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(-45deg, rgba(185,150,80,0.06) 0 1px, transparent 1px 22px) /* @kind other */;
  --pattern-diagonal:
    repeating-linear-gradient(-45deg, rgba(185,150,80,0.05) 0 1px, transparent 1px 14px) /* @kind other */;
}

/* ============================================================
   SANSIL BROKER — Base resets & primitives
   Minimal, opinionated reset + a handful of brand primitives
   used across specimen cards and kits. Tokens remain the
   contract; these are conveniences, kept small on purpose.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-sans);
  font-weight: var(--fw-regular);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg, video { display: block; max-width: 100%; }

a { color: var(--text-link); text-decoration: none; }

::selection { background: var(--ouro); color: var(--marinha); }

:focus-visible { outline: 2px solid var(--accent-gold); outline-offset: 2px; }

/* ---- Layout helpers ---- */
.sb-container { max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-pad); }
.sb-section  { padding-block: var(--section-y); }

/* ---- The signature gold hairline rule ---- */
.sb-rule { width: 48px; height: 1px; background: var(--accent-gold); border: 0; }
.sb-rule--full { width: 100%; }

/* ---- Brand backgrounds ---- */
.sb-bg-navy   { background: var(--surface-navy); color: var(--on-navy-strong); }
.sb-bg-cream  { background: var(--surface-cream); color: var(--text-body); }
.sb-pattern-diamond  { background-image: var(--pattern-diamond);  background-color: var(--marinha); }
.sb-pattern-diagonal { background-image: var(--pattern-diagonal); }

/* ---- Eyebrow label (DM Mono, tracked caps) ---- */
.sb-eyebrow {
  font-family: var(--font-mono);
  font-weight: var(--fw-medium);
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--accent-gold);
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}




  body { background: #fff; }
  .navlink:hover { color: #fff !important; }
  a { color: inherit; }