@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap');:root{--green:#153d32;--green2:#28604d;--mint:#e7efe8;--paper:#f7f6f1;--cream:#fffcf6;--ink:#24322d;--muted:#6e7770;--line:#e4e7df;--gold:#c4a46c}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:'DM Sans',Arial,sans-serif;background:var(--paper)}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #b68d41;outline-offset:3px}.top{height:78px;background:var(--green);color:white;display:flex;align-items:center;justify-content:space-between;padding:0 38px;position:sticky;top:0;z-index:20;box-shadow:0 2px 12px #0001}.brand{display:flex;align-items:center;gap:14px}.brand .mark{font:700 42px Georgia,serif}.dot{color:var(--gold)}.brand strong{display:block;letter-spacing:.16em;font-size:15px}.brand small{font-size:10px;letter-spacing:.24em;color:#c3d9cd}.pill{border:1px solid #608274;border-radius:30px;padding:9px 16px;font-size:10px;letter-spacing:.13em}.shell{display:grid;grid-template-columns:265px minmax(0,1fr);min-height:calc(100vh - 125px)}aside{background:#fff;border-right:1px solid var(--line);padding:30px 17px;position:sticky;top:78px;height:calc(100vh - 78px);overflow:auto}.sidehead{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.13em;font-weight:700;color:#8a948b;padding:0 12px 16px}.sidehead span{color:var(--green2)}nav{display:grid;gap:4px}.navitem{display:flex;gap:12px;align-items:center;width:100%;padding:12px;border:0;background:transparent;border-radius:9px;text-align:left;color:#5d685e;font-size:13px}.navitem:hover{background:#f1f5ef}.navitem.active{background:var(--mint);color:var(--green);font-weight:700}.navitem .number{width:23px;font-size:11px;color:#8d9b90}.navitem .check{margin-left:auto;color:var(--green2)}.asidefoot{background:#f3f6f0;border-radius:12px;padding:18px;margin:30px 5px 0;font-size:12px}.asidefoot p{color:var(--muted);line-height:1.6;margin-bottom:0}main{padding:0 5.2vw 80px;max-width:1260px;width:100%;margin:auto}.hero{padding:66px 0 52px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:32px}.eyebrow{font-size:11px;letter-spacing:.2em;color:var(--green2);font-weight:700;text-transform:uppercase}.hero h1,.pagehead h1{font:600 clamp(38px,5vw,68px)/1.1 'Playfair Display',Georgia,serif;color:var(--green);margin:15px 0 22px}.hero p,.pagehead p{font-size:16px;line-height:1.8;color:#69766b;max-width:560px}.heroimage{height:340px;border-radius:160px 160px 18px 18px;overflow:hidden;background:linear-gradient(145deg,#d4dfd0,#f5e9cd);display:grid;place-items:center;position:relative}.heroimage .bowl{font-size:160px;filter:drop-shadow(0 18px 13px #163b302a)}.heroimage .label{position:absolute;bottom:18px;right:18px;background:#fffef2e8;padding:10px 14px;border-radius:8px;font-size:11px;letter-spacing:.08em}.btn{background:var(--green);border:1px solid var(--green);border-radius:8px;color:white;padding:12px 20px;font-weight:700;font-size:13px}.btn:hover{background:#275d4a}.btn.secondary{background:white;color:var(--green)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:10px 0 48px}.stat{padding:22px;border:1px solid var(--line);border-radius:13px;background:white}.stat b{display:block;font:600 32px 'Playfair Display',Georgia,serif;color:var(--green)}.stat span{font-size:12px;color:var(--muted)}h2{font:600 29px 'Playfair Display',Georgia,serif;color:var(--green)}.sectiongrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.sectioncard{background:#fff;border:1px solid var(--line);border-radius:13px;padding:23px;text-align:left;min-height:155px;display:flex;flex-direction:column;align-items:flex-start}.sectioncard:hover{border-color:#96b4a4;transform:translateY(-2px)}.sectioncard .index{font-size:11px;letter-spacing:.15em;color:var(--green2)}.sectioncard strong{font:600 22px 'Playfair Display',Georgia,serif;margin:18px 0 8px}.sectioncard small{color:var(--muted)}.pagehead{padding:52px 0 26px;border-bottom:1px solid var(--line)}.pagehead h1{font-size:clamp(36px,4.5vw,56px);margin-bottom:14px}.meta{display:flex;gap:12px;flex-wrap:wrap}.meta span{background:#eaf0e7;color:#3e604e;padding:7px 12px;border-radius:50px;font-size:11px;font-weight:700}.lesson{max-width:850px}.block{background:#fff;border:1px solid var(--line);border-radius:13px;margin-top:24px;padding:28px 32px}.block h2{font-size:27px;margin:0 0 15px}.block h3{font-size:17px;color:var(--green);margin:22px 0 9px}.block p,.block li{line-height:1.8;font-size:14px}.block ul{padding-left:20px}.block li{margin-bottom:6px}.callout{border-left:4px solid var(--gold);background:#fbf7eb;padding:15px 20px;border-radius:0 8px 8px 0;margin:18px 0;font-size:13px;line-height:1.7}.two{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.mini{padding:17px;background:#f6f8f3;border-radius:10px}.mini b{color:var(--green)}.mini p{margin:6px 0 0}.quiz{background:#eaf1e9;border:1px solid #cbdccc}.quiz .question{background:white;padding:18px;border-radius:10px;margin:14px 0}.question strong{display:block;margin-bottom:12px}.option{display:block;width:100%;text-align:left;border:1px solid #dce5dc;border-radius:8px;padding:11px 13px;background:#fff;margin:7px 0;color:var(--ink)}.option:hover{background:#f4f8f3}.option.chosen{border-color:var(--green2);background:#eaf2eb}.feedback{font-size:13px;font-weight:700;margin-top:10px}.feedback.good{color:#27643d}.feedback.bad{color:#9a5824}.booklet{background:#153d32;color:white}.booklet h2{color:white}.booklet p{color:#d4e2d8}.booklet .tasks{background:#ffffff15;padding:15px 18px;border-radius:8px;line-height:1.9;font-size:14px}.bottomnav{display:flex;justify-content:space-between;gap:12px;margin-top:24px}.mobile{display:none}.notice{font-size:12px;color:var(--muted);margin:20px 0}.resource{display:inline-block;color:var(--green2);font-weight:700;text-decoration:underline;text-underline-offset:3px}footer{background:#fff;border-top:1px solid var(--line);padding:18px 38px;color:#8a958b;font-size:11px;display:flex;justify-content:space-between}@media(max-width:1000px){.sectiongrid{grid-template-columns:repeat(2,1fr)}main{padding:0 4vw 60px}.hero{gap:15px}}@media(max-width:720px){.top{height:66px;padding:0 16px}.pill{display:none}.mobile{display:block;background:transparent;color:white;border:1px solid #668577;border-radius:6px;padding:7px}.shell{display:block}aside{display:none;position:fixed;z-index:19;top:66px;left:0;bottom:0;width:285px;height:auto;box-shadow:10px 0 20px #0002}aside.open{display:block}main{padding:0 20px 50px}.hero{grid-template-columns:1fr;padding-top:34px}.heroimage{height:220px;border-radius:90px 90px 12px 12px}.heroimage .bowl{font-size:110px}.stats,.sectiongrid,.two{grid-template-columns:1fr}.stat{padding:16px}.block{padding:22px 18px}.pagehead{padding-top:30px}footer span{display:none}}

/* Frost's Foodies classroom edition */
:root{--green:#163c31;--green2:#356a4e;--paper:#f4f0e7;--cream:#fffdf8;--gold:#c8a46b;--ink:#252c28;--line:#e4ded3}
body{background:radial-gradient(circle at 85% 8%,#e9e1d1 0,transparent 36%),var(--paper)}
.top{background:#172b24;border-bottom:3px solid #bd995d}
.brand .mark{border:1px solid #bd995d;border-radius:50%;width:49px;height:49px;display:grid;place-items:center;font-size:32px;background:#ffffff0d}
.brand strong{font-size:14px;letter-spacing:.12em}.brand small{letter-spacing:.15em}
aside{background:#faf8f3}.navitem.active{background:#dfe8dd}.asidefoot{background:#e9eee5}
.hero h1,.pagehead h1{letter-spacing:-.035em}.hero h1{font-size:clamp(43px,5.5vw,78px)}
.heroimage{border-radius:16px 150px 16px 16px;box-shadow:15px 15px 0 #d7d9c7;height:370px}
.heroimage .foodphoto{height:100%;width:100%;object-fit:cover}.heroimage .label{color:#163c31;font-weight:700}
.photoframe{position:relative;overflow:hidden;background:#e2e7da;border-radius:14px;margin:22px 0 4px;min-height:190px}
.photoframe .foodphoto{display:block;width:100%;height:260px;object-fit:cover}
.photoframe figcaption{position:absolute;bottom:0;left:0;right:0;padding:13px 17px;background:linear-gradient(transparent,#12261dd9);color:white;font-size:12px;letter-spacing:.03em}
.photoframe.photo-failed{min-height:90px;background:#dce6da}.photoframe.photo-failed .foodphoto{display:none}.photoframe.photo-failed figcaption{background:none;color:#264e39}
.lesson>.photoframe{margin:26px 0 0}.lesson>.photoframe .foodphoto{height:310px}
.sectioncard{border-color:#ded8cb;box-shadow:0 4px 14px #25352c08}.sectioncard:hover{box-shadow:0 10px 24px #25352c14}
.block{box-shadow:0 3px 14px #27392b08}.eyebrow{letter-spacing:.16em}.btn{border-radius:7px}
@media(max-width:720px){.heroimage{height:245px;border-radius:14px 85px 14px 14px}.lesson>.photoframe .foodphoto{height:220px}.brand strong{font-size:11px}.brand small{font-size:9px}}

/* Topic-specific illustrations directly alongside the teaching text */
.concept-layout{display:grid;grid-template-columns:minmax(220px, .9fr) minmax(0,1.25fr);gap:24px;align-items:start}.concept-visual{margin:0;background:#f1f3e9;border:1px solid #e1e5da;border-radius:13px;overflow:hidden}.concept-visual img{display:block;width:100%;height:auto;aspect-ratio:720/230;object-fit:contain}.concept-visual figcaption{padding:9px 13px;color:#65766a;font-size:11px}.concept-copy>p:first-child{margin-top:0}.concept-copy .two{grid-template-columns:1fr 1fr}@media(max-width:850px){.concept-layout{grid-template-columns:1fr}.concept-copy .two{grid-template-columns:1fr 1fr}}@media(max-width:540px){.concept-copy .two{grid-template-columns:1fr}}

/* Version 4: black, green and white photography-first lessons */
:root{--green:#113b2c;--green2:#246b4a;--paper:#f5f7f5;--cream:#fff;--gold:#72a989;--ink:#151b18;--line:#dce5de}
body{background:#f5f7f5;color:#151b18}.top{background:#0c1510;border-bottom:3px solid #278353}.brand .mark{border-color:#4a9c70}.dot{color:#66bd8d}
aside{background:#fff}.asidefoot{background:#edf5ef}.heroimage{box-shadow:12px 12px 0 #d2e7d9}.block{background:white}.booklet{background:#103b2b}.callout{border-left-color:#3c9b65;background:#eff7f0}.sectioncard{border-color:#dce5de}.mini{background:#f0f6f1}
.concept-layout{grid-template-columns:minmax(220px, .92fr) minmax(0,1.2fr)}.photo-gallery{display:grid;gap:12px}.real-photo{margin:0;background:#f2f6f3;border:1px solid #d8e6dc;border-radius:12px;overflow:hidden}.real-photo img{display:block;width:100%;height:165px;object-fit:cover;background:#e8f0e9}.real-photo figcaption{padding:10px 12px;color:#31483a;font-size:12px;line-height:1.5}.real-photo figcaption a{display:block;font-size:11px;color:#226542;margin-top:5px}.real-photo.unavailable{padding-top:20px}.real-photo.unavailable figcaption:before{content:'Photo unavailable — ';color:#8c4d35}.visual-note{border:1px solid #cce2d3;border-radius:12px;background:#eef7f0;padding:24px;color:#21583a;font-weight:600;line-height:1.8}
@media(max-width:850px){.concept-layout{grid-template-columns:1fr}.photo-gallery{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}

/* Frost's Foodies — final green / black / white classroom look */
:root{--green:#115b39;--green2:#24734c;--paper:#f4f7f4;--ink:#121b17;--muted:#53675a;--line:#d6e4d9;--gold:#91cf9c}
.top{background:#071b12}.dot{color:#a5e6b5}aside{background:#fff}.sidehead span{color:#17613b}.navitem.active{background:#dff1e3}.eyebrow{color:#207448}.hero-final{max-width:none;grid-template-columns:1.05fr 1fr;gap:34px;padding:58px 0 45px;min-height:550px}.hero-final h1{font-family:Georgia,serif;font-size:clamp(53px,6.2vw,95px);font-weight:800;line-height:.91;letter-spacing:-.055em;color:#071b12;margin:25px 0}.hero-final h1 em{font-style:normal;color:#237848}.hero-final .hero-subtitle{display:block;font-family:'DM Sans',Arial,sans-serif;font-size:clamp(23px,3.2vw,46px);letter-spacing:.08em;line-height:1.5;color:#121b17}.hero-final .hero-subtitle i{font-style:normal;color:#2b8b54}.hero-final p{max-width:510px;font-size:17px;color:#3e5947}.hero-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.hero-actions span{font-size:10px;font-weight:800;letter-spacing:.15em;color:#43714f}.hero-collage{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:210px 160px;gap:12px}.collage-large{grid-row:span 2}.hero-collage .definition-photo{height:100%;margin:0;border-radius:14px;box-shadow:0 10px 28px #0d30121b}.hero-collage img{height:100%;width:100%;object-fit:cover}.hero-collage .definition-photo figcaption{font-size:10px;letter-spacing:.12em}.hero-collage .collage-small:last-child{display:none}.intro-banner{background:#0a281a;color:white;border-radius:14px;padding:22px 27px;display:flex;align-items:center;gap:22px;margin-bottom:22px}.intro-banner strong{font-size:13px;letter-spacing:.08em}.intro-banner span{font-size:13px;color:#d4e8d8}.definition-photo{position:relative;min-width:0;overflow:hidden;border-radius:11px;margin:0;background:#dce8de;min-height:185px}.definition-photo img{width:100%;height:210px;object-fit:cover;display:block}.definition-photo figcaption{position:absolute;bottom:0;left:0;right:0;color:white;background:linear-gradient(transparent,#061b14e8);padding:25px 13px 11px;font-size:11px;font-weight:800;line-height:1.5}.definition-photo a{color:#d8ffe0;font-size:10px;margin-left:6px}.definition-photo.image-missing{background:#e4f0e7}.definition-photo.image-missing:before{content:'Photo unavailable — see explanation';display:block;padding:35px 14px;color:#175736;font-weight:700;font-size:12px}.definition-photo.image-missing figcaption{position:relative;background:#123a27}.glossary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;width:100%}.definition-card{border:1px solid #dbe7df;border-radius:12px;overflow:hidden;background:#fff}.definition-card .definition-photo{border-radius:0;min-height:0}.definition-card .definition-photo img{height:165px}.definition-words{padding:5px 15px 15px}.definition-words h3{margin:12px 0 4px;font-size:16px}.definition-words p{margin:0;font-size:13px;line-height:1.6}.image-note{font-size:12px;color:#53675a}.concept-layout{display:grid;gap:17px}.concept-layout>.definition-photo{max-width:420px}.concept-layout>.glossary{margin:5px 0 15px}.block{max-width:none}.lesson{max-width:1000px}.sectioncard:hover{box-shadow:0 10px 25px #11391d15}.sectioncard strong{color:#102e1c}.booklet{background:#071f15}.btn{background:#17673d;border-color:#17673d}.btn:hover{background:#0d4829}.quiz{background:#e3f1e6}.pagehead h1{color:#0c3620}
@media(min-width:900px){.concept-layout:has(>.definition-photo){grid-template-columns:minmax(230px,40%) 1fr;align-items:center}.concept-layout:has(>.definition-photo) .definition-photo{width:100%}}
@media(max-width:900px){.hero-final{grid-template-columns:1fr}.hero-collage{grid-template-rows:170px 140px}.intro-banner{display:block}.intro-banner span{display:block;margin-top:7px}}
@media(max-width:600px){.hero-final{padding-top:32px;min-height:0}.hero-final h1{font-size:clamp(49px,13vw,70px)}.hero-collage{grid-template-rows:170px 125px;gap:8px}.glossary{grid-template-columns:1fr}.definition-card .definition-photo img{height:200px}.hero-final p{font-size:15px}}

.hero-type-art{height:100%;min-height:340px;background:linear-gradient(145deg,#071a12,#20563b);border:1px solid #5e9670;border-radius:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:white;letter-spacing:.12em;font-weight:900;font-size:clamp(30px,5vw,70px)}.hero-type-art span:nth-child(2){color:#9fdbb0}.hero-type-art small{font-size:12px;letter-spacing:.2em;color:#cce8d1}.concept-layout:not(:has(.definition-photo)):not(:has(figure)){display:block}

/* Independent 20-question practice quiz */
.practice-intro{border-left:5px solid #21834d}.practice-score{background:#0b301e;color:white;border-radius:15px;padding:24px;margin-top:15px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}.practice-score b{font-size:40px}.practice-score span{font-size:32px;font-weight:800;color:#9fe0b3}.practice-score p{width:100%;margin:0;color:#e0f1e5}.practice-question h2{font-size:20px;line-height:1.45}.practice-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.practice-choice{border:1px solid #d0dfd4;border-radius:11px;padding:14px;display:flex;gap:10px;align-items:center;cursor:pointer;background:#fff}.practice-choice:has(input:checked){background:#e2f3e7;border-color:#197547}.practice-choice.is-correct{background:#d7f2df;border-color:#16733b}.practice-choice.is-wrong{background:#fff0ed;border-color:#b94d42}.practice-choice input{accent-color:#197547}.practice-feedback{padding:15px;border-radius:10px;background:#f1f6f1;margin-top:15px;line-height:1.5}.practice-feedback p{margin:6px 0 0}.practice-actions{display:flex;gap:12px;flex-wrap:wrap}.practice-actions .btn:disabled{opacity:.45;cursor:not-allowed}@media(max-width:600px){.practice-options{grid-template-columns:1fr}}
