.page-body-news .public-news-home{
  --c2o2-deep:#0a1f2e;
  --c2o2-navy:#0e2d42;
  --c2o2-blue:#1a5276;
  --c2o2-teal:#1abc9c;
  --c2o2-green:#27ae60;
  --text-primary:#0d1f2d;
  --text-secondary:#2c4a5e;
  --text-muted:#5f8096;
  --border:rgba(26,82,118,.15);
  --blue:#1a5276;
  --sky:#2980b9;
  --green:#27ae60;
    --gold: #f1c40f;
  --light:#e8f4f8;
  --white:#f5f9fb;
    --text: #ecf0f1;
  --text2:#2c4a5e;
      --text-dim: #bdc3c7;
  --muted:#5f8096;
    --serif: 'Cormorant Garamond', Georgia, serif;
  --sans:'Barlow',sans-serif;
    --cond: 'Barlow Condensed', sans-serif;
  --deep: #0a1f2e;
}

html{scroll-behavior:smooth}
body{font-family:'Barlow',sans-serif;background:var(--white);color:var(--text);overflow-x:hidden}

/* PROGRESS BAR */
#progress-bar{
  position:fixed;top:0;left:0;height:3px;width:0%;
  background:linear-gradient(90deg,var(--teal),var(--green));
  z-index:1000;transition:width 0.1s linear;
}

/* PARTICLE BG */
#particle-canvas{
  position:fixed;top:0;left:0;width:100%;height:100%;
  pointer-events:none;z-index:0;opacity:0.28;
}

.page-body-news .hero{
  position:relative;
  background:linear-gradient(160deg,var(--c2o2-deep) 0%,var(--c2o2-navy) 40%,#0d3d2f 100%);
  min-height:280px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:10% 8%;
  overflow:hidden;
  margin-bottom:0;
  z-index:1;
}

.page-body-news .hero-kicker{
  font-size:13px;
  letter-spacing:.35em;
  color:var(--c2o2-teal);
  text-transform:uppercase;
  margin-bottom:12px;
}

.page-body-news .hero-title{
  font-size:clamp(36px,7vw,72px);
  font-weight:400;
  color:#fff;
  line-height:1;
  margin:0;
}

.page-body-news .hero-title span{ color:var(--c2o2-teal); }
.page-body-news .hero-subtitle{ color:rgba(255,255,255,.6); margin-top:10px; margin-bottom:0; }
.page-body-news .hero-line{ width:100%; height:3px; margin-top:22px; background:linear-gradient(90deg,var(--c2o2-teal),var(--c2o2-green),transparent); }

.page-body-news .ticker-wrap{ background:var(--c2o2-deep); border-bottom:1px solid rgba(26,188,156,.2); overflow:hidden; height:40px; display:flex; align-items:center;padding: 0px 5%; position:relative; z-index:2;}

.page-body-news .ticker-label{ background:var(--c2o2-teal); color:var(--c2o2-deep); font-size:11px; font-weight:700; letter-spacing:.15em; padding:0 14px; height:100%; display:flex; align-items:center; white-space:nowrap; }
.page-body-news .ticker-track-wrap{ overflow:hidden; flex:1; }
.page-body-news .ticker-track{ display:flex; gap:40px; white-space:nowrap; padding-left:16px; animation:ticker-slide 45s linear infinite; }
.page-body-news .ticker-item{ font-size:13px; color:rgba(255,255,255,.7); letter-spacing:.03em; }
.page-body-news .ticker-item strong{ color:var(--c2o2-teal); font-weight:600; }
@keyframes ticker-slide{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/*.page-body-news .page-wrap{ max-width:1280px; margin:0 auto; padding:0 24px; }*/
.page-body-news .page-wrap{ max-width:1280px; margin:0 auto; padding:0 24px; position:relative; z-index:2; }
.page-body-news .featured-section{ padding:48px 0 24px; }
.page-body-news .section-label{ display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.page-body-news .section-label:before{ content:""; display:block; width:28px; height:2px; background:var(--c2o2-teal); }
.page-body-news .section-label span{ font-size:12px; font-weight:700; letter-spacing:.25em; color:var(--c2o2-teal); text-transform:uppercase; }

.page-body-news .featured-card{
     display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    background: #fff;
    border: 1px solid var(--border);
    overflow: hidden;
    box-shadow: 0 4px 40px rgba(10,31,46,0.08);
    transition: box-shadow 0.4s ease, transform 0.4s ease;
    text-decoration: none;
    color: inherit;
    opacity: 0;
    transform: translateY(24px);
    animation: card-appear 0.7s 0.2s ease forwards;
  }
  .page-body-news .featured-card:hover {
    box-shadow: 0 12px 60px rgba(10,31,46,0.15);
    transform: translateY(-3px);
  }
  .page-body-news .featured-img {
    position: relative;
    overflow: hidden;
    min-height: 420px;
  }

    .page-body-news .featured-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s ease;
  }
.page-body-news .featured-img-overlay{ position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(26,188,156,0.25) 0%, transparent 50%);
  pointer-events: none;}
.page-body-news .featured-img-badge{ position: absolute;
  top: 24px;
  left: 24px;
  background: var(--c2o2-teal);
  color: var(--c2o2-deep);
  font-family: var(--font-cond);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 6px 14px; 
    
}
.page-body-news .featured-body{ padding:40px 34px; background:var(--c2o2-deep); color:#fff; }
.page-body-news .article-category{ font-size:12px; font-weight:600; letter-spacing:.2em; color:var(--c2o2-teal); text-transform:uppercase; margin-bottom:14px; }
.page-body-news .featured-title{ color:#fff; font-size:clamp(24px,3vw,38px); margin:0 0 14px; line-height:1.2; }
.page-body-news .featured-excerpt{ color:rgba(255,255,255,.7); margin-bottom:20px; line-height:1.6; }
.page-body-news .read-more{ color:var(--c2o2-teal); font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }

.page-body-news .section-divider{ display:flex; align-items:center; gap:16px; margin:8px 0 30px; }
.page-body-news .section-divider:before,.page-body-news .section-divider:after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,transparent,var(--border),transparent); }
.page-body-news .section-divider-icon{ width:34px; height:34px; border:1px solid var(--border); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--c2o2-teal); font-weight:700; }

.page-body-news .news-grid-section{ padding:0 0 52px; }
.page-body-news .news-home-grid-items{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.page-body-news .news-card{ display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.35s ease, transform 0.35s ease;
  opacity: 0;
  transform: translateY(30px); }
.page-body-news .news-card:hover {
  box-shadow: 0 8px 40px rgba(10,31,46,0.12);
  transform: translateY(-4px);
}
.news-card.visible {
    animation: card-appear 0.6s ease forwards;
  }
  .news-card:nth-child(2) { animation-delay: 0.1s; }
  .news-card:nth-child(3) { animation-delay: 0.2s; }
  .news-card:nth-child(4) { animation-delay: 0.3s; }

  @keyframes card-appear {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
  }
.page-body-news .news-img{ height:210px; position:relative; overflow:hidden; }
.page-body-news .news-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.page-body-news .news-img-overlay{ position:absolute; inset:0; background:linear-gradient(to top,rgba(10,31,46,.38) 0%,transparent 60%); }
.page-body-news .news-body{ padding:22px; display:flex; flex-direction:column; flex:1; }
.page-body-news .news-meta{ display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.page-body-news .news-tag{ font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--c2o2-teal); border-left:2px solid var(--c2o2-teal); padding-left:8px; }
.page-body-news .news-date{ font-size:13px; color:var(--text-muted); }
.page-body-news .news-title{ font-size:22px; color:var(--text-primary); margin:0 0 10px; line-height:1.3; }
.page-body-news .news-excerpt{ color:var(--text-secondary); margin-bottom:16px; line-height:1.65; flex:1; }
.page-body-news .news-link{ font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--c2o2-blue); margin-top:auto; }

.page-body-news .co2-strip{ background:linear-gradient(135deg,var(--c2o2-deep) 0%,#0d3d2f 100%); padding:52px 0; }
.page-body-news .co2-strip .co2-strip-label span{ color:rgba(26,188,156,.75); }
.page-body-news .co2-inner{ display:grid; grid-template-columns:repeat(4,1fr); }
.page-body-news .co2-stat{ padding:0 20px; text-align:center; border-right:1px solid rgba(255,255,255,.1); }
.page-body-news .co2-stat:last-child{ border-right:none; }
.page-body-news .co2-num{ font-size:44px; color:var(--c2o2-teal); line-height:1; margin-bottom:8px; }
.page-body-news .co2-label{ font-size:12px; letter-spacing:.2em; color:rgba(255,255,255,.56); text-transform:uppercase; }

.page-body-news .public-news-sidebar{ border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:16px; background:#0b1f30; }
.page-body-news .public-news-sidebar .sidebar-block + .sidebar-block{ margin-top:20px; padding-top:20px; border-top:1px solid rgba(255,255,255,.08); }
.page-body-news .public-news-sidebar .sidebar-label{ font-size:12px; text-transform:uppercase; color:#8bc5df; margin-bottom:8px; letter-spacing:1.2px; }
.page-body-news .public-news-sidebar .cci-price{ font-size:24px; font-weight:700; color:#2ed3b4; }
.page-body-news .public-news-sidebar .related-item{ display:flex; gap:10px; align-items:center; margin-bottom:10px; }
.page-body-news .public-news-sidebar .related-thumb img{ width:64px; height:48px; object-fit:cover; border-radius:8px; }
.page-body-news .public-news-sidebar .related-title{ color:#d9eaf5; font-size:13px; line-height:1.3; }

@media (max-width: 980px){
  .page-body-news .featured-card{ grid-template-columns:1fr; }
  .page-body-news .news-home-grid-items{ grid-template-columns:repeat(2,1fr); }
  .page-body-news .co2-inner{ grid-template-columns:repeat(2,1fr); gap:20px 0; }
  .page-body-news .co2-stat{ border-right:none; }
}

@media (max-width: 640px){
  .page-body-news .hero{ padding:0 18px 34px; min-height:240px; }
  .page-body-news .page-wrap{ padding:0 14px; }
  .page-body-news .news-home-grid-items{ grid-template-columns:1fr; }
  .page-body-news .co2-inner{ grid-template-columns:1fr 1fr; }
}


.news-detail-shell .container{ width:100%; max-width:100%; padding:0; }
.public-news-detail{ position:relative; z-index:1; background:#f5f9fb; color:#0d1f2d; }
.public-news-detail #progress-bar{ position:fixed; top:0; left:0; height:3px; width:0; background:linear-gradient(90deg,#1abc9c,#27ae60); z-index:1000; }
.public-news-detail #particle-canvas{ position:fixed; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:0; opacity:.28; }
.public-news-detail .back-nav{ position:sticky; top:0; z-index:50; background:rgba(10,31,46,.96); backdrop-filter:blur(12px); border-bottom:1px solid rgba(26,188,156,.15); padding:1% 15% 2% 15%; height:52px; display:flex; align-items:center; justify-content:space-between; }
.public-news-detail .back-btn,.public-news-detail .nav-logo,.public-news-detail .share-btn{ font-family:'Barlow Condensed', sans-serif; letter-spacing:.15em; text-transform:uppercase; text-decoration:none; }
.public-news-detail .back-btn{ color:rgba(255,255,255,.65); font-size:12px; }
.public-news-detail .nav-logo{ display: none; }
.public-news-detail .share-btn{ background:none; border:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.5); padding:5px 12px; font-size:11px; cursor:pointer; }
.public-news-detail .article-hero{ position:relative; min-height:500px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; z-index:1;padding: 10% 5%; }
.c2o2-article-en {
  background-color: #f5f9fb;
}
.public-news-detail .hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center;transition: transform 8s ease; }
.public-news-detail .hero-overlay{ position:absolute; inset:0; background:linear-gradient(to top,rgba(10,31,46,.97) 0%,rgba(10,31,46,.65) 50%,rgba(10,31,46,.2) 100%); }
.public-news-detail .hero-content{ position:relative; z-index:2; padding:0 5vw 56px; max-width:920px; }
.public-news-detail .hero-kicker{ display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.public-news-detail .hero-tag{ color:#0a1f2e; background:#1abc9c; padding:5px 12px; font-size:11px; letter-spacing:.2em; text-transform:uppercase; }
.public-news-detail .hero-date,.public-news-detail .hero-read-time{ color:rgba(255,255,255,.52); font-size:12px; }
.public-news-detail .hero-divider{ width:34px; height:1px; background:rgba(255,255,255,.2); }
.public-news-detail .article-title{ 
  font-family: 'Cormorant Garamond',Georgia,serif;
  font-size: clamp(32px,5.5vw,68px);
  font-weight: 300;
  color: #fff;
  line-height: 1.1;
  letter-spacing: -0.015em;
  margin-bottom: 24px;
  opacity: 0;
  animation: fade-up 0.7s 0.25s ease forwards; 
}
.public-news-detail .article-lead{ color:rgba(255,255,255,.67); font-size:20px; line-height:1.65; max-width:700px; }
.public-news-detail .article-layout{ display:grid; grid-template-columns:1fr 300px; max-width:1160px; margin:0 auto; padding:0 5vw; position:relative; z-index:2; }
.public-news-detail .article-body{ padding:56px 56px 70px 0; border-right:1px solid rgba(26,82,118,.13); }
.public-news-detail .article-body p{ font-size:18px; line-height:1.85; color:#2c4a5e; margin-bottom:22px; }
.public-news-detail .article-body h2{ font-size:32px; margin:46px 0 16px; border-left:3px solid #1abc9c; padding-left:18px; }
.public-news-detail .article-body h3{ font-size:16px; letter-spacing:.11em; text-transform:uppercase; color:#1a5276; margin:34px 0 12px; }
.public-news-detail .pullquote{ margin:40px 0; padding:28px 34px; background:linear-gradient(135deg,rgba(26,188,156,.06),rgba(26,82,118,.04)); }
.public-news-detail .stat-box{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(26,82,118,.13); margin:36px 0; border:1px solid rgba(26,82,118,.13); }
.public-news-detail .stat-item{ background:#f5f9fb; padding:24px 18px; text-align:center; }
.public-news-detail .stat-num{ color:#1abc9c; font-size:36px; line-height:1; margin-bottom:4px; }
.public-news-detail .article-cta{ display:flex; align-items:center; justify-content:space-between; gap:20px; background:linear-gradient(135deg,#0a1f2e,#0d3d2f); padding:36px 40px; margin:44px 0 0; }
.public-news-detail .cta-text h4{ color:#fff; margin:0 0 8px; font-size:26px; }
.public-news-detail .cta-text p{ color:rgba(255,255,255,.58); margin:0; }
.public-news-detail .cta-btn{ background:#1abc9c; color:#0a1f2e; padding:12px 24px; text-decoration:none; letter-spacing:.14em; text-transform:uppercase; font-size:12px; font-weight:700; }
.public-news-detail .article-sidebar{ padding:56px 0 70px 42px; }
.public-news-detail .sidebar-sticky{ position:sticky; top:72px; }
.public-news-detail .sidebar-block{ margin-bottom:42px; }
.public-news-detail .sidebar-label{ font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:#1abc9c; border-bottom:1px solid rgba(26,82,118,.13); padding-bottom:10px; margin-bottom:16px; }
.public-news-detail .related-item{ display:flex; gap:12px; text-decoration:none; color:inherit; padding:12px 0; border-bottom:1px solid rgba(26,82,118,.13); }
.public-news-detail .related-thumb img{ width:64px; height:56px; object-fit:cover; }
.public-news-detail .related-title{ color:#0d1f2d; font-size:15px; line-height:1.3; display:block; margin-bottom:3px; }
.public-news-detail .related-tag{ color:#1abc9c; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.public-news-detail .cci-widget{ background:#0a1f2e; padding:22px; }
.public-news-detail .cci-price{ color:#1abc9c; font-size:44px; line-height:1; }
.public-news-detail .cci-change{ color:#27ae60; margin-top:4px; font-size:13px; }
.public-news-detail .cci-label{ color:rgba(255,255,255,.36); font-size:10px; letter-spacing:.18em; text-transform:uppercase; }
.public-news-detail .tags-wrap{ display:flex; flex-wrap:wrap; gap:8px; }
.public-news-detail .tag{ font-size:11px; text-transform:uppercase; border:1px solid rgba(26,82,118,.13); padding:5px 10px; letter-spacing:.12em; }
.public-news-detail .mission-text{ font-size:14px; color:#2c4a5e; line-height:1.7; }
.public-news-detail .mission-link{ color:#1abc9c; font-size:11px; letter-spacing:.2em; text-transform:uppercase; text-decoration:none; }
.public-news-detail .article-nav-bar{ background:#0a1f2e; display:grid; grid-template-columns:1fr 1fr; }
.public-news-detail .nav-article{ padding:30px 5vw; text-decoration:none; display:block; border-top:1px solid rgba(255,255,255,.08); }
.public-news-detail .nav-article-disabled{ opacity:.35; cursor:default; }
.public-news-detail .nav-dir{ color:rgba(255,255,255,.35); font-size:11px; letter-spacing:.22em; text-transform:uppercase; margin-bottom:8px; }
.public-news-detail .nav-article-title{ color:rgba(255,255,255,.86); font-size:18px; line-height:1.3; }
@media(max-width:900px){
  .public-news-detail .article-layout{ grid-template-columns:1fr; }
  .public-news-detail .article-body{ padding:46px 0 46px; border-right:none; border-bottom:1px solid rgba(26,82,118,.13); }
  .public-news-detail .article-sidebar{ padding:36px 0; }
  .public-news-detail .sidebar-sticky{ position:static; }
  .public-news-detail .stat-box{ grid-template-columns:1fr; }
}



/*animations*/
.page-body-news .hero-molecule{
  position:absolute;
  top:20px;
  right:6vw;
  opacity:.12;
  animation:rotate-slow 40s linear infinite;
}
@keyframes rotate-slow{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}

.page-body-news #particle-canvas{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
  opacity:.35;
}
.page-body-news .float-leaves{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
  overflow:hidden;
}
.page-body-news .leaf{
  position:absolute;
  width:8px;
  height:8px;
  border-radius:0 50% 0 50%;
  background:var(--c2o2-teal);
  opacity:0;
  animation:leaf-fall linear infinite;
}
@keyframes leaf-fall{
  0%{ opacity:0; transform:translateY(-20px) rotate(0deg); }
  10%{ opacity:.15; }
  90%{ opacity:.05; }
  100%{ opacity:0; transform:translateY(100vh) rotate(360deg); }
}
@keyframes fade-up{
  from{opacity:0;transform:translateY(22px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes load-in{from{width:0}to{width:100%}}

/* ── BACK NAV ─────────────────────────────────────────────────────────── */
.back-btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--cond); font-size: 12px; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.6); text-decoration: none;
  transition: color 0.3s;
}
.back-btn:hover { color: var(--teal); }
.back-btn svg { transition: transform 0.3s; }
.back-btn:hover svg { transform: translateX(-3px); }

.nav-logo {
  font-family: var(--cond); font-size: 14px; font-weight: 700;
  letter-spacing: 0.18em; color: var(--teal); text-decoration: none;
}
.nav-share {
  display: flex; align-items: center; gap: 12px;
}
.share-btn {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--cond); font-size: 11px; font-weight: 600;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(255,255,255,0.45); border: 1px solid rgba(255,255,255,0.12);
  padding: 5px 14px; cursor: pointer; background: none;
  transition: all 0.3s;
}
.share-btn:hover { color: var(--teal); border-color: rgba(26,188,156,0.4); }

/* ── HERO ─────────────────────────────────────────────────────────────── */
.article-hero:hover .hero-bg { transform: scale(1.03); }

.hero-content {
  position: relative; z-index: 2;
  padding: 0 5vw 64px;
  max-width: 900px;
}
.hero-kicker {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 24px;
  opacity: 0; animation: fade-up 0.7s 0.1s ease forwards;
}
.hero-tag {
  font-family: var(--cond); font-size: 11px; font-weight: 700;
  letter-spacing: 0.25em; text-transform: uppercase;
  color: var(--deep); background: var(--teal);
  padding: 5px 14px;
}
.hero-date {
  font-family: var(--cond); font-size: 12px; font-weight: 400;
  letter-spacing: 0.1em; color: rgba(255,255,255,0.45);
}
.hero-divider { width: 40px; height: 1px; background: rgba(255,255,255,0.2); }
.hero-read-time {
  font-family: var(--cond); font-size: 12px; color: rgba(255,255,255,0.4);
  letter-spacing: 0.05em;
}
.article-lead {
  font-size: clamp(17px,2vw,21px); font-weight: 300;
  color: rgba(255,255,255,0.65); line-height: 1.65;
  max-width: 680px;
  opacity: 0; animation: fade-up 0.7s 0.4s ease forwards;
}
.article-title em { color: var(--teal); font-style: normal; font-weight: 400; }

/* ── ARTICLE LAYOUT ───────────────────────────────────────────────────── */
.article-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 0;
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5vw;
  position: relative; z-index: 2;
}

/* ── ARTICLE BODY ─────────────────────────────────────────────────────── */
.article-body {
  padding: 64px 64px 80px 0;
  border-right: 1px solid var(--border);
}
.article-section {
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.article-section.visible { opacity: 1; transform: translateY(0); }

.article-body h2 {
  font-family: var(--serif); font-size: clamp(24px,3vw,34px); font-weight: 400;
  color: var(--deep); line-height: 1.25;
  margin: 52px 0 20px; letter-spacing: -0.01em;
  padding-left: 20px;
  border-left: 3px solid var(--teal);
}
.article-body h3 {
  font-family: var(--cond); font-size: 16px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--blue); margin: 36px 0 14px;
}
.article-body p {
  font-size: 18px; font-weight: 300; line-height: 1.85;
  color: var(--text2); margin-bottom: 24px;
}
.article-body strong { color: var(--text); font-weight: 600; }
.article-body em { font-style: italic; color: var(--muted); }
.article-body a {
  color: var(--sky); text-decoration: none;
  border-bottom: 1px solid rgba(41,128,185,0.3);
  transition: border-color 0.3s, color 0.3s;
}
.article-body a:hover { color: var(--teal); border-color: var(--teal); }

/* ── PULLQUOTE ────────────────────────────────────────────────────────── */
.pullquote, .highlight-quote {
  position: relative;
  margin: 48px 0;
  padding: 32px 40px 32px 56px;
  background: linear-gradient(135deg,rgba(26,188,156,0.06),rgba(26,82,118,0.04));
  border-left: none;
}
.pullquote::before, .highlight-quote::before {
  content: '\201C';
  position: absolute; left: 16px; top: 8px;
  font-family: var(--serif); font-size: 72px; font-weight: 300;
  color: var(--teal); line-height: 1;
  opacity: 0.6;
}
.pullquote p, .highlight-quote p {
  font-family: var(--serif);
  font-size: clamp(20px,2.5vw,26px);
  font-weight: 400; font-style: italic;
  color: var(--deep); line-height: 1.5;
  margin: 0;
}
.pullquote cite, .highlight-quote cite {
  display: block; margin-top: 12px;
  font-family: var(--cond); font-size: 12px; font-weight: 600;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--teal); font-style: normal;
}

/* ── ARTICLE IMAGE ────────────────────────────────────────────────────── */
.article-img-wrap {
  margin: 40px -20px;
  position: relative; overflow: hidden;
}
.article-img-wrap img {
  width: 100%; display: block;
  object-fit: cover; max-height: 440px;
}
.img-caption {
  font-family: var(--cond); font-size: 12px;
  color: var(--muted); letter-spacing: 0.08em;
  margin-top: 10px; padding-left: 4px;
  border-left: 2px solid var(--border);
}

/* ── BULLET LIST ──────────────────────────────────────────────────────── */
.article-body ul {
  list-style: none; margin: 24px 0;
  padding: 0;
}
.article-body ul li {
  font-size: 17px; font-weight: 300; line-height: 1.7;
  color: var(--text2);
  padding: 10px 0 10px 32px;
  border-bottom: 1px solid var(--border);
  position: relative;
}
.article-body ul li::before {
  content: '';
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 8px; height: 8px;
  background: var(--teal);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}
.article-body ul li strong { color: var(--sky); }

/* ── STAT BOX ─────────────────────────────────────────────────────────── */
.stat-box {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 1px; background: var(--border);
  margin: 40px 0; border: 1px solid var(--border);
}
.stat-item {
  background: var(--white);
  padding: 28px 24px; text-align: center;
}
.stat-num {
  font-family: var(--serif); font-size: 40px; font-weight: 300;
  color: var(--teal); line-height: 1; margin-bottom: 6px;
}
.stat-label {
  font-family: var(--cond); font-size: 11px; font-weight: 600;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--muted);
}

/* ── CTA BLOCK ────────────────────────────────────────────────────────── */
.article-cta {
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px;
  background: linear-gradient(135deg,var(--deep),#0d3d2f);
  padding: 40px 44px;
  margin: 52px 0 0;
}
.cta-text h4 {
  font-family: var(--serif); font-size: 26px; font-weight: 400;
  color: #fff; margin-bottom: 8px;
}
.cta-text p {
  font-size: 15px; font-weight: 300; color: rgba(255,255,255,0.55);
  margin: 0; line-height: 1.5;
}
.cta-btn {
  flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--teal); color: var(--deep);
  font-family: var(--cond); font-size: 13px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  padding: 14px 28px; text-decoration: none;
  white-space: nowrap;
  transition: background 0.3s, transform 0.3s;
}
.cta-btn:hover { background: #17a589; transform: translateX(3px); }

/* ── SIDEBAR ──────────────────────────────────────────────────────────── */
.article-sidebar {
  padding: 64px 0 80px 52px;
}
.sidebar-sticky {
  position: sticky; top: 72px;
}
.sidebar-block { margin-bottom: 48px; }
.sidebar-label {
  font-family: var(--cond); font-size: 11px; font-weight: 700;
  letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--teal);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 20px;
}
.related-item {
  display: flex; gap: 14px;
  text-decoration: none; color: inherit;
  padding: 14px 0; border-bottom: 1px solid var(--border);
  transition: opacity 0.3s; cursor: pointer;
}
.related-item:hover { opacity: 0.75; }
.related-thumb {
  width: 64px; height: 56px; flex-shrink: 0; overflow: hidden;
}
.related-thumb img { width: 100%; height: 100%; object-fit: cover; }
.related-title {
  font-family: var(--serif); font-size: 15px; font-weight: 500;
  color: var(--text); line-height: 1.3; margin-bottom: 4px;
}
.related-tag {
  font-family: var(--cond); font-size: 11px; font-weight: 600;
  letter-spacing: 0.15em; color: var(--teal); text-transform: uppercase;
}

/* ── CCI WIDGET ───────────────────────────────────────────────────────── */
.cci-widget {
  background: var(--deep);
  padding: 24px;
}
.cci-price {
  font-family: var(--serif); font-size: 44px; font-weight: 300;
  color: var(--teal); line-height: 1;
}
.cci-change {
  font-family: var(--cond); font-size: 13px; font-weight: 600;
  letter-spacing: 0.1em; margin-top: 4px;
}
.cci-change.up { color: #27ae60; }
.cci-change.down { color: #e74c3c; }
.cci-label {
  font-family: var(--cond); font-size: 10px; letter-spacing: 0.2em;
  color: rgba(255,255,255,0.35); text-transform: uppercase;
  margin-top: 12px;
}

/* ── TAGS ─────────────────────────────────────────────────────────────── */
.tags-wrap { display: flex; flex-wrap: wrap; gap: 8px; }
.tag {
  font-family: var(--cond); font-size: 11px; font-weight: 600;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--text2); border: 1px solid var(--border);
  padding: 5px 12px; cursor: pointer;
  transition: all 0.3s;
}
.tag:hover { background: var(--deep); color: var(--teal); border-color: var(--teal); }

/* ── NEXT / PREV BAR ──────────────────────────────────────────────────── */
.article-nav-bar {
  background: var(--deep);
  display: grid; grid-template-columns: 1fr 1fr;
  position: relative; z-index: 2;
}
.nav-article {
  padding: 36px 5vw;
  display: flex; flex-direction: column; gap: 8px;
  text-decoration: none; cursor: pointer;
  transition: background 0.3s; border-top: 1px solid rgba(255,255,255,0.06);
}
.nav-article:first-child { border-right: 1px solid rgba(255,255,255,0.06); }
.nav-article:hover { background: rgba(26,188,156,0.06); }
.nav-dir {
  font-family: var(--cond); font-size: 11px; font-weight: 700;
  letter-spacing: 0.25em; text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  display: flex; align-items: center; gap: 8px;
}
.nav-article-title {
  font-family: var(--serif); font-size: 18px; font-weight: 400;
  color: rgba(255,255,255,0.8); line-height: 1.3;
}
.nav-article:hover .nav-article-title { color: var(--teal); }

/* ── LOADING SCREEN ───────────────────────────────────────────────────── */
#loading-screen {
  position: fixed; inset: 0;
  background: var(--deep);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  z-index: 999;
  transition: opacity 0.5s ease;
}
.loader-logo {
  font-family: var(--cond); font-size: 22px; font-weight: 700;
  letter-spacing: 0.2em; color: var(--teal);
  margin-bottom: 32px;
}
.loader-bar-wrap {
  width: 200px; height: 2px; background: rgba(255,255,255,0.1);
}
.loader-bar {
  height: 100%; background: linear-gradient(90deg,var(--teal),var(--green));
  animation: load-in 0.8s ease forwards;
}
@keyframes load-in { from { width: 0; } to { width: 100%; } }

/* ── RESPONSIVE ───────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .article-layout { grid-template-columns: 1fr; }
  .article-body { padding: 48px 0 48px; border-right: none; border-bottom: 1px solid var(--border); }
  .article-sidebar { padding: 40px 0; }
  .sidebar-sticky { position: static; }
  .article-cta { flex-direction: column; text-align: center; }
  .stat-box { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .article-hero { min-height: 420px; }
  .article-nav-bar { grid-template-columns: 1fr; }
  .hero-content { padding: 0 24px 48px; }
}