/* SubRosa Typography System */
/* Plus Jakarta Sans for UI + body, IBM Plex Mono for technical elements */

/* Font Face Declarations */
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/fonts/PlusJakartaSans-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/fonts/PlusJakartaSans-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/fonts/PlusJakartaSans-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/fonts/PlusJakartaSans-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Import IBM Plex Mono from Google Fonts for technical elements */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');

:root {
  --font-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-heading-semibold: 600;
  --font-heading-medium: 500;
  --font-body-regular: 400;
}

/* Global Typography Reset */
html {
  font-family: var(--font-base);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--font-base) !important;
  font-weight: var(--font-body-regular);
  line-height: 1.7;
  color: #111827;
}

/* Heading Typography */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-base) !important;
  font-weight: var(--font-heading-medium);
  letter-spacing: -0.01em;
  line-height: 1.4;
  color: #111827;
  margin: 0 0 1rem 0;
}

h1 {
  font-weight: var(--font-heading-semibold) !important;
  font-size: clamp(2.5rem, 5vw, 4rem);
  letter-spacing: -0.02em;
  line-height: 1.3;
}

h2 {
  font-weight: var(--font-heading-semibold) !important;
  font-size: clamp(2rem, 4vw, 3rem);
  letter-spacing: -0.015em;
  line-height: 1.35;
}

h3 {
  font-weight: var(--font-heading-medium) !important;
  font-size: clamp(1.5rem, 3vw, 2rem);
  letter-spacing: -0.01em;
  line-height: 1.4;
}

h4 {
  font-weight: var(--font-heading-medium) !important;
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
}

h5 {
  font-weight: var(--font-heading-medium);
  font-size: 1.125rem;
}

h6 {
  font-weight: var(--font-heading-medium);
  font-size: 1rem;
}

/* Body Text */
p {
  font-family: var(--font-base) !important;
  font-weight: var(--font-body-regular);
  font-size: 1rem;
  line-height: 1.7;
  color: #374151;
  margin: 0 0 1rem 0;
}

/* Links */
a {
  font-family: inherit;
  color: #C1272D;
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  color: #991b1b;
}

/* Monospace Typography */
code, pre, .mono, .log-entry, .terminal, .incident-status {
  font-family: 'IBM Plex Mono', 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
  font-size: 0.95em;
  font-weight: 400;
  line-height: 1.5;
}

code {
  background: #F3F4F6;
  padding: 0.125rem 0.25rem;
  border-radius: 0.25rem;
  color: #DC2626;
}

pre {
  background: #1F2937;
  color: #F9FAFB;
  padding: 1rem;
  border-radius: 0.5rem;
  overflow-x: auto;
  margin: 1rem 0;
}

/* Utility Classes */
.font-heading {
  font-family: var(--font-base) !important;
}

.font-body {
  font-family: var(--font-base) !important;
}

.font-mono {
  font-family: 'IBM Plex Mono', 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
}

/* Font Weight Utilities */
.font-thin { font-weight: 100; }
.font-extralight { font-weight: 200; }
.font-light { font-weight: 300; }
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.font-extrabold { font-weight: 800; }
.font-black { font-weight: 900; }

/* Specific Component Typography Overrides */

/* Hero Section */
.hero-headline {
  font-family: var(--font-base) !important;
  font-weight: 600;
  font-size: clamp(3.2rem, 8vw, 5.5rem);
  line-height: 1.2;
  color: #232336;
  letter-spacing: -0.02em;
}

.hero-subheading {
  font-family: var(--font-base) !important;
  font-size: 1.25rem;
  font-weight: 400;
  color: #444;
  line-height: 1.5;
}

/* Section Titles */
.sable-features-headline,
.our-approach-title,
.how-subrosa-title,
.industries-title,
.real-results-title,
.media-section-title,
.blog-preview-title {
  font-family: var(--font-base) !important;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* Card Titles */
.sable-feature-title,
.our-approach-card-title,
.industry-title,
.real-results-number {
  font-family: var(--font-base) !important;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* Descriptions and Body Text */
.sable-features-description,
.our-approach-subheading,
.how-subrosa-description,
.industries-description,
.real-results-intro,
.real-results-description,
.sable-feature-text,
.our-approach-card-desc,
.industry-description {
  font-family: var(--font-base) !important;
  font-weight: 400;
  line-height: 1.7;
}

/* Labels and Tags */
.sable-section-label,
.our-approach-label,
.industries-label,
.real-results-label {
  font-family: var(--font-base) !important;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

/* Navigation */
.nav-link-block,
.side-menu-text-wrap a,
.new-mobile-menu-link {
  font-family: var(--font-base) !important;
  font-weight: var(--font-heading-medium);
}

/* Footer */
.footer-heading {
  font-family: var(--font-base) !important;
  font-weight: var(--font-heading-semibold);
  letter-spacing: -0.01em;
}

.footer-link,
.footer-description {
  font-family: var(--font-base) !important;
  font-weight: var(--font-body-regular);
}

/* Blog Typography */
.blog-card-title {
  font-family: var(--font-base) !important;
  font-weight: var(--font-heading-semibold);
  letter-spacing: -0.01em;
}

.blog-card-category,
.blog-card-meta {
  font-family: var(--font-base) !important;
  font-weight: var(--font-heading-medium);
}

/* Technical Elements */
.incident-status,
.log-entry,
.terminal-output {
  font-family: 'IBM Plex Mono', 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
  font-size: 0.9em;
  font-weight: 400;
}

/* Responsive Typography Adjustments */
@media (max-width: 768px) {
  h1 {
    font-size: clamp(2rem, 6vw, 3rem);
  }
  
  h2 {
    font-size: clamp(1.75rem, 5vw, 2.5rem);
  }
  
  h3 {
    font-size: clamp(1.5rem, 4vw, 2rem);
  }
  
  .hero-headline {
    font-size: clamp(2.5rem, 8vw, 4rem);
  }
  
  .hero-subheading {
    font-size: 1.125rem;
  }
}

/* Print Styles */
@media print {
  body {
    font-size: 12pt;
    line-height: 1.4;
  }
  
  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
  }
  
  p {
    orphans: 3;
    widows: 3;
  }
} 

/* UI + Navigation Labels */
label,
.form-label,
.ui-label,
.language-switcher-label,
.text-style-allcaps,
.text-style-muted,
.text-size-tiny {
  font-family: var(--font-base) !important;
  font-weight: var(--font-heading-medium) !important;
}

.modern-nav,
.modern-nav *,
.modern-sidebar,
.modern-sidebar *,
nav,
nav * {
  font-family: var(--font-base) !important;
}

.modern-nav a,
.modern-nav button,
.modern-nav-toggle,
.modern-sidebar-link,
.modern-sidebar-language label,
.nav-link-block,
.new-mobile-menu-link,
.side-menu-text-wrap a,
.language-switcher-select {
  font-weight: var(--font-heading-medium) !important;
}

/* Global Font Enforcement */
:where(body, div, span, section, article, header, footer, main, nav, aside, ul, ol, li, a, button, input, textarea, select, label, small, strong, em, figcaption, blockquote, table, th, td) {
  font-family: var(--font-base) !important;
}

button,
input,
select,
textarea {
  font-weight: var(--font-body-regular);
}