/* IFEELVOID — display typography contract
   DESIGN.md: Cabinet Grotesk carries headlines, product names, prices, and
   decisive calls to action. Body copy stays IBM Plex Sans; technical metadata,
   timestamps, and labels stay IBM Plex Mono.

   This file is standalone on purpose: pages that do not load void-editorial.css
   still receive the display contract. Load after page-level styles. */

@import url('https://api.fontshare.com/v2/css?f[]=cabinet-grotesk@500,700,800&display=swap');

:root {
    --void-display: 'Cabinet Grotesk', 'Arial Narrow', sans-serif;
    --void-text: 'IBM Plex Sans', Arial, sans-serif;
    --void-mono: 'IBM Plex Mono', monospace;
}

/* Headlines and structural titles */
h1,
h2,
h3,
.section-title,
.premium-title,
.hero-title,
.page-title,
.hero-heading,
.product-title,
.product-name,
.section-heading,
.about-heading,
.studio-heading,
.service-heading,
.feature-heading,
.card-title,
.service-card h3,
.void-product-card h3,
.newsletter h3,
.pricing-card h3,
.pricing-tier h3,
.tier-name,
.plan-name,
.studio-card h3,
.footer-section h4,

/* Product names, prices, and offer figures */
.price,
.price-tag,
.product-price,
.service-price,
.offer-price,
.pricing-price,
.tier-price,
.plan-price,
.price-value,
.price-amount,
[class$='-price'],
[class*='-price '],
[class*='-price-'],

/* Decisive calls to action */
.btn-primary,
.premium-btn.primary,
.cta-primary,
.checkout-btn,
.buy-btn,
.btn-buy,
.button-primary {
    font-family: var(--void-display);
}

/* Metadata, timestamps, technical labels, and body copy stay put. */
time,
.meta,
.metadata,
.timestamp,
.section-label,
.eyebrow,
.track-duration,
.playback-time,
code,
kbd,
pre,
.nav-links a,
.nav-socials,
.footer-bottom,
.blog-meta,
.post-meta,
.date,
.tag,
.format-label {
    font-family: var(--void-mono, 'IBM Plex Mono', monospace);
}

body,
p,
li,
input,
textarea,
select,
button,
.body-copy,
.prose,
.description,
.lead {
    font-family: var(--void-text, 'IBM Plex Sans', sans-serif);
}