/*
Theme Name: OmenBroadcast
Theme URI: https://omenbroadcast.com
Description: The Creator Operating System. Extract Channel DNA. Build brand architecture. Produce artifacts across every format and platform. Gold + dark cinema aesthetic from the OMEN ecosystem.
Version: 1.0.0
Author: Dr. Mohamed Karim
Author URI: https://omenbroadcast.com
License: Proprietary
Text Domain: omenbroadcast
*/

/* ═══════════════════════════════════════════════════════════════════
   OmenBroadcast — Design System
   Gold + Dark cinema aesthetic inherited from OMEN OS ecosystem
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --bg-deep: #0a0a0a; --bg-card: #111111; --bg-elevated: #161616;
  --bg-surface: #1a1a1a; --bg-overlay: rgba(10,10,10,0.96);
  --gold: #c9a227; --gold-dim: #a07d1c; --gold-glow: #d4af3720; --gold-glow-s: #d4af3735;
  --cream: #e8e0d0; --cream-mid: #b5aa9a; --cream-dim: #9a9285;
  --cream-faint: #6b6560; --white: #f5f0e8;
  --border: #2a2520; --border-light: #3a342e; --focus-ring: #c9a22780;
  --green-live: #5cb878; --red: #d45454; --blue-accent: #4a8fd4;
  --serif: 'Cormorant Garamond','Palatino Linotype','Georgia',serif;
  --serif-body: 'Libre Caslon Text','Georgia','Palatino',serif;
  --sans: 'Josefin Sans','Trebuchet MS','Gill Sans','Helvetica Neue',sans-serif;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scrollbar-width:thin; scrollbar-color:var(--gold-dim) var(--bg-deep); }
body { background:var(--bg-deep); color:var(--cream); font-family:var(--serif-body); font-size:16px; line-height:1.7; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
body::before { content:''; position:fixed; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); pointer-events:none; z-index:9999; }
a { color:inherit; text-decoration:none; }
h1,h2,h3,h4 { font-family:var(--serif); font-weight:300; color:var(--white); }
img { max-width:100%; height:auto; }

/* ─── UTILITY CLASSES ────────────────────────────────────────────── */
.label { font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.25em; text-transform:uppercase; color:var(--gold); }
.label-line { display:flex; align-items:center; gap:16px; }
.label-line::before { content:''; width:40px; height:1px; background:var(--gold); flex-shrink:0; }
.btn-primary { display:inline-flex; align-items:center; gap:8px; font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--bg-deep); background:var(--gold); border:1px solid var(--gold); padding:12px 28px; text-decoration:none; transition:all .3s; cursor:pointer; }
.btn-primary:hover { background:transparent; color:var(--gold); }
.btn-ghost { display:inline-flex; align-items:center; gap:8px; font-family:var(--sans); font-size:11px; font-weight:400; letter-spacing:.2em; text-transform:uppercase; color:var(--cream-dim); border:1px solid var(--border-light); padding:12px 28px; text-decoration:none; transition:all .3s; cursor:pointer; background:transparent; }
.btn-ghost:hover { border-color:var(--cream); color:var(--white); }
.btn-sm { padding:8px 18px; font-size:10px; }
.divider { width:100%; height:1px; background:var(--border); position:relative; }
.divider::after { content:''; position:absolute; left:60px; top:-3px; width:6px; height:6px; border-radius:50%; background:var(--gold); }
.container { max-width:1200px; margin:0 auto; padding:0 60px; }

/* ─── NAV ────────────────────────────────────────────────────────── */
nav { position:fixed; top:0; left:0; right:0; z-index:1000; padding:0 60px; height:72px; display:flex; align-items:center; justify-content:space-between; background:rgba(10,10,10,.88); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); border-bottom:1px solid var(--border); }
.nav-logo { font-family:var(--sans); font-size:15px; font-weight:500; letter-spacing:.35em; color:var(--white); text-decoration:none; }
.nav-logo span { color:var(--gold); }
.nav-links { display:flex; align-items:center; gap:28px; list-style:none; }
.nav-link { font-family:var(--sans); font-size:11px; font-weight:400; letter-spacing:.18em; text-transform:uppercase; color:var(--cream-dim); text-decoration:none; transition:color .3s; position:relative; padding:4px 0; }
.nav-link:hover, .nav-link.active { color:var(--white); }
.nav-link.active::after { content:''; position:absolute; bottom:-2px; left:0; right:0; height:1px; background:var(--gold); }
.nav-cta { color:var(--gold)!important; border:1px solid var(--gold-dim); padding:8px 20px; transition:all .3s; }
.nav-cta:hover { background:var(--gold); color:var(--bg-deep)!important; }

/* ─── MOBILE NAV ─────────────────────────────────────────────────── */
.nav-toggle { display:none; background:transparent; border:1px solid var(--border-light); color:var(--cream-dim); padding:8px 12px; font-family:var(--sans); font-size:10px; letter-spacing:.15em; text-transform:uppercase; cursor:pointer; transition:all .3s; }
.nav-toggle:hover { border-color:var(--gold-dim); color:var(--gold); }

@media (max-width:768px) {
  nav { padding:0 24px; }
  .nav-toggle { display:block; }
  .nav-links { display:none; position:absolute; top:72px; left:0; right:0; flex-direction:column; background:var(--bg-overlay); padding:24px; gap:0; border-bottom:1px solid var(--border); }
  .nav-links.open { display:flex; }
  .nav-links li { width:100%; }
  .nav-link { display:block; padding:14px 0; border-bottom:1px solid var(--border); }
  .nav-cta { display:inline-block; margin-top:12px; text-align:center; }
}

/* ─── HERO ───────────────────────────────────────────────────────── */
.hero { min-height:100vh; display:flex; flex-direction:column; justify-content:center; padding:140px 60px 80px; position:relative; }
.hero-overline { margin-bottom:40px; }
.hero h1 { font-size:clamp(42px,6vw,82px); line-height:1.08; margin-bottom:40px; max-width:900px; }
.hero h1 em { font-style:italic; color:var(--gold); font-weight:300; }
.hero-quote { max-width:560px; margin-left:4px; padding-left:24px; border-left:2px solid var(--gold-dim); font-family:var(--serif); font-size:20px; font-style:italic; font-weight:300; color:var(--cream-dim); line-height:1.6; margin-bottom:16px; }
.hero-system-line { font-family:var(--sans); font-size:11px; letter-spacing:.12em; color:var(--cream-faint); margin-bottom:48px; padding-left:28px; }
.hero-system-line strong { color:var(--cream-mid); font-weight:500; }
.hero-actions { display:flex; gap:20px; align-items:center; flex-wrap:wrap; margin-bottom:28px; }
.hero-stats { display:flex; gap:64px; margin-top:auto; padding-top:80px; border-top:1px solid var(--border); }
.stat-item { display:flex; flex-direction:column; }
.stat-number { font-family:var(--serif); font-size:36px; font-weight:300; color:var(--white); }
.stat-number span { color:var(--gold); }
.stat-desc { font-family:var(--sans); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--cream-faint); margin-top:4px; }
.scroll-hint { position:absolute; bottom:40px; left:50%; transform:translateX(-50%); font-family:var(--sans); font-size:10px; letter-spacing:.3em; text-transform:uppercase; color:var(--cream-faint); display:flex; flex-direction:column; align-items:center; gap:12px; animation:fadeFloat 2.5s ease-in-out infinite; }
.scroll-hint::after { content:''; width:1px; height:32px; background:linear-gradient(to bottom,var(--cream-faint),transparent); }
@keyframes fadeFloat { 0%,100% { opacity:.4; transform:translateX(-50%) translateY(0); } 50% { opacity:.8; transform:translateX(-50%) translateY(6px); } }

/* ─── SECTION UTILITY ────────────────────────────────────────────── */
.section { padding:120px 60px; }
.section-header { margin-bottom:56px; }
.section-header h2 { font-size:clamp(32px,4vw,56px); line-height:1.15; margin-bottom:16px; }
.section-header h2 em { font-style:italic; color:var(--gold); }
.section-subtitle { font-family:var(--serif); font-size:16px; font-style:italic; color:var(--cream-faint); max-width:560px; }

/* ─── CHANNEL / FEATURE CARDS ────────────────────────────────────── */
.channel-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.channel-card { background:var(--bg-card); padding:40px 28px; transition:all .4s; position:relative; display:flex; flex-direction:column; }
.channel-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .4s; }
.channel-card:hover::before { transform:scaleX(1); }
.channel-card:hover { background:var(--bg-elevated); }
.channel-card-icon { font-size:28px; margin-bottom:16px; }
.channel-card-name { font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.channel-card-desc { font-size:14px; color:var(--cream-faint); line-height:1.7; flex:1; }
.channel-card-tag { font-family:var(--sans); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-dim); margin-top:16px; }

@media (max-width:1024px) { .channel-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { .channel-grid { grid-template-columns:1fr; } }

/* ─── DNA INDICATOR ──────────────────────────────────────────────── */
.dna-indicator { display:flex; gap:3px; align-items:center; margin-top:12px; }
.dna-indicator .dna-bar { width:20px; height:4px; border-radius:2px; background:var(--border-light); transition:background .3s; }
.dna-indicator .dna-bar.active { background:var(--gold); }
.dna-indicator-label { font-family:var(--sans); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--cream-faint); margin-left:8px; }

/* ─── BRAND HIERARCHY VISUALIZATION ──────────────────────────────── */
.hierarchy-tree { display:flex; flex-direction:column; gap:0; border:1px solid var(--border); }
.hierarchy-level { display:flex; align-items:center; padding:20px 28px; background:var(--bg-card); border-bottom:1px solid var(--border); transition:all .3s; }
.hierarchy-level:last-child { border-bottom:none; }
.hierarchy-level:hover { background:var(--bg-elevated); }
.hierarchy-indent { width:var(--indent,0); flex-shrink:0; }
.hierarchy-connector { width:20px; height:1px; background:var(--gold-dim); margin-right:16px; flex-shrink:0; }
.hierarchy-node { display:flex; align-items:center; gap:12px; }
.hierarchy-icon { font-size:18px; }
.hierarchy-name { font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--white); }
.hierarchy-desc { font-size:13px; color:var(--cream-faint); margin-left:auto; }

/* ─── ARTIFACT TIER BADGES ───────────────────────────────────────── */
.tier-badges { display:flex; gap:12px; flex-wrap:wrap; }
.tier-badge { font-family:var(--sans); font-size:10px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; padding:6px 16px; border:1px solid var(--border-light); color:var(--cream-dim); transition:all .3s; }
.tier-badge:hover { border-color:var(--gold-dim); color:var(--gold); }
.tier-badge.tier-1 { border-color:var(--cream-faint); color:var(--cream-mid); }
.tier-badge.tier-2 { border-color:var(--blue-accent); color:var(--blue-accent); }
.tier-badge.tier-3 { border-color:var(--green-live); color:var(--green-live); }
.tier-badge.tier-4 { border-color:var(--gold-dim); color:var(--gold); }
.tier-badge.tier-5 { border-color:var(--gold); color:var(--bg-deep); background:var(--gold); }

/* ─── PLATFORM ICONS GRID ────────────────────────────────────────── */
.platform-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.platform-item { background:var(--bg-card); padding:24px; display:flex; flex-direction:column; align-items:center; gap:8px; transition:all .3s; }
.platform-item:hover { background:var(--bg-elevated); }
.platform-icon { font-size:24px; }
.platform-name { font-family:var(--sans); font-size:9px; letter-spacing:.15em; text-transform:uppercase; color:var(--cream-faint); }

@media (max-width:768px) { .platform-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:480px) { .platform-grid { grid-template-columns:repeat(2,1fr); } }

/* ─── DNA PROFILE CARDS ──────────────────────────────────────────── */
.dna-profile-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.dna-profile-card { background:var(--bg-card); padding:28px 24px; transition:all .3s; }
.dna-profile-card:hover { background:var(--bg-elevated); }
.dna-layer-number { font-family:var(--sans); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.dna-layer-name { font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.dna-layer-desc { font-size:14px; color:var(--cream-faint); line-height:1.7; }
.dna-layer-example { font-family:var(--sans); font-size:10px; letter-spacing:.08em; color:var(--cream-faint); margin-top:12px; padding-top:12px; border-top:1px solid var(--border); }
.dna-layer-example strong { color:var(--gold-dim); }

@media (max-width:768px) { .dna-profile-grid { grid-template-columns:1fr; } }

/* ─── PRODUCTION PIPELINE VISUALIZATION ──────────────────────────── */
.pipeline-flow { display:flex; align-items:stretch; gap:0; border:1px solid var(--border); margin:40px 0; }
.pipeline-step { flex:1; padding:32px 20px; background:var(--bg-card); border-right:1px solid var(--border); display:flex; flex-direction:column; align-items:center; text-align:center; transition:all .3s; position:relative; }
.pipeline-step:last-child { border-right:none; }
.pipeline-step:hover { background:var(--bg-elevated); }
.pipeline-step-num { font-family:var(--sans); font-size:10px; letter-spacing:.2em; color:var(--gold); margin-bottom:12px; }
.pipeline-step-icon { font-size:24px; margin-bottom:12px; }
.pipeline-step-name { font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.pipeline-step-desc { font-size:13px; color:var(--cream-faint); line-height:1.6; }
.pipeline-step::after { content:'\2192'; position:absolute; right:-12px; top:50%; transform:translateY(-50%); font-size:16px; color:var(--gold-dim); z-index:1; }
.pipeline-step:last-child::after { display:none; }

@media (max-width:768px) {
  .pipeline-flow { flex-direction:column; }
  .pipeline-step { border-right:none; border-bottom:1px solid var(--border); }
  .pipeline-step:last-child { border-bottom:none; }
  .pipeline-step::after { content:'\2193'; right:auto; bottom:-12px; top:auto; left:50%; transform:translateX(-50%); }
}

/* ─── STEPS / HOW IT WORKS ───────────────────────────────────────── */
.steps-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.step-card { background:var(--bg-card); padding:40px 28px; transition:all .3s; }
.step-card:hover { background:var(--bg-elevated); }
.step-number { font-family:var(--sans); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.step-title { font-family:var(--serif); font-size:22px; font-weight:300; color:var(--white); margin-bottom:12px; }
.step-desc { font-size:14px; color:var(--cream-faint); line-height:1.7; }

@media (max-width:1024px) { .steps-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { .steps-grid { grid-template-columns:1fr; } }

/* ─── FEATURE CARDS (generic 3-col) ──────────────────────────────── */
.features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.feature-card { background:var(--bg-card); padding:40px 28px; transition:all .3s; }
.feature-card:hover { background:var(--bg-elevated); }
.feature-icon { font-size:24px; margin-bottom:16px; }
.feature-title { font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--white); margin-bottom:12px; }
.feature-desc { font-size:14px; color:var(--cream-faint); line-height:1.7; }

@media (max-width:768px) { .features-grid { grid-template-columns:1fr; } }

/* ─── FEATURE CARDS (4-col variant) ──────────────────────────────── */
.features-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.features-grid-4 .feature-card { background:var(--bg-card); padding:36px 24px; }

@media (max-width:1024px) { .features-grid-4 { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { .features-grid-4 { grid-template-columns:1fr; } }

/* ─── ARTIFACT TIER CARDS ────────────────────────────────────────── */
.tier-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.tier-card { background:var(--bg-card); padding:36px 24px; transition:all .3s; position:relative; display:flex; flex-direction:column; }
.tier-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--border-light); }
.tier-card.tier-active::before { background:var(--gold); }
.tier-card:hover { background:var(--bg-elevated); }
.tier-card-level { font-family:var(--sans); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:12px; }
.tier-card-name { font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.tier-card-desc { font-size:13px; color:var(--cream-faint); line-height:1.6; flex:1; }
.tier-card-formats { font-family:var(--sans); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-dim); margin-top:16px; padding-top:12px; border-top:1px solid var(--border); }

@media (max-width:1024px) { .tier-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { .tier-grid { grid-template-columns:1fr; } }

/* ─── POWERED BY ─────────────────────────────────────────────────── */
.powered-section { padding:80px 60px; text-align:center; }
.powered-section .label-line { justify-content:center; margin-bottom:24px; }
.powered-section h2 { font-size:clamp(28px,3vw,44px); margin-bottom:16px; }
.powered-section h2 em { font-style:italic; color:var(--gold); }
.powered-desc { font-family:var(--serif); font-size:17px; font-style:italic; color:var(--cream-faint); max-width:600px; margin:0 auto 40px; line-height:1.7; }
.powered-stack { display:flex; justify-content:center; gap:24px; flex-wrap:wrap; }
.powered-item { font-family:var(--sans); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--cream-faint); padding:10px 20px; border:1px solid var(--border); transition:all .3s; text-decoration:none; }
.powered-item:hover { border-color:var(--gold-dim); color:var(--gold); }

/* ─── PAGE HERO ──────────────────────────────────────────────────── */
.page-hero { padding:130px 60px 60px; border-bottom:1px solid var(--border); }
.page-hero h1 { font-size:clamp(36px,5vw,64px); line-height:1.1; margin-bottom:16px; }
.page-hero h1 em { font-style:italic; color:var(--gold); font-weight:300; }
.page-hero-subtitle { font-family:var(--serif); font-size:18px; font-style:italic; color:var(--cream-dim); max-width:560px; }

/* ─── PRICING ────────────────────────────────────────────────────── */
.pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.pricing-card { background:var(--bg-card); padding:40px 28px; display:flex; flex-direction:column; transition:all .3s; position:relative; }
.pricing-card:hover { background:var(--bg-elevated); }
.pricing-card.featured { background:var(--bg-elevated); }
.pricing-card.featured::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--gold); }
.pricing-badge { font-family:var(--sans); font-size:9px; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); border:1px solid var(--gold-dim); padding:4px 12px; display:inline-block; margin-bottom:16px; align-self:flex-start; }
.pricing-name { font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.pricing-price { font-family:var(--serif); font-size:42px; font-weight:300; color:var(--white); margin-bottom:4px; }
.pricing-price span { font-size:16px; color:var(--cream-faint); }
.pricing-period { font-family:var(--sans); font-size:10px; letter-spacing:.1em; color:var(--cream-faint); margin-bottom:24px; }
.pricing-features { list-style:none; flex:1; margin-bottom:28px; }
.pricing-features li { font-size:14px; color:var(--cream-dim); padding:8px 0; border-bottom:1px solid var(--border); display:flex; align-items:baseline; gap:10px; }
.pricing-features li::before { content:'\2713'; color:var(--gold); font-size:12px; flex-shrink:0; }
.pricing-features li.disabled { color:var(--cream-faint); opacity:.5; }
.pricing-features li.disabled::before { content:'\2717'; color:var(--cream-faint); }
.pricing-cta { margin-top:auto; }

@media (max-width:1024px) { .pricing-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { .pricing-grid { grid-template-columns:1fr; } }

/* ─── SLIDER VISUALIZATION ───────────────────────────────────────── */
.slider-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.slider-item { background:var(--bg-card); padding:20px 24px; transition:all .3s; }
.slider-item:hover { background:var(--bg-elevated); }
.slider-label { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.slider-name { font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--white); }
.slider-value { font-family:var(--sans); font-size:10px; color:var(--gold); }
.slider-track { width:100%; height:4px; background:var(--border-light); border-radius:2px; position:relative; }
.slider-fill { height:100%; background:var(--gold); border-radius:2px; transition:width .4s ease; }
.slider-thumb { position:absolute; top:-4px; width:12px; height:12px; border-radius:50%; background:var(--gold); border:2px solid var(--bg-card); transition:left .4s ease; }

@media (max-width:768px) { .slider-grid { grid-template-columns:1fr; } }

/* ─── CONFIDENCE BANDS ───────────────────────────────────────────── */
.confidence-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); margin-top:40px; }
.confidence-card { background:var(--bg-card); padding:28px 24px; transition:all .3s; text-align:center; }
.confidence-card:hover { background:var(--bg-elevated); }
.confidence-icon { font-size:24px; margin-bottom:12px; }
.confidence-name { font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.confidence-desc { font-size:13px; color:var(--cream-faint); line-height:1.6; }

@media (max-width:768px) { .confidence-grid { grid-template-columns:1fr; } }

/* ─── REPRODUCTION MODES ─────────────────────────────────────────── */
.mode-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
.mode-card { background:var(--bg-card); padding:32px 20px; transition:all .3s; text-align:center; }
.mode-card:hover { background:var(--bg-elevated); }
.mode-icon { font-size:24px; margin-bottom:12px; }
.mode-name { font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.mode-desc { font-size:13px; color:var(--cream-faint); line-height:1.6; }

@media (max-width:1024px) { .mode-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { .mode-grid { grid-template-columns:1fr; } }

/* ─── FAQ ACCORDION ──────────────────────────────────────────────── */
.faq-section { margin-top:80px; }
.faq-item { border:1px solid var(--border); margin-bottom:-1px; }
.faq-question { width:100%; background:var(--bg-card); border:none; padding:20px 24px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; transition:background .3s; }
.faq-question:hover { background:var(--bg-elevated); }
.faq-question-text { font-family:var(--serif); font-size:17px; color:var(--white); text-align:left; }
.faq-toggle { font-family:var(--sans); font-size:14px; color:var(--cream-faint); transition:transform .3s; flex-shrink:0; margin-left:16px; }
.faq-item.open .faq-toggle { transform:rotate(45deg); }
.faq-answer { display:none; padding:0 24px 20px; background:var(--bg-card); }
.faq-item.open .faq-answer { display:block; }
.faq-answer p { font-size:14px; color:var(--cream-dim); line-height:1.7; margin-bottom:12px; }
.faq-answer p:last-child { margin-bottom:0; }

/* ─── ABOUT PAGE ─────────────────────────────────────────────────── */
.about-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:100px; align-items:start; }
.about-left .label-line { margin-bottom:32px; }
.about-left h2 { font-size:clamp(36px,4vw,56px); line-height:1.15; margin-bottom:48px; }
.about-left h2 em { font-style:italic; color:var(--gold); }
.about-right { padding-top:24px; }
.about-right p { font-size:16px; color:var(--cream-dim); margin-bottom:28px; max-width:540px; line-height:1.8; }
.about-right p strong { color:var(--cream); font-weight:700; }
.resilience-callout { font-family:var(--serif); font-size:17px; font-style:italic; color:var(--cream-mid); border-left:2px solid var(--gold-dim); padding-left:20px; margin-top:8px; line-height:1.6; }

@media (max-width:768px) { .about-grid { grid-template-columns:1fr; gap:40px; } }

/* ─── FOUNDER CARD ───────────────────────────────────────────────── */
.founder-card { background:var(--bg-card); border:1px solid var(--border); padding:48px 40px; display:flex; gap:40px; align-items:center; }
.founder-avatar { width:120px; height:120px; border-radius:50%; border:2px solid var(--gold-dim); background:var(--bg-elevated); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:42px; color:var(--gold); flex-shrink:0; }
.founder-info h3 { font-family:var(--serif); font-size:28px; color:var(--white); margin-bottom:4px; }
.founder-info .founder-title { font-family:var(--sans); font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.founder-info p { font-size:15px; color:var(--cream-dim); line-height:1.7; }

@media (max-width:600px) { .founder-card { flex-direction:column; text-align:center; } }

/* ─── ECOSYSTEM LINKS ────────────────────────────────────────────── */
.ecosystem-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); margin-top:40px; }
.ecosystem-card { background:var(--bg-card); padding:32px 24px; transition:all .3s; text-align:center; text-decoration:none; }
.ecosystem-card:hover { background:var(--bg-elevated); }
.ecosystem-card h4 { font-family:var(--sans); font-size:13px; font-weight:500; letter-spacing:.15em; color:var(--white); margin-bottom:8px; }
.ecosystem-card h4 span { color:var(--gold); }
.ecosystem-card p { font-size:13px; color:var(--cream-faint); }

@media (max-width:768px) { .ecosystem-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px) { .ecosystem-grid { grid-template-columns:1fr; } }

/* ─── USE CASE CARDS ─────────────────────────────────────────────── */
.usecase-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); margin-top:40px; }
.usecase-card { background:var(--bg-card); padding:36px 28px; transition:all .3s; }
.usecase-card:hover { background:var(--bg-elevated); }
.usecase-icon { font-size:24px; margin-bottom:12px; }
.usecase-name { font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--white); margin-bottom:8px; }
.usecase-desc { font-size:14px; color:var(--cream-faint); line-height:1.7; }

@media (max-width:768px) { .usecase-grid { grid-template-columns:1fr; } }

/* ─── FOOTER ─────────────────────────────────────────────────────── */
footer { padding:60px; border-top:1px solid var(--border); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:60px; margin-bottom:60px; }
.footer-brand h3 { font-family:var(--sans); font-size:15px; font-weight:500; letter-spacing:.35em; color:var(--white); margin-bottom:16px; }
.footer-brand h3 span { color:var(--gold); }
.footer-brand p { font-size:14px; color:var(--cream-faint); max-width:320px; line-height:1.6; }
.footer-col h4 { font-family:var(--sans); font-size:10px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--cream-mid); margin-bottom:20px; }
.footer-col a { display:block; font-size:14px; color:var(--cream-faint); padding:6px 0; transition:color .3s; }
.footer-col a:hover { color:var(--gold); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:40px; border-top:1px solid var(--border); flex-wrap:wrap; gap:16px; }
.footer-bottom p { font-family:var(--sans); font-size:10px; letter-spacing:.1em; color:var(--cream-faint); }
.footer-bottom-links { display:flex; gap:24px; }
.footer-bottom-links a { font-family:var(--sans); font-size:10px; letter-spacing:.1em; color:var(--cream-faint); transition:color .3s; }
.footer-bottom-links a:hover { color:var(--gold); }
.footer-tagline { font-family:var(--serif); font-size:13px; font-style:italic; color:var(--cream-faint); text-align:center; margin-top:24px; }

@media (max-width:768px) {
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
  footer { padding:40px 24px; }
}
@media (max-width:480px) { .footer-grid { grid-template-columns:1fr; } }

/* ─── GENERAL RESPONSIVE ─────────────────────────────────────────── */
@media (max-width:768px) {
  .hero { padding:120px 24px 60px; }
  .hero-stats { gap:32px; flex-wrap:wrap; }
  .section { padding:80px 24px; }
  .page-hero { padding:110px 24px 40px; }
  .powered-section { padding:60px 24px; }
}