.food-page{background:var(--cream);color:var(--ink)}
.breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:25px;color:var(--muted);font-size:13px}.breadcrumb a{color:var(--purple);text-decoration:none}
.food-hero{display:grid;gap:42px;padding:48px 0 78px}.food-hero h1{font:700 clamp(42px,9vw,70px)/1.04 'Fredoka';letter-spacing:-.035em;margin:10px 0 22px}.food-hero h1 em{color:#16816e;font-style:normal}.food-hero-copy>p:not(.eyebrow){max-width:650px;color:var(--muted);font-size:17px}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:27px}
.hero-chain{display:grid;grid-template-columns:1fr auto 1fr;place-items:center;gap:10px;align-content:center;min-height:390px;padding:30px;border-radius:34px;background:#dff5ef;box-shadow:0 22px 50px rgba(21,104,88,.12)}.hero-organism{display:flex;flex-direction:column;align-items:center;gap:3px}.hero-organism span{display:grid;place-items:center;width:92px;height:92px;border-radius:28px;background:#fff;font-size:50px;box-shadow:0 10px 22px rgba(19,96,80,.1)}.hero-organism b{color:#176858}.hero-chain>i{font:700 28px 'Fredoka';font-style:normal;color:#16816e}.hero-chain>p{grid-column:1/-1;margin:16px 0 0;color:#3f6f65;text-align:center}.hero-chain .hero-organism:nth-of-type(4),.hero-chain>i:nth-of-type(3){display:none}
.concept-strip{background:#16816e;color:#fff}.concept-grid{display:grid;grid-template-columns:1fr 1fr}.concept-grid>div{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;padding:17px 7px;border-bottom:1px solid rgba(255,255,255,.18)}.concept-grid>div:nth-child(odd){border-right:1px solid rgba(255,255,255,.18)}.concept-grid span{grid-row:1/3;font-size:25px}.concept-grid strong{font:700 17px 'Fredoka'}.concept-grid small{color:#d5f2eb}
.lesson-section,.examples-section,.energy-section,.balance-section{padding:78px 0}.section-intro{max-width:790px;margin-bottom:35px}.section-intro h2,.quiz-layout h2{font:700 clamp(32px,7vw,49px)/1.1 'Fredoka';letter-spacing:-.02em;margin:7px 0 13px}.section-intro>p:last-child,.quiz-layout>div:first-child>p:last-child{color:var(--muted)}.definition-grid,.balance-grid{display:grid;gap:17px}.definition-grid article,.balance-grid article{padding:23px;border-radius:22px;background:#fff;border:1px solid var(--line)}.definition-grid article>span{font-size:38px}.definition-grid h3,.balance-grid h3{font:700 23px 'Fredoka';margin:10px 0 6px}.definition-grid p,.balance-grid p{color:var(--muted)}
.arrow-note,.thinking-box,.decomposer-row{display:grid;grid-template-columns:auto 1fr;gap:17px;align-items:start;margin-top:24px;padding:21px;border-radius:21px;background:#fff2c6}.arrow-note>span{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--yellow);font:700 28px 'Fredoka';color:#705500}.arrow-note p,.thinking-box p,.decomposer-row p{margin:5px 0 0;color:#655d3d}.arrow-note b,.thinking-box b{font:700 18px 'Fredoka'}
.levels-section{padding:80px 0;background:#242044;color:#fff}.light-intro .eyebrow{color:#a9e5d6}.light-intro>p:last-child{color:#cbc8db}.level-chain{display:grid;gap:12px}.level-chain article{position:relative;padding:22px;border-radius:22px;background:#fff;color:var(--ink);text-align:center}.level-chain>i{font:700 30px 'Fredoka';font-style:normal;color:#a9e5d6;text-align:center;transform:rotate(90deg)}.level-number{position:absolute;left:13px;top:13px;display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#dff5ef;color:#156d5b;font-weight:700}.level-emoji{display:block;font-size:46px}.level-chain h3{font:700 23px 'Fredoka';margin:7px 0 1px}.level-chain b{color:#16816e;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.level-chain p{color:var(--muted);font-size:13px}.decomposer-row{background:#353052}.decomposer-row>span{font-size:44px}.decomposer-row h3{font:700 22px 'Fredoka';margin:0}.decomposer-row p{color:#d8d5e6}
.ecosystem-tabs{display:flex;gap:9px;overflow-x:auto;padding-bottom:8px}.ecosystem-tabs button{flex:0 0 auto;padding:11px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);font-weight:700;cursor:pointer}.ecosystem-tabs button.active{border-color:#16816e;background:#dff5ef;color:#125f50}.ecosystem-display{margin-top:16px;padding:24px;border-radius:25px;background:#fff;border:1px solid var(--line)}.ecosystem-display h3{font:700 27px 'Fredoka';margin:0 0 5px}.ecosystem-display>p{color:var(--muted)}.display-chain{display:flex;align-items:center;gap:9px;overflow-x:auto;padding:18px 2px}.display-organism{display:flex;flex:0 0 102px;flex-direction:column;align-items:center;padding:12px 8px;border-radius:17px;background:#f0f8f5}.display-organism span{font-size:39px}.display-organism b{font-size:13px}.display-chain>i{flex:0 0 auto;color:#16816e;font:700 24px 'Fredoka';font-style:normal}.display-explanation{padding:15px;border-radius:16px;background:#fff6d3;color:#655d3d}
.web-section{padding:80px 0;background:#e7f6f0}.web-layout{display:grid;gap:35px;align-items:center}.web-layout h2{font:700 clamp(33px,7vw,49px)/1.1 'Fredoka';margin:7px 0 15px}.web-layout>div:first-child>p:last-of-type{color:var(--muted)}.compare-list{margin-top:20px}.compare-list p{display:flex;flex-direction:column;margin:9px 0;padding:14px;border-radius:15px;background:#fff}.compare-list b{color:#156b59}.compare-list span{color:var(--muted)}.food-web{position:relative;min-height:430px;border-radius:30px;background:#fff;overflow:hidden;box-shadow:0 17px 40px rgba(26,94,77,.1)}.web-node{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;font-size:35px}.web-node small{padding:2px 7px;border-radius:10px;background:#fff;font-weight:700;color:#3c665d;box-shadow:0 5px 12px rgba(0,0,0,.08)}.sun{left:7%;top:7%}.rice{left:11%;bottom:12%}.insect{left:39%;bottom:12%}.mouse{left:31%;top:19%}.frog{left:59%;bottom:18%}.snake{right:14%;top:31%}.eagle{right:8%;top:5%}.web-lines{position:absolute;inset:0}.web-lines span{position:absolute;height:4px;border-radius:4px;background:#9bd9c9;transform-origin:left center}.web-lines span:nth-child(1){left:16%;top:28%;width:95px;transform:rotate(75deg)}.web-lines span:nth-child(2){left:22%;bottom:21%;width:110px}.web-lines span:nth-child(3){left:22%;bottom:25%;width:116px;transform:rotate(-50deg)}.web-lines span:nth-child(4){left:49%;bottom:23%;width:92px}.web-lines span:nth-child(5){left:45%;top:31%;width:145px;transform:rotate(12deg)}.web-lines span:nth-child(6){right:12%;top:19%;width:105px;transform:rotate(112deg)}
.energy-layout{display:grid;gap:28px;align-items:center}.energy-pyramid{display:flex;flex-direction:column;align-items:center;gap:7px}.energy-pyramid>div{display:flex;align-items:center;justify-content:center;gap:9px;height:58px;border-radius:14px;background:#5b4bdb;color:#fff}.energy-pyramid>div:nth-child(1){width:44%}.energy-pyramid>div:nth-child(2){width:61%;background:#6e60df}.energy-pyramid>div:nth-child(3){width:79%;background:#238f78}.energy-pyramid>div:nth-child(4){width:100%;background:#16816e}.energy-pyramid span{font-size:28px}.energy-pyramid b{font-size:13px}.energy-pyramid small{display:none}.energy-copy h3{font:700 28px 'Fredoka';margin:0}.energy-copy>p{color:var(--muted)}.fact-box{display:grid;grid-template-columns:auto 1fr;gap:13px;padding:18px;border-radius:18px;background:#fff2c6}.fact-box span{font-size:28px}.fact-box p{margin:0;color:#655d3d}
.builder-section{padding:80px 0;background:#16816e;color:#fff}.builder-layout{display:grid;gap:28px}.builder-card{padding:23px;border-radius:25px;background:#fff;color:var(--ink);box-shadow:0 22px 45px rgba(7,58,48,.23)}.builder-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.builder-top label{font-weight:700}.builder-top select{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}.builder-target{display:flex;align-items:center;gap:8px;min-height:90px;margin:18px 0;padding:13px;overflow-x:auto;border:2px dashed #b7dcd3;border-radius:18px;background:#f4fbf8}.target-slot{display:flex;flex:0 0 78px;flex-direction:column;align-items:center}.target-slot span{font-size:32px}.target-slot b{font-size:11px}.target-arrow{flex:0 0 auto;color:#16816e;font-weight:700}.target-empty{color:var(--muted)}.builder-options{display:flex;flex-wrap:wrap;gap:9px}.builder-options button{padding:10px 12px;border:1px solid #d8d4e4;border-radius:13px;background:#fff;color:var(--ink);font-weight:700;cursor:pointer}.builder-options button:hover:not(:disabled){border-color:#16816e;background:#e6f6f1}.builder-options button:disabled{opacity:.38}.builder-options button.wrong{border-color:var(--coral);background:#fff0ed}.builder-feedback{min-height:28px;color:var(--muted)}.builder-feedback.success{color:#19745f;font-weight:700}.reset-button{padding:0;border:0;background:transparent;color:var(--purple);font-weight:700;cursor:pointer}
.balance-grid article>span{display:inline-grid;place-items:center;min-width:58px;height:47px;padding:0 10px;border-radius:14px;background:#dff5ef;font:700 22px 'Fredoka'}.thinking-box>span{font-size:32px}
.quiz-section{padding:78px 0;background:#fff0d5}.quiz-layout{display:grid;gap:28px}.quiz-card{padding:25px;border-radius:25px;background:#fff;box-shadow:0 17px 40px rgba(78,55,15,.1)}.quiz-progress{display:flex;justify-content:space-between;gap:15px;color:var(--muted);font-size:13px}.quiz-card h3{font:700 24px/1.25 'Fredoka';margin:22px 0 17px}.quiz-options{display:grid;gap:10px}.quiz-options button{width:100%;padding:13px 15px;border:1px solid #d9d4e8;border-radius:13px;background:#fff;text-align:left;color:var(--ink);font-weight:700;cursor:pointer}.quiz-options button:hover:not(:disabled){border-color:var(--purple);background:#f4f2ff}.quiz-options button.correct{border-color:#2d8252;background:#e6f7eb;color:#1e6640}.quiz-options button.wrong{border-color:#d85b47;background:#ffebe7;color:#923c2e}.quiz-feedback{min-height:50px;color:var(--muted)}
.remember-section{display:grid;gap:22px;padding:78px 0}.remember-card,.next-card{padding:27px;border-radius:26px}.remember-card{background:#dff5ef}.remember-card h2,.next-card h2{font:700 30px/1.12 'Fredoka';margin:8px 0 15px}.remember-card ol{padding-left:22px}.remember-card li{margin:9px 0}.next-card{background:#fff;border:1px solid var(--line)}.next-card>span{font-size:42px}.next-card p:not(.eyebrow){color:var(--muted)}.food-share{padding:65px 0;background:#242044}.share-panel{display:grid;gap:18px;align-items:center;color:#fff}.share-panel .eyebrow{color:#a9e5d6}.share-panel h2{font:700 32px 'Fredoka';margin:5px 0}.share-panel p{margin:0}.share-panel .button{justify-self:start;background:#fff;color:#126352}.share-panel #shareFeedback{grid-column:1/-1;min-height:18px;color:#b8f2de}
@media(min-width:700px){.concept-grid{grid-template-columns:repeat(4,1fr)}.concept-grid>div{border-bottom:0;border-right:1px solid rgba(255,255,255,.18)!important}.concept-grid>div:last-child{border-right:0!important}.definition-grid,.balance-grid{grid-template-columns:repeat(2,1fr)}.level-chain{grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center}.level-chain>i{transform:none}.energy-layout,.builder-layout,.quiz-layout,.remember-section{grid-template-columns:1fr 1fr}.share-panel{grid-template-columns:1fr auto}.hero-chain{grid-template-columns:1fr auto 1fr auto 1fr auto 1fr}.hero-chain .hero-organism:nth-of-type(4),.hero-chain>i:nth-of-type(3){display:flex}.hero-chain>i:nth-of-type(3){display:block}.energy-pyramid small{display:inline}}
@media(min-width:900px){.food-hero{grid-template-columns:1.05fr .95fr;align-items:center;gap:65px;padding:72px 0 100px}.definition-grid{grid-template-columns:repeat(4,1fr)}.web-layout{grid-template-columns:.8fr 1.2fr}.energy-layout{grid-template-columns:1.08fr .92fr}.balance-grid{grid-template-columns:repeat(3,1fr)}.quiz-layout{grid-template-columns:.8fr 1.2fr}.share-panel h2{font-size:39px}}
@media(max-width:560px){.food-hero{padding-top:32px}.hero-chain{min-height:350px;padding:20px 14px}.hero-organism span{width:75px;height:75px;font-size:40px}.concept-grid>div{padding:15px 6px}.lesson-section,.levels-section,.examples-section,.web-section,.energy-section,.builder-section,.balance-section,.quiz-section{padding:62px 0}.arrow-note,.thinking-box{grid-template-columns:1fr}.food-web{min-height:390px}.builder-card{padding:19px}.share-panel h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}