/* Blog / chemical article pages */
.blog-hero{padding:130px 0 40px;position:relative;overflow:hidden}
.blog-hero::after{content:"";position:absolute;top:-15%;right:-8%;width:600px;height:600px;z-index:-1;
  background:radial-gradient(circle,rgba(233,162,75,.16),transparent 64%);animation:floaty 10s ease-in-out infinite}
.blog-hero .formula{font-family:var(--font-mono);font-size:1rem;color:var(--copper-soft);
  font-style:italic;margin-bottom:18px;letter-spacing:.02em}
.blog-hero h1{font-size:clamp(2.4rem,5.6vw,4.6rem);max-width:16ch;margin:6px 0 24px}
.blog-meta{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px;justify-content:center}
.blog-meta .pill{font-size:.78rem}

.blog-body{max-width:760px;margin:0 auto}
.blog-body h2{font-size:clamp(1.7rem,3vw,2.4rem);margin:54px 0 18px}
.blog-body h3{font-family:var(--font-body);font-weight:700;font-size:1.25rem;margin:34px 0 12px;color:var(--ice)}
.blog-body p{color:var(--ice-dim);font-size:1.04rem;margin-bottom:18px;line-height:1.75}
.blog-body p strong{color:var(--ice);font-weight:600}
.blog-body ul.dotted{margin:18px 0 24px;display:flex;flex-direction:column;gap:12px}
.blog-body ul.dotted li{padding-left:28px;position:relative;color:var(--ice-dim);font-size:1.02rem}
.blog-body ul.dotted li::before{content:"◇";position:absolute;left:0;color:var(--copper)}
.blog-body ul.dotted li b{color:var(--ice)}

.lead-para{font-size:1.2rem!important;color:var(--ice)!important;font-weight:300;line-height:1.7!important;
  padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:34px!important}

/* spec table */
.spec-table{border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:30px 0;position:relative}
/* instrument scanline: sweeps once when table enters view */
.spec-table::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;z-index:3;
  background:linear-gradient(90deg,transparent,var(--cyan-soft),transparent);
  box-shadow:0 0 14px 2px rgba(103,232,249,.5);opacity:0;pointer-events:none}
.spec-table.scanning::after{animation:scanSweep 1.1s var(--ease) forwards}
@keyframes scanSweep{
  0%{opacity:0;transform:translateY(0)}
  10%{opacity:1}
  90%{opacity:1}
  100%{opacity:0;transform:translateY(var(--scan-h,300px))}}
/* rows reveal in sequence as the scan passes */
.spec-table .strow{opacity:0;transform:translateX(-8px);
  transition:opacity .4s var(--ease),transform .4s var(--ease)}
.spec-table.scanning .strow{opacity:1;transform:none}
.spec-table.scanning .strow:nth-child(1){transition-delay:.10s}
.spec-table.scanning .strow:nth-child(2){transition-delay:.20s}
.spec-table.scanning .strow:nth-child(3){transition-delay:.30s}
.spec-table.scanning .strow:nth-child(4){transition-delay:.40s}
.spec-table.scanning .strow:nth-child(5){transition-delay:.50s}
.spec-table.scanning .strow:nth-child(6){transition-delay:.60s}
.spec-table.scanning .strow:nth-child(7){transition-delay:.70s}
.spec-table .strow{display:flex;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--line);transition:.25s}
.spec-table .strow:last-child{border-bottom:none}
.spec-table .strow:hover{background:rgba(233,162,75,.05)}
.spec-table .stk{font-family:var(--font-mono);font-size:.86rem;color:var(--ice-dim)}
.spec-table .stv{font-family:var(--font-mono);font-weight:700;font-size:.92rem;color:var(--copper-soft)}
.spec-table .sthead{background:rgba(233,162,75,.08);font-family:var(--font-mono);font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--copper);padding:14px 24px;font-weight:600}

/* callout */
.callout{padding:28px 30px;border-radius:16px;border:1px solid var(--line-bright);
  background:rgba(34,211,238,.06);margin:34px 0;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start}
.callout .ci{font-size:1.6rem}
.callout h4{font-family:var(--font-body);font-weight:700;margin-bottom:6px}
.callout p{margin:0!important;font-size:.96rem!important}

/* grade chips inline */
.gchips{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 0}

/* use-case grid */
.uc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:26px 0}
@media(max-width:600px){.uc-grid{grid-template-columns:1fr}}
.uc{padding:24px;border:1px solid var(--line);border-radius:14px;background:rgba(15,39,66,.4);transition:.3s}
.uc:hover{border-color:rgba(233,162,75,.4);transform:translateY(-3px)}
.uc .uci{font-size:1.4rem;margin-bottom:10px}
.uc h4{font-family:var(--font-body);font-weight:700;font-size:1rem;margin-bottom:6px}
.uc p{font-size:.88rem!important;margin:0!important}

/* related / prev-next */
.related{border-top:1px solid var(--line);margin-top:60px;padding-top:50px}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}
@media(max-width:760px){.rel-grid{grid-template-columns:1fr}}
.rel-card{padding:26px;border:1px solid var(--line);border-radius:16px;background:rgba(15,39,66,.4);transition:.4s;display:block}
.rel-card:hover{border-color:rgba(233,162,75,.4);transform:translateY(-4px);background:rgba(15,39,66,.7)}
.rel-card .rc-cas{font-family:var(--font-mono);font-size:.72rem;color:var(--ice-dim);margin-bottom:8px}
.rel-card h4{font-size:1.2rem;margin-bottom:6px}
.rel-card p{font-size:.86rem!important;color:var(--ice-dim)!important;margin:0!important}

.blog-cta{margin-top:50px;padding:40px;border-radius:20px;text-align:center;
  border:1px solid rgba(233,162,75,.4);background:radial-gradient(120% 140% at 50% 0%,rgba(50,35,15,.5),rgba(11,27,46,.85))}
.blog-cta h3{font-family:var(--font-display);font-size:1.7rem;margin-bottom:12px}
.blog-cta p{margin-bottom:24px!important}

/* molecule visual — transparent wrapper; .mol3d is the visible box */
.mol-visual{width:100%;margin:10px 0 0;display:flex;justify-content:center}

/* ---- Interactive 3D molecule viewer ---- */
.mol3d{position:relative;width:100%;max-width:560px;height:400px;margin:0 auto;
  border-radius:20px;overflow:hidden;cursor:grab;
  background:radial-gradient(120% 100% at 50% 40%, rgba(233,162,75,.07), transparent 62%),
    linear-gradient(180deg, rgba(15,39,66,.35), rgba(11,27,46,.15));
  border:1px solid var(--line);}
.mol3d canvas{display:block}
.mol3d .mol-fallback{position:absolute;inset:0;display:grid;place-items:center;padding:30px}
.mol-hint{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);
  font-family:var(--font-mono);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ice-faint);background:rgba(6,16,29,.5);padding:6px 14px;border-radius:100px;
  backdrop-filter:blur(8px);border:1px solid var(--line);pointer-events:none;
  opacity:0;animation:hintRise .7s ease 1s forwards}
@keyframes hintRise{to{opacity:.85}}
.mol3d.mol3d-failed{cursor:default}
.mol3d.mol3d-failed .mol-hint{display:none}
@media(max-width:600px){.mol3d{height:320px}}

/* Copyable CAS number */
.cas-copy{font:inherit;color:inherit;background:none;border:none;cursor:pointer;
  padding:2px 6px;border-radius:6px;transition:.2s;font-family:var(--font-mono)}
.cas-copy:hover{background:rgba(233,162,75,.12);color:var(--copper-soft)}
.cas-copy.copied{background:rgba(34,211,238,.15);color:var(--cyan-soft)}

/* ============================================================
   RESOURCES / BLOG INDEX  (added for the Resources section)
   ============================================================ */
.res-hero{padding:130px 0 30px;position:relative;overflow:hidden}
.res-hero::after{content:"";position:absolute;top:-20%;right:-6%;width:620px;height:620px;z-index:-1;
  background:radial-gradient(circle,rgba(34,211,238,.14),transparent 64%);animation:floaty 12s ease-in-out infinite}
.res-lead{max-width:60ch}

/* Filter / tag row on the index */
.res-filter{display:flex;flex-wrap:wrap;gap:10px;margin:34px 0 4px}
.res-filter .chip{font-family:var(--font-mono);font-size:.76rem;letter-spacing:.06em;
  padding:9px 16px;border-radius:100px;border:1px solid var(--line);color:var(--ice-dim);
  cursor:pointer;transition:.25s;background:rgba(255,255,255,.02)}
.res-filter .chip:hover{border-color:var(--line-bright);color:var(--ice)}
.res-filter .chip.active{background:var(--cyan);color:var(--ink);border-color:var(--cyan)}

/* Featured post */
.feat-post{display:grid;grid-template-columns:1.15fr 1fr;gap:0;border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;background:linear-gradient(160deg,rgba(15,39,66,.7),rgba(11,27,46,.5));
  transition:.45s var(--ease);margin-top:20px}
.feat-post:hover{border-color:var(--line-bright);box-shadow:var(--shadow-lg);transform:translateY(-4px)}
.feat-media{position:relative;min-height:300px;background:
  radial-gradient(120% 110% at 30% 20%,rgba(34,211,238,.16),transparent 60%),
  linear-gradient(160deg,rgba(16,59,92,.6),rgba(11,27,46,.4));display:grid;place-items:center;overflow:hidden}
.feat-media .fm-glyph{font-family:var(--font-mono);font-size:5rem;color:var(--cyan);opacity:.5}
.feat-media .fm-tag{position:absolute;top:18px;left:18px;font-family:var(--font-mono);font-size:.68rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink);background:var(--cyan);
  padding:6px 14px;border-radius:100px;font-weight:700}
.feat-body{padding:40px}
.feat-body h2{font-size:clamp(1.6rem,2.6vw,2.3rem);margin:14px 0 14px;line-height:1.08}
.feat-body p{color:var(--ice-dim);font-size:1rem;margin-bottom:22px}

/* Post grid */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:34px}
@media(max-width:980px){.post-grid{grid-template-columns:repeat(2,1fr)}
  .feat-post{grid-template-columns:1fr}.feat-media{min-height:200px}}
@media(max-width:640px){.post-grid{grid-template-columns:1fr}}
.post-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;background:linear-gradient(160deg,rgba(15,39,66,.55),rgba(11,27,46,.4));
  transition:.45s var(--ease)}
.post-card:hover{transform:translateY(-6px);border-color:var(--line-bright);box-shadow:var(--shadow-lg)}
.pc-media{height:150px;position:relative;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(120% 110% at 30% 20%,rgba(34,211,238,.12),transparent 60%),
  linear-gradient(160deg,rgba(16,59,92,.45),rgba(11,27,46,.3))}
.pc-media.warm{background:radial-gradient(120% 110% at 30% 20%,rgba(233,162,75,.14),transparent 60%),
  linear-gradient(160deg,rgba(50,35,15,.4),rgba(11,27,46,.3))}
.pc-media .pc-glyph{font-family:var(--font-mono);font-size:2.4rem;color:var(--cyan);opacity:.55}
.pc-media.warm .pc-glyph{color:var(--copper)}
.pc-body{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.pc-cat{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cyan);margin-bottom:12px}
.pc-cat.warm{color:var(--copper)}
.post-card h3{font-family:var(--font-display);font-size:1.28rem;line-height:1.16;margin-bottom:10px}
.pc-excerpt{color:var(--ice-dim);font-size:.9rem;line-height:1.6;margin-bottom:18px;flex:1}
.pc-meta{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:.72rem;
  color:var(--ice-faint);letter-spacing:.04em;margin-top:auto}
.pc-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--ice-faint)}

/* Byline on article pages */
.byline{display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:center;
  font-family:var(--font-mono);font-size:.8rem;color:var(--ice-dim);letter-spacing:.03em;margin-top:22px}
.byline .dot{width:3px;height:3px;border-radius:50%;background:var(--ice-faint)}
.byline .author{color:var(--ice)}

/* Newsletter / subscribe strip */
.res-sub{margin-top:64px;padding:44px 40px;border-radius:20px;text-align:center;
  border:1px solid var(--line-bright);background:radial-gradient(120% 140% at 50% 0%,rgba(16,59,92,.5),rgba(11,27,46,.85))}
.res-sub h3{font-family:var(--font-display);font-size:1.7rem;margin-bottom:10px}
.res-sub p{color:var(--ice-dim);margin-bottom:24px;max-width:52ch;margin-left:auto;margin-right:auto}