/*
 * TecCorp unified design tokens.
 * This is the single authoritative source for typography values. Components
 * consume these roles; they do not define independent type scales.
 */
@font-face {
    font-display: swap;
    font-family: "Velour";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Velour-Regular.woff2") format("woff2"),
         url("../fonts/Velour-Regular.woff") format("woff");
}

@font-face {
    font-display: swap;
    font-family: "Avenir";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Avenir.woff") format("woff");
}

@font-face {
    font-display: swap;
    font-family: "Avenir Next";
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/Avenir-Next.woff") format("woff");
}

@font-face {
    font-display: swap;
    font-family: "Avenir Next Condensed";
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/Avenir-Next-Condensed.woff") format("woff");
}

:root {
    --tc-font-body: "Avenir", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --tc-font-heading: "Velour", Georgia, "Times New Roman", serif;
    --tc-font-ui-strong: "Avenir Next", "Avenir", system-ui, sans-serif;
    --tc-font-sans: var(--tc-font-body);
    --tc-font-display: var(--tc-font-heading);

    --tc-type-body: 1.0625rem;
    --tc-type-lead: 1.1875rem;
    --tc-type-h1: 2.25rem;
    --tc-type-h1-compact: 2.25rem;
    --tc-type-h2: 1.75rem;
    --tc-type-h3: 1.375rem;
    --tc-type-h4: 1.25rem;
    --tc-type-h5: 1.125rem;
    --tc-type-h6: 1.0625rem;
    --tc-type-card-title: 1.125rem;
    --tc-type-button: 0.9375rem;
    --tc-type-input: 1rem;
    --tc-type-label: 0.875rem;
    --tc-type-meta: 0.875rem;
    --tc-type-nav: 0.875rem;
    --tc-type-nav-compact: 0.6875rem;
    --tc-type-mobile-nav: 0.75rem;
    --tc-type-eyebrow: 0.75rem;
    --tc-type-micro: 0.6875rem;
    --tc-type-legal: 0.6875rem;
    --tc-type-display-mark: 4.0625rem;
    --tc-type-display-hero: clamp(2.1875rem, 3.2vw, 3.375rem);
    --tc-type-display-section: clamp(1.75rem, 2.6vw, 2.4375rem);

    --tc-weight-body: 400;
    --tc-weight-medium: 400;
    --tc-weight-strong: 700;
    --tc-leading-body: 1.65;
    --tc-leading-heading: 1.18;
    --tc-leading-h1: 1.12;
    --tc-leading-h2: 1.2;
    --tc-leading-h3: 1.28;
    --tc-leading-control: 1.35;
    --tc-tracking-heading: -0.018em;
    --tc-tracking-ui: 0.045em;
    --tc-tracking-meta: 0.055em;

    --tc-color-ink: #111111;
    --tc-color-charcoal: #1b1b19;
    --tc-color-paper: #ffffff;
    --tc-color-surface: #f5f2ec;
    --tc-color-surface-strong: #ebe5da;
    --tc-color-muted: #6e6a63;
    --tc-color-line: rgba(17, 17, 17, 0.14);
    --tc-color-line-strong: rgba(17, 17, 17, 0.28);
    --tc-color-accent: #b89b5e;
    --tc-color-accent-dark: #8e7139;
    --tc-focus-ring: 2px solid var(--tc-color-accent);

    --tc-space-1: 0.5rem;
    --tc-space-2: 1rem;
    --tc-space-3: 1.5rem;
    --tc-space-4: 2rem;
    --tc-space-5: 3rem;
    --tc-space-6: 4.5rem;
    --tc-gutter: clamp(1rem, 3vw, 2rem);
    --tc-container-wide: 90rem;
    --tc-container: 75rem;
    --tc-container-content: 64rem;
    --tc-container-narrow: 52rem;
    --tc-control-height: 2.75rem;
    --tc-control-height-large: 3rem;
    --tc-radius-sm: 0.25rem;
    --tc-radius: 0.5rem;
    --tc-radius-lg: 1rem;
    --tc-shadow-soft: 0 18px 50px rgba(22, 19, 14, 0.09);
    --tc-shadow-header: 0 8px 30px rgba(20, 18, 14, 0.08);
    --tc-header-height: 4.75rem;

    --tc-ratio-product: 1 / 1;
    --tc-ratio-card: 4 / 3;
    --tc-ratio-landscape: 16 / 10;
    --tc-ratio-article-hero: 2 / 1;

    --tc-motion-fast: 180ms;
    --tc-motion-base: 320ms;
}

body {
    font-family: var(--tc-font-body);
    font-size: var(--tc-type-body);
    font-weight: var(--tc-weight-body);
    line-height: var(--tc-leading-body);
}

body :where(h1, h2, h3, h4, h5, h6) {
    font-family: var(--tc-font-heading);
    font-weight: 400;
    letter-spacing: var(--tc-tracking-heading);
    text-align: start;
    word-spacing: normal;
}

/* Bootstrap's fw-bold utility is !important; headings intentionally retain the
   approved Velour regular face through the central type contract. */
body main :where(h1, h2, h3, h4, h5, h6) {
    font-weight: 400;
}

body main :where(h1, h2, h3, h4, h5, h6):is(.fw-bold, .fw-500) {
    font-weight: 400 !important;
}

body h1 { font-size: var(--tc-type-h1); line-height: var(--tc-leading-h1); }
body h2 { font-size: var(--tc-type-h2); line-height: var(--tc-leading-h2); }
body h3 { font-size: var(--tc-type-h3); line-height: var(--tc-leading-h3); }
body h4 { font-size: var(--tc-type-h4); line-height: var(--tc-leading-h3); }
body h5 { font-size: var(--tc-type-h5); line-height: var(--tc-leading-h3); }
body h6 { font-size: var(--tc-type-h6); line-height: var(--tc-leading-h3); }

body :where(p, li, dd, dt, blockquote, figcaption, td, th) {
    font-family: var(--tc-font-body);
}

body :where(button, .button, .btn, input[type="button"], input[type="submit"], input[type="reset"]) {
    font-family: var(--tc-font-ui-strong);
    font-size: var(--tc-type-button);
    font-weight: var(--tc-weight-strong);
    line-height: var(--tc-leading-control);
}

body :where(input, select, textarea) {
    font-family: var(--tc-font-body);
    font-size: var(--tc-type-input);
    line-height: var(--tc-leading-control);
}

body :where(label, .ff-el-input--label) {
    font-family: var(--tc-font-body);
    font-size: var(--tc-type-label);
    line-height: var(--tc-leading-control);
}

body :where(.breadcrumbs, .woocommerce-breadcrumb, .tc-meta, time, figcaption) {
    font-size: var(--tc-type-meta);
    line-height: var(--tc-leading-control);
}

:where(.typo, .entry-content, .page-description, .term-description, .woocommerce-product-details__short-description, .woocommerce-Tabs-panel, .accordion-body, .ff-message-success) {
    font-family: var(--tc-font-body);
    font-size: var(--tc-type-body);
    line-height: var(--tc-leading-body);
    word-spacing: normal;
}

:where(.typo, .entry-content, .page-description, .term-description, .woocommerce-product-details__short-description, .woocommerce-Tabs-panel, .accordion-body) :where(p, li, td, th) {
    font-size: inherit;
    line-height: inherit;
    word-spacing: normal;
}

@media (max-width: 1024px) {
    :root {
        --tc-type-body: 1rem;
        --tc-type-lead: 1.125rem;
        --tc-type-h1: 2rem;
        --tc-type-h1-compact: 2rem;
        --tc-type-h2: 1.625rem;
        --tc-type-h3: 1.3125rem;
        --tc-type-h4: 1.1875rem;
        --tc-type-h5: 1.125rem;
        --tc-type-h6: 1rem;
        --tc-type-card-title: 1.0625rem;
        --tc-type-meta: 0.8125rem;
        --tc-type-eyebrow: 0.6875rem;
        --tc-type-micro: 0.625rem;
        --tc-type-legal: 0.625rem;
    }
}

@media (max-width: 767.98px) {
    :root {
        --tc-type-h1: 1.75rem;
        --tc-type-h1-compact: 1.75rem;
        --tc-type-h2: 1.5rem;
        --tc-type-h3: 1.25rem;
        --tc-type-h4: 1.125rem;
        --tc-type-h5: 1.0625rem;
        --tc-type-h6: 1rem;
        --tc-type-card-title: 1rem;
        --tc-type-meta: 0.8125rem;
    }
}