
:root{--green:#19833f;--deep:#0a3023;--cream:#f7f2e9;--ink:#161a17;--muted:#67706a;--line:#e7e1d7}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#fff}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.wrap{width:min(1180px,calc(100% - 40px));margin:auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Exact approved homepage artwork */
.snapshot{position:relative;width:100%;background:#fbfaf6;line-height:0}
.snapshot picture,.snapshot .approved{display:block;width:100%}
.snapshot .approved{height:auto}
.hotspot{position:absolute;z-index:5;display:block;border-radius:14px;line-height:normal}
.hotspot:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 5px #19833f}

/* desktop clickable zones, based on approved 1659×948 master */
.hs-logo{left:4.3%;top:.4%;width:16.3%;height:7.1%}
.hs-menu{left:35.1%;top:.5%;width:5.2%;height:6.8%}
.hs-order-nav{left:40.7%;top:.5%;width:8.4%;height:6.8%}
.hs-cakes-nav{left:49.1%;top:.5%;width:10.5%;height:6.8%}
.hs-about{left:59.2%;top:.5%;width:5.1%;height:6.8%}
.hs-contact{left:64.4%;top:.5%;width:5.4%;height:6.8%}
.hs-order-top{left:70.8%;top:.5%;width:10.5%;height:6.5%}
.hs-phone-top{left:81.3%;top:.5%;width:13%;height:6.5%}

.hs-order-hero{left:5.8%;top:38.3%;width:13%;height:6.1%}
.hs-menu-hero{left:19.2%;top:38.3%;width:11.6%;height:6.1%}
.hs-cakes-hero{left:31.2%;top:38.3%;width:15.4%;height:6.1%}
.hs-address{left:5.3%;top:48.2%;width:22%;height:8%}
.hs-phone-info{left:71.5%;top:48.2%;width:18%;height:8%}

.hs-pad{left:1.6%;top:65.9%;width:19.3%;height:25.1%}
.hs-basil{left:21.5%;top:65.9%;width:19%;height:25.1%}
.hs-lunch{left:41.3%;top:65.9%;width:17.7%;height:25.1%}
.hs-sashimi{left:59.2%;top:65.9%;width:18.9%;height:25.1%}
.hs-panko{left:78.5%;top:65.9%;width:19.7%;height:25.1%}

/* real lower sections */
.story{padding:72px 0;background:#fff}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
.story-photo{border-radius:22px;overflow:hidden;aspect-ratio:16/10}
.story-photo img{width:100%;height:100%;object-fit:cover}
.eyebrow{font-size:12px;letter-spacing:.2em;color:var(--green);font-weight:850;text-transform:uppercase}
.story h2,.visit h2{font:600 46px/1.05 Georgia,serif;margin:10px 0 17px}
.story p{font-size:17px;line-height:1.6;color:var(--muted)}
.story-lunch-link{font-weight:750;color:#146a40;text-decoration:underline;text-underline-offset:3px}
.facts{display:flex;gap:34px;flex-wrap:wrap;margin-top:23px}
.fact strong{display:block;font:600 26px Georgia,serif;color:#a51f2c}.fact span{font-size:13px;color:var(--muted)}

.visit{background:#f5f1e9;padding:62px 0}
.visit-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:27px}
.card h3{font:600 29px Georgia,serif;margin:0 0 16px}
.row{display:flex;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid #eee9e0;font-size:14px}
.row:last-child{border:0}.row span:last-child{text-align:right;color:var(--muted)}
.actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.solid,.outline{height:47px;padding:0 19px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-weight:800}
.solid{background:var(--green);color:#fff}.outline{border:1px solid var(--green);color:var(--green)}
footer{background:var(--deep);color:#fff;padding:42px 0 88px}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:40px}
.footer-grid p,.footer-grid a{color:#c8d6d0;font-size:13px}
.footer-grid h4{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:#ecdba7;margin:0 0 12px}
.footer-links{display:grid;gap:8px}
.mobile-drawer{display:none}

/* Use exact approved mobile master below 760px */
@media(max-width:760px){
  .wrap{width:min(100% - 28px,1180px)}
  .snapshot-source-desktop{display:none}
  .hotspot{border-radius:10px}
  .hs-logo{left:5.9%;top:.7%;width:38%;height:5.8%}
  .hs-order-top{left:56.5%;top:.7%;width:29.5%;height:5.8%}
  .hs-menu-toggle{display:block!important;left:89.2%;top:.9%;width:8.2%;height:5.1%}
  .hs-menu,.hs-order-nav,.hs-cakes-nav,.hs-about,.hs-contact,.hs-phone-top{display:none}
  .hs-order-hero{left:2.2%;top:39%;width:34%;height:4.9%}
  .hs-menu-hero{left:37.2%;top:39%;width:25.5%;height:4.9%}
  .hs-cakes-hero{left:63.7%;top:39%;width:34%;height:4.9%}
  .hs-address{left:2.2%;top:47.2%;width:35%;height:8.2%}
  .hs-phone-info{left:68%;top:47.2%;width:29%;height:8.2%}
  .hs-pad{left:1.8%;top:66.5%;width:49%;height:14.9%}
  .hs-basil{left:51.3%;top:66.5%;width:47.5%;height:14.9%}
  .hs-lunch,.hs-sashimi{display:none}
  .hs-panko{left:1.8%;top:82.1%;width:97%;height:15.2%}
  .mobile-drawer{position:fixed;z-index:90;top:0;right:0;width:min(78vw,330px);height:100vh;background:#fff;padding:28px 24px;box-shadow:-12px 0 35px rgba(0,0,0,.2);line-height:normal}
  .mobile-drawer.open{display:grid;align-content:start;gap:17px}
  .mobile-drawer a{font-size:18px;font-weight:750;padding:8px 0;border-bottom:1px solid #eee}
  .drawer-close{border:0;background:none;font-size:30px;text-align:right;padding:0 0 12px}
  .story{padding:54px 0}.story-grid{grid-template-columns:1fr;gap:28px}.story-photo{order:2}
  .story h2,.visit h2{font-size:38px}
  .visit{padding:52px 0}.visit-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}
}
@media(min-width:761px){
  .snapshot-source-mobile{display:none}
  .hs-menu-toggle{display:none!important}
}
@media(max-width:480px){
  .story h2,.visit h2{font-size:34px}
  .footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}
}

/* Working header for secondary pages */
.header{position:sticky;top:0;z-index:70;background:#fff;border-bottom:1px solid #eee9e1}.header-row{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}.logo-img{width:158px;max-height:58px;object-fit:contain}.nav{display:flex;align-items:center;gap:21px;font-weight:700;font-size:14px}.nav a:hover,.nav a.active{color:var(--green)}.header-right{display:flex;align-items:center;gap:10px}.order-top{display:inline-flex;padding:12px 18px;border-radius:40px;background:#19833f;color:#fff;font-weight:800;font-size:13px}.mobile-menu{display:none;cursor:pointer;background:none;border:0;font-size:25px}.mobile-sticky{display:none}@media(max-width:760px){.header-row{min-height:65px}.logo-img{width:130px}.nav{display:none}.mobile-menu{display:block}.mobile-drawer.open{display:grid}.mobile-sticky{display:block;position:sticky;bottom:0;z-index:60;background:#19833f;text-align:center;padding:13px 0;color:#fff;font-weight:800}}


/* V9: Secondary DoorDash delivery option — direct online ordering stays primary. */
.hs-doordash-hero{left:47.3%;top:38.3%;width:15.4%;height:6.1%;display:flex;align-items:center;justify-content:center;gap:.35em;z-index:7;background:#ef5636;color:#fff;box-shadow:0 3px 12px rgba(15,25,20,.26);border:1px solid rgba(255,255,255,.35);font-weight:800;font-size:clamp(12px,1.1vw,16px);text-align:center;white-space:nowrap;transition:filter .2s,transform .2s;line-height:1.2}
.hs-doordash-hero:hover{filter:brightness(1.08);transform:translateY(-1px)}
.mobile-drawer .drawer-delivery{color:#b93821}
@media(min-width:761px) and (max-width:1100px){.hs-doordash-hero{left:47.3%;top:38.3%;width:23.4%;font-size:12px}}
@media(max-width:760px){
  .hs-doordash-hero{top:7%;left:auto;right:3.5%;width:46%;min-height:42px;height:auto;padding:8px 9px;border-radius:999px;font-size:13px;white-space:normal}
}

/* V15: Mobile homepage ordering bar; actual buttons, always visible even on raster-based homepage. */
.home-mobile-order-bar{display:none}
@media(max-width:760px){
  .hs-doordash-hero{display:none!important} /* avoid floating duplicate on the photograph */
  .home-mobile-order-bar{
    position:fixed;display:grid;grid-template-columns:1fr 1fr;gap:8px;
    left:0;right:0;bottom:0;z-index:100;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    background:rgba(255,255,255,.98);
    border-top:1px solid #e4e5e0;
    box-shadow:0 -5px 16px rgba(0,0,0,.09);
    line-height:1.2
  }
  .home-mobile-order-bar a{
    display:flex;align-items:center;justify-content:center;gap:4px;
    min-height:48px;padding:9px 6px;border-radius:999px;
    font-size:clamp(12px,3.4vw,15px);font-weight:800;color:#fff;text-align:center;
    white-space:nowrap;
  }
  .home-mobile-order-pickup{background:#19833f}
  .home-mobile-order-delivery{background:#e94e2f}
  .home-mobile-order-bar a:focus-visible{outline:3px solid #111;outline-offset:3px}
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom, 0px))}
}


/* V16 — The two homepage ordering buttons are matched pill styles.
   Green direct ordering remains part of the approved artwork; mirror its
   exact hero-button footprint for the red DoorDash link. */
@media (min-width:761px){
  .hs-doordash-hero{
    left:47.3%;top:39.3%;width:13%;height:6.1%;
    min-height:0;border-radius:999px;padding:0 7px;
    background:#e94e2f;color:#fff;
    border:0;box-shadow:0 2px 6px rgba(0,0,0,.20);
    font-family:inherit;font-size:clamp(11px,1.08vw,16px);font-weight:650;
    line-height:1.15;white-space:nowrap;letter-spacing:0;
    display:flex;align-items:center;justify-content:center;gap:.28em;
  }
}
@media (min-width:761px) and (max-width:1100px){
  .hs-doordash-hero{left:47.3%;top:39.3%;width:13%;font-size:clamp(10px,1.08vw,12px);white-space:normal}
}
@media (max-width:760px){
  /* V15 already gives both actions exactly equal 1fr columns. Match sizing
     and corner geometry explicitly for narrow screens as well. */
  .home-mobile-order-bar a{
    width:100%;height:48px;min-height:48px;max-height:48px;
    border-radius:999px;font-weight:800;line-height:1.1;
    border:0;box-shadow:0 1px 4px rgba(0,0,0,.10);
  }
}
