/* Page-specific CSS patches extracted from the original blog.html (inline <style> blocks in <head>).
   Loaded only on this page/template, after the global stylesheets, to preserve exact visual fidelity. */

.blog-page .company-hero { position:relative; overflow:hidden; }
.blog-page .company-hero-bg {
  position:absolute !important;
  inset:0 !important;
  left:auto !important;
  right:0 !important;
  width:56% !important;
  height:100% !important;
  z-index:-1 !important;
  background:url('../../images/blog-hero.jpeg') center center / cover no-repeat !important;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0%, rgba(0,0,0,.22) 5%, #000 16%, #000 100%),
    linear-gradient(to bottom, #000 0%, #000 74%, rgba(0,0,0,.94) 82%, rgba(0,0,0,.62) 90%, transparent 100%) !important;
  mask-image:
    linear-gradient(to right, transparent 0%, rgba(0,0,0,.22) 5%, #000 16%, #000 100%),
    linear-gradient(to bottom, #000 0%, #000 74%, rgba(0,0,0,.94) 82%, rgba(0,0,0,.62) 90%, transparent 100%) !important;
  -webkit-mask-composite: source-in !important;
  mask-composite: intersect !important;
}
.blog-shell { max-width:var(--max); margin:0 auto; padding:92px 28px 112px; }
.blog-layout { display:grid; grid-template-columns:minmax(0,1.18fr) 1px minmax(320px,.82fr); gap:38px; align-items:start; }
.blog-divider { width:1px; min-height:620px; background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.22) 18%, rgba(255,255,255,.22) 82%, rgba(255,255,255,.02)); }
.blog-feature, .blog-reader, .blog-list-card { border:1px solid rgba(255,255,255,.11); border-radius:32px; background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)); box-shadow:0 24px 54px rgba(0,0,0,.20); }
.blog-feature { overflow:hidden; }
.blog-feature-image { min-height:360px; background:url('../../images/blog-hero.jpeg') center center / cover no-repeat; position:relative; }
.blog-feature-image::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(4,8,16,.10), rgba(4,8,16,.72)); }
.blog-feature-body { padding:34px; }
.blog-kicker { color:var(--accent); text-transform:uppercase; letter-spacing:.22em; font-size:12px; font-weight:800; margin-bottom:16px; }
.blog-feature h2, .blog-reader h2 { margin:0 0 16px; font-size:clamp(34px,4vw,56px); line-height:.98; letter-spacing:-.06em; }
.blog-feature p, .blog-reader p { color:var(--muted); font-size:16px; line-height:1.72; margin:0 0 22px; }
.blog-feature-actions { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.blog-list-card { position:sticky; top:112px; padding:26px; }
.blog-list-card h2 { margin:0 0 18px; font-size:clamp(28px,3vw,40px); line-height:1.05; letter-spacing:-.055em; }
.blog-list { display:grid; gap:12px; }
.blog-list button, .blog-list a { width:100%; text-align:left; border:1px solid rgba(255,255,255,.09); border-radius:18px; background:rgba(255,255,255,.035); padding:12px; color:#fff; cursor:pointer; display:grid; grid-template-columns:74px minmax(0,1fr); gap:14px; align-items:center; transition: transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease); }
.blog-list button:hover, .blog-list button.active, .blog-list a:hover, .blog-list a.active { transform:translateY(-2px); border-color:rgba(166,222,78,.56); background:rgba(166,222,78,.08); box-shadow:0 0 22px rgba(166,222,78,.12); }
.blog-list-thumb { width:74px; height:74px; border-radius:14px; object-fit:cover; border:1px solid rgba(255,255,255,.12); box-shadow:0 12px 24px rgba(0,0,0,.22); }
.blog-list-text { min-width:0; }
.blog-list strong { display:block; font-size:16px; line-height:1.22; letter-spacing:-.03em; margin-bottom:7px; }
.blog-list span { display:block; color:var(--muted); font-size:13px; line-height:1.42; }
.blog-reader { display:none; padding:42px; min-height:640px; }
.blog-layout.article-open { grid-template-columns:minmax(0,1.35fr) 1px minmax(300px,.65fr); }
.blog-layout.article-open .blog-feature { display:none; }
.blog-layout.article-open .blog-reader { display:block; }
.blog-reader-toolbar { display:flex; justify-content:space-between; gap:18px; align-items:center; margin-bottom:28px; }
.blog-close { appearance:none; border:1px solid rgba(255,255,255,.13); border-radius:999px; background:rgba(255,255,255,.04); color:#fff; padding:10px 16px; cursor:pointer; }
.blog-close:hover { border-color:rgba(166,222,78,.56); }
.blog-reader-body { color:var(--muted); font-size:17px; line-height:1.82; }
.blog-reader-body p { margin:0 0 20px; }
.blog-reader-body h3 { color:#fff; font-size:24px; letter-spacing:-.04em; margin:34px 0 12px; }
@media (max-width:980px){
  .blog-page .company-hero-bg { left:0 !important; right:0 !important; width:auto !important; background:url('../../images/blog-hero.jpeg') 58% center / cover no-repeat !important; opacity:.58; }
  .blog-layout, .blog-layout.article-open { grid-template-columns:1fr; gap:24px; }
  .blog-divider { display:none; }
  .blog-list-card { position:relative; top:auto; order:1; }
  .blog-feature, .blog-reader { order:2; }
}
@media (max-width:700px){ .blog-shell{padding:72px 20px 88px;} .blog-feature-body,.blog-reader{padding:28px 24px;} .blog-feature-image{min-height:260px;} .blog-list button, .blog-list a {grid-template-columns:64px minmax(0,1fr); gap:12px;} .blog-list-thumb{width:64px;height:64px;} }

/* v48 Blog page, standard heading intro, no hero image */
.blog-page .company-hero,
.blog-page .company-hero-bg { display:none !important; }
.page-intro {
  padding: 128px 0 22px !important;
  position: relative;
}
.page-intro .section-inner { max-width: var(--max); }
.page-intro h1 {
  margin:0 0 16px;
  font-size: clamp(48px, 7vw, 92px);
  line-height:.92;
  letter-spacing:-.075em;
}
.page-intro-copy {
  margin:0;
  max-width: 760px;
  color: var(--muted);
  font-size: clamp(18px, 2vw, 24px);
  line-height:1.42;
}
.blog-shell { padding-top: 34px !important; }
@media (max-width:700px){ .page-intro{padding:106px 0 18px !important;} .blog-shell{padding-top:26px !important;} }

/* v65 global hero-system correction
   - removes the v60/v64 pseudo spacer strips
   - treats hero images as blended visual layers, not boxed hero sections
   - keeps page background/constellation continuous through the hero-to-content transition */
.company-hero,
.company-hero.section,
.home-hero-v05 {
  position: relative !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  isolation: isolate !important;
}
.company-hero::after,
.company-hero-bg::before,
.company-hero-bg::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
.company-hero .section-inner {
  position: relative !important;
  z-index: 5 !important;
}
.company-hero-bg {
  --v65-hero-image: url('../../images/home-hero.png');
  --v65-hero-pos: 72% center;
  position: absolute !important;
  inset: -70px 0 -8px 0 !important;
  left: 0 !important;
  right: 0 !important;
  top: -70px !important;
  bottom: -8px !important;
  width: auto !important;
  height: auto !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: .82 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 24% 50%, rgba(2,4,10,.96) 0%, rgba(2,4,10,.82) 24%, rgba(2,4,10,.35) 45%, rgba(2,4,10,0) 66%),
    linear-gradient(to right, rgba(2,4,10,.98) 0%, rgba(2,4,10,.82) 16%, rgba(2,4,10,.30) 39%, rgba(2,4,10,0) 68%),
    linear-gradient(to bottom, rgba(2,4,10,0) 0%, rgba(2,4,10,0) 80%, rgba(2,4,10,.16) 94%, rgba(2,4,10,0) 100%),
    var(--v65-hero-image) var(--v65-hero-pos) / cover no-repeat !important;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0%, rgba(0,0,0,.30) 7%, #000 20%, #000 100%),
    linear-gradient(to bottom, #000 0%, #000 88%, rgba(0,0,0,.72) 96%, transparent 100%) !important;
  mask-image:
    linear-gradient(to right, transparent 0%, rgba(0,0,0,.30) 7%, #000 20%, #000 100%),
    linear-gradient(to bottom, #000 0%, #000 88%, rgba(0,0,0,.72) 96%, transparent 100%) !important;
  -webkit-mask-composite: source-in !important;
  mask-composite: intersect !important;
}
.home-hero-bg-v05 { --v65-hero-image: url('../../images/home-hero.png'); --v65-hero-pos: 72% center; }
.about-page .company-hero-bg,
.company-page .company-hero-bg { --v65-hero-image: url('../../images/about-hero.png'); --v65-hero-pos: 70% center; }
.rd-page .company-hero-bg { --v65-hero-image: url('../../images/rd-hero.png'); --v65-hero-pos: 70% center; }
.agrioptic-page .company-hero-bg { --v65-hero-image: url('../../images/agrioptic-hero.png'); --v65-hero-pos: 68% center; }
.luciet-page .company-hero-bg { --v65-hero-image: url('../../images/luciet-hero.png'); --v65-hero-pos: 70% center; }
.agrioptic-connect-page .company-hero-bg { --v65-hero-image: url('../../images/agrioptic-connect-hero.png'); --v65-hero-pos: 68% center; }
.company-hero h1 {
  color: rgba(255,255,255,.97) !important;
  text-shadow: 0 0 8px rgba(255,255,255,.14), 0 3px 18px rgba(0,0,0,.68) !important;
}
.company-hero .hero-copy {
  color: rgba(247,244,236,.84) !important;
  font-weight: 600 !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.66) !important;
}
@media (max-width: 900px) {
  .company-hero-bg {
    inset: -40px 0 -4px 0 !important;
    opacity: .54 !important;
    background-position: center center !important;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 86%, rgba(0,0,0,.72) 95%, transparent 100%) !important;
    mask-image: linear-gradient(to bottom, #000 0%, #000 86%, rgba(0,0,0,.72) 95%, transparent 100%) !important;
  }
}

.desktop-nav a.is-active, .desktop-nav .nav-item.is-active > a, .desktop-nav a[aria-current="page"] { color:#b9f06a !important; text-shadow:0 0 14px rgba(185,240,106,.22); }
.mobile-menu a.is-active, .mobile-menu a[aria-current="page"] { color:#b9f06a !important; }
.company-hero .hero-copy, .home-hero-copy-v05, .hero-copy { color:rgba(247,244,236,.84) !important; text-shadow:0 2px 14px rgba(0,0,0,.66) !important; }