:root {
  --brand: #168552;
  --brand-dark: #064f3b;
  --brand-deep: #033c30;
  --accent: #b9f06b;
  --yellow: #f7bd2f;
  --ink: #092f2a;
  --muted: #60736d;
  --paper: #f7faf8;
  --soft: #eaf5ef;
  --line: #dbe8e1;
  --bs-primary: #168552;
  --bs-primary-rgb: 22, 133, 82;
  --article-font-scale: 1;
}

html { width:100%; max-width:100%; overflow-x:clip; scroll-behavior:smooth; }
body {
  width:100%;
  max-width:100%;
  overflow-x:clip;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  line-height: 1.65;
}
.top-line { display: none; }
h1, h2, h3, h4, .display-title { letter-spacing: -.035em; font-weight: 750; }
a { color: var(--brand-dark); }
.ui-icon { width:1.15em; height:1.15em; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.site-header { background: rgba(255,255,255,.98) !important; transition: box-shadow .25s ease, background-color .25s ease; }
.site-header.is-scrolled { box-shadow: 0 10px 35px rgba(3,61,47,.1); background: rgba(255,255,255,.94) !important; backdrop-filter: blur(14px); }
.site-header .navbar { min-height: 78px; }
.navbar-brand img {
  display: block;
  width: 184px;
  height: auto;
  max-height: 58px;
  object-fit: contain;
  object-position: left center;
}
.navbar .nav-link {
  position: relative;
  color: #193b34;
  font-size: .9rem;
  font-weight: 700;
  padding: .8rem .78rem;
}
.navbar .nav-link::after {
  content: "";
  position: absolute;
  left: .78rem;
  right: .78rem;
  bottom: .35rem;
  height: 2px;
  background: var(--brand);
  transform: scaleX(0);
  transition: transform .2s ease;
}
.navbar .nav-link:hover { color: var(--brand); }
.navbar .nav-link:hover::after { transform: scaleX(1); }
.navbar .dropdown-toggle::after { position: static; background: none; transform: none; height: auto; }
.mobile-menu-toggle { width:44px; height:44px; padding:11px; border:1px solid var(--line); border-radius:50%; box-shadow:none !important; }
.mobile-menu-toggle span { display:block; width:20px; height:2px; margin:4px auto; border-radius:2px; background:var(--brand-dark); transition:transform .2s ease; }
.mobile-menu { width:min(88vw,380px) !important; border:0; background:#f5faf7; box-shadow:-20px 0 60px rgba(2,48,38,.18); }
.mobile-menu .offcanvas-header { padding:1.25rem 1.35rem; border-bottom:1px solid var(--line); }
.mobile-menu-brand img { width:155px; height:auto; display:block; }
.mobile-menu-close { width:42px; height:42px; display:grid; place-items:center; border:0; border-radius:50%; color:#fff; background:var(--brand-dark); font-size:1.65rem; line-height:1; }
.mobile-menu .offcanvas-body { padding:1.5rem 1.35rem 1.25rem; }
.mobile-menu-kicker { margin-bottom:.65rem; color:var(--brand); font-size:.68rem; font-weight:850; letter-spacing:.16em; text-transform:uppercase; }
.mobile-menu-links { display:flex; flex-direction:column; }
.mobile-menu-links > a,.mobile-topic-toggle { display:flex; align-items:center; gap:.85rem; width:100%; padding:.82rem 0; border:0; border-bottom:1px solid var(--line); color:var(--ink); background:transparent; text-align:left; text-decoration:none; font-size:1.18rem; font-weight:780; }
.mobile-menu-links > a > span,.mobile-topic-toggle > span { color:var(--brand); font-size:.66rem; letter-spacing:.08em; }
.mobile-menu-links > a.active { color:var(--brand); }
.mobile-topic-toggle b { margin-left:auto; color:var(--brand); font-size:1.4rem; font-weight:400; }
.mobile-topics { padding:.55rem 0 .55rem 2.2rem; border-bottom:1px solid var(--line); }
.mobile-topics a { display:block; padding:.42rem 0; color:var(--muted); text-decoration:none; font-size:.87rem; }
.mobile-menu-search { display:flex; margin-top:1.15rem; padding:.35rem; border:1px solid var(--line); border-radius:999px; background:#fff; }
.mobile-menu-search input { min-width:0; flex:1; padding:.55rem .75rem; border:0; outline:0; background:transparent; }
.mobile-menu-search button { width:40px; height:40px; border:0; border-radius:50%; color:#fff; background:var(--brand); }
.mobile-discover { padding:.72rem 1rem; font-size:.93rem; }
.mobile-menu-email { display:block; margin-top:1rem; color:var(--muted); text-align:center; text-decoration:none; font-size:.78rem; }
.site-tool-button { width:38px; height:38px; display:grid; place-items:center; padding:0; border:1px solid var(--line); border-radius:50%; color:var(--brand-dark); background:transparent; text-decoration:none; font-size:1.1rem; }
.site-tool-button .ui-icon { width:18px; height:18px; }
.site-tool-button:hover { color:#fff; background:var(--brand); border-color:var(--brand); }

.btn { font-weight: 750; border-radius: 999px; }
.btn-brand { background: var(--brand); color: #fff; border-color: var(--brand); }
.btn-brand:hover { background: var(--brand-dark); color: #fff; border-color: var(--brand-dark); }
.btn-outline-brand { border-color: var(--brand); color: var(--brand-dark); }
.btn-outline-brand:hover { background: var(--brand); color: #fff; }
.btn-accent { background: var(--accent); border-color: var(--accent); color: var(--brand-deep); }
.btn-accent:hover { background: #d3ff91; border-color: #d3ff91; color: var(--brand-deep); }
.btn-ghost { border: 1px solid rgba(255,255,255,.58); color: #fff; background: rgba(255,255,255,.07); }
.btn-ghost:hover { color: var(--brand-deep); background: #fff; border-color: #fff; }

.eyebrow {
  display: inline-block;
  color: var(--brand);
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 850;
}
.eyebrow-light { color: #d2ff9d; }

.hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 590px;
  overflow: hidden;
}
.hero-photo {
  background: url("../img/energy-hero-v2.png") center center / cover no-repeat;
}
.hero-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(2,51,40,.97) 0%, rgba(3,68,49,.88) 33%, rgba(4,67,48,.36) 62%, rgba(0,0,0,.06) 100%);
}
.hero::after { content:""; position:absolute; z-index:0; top:-35%; right:-10%; width:54%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(255,220,116,.2),transparent 67%); animation:solarGlow 7s ease-in-out infinite; pointer-events:none; }
.hero > .container { z-index:1; }
.hero-copy { max-width: 650px; padding: 4.8rem 0 6rem; }
.hero h1 {
  max-width: 690px;
  font-size: clamp(3rem, 5.5vw, 5.45rem);
  line-height: .98;
  font-weight: 820;
}
.hero-emphasis { color: var(--accent); }
.hero-intro { max-width: 600px; color: rgba(255,255,255,.84); font-size: 1.08rem; }

.topic-gateway { position: relative; z-index: 2; margin-top: -54px; padding-bottom: 3rem; }
.topic-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 236px;
  padding: 1.55rem;
  border-radius: 14px;
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 16px 45px rgba(2,54,41,.13);
  transition: transform .2s ease, box-shadow .2s ease;
}
.topic-card:hover { transform: translateY(-5px); box-shadow: 0 22px 55px rgba(2,54,41,.18); color: inherit; }
.topic-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, rgba(239,249,244,.97) 20%, rgba(239,249,244,.72) 62%, rgba(239,249,244,.12)); }
.topic-card-1, .topic-card-4 { background: url("../img/energy-hero-v2.png") 73% center / auto 100% no-repeat, #e8f3ee; }
.topic-card-2 { background: linear-gradient(135deg, #08714e, #034936); color: #fff; }
.topic-card-2::before { display: none; }
.topic-card-3 { background: linear-gradient(145deg, #eef7f3, #d7ece2); }
.topic-card-3::after { content: ""; position: absolute; width: 150px; height: 150px; right: -28px; bottom: -35px; background: url("../img/favicon.png") center/contain no-repeat; opacity: .12; }
.topic-card > * { position: relative; z-index: 1; }
.topic-number { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.76); color: var(--brand-dark); font-size: .78rem; font-weight: 850; }
.topic-card-2 .topic-number { background: rgba(255,255,255,.14); color: var(--accent); }
.topic-content h2 { letter-spacing: -.02em; }
.topic-content p { max-width: 220px; font-size: .83rem; line-height: 1.55; opacity: .8; }
.topic-link { font-size: .8rem; font-weight: 800; }

.section-space { padding: 5.5rem 0; }
.section-title { font-size: clamp(2.25rem, 4.4vw, 4rem); line-height: 1.04; }
.editorial-section { background: #fff; }
.editorial-visual {
  position: relative;
  display: block;
  min-height: 430px;
  overflow: hidden;
  border-radius: 18px;
  background: url("../img/energy-hero-v2.png") 68% center / cover no-repeat;
  box-shadow: 0 20px 55px rgba(3,61,47,.16);
}
.editorial-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(2,49,39,.48)); }
.editorial-note {
  position: absolute;
  z-index: 2;
  left: 0;
  bottom: 0;
  width: min(330px, 78%);
  padding: 1.6rem;
  color: #fff;
  background: var(--brand-dark);
  border-radius: 0 16px 0 0;
}
.editorial-note strong { display: block; margin: .55rem 0 .8rem; font-size: 1.5rem; line-height: 1.1; }
.editorial-note > span:last-child { color: var(--accent); font-size: .82rem; font-weight: 800; }

.impact-band { position: relative; overflow: hidden; padding: 2.75rem 0; color: #fff; background: var(--brand-deep); }
.impact-band::after { content: ""; position: absolute; width: 280px; height: 280px; right: -65px; top: -80px; background: url("../img/favicon.png") center/contain no-repeat; opacity: .055; }
.impact-item { position: relative; z-index: 1; padding: 1rem 1.25rem; border-right: 1px solid rgba(255,255,255,.17); }
.impact-item:last-child { border-right: 0; }
.impact-item strong { display: block; color: var(--accent); font-size: clamp(1.55rem, 3vw, 2.35rem); line-height: 1; }
.impact-item span { display: block; margin-top: .55rem; color: rgba(255,255,255,.76); font-size: .84rem; }

.latest-section { background: #f5f9f6; }
.article-card { border-radius: 14px !important; transition: transform .2s ease, box-shadow .2s ease; }
.article-card:hover { transform: translateY(-5px); box-shadow: 0 1rem 2.4rem rgba(4,67,49,.13) !important; }
.article-cover { height: 230px; object-fit: cover; }
.article-placeholder {
  min-height: 220px;
  background: linear-gradient(135deg, rgba(3,69,50,.12), rgba(192,240,180,.06)), url("../img/energy-hero-v2.png") 74% center / cover no-repeat;
}
.article-placeholder img { width: 76px; height: 76px; padding: .45rem; border-radius: 50%; object-fit: contain; background: rgba(255,255,255,.86); box-shadow: 0 8px 30px rgba(3,61,47,.18); }
.card-title { line-height: 1.2; }
.category-label { color: var(--brand); text-decoration: none; font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 850; }
.reading-time { padding:.18rem .48rem; border-radius:999px; color:var(--brand-dark); background:var(--soft); font-size:.68rem; font-weight:750; white-space:nowrap; }

.approach-section { border-top: 1px solid var(--line); }
.approach-card { height: 100%; padding: 1.7rem; border-radius: 12px; background: var(--soft); }
.approach-card > span { color: var(--brand); font-size: 1.4rem; font-weight: 850; }
.approach-card h3 { margin: 1.5rem 0 .65rem; }
.approach-card p { margin: 0; color: var(--muted); }

.feature-panel { background: #fff; border: 1px solid var(--line); border-radius: 1.25rem; overflow: hidden; }
.feature-visual { min-height: 360px; background: linear-gradient(145deg,#dfead9,#f5efcf); display:flex; align-items:center; justify-content:center; }
.feature-visual img { width:min(280px,65%); height:auto; }
.category-tile { display:block; height:100%; background:#fff; border:1px solid var(--line); border-radius:1rem; padding:1.5rem; color:var(--ink); text-decoration:none; }
.category-tile:hover { border-color:var(--brand); color:var(--brand-dark); }
.category-icon { width:42px; height:42px; border-radius:50%; background:var(--soft); display:grid; place-items:center; color:var(--brand-dark); font-weight:900; }

.page-hero { padding: 4.25rem 0 2.75rem; background: linear-gradient(180deg,#e7f4ed,transparent); }
.search-box { border:1px solid var(--line); background:#fff; border-radius:1rem; padding:1rem; }
.article-shell { max-width:850px; }
.article-kicker { color:var(--brand); font-weight:800; }
.article-title { font-family: Georgia,"Times New Roman",serif; font-size:clamp(2.35rem,6vw,4.6rem); line-height:1.05; font-weight:700; }
.article-meta { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:1rem 0; }
.article-body { font-family:Georgia,"Times New Roman",serif; font-size:calc(1.16rem * var(--article-font-scale)); color:#263a31; transition:font-size .2s ease; }
.article-body h2 { font-size:2rem; margin-top:2.6rem; }
.article-body h3 { font-size:1.55rem; margin-top:2rem; }
.article-body h2,.article-body h3 { display:flex; align-items:baseline; gap:.55rem; scroll-margin-top:100px; }
.heading-copy { flex:0 0 auto; display:grid; place-items:center; width:30px; height:30px; padding:0; border:0; color:var(--brand); background:transparent; opacity:.45; }
.heading-copy .ui-icon { width:16px; height:16px; }
.heading-copy:hover,.heading-copy:focus { opacity:1; }
.article-body blockquote { border-left:4px solid var(--yellow); padding:1rem 1.5rem; background:#fff9e8; font-style:italic; }
.article-body a { color:var(--brand-dark); }
.references { background:#eff5f1; border-radius:1rem; padding:1.5rem; }
.article-tags { display:flex; flex-wrap:wrap; gap:.45rem; }
.article-tags a { padding:.24rem .55rem; border-radius:999px; color:var(--brand-dark); background:var(--soft); text-decoration:none; font-size:.72rem; font-weight:750; }
.article-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; padding:.8rem; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 8px 24px rgba(2,50,39,.06); }
.article-toolbar button,.article-toolbar .source-jump { min-height:38px; padding:.45rem .7rem; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:var(--paper); text-decoration:none; font-size:.78rem; font-weight:750; }
.article-toolbar button { display:inline-flex; align-items:center; justify-content:center; gap:.38rem; }
.article-toolbar button > .ui-icon { width:16px; height:16px; }
.font-controls { display:flex; align-items:center; gap:.25rem; }
.font-controls span { min-width:48px; text-align:center; font-size:.72rem; color:var(--muted); }
.share-tools { display:flex; flex-wrap:wrap; gap:.35rem; }
.save-article.is-saved { color:#fff; background:var(--brand); border-color:var(--brand); }
.source-jump { margin-left:auto; }
.article-toc { margin:1.5rem 0 2.5rem; padding:1.4rem 1.5rem; border-left:4px solid var(--yellow); border-radius:0 14px 14px 0; background:var(--soft); }
.article-toc ol { margin:.8rem 0 0; padding-left:1.2rem; }
.article-toc li { margin:.38rem 0; }
.article-toc .toc-level-3 { margin-left:1rem; font-size:.92em; }
.article-toc a { color:var(--ink); text-decoration:none; }
.article-pagination { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.article-pagination a { display:flex; flex-direction:column; gap:.4rem; min-height:112px; padding:1.2rem; border:1px solid var(--line); border-radius:14px; color:var(--ink); background:#fff; text-decoration:none; }
.article-pagination a span { color:var(--brand); font-size:.74rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.article-pagination a:hover { border-color:var(--brand); transform:translateY(-2px); }
.author-box { border:1px solid var(--line); border-radius:1rem; background:#fff; padding:1.5rem; }
.demo-badge { background:#fff1bf; color:#765400; border:1px solid #efd36d; }
.empty-state { border:2px dashed var(--line); border-radius:1rem; padding:3rem; text-align:center; }

.site-footer { margin-top: 0 !important; padding-top: 4.5rem !important; color: #dcebe3; background: #063c30; border-top: 0; }
.site-footer .text-secondary { color: rgba(255,255,255,.64) !important; }
.footer-logo { width:220px; height:auto; padding:0; background:transparent; }
.footer-heading { font-family:inherit; font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; font-weight:850; color:var(--accent); }
.footer-links li { margin:.45rem 0; }
.footer-links a { color:rgba(255,255,255,.72); text-decoration:none; }
.footer-links a:hover { color:#fff; }
.footer-cookie-button { padding:0; border:0; color:rgba(255,255,255,.72); background:transparent; text-align:left; }
.footer-cookie-button:hover { color:#fff; }
.site-footer hr { border-color: rgba(255,255,255,.18); }
.site-footer .btn-outline-brand { border-color: var(--accent); color: var(--accent); }
.crafted-by { display:inline-flex; align-items:center; flex-wrap:wrap; gap:.28rem; }
.crafted-by a { color:#fff; font-weight:800; text-decoration:none; border-bottom:1px solid rgba(185,240,107,.65); }
.crafted-by a:hover { color:var(--accent); }
.heart-beat { display:inline-block; color:#ff5b70; font-size:1rem; filter:drop-shadow(0 0 6px rgba(255,91,112,.45)); animation:heartBeat 1.15s ease-in-out infinite; }
.heart-beat .ui-icon { width:15px; height:15px; fill:currentColor; stroke:currentColor; }

.back-to-top { position:fixed; z-index:1035; right:24px; bottom:24px; width:48px; height:48px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.4); border-radius:50%; color:#fff; background:rgba(4,79,59,.94); box-shadow:0 12px 35px rgba(2,48,38,.3); opacity:0; visibility:hidden; transform:translateY(14px) scale(.9); transition:opacity .25s ease,transform .25s ease,visibility .25s; backdrop-filter:blur(8px); }
.back-to-top.show { opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.back-to-top:hover { background:var(--brand); transform:translateY(-3px) scale(1.04); }
.back-to-top span { font-size:1.35rem; line-height:1; }
.back-to-top .ui-icon { width:21px; height:21px; }

.mobile-bottom-bar { position:fixed !important; z-index:1030; inset-inline:max(10px,env(safe-area-inset-left)) max(10px,env(safe-area-inset-right)); bottom:max(10px,env(safe-area-inset-bottom)); width:auto; min-height:66px; display:none; grid-template-columns:repeat(4,minmax(0,1fr)); box-sizing:border-box; padding:7px 6px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 14px 45px rgba(2,50,39,.22); transform:translate3d(0,0,0); will-change:transform; contain:layout paint; transition:opacity .25s ease,visibility .25s ease,transform .25s ease; }
body:has(.mobile-menu.show) .mobile-bottom-bar,
body.mobile-menu-open .mobile-bottom-bar { opacity:0; visibility:hidden; pointer-events:none; transform:translateY(14px); }
.mobile-bottom-bar a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; border-radius:14px; color:#71827c; text-decoration:none; font-size:.62rem; font-weight:750; }
.mobile-bottom-bar a.active { color:var(--brand-dark); background:var(--soft); }
.mobile-bottom-bar svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.reading-progress { position:fixed; z-index:1090; top:0; left:0; width:100%; height:4px; transform:scaleX(0); transform-origin:left center; background:linear-gradient(90deg,var(--accent),var(--brand)); box-shadow:0 1px 8px rgba(22,133,82,.35); }
.reveal-on-scroll { opacity:0; transform:translateY(28px); transition:opacity .7s ease var(--reveal-delay,0ms),transform .7s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms); }
.reveal-on-scroll.is-visible { opacity:1; transform:translateY(0); }

.contact-email-card { position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:center; background:linear-gradient(145deg,#e9f6ef,#fff); }
.contact-email-card::after { content:"@"; position:absolute; right:-18px; bottom:-70px; color:rgba(22,133,82,.075); font-size:13rem; font-weight:900; line-height:1; }
.contact-email-link { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; padding:1rem 1.15rem; border-radius:12px; color:#fff; background:var(--brand-dark); text-decoration:none; font-weight:800; word-break:break-word; }
.contact-email-link:hover { color:var(--accent); background:var(--brand-deep); }
.advanced-search .form-label { margin-bottom:.35rem; color:var(--muted); font-size:.76rem; font-weight:800; }
.saved-article { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; padding:1.3rem; border:1px solid var(--line); border-radius:14px; background:#fff; }
.saved-article h2 a { color:var(--ink); text-decoration:none; }
.saved-article button { width:40px; height:40px; flex:0 0 auto; border:1px solid var(--line); border-radius:50%; color:var(--muted); background:transparent; font-size:1.4rem; }
.cookie-banner { position:fixed; z-index:1100; right:20px; bottom:20px; left:20px; max-width:980px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1rem 1.15rem; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 20px 65px rgba(2,48,38,.24); }
.cookie-banner[hidden] { display:none; }
.cookie-banner p { margin:.25rem 0 0; color:var(--muted); font-size:.86rem; }
.cookie-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:.4rem; flex:0 0 auto; }
.preference-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }
.preference-row:last-child { border-bottom:0; }
.preference-row p { margin:.25rem 0 0; color:var(--muted); font-size:.85rem; }
.site-toast { position:fixed; z-index:1200; left:50%; bottom:100px; max-width:calc(100% - 32px); padding:.75rem 1rem; border-radius:999px; color:#fff; background:var(--brand-deep); box-shadow:0 12px 35px rgba(0,0,0,.22); opacity:0; visibility:hidden; transform:translate(-50%,12px); transition:.2s ease; }
.site-toast.show { opacity:1; visibility:visible; transform:translate(-50%,0); }
.media-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:1rem; }
.media-item { overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fff; }
.media-item img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.media-item-body { padding:.8rem; }

[data-theme="dark"] { color-scheme:dark; --ink:#eaf6ef; --muted:#a9bbb2; --paper:#081c18; --soft:#102d26; --line:#28473e; }
[data-theme="dark"] body { background:var(--paper); color:var(--ink); }
[data-theme="dark"] .site-header,[data-theme="dark"] .site-header.is-scrolled { background:rgba(8,28,24,.96) !important; }
[data-theme="dark"] .navbar .nav-link,[data-theme="dark"] .site-tool-button,[data-theme="dark"] .mobile-menu-links > a,[data-theme="dark"] .mobile-topic-toggle { color:var(--ink); }
[data-theme="dark"] .mobile-menu,[data-theme="dark"] .mobile-bottom-bar,[data-theme="dark"] .card,[data-theme="dark"] .search-box,[data-theme="dark"] .article-toolbar,[data-theme="dark"] .article-pagination a,[data-theme="dark"] .saved-article,[data-theme="dark"] .contact-card,[data-theme="dark"] .modal-content { background:#0d2721; color:var(--ink); }
[data-theme="dark"] .editorial-section,[data-theme="dark"] .approach-section,[data-theme="dark"] .latest-section,[data-theme="dark"] .bg-white { background:#0a211c !important; }
[data-theme="dark"] .topic-card:not(.topic-card-2) { color:#092f2a; }
[data-theme="dark"] .page-hero { background:linear-gradient(180deg,#12352c,transparent); }
[data-theme="dark"] .text-body,[data-theme="dark"] .article-body,[data-theme="dark"] .article-toc a,[data-theme="dark"] .saved-article h2 a { color:var(--ink) !important; }
[data-theme="dark"] .text-secondary { color:var(--muted) !important; }
[data-theme="dark"] .form-control,[data-theme="dark"] .form-select,[data-theme="dark"] .mobile-menu-search { color:var(--ink); background:#0a211c; border-color:var(--line); }
[data-theme="dark"] .form-control::placeholder { color:#82978d; }
[data-theme="dark"] .references,[data-theme="dark"] .article-toc { background:#102d26; }
[data-theme="dark"] .btn-close { filter:invert(1); }

@keyframes heartBeat { 0%,100%{transform:scale(1)} 12%{transform:scale(1.28)} 24%{transform:scale(1)} 36%{transform:scale(1.18)} 48%{transform:scale(1)} }
@keyframes solarGlow { 0%,100%{opacity:.55;transform:scale(.92)} 50%{opacity:1;transform:scale(1.08)} }

.page-link { color:var(--brand-dark); }
.page-item.active .page-link { background:var(--brand); border-color:var(--brand); }
.form-control:focus,.form-select:focus { border-color:var(--brand); box-shadow:0 0 0 .25rem rgba(22,133,82,.14); }
.contact-card { background:#fff; border:1px solid var(--line); border-radius:1rem; padding:2rem; }
.breadcrumb { --bs-breadcrumb-divider-color:#8b9a91; }

.admin-body { background:#f4f6f2; }
.admin-sidebar { background:#1d4c36; min-height:100vh; }
.admin-sidebar .nav-link { color:#dce8dd; border-radius:.6rem; }
.admin-sidebar .nav-link:hover,.admin-sidebar .nav-link.active { background:#396a4a; color:#fff; }
.editor-toolbar { background:#f2f5f0; border:1px solid #ced7cb; border-bottom:0; border-radius:.5rem .5rem 0 0; padding:.5rem; }
.editor-surface { min-height:320px; background:#fff; border:1px solid #ced7cb; border-radius:0 0 .5rem .5rem; padding:1rem; outline:none; }
.editor-surface:focus { border-color:var(--brand); box-shadow:0 0 0 .25rem rgba(22,133,82,.12); }

@media (max-width: 1199.98px) {
  .topic-card { min-height: 220px; }
}

@media (max-width: 991.98px) {
  body { padding-bottom:calc(86px + env(safe-area-inset-bottom)); }
  body:not(.admin-body) > main { padding-top:69px; }
  .site-header { position:fixed !important; top:0; right:0; left:0; z-index:1040; width:100%; }
  .mobile-bottom-bar { display:grid !important; }
  .back-to-top { right:16px; bottom:92px; }
  .site-footer { padding-bottom:7rem !important; }
  .site-header .navbar { min-height: 68px; }
  .navbar-brand img { width:165px; }
  .navbar-collapse { padding:1rem 0 1.25rem; }
  .navbar .nav-link::after { display:none; }
  .hero { min-height: 570px; background-position: 62% center; }
  .hero-shade { background:linear-gradient(90deg,rgba(2,48,38,.96),rgba(3,57,43,.78) 60%,rgba(0,0,0,.18)); }
  .hero-copy { padding:4rem 0 6.5rem; }
  .topic-gateway { margin-top:-46px; }
  .section-space { padding:4.5rem 0; }
  .editorial-visual { min-height:360px; }
  .impact-item:nth-child(2) { border-right:0; }
  .impact-item:nth-child(-n+2) { border-bottom:1px solid rgba(255,255,255,.17); }
  .admin-sidebar { min-height:auto; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal-on-scroll { opacity:1; transform:none; }
}

@media (max-width: 575.98px) {
  .navbar-brand img { width:148px; }
  .hero { min-height:590px; background-position:67% center; }
  .hero-shade { background:linear-gradient(90deg,rgba(2,47,37,.97),rgba(3,57,43,.86) 72%,rgba(0,0,0,.3)); }
  .hero-copy { padding:3.5rem 0 7rem; }
  .hero h1 { font-size:2.85rem; }
  .hero-intro { font-size:.98rem; }
  .topic-gateway { margin-top:-54px; padding-bottom:1.5rem; }
  .topic-card { min-height:205px; }
  .section-space { padding:3.75rem 0; }
  .section-title { font-size:2.35rem; }
  .editorial-section .row { --bs-gutter-x: 1.5rem; }
  .editorial-visual { min-height:320px; }
  .editorial-note { width:88%; padding:1.25rem; }
  .impact-item { min-height:115px; padding:1rem .5rem; }
  .article-title { font-size:2.45rem; }
  .article-body { font-size:1.08rem; }
  .article-toolbar { align-items:stretch; }
  .share-tools { order:3; width:100%; }
  .source-jump { margin-left:0; }
  .article-pagination { grid-template-columns:1fr; }
  .cookie-banner { right:10px; bottom:90px; left:10px; flex-direction:column; align-items:stretch; }
  .cookie-actions { justify-content:flex-start; }
  .btn { min-height:44px; }
}