:root{--bg:#fbf7f1;--paper:#fffdf9;--ink:#241914;--coffee:#5a3828;--caramel:#c78345;--sugar:#e8a34f;--muted:#756b64;--line:#e8ddd2;--shadow:0 12px 34px rgba(36,25,20,.07);--radius:20px;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.55}
body:before{content:"";display:block;height:4px;background:linear-gradient(90deg,var(--espresso,var(--ink)),var(--caramel),var(--sugar))}
a{color:inherit}button,input,select{font:inherit}
header,.topbar,.site-header{position:sticky;top:0;z-index:50;background:rgba(251,247,241,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.container,main>section>div,.content{width:min(var(--max),calc(100% - 28px));margin-inline:auto}
.brand,.logo{font-weight:950;letter-spacing:-.04em;text-decoration:none}
nav a{font-weight:750;text-decoration:none;color:var(--muted)}
h1,h2,h3{letter-spacing:-.045em;line-height:1.08}h1{font-size:clamp(2.4rem,6vw,5rem)}h2{font-size:clamp(1.8rem,4vw,3rem)}
.card,.product-card,.panel,.tile,.box,.compare-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card,.product-card,.panel,.tile,.box{padding:20px}
button,.btn,.button,a[role=button]{border-radius:12px!important}
button,.btn,.button{background:var(--ink);color:white;border:0;padding:11px 16px;font-weight:850;cursor:pointer}
input,select{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:var(--ink)}
table{width:100%;border-collapse:separate;border-spacing:0;background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
th{background:#f2e9df;text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}
th,td{padding:12px 14px;border-bottom:1px solid var(--line)}tr:last-child td{border-bottom:0}
.metric,.stat,.nutrition-stat{border-radius:16px;background:#f4ece4;padding:14px}
.sugar,.sugar-value,.sugar-number,.hero-sugar{font-weight:950;letter-spacing:-.08em;color:var(--ink)}
.sugar-number,.hero-sugar{font-size:clamp(3rem,7vw,5.5rem);line-height:.95}
.badge,.chip,.tag{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:7px 11px;font-size:.8rem;font-weight:800}
footer{margin-top:60px;padding:45px 0 90px;border-top:1px solid var(--line);color:var(--muted)}
img{max-width:100%;height:auto}
@media(max-width:700px){body{font-size:.94rem}.container,main>section>div,.content{width:calc(100% - 20px)}table{display:block;overflow-x:auto;white-space:nowrap}.grid,.cards,.product-grid{grid-template-columns:1fr!important}.desktop-nav{display:none!important}.mobile-nav{display:grid!important;position:fixed;left:0;right:0;bottom:0;z-index:100;grid-template-columns:repeat(4,1fr);background:rgba(255,253,249,.97);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:7px 5px calc(7px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px rgba(36,25,20,.08)}.mobile-nav a{text-align:center;text-decoration:none;color:var(--muted);font-size:.7rem;font-weight:850}.mobile-nav a span{display:block;font-size:1.2rem;line-height:1.1}.mobile-nav a.active{color:var(--ink)}footer{padding-bottom:100px}}
.mobile-nav{display:none}