/* Eastwood Eats design system tokens (from Claude Design project) */
@import url('https://fonts.googleapis.com/css2?family=Bitter:ital,wght@0,400;0,500;0,600;0,700;0,800;1,500&family=Poppins:wght@400;500;600;700;800&display=swap');

:root {
  --green-900:#16301c;--green-800:#1e4126;--green-700:#26512f;--green-600:#316a3c;--green-500:#3f8a4d;--green-100:#e3ecdf;--green-050:#eef3e6;
  --orange-800:#8a3c1c;--orange-700:#a84a22;--orange-600:#c9572a;--orange-500:#d76e3f;--orange-400:#e2905f;--orange-100:#f6ddc8;
  --cream-100:#fbf3e4;--cream-200:#f8e5cb;--cream-300:#f0d9b6;--cream-400:#e3c79a;
  --ink-900:#201c16;--ink-700:#3c352a;--ink-500:#5c5245;--ink-300:#8a7f70;--ink-100:#c9bfae;
  --white:#fffdf8;

  --color-primary:var(--green-700);--color-primary-hover:var(--green-800);--color-primary-active:var(--green-900);
  --color-accent:var(--orange-600);--color-accent-hover:var(--orange-700);--color-accent-active:var(--orange-800);
  --surface-page:var(--cream-200);--surface-card:var(--cream-100);--surface-card-alt:var(--white);--surface-sunken:var(--cream-300);
  --text-body:var(--ink-900);--text-muted:var(--ink-500);--text-faint:var(--ink-300);--text-on-dark:var(--cream-100);--text-on-accent:var(--white);
  --border-subtle:var(--ink-100);--border-strong:var(--ink-700);

  --font-display:'Bitter',Georgia,'Times New Roman',serif;
  --font-heading:'Poppins','Segoe UI',sans-serif;
  --font-body:'Poppins','Segoe UI',sans-serif;
  --text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-md:1.125rem;--text-lg:1.375rem;
  --text-xl:1.75rem;--text-2xl:2.25rem;--text-3xl:3rem;--text-4xl:4rem;
  --leading-tight:1.1;--leading-snug:1.3;--leading-normal:1.55;
  --tracking-wide:.04em;--tracking-wider:.09em;

  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;
  --radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-pill:999px;
  --shadow-sm:0 1px 3px rgba(32,28,22,.08);--shadow-md:0 6px 20px rgba(32,28,22,.12);--shadow-lg:0 14px 40px rgba(32,28,22,.16);
  --border-width:1.5px;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --duration-fast:120ms;--duration-normal:200ms;

  --container:1160px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4,p{margin:0}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--space-5)}
.icon{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}

/* Shared type */
.eyebrow{font-family:var(--font-heading);font-weight:600;font-size:var(--text-xs);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--color-accent)}
.section-title{font-family:var(--font-display);font-weight:700;font-size:var(--text-2xl);line-height:var(--leading-snug);color:var(--color-primary)}
.lead{color:var(--text-muted);font-size:var(--text-base)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-heading);font-weight:600;font-size:var(--text-sm);text-decoration:none;border:var(--border-width) solid transparent;border-radius:var(--radius-pill);padding:12px 22px;cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn .icon{width:16px;height:16px}
.btn-primary{background:var(--color-primary);color:var(--text-on-dark)}
.btn-primary:hover{background:var(--color-primary-hover)}
.btn-primary:active{background:var(--color-primary-active)}
.btn-accent{background:var(--color-accent);color:var(--text-on-accent)}
.btn-accent:hover{background:var(--color-accent-hover)}
.btn-accent:active{background:var(--color-accent-active)}
.btn-outline{border-color:var(--color-primary);color:var(--color-primary);background:transparent}
.btn-outline:hover{background:var(--color-primary);color:var(--text-on-dark)}
.btn-outline-light{border-color:var(--cream-100);color:var(--cream-100);background:transparent}
.btn-outline-light:hover{background:var(--cream-100);color:var(--green-800)}
.btn-lg{padding:15px 28px;font-size:var(--text-base)}
:focus-visible{outline:3px solid var(--orange-400);outline-offset:2px}

/* Nav */
.nav{position:sticky;top:0;z-index:20;background:var(--surface-card);border-bottom:var(--border-width) solid var(--border-subtle)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);height:76px}
.brand{display:flex;align-items:center;gap:var(--space-3);text-decoration:none}
.brand-name{display:block;font-family:var(--font-display);font-weight:800;font-size:var(--text-xl);line-height:1;color:var(--color-accent);letter-spacing:.01em;white-space:nowrap}
.brand-sub{display:block;margin-top:4px;font-family:var(--font-heading);font-weight:600;font-size:10px;letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--color-primary);white-space:nowrap}
.nav-links{display:flex;gap:var(--space-6);list-style:none;margin:0;padding:0}
.nav-links a{font-family:var(--font-heading);font-weight:500;font-size:var(--text-sm);text-decoration:none;color:var(--text-body);padding:6px 0;border-bottom:2px solid transparent;transition:border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}
.nav-links a:hover,.nav-links a.active{color:var(--color-primary);border-bottom-color:var(--color-accent)}
.nav-actions{display:flex;gap:var(--space-2)}

/* Hero: full-bleed photo with copy over a green fade, as in the layout template */
.hero{position:relative;overflow:hidden;background:var(--green-900);color:var(--text-on-dark)}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 45%;z-index:0}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,48,28,.94) 0%,rgba(22,48,28,.82) 30%,rgba(22,48,28,.25) 60%,rgba(22,48,28,0) 75%);z-index:1}
.hero-inner{position:relative;z-index:2;display:flex;align-items:center;min-height:500px;padding-top:var(--space-8);padding-bottom:var(--space-8)}
.hero-copy{max-width:470px}
.hero .eyebrow{color:var(--orange-400)}
.hero h1{margin-top:var(--space-2);font-family:var(--font-display);font-weight:800;font-size:var(--text-4xl);line-height:var(--leading-tight);color:var(--white)}
.hero-sub{margin-top:var(--space-2);font-family:var(--font-heading);font-weight:600;font-size:var(--text-md);letter-spacing:.18em;text-transform:uppercase;color:var(--orange-400)}
.hero-text{margin-top:var(--space-4);font-size:var(--text-md);color:var(--cream-100)}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}
.hero-tag{position:absolute;z-index:2;right:var(--space-5);bottom:var(--space-5);background:var(--surface-card);color:var(--color-primary);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);box-shadow:var(--shadow-md);font-family:var(--font-heading);font-weight:600;font-size:var(--text-sm);display:flex;align-items:center;gap:var(--space-2)}
.hero-tag .icon{color:var(--color-accent)}

/* Features strip */
.features{background:var(--surface-card);border-bottom:var(--border-width) solid var(--border-subtle)}
.features ul{list-style:none;margin:0 auto;padding-top:var(--space-6);padding-bottom:var(--space-6);display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-5)}
.features li{display:flex;align-items:center;gap:var(--space-3)}
.features .icon{width:34px;height:34px;color:var(--color-primary);stroke-width:1.5}
.features strong{display:block;font-family:var(--font-heading);font-weight:600;font-size:var(--text-sm);color:var(--color-primary)}
.features span{font-size:var(--text-xs);color:var(--text-muted)}

/* About */
.about{padding:var(--space-9) 0}
.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);align-items:center}
.about-art{border:var(--border-width) solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);max-width:460px;justify-self:center}
.about-art img{width:100%}
.about h2{margin-top:var(--space-2)}
.about p{margin-top:var(--space-4);color:var(--text-muted)}
.about p.first{color:var(--text-body);font-size:var(--text-md)}

/* Menu */
.menu{background:var(--surface-card);padding:var(--space-9) 0;border-top:var(--border-width) solid var(--border-subtle);border-bottom:var(--border-width) solid var(--border-subtle)}
.menu-head{text-align:center;max-width:760px;margin:0 auto var(--space-7)}
.menu-head h2{margin-top:var(--space-2)}
.menu-head p{margin-top:var(--space-3)}
.menus{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}
.menu-group{display:flex;flex-direction:column}
.menu-group .menu-grid{flex:1}
.menu-group-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;padding-bottom:var(--space-3);margin-bottom:var(--space-5);border-bottom:var(--border-width) solid var(--border-subtle)}
.menu-group-head h3{font-family:var(--font-display);font-weight:700;font-size:var(--text-lg);color:var(--color-primary)}
.served{display:inline-flex;align-items:center;gap:6px;background:var(--orange-100);color:var(--color-accent-hover);border-radius:var(--radius-pill);padding:5px 12px;font-family:var(--font-heading);font-weight:600;font-size:var(--text-xs)}
.served .icon{width:14px;height:14px}
.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-5)}
.menu-card{background:var(--surface-card-alt);border:var(--border-width) solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;display:flex;flex-direction:column}
.menu-card header{padding:var(--space-5) var(--space-4) var(--space-4) var(--space-5);background:var(--green-700);color:var(--text-on-dark);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.menu-card:nth-child(even) header{background:var(--orange-600)}
.menu-card h4{font-family:var(--font-display);font-weight:700;font-size:1.2rem;white-space:nowrap;line-height:var(--leading-snug)}
.menu-card header .icon{width:24px;height:24px;opacity:.9;stroke-width:1.5}
.menu-card ul{list-style:none;margin:0;padding:var(--space-4) var(--space-5) var(--space-5);flex:1}
.menu-card li{padding:9px 0;border-bottom:1px dashed var(--border-subtle);font-size:var(--text-sm)}
.menu-card li:last-child{border-bottom:0}
.menu-card li b{font-weight:500}
.menu-card li small{display:block;color:var(--text-muted);font-size:var(--text-xs);line-height:1.4;margin-top:2px}


/* Order banner */
.order{margin-top:var(--space-7)}
.order-inner{background:var(--green-800);color:var(--text-on-dark);border-radius:var(--radius-lg);padding:var(--space-6) var(--space-7);display:flex;align-items:center;gap:var(--space-6)}
.order-inner>.icon{width:56px;height:56px;stroke-width:1.25;color:var(--cream-200)}
.order-copy{flex:1}
.order .eyebrow{color:var(--orange-400)}
.order h2{margin-top:var(--space-1);font-family:var(--font-display);font-weight:700;font-size:var(--text-xl);color:var(--white)}
.order p{margin-top:var(--space-1);font-size:var(--text-sm);color:var(--cream-200)}

/* Reviews */
.reviews{padding:var(--space-8) 0 var(--space-9)}
.reviews-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-5);flex-wrap:wrap}
.reviews-head h2{margin-top:var(--space-2)}
.rating{display:flex;align-items:center;gap:var(--space-3);text-decoration:none;background:var(--surface-card);border:var(--border-width) solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);transition:border-color var(--duration-fast) var(--ease-out)}
.rating:hover{border-color:var(--color-primary)}
.rating-score{font-family:var(--font-display);font-weight:800;font-size:var(--text-xl);line-height:1;color:var(--color-primary)}
.rating-note{display:block;font-size:var(--text-xs);color:var(--text-muted);margin-top:2px}
.stars{display:inline-flex;gap:2px;color:var(--color-accent)}
.stars .icon{width:16px;height:16px;fill:currentColor;stroke-width:1}
.reviews-grid{margin-top:var(--space-6);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.review{margin:0;background:var(--surface-card);border:var(--border-width) solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-5);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:var(--space-3)}
.review blockquote{margin:0;flex:1;font-size:var(--text-base);color:var(--text-body)}
.review figcaption{font-family:var(--font-heading);font-weight:600;font-size:var(--text-sm);color:var(--color-primary)}

/* Find us */
.find{background:var(--surface-sunken);padding:var(--space-8) 0}
.find-grid{display:grid;grid-template-columns:1.3fr 1.3fr 1fr;gap:var(--space-5);align-items:stretch}
.find-photo img,.find-map iframe{width:100%;height:100%;min-height:260px;object-fit:cover;border-radius:var(--radius-md);border:var(--border-width) solid var(--border-subtle);display:block}
.find-map iframe{background:var(--surface-card)}
.find-info{display:flex;flex-direction:column;align-items:flex-start}
.find-cta{margin-top:auto;margin-bottom:auto;align-self:stretch}
.find-info h2{margin-top:var(--space-2);font-size:var(--text-xl)}
.find-row{display:flex;gap:var(--space-3);margin-top:var(--space-4);font-size:var(--text-sm)}
.find-row .icon{color:var(--color-accent);margin-top:2px}
.find-row b{display:block;font-weight:600;color:var(--color-primary)}
.find-row span{color:var(--text-muted)}
.hours{display:grid;grid-template-columns:auto auto;gap:2px var(--space-5)}

/* Footer */
.footer{background:var(--green-900);color:var(--cream-200);padding:var(--space-6) 0}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap}
.footer .brand-name{color:var(--orange-400)}
.footer .brand-sub{color:var(--cream-300)}
.footer-contact{display:flex;flex-direction:column;gap:6px;font-size:var(--text-sm)}
.footer-contact a,.footer-contact span{display:flex;align-items:center;gap:var(--space-2);text-decoration:none}
.footer-contact a:hover{color:var(--white)}
.footer-contact .icon{width:16px;height:16px;color:var(--orange-400)}
.footer-links{display:flex;gap:var(--space-5);list-style:none;margin:0;padding:0;font-size:var(--text-sm)}
.footer-links a{text-decoration:none}
.footer-links a:hover{color:var(--white)}
.footer-tag{font-size:var(--text-xs);color:var(--cream-300)}

/* Responsive */
@media (max-width:1180px){
  .menu-card header{padding-left:var(--space-4);padding-right:var(--space-3);gap:var(--space-2)}
  .menu-card h4{font-size:1.05rem}
  .menu-card header .icon{width:20px;height:20px}
}
@media (max-width:1100px){
  .nav .btn .label-long{display:none}
}
@media (max-width:1000px){
  .find-grid{grid-template-columns:1fr 1fr}
  .find-info{grid-column:1/-1}
  .find-cta{margin-top:var(--space-5)}
  .menus{grid-template-columns:1fr;gap:var(--space-7)}
  .features ul{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .nav-links{display:none}
  .about-inner{grid-template-columns:1fr;gap:var(--space-6)}
  .hero h1{font-size:var(--text-3xl)}
  .hero::before{background:linear-gradient(180deg,rgba(22,48,28,.9) 0%,rgba(22,48,28,.8) 55%,rgba(22,48,28,.45) 100%)}
  .hero-inner{min-height:0;padding-bottom:var(--space-9)}
  .hero-tag{right:auto;left:var(--space-4);bottom:var(--space-4)}
  .about{padding:var(--space-8) 0}
  .reviews-grid{grid-template-columns:1fr}
  .order-inner{flex-direction:column;align-items:flex-start;padding:var(--space-6) var(--space-5)}
  .order-inner>.icon{display:none}
}
@media (max-width:560px){
  .container{padding-left:var(--space-4);padding-right:var(--space-4)}
  .nav-inner{height:68px}
  .nav-inner{gap:var(--space-3)}
  .nav .brand-name{font-size:1.2rem}
  .nav .btn{padding:9px 14px}
  .nav-actions .btn[target] .icon{display:none}
  .menu-grid,.find-grid,.features ul{grid-template-columns:1fr}
  .features li{flex-direction:column;text-align:center;gap:var(--space-2)}
  .section-title{font-size:var(--text-xl)}
  .hero-actions .btn{flex:1}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}
@media (max-width:380px){
  .nav .brand-name{font-size:1.05rem}
  .nav .btn{padding:8px 12px}
  .nav-actions .btn .icon{display:none}
}
