@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,700;1,400&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600&display=swap');
:root{
  --g9:#0f2318;--g8:#1a3a2a;--g7:#1f4d36;--g6:#2d6a4f;--g5:#40916c;--g4:#52b788;--g3:#74c69d;--g2:#95d5b2;--g1:#d8f3dc;--g0:#f0faf3;
  --a4:#f4a261;--a1:#fef3e2;--a0:#fffbf3;
  --r4:#e76f51;--r1:#fde8e0;
  --b4:#457b9d;--b1:#dbeafe;
  --cream:#faf7f2;--white:#fff;
  --ink:#141414;--ink7:#2c2c2c;--ink5:#555;--ink4:#777;--ink2:#b0b0b0;--ink1:#e0dbd4;--ink0:#f5f2ed;
  --fd:'Playfair Display',Georgia,serif;
  --fb:'DM Sans',system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--fb);background:var(--cream);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}
ul,ol{list-style:none}button{cursor:pointer;font-family:inherit}
h1,h2,h3,h4{font-family:var(--fd);line-height:1.2;color:var(--g8)}
h1{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:700}
h2{font-size:clamp(1.25rem,2.5vw,1.65rem);font-weight:700}
p{color:var(--ink5);line-height:1.75}
.wrap{max-width:1120px;margin:0 auto;padding:0 1.5rem}

/* NAV */
.nav{position:sticky;top:0;z-index:200;background:var(--g8);height:64px;box-shadow:0 2px 12px rgba(0,0,0,.15)}
.nav-inner{max-width:1120px;margin:0 auto;padding:0 1.5rem;height:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav-logo{font-family:var(--fd);font-size:1.2rem;font-weight:700;color:#fff;white-space:nowrap;flex-shrink:0}
.nav-logo em{color:var(--g4);font-style:normal}
.nav-links{display:flex;gap:.15rem;align-items:center}
.nav-links a{color:rgba(255,255,255,.7);font-size:.82rem;font-weight:500;padding:.38rem .68rem;border-radius:8px;transition:all .18s}
.nav-links a:hover,.nav-links a.active{color:#fff;background:rgba(255,255,255,.1)}
.nav-srch{display:flex;align-items:center;gap:.45rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:9999px;padding:.32rem .85rem;flex-shrink:0}
.nav-srch input{background:none;border:none;outline:none;color:#fff;font-family:var(--fb);font-size:.82rem;width:155px}
.nav-srch input::placeholder{color:rgba(255,255,255,.4)}
.nav-mob{display:none;background:none;border:none;color:#fff;font-size:1.3rem}

/* BREADCRUMB */
.bc{background:var(--white);border-bottom:1px solid var(--ink1);padding:.52rem 0;font-size:.77rem}
.bc ol{display:flex;gap:.38rem;align-items:center;flex-wrap:wrap}
.bc li{color:var(--ink4);display:flex;align-items:center;gap:.38rem}
.bc li:not(:last-child)::after{content:'›';color:var(--ink2)}
.bc li a{color:var(--g6)}.bc li a:hover{text-decoration:underline}
.bc li:last-child{color:var(--ink7);font-weight:500}

/* HERO */
.hero{background:var(--g8);padding:3rem 0 2.5rem;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 55% 75% at 75% 40%,rgba(82,183,136,.12) 0%,transparent 65%)}
.hero-inner{position:relative}
.hero-ey{display:inline-flex;align-items:center;gap:.4rem;background:rgba(82,183,136,.15);border:1px solid rgba(82,183,136,.3);border-radius:9999px;color:var(--g4);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.28rem .88rem;margin-bottom:1.1rem}
.hero h1{color:#fff;margin-bottom:.88rem;max-width:640px}
.hero h1 em{color:var(--g4);font-style:italic}
.hero-sub{color:rgba(255,255,255,.65);font-size:1rem;max-width:520px;margin-bottom:1.75rem}
.hero-acts{display:flex;gap:.65rem;flex-wrap:wrap;margin-bottom:1.9rem}
.trust-row{display:flex;gap:.55rem;flex-wrap:wrap;margin-bottom:1.75rem}
.trust-b{display:flex;align-items:center;gap:.32rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:.38rem .75rem;font-size:.74rem;color:rgba(255,255,255,.8);font-weight:500}
.hero-stats{display:flex;gap:2.25rem;flex-wrap:wrap;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.1)}
.hs-n{font-family:var(--fd);font-size:1.55rem;font-weight:700;color:var(--g4);display:block}
.hs-l{font-size:.7rem;color:rgba(255,255,255,.42);letter-spacing:.04em;margin-top:.08rem}

/* FOOD HERO */
.fhero{background:var(--white);border-bottom:1px solid var(--ink1);padding:1.6rem 0}
.fhero-inner{max-width:1120px;margin:0 auto;padding:0 1.5rem;display:grid;grid-template-columns:108px 1fr;gap:1.6rem;align-items:start}
.fhero-em{width:100px;height:100px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:3.4rem;flex-shrink:0}
.fhero-bdg{display:flex;gap:.38rem;flex-wrap:wrap;margin-bottom:.52rem}
.fhero-ttl{margin-bottom:.28rem;font-size:clamp(1.3rem,3vw,1.9rem)}
.fhero-sci{font-size:.8rem;color:var(--ink4);font-style:italic;margin-bottom:.85rem}
.fhero-qs{display:grid;grid-template-columns:repeat(4,auto);gap:.6rem;margin-bottom:.85rem}
.fqs{background:var(--ink0);border-radius:8px;padding:.52rem .88rem;text-align:center;min-width:74px}
.fqs-n{font-family:var(--fd);font-size:1rem;font-weight:700;color:var(--g8);display:block}
.fqs-l{font-size:.63rem;color:var(--ink4);margin-top:.08rem}
.fhero-acts{display:flex;gap:.5rem;flex-wrap:wrap}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:.38rem;padding:.58rem 1.15rem;border-radius:8px;font-size:.865rem;font-weight:600;border:none;transition:all .18s;white-space:nowrap}
.btn-primary{background:var(--g6);color:#fff}.btn-primary:hover{background:var(--g5)}
.btn-secondary{background:#fff;color:var(--g6);border:1.5px solid var(--g6)}.btn-secondary:hover{background:var(--g0)}
.btn-ghost{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2)}.btn-ghost:hover{background:rgba(255,255,255,.18)}
.btn-amber{background:var(--a4);color:#fff}.btn-amber:hover{filter:brightness(.92)}
.btn-sm{padding:.36rem .82rem;font-size:.77rem}

/* BADGES */
.badge{display:inline-flex;align-items:center;font-size:.68rem;font-weight:600;padding:.16rem .52rem;border-radius:9999px}
.badge-green{background:var(--g1);color:var(--g7)}
.badge-amber{background:var(--a1);color:#d97706}
.badge-blue{background:var(--b1);color:#1d4ed8}
.badge-red{background:var(--r1);color:var(--r4)}
.badge-gray{background:var(--ink0);color:var(--ink5)}

/* AD ZONES */
.ad-zone{background:rgba(244,162,97,.04);border:1.5px dashed rgba(244,162,97,.32);border-radius:8px;padding:.62rem 1rem;text-align:center;margin:1rem 0}
.az-l{font-size:.57rem;color:var(--ink2);letter-spacing:.05em;text-transform:uppercase}
.az-p{font-size:.68rem;color:var(--ink2);margin-top:.08rem}

/* HOMEPAGE CATEGORY SECTIONS */
.cat-sec{scroll-margin-top:120px;padding:2.5rem 0}
.cat-sec:nth-child(even){background:var(--white)}
.cat-hdr{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:1.2rem;flex-wrap:wrap;gap:.65rem}
.cat-ey{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--g5);margin-bottom:.22rem}
.view-all{font-size:.8rem;font-weight:600;color:var(--g6);display:flex;align-items:center;gap:.28rem;transition:gap .2s}
.view-all:hover{gap:.55rem}
.food-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:.9rem}
.food-card{background:var(--white);border:1px solid var(--ink1);border-radius:14px;overflow:hidden;transition:all .2s;text-decoration:none;display:block;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.food-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.09);transform:translateY(-2px);border-color:var(--g2)}
.fc-thumb{height:92px;display:flex;align-items:center;justify-content:center;font-size:2.7rem}
.fc-body{padding:.82rem .95rem}
.fc-name{font-size:.88rem;font-weight:700;color:var(--g8);margin-bottom:.18rem}
.fc-cal{font-size:.73rem;color:var(--ink4);margin-bottom:.38rem}
.fc-tags{display:flex;gap:.28rem;flex-wrap:wrap}

/* NATIVE STRIP */
.ns{background:linear-gradient(135deg,#fdf8ee,#fef9e7);border:1px solid #e8d5a3;border-radius:20px;padding:1.4rem 1.85rem;margin:1rem 0}
.ns-hdr{display:flex;align-items:center;gap:.7rem;margin-bottom:1.15rem}
.ns-flag{font-size:1.35rem}
.ns-title{font-family:var(--fd);font-size:1rem;color:#5c3d11}
.ns-sub{font-size:.73rem;color:#9a7a4a;margin-top:.12rem}
.ng{display:grid;grid-template-columns:repeat(5,1fr);gap:.65rem}
.nc{background:#fff;border:1px solid #e8d5a3;border-radius:8px;padding:.75rem;text-align:center;transition:all .18s;text-decoration:none;display:block}
.nc:hover{transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.07)}
.nc-em{font-size:1.35rem;margin-bottom:.28rem}
.nc-nm{font-size:.7rem;font-weight:700;color:#5c3d11}
.nc-bn{font-size:.59rem;color:#9a7a4a;margin-top:.18rem;line-height:1.4}

/* CAT TABS */
.cat-tabs{
  display:flex;gap:.42rem;flex-wrap:wrap;
  position:sticky;top:64px;z-index:98;
  background:var(--cream);
  padding:.65rem 0 .6rem;
  border-bottom:1px solid var(--ink1);
  margin-bottom:0;
  box-shadow:0 2px 6px rgba(0,0,0,.04);
}
.cat-tab{padding:.4rem .92rem;border-radius:9999px;font-size:.78rem;font-weight:600;border:1.5px solid var(--ink1);background:#fff;color:var(--ink5);transition:all .18s;cursor:pointer}
.cat-tab:hover{border-color:var(--g4);color:var(--g6)}
.cat-tab.active{background:var(--g6);border-color:var(--g6);color:#fff}

/* PAGE LAYOUT */
.pg-layout{max-width:1120px;margin:0 auto;padding:1.65rem 1.5rem;display:grid;grid-template-columns:1fr 284px;gap:1.65rem;align-items:start}
.article{min-width:0}
.sidebar{position:sticky;top:72px;display:flex;flex-direction:column;gap:.9rem}

/* CONTENT CARDS */
.cc{background:var(--white);border:1px solid var(--ink1);border-radius:14px;padding:1.35rem;margin-bottom:1.35rem;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.sec-hd{font-family:var(--fd);font-size:1.02rem;font-weight:700;color:var(--g8);margin-bottom:.85rem;padding-bottom:.52rem;border-bottom:2px solid var(--g1);display:flex;align-items:center;gap:.42rem}

/* CALCULATOR */
.calc-card{background:var(--g0);border:1.5px solid var(--g2);border-radius:14px;padding:1.35rem;margin-bottom:1.35rem}
.calc-hdr{display:flex;align-items:center;gap:.65rem;margin-bottom:1.05rem}
.calc-ico{width:36px;height:36px;background:var(--g6);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.95rem;color:#fff;flex-shrink:0}
.calc-ttl{font-family:var(--fd);font-size:.92rem;font-weight:700;color:var(--g8)}
.calc-sub{font-size:.74rem;color:var(--ink4);margin-top:.08rem}
.sl-row{display:flex;align-items:center;gap:.85rem;margin-bottom:.85rem}
.sl-lbl{font-size:.8rem;color:var(--ink5);white-space:nowrap;min-width:86px}
input[type=range]{flex:1;-webkit-appearance:none;height:5px;background:var(--g2);border-radius:9999px;outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--g6);cursor:pointer;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.sl-val{font-size:.86rem;font-weight:700;color:var(--g8);min-width:44px;text-align:right}
.calc-res{display:grid;grid-template-columns:repeat(4,1fr);gap:.52rem}
.cr-box{background:#fff;border:1px solid var(--g2);border-radius:8px;padding:.65rem;text-align:center}
.cr-num{font-family:var(--fd);font-size:1.08rem;font-weight:700;color:var(--g8);display:block}
.cr-lbl{font-size:.6rem;color:var(--ink4);margin-top:.1rem}

/* NUTRITION TABLE */
.nt-wrap{overflow-x:auto;margin-bottom:.7rem}
.nt{width:100%;border-collapse:collapse;font-size:.83rem}
.nt thead th{background:var(--g8);color:#fff;padding:.58rem .88rem;text-align:left;font-weight:600;font-size:.75rem}
.nt thead th:last-child{width:110px}
.nt tbody td{padding:.52rem .88rem;border-bottom:1px solid var(--ink0);color:var(--ink7)}
.nt tbody tr:nth-child(even) td{background:var(--ink0)}
.nt tbody tr:hover td{background:var(--g0)}
.nt td.hl{font-weight:700;color:var(--g6)}
.nt-bar{height:4px;background:var(--ink1);border-radius:2px;overflow:hidden;min-width:75px}
.nt-fill{height:100%;border-radius:2px;background:var(--g4)}
.nt-src{font-size:.7rem;color:var(--ink4);margin-top:.38rem}

/* VITAMINS */
.vit-grid{display:flex;gap:.42rem;flex-wrap:wrap}
.vp{display:flex;flex-direction:column;align-items:center;background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.52rem .82rem;min-width:68px;text-align:center}
.vp-nm{font-size:.7rem;font-weight:700;color:var(--g8)}
.vp-am{font-size:.76rem;font-weight:700;color:var(--g6);margin:.07rem 0}
.vp-rd{font-size:.58rem;color:var(--ink4)}

/* BENEFITS */
.ben-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.ben-card{background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.9rem .95rem;display:flex;gap:.65rem;align-items:flex-start}
.ben-em{font-size:1.15rem;flex-shrink:0;margin-top:.08rem}
.ben-ttl{font-size:.8rem;font-weight:700;color:var(--g8);margin-bottom:.18rem}
.ben-dc{font-size:.73rem;color:var(--ink5);line-height:1.6}

/* WHO SHOULD AVOID */
.av-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin-bottom:.65rem}
.av-card{border-radius:8px;padding:.88rem .95rem;display:flex;gap:.65rem;align-items:flex-start}
.av-card.danger{background:#fff5f5;border:1px solid #fecaca}
.av-card.caution{background:#fffbeb;border:1px solid #fde68a}
.av-ico{font-size:1rem;flex-shrink:0;margin-top:.08rem}
.av-ttl{font-size:.78rem;font-weight:700;color:var(--ink7);margin-bottom:.15rem}
.av-dc{font-size:.71rem;color:var(--ink5);line-height:1.55}
.av-ok{background:var(--g0);border:1px solid var(--g2);border-radius:8px;padding:.62rem .9rem;font-size:.76rem;color:var(--g7);font-weight:500;display:flex;gap:.42rem;align-items:flex-start;margin-bottom:.62rem}
.disc{background:#fefce8;border:1px solid #fde047;border-radius:8px;padding:.58rem .9rem;font-size:.7rem;color:#713f12;line-height:1.6;display:flex;gap:.42rem;align-items:flex-start}

/* SIDE EFFECTS */
.ef-list{display:flex;flex-direction:column;gap:.52rem}
.ef-row{display:flex;gap:.85rem;align-items:flex-start;background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.8rem .9rem}
.ef-sev{display:flex;flex-direction:column;align-items:center;gap:.15rem;flex-shrink:0;min-width:42px}
.sev-dot{width:9px;height:9px;border-radius:50%}
.sev-dot.low{background:#86efac}.sev-dot.med{background:#fbbf24}.sev-dot.high{background:#f87171}
.sev-lbl{font-size:.56rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink4);text-align:center}
.ef-ttl{font-size:.78rem;font-weight:700;color:var(--ink7);margin-bottom:.15rem}
.ef-dc{font-size:.71rem;color:var(--ink5);line-height:1.6}
.ef-who{font-size:.67rem;color:var(--g6);font-weight:600;margin-top:.22rem}

/* SELECT FRESH */
.fr-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;margin-bottom:.65rem}
.fr-step{background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.88rem;text-align:center}
.fr-num{width:25px;height:25px;border-radius:50%;background:var(--g6);color:#fff;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto .5rem}
.fr-t{font-size:.78rem;font-weight:700;color:var(--g8);margin-bottom:.22rem}
.fr-d{font-size:.7rem;color:var(--ink5);line-height:1.55}
.au-tip{background:var(--g0);border:1px solid var(--g2);border-radius:8px;padding:.6rem .9rem;font-size:.74rem;color:var(--g7);font-weight:500;display:flex;gap:.42rem;align-items:flex-start}

/* STORAGE */
.st-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;margin-bottom:.65rem}
.st-card{background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.88rem;text-align:center}
.st-ico{font-size:1.35rem;margin-bottom:.32rem}
.st-mth{font-size:.74rem;font-weight:700;color:var(--g8);margin-bottom:.15rem}
.st-dur{font-size:.92rem;font-weight:700;color:var(--g6)}
.st-nt{font-size:.6rem;color:var(--ink4);margin-top:.07rem}
.st-tip{font-size:.67rem;color:var(--ink5);margin-top:.35rem;line-height:1.45}
.st-bar{height:4px;background:var(--ink1);border-radius:2px;margin-top:.48rem;overflow:hidden}
.st-fill{height:100%;border-radius:2px;background:var(--g4)}
.st-aff{background:var(--a0);border:1px solid #f4d4a0;border-radius:8px;padding:.82rem .9rem;display:flex;align-items:center;justify-content:space-between;gap:.85rem}
.sa-l{font-size:.58rem;font-weight:700;color:#d97706;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.15rem}
.sa-n{font-size:.78rem;font-weight:700;color:var(--ink7)}
.sa-d{font-size:.68rem;color:var(--ink5)}

/* INTERESTING FACTS */
.facts-list{display:flex;flex-direction:column;gap:.52rem}
.fact-item{background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.9rem .95rem;display:flex;gap:.82rem;align-items:flex-start;cursor:pointer;transition:all .18s;user-select:none}
.fact-item:hover,.fact-item.open{border-color:var(--g3);background:var(--g0)}
.fact-n{width:25px;height:25px;border-radius:50%;background:var(--g1);color:var(--g7);font-size:.68rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.1rem}
.fact-em{font-size:1rem;flex-shrink:0;margin-top:.13rem}
.fact-q{font-size:.8rem;font-weight:700;color:var(--g8);margin-bottom:.15rem}
.fact-a{font-size:.73rem;color:var(--ink5);line-height:1.65;display:none;margin-top:.25rem}
.fact-item.open .fact-a{display:block}
.fact-tg{font-size:.6rem;color:var(--g5);font-weight:600;margin-top:.15rem}
.fact-tg::before{content:'Tap to read more ↓'}
.fact-item.open .fact-tg::before{content:'Tap to close ↑'}
.share-strip{display:flex;gap:.42rem;flex-wrap:wrap;margin-top:.82rem}
.sh-btn{display:flex;align-items:center;gap:.28rem;background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.36rem .68rem;font-size:.7rem;font-weight:600;color:var(--ink5);transition:all .15s;cursor:pointer}
.sh-btn:hover{background:var(--g0);border-color:var(--g3);color:var(--g7)}

/* COMPARE */
.cmp-strip{display:flex;gap:.42rem;align-items:center;flex-wrap:wrap}
.cmp-card{flex:1;min-width:90px;background:#fff;border:1px solid var(--ink1);border-radius:8px;padding:.68rem;text-align:center;transition:border-color .15s;cursor:pointer}
.cmp-card.active{border-color:var(--g4);background:var(--g0)}
.cmp-card:hover{border-color:var(--g3)}
.cmp-em{font-size:1.35rem;margin-bottom:.25rem}
.cmp-nm{font-size:.72rem;font-weight:700;color:var(--g8)}
.cmp-cl{font-size:.65rem;color:var(--ink4);margin-top:.07rem}
.vs-b{font-size:.68rem;font-weight:700;color:var(--a4);padding:0 .18rem;flex-shrink:0}

/* RELATED */
.rel-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.65rem}
.rel-card{background:#fff;border:1px solid var(--ink1);border-radius:8px;overflow:hidden;transition:all .18s;text-decoration:none;display:block}
.rel-card:hover{border-color:var(--g3);box-shadow:0 2px 8px rgba(0,0,0,.07);transform:translateY(-1px)}
.rel-thumb{height:54px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;background:var(--ink0)}
.rel-info{padding:.42rem .58rem}
.rel-nm{font-size:.7rem;font-weight:700;color:var(--g8)}
.rel-cl{font-size:.6rem;color:var(--ink4);margin-top:.04rem}

/* ARTICLE TEXT */
.art-text p{font-size:.86rem;color:var(--ink5);line-height:1.8;margin-bottom:.68rem}
.hi-call{background:#fefce8;border-left:3px solid var(--a4);padding:.78rem .95rem;border-radius:0 8px 8px 0;font-size:.78rem;color:#713f12;line-height:1.65;margin:1rem 0}

/* SIDEBAR */
.sb-card{background:#fff;border:1px solid var(--ink1);border-radius:14px;padding:.95rem;overflow:hidden}
.sb-ttl{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--ink4);margin-bottom:.65rem;padding-bottom:.42rem;border-bottom:1.5px solid var(--ink0)}
.sb-aff{background:var(--a0);border:1px solid #f4d4a0;border-radius:8px;padding:.75rem;margin-bottom:.5rem}
.sb-al{font-size:.57rem;font-weight:700;color:#d97706;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.15rem}
.sb-an{font-size:.78rem;font-weight:700;color:var(--ink7);margin-bottom:.15rem}
.sb-ad{font-size:.68rem;color:var(--ink5);line-height:1.45;margin-bottom:.42rem}
.sb-ab{width:100%;background:var(--a4);color:#fff;border:none;border-radius:8px;padding:.4rem .68rem;font-size:.72rem;font-weight:700}
.sb-ab:hover{filter:brightness(.92)}
.sb-food-list{display:flex;flex-direction:column}
.sb-row{display:flex;align-items:center;gap:.52rem;padding:.42rem 0;border-bottom:1px solid var(--ink0);text-decoration:none;transition:background .12s}
.sb-row:last-child{border-bottom:none}
.sb-row:hover{background:var(--g0)}
.sb-em{font-size:1.05rem;width:26px;text-align:center;flex-shrink:0}
.sb-nm{font-size:.73rem;font-weight:600;color:var(--g8)}
.sb-cl{font-size:.6rem;color:var(--ink4);margin-top:.03rem}
.sb-nl{background:var(--g8);border-radius:8px;padding:.9rem}
.sb-nl-t{font-family:var(--fd);font-size:.88rem;color:#fff;margin-bottom:.25rem}
.sb-nl-s{font-size:.68rem;color:rgba(255,255,255,.55);margin-bottom:.65rem;line-height:1.5}
.sb-nl-i{width:100%;border:none;border-radius:8px;padding:.45rem .68rem;font-family:var(--fb);font-size:.78rem;margin-bottom:.42rem}
.sb-nl-b{width:100%;background:var(--g4);color:#fff;border:none;border-radius:8px;padding:.45rem;font-family:var(--fb);font-size:.78rem;font-weight:700}
.sb-nl-b:hover{background:var(--g3)}
.qf-list{display:flex;flex-direction:column;gap:.38rem}
.qf-row{display:flex;gap:.52rem;align-items:flex-start;font-size:.74rem;color:var(--ink5);padding:.3rem 0;border-bottom:1px solid var(--ink0);line-height:1.5}
.qf-row:last-child{border-bottom:none}
.qf-i{flex-shrink:0;font-size:.85rem}

/* PAGE NAV */
.pg-nav{background:var(--g8);display:flex;align-items:center;justify-content:space-between;padding:.85rem 1.5rem}
.pn-link{font-size:.78rem;color:var(--g4);font-weight:600}
.pn-mid{font-size:.68rem;color:rgba(255,255,255,.32)}

/* FOOTER */
.footer{background:var(--g8);padding:2.5rem 0 1.4rem;margin-top:3rem}
.ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:1.85rem;margin-bottom:2rem}
.ft-bn{font-family:var(--fd);font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:.4rem}
.ft-bn em{color:var(--g4);font-style:normal}
.ft-bd{font-size:.78rem;color:rgba(255,255,255,.5);line-height:1.65;max-width:250px}
.ft-ct{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--g4);margin-bottom:.75rem}
.ft-cl{display:flex;flex-direction:column;gap:.35rem}
.ft-cl a{font-size:.78rem;color:rgba(255,255,255,.52);transition:color .15s}
.ft-cl a:hover{color:#fff}
.ft-bot{border-top:1px solid rgba(255,255,255,.1);padding-top:1rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.65rem}
.ft-copy{font-size:.7rem;color:rgba(255,255,255,.28)}
.ft-disc{font-size:.68rem;color:rgba(255,255,255,.26);max-width:460px;line-height:1.5}

/* RESPONSIVE */
@media(max-width:900px){
  .pg-layout{grid-template-columns:1fr}
  .sidebar{position:static}
  .nav-links,.nav-srch{display:none}
  .nav-mob{display:block}
  .fhero-inner{grid-template-columns:1fr}
  .fhero-qs{grid-template-columns:repeat(2,auto)}
  .ft-grid{grid-template-columns:1fr 1fr}
  .ng{grid-template-columns:repeat(3,1fr)}
  .food-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .ben-grid,.av-grid,.fr-steps,.st-grid{grid-template-columns:1fr}
  .rel-grid{grid-template-columns:repeat(2,1fr)}
  .calc-res{grid-template-columns:repeat(2,1fr)}
  .ft-grid{grid-template-columns:1fr}
  .ng{grid-template-columns:repeat(2,1fr)}
  .cmp-strip{gap:.28rem}
}

/* Calculator & Compare nav highlight */
.nav-links a[href*="calculator"],
.nav-links a[href*="compare"]{
  background:rgba(82,183,136,.15);
  color:rgba(255,255,255,.9);
  border:1px solid rgba(82,183,136,.25);
}
.nav-links a[href*="calculator"]:hover,
.nav-links a[href*="compare"]:hover,
.nav-links a[href*="calculator"].active,
.nav-links a[href*="compare"].active{
  background:rgba(82,183,136,.3);
  color:#fff;
  border-color:rgba(82,183,136,.5);
}
/* Calc card pulse on highlight */
.calc-card{transition:box-shadow .3s}



.food-intro strong{color:var(--g8)}

/* ── FOOD PAGE SECTION JUMP BAR ── */
.food-scroll-bar{
  background:var(--white);
  border-bottom:2px solid var(--g1);
  position:sticky;
  top:64px;
  z-index:99;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
}
.fsb-inner{
  display:flex;
  gap:.3rem;
  overflow-x:auto;
  padding:.55rem 0;
  scrollbar-width:none;
  -ms-overflow-style:none;
  flex-wrap:nowrap;
}
.fsb-inner::-webkit-scrollbar{display:none}
.fsb-btn{
  display:inline-flex;
  align-items:center;
  gap:.28rem;
  white-space:nowrap;
  flex-shrink:0;
  background:none;
  border:1px solid var(--ink1);
  border-radius:9999px;
  padding:.32rem .82rem;
  font-size:.75rem;
  font-weight:600;
  color:var(--ink5);
  cursor:pointer;
  transition:all .18s;
  font-family:var(--fb);
}
.fsb-btn:hover{
  background:var(--g0);
  border-color:var(--g4);
  color:var(--g6);
}
.fsb-btn.active{
  background:var(--g6);
  border-color:var(--g6);
  color:#fff;
}
/* Food intro box */
.food-intro{
  background:var(--g0);
  border-left:3px solid var(--g4);
  border-radius:0 8px 8px 0;
  padding:.82rem 1rem;
  margin-bottom:1.1rem;
  font-size:.86rem;
  color:var(--ink5);
  line-height:1.75;
}
.food-intro strong{color:var(--g8)}


/* ── GLYCAEMIC INDEX ── */
.gi-badge{
  display:inline-flex;align-items:center;gap:.55rem;
  border-radius:10px;padding:.65rem 1rem;
  margin:.5rem 0 .75rem;
  border:1.5px solid;
  font-family:var(--fb);
}
.gi-score{
  font-family:var(--fd);font-size:1.6rem;font-weight:700;line-height:1;
}
.gi-info{display:flex;flex-direction:column;gap:.1rem}
.gi-label{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
.gi-class{font-size:.85rem;font-weight:700}
.gi-note{font-size:.7rem;opacity:.8;line-height:1.4}
.gi-scale{
  width:100%;height:10px;border-radius:5px;
  background:linear-gradient(to right,#16a34a 0%,#16a34a 40%,#d97706 40%,#d97706 65%,#dc2626 65%,#dc2626 100%);
  position:relative;margin:.4rem 0 .2rem;
}
.gi-scale-marker{
  position:absolute;top:-3px;width:16px;height:16px;
  border-radius:50%;background:#fff;border:2.5px solid #1a3a2a;
  transform:translateX(-50%);transition:left .4s ease;
  box-shadow:0 1px 4px rgba(0,0,0,.2);
}
.gi-scale-labels{
  display:flex;justify-content:space-between;
  font-size:.62rem;color:var(--ink4);font-weight:600;margin-top:.15rem;
}
.gi-explain{
  font-size:.75rem;color:var(--ink5);line-height:1.65;
  background:var(--ink0);border-radius:8px;padding:.7rem .9rem;margin-top:.65rem;
}
.fqs.gi-fqs{min-width:90px}

/* Sticky category tab bar */
.cat-tabs-bar{
  position:sticky;
  top:64px;
  z-index:98;
  background:var(--cream);
  border-bottom:1px solid var(--ink1);
  box-shadow:0 2px 8px rgba(0,0,0,.05);
  margin-bottom:0;
}
.cat-tabs-bar .cat-tabs{
  position:static;
  border-bottom:none;
  box-shadow:none;
  padding:.55rem 0;
  margin-bottom:0;
  background:transparent;
}