/* ============================================================
SI DESIGN SYSTEM — core/typography.css
Typography scale classes (.t-hero, .t-h2, .t-body, etc)
============================================================ */
/* Google Fonts — copiar no do HTML/Next layout */
/*
*/
/* ===== TYPOGRAPHY SCALE ===== */
/* Display (hero h1) */
.t-hero {
font-family: var(--font-title);
font-weight: 900;
font-size: clamp(2.4rem, 5.5vw, 4.4rem);
line-height: 1.05;
letter-spacing: -0.025em;
font-variation-settings: "opsz" 144;
}
/* H2 */
.t-h2 {
font-family: var(--font-title);
font-weight: 800;
font-size: clamp(1.6rem, 3.6vw, 2.4rem);
line-height: 1.05;
letter-spacing: -0.025em;
}
/* H3 */
.t-h3 {
font-family: var(--font-title);
font-weight: 700;
font-size: clamp(1.1rem, 2vw, 1.25rem);
line-height: 1.2;
letter-spacing: -0.015em;
}
/* Body */
.t-body {
font-family: var(--font-body);
font-weight: 400;
font-size: 1rem;
line-height: 1.65;
}
/* Lede (intro paragraph) */
.t-lede {
font-family: var(--font-body);
font-weight: 300;
font-size: clamp(1.05rem, 1.5vw, 1.2rem);
line-height: 1.55;
}
/* Eyebrow (labels above titles) */
.t-eyebrow {
font-family: var(--font-mono);
font-size: 0.72rem;
font-weight: 500;
letter-spacing: 0.2em;
text-transform: uppercase;
}
/* Caption / small */
.t-caption {
font-family: var(--font-mono);
font-size: 0.7rem;
letter-spacing: 0.16em;
text-transform: uppercase;
}
/* Italic gold accent (em tag) */
.t-accent {
font-style: italic;
font-weight: 500;
background: linear-gradient(135deg, var(--gold-bright), var(--gold) 50%, var(--gold-deep));
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
/* italic-clip fix obrigatório */
display: inline-block;
padding: 0 0.14em 0.18em 0.06em;
}
/* Quote handwritten (Hora do Mate) */
.t-quote-hand {
font-family: var(--font-hand);
font-weight: 600;
font-size: 1.4rem;
line-height: 1.4;
letter-spacing: 0.005em;
}
/* Tribal caps (Hora do Mate section titles) */
.t-tribe {
font-family: var(--font-tribe);
font-weight: 700;
letter-spacing: 0.02em;
text-transform: uppercase;
}