/* ==========================================================================
   BeyondMath Developer Blog — shared stylesheet
   Used by index.html, template.html, and every posts/<slug>/index.html
   ========================================================================== */

/* Fonts — same files served by beyondmath.com; remove inside Webflow */
@font-face{
  font-family:'Roobert';
  src:url('https://cdn.prod.website-files.com/69123307c6b1ae30d9ce0e14/6912ff278322d68bfd560a2b_RoobertVF-Regular-TRIAL.woff2') format('woff2');
  font-weight:300 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Plasmaa Rondje';
  src:url('https://cdn.prod.website-files.com/69123307c6b1ae30d9ce0e14/6912ff2757cc085300827894_PlasmaaTRIAL-Rondje.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}

/* Page shell for standalone preview only — Webflow provides its own body */
html,body{margin:0;padding:0;background:#EFEAE7;}

/* ── Scoped post styles ─────────────────────────────────────────── */
.bm-post{
  --steel:#EFEAE7;--black:#000;--white:#FFF;
  --grey1:#D9D9D9;--grey2:#7B7B7B;--grey3:#444;
  --yellow:#FFF15D;--amber:#FFA340;--orange:#FF7050;--magenta:#B7336C;--blue:#1C5BAA;
  --gradient:linear-gradient(90deg,#FFF15D 0%,#FFA340 28%,#FF7050 52%,#B7336C 76%,#1C5BAA 100%);
  --sans:'Roobert','Helvetica Neue',Helvetica,Arial,sans-serif;
  --tech:'Plasmaa Rondje',ui-monospace,'SF Mono',Menlo,monospace;
  font-family:var(--sans);
  background:var(--steel);
  color:var(--black);
  font-size:1.125rem;
  line-height:1.55;
  letter-spacing:-.18px;
  padding:3rem 1.25rem 0;
}
.bm-post *{box-sizing:border-box;}

/* column widths: prose narrow, media wide */
.bm-post .bm-col{max-width:720px;margin:0 auto;}
.bm-post .bm-wide{max-width:980px;margin:0 auto;}

/* eyebrow */
.bm-post .bm-eyebrow{
  font-family:var(--tech);
  font-size:.75rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--orange);
  margin:0 0 1.25rem;
}

/* headings */
.bm-post h1{
  font-family:var(--sans);
  font-size:clamp(2.5rem,6vw,4.25rem);
  font-weight:400;
  line-height:1.02;
  letter-spacing:-.03em;
  margin:0 0 1.5rem;
}
.bm-post h1 .bm-o{color:var(--orange);}
.bm-post h2{
  font-family:var(--sans);
  font-size:clamp(1.75rem,3.5vw,2.5rem);
  font-weight:400;
  line-height:1.08;
  letter-spacing:-.02em;
  margin:3.5rem 0 1rem;
}
.bm-post .bm-standfirst{
  font-size:clamp(1.25rem,2.2vw,1.5rem);
  line-height:1.3;
  letter-spacing:-.02em;
  color:var(--black);
  margin:0 0 1rem;
}
.bm-post .bm-meta{
  font-family:var(--tech);
  font-size:.75rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--grey2);
  margin:0 0 2.5rem;
}

.bm-post p{margin:0 0 1.1rem;}
.bm-post strong{font-weight:600;}
.bm-post a{color:var(--black);text-decoration-color:var(--orange);text-decoration-thickness:2px;text-underline-offset:3px;}

/* gradient rule */
.bm-post .bm-rule{height:3px;background:var(--gradient);border:0;margin:3rem auto;}

/* generic prose lists (options lists etc.) */
.bm-post section.bm-col > ul{margin:0 0 1.1rem;padding-left:1.15rem;}
.bm-post section.bm-col > ul li{margin:0 0 .5rem;}
.bm-post section.bm-col > ul li:last-child{margin-bottom:0;}

/* exec summary — stat row */
.bm-post .bm-stats{
  background:#0b0b0b;color:var(--white);
  margin:1.5rem 0 1.25rem;
  position:relative;
}
.bm-post .bm-stats::before{
  content:"";display:block;height:3px;background:var(--gradient);
}
.bm-post .bm-stats-head{
  font-family:var(--tech);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--orange);padding:1.5rem 2rem 0;
}
.bm-post .bm-stat-row{
  display:grid;grid-template-columns:repeat(3,1fr);
  padding:1rem 0 1.75rem;
}
.bm-post .bm-stat{
  padding:.5rem 2rem;text-align:left;
  border-left:1px solid #2a2a2a;
}
.bm-post .bm-stat:first-child{border-left:0;}
.bm-post .bm-stat .bm-stat-value{
  font-family:var(--sans);font-weight:600;font-size:2.5rem;
  line-height:1.05;letter-spacing:-.02em;
  color:var(--white);margin:0 0 .35rem;
}
.bm-post .bm-stat:first-child .bm-stat-value{color:var(--yellow);}
.bm-post .bm-stat .bm-stat-label{
  font-size:.9rem;line-height:1.35;color:var(--grey1);
}
@media (max-width:640px){
  .bm-post .bm-stat-row{grid-template-columns:1fr;}
  .bm-post .bm-stat{border-left:0;border-top:1px solid #2a2a2a;padding:1.1rem 2rem;}
  .bm-post .bm-stat:first-child{border-top:0;}
}

/* tables */
.bm-post .bm-tablewrap{overflow-x:auto;margin:1.5rem 0;}
.bm-post table{
  border-collapse:collapse;width:100%;
  background:var(--steel);
  font-size:.95rem;letter-spacing:0;
}
.bm-post caption{
  caption-side:top;text-align:left;
  font-family:var(--tech);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--grey2);padding:0 0 .5rem;
}
.bm-post th,.bm-post td{
  border:1px solid var(--grey1);
  padding:.6rem .9rem;text-align:left;
}
.bm-post th{font-weight:600;background:var(--black);color:var(--white);border-color:var(--black);}
.bm-post tr.bm-win td{background:var(--yellow);}
.bm-post td.bm-best{font-weight:700;}

/* figures */
.bm-post figure{margin:2rem 0;}
.bm-post figure.bm-wide{margin:2.5rem auto;}
.bm-post figure.bm-hero{max-width:490px;}
.bm-post figure img{width:100%;height:auto;display:block;border:1px solid var(--grey1);}
.bm-post figcaption{
  font-family:var(--tech);font-size:.72rem;letter-spacing:.06em;
  color:var(--grey2);margin-top:.6rem;line-height:1.5;
}
.bm-post .bm-pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
@media (max-width:640px){.bm-post .bm-pair{grid-template-columns:1fr;}}

/* video embed */
.bm-post .bm-video{
  width:100%;height:auto;display:block;
  border:1px solid var(--grey1);
  background:#000;
}

/* agent log panel */
.bm-post .bm-log{
  background:#0b0b0b;color:var(--white);
  padding:1.75rem 2rem;margin:2rem 0;
  font-size:1rem;
}
.bm-post .bm-log .bm-log-head{
  font-family:var(--tech);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--orange);margin:0 0 1rem;
}
.bm-post .bm-log p{margin:0 0 .35rem;color:var(--grey1);}
.bm-post .bm-log p:last-child{margin:0;}
.bm-post .bm-log em{color:var(--white);font-style:normal;font-weight:600;}

/* pull line */
.bm-post .bm-pull{
  font-size:clamp(1.35rem,2.4vw,1.75rem);line-height:1.25;letter-spacing:-.02em;
  border-left:4px solid var(--orange);
  padding-left:1.25rem;margin:2.5rem 0;
}

/* site header / footer bars — bookend the article, link back to beyondmath.com
   NOTE: these sit outside .bm-post, so they cannot use its scoped custom
   properties (--tech, --black, etc.) — values are hardcoded here instead. */
.bm-sitebar{
  background:#EFEAE7;
  padding:1.25rem 1.25rem;
}
.bm-sitebar-inner{
  max-width:980px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:.75rem;
}
.bm-sitebar-logo{display:block;line-height:0;}
.bm-sitebar-logo img{height:22px;width:auto;display:block;}
.bm-sitebar-tag{
  font-family:'Plasmaa Rondje',ui-monospace,'SF Mono',Menlo,monospace;
  font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;
  color:#000;
}
.bm-sitebar-tag a{color:#000;text-decoration:none;border-bottom:1px solid #D9D9D9;}
.bm-sitebar-tag a:hover{border-color:#000;}

.bm-sitefoot{
  background:#EFEAE7;
  border-top:1px solid #D9D9D9;
  padding:2rem 1.25rem;
  margin-top:0;
}
.bm-sitefoot-inner{
  max-width:980px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;
}
.bm-sitefoot-logo{display:block;line-height:0;}
.bm-sitefoot-logo img{height:20px;width:auto;display:block;}
.bm-sitefoot-meta{
  font-family:'Plasmaa Rondje',ui-monospace,'SF Mono',Menlo,monospace;
  font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;
  color:#000;text-align:right;
}
.bm-sitefoot-meta a{color:#000;text-decoration:none;border-bottom:1px solid #D9D9D9;}
.bm-sitefoot-meta a:hover{border-color:#000;}

/* CTA */
.bm-post .bm-cta{
  background:var(--black);color:var(--white);
  padding:3.5rem 2rem;margin:4rem -1.25rem 0;
  text-align:center;
}
.bm-post .bm-cta h2{margin:0 0 .75rem;color:var(--white);}
.bm-post .bm-cta p{color:var(--grey1);max-width:560px;margin:0 auto 1.75rem;}
.bm-post .bm-cta a.bm-btn{
  display:inline-block;background:var(--yellow);color:var(--black);
  font-weight:600;text-decoration:none;
  padding:.9rem 2.2rem;letter-spacing:0;
}
.bm-post .bm-cta a.bm-btn:hover{background:var(--white);}

/* post listing (homepage) */
.bm-postlist{max-width:820px;margin:0 auto;}
.bm-postcard{
  display:flex;gap:1.75rem;align-items:flex-start;
  padding:2.25rem 0;
  border-bottom:1px solid var(--grey1);
  text-decoration:none;color:var(--black);
}
.bm-postlist .bm-postcard:first-child{padding-top:0;}
.bm-postcard-thumb{
  flex:0 0 220px;width:220px;aspect-ratio:16/10;overflow:hidden;
  border:1px solid var(--grey1);background:var(--white);
}
.bm-postcard-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.bm-postcard-body{flex:1 1 auto;min-width:0;}
.bm-postcard .bm-eyebrow{margin-bottom:.6rem;}
.bm-postcard-title{
  font-family:var(--sans);font-size:1.5rem;font-weight:400;
  line-height:1.15;letter-spacing:-.01em;
  color:var(--black);margin:0 0 .5rem;
}
.bm-postcard:hover .bm-postcard-title{color:var(--orange);}
.bm-postcard-excerpt{color:var(--black);margin:0 0 .6rem;line-height:1.5;}
.bm-postcard-meta{
  font-family:var(--tech);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grey2);
}
@media (max-width:640px){
  .bm-postcard{flex-direction:column;gap:1rem;}
  .bm-postcard-thumb{width:100%;flex-basis:auto;}
}