/* ================================================================
   STRIDE FOOTBALL — Typography (2026-05-14)
   Scara unica pentru toata aplicatia. NU avem text sub 13px nicaieri.
   Body default 17px desktop / 16px mobile.
   ================================================================ */

/* ---------- CONTAINER WIDTHS ---------- */
.page-container,
.page-narrow,
.page-default,
.page-wide {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 24px;
    padding-right: 24px;
}
.page-narrow  { max-width: 720px; }
.page-default { max-width: 1100px; }
.page-wide    { max-width: 1280px; }
.page-container { max-width: 1100px; } /* alias pentru .page-default */

@media (min-width: 768px) {
    .page-container,
    .page-narrow,
    .page-default,
    .page-wide {
        padding-left: 32px;
        padding-right: 32px;
    }
}

/* ---------- SCARA TIPOGRAFICA — DESKTOP ---------- */
.t-display   { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 64px; font-weight: 300; line-height: 1.05; letter-spacing: -0.025em; color: #f8f3d9; }
.t-h1        { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 42px; font-weight: 500; line-height: 1.15; letter-spacing: -0.02em;  color: #f8f3d9; }
.t-h2        { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 28px; font-weight: 500; line-height: 1.25; letter-spacing: -0.015em; color: #f8f3d9; }
.t-h3        { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 20px; font-weight: 500; line-height: 1.35; letter-spacing: -0.01em;  color: #f8f3d9; }
.t-eyebrow   { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 14px; font-weight: 500; line-height: 1.2;  letter-spacing: 0.2em;   text-transform: uppercase; color: rgba(248,243,217,0.55); }
.t-lead      { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 20px; font-weight: 300; line-height: 1.55; color: rgba(248,243,217,0.70); }
.t-body      { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 17px; font-weight: 400; line-height: 1.65; color: rgba(248,243,217,0.78); }
.t-body-sm   { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.55; color: rgba(248,243,217,0.72); }
.t-meta      { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 15px; font-weight: 400; line-height: 1.5;  color: rgba(248,243,217,0.60); }
.t-fine      { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 14px; font-weight: 400; line-height: 1.4;  color: rgba(248,243,217,0.50); }

/* ---------- SCARA TIPOGRAFICA — MOBILE (<768px) ---------- */
@media (max-width: 767px) {
    .t-display   { font-size: 44px; line-height: 1.1; }
    .t-h1        { font-size: 32px; line-height: 1.2; }
    .t-h2        { font-size: 24px; line-height: 1.3; }
    .t-h3        { font-size: 18px; line-height: 1.4; }
    .t-eyebrow   { font-size: 13px; letter-spacing: 0.18em; }
    .t-lead      { font-size: 18px; line-height: 1.55; }
    .t-body      { font-size: 16px; line-height: 1.6; }
    .t-body-sm   { font-size: 15px; }
    .t-meta      { font-size: 14px; }
    .t-fine      { font-size: 13px; }
}

/* ---------- ALINIAMENTE / VARIANT-URI ---------- */
.t-cream     { color: #f8f3d9 !important; }
.t-cream-90  { color: rgba(248,243,217,0.90) !important; }
.t-cream-75  { color: rgba(248,243,217,0.75) !important; }
.t-cream-60  { color: rgba(248,243,217,0.60) !important; }
.t-cream-45  { color: rgba(248,243,217,0.45) !important; }
.t-red       { color: #D62828 !important; }

.t-serif     { font-family: 'Instrument Serif', 'Times New Roman', serif !important; font-style: italic; font-weight: 300; letter-spacing: 0; }

.t-w-300     { font-weight: 300 !important; }
.t-w-400     { font-weight: 400 !important; }
.t-w-500     { font-weight: 500 !important; }
.t-w-600     { font-weight: 600 !important; }
.t-w-700     { font-weight: 700 !important; }