:root{
 --bg:#070b12;--bg2:#0b1220;--ink:#e7eef7;--muted:#8ea3bd;--line:rgba(120,160,210,.16);
 --cyan:#27e0ff;--mag:#b06bff;--lime:#7bffb0;--card:rgba(20,30,48,.55);
 --veg:#51cf66;--grain:#f6c177;--prot:#ff8787;--oil:#ffd43b;--water:#74c0fc}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:'Manrope',system-ui,sans-serif;color:var(--ink);background:var(--bg);
 line-height:1.65;overflow-x:hidden}
a{color:var(--cyan);text-decoration:none}a:hover{color:#7af0ff}
h1,h2,h3,.brand,.btn{font-family:'Space Grotesk','Manrope',sans-serif}
.bg-grid{position:fixed;inset:0;z-index:-2;background:
 linear-gradient(var(--bg2),var(--bg)),
 repeating-linear-gradient(90deg,rgba(80,140,200,.05) 0 1px,transparent 1px 56px),
 repeating-linear-gradient(0deg,rgba(80,140,200,.05) 0 1px,transparent 1px 56px)}
.bg-glow{position:fixed;inset:0;z-index:-1;pointer-events:none;background:
 radial-gradient(60vw 50vh at 75% -5%,rgba(39,224,255,.16),transparent 60%),
 radial-gradient(50vw 40vh at 10% 8%,rgba(176,107,255,.14),transparent 60%)}
main{max-width:1040px;margin:0 auto;padding:34px 20px 70px}
/* nav */
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
 padding:12px 20px;background:rgba(8,13,22,.7);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:19px;color:var(--ink)}
.brand b{color:var(--cyan);font-weight:700}.logo{font-size:22px;filter:drop-shadow(0 0 8px rgba(39,224,255,.6))}
.menu{display:flex;flex-wrap:wrap;gap:2px 14px;margin-left:auto}
.menu a{color:var(--muted);font-size:13.5px;padding:5px 2px;position:relative;transition:.2s}
.menu a:hover{color:var(--ink)}.menu a.active{color:var(--cyan)}
.menu a.active::after,.menu a:hover::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;
 background:linear-gradient(90deg,var(--cyan),var(--mag));border-radius:2px;box-shadow:0 0 8px var(--cyan)}
.nt{display:none}.burger{display:none}
/* reveal */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
[data-reveal].in{opacity:1;transform:none}
/* headings */
h1{font-size:40px;line-height:1.12;margin:.1em 0 .35em;letter-spacing:-.5px}
h2{font-size:26px;margin:1.7em 0 .5em;letter-spacing:-.3px}
h3{font-size:18px;margin:1.1em 0 .3em}
.grad{background:linear-gradient(100deg,var(--cyan),var(--mag) 60%,var(--lime));
 -webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:18px;color:#c4d3e6;max-width:70ch}
.tagline{font-family:'JetBrains Mono',monospace;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
 color:var(--cyan);opacity:.85;margin-bottom:10px}
/* hero */
.hero,.anat-hero{position:relative;background:linear-gradient(160deg,rgba(20,32,54,.7),rgba(10,16,28,.5));
 border:1px solid var(--line);border-radius:22px;padding:44px 38px;overflow:hidden;
 box-shadow:0 30px 70px -30px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.04)}
.hero h1{font-size:46px}
.hero-cta{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(100deg,var(--cyan),var(--mag));
 color:#06101c;font-weight:700;padding:12px 22px;border-radius:12px;border:0;cursor:pointer;
 transition:.2s;box-shadow:0 8px 26px -6px rgba(39,224,255,.5)}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 34px -6px rgba(176,107,255,.6);color:#06101c}
.btn i{font-style:normal;transition:.2s}.btn:hover i{transform:translateX(4px)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid rgba(120,200,255,.4);box-shadow:none}
.btn.ghost:hover{border-color:var(--cyan);color:var(--cyan)}
.stats{display:flex;flex-wrap:wrap;gap:26px;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.stats b{display:block;font-family:'Space Grotesk';font-size:26px;color:var(--cyan)}
.stats span{font-size:13px;color:var(--muted);max-width:18ch;display:block}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:16px}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;
 display:block;color:var(--ink);overflow:hidden;backdrop-filter:blur(8px);transition:.28s cubic-bezier(.2,.7,.2,1)}
a.card::before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px;opacity:0;transition:.28s;
 background:linear-gradient(120deg,var(--cyan),var(--mag));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
a.card:hover{transform:translateY(-6px) scale(1.025);box-shadow:0 24px 50px -24px rgba(39,224,255,.5)}
a.card:hover::before{opacity:1}
.card-ico{font-size:28px;filter:drop-shadow(0 0 10px rgba(39,224,255,.35))}
.card-t{font-weight:800;margin:8px 0 4px;font-size:17px}.card-d{font-size:14px;color:var(--muted)}
.card-arrow{position:absolute;right:18px;bottom:16px;color:var(--cyan);opacity:0;transform:translateX(-6px);transition:.28s}
a.card:hover .card-arrow{opacity:1;transform:none}
.card.static:hover{transform:translateY(-4px)}
/* callout / note */
.callout{background:linear-gradient(120deg,rgba(39,224,255,.06),rgba(176,107,255,.06));
 border:1px solid var(--line);border-left:3px solid var(--cyan);border-radius:14px;padding:22px 26px;margin-top:28px}
.note{background:rgba(255,210,90,.06);border:1px solid rgba(255,210,90,.22);border-left:3px solid var(--oil);
 border-radius:12px;padding:14px 18px;margin:22px 0;font-size:15px;color:#dfe8f2}
/* steps */
.steps{list-style:none;padding:0;counter-reset:s}
.steps li{position:relative;padding:12px 0 12px 46px;border-bottom:1px solid var(--line);counter-increment:s}
.steps li::before{content:counter(s);position:absolute;left:0;top:11px;width:30px;height:30px;border-radius:9px;
 background:linear-gradient(135deg,var(--cyan),var(--mag));color:#06101c;font-weight:800;
 display:flex;align-items:center;justify-content:center;box-shadow:0 0 14px -2px var(--cyan)}
/* tables */
.tbl{width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;overflow:hidden;border-radius:12px}
.tbl th,.tbl td{border:1px solid var(--line);padding:10px 13px;text-align:left;vertical-align:top}
.tbl th{background:rgba(39,224,255,.10);color:var(--ink);font-family:'Space Grotesk'}
.tbl tr:nth-child(even) td{background:rgba(255,255,255,.02)}.tbl.menu td{font-size:14px}
/* plate */
.plate{margin:18px 0}.plate-row{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line)}
.sw{width:18px;height:18px;border-radius:6px;flex:0 0 18px;margin-top:4px;box-shadow:0 0 10px -1px currentColor}
.sw.veg{background:var(--veg);color:var(--veg)}.sw.grain{background:var(--grain);color:var(--grain)}
.sw.prot{background:var(--prot);color:var(--prot)}.sw.oil{background:var(--oil);color:var(--oil)}.sw.water{background:var(--water);color:var(--water)}
.myth{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:4px 20px 14px;margin:14px 0}
.myth h3{color:var(--cyan)}.src li{margin:9px 0}
/* anatomy */
.anat-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:start;margin-top:18px}
.anat-stage{background:radial-gradient(80% 70% at 50% 20%,rgba(39,224,255,.08),transparent),var(--card);
 border:1px solid var(--line);border-radius:20px;padding:16px;position:relative}
.anat-controls{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.seg{display:inline-flex;background:rgba(10,16,28,.7);border:1px solid var(--line);border-radius:11px;padding:3px}
.seg-b{background:transparent;border:0;color:var(--muted);font-weight:700;padding:7px 16px;border-radius:8px;cursor:pointer;font-family:'Space Grotesk';transition:.2s}
.seg-b.active{background:linear-gradient(100deg,var(--cyan),var(--mag));color:#06101c;box-shadow:0 0 16px -3px var(--cyan)}
.reset{background:rgba(10,16,28,.7);border:1px solid var(--line);color:var(--cyan);border-radius:10px;padding:7px 12px;cursor:pointer;font-size:13px}
.reset.hidden{display:none}
#figure{width:100%;height:auto;max-height:62vh;display:block}
#scene{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.muscles .m,.muscles g.m *{fill:rgba(39,224,255,.16);stroke:rgba(39,224,255,.5);stroke-width:1;cursor:pointer;
 transition:fill .2s,stroke .2s,filter .2s}
.muscles .m:hover,.muscles g.m:hover *{fill:rgba(123,255,176,.4);stroke:var(--lime)}
.m.sel,g.m.sel *{fill:rgba(176,107,255,.5);stroke:var(--mag);filter:url(#glow)}
.mannequin.female .silhouette .torso{transform:scaleX(.92);transform-origin:130px 180px}
.mannequin.female .silhouette .hips{transform:scaleX(1.16);transform-origin:130px 270px}
.mannequin.female .muscles{--sh:.9}
.anat-panel{position:sticky;top:84px;background:var(--card);border:1px solid var(--line);border-radius:18px;
 padding:22px;min-height:260px;backdrop-filter:blur(8px)}
.panel-empty{text-align:center;color:var(--muted);padding:36px 10px}.pe-ico{font-size:40px;opacity:.5;margin-bottom:8px}
.panel-h{font-family:'Space Grotesk';font-size:22px;color:var(--ink);margin:0 0 4px}
.panel-tag{font-family:'JetBrains Mono';font-size:12px;color:var(--cyan);letter-spacing:.1em;text-transform:uppercase}
.panel-sec{margin-top:16px}.panel-sec h4{margin:0 0 4px;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.panel-food{background:rgba(123,255,176,.08);border:1px solid rgba(123,255,176,.25);border-radius:12px;padding:12px 14px;margin-top:6px}
/* footer */
.foot{background:linear-gradient(0deg,#05080e,transparent);border-top:1px solid var(--line);margin-top:50px;padding:36px 20px 22px}
.foot-cols{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:26px}
.foot-brand{font-family:'Space Grotesk';font-weight:700;color:var(--ink);font-size:18px;margin-bottom:6px}
.foot-h{color:var(--ink);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.foot-links a{color:var(--muted);font-size:13.5px}.foot-links a:hover{color:var(--cyan)}
.muted{color:var(--muted);font-size:13px}
.foot-bottom{max-width:1040px;margin:22px auto 0;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
@media(max-width:840px){.anat-wrap{grid-template-columns:1fr}.anat-panel{position:static}}
@media(max-width:680px){
 .burger{display:flex;flex-direction:column;gap:5px;margin-left:auto;cursor:pointer;padding:6px}
 .burger span{width:24px;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
 .nt:checked~.burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 .nt:checked~.burger span:nth-child(2){opacity:0}
 .nt:checked~.burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
 .menu{display:none;width:100%;flex-direction:column;gap:0;margin-top:8px}
 .nt:checked~.menu{display:flex}.menu a{padding:10px 0;border-bottom:1px solid var(--line)}
 .hero,.anat-hero{padding:30px 22px}.hero h1{font-size:32px}h1{font-size:30px}
 .foot-cols{grid-template-columns:1fr}
}
