:root { --ink:#101523; --muted:#596779; --line:#dfe6ee; --blue:#3764db; --orange:#cf7307; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
h2[id] { scroll-margin-top:110px; }
body { margin:0; font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:#fffdf8; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.wrap { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.site-nav { position:sticky; top:0; z-index:60; background:#fff; }
.nav-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:86px; }
.brand,.footer-brand { display:inline-flex; align-items:center; gap:11px; font-size:1.1rem; font-weight:900; }
.brand img,.footer-brand img { width:44px; height:44px; object-fit:contain; }
.main-links { display:flex; align-items:center; gap:24px; font-size:.9rem; font-weight:750; }
.nav-actions { display:flex; align-items:center; gap:10px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:12px 20px; border:1px solid var(--line); border-radius:999px; background:#fff; font-size:.9rem; font-weight:800; text-align:center; }
.button.primary { border-color:transparent; color:#fff; background:linear-gradient(120deg,#e98a0a,#b85502); }
a:focus-visible { outline:3px solid var(--blue); outline-offset:5px; }
.food-hero { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.7fr); gap:70px; align-items:center; padding:76px 0 64px; }
.eyebrow { display:block; margin-bottom:18px; color:#93600e; text-transform:uppercase; letter-spacing:.13em; font-size:.72rem; font-weight:850; }
h1 { margin:0; font-size:clamp(2.6rem,5vw,4.4rem); font-weight:850; letter-spacing:-.065em; line-height:1.03; }
h1 span { color:var(--blue); }
.hero-lead { max-width:650px; margin:24px 0 0; font-size:1.06rem; line-height:1.75; color:var(--muted); }
.app-note { padding:30px; border:1px solid #e9e3d7; border-radius:24px; background:#f6f0e3; }
.note-label { color:#775014; text-transform:uppercase; letter-spacing:.11em; font-size:.68rem; font-weight:800; }
.app-note h2 { margin:14px 0; font-size:1.45rem; letter-spacing:-.035em; line-height:1.2; }
.app-note p { font-size:.92rem; line-height:1.7; color:#5f5a50; }
.app-note a { display:inline-block; margin-top:8px; min-height:44px; padding-block:12px; font-size:.88rem; font-weight:800; }
.dishes-section { padding:20px 0 76px; }
.section-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.66fr); gap:48px; align-items:end; margin-bottom:30px; }
.section-heading h2 { margin:0; font-size:clamp(2.1rem,3.6vw,3.15rem); letter-spacing:-.055em; line-height:1.07; }
.section-heading p { max-width:400px; margin:0 0 4px; color:var(--muted); font-size:.98rem; line-height:1.7; }
.dishes-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.dish-card { min-width:0; border:1px solid #e9e3da; border-radius:24px; overflow:hidden; background:#fff; }
.dish-photo { position:relative; aspect-ratio:3 / 2; overflow:hidden; background:#21211f; }
.dish-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.dish-copy { padding:26px; }
.dish-country { color:#8b5d22; font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; font-weight:800; }
.dish-copy h3 { margin:9px 0 12px; font-size:1.55rem; line-height:1.15; letter-spacing:-.035em; }
.dish-copy p { margin:0; color:var(--muted); font-size:.91rem; line-height:1.65; }
.photo-caption { margin:14px 4px 0; font-size:.76rem; color:var(--muted); }
.nutrition-section { padding:74px 0; border-block:1px solid #e3e9ef; background:#f2f6fc; }
.nutrition-layout { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1fr); gap:80px; align-items:center; }
.app-preview { width:min(100%,292px); margin:0 auto; }
.app-preview img { display:block; width:100%; height:auto; border:7px solid #111b2c; border-radius:31px; box-shadow:0 22px 50px #21354f20; }
.app-preview figcaption { padding-top:16px; text-align:center; font-size:.77rem; color:var(--muted); }
.nutrition-copy h2 { margin:0 0 24px; font-size:clamp(2.15rem,3.5vw,3.2rem); line-height:1.07; letter-spacing:-.055em; }
.nutrition-copy>p { color:var(--muted); font-size:1rem; line-height:1.75; }
.recipe-example { margin-top:28px; padding-top:24px; border-top:1px solid #dbe2ed; }
.recipe-example>span { color:#486076; font-size:.73rem; text-transform:uppercase; letter-spacing:.1em; font-weight:750; }
.recipe-example h3 { margin:9px 0; font-size:1.4rem; letter-spacing:-.03em; }
.recipe-example p { margin:0; color:var(--muted); font-size:.88rem; }
.macro-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:24px 0; }
.macro-grid div { min-width:0; padding:16px 10px; border-radius:15px; background:#fff; }
.macro-grid dt { margin-bottom:10px; color:var(--muted); font-size:.72rem; }
.macro-grid dd { margin:0; font-size:1.6rem; font-weight:850; letter-spacing:-.04em; }
.macro-grid dd span { font-size:.8rem; font-weight:650; letter-spacing:0; }
.nutrition-copy .nutrition-note { font-size:.8rem; line-height:1.65; margin-bottom:25px; }
.site-footer { background:#fff; }
.footer-cta { display:flex; align-items:center; justify-content:space-between; gap:30px; padding-block:50px; border-bottom:1px solid var(--line); }
.footer-cta h2 { margin:0 0 12px; font-size:1.8rem; line-height:1.1; letter-spacing:-.04em; }
.footer-cta p { max-width:650px; margin:0; color:var(--muted); font-size:.95rem; line-height:1.65; }
.footer-links { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:25px; padding-block:40px; }
.footer-column { display:flex; flex-direction:column; gap:14px; font-size:.84rem; }
.footer-column strong { margin-bottom:4px; }
.footer-column a { color:var(--muted); line-height:1.4; }
.footer-column a:hover { color:var(--blue); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:25px; padding-block:24px; border-top:1px solid var(--line); font-size:.74rem; color:var(--muted); }
.footer-bottom>span:nth-child(2) { max-width:530px; line-height:1.6; }
@media(max-width:1000px) { .food-hero { gap:32px; } .nutrition-layout { gap:36px; } .main-links { gap:14px; } .macro-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:800px) { .food-hero { grid-template-columns:1fr; padding-top:44px; } .app-note { max-width:620px; } .section-heading { grid-template-columns:1fr; gap:20px; } .section-heading p { max-width:none; } .dishes-grid { gap:14px; } .dish-copy { padding:17px; } .dish-copy h3 { font-size:1.15rem; } .footer-links { grid-template-columns:repeat(3,minmax(0,1fr)); } .main-links { display:none; } }
@media(max-width:600px) { .wrap { width:calc(100% - 32px); } .nav-inner { gap:10px; min-height:76px; } .brand { gap:8px; font-size:.95rem; } .brand img { width:36px; height:36px; } .nav-actions .button { padding-inline:12px; font-size:.75rem; } h1 { font-size:2.8rem; } .food-hero { padding-bottom:40px; } .dishes-grid { grid-template-columns:1fr; gap:24px; } .dish-copy { padding:26px; } .dish-copy h3 { font-size:1.4rem; } .nutrition-layout { display:flex; flex-direction:column-reverse; gap:36px; } .nutrition-section { padding-block:48px; } .nutrition-copy h2 { font-size:2.25rem; } .nutrition-copy { width:100%; } .app-preview { width:min(100%,292px); } .footer-cta,.footer-bottom { align-items:flex-start; flex-direction:column; } .footer-links { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:370px) { .brand span { font-size:.85rem; } .nav-actions .button { padding-inline:9px; font-size:.7rem; } h1 { font-size:2.4rem; } }
@media(prefers-reduced-motion: reduce) and (min-width: 99999px) { html { scroll-behavior:auto; } }
