/* BioMeBar Gut Library (/learn/) — self-contained styles for the standalone
 * template (template-gut-library.php). All rules are scoped under .gl so they
 * cannot leak into other pages. The standalone template dequeues the theme
 * stylesheet, so the fonts are self-hosted here (same faces/paths as
 * blog-editorial.css) rather than relying on style.css being present.
 *
 * Design: BioMeBar house style — ivory ground, ink text, crimson #CC1F36,
 * Cormorant Garamond display + Inter body (matches the editorial blog), with
 * IBM Plex Mono for the small uppercase eyebrows/tags. */

@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/cormorant-garamond-latin.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-italic.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-latin.woff2) format("woff2")}
/* Metric-matched Arial fallback (copied from style.css) to avoid font-swap reflow. */
@font-face{font-family:"Inter Fallback";src:local("Arial");ascent-override:90.44%;descent-override:22.52%;line-gap-override:0.00%;size-adjust:107.12%}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibm-plex-mono-500.woff2) format("woff2")}

/* Bricks prints html{font-size:62.5%} inline; gut-library-wiring.php dequeues it,
   and this keeps rem at 16px if it ever leaks back (LiteSpeed combining etc.). */
html:has(body.bmb-gl-page){font-size:16px!important}

.gl{
  --gl-bg:#ffffff;
  --gl-ground:oklch(0.972 0.012 85);
  --gl-bg-2:oklch(0.955 0.014 84);
  --gl-bg-3:oklch(0.928 0.016 82);
  --gl-ink:oklch(0.16 0.01 30);
  --gl-ink-2:oklch(0.40 0.008 27);
  --gl-ink-3:oklch(0.52 0.008 27);
  --gl-line:oklch(0.88 0.012 80);
  --gl-red:#CC1F36; --gl-red-ink:#A8182C; --gl-red-soft:#f9e4e7;
  --gl-plum:#7b2d4e; --gl-plum-soft:#f4e6ec;
  --gl-teal:#2f6b5e; --gl-teal-soft:#e4efec;
  --gl-amber:#8a5a00; --gl-amber-soft:#f7ecd6;
  --gl-display:"Cormorant Garamond",ui-serif,Georgia,serif;
  --gl-body:"Inter","Inter Fallback",-apple-system,system-ui,sans-serif;
  --gl-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  background:var(--gl-ground);color:var(--gl-ink);font-family:var(--gl-body);
  font-size:17px;line-height:1.65;padding-inline:20px;padding-block:8px 72px;
  -webkit-font-smoothing:antialiased;
}
.gl *,.gl *::before,.gl *::after{box-sizing:border-box}
.gl-wrap{max-width:1120px;margin:0 auto}
.gl h1,.gl h2,.gl h3{font-family:var(--gl-display);line-height:1.08;margin:0;color:var(--gl-ink);letter-spacing:-.01em;font-weight:600;text-wrap:balance}
.gl h1{font-size:clamp(2.6rem,5.5vw,4rem);letter-spacing:-.02em}
.gl h2{font-size:clamp(1.8rem,3.4vw,2.55rem)}
.gl h3{font-size:1.3rem;line-height:1.2}
.gl p{margin:0;max-width:68ch}
.gl i,.gl em{font-style:italic}
.gl a{color:var(--gl-red-ink)}
.gl-eyebrow{font-family:var(--gl-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gl-ink-3)}
.gl-muted{color:var(--gl-ink-2)}
.gl-small{font-size:.9rem}
.gl-stack{display:flex;flex-direction:column;gap:14px}
.gl-stack-lg{display:flex;flex-direction:column;gap:28px}
.gl-section{padding-block:44px;border-top:1px solid var(--gl-line)}
.gl-crumbs{font-family:var(--gl-mono);font-size:.76rem;color:var(--gl-ink-3);letter-spacing:.02em}
.gl-crumbs a{color:inherit;text-decoration:none}
.gl-crumbs a:hover{text-decoration:underline}
.gl-tag{display:inline-block;align-self:flex-start;font-family:var(--gl-mono);font-size:.68rem;padding:3px 9px;border-radius:6px;letter-spacing:.06em;text-transform:uppercase}
.gl-t-ibs{background:var(--gl-red-soft);color:var(--gl-red-ink)}
.gl-t-pcos{background:var(--gl-plum-soft);color:var(--gl-plum)}
.gl-t-mind{background:var(--gl-teal-soft);color:var(--gl-teal)}
.gl-t-next{background:var(--gl-bg-3);color:var(--gl-ink-2)}
.gl-label{background:var(--gl-amber-soft);color:var(--gl-amber);font-family:var(--gl-mono);font-size:.72rem;padding:7px 12px;border-radius:8px;letter-spacing:.03em;align-self:flex-start}
.gl-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--gl-body);font-size:.9rem;font-weight:600;letter-spacing:.02em;padding:12px 22px;border-radius:9999px;border:1px solid var(--gl-ink);background:var(--gl-ink);color:#fff!important;text-decoration:none;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.gl-btn:hover{transform:translateY(-1px)}
.gl-btn-red{background:var(--gl-red);border-color:var(--gl-red);color:#fff!important}
.gl-btn-red:hover{background:var(--gl-red-ink);border-color:var(--gl-red-ink)}
.gl-btn-ghost{background:transparent;color:var(--gl-ink)!important;border-color:color-mix(in oklab,var(--gl-ink) 25%,transparent)}
.gl-btn-ghost:hover{background:color-mix(in oklab,var(--gl-ink) 6%,transparent)}
.gl-btn:focus-visible,.gl a:focus-visible,.gl summary:focus-visible{outline:2px solid var(--gl-red);outline-offset:2px}
.gl-row{display:flex;gap:10px;flex-wrap:wrap}

.gl-hero{display:grid;grid-template-columns:1.25fr .9fr;gap:44px;align-items:center;padding-block:32px 44px}
.gl-hero svg{width:100%;height:auto;display:block}
.gl-search{display:flex;gap:8px;max-width:560px;flex-wrap:wrap}
.gl-search input{flex:1;min-width:0;font:inherit;padding:12px 16px;border:1px solid var(--gl-line);border-radius:9999px;background:var(--gl-bg);color:var(--gl-ink)}

.gl-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.gl-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.gl-card{border:1px solid var(--gl-line);border-radius:14px;padding:24px;background:var(--gl-bg);display:flex;flex-direction:column;gap:12px;color:inherit;text-decoration:none;box-shadow:0 10px 40px -28px #1111111f}
a.gl-card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
a.gl-card:hover{border-color:var(--gl-ink-3);transform:translateY(-2px);box-shadow:0 20px 52px -30px #11111130}
.gl-card-fill{background:var(--gl-bg-2);border-color:transparent;box-shadow:none}
.gl-cond{border-top:4px solid var(--gl-red)}
.gl-cond-pcos{border-top-color:var(--gl-plum)}
.gl-cond-mind{border-top-color:var(--gl-teal)}
.gl-cond-soon{border-top-color:var(--gl-line)}
.gl-card .gl-foot{margin-top:auto}

.gl-article{display:grid;grid-template-columns:220px 1fr;gap:52px;padding-block:28px}
.gl-toc{position:sticky;top:80px;align-self:start;display:flex;flex-direction:column;gap:8px;font-size:.86rem;font-family:var(--gl-body)}
.gl-toc a{color:var(--gl-ink-2);text-decoration:none;padding:2px 0 2px 12px;border-left:2px solid var(--gl-line)}
.gl-toc a:hover{color:var(--gl-ink);border-left-color:var(--gl-red)}
.gl-body{display:flex;flex-direction:column;gap:36px;min-width:0}
.gl-body > section{scroll-margin-top:90px}
.gl-body h2{font-size:clamp(1.7rem,3vw,2.2rem);margin-bottom:14px}
.gl-keypoints{background:var(--gl-bg-2);border-radius:14px;padding:24px 26px}
.gl-keypoints ul,.gl-list{margin:12px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:8px}
.gl-byline{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:.9rem;color:var(--gl-ink-2)}
.gl-avatar{width:42px;height:42px;border-radius:50%;background:var(--gl-red-soft);color:var(--gl-red-ink);display:grid;place-items:center;font-family:var(--gl-display);font-weight:600;font-size:1rem;flex:none}

.gl-mech{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--gl-line);border-radius:14px;overflow:hidden;margin-top:16px;background:var(--gl-bg)}
.gl-mech > div{padding:18px;border-right:1px solid var(--gl-line);display:flex;flex-direction:column;gap:6px}
.gl-mech > div:last-child{border-right:0}
.gl-mech .gl-n{font-family:var(--gl-mono);font-size:.68rem;letter-spacing:.08em;color:var(--gl-ink-3)}
.gl-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--gl-line);border:1px solid var(--gl-line);border-radius:14px;overflow:hidden;margin-block:16px}
.gl-steps > div{background:var(--gl-bg);padding:20px;display:flex;flex-direction:column;gap:8px}
.gl-callout{border-left:3px solid var(--gl-red);padding:6px 0 6px 18px;display:flex;flex-direction:column;gap:6px;margin-top:16px}
.gl-callout-plum{border-left-color:var(--gl-plum)}
.gl-callout-teal{border-left-color:var(--gl-teal)}
.gl-faq details{border-bottom:1px solid var(--gl-line);padding-block:14px}
.gl-faq summary{cursor:pointer;font-weight:600;font-family:var(--gl-body)}
.gl-faq details p{margin-top:8px}
.gl-refs{font-size:.86rem;color:var(--gl-ink-2);display:flex;flex-direction:column;gap:8px;padding-left:18px;margin:0}
.gl-disclaim{font-size:.82rem;color:var(--gl-ink-3);border-top:1px solid var(--gl-line);padding-top:16px;margin-top:8px}

.gl-journey{display:flex;flex-direction:column;border-left:2px solid var(--gl-line);margin-left:6px}
.gl-journey > div{position:relative;padding:0 0 20px 22px;display:flex;flex-direction:column;gap:4px}
.gl-journey > div::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--gl-bg);border:2px solid var(--gl-red)}
.gl-journey .gl-wk{font-family:var(--gl-mono);font-size:.72rem;letter-spacing:.04em;color:var(--gl-ink-3)}
.gl-story{display:grid;grid-template-columns:1.3fr .9fr;gap:44px;align-items:start;padding-top:8px}
.gl-story .gl-prose{display:flex;flex-direction:column;gap:18px}
.gl-story .gl-prose p{font-size:1.08rem;max-width:64ch}
.gl-aside{position:sticky;top:80px;display:flex;flex-direction:column;gap:18px}
.gl-cta{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;background:var(--gl-bg-2);border-radius:16px;padding:30px}

/* ---- Case studies + hub (/learn/, /learn/case-studies/*) ---------------- */
.gl-lede{font-size:1.15rem;line-height:1.6;color:var(--gl-ink-2);max-width:62ch}
.gl-cs-head{padding-block:22px 34px;display:flex;flex-direction:column;gap:16px}
.gl-cs-head h1{font-size:clamp(2.3rem,4.8vw,3.5rem);max-width:22ch}
.gl-cs-glance{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid var(--gl-line);border-radius:14px;background:var(--gl-bg);margin:8px 0 0;overflow:hidden}
.gl-cs-glance > div{padding:14px 16px;border-right:1px solid var(--gl-line);display:flex;flex-direction:column;gap:4px}
.gl-cs-glance > div:last-child{border-right:0}
.gl-cs-glance dt{font-family:var(--gl-mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gl-ink-3)}
.gl-cs-glance dd{margin:0;font-weight:600;font-size:.95rem;line-height:1.35}
.gl-cs-sec{padding-block:40px;border-top:1px solid var(--gl-line);display:grid;grid-template-columns:240px 1fr;gap:40px}
.gl-cs-sec > header{display:flex;flex-direction:column;gap:10px}
.gl-cs-sec > header h2{font-size:clamp(1.6rem,2.8vw,2.1rem)}
.gl-cs-body{display:flex;flex-direction:column;gap:18px;min-width:0}
.gl-cs-body p{font-size:1.04rem}
.gl-cs-chips{display:flex;flex-wrap:wrap;gap:8px}
.gl-cs-chips span{font-size:.82rem;padding:6px 12px;border-radius:9999px;background:var(--gl-bg-2);color:var(--gl-ink-2)}
.gl-cs-phase{background:var(--gl-bg);border:1px solid var(--gl-line);border-radius:14px;padding:22px 24px;display:flex;flex-direction:column;gap:12px}
.gl-cs-phase h3{font-size:1.35rem}
.gl-cs-obs{background:var(--gl-teal-soft);color:oklch(0.32 0.05 170);border-radius:10px;padding:12px 16px;font-size:.95rem!important}
.gl-cs-obs strong{color:var(--gl-teal)}
.gl-cs-quotes{display:flex;flex-direction:column;gap:20px}
.gl-cs-quote{display:grid;grid-template-columns:1fr 300px;gap:28px;align-items:start;background:var(--gl-bg);border:1px solid var(--gl-line);border-radius:16px;padding:24px}
.gl-cs-quote .gl-wk{font-family:var(--gl-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gl-red-ink);background:var(--gl-red-soft);padding:3px 9px;border-radius:6px;align-self:flex-start}
.gl-cs-quote blockquote{margin:0;font-family:var(--gl-display);font-style:italic;font-size:1.45rem;line-height:1.3;color:var(--gl-ink);border-left:3px solid var(--gl-red);padding-left:16px}
.gl-cs-quote .gl-stack{gap:12px}
.gl-cs-quote figure{margin:0}
.gl-cs-quote img{width:100%;height:auto;display:block;border-radius:12px;border:1px solid var(--gl-line);background:#e9e2d6}
.gl-cs-quote figcaption{font-family:var(--gl-mono);font-size:.66rem;letter-spacing:.06em;color:var(--gl-ink-3);margin-top:6px;text-transform:uppercase}
.gl-cs-tbl{border:1px solid var(--gl-line);border-radius:14px;overflow:hidden;background:var(--gl-bg)}
.gl-cs-tbl table{width:100%;border-collapse:collapse;font-size:.95rem}
.gl-cs-tbl th{font-family:var(--gl-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gl-ink-3);text-align:left;background:var(--gl-bg-2);font-weight:500}
.gl-cs-tbl th,.gl-cs-tbl td{padding:12px 16px;border-bottom:1px solid var(--gl-line);vertical-align:top}
.gl-cs-tbl tr:last-child td{border-bottom:0}
.gl-cs-tbl td:first-child{white-space:nowrap;font-weight:600;width:110px}
.gl-cs-fine{font-size:.82rem;color:var(--gl-ink-3);max-width:80ch}
/* cards */
.gl-cs-card .gl-meta{font-family:var(--gl-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gl-ink-3)}
.gl-cs-card h3{font-size:1.45rem}
.gl-cs-card .gl-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:6px}
.gl-cs-card .gl-go,.gl-post .gl-go{font-size:.88rem;font-weight:600;color:var(--gl-red-ink)}
.gl-st{font-family:var(--gl-mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:6px}
.gl-st-ongoing{background:var(--gl-amber-soft);color:var(--gl-amber)}
.gl-st-done{background:var(--gl-teal-soft);color:var(--gl-teal)}
.gl-post{padding:0;overflow:hidden}
.gl-post img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block;background:var(--gl-bg-2)}
.gl-post .gl-post-b{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.gl-post h3{font-size:1.35rem}
.gl-hub-head{padding-block:28px 40px;display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:end}
.gl-hub-head h1{font-size:clamp(3rem,6.5vw,4.8rem)}
.gl-jump{display:flex;flex-direction:column;gap:12px}
.gl-jump a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px;border-radius:14px;background:var(--gl-bg);border:1px solid var(--gl-line);text-decoration:none;color:var(--gl-ink);transition:border-color .2s ease,transform .2s ease}
.gl-jump a:hover{border-color:var(--gl-ink-3);transform:translateY(-1px)}
.gl-jump b{font-family:var(--gl-display);font-size:1.5rem;font-weight:600;display:block;line-height:1.1}
.gl-jump span span{font-size:.88rem;color:var(--gl-ink-2)}
.gl-sec-head{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.gl-sec-head a{font-weight:600;font-size:.92rem;text-decoration:none}
.gl-cs-chiprow{gap:8px;align-items:center}
.gl-cs-steps{margin:0}
.gl-cs-quote-text{grid-template-columns:1fr}
.gl-cs-figs{display:flex;flex-direction:column;gap:14px}
.gl-cs-shot{margin:0;max-width:720px}
.gl-cs-shot img{width:100%;height:auto;display:block;border-radius:12px;border:1px solid var(--gl-line)}
.gl-cs-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gl-cs-kpi{background:var(--gl-bg);border:1px solid var(--gl-line);border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;gap:8px}
.gl-cs-val{display:flex;align-items:baseline;gap:10px;font-family:var(--gl-display);font-variant-numeric:lining-nums;font-size:2.4rem;line-height:1;font-weight:600}
.gl-cs-val s{text-decoration:none;color:var(--gl-ink-3)}
.gl-cs-val i{font-style:normal;font-size:1.3rem;color:var(--gl-ink-3)}
.gl-cs-val b{color:var(--gl-red)}
.gl-cs-jny{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:2px solid var(--gl-line);margin-top:10px}
.gl-cs-jny > div{position:relative;padding:22px 16px 0 0;display:flex;flex-direction:column;gap:6px}
.gl-cs-pt{position:absolute;top:-11px;left:0;width:20px;height:20px;border-radius:50%;background:var(--gl-ground);border:2px solid var(--gl-ink-3);font-family:var(--gl-mono);font-size:.62rem;display:grid;place-items:center;color:var(--gl-ink)}
.gl-cs-jny-test .gl-cs-pt{background:var(--gl-red);border-color:var(--gl-red);color:#fff}
.gl-cs-jny h4{margin:0;color:var(--gl-ink);font-family:var(--gl-body);font-size:1rem}
.gl-cs-jny p{font-size:.92rem!important;color:var(--gl-ink-2)}
.gl-cs-charts{--line:var(--gl-line);--muted:var(--gl-ink-3);--accent:var(--gl-red);--surface:var(--gl-bg);--fg:var(--gl-ink);display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.gl-cs-chart{margin:0;background:var(--gl-bg);border:1px solid var(--gl-line);border-radius:14px;padding:14px 14px 6px}
.gl-cs-chart figcaption{font-weight:600;font-size:.92rem;margin-bottom:4px}
.gl-cs-tv summary{cursor:pointer;font-weight:600;font-size:.92rem}
.gl-cs-tv table{width:100%;border-collapse:collapse;font-size:.92rem;margin-top:10px}
.gl-cs-tv th,.gl-cs-tv td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--gl-line)}
.gl-cs-tv th{font-family:var(--gl-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gl-ink-3);font-weight:500}

@media (max-width:820px){
  .gl-hero,.gl-grid-3,.gl-grid-2,.gl-story{grid-template-columns:1fr}
  .gl-article{grid-template-columns:1fr;gap:24px}
  .gl-toc,.gl-aside{position:static}
  .gl-toc{flex-direction:row;flex-wrap:wrap;gap:6px 14px}
  .gl-mech{grid-template-columns:1fr 1fr}
  .gl-mech > div:nth-child(2){border-right:0}
  .gl-mech > div:nth-child(-n+2){border-bottom:1px solid var(--gl-line)}
  .gl-steps{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.gl *{transition:none!important;animation:none!important}}

@media (max-width:980px){
  .gl-cs-glance{grid-template-columns:repeat(3,1fr)}
  .gl-cs-glance > div:nth-child(3){border-right:0}
  .gl-cs-glance > div:nth-child(-n+3){border-bottom:1px solid var(--gl-line)}
}
@media (max-width:820px){
  .gl-cs-sec,.gl-hub-head{grid-template-columns:1fr;gap:18px}
  .gl-cs-quote{grid-template-columns:1fr}
  .gl-cs-quote figure{max-width:340px}
  .gl-cs-kpis,.gl-cs-charts{grid-template-columns:1fr}
  .gl-cs-jny{grid-template-columns:1fr 1fr;row-gap:28px}
}
@media (max-width:520px){
  .gl-cs-glance{grid-template-columns:1fr 1fr}
  .gl-cs-glance > div{border-right:0;border-bottom:1px solid var(--gl-line)}
  .gl-cs-glance > div:nth-child(odd){border-right:1px solid var(--gl-line)}
  .gl-cs-glance > div:nth-last-child(-n+2){border-bottom:0}
}