/* ── SYNCRAZE GLOBAL TYPOGRAPHY SYSTEM ── */
/* Source of Truth: index.html */

:root {
  --navy: #1a2b8c;
  --navy4: #091244;
  --sky: #4a9fd4;
  --skylt: #5bb8f5;
  --white: #ffffff;
  --off: rgba(200, 216, 240, 0.85); /* Exact index.html subline color */
  
  --font-main: 'Poppins', sans-serif;
  
  /* Exact Proportions from index.html Hero & Sections */
  --h1-size: clamp(2rem, 5vw, 3.8rem);
  --h2-size: clamp(1.75rem, 4.2vw, 2.8rem);
  --h3-size: clamp(1.4rem, 3vw, 1.95rem);
  --h4-size: clamp(1.2rem, 2.2vw, 1.55rem);
  --h5-size: clamp(1.1rem, 1.8vw, 1.3rem);
  --h6-size: clamp(0.9rem, 1.5vw, 1.05rem);

  /* Body Text Calibration */
  --body-size: clamp(.88rem, 1.7vw, 1.1rem);
  --line-height-base: 1.85; 
  --line-height-heading: 1.25;
}

/* ── GLOBAL ENFORCEMENT (Strict Rules) ── */
body, html {
  font-family: var(--font-main) !important;
  color: var(--white);
  -webkit-font-smoothing: antialiased;
}

/* Headings: Literal Mirror of index.html */
h1, .text-h1 {
  font-family: var(--font-main) !important;
  font-size: var(--h1-size) !important;
  font-weight: 900 !important;
  line-height: var(--line-height-heading) !important;
  letter-spacing: -0.015em !important;
  color: #ffffff !important;
}

h2, .text-h2 {
  font-family: var(--font-main) !important;
  font-size: var(--h2-size) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
  color: #ffffff !important;
}

h3, .text-h3 {
  font-family: var(--font-main) !important;
  /* font-size: var(--h3-size) !important; */
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: #ffffff !important;
}

h4, .text-h4 {
  font-family: var(--font-main) !important;
  font-size: var(--h4-size) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: #ffffff !important;
}

/* Paragraphs: Forced Line-Height & Shade */
p, .text-body, li {
  font-family: var(--font-main) !important;
  font-size: var(--body-size) !important;
  line-height: var(--line-height-base) !important;
  font-weight: 400 !important;
  color: var(--off) !important;
}

/* Interactive: Buttons & Navigation */
a, button, .btn, .nav-link {
  font-family: var(--font-main) !important;
  font-size: 0.78rem !important; 
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  text-decoration: none;
}

/* ── THEME ALTERNATIONS (Global System) ── */

/* WHITE THEME (#ffffff) */
.theme-white {
    background: #ffffff !important;
}

.theme-white h1, 
.theme-white h2, 
.theme-white h3, 
.theme-white h4, 
.theme-white h5, 
.theme-white h6, 
.theme-white .section-title,
.theme-white .sol-card-content h3,
.theme-white .plat-card strong {
    color: #0f172a !important;
}

.theme-white p, 
.theme-white li, 
.theme-white .testi-text {
    color: #334155 !important;
}

.theme-white .section-badge, 
.theme-white .section-label {
    border-color: rgba(15, 23, 42, 0.15) !important;
    color: #1a2b8c !important;
}

.theme-white .standard-header h2 span, 
.theme-white .section-title span {
    color: #1a2b8c !important;
}

/* Card/Asset Adjustments for White BG visibility */
.theme-white .val-card, 
.theme-white .plat-card, 
.theme-white .db-card,
.theme-white .resource-card {
    background: #f8fafc !important;
    border: 1px solid rgba(15, 23, 42, 0.1) !important;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.05) !important;
}

.theme-white .val-card-img, 
.theme-white .plat-card-img, 
.theme-white .db-card-img {
    filter: brightness(0) saturate(100%) invert(35%) sepia(20%) saturate(2000%) hue-rotate(180deg) !important;
    opacity: 0.9 !important;
}

/* DARK BLUE THEME (#132880) - Purged #7eb0ff usage */
.theme-blue {
    background: #091343!important;
}

.theme-blue h1, 
.theme-blue h2, 
.theme-blue h3, 
.theme-blue h4, 
.theme-blue h5, 
.theme-blue h6, 
.theme-blue .section-title,
.theme-blue .testi-name,
.theme-blue .sol-card-content h3,
.theme-blue .resource-card h3 {
    color: #ffffff !important;
}

.theme-blue p, 
.theme-blue li, 
.theme-blue .testi-text, 
.theme-blue .testi-role {
    color: #e6ecff !important;
}

.theme-blue .section-badge, 
.theme-blue .section-label {
    border-color: rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
}

.theme-blue .standard-header h2 span, 
.theme-blue .section-title span {
    color: #ffffff !important;
    text-decoration: underline;
    text-decoration-color: rgba(255, 255, 255, 0.3) !important;
}

.theme-blue .testi-card,
.theme-blue .db-card {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.theme-blue .sol-card-overlay {
    background: linear-gradient(180deg, rgba(2, 8, 24, 0.4) 0%, rgba(2, 8, 24, 0.9) 100%) !important;
}

/* ── Standard Header Component (Universal Section Style) ── */
.standard-header {
  text-align: center !important;
  margin-bottom: 50px !important;
}

.standard-header .section-badge {
  display: inline-block !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  color: var(--skylt) !important;
  margin-bottom: 24px !important;
}

.standard-header h1,
.standard-header h2 {
  font-weight: 900 !important;
  color: #ffffff !important;
  line-height: var(--line-height-heading) !important;
  margin-bottom: 24px !important;
}

.standard-header h1 { font-size: var(--h1-size) !important; }
.standard-header h2 { font-size: var(--h2-size) !important; }

.standard-header h1 span,
.standard-header h2 span {
  color: var(--sky) !important;
}

.standard-header p {
  color: var(--off) !important;
  max-width: 700px;
  margin: 0 auto !important;
}