/* ── TOKENS ─────────────────────────────── */
:root {
  --bg:          #faf0d7;
  --bg-body:     #faf0d7;
  --surface:     #fffef7;
  --surface2:    #f0e4c0;
  --about-bg:    #f5e8c8;
  --border:      #c8b078;
  --text:        #1a1208;
  --text2:       #4a3a1a;
  --accent:      #005858;
  --accent-h:    #004444;
  --red:         #9b1717;
  --red-h:       #7d1010;
  --tag-light-bg:#ffffff;
  --car:         #7bbfd4;
  --accent-glow: rgba(0,112,112,.15);
  --tag-bg:      #d8f0ee;
  --tag-text:    #005858;
  --chip-bg:     #fffef7;
  --nav-bg:      #fffef7;
  --hero-bg:     #faf0d7;
  --radius:      14px;
}
.theme-input:checked ~ .site {
  --bg:          #0c1428;
  --bg-body:     #0c1428;
  --surface:     #111b33;
  --surface2:    #172240;
  --about-bg:    #111b33;
  --border:      #1e3060;
  --text:        #ddeeff;
  --text2:       #87b7d9;
  --accent:      #9da3ff;
  --accent-h:    #b0b5ff;
  --red:         #ff8080;
  --red-h:       #ffa0a0;
  --accent-glow: rgba(107,143,255,.22);
  --tag-bg:      #172240;
  --tag-text:    #7bb8ff;
  --chip-bg:     #111b33;
  --nav-bg:      #0c1428;
  --hero-bg:     #0c1428;
}

@media (prefers-color-scheme: dark) {
  /* Auto mode follows system preference by default (dark here). */
  .theme-input ~ .site.theme-auto {
    --bg:          #0c1428;
    --bg-body:     #0c1428;
    --surface:     #111b33;
    --surface2:    #172240;
    --about-bg:    #111b33;
    --border:      #1e3060;
    --text:        #ddeeff;
    --text2:       #87b7d9;
    --accent:      #9da3ff;
    --accent-h:    #b0b5ff;
    --red:         #ff8080;
    --red-h:       #ffa0a0;
    --accent-glow: rgba(107,143,255,.22);
    --tag-bg:      #172240;
    --tag-text:    #7bb8ff;
    --chip-bg:     #111b33;
    --nav-bg:      #0c1428;
    --hero-bg:     #0c1428;
  }

  body:has(.site.theme-auto):not(:has(#themeToggle:checked)) {
    background-color: #0c1428;
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Ccircle cx='12' cy='8' r='1.5' fill='white' opacity='0.18'/%3E%3Ccircle cx='60' cy='22' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='110' cy='6' r='2' fill='white' opacity='0.18'/%3E%3Ccircle cx='155' cy='30' r='1' fill='white' opacity='0.13'/%3E%3Ccircle cx='185' cy='12' r='1.5' fill='white' opacity='0.15'/%3E%3Ccircle cx='35' cy='55' r='1' fill='white' opacity='0.18'/%3E%3Ccircle cx='85' cy='70' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='140' cy='58' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='190' cy='75' r='2' fill='white' opacity='0.18'/%3E%3Ccircle cx='10' cy='110' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='55' cy='130' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='100' cy='115' r='1' fill='white' opacity='0.18'/%3E%3Ccircle cx='160' cy='140' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='30' cy='170' r='2' fill='white' opacity='0.18'/%3E%3Ccircle cx='80' cy='185' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='130' cy='175' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='175' cy='195' r='1' fill='white' opacity='0.15'/%3E%3Cline x1='40' y1='44' x2='56' y2='44' stroke='white' stroke-width='1' opacity='0.18'/%3E%3Cline x1='48' y1='36' x2='48' y2='52' stroke='white' stroke-width='1' opacity='0.18'/%3E%3Cline x1='152' y1='100' x2='168' y2='100' stroke='white' stroke-width='1' opacity='0.15'/%3E%3Cline x1='160' y1='92' x2='160' y2='108' stroke='white' stroke-width='1' opacity='0.15'/%3E%3C/svg%3E"),
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M15%2C35 Q28%2C18 41%2C35 Q54%2C52 67%2C35' fill='none' stroke='%2300dcdc' stroke-width='2' stroke-linecap='round' opacity='0.1'/%3E%3Cpath d='M100%2C160 Q113%2C143 126%2C160 Q139%2C177 152%2C160' fill='none' stroke='%23ff3f3f' stroke-width='2' stroke-linecap='round' opacity='0.08'/%3E%3Cpath d='M140%2C20 Q153%2C3 166%2C20 Q179%2C37 192%2C20' fill='none' stroke='%237bbfd4' stroke-width='2' stroke-linecap='round' opacity='0.09'/%3E%3Cpath d='M10%2C110 Q23%2C93 36%2C110 Q49%2C127 62%2C110' fill='none' stroke='%2300dcdc' stroke-width='2' stroke-linecap='round' opacity='0.08'/%3E%3Cpolygon points='100%2C15 114%2C38 86%2C38' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.09'/%3E%3Cpolygon points='170%2C140 184%2C163 156%2C163' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Cpolygon points='30%2C155 40%2C173 20%2C173' fill='%23ff3f3f' opacity='0.05'/%3E%3Cpolyline points='0%2C80 12%2C65 24%2C80 36%2C65 48%2C80 60%2C65' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Cpolyline points='110%2C185 122%2C170 134%2C185 146%2C170 158%2C185' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.07'/%3E%3Ccircle cx='185' cy='80' r='14' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Ccircle cx='60' cy='130' r='12' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.08'/%3E%3Crect x='75' y='70' width='8' height='8' rx='1' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.09' transform='rotate(25%2C79%2C74)'/%3E%3Crect x='155' y='55' width='7' height='7' rx='1' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.08' transform='rotate(-20%2C158%2C58)'/%3E%3Cline x1='128' y1='100' x2='128' y2='116' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.09'/%3E%3Cline x1='120' y1='108' x2='136' y2='108' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.09'/%3E%3Cline x1='75' y1='190' x2='75' y2='206' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Cline x1='67' y1='198' x2='83' y2='198' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Ccircle cx='170' cy='185' r='4' fill='%2300dcdc' opacity='0.08'/%3E%3Ccircle cx='20' cy='40' r='3' fill='%23ff3f3f' opacity='0.07'/%3E%3C/svg%3E");
    background-size: 200px 200px, 200px 200px;
  }

  .theme-input ~ .site.theme-auto .label-when-dark { display: flex; }
  .theme-input ~ .site.theme-auto .label-when-light { display: none; }

  /* In auto mode on dark systems, checked toggles to light explicitly. */
  .theme-input:checked ~ .site.theme-auto {
    --bg:          #faf0d7;
    --bg-body:     #faf0d7;
    --surface:     #fffef7;
    --surface2:    #f0e4c0;
    --about-bg:    #f5e8c8;
    --border:      #c8b078;
    --text:        #1a1208;
    --text2:       #4a3a1a;
    --accent:      #005858;
    --accent-h:    #004444;
    --red:         #9b1717;
    --red-h:       #7d1010;
    --accent-glow: rgba(0,112,112,.15);
    --tag-bg:      #d8f0ee;
    --tag-text:    #005858;
    --chip-bg:     #fffef7;
    --nav-bg:      #fffef7;
    --hero-bg:     #faf0d7;
  }

  .theme-input:checked ~ .site.theme-auto .label-when-dark { display: none; }
  .theme-input:checked ~ .site.theme-auto .label-when-light { display: flex; }

  body:has(.site.theme-auto):has(#themeToggle:checked) {
    background-color: #faf0d7;
    background-image: none;
  }
}
/* ...existing code... */
body {
  font-family: 'Segoe UI', system-ui, sans-serif;
  color: var(--text);
  transition: background .3s, color .3s;
  overflow-x: hidden;
  background-color: #faf0d7;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Ccircle cx='20' cy='20' r='4' fill='%23007070' opacity='0.18'/%3E%3Ccircle cx='100' cy='55' r='3' fill='%23cc2626' opacity='0.15'/%3E%3Ccircle cx='170' cy='30' r='5' fill='%23007070' opacity='0.12'/%3E%3Ccircle cx='60' cy='140' r='3' fill='%23cc2626' opacity='0.18'/%3E%3Ccircle cx='150' cy='120' r='4' fill='%237bbfd4' opacity='0.2'/%3E%3Ccircle cx='30' cy='90' r='2.5' fill='%23007070' opacity='0.15'/%3E%3Ccircle cx='185' cy='170' r='3' fill='%23cc2626' opacity='0.13'/%3E%3Ccircle cx='80' cy='185' r='4' fill='%237bbfd4' opacity='0.15'/%3E%3Cpolygon points='45%2C10 55%2C28 35%2C28' fill='none' stroke='%23cc2626' stroke-width='1.5' opacity='0.2'/%3E%3Cpolygon points='130%2C70 142%2C90 118%2C90' fill='%23007070' opacity='0.12'/%3E%3Cpolygon points='170%2C140 180%2C158 160%2C158' fill='none' stroke='%237bbfd4' stroke-width='1.5' opacity='0.22'/%3E%3Cpolygon points='10%2C160 20%2C178 0%2C178' fill='%23cc2626' opacity='0.1'/%3E%3Cpath d='M70%2C40 Q78%2C30 86%2C40 Q94%2C50 102%2C40' fill='none' stroke='%23007070' stroke-width='2' stroke-linecap='round' opacity='0.22'/%3E%3Cpath d='M10%2C110 Q18%2C100 26%2C110 Q34%2C120 42%2C110' fill='none' stroke='%23cc2626' stroke-width='2' stroke-linecap='round' opacity='0.18'/%3E%3Cpath d='M140%2C20 Q148%2C10 156%2C20 Q164%2C30 172%2C20' fill='none' stroke='%237bbfd4' stroke-width='2' stroke-linecap='round' opacity='0.25'/%3E%3Cpath d='M100%2C160 Q108%2C150 116%2C160 Q124%2C170 132%2C160' fill='none' stroke='%23007070' stroke-width='2' stroke-linecap='round' opacity='0.2'/%3E%3Cpath d='M50%2C185 Q58%2C175 66%2C185 Q74%2C195 82%2C185' fill='none' stroke='%23cc2626' stroke-width='2' stroke-linecap='round' opacity='0.15'/%3E%3Cpolyline points='0%2C65 8%2C55 16%2C65 24%2C55 32%2C65' fill='none' stroke='%23007070' stroke-width='1.5' opacity='0.15'/%3E%3Cpolyline points='120%2C100 128%2C90 136%2C100 144%2C90 152%2C100' fill='none' stroke='%23cc2626' stroke-width='1.5' opacity='0.15'/%3E%3Cpolyline points='60%2C170 68%2C160 76%2C170 84%2C160 92%2C170' fill='none' stroke='%237bbfd4' stroke-width='1.5' opacity='0.18'/%3E%3Crect x='155' y='70' width='8' height='8' rx='1' fill='none' stroke='%23cc2626' stroke-width='1.5' opacity='0.18' transform='rotate(20%2C159%2C74)'/%3E%3Crect x='25' y='50' width='6' height='6' rx='1' fill='%23007070' opacity='0.12' transform='rotate(15%2C28%2C53)'/%3E%3Crect x='110' y='170' width='7' height='7' rx='1' fill='none' stroke='%237bbfd4' stroke-width='1.5' opacity='0.2' transform='rotate(-10%2C113%2C173)'/%3E%3Cline x1='190' y1='80' x2='190' y2='96' stroke='%23007070' stroke-width='1.5' opacity='0.18'/%3E%3Cline x1='182' y1='88' x2='198' y2='88' stroke='%23007070' stroke-width='1.5' opacity='0.18'/%3E%3Cline x1='70' y1='100' x2='70' y2='116' stroke='%23cc2626' stroke-width='1.5' opacity='0.15'/%3E%3Cline x1='62' y1='108' x2='78' y2='108' stroke='%23cc2626' stroke-width='1.5' opacity='0.15'/%3E%3C/svg%3E");
  background-size: 200px 200px;
}
body:has(#themeToggle:checked) {
  background-color: #0c1428;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Ccircle cx='12' cy='8' r='1.5' fill='white' opacity='0.18'/%3E%3Ccircle cx='60' cy='22' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='110' cy='6' r='2' fill='white' opacity='0.18'/%3E%3Ccircle cx='155' cy='30' r='1' fill='white' opacity='0.13'/%3E%3Ccircle cx='185' cy='12' r='1.5' fill='white' opacity='0.15'/%3E%3Ccircle cx='35' cy='55' r='1' fill='white' opacity='0.18'/%3E%3Ccircle cx='85' cy='70' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='140' cy='58' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='190' cy='75' r='2' fill='white' opacity='0.18'/%3E%3Ccircle cx='10' cy='110' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='55' cy='130' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='100' cy='115' r='1' fill='white' opacity='0.18'/%3E%3Ccircle cx='160' cy='140' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='30' cy='170' r='2' fill='white' opacity='0.18'/%3E%3Ccircle cx='80' cy='185' r='1' fill='white' opacity='0.15'/%3E%3Ccircle cx='130' cy='175' r='1.5' fill='white' opacity='0.13'/%3E%3Ccircle cx='175' cy='195' r='1' fill='white' opacity='0.15'/%3E%3Cline x1='40' y1='44' x2='56' y2='44' stroke='white' stroke-width='1' opacity='0.18'/%3E%3Cline x1='48' y1='36' x2='48' y2='52' stroke='white' stroke-width='1' opacity='0.18'/%3E%3Cline x1='152' y1='100' x2='168' y2='100' stroke='white' stroke-width='1' opacity='0.15'/%3E%3Cline x1='160' y1='92' x2='160' y2='108' stroke='white' stroke-width='1' opacity='0.15'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M15%2C35 Q28%2C18 41%2C35 Q54%2C52 67%2C35' fill='none' stroke='%2300dcdc' stroke-width='2' stroke-linecap='round' opacity='0.1'/%3E%3Cpath d='M100%2C160 Q113%2C143 126%2C160 Q139%2C177 152%2C160' fill='none' stroke='%23ff3f3f' stroke-width='2' stroke-linecap='round' opacity='0.08'/%3E%3Cpath d='M140%2C20 Q153%2C3 166%2C20 Q179%2C37 192%2C20' fill='none' stroke='%237bbfd4' stroke-width='2' stroke-linecap='round' opacity='0.09'/%3E%3Cpath d='M10%2C110 Q23%2C93 36%2C110 Q49%2C127 62%2C110' fill='none' stroke='%2300dcdc' stroke-width='2' stroke-linecap='round' opacity='0.08'/%3E%3Cpolygon points='100%2C15 114%2C38 86%2C38' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.09'/%3E%3Cpolygon points='170%2C140 184%2C163 156%2C163' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Cpolygon points='30%2C155 40%2C173 20%2C173' fill='%23ff3f3f' opacity='0.05'/%3E%3Cpolyline points='0%2C80 12%2C65 24%2C80 36%2C65 48%2C80 60%2C65' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Cpolyline points='110%2C185 122%2C170 134%2C185 146%2C170 158%2C185' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.07'/%3E%3Ccircle cx='185' cy='80' r='14' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Ccircle cx='60' cy='130' r='12' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.08'/%3E%3Crect x='75' y='70' width='8' height='8' rx='1' fill='none' stroke='%2300dcdc' stroke-width='1.5' opacity='0.09' transform='rotate(25%2C79%2C74)'/%3E%3Crect x='155' y='55' width='7' height='7' rx='1' fill='none' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.08' transform='rotate(-20%2C158%2C58)'/%3E%3Cline x1='128' y1='100' x2='128' y2='116' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.09'/%3E%3Cline x1='120' y1='108' x2='136' y2='108' stroke='%23ff3f3f' stroke-width='1.5' opacity='0.09'/%3E%3Cline x1='75' y1='190' x2='75' y2='206' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Cline x1='67' y1='198' x2='83' y2='198' stroke='%2300dcdc' stroke-width='1.5' opacity='0.08'/%3E%3Ccircle cx='170' cy='185' r='4' fill='%2300dcdc' opacity='0.08'/%3E%3Ccircle cx='20' cy='40' r='3' fill='%23ff3f3f' opacity='0.07'/%3E%3C/svg%3E");
  background-size: 200px 200px, 200px 200px;
}
a { color: inherit; text-decoration: none; }

/* ── HIDDEN CHECKBOX + SITE WRAPPER ────── */
.theme-input { display: none; }
.site { min-height: 100vh; color: var(--text); }
.site-body { padding-top: 60px; }
.label-when-dark { display: none; }
.theme-input:checked ~ .site .label-when-dark { display: flex; }
.theme-input:checked ~ .site .label-when-light { display: none; }

/* ── NAV ────────────────────────────────── */
.main-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  background: var(--nav-bg);
  border-bottom: 2px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 2.5rem; height: 60px;
  transition: background .3s, border-color .3s;
}
.nav-logo { font-weight: 900; font-size: 1.05rem; color: var(--accent); }
.nav-logo span { color: var(--red); }
.nav-links { list-style: none; display: flex; gap: .15rem; align-items: center; }
.nav-links a {
  font-size: .88rem; font-weight: 500; color: var(--text2);
  padding: .38rem .85rem; border-radius: 8px;
  transition: color .2s, background .2s;
}
.nav-links a:hover { color: var(--text); background: var(--surface2); }
.nav-links a.active { background: var(--accent); color: #fff; }
.nav-right { display: flex; align-items: center; gap: .6rem; }
.theme-btn {
  background: var(--surface2); border: 1px solid var(--border);
  color: var(--text2); border-radius: 20px;
  padding: .28rem .8rem; font-size: .8rem;
  cursor: pointer; transition: all .2s;
  display: flex; align-items: center; gap: .3rem;
}
.theme-btn:hover { border-color: var(--accent); color: var(--text); }
.nav-cta {
  background: var(--red); color: #fff;
  font-weight: 700; font-size: .84rem;
  padding: .4rem 1.1rem; border-radius: 8px;
  transition: background .2s, transform .15s; border: none; cursor: pointer;
  display: inline-block;
}
.nav-cta:hover { background: var(--red-h); transform: translateY(-1px); }

/* ── HERO ───────────────────────────────── */
.hero {
  min-height: 100vh; display: flex; align-items: center;
  padding: 80px 2.5rem 3rem;
  margin-top: -60px;
  position: relative; overflow: hidden;
  border-bottom: 2px solid var(--border);
}
.hero-glow {
  position: absolute; top: 0; right: 0; width: 65%; height: 100%;
  background: radial-gradient(ellipse at 80% 40%, var(--surface2) 0%, transparent 65%);
  pointer-events: none;
}
.hero-inner {
  max-width: 1200px; margin: 0 auto; width: 100%;
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 3.5rem;
  align-items: center; position: relative; z-index: 1;
}
@media (max-width: 820px) {
  .hero-inner { grid-template-columns: 1fr; gap: 2rem; text-align: center; }
}

.eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  background: var(--surface); border: 1px solid var(--border); color: var(--accent);
  font-size: .75rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  padding: .3rem .9rem; border-radius: 20px; margin-bottom: 1.4rem;
}
.eyebrow-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--red);
  animation: blink 2s infinite;
}
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }

.hero h1 {
  font-size: clamp(2.4rem, 4.5vw, 3.6rem);
  font-weight: 900; line-height: 1.1; letter-spacing: -.035em; margin-bottom: 1.2rem;
}
.hero h1 .red { color: var(--red); }
.hero h1 .navy { color: var(--accent); }
.hero-sub { font-size: 1.05rem; color: var(--text2); line-height: 1.75; max-width: 460px; margin-bottom: 2rem; }
@media (max-width: 820px) { .hero-sub { margin: 0 auto 2rem; } }

.hero-btns { display: flex; gap: .75rem; flex-wrap: wrap; }
@media (max-width: 820px) { .hero-btns { justify-content: center; } }

.btn {
  display: inline-flex; align-items: center; gap: .45rem;
  font-weight: 700; font-size: .9rem; padding: .7rem 1.5rem;
  border-radius: 9px; border: none; cursor: pointer;
  transition: transform .15s, box-shadow .15s, background .15s;
  text-decoration: none;
}
.btn:hover { transform: translateY(-2px); }
.btn-red { background: var(--red); color: #fff; box-shadow: 0 3px 16px rgba(204,41,54,.3); }
.btn-red:hover { background: var(--red-h); }
.btn-outline { background: transparent; color: var(--accent); border: 2px solid var(--accent); }
.btn-outline:hover { background: var(--accent); color: #fff; }
.btn-navy { background: var(--accent); color: #fff; box-shadow: 0 3px 16px var(--accent-glow); }
.btn-navy:hover { background: var(--accent-h); }

.hero-stats {
  display: flex; gap: 2rem; flex-wrap: wrap;
  margin-top: 2.25rem; padding-top: 2rem; border-top: 1px solid var(--border);
}
@media (max-width: 820px) { .hero-stats { justify-content: center; } }
.stat-val { font-size: 1.55rem; font-weight: 900; color: var(--accent); }
.stat-val span { color: var(--red); }
.stat-lbl { font-size: .76rem; color: var(--text2); margin-top: .1rem; }

.hero-visual { display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; }
.header-img-wrap {
  width: 100%; max-width: 560px; border-radius: 20px; overflow: hidden;
  background: var(--bg); position: relative; box-shadow: 0 8px 48px var(--accent-glow);
}
.theme-input:checked ~ .site .header-img-wrap { border: 1px solid var(--border); }
.header-img-wrap img { width: 100%; height: auto; display: block; }
.chips { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; margin-top: 1.1rem; }
.chip {
  background: var(--chip-bg); border: 1px solid var(--border); color: var(--text2);
  font-size: .78rem; font-weight: 600; padding: .35rem .85rem; border-radius: 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,.07); display: flex; align-items: center; gap: .35rem;
}

/* ── SECTIONS ───────────────────────────── */
.wrap { max-width: 1200px; margin: 0 auto; padding: 4.5rem 2.5rem; }
.inner-page { padding: 2rem 2.5rem 4rem; max-width: 1200px; margin: 0 auto; }
.sec-label {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: var(--red); margin-bottom: .5rem;
}
.sec-title { font-size: clamp(1.5rem, 2.5vw, 2rem); font-weight: 900; letter-spacing: -.025em; margin-bottom: .5rem; }
.sec-sub { font-size: .93rem; color: var(--text2); max-width: 480px; }
.sec-row {
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: 2.25rem; flex-wrap: wrap; gap: 1rem;
}
.view-all {
  font-size: .84rem; font-weight: 700; color: var(--accent);
  border-bottom: 1.5px solid transparent; transition: border-color .2s;
  display: flex; align-items: center; gap: .25rem;
}
.view-all:hover { border-color: var(--accent); }

/* ── BLOG GRID ──────────────────────────── */
.blog-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1.2rem; }
@media (max-width: 860px) { .blog-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .blog-grid { grid-template-columns: 1fr; } }
.blog-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); overflow: hidden;
  transition: transform .2s, box-shadow .2s, border-color .2s;
  cursor: pointer; display: flex; flex-direction: column;
}
.blog-card:hover { transform: translateY(-5px); box-shadow: 0 14px 40px rgba(0,0,0,.12); border-color: var(--accent); }
.card-img {
  width: 100%; aspect-ratio: 16/9; overflow: hidden;
  background: var(--surface2); display: flex; align-items: center; justify-content: center; font-size: 2.5rem;
}
.card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.blog-card:hover .card-img img { transform: scale(1.05); }
.card-body { padding: 1.2rem 1.3rem 1.4rem; flex: 1; display: flex; flex-direction: column; }
.tag {
  display: inline-block; background: var(--tag-light-bg); color: var(--red);
  font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
  padding: .18rem .6rem; border-radius: 20px; margin-bottom: .55rem; width: fit-content;
}
.theme-input:checked ~ .site .tag { background: var(--tag-bg); color: var(--tag-text); }
.card-body h3 { font-size: .96rem; font-weight: 700; line-height: 1.35; margin-bottom: .45rem; flex: 1; }
.card-body p { font-size: .83rem; color: var(--text2); line-height: 1.6; }
.card-meta { font-size: .73rem; color: var(--text2); margin-top: .75rem; }
.card-big { grid-row: span 2; }
.card-big .card-img { aspect-ratio: 4/3; }
.card-big .card-body { padding: 1.4rem 1.5rem 1.6rem; }
.card-big .card-body h3 { font-size: 1.2rem; margin-bottom: .65rem; flex: 0; }
.card-big .card-body p {
  font-size: .88rem;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 11;
  -webkit-box-orient: vertical;
}

/* ── VIDEOS ─────────────────────────────── */
.vid-stripe { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.vid-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.2rem; }
.vc {
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius); overflow: hidden;
  transition: transform .2s, border-color .2s; cursor: pointer;
}
.vc:hover { transform: translateY(-4px); border-color: var(--accent); }
.vthumb {
  width: 100%; aspect-ratio: 16/9; position: relative;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--surface2), var(--bg)); font-size: 2.2rem;
}
.play {
  position: absolute; width: 42px; height: 42px; border-radius: 50%;
  background: var(--red); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; padding-left: 2px;
  box-shadow: 0 2px 12px rgba(204,41,54,.4); transition: transform .2s, background .2s;
}
.vc:hover .play { transform: scale(1.12); background: var(--red-h); }
.vinfo { padding: .85rem 1.05rem 1rem; }
.vinfo h3 { font-size: .87rem; font-weight: 600; line-height: 1.35; margin-bottom: .3rem; }
.vinfo span { font-size: .74rem; color: var(--text2); }

/* ── SPEAKING ───────────────────────────── */
.events { display: flex; flex-direction: column; gap: .8rem; }
.ev {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); display: flex; align-items: center; gap: 1.25rem;
  padding: 1.1rem 1.4rem; transition: border-color .2s, transform .2s; cursor: pointer;
}
.ev:hover { border-color: var(--accent); transform: translateX(5px); }
.ev-date {
  min-width: 50px; text-align: center; background: var(--accent); color: #fff;
  border-radius: 10px; padding: .45rem .55rem; flex-shrink: 0;
}
.ev-date .d { font-size: 1.45rem; font-weight: 900; line-height: 1; }
.ev-date .m { font-size: .65rem; font-weight: 700; text-transform: uppercase; opacity: .85; }
.ev-body { flex: 1; }
.ev-body h3 { font-size: .95rem; font-weight: 700; margin-bottom: .18rem; }
.ev-body p { font-size: .82rem; color: var(--text2); }
.badge {
  font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  padding: .2rem .65rem; border-radius: 20px; border: 1px solid; white-space: nowrap; flex-shrink: 0;
}
.b-key { color: var(--red); border-color: var(--red); background: transparent; }
.b-live { color: #e88c30; border-color: #e88c30; background: transparent; }
.b-online { color: #22b89a; border-color: #22b89a; background: transparent; }

/* ── ABOUT ──────────────────────────────── */
.about-stripe { background: var(--about-bg); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.about-inner {
  max-width: 1200px; margin: 0 auto; padding: 4.5rem 2.5rem;
  display: grid; grid-template-columns: auto 1fr; gap: 4rem; align-items: center;
}
@media (max-width: 740px) { .about-inner { grid-template-columns: 1fr; gap: 2rem; } }
.about-img {
  width: 260px; border-radius: 16px; overflow: hidden;
  border: 2px solid var(--border); background: var(--bg); flex-shrink: 0;
}
.about-img img { width: 100%; height: auto; display: block; }
.topics { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.3rem; }
.topic {
  background: #d8f0ee; border: 1px solid #a0d4d0; color: #005858;
  font-size: .79rem; font-weight: 500; padding: .3rem .75rem; border-radius: 20px;
}
.theme-input:checked ~ .site .topic { background: var(--tag-bg); border-color: var(--border); color: var(--tag-text); }

/* ── NEWSLETTER ─────────────────────────── */
.nl-wrap { max-width: 1200px; margin: 0 auto; padding: 0 2.5rem 4.5rem; }
.nl {
  background: linear-gradient(130deg, #006666 0%, #008080 50%, #cc2626 100%);
  border-radius: 20px; padding: 3rem;
  display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
  position: relative; overflow: hidden;
}
.theme-input:checked ~ .site .nl { background: linear-gradient(130deg, var(--accent) 0%, #1a2a7a 50%, var(--red) 100%); }
.nl::after {
  content: '\2736'; position: absolute; right: 2.5rem; top: 50%;
  transform: translateY(-50%); font-size: 8rem; opacity: .06; color: #fff; pointer-events: none;
}
.nl h2 { font-size: 1.5rem; font-weight: 800; color: #fff; margin-bottom: .35rem; }
.nl p { color: rgba(255,255,255,.78); font-size: .9rem; }
.nl-text { position: relative; z-index: 1; }
.nl-form { display: flex; gap: .5rem; flex-wrap: wrap; position: relative; z-index: 1; }
.nl-form input {
  padding: .65rem 1.1rem; border-radius: 8px; border: none; font-size: .9rem;
  min-width: 220px; background: rgba(255,255,255,.95); color: #0e1a2e;
}
.nl-form input::placeholder { color: #475868; }
.btn-white { background: #fff; color: var(--accent); font-weight: 800; font-size: .88rem; }
.btn-white:hover { box-shadow: 0 4px 20px rgba(0,0,0,.2); }

/* ── FOOTER ─────────────────────────────── */
footer {
  background: var(--surface); border-top: 1px solid var(--border);
  padding: 2.5rem; display: flex; flex-direction: column; align-items: center; gap: 1.1rem;
  margin-top: 10px;
}
.socials { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.soc {
  background: var(--surface2); border: 1px solid var(--border); color: var(--text2);
  border-radius: 9px; padding: .4rem .9rem; font-size: .8rem; font-weight: 500;
  transition: all .2s; display: flex; align-items: center; gap: .3rem;
}
.soc:hover { color: var(--text); border-color: var(--accent); }
.foot-nav { display: flex; gap: 1.25rem; flex-wrap: wrap; justify-content: center; }
.foot-nav a { font-size: .81rem; color: var(--text2); transition: color .2s; }
.foot-nav a:hover { color: var(--text); }
.copy { font-size: .78rem; color: var(--text2); }

/* ── VALIDATION (kept for forms) ─────────── */
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid red; }
.validation-message { color: red; }
.blog-image { max-width: 100%; }
