/* =========================================================
   Intelligence Hub — editorial insight cards
   Category colour-coding echoes the layer-colour system used
   on the Platform page. Cards/heroes use generated cover
   images (assets/images/insights/) with the category gradient
   as a load/fallback background behind the <img>.
   ========================================================= */

/* ---- Shared "cover" treatment (featured + card variants) ---- */
.insight-cover{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:22px;
}
.insight-cover .cover-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}
.insight-cover .mono{
  position:absolute;
  right:-14px;
  bottom:-42px;
  font-family:var(--font-accent);
  font-style:italic;
  font-weight:400;
  font-size:150px;
  line-height:1;
  color:rgba(255,255,255,.32);
  pointer-events:none;
  user-select:none;
}
.insight-cover .cover-badge{
  position:relative;
  z-index:2;
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 15px;
  border-radius:20px;
  background:rgba(255,255,255,.16);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  font-family:var(--font-label);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:#fff;
  border:1px solid rgba(255,255,255,.25);
}

/* ---- Category coding (mirrors .layer-green/blue/orange/purple on Platform) ---- */
.cat-featured{ background:linear-gradient(135deg,#123a28,#0a1f15 70%); }
.cat-satellite{ background:linear-gradient(135deg,#3f8cff,#1c56b8); }
.cat-climate{ background:linear-gradient(135deg,#d58b18,#9c630c); }
.cat-ai{ background:linear-gradient(135deg,#b05cff,#7328c4); }
.cat-predictive{ background:linear-gradient(135deg,#22A07A,#0f5c35); }
.cat-data{ background:linear-gradient(135deg,#55e3c0,#0f766e); }
.cat-field{ background:linear-gradient(135deg,#0F5132,#081f14); }

/* ---- Photographic cover (Featured Insight banner) ---- */
.insight-cover.has-photo{
  background-size:cover;
  background-position:center;
}
.insight-cover.has-photo::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(5,10,8,.8) 0%, rgba(5,10,8,.32) 55%, rgba(5,10,8,.08) 100%);
  z-index:1;
}
.insight-cover.has-photo .cover-badge{ position:relative; z-index:2; }

.cat-text-satellite{ color:#3f8cff; }
.cat-text-climate{ color:#c17d13; }
.cat-text-ai{ color:#a13ef2; }
.cat-text-predictive{ color:var(--green-600); }
.cat-text-data{ color:#159c85; }
.cat-text-field{ color:var(--green-800); }

/* ---- Featured insight ---- */
.featured-insight{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  background:#fff;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-card);
}
.featured-insight .insight-cover{ min-height:380px; padding:32px; }
.featured-insight .insight-cover .mono{ font-size:230px; right:-20px; bottom:-60px; }
.featured-insight-body{
  padding:48px 46px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.featured-insight-body .eyebrow{ margin-bottom:16px; }
.featured-insight-body h2{
  font-family:var(--font-heading);
  font-size:clamp(23px,2.6vw,30px);
  font-weight:700;
  line-height:1.28;
  color:var(--ink);
  margin-bottom:16px;
}
.featured-insight-body p{
  font-size:15px;
  line-height:1.8;
  color:var(--text-body);
  margin-bottom:24px;
}
.insight-byline{
  font-family:var(--font-label);
  font-size:12.5px;
  color:#8a9198;
  padding-top:18px;
  margin-bottom:22px;
  border-top:1px solid var(--border-soft);
}
.insight-byline strong{ color:var(--dark-800); font-weight:700; }

/* ---- Latest insights grid ---- */
.insight-card{
  display:block;
  background:#fff;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-soft);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.insight-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-card); }
.insight-card .insight-cover{ min-height:140px; padding:18px; }
.insight-card .insight-cover .mono{ font-size:100px; right:-8px; bottom:-24px; }
.insight-card-body{ padding:26px; }
.insight-cat{
  display:block;
  font-family:var(--font-label);
  font-size:11px;
  font-weight:700;
  letter-spacing:1.2px;
  text-transform:uppercase;
  margin-bottom:12px;
}
.insight-card-body h3{
  font-size:16.5px;
  font-weight:700;
  line-height:1.42;
  color:var(--ink);
  margin-bottom:10px;
}
.insight-card-body p{
  font-size:13.5px;
  line-height:1.68;
  color:var(--text-body);
  margin-bottom:18px;
}

/* ---- Shared "read more" text link (used by cards + papers) ---- */
.insight-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--font-label);
  font-weight:700;
  font-size:13px;
  color:var(--green-800);
  border:none;
  border-bottom:2px solid var(--green-800);
  padding:0 0 2px;
  background:none;
  cursor:pointer;
  transition:gap .25s;
}
.insight-link:hover{ gap:14px; }

/* ---- Research & white papers ---- */
.paper-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.paper-card{
  background:#fff;
  border-radius:var(--radius-md);
  padding:30px;
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-soft);
  display:flex;
  flex-direction:column;
  height:100%;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.paper-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-card); }
.paper-icon{
  width:44px; height:44px;
  border-radius:12px;
  background:var(--bg-mint-tint);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:20px;
  color:var(--green-800);
}
.paper-icon svg{ width:20px; height:20px; }
.paper-type{
  display:block;
  font-family:var(--font-label);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--green-600);
  margin-bottom:12px;
}
.paper-card h3{
  font-size:17.5px;
  font-weight:700;
  line-height:1.38;
  color:var(--ink);
  margin-bottom:12px;
}
.paper-card p{
  font-size:13.5px;
  line-height:1.72;
  color:var(--text-body);
  margin-bottom:22px;
  flex:1;
}

@media (max-width:900px){
  .featured-insight{ grid-template-columns:1fr; }
  .featured-insight .insight-cover{ min-height:220px; }
  .featured-insight-body{ padding:34px 26px; }
  .paper-grid{ grid-template-columns:1fr; }
}

/* ---- Article template preview notice ---- */
.template-notice{
  display:flex;
  align-items:center;
  gap:12px;
  background:var(--bg-mint-tint);
  border:1px dashed rgba(15,81,50,.3);
  border-radius:var(--radius-sm);
  padding:14px 18px;
  font-size:13px;
  color:var(--green-800);
  margin-bottom:36px;
}
.template-notice strong{ font-weight:700; }

/* ---- Article body prose ---- */
.article-body{ max-width:760px; margin:0 auto; }
.article-body p{ font-size:16px; line-height:1.9; color:var(--text-body); margin-bottom:22px; }
.article-body h3{ font-size:20px; font-weight:700; color:var(--ink); margin:36px 0 16px; }
.article-body p a,
.article-body .in-article-link{
  color:var(--green-800);
  text-decoration:underline;
  text-decoration-color:rgba(15,81,50,.35);
  text-underline-offset:2px;
  font-weight:600;
}
.article-body p a:hover,
.article-body .in-article-link:hover{ text-decoration-color:var(--green-800); }
.article-sources{
  margin-top:44px;
  padding-top:28px;
  border-top:1px solid var(--border-soft);
}
.article-sources h3{ margin-top:0; margin-bottom:16px; }
.article-sources ol{
  margin:0;
  padding-left:20px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.article-sources li{
  font-size:13.5px;
  line-height:1.75;
  color:var(--text-body);
}
.article-sources li a{
  color:var(--green-800);
  font-weight:600;
  text-decoration:underline;
  text-decoration-color:rgba(15,81,50,.35);
  text-underline-offset:2px;
}
.article-sources li a:hover{ text-decoration-color:var(--green-800); }
.article-back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--font-label);
  font-size:13px;
  font-weight:700;
  color:var(--green-800);
  margin-bottom:30px;
}
.article-back:hover{ gap:12px; }
.article-hero .insight-cover{ min-height:260px; padding:40px; align-items:flex-start; justify-content:flex-end; }
.article-hero .insight-cover .mono{ font-size:200px; }
.article-hero h1{
  position:relative; z-index:2;
  font-family:var(--font-heading);
  font-size:clamp(26px,3.4vw,40px);
  font-weight:700;
  color:#fff;
  line-height:1.2;
  margin-top:14px;
  max-width:820px;
}
