:root{
  --pink:#F6A6CF; --pink-deep:#EE7FB6; --teal:#0099AA; --deep:#007481; --blush:#FCE8EF; --ice:#D2EFF7; --ink:#171717; --paper:#FFFDFB;
  --display:'Lilita One',system-ui,sans-serif; --body:'Nunito',system-ui,sans-serif; --script:'Caveat',cursive;
  --r:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--paper);line-height:1.6;font-size:1.0625rem;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--deep)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:.6rem 1rem;border-radius:999px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:6px}
.wrap{width:min(1120px,100% - 2.5rem);margin-inline:auto}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;color:var(--deep);line-height:1.08;margin:0}
h1{font-size:clamp(2.6rem,7vw,5rem);letter-spacing:.005em}
h2{font-size:clamp(2rem,4.6vw,3.2rem)}
.script{font-family:var(--script);font-size:1.7rem;color:var(--deep);margin:0 0 .4rem;line-height:1.1}
.eyebrow{font-weight:800;color:var(--pink);margin:0 0 .75rem;font-size:.95rem}
.small{font-size:.95rem;color:#3b3b3b}

/* checkerboard, the signature edge */
.checker{height:26px;background:repeating-conic-gradient(var(--pink) 0 25%,#fff 0 50%) 0 0/26px 26px}
.checker-pink{background:repeating-conic-gradient(var(--pink) 0 25%,var(--deep) 0 50%) 0 0/26px 26px}

/* buttons */
.btn{display:inline-block;font-family:var(--body);font-weight:800;text-decoration:none;padding:.85rem 1.5rem;border-radius:999px;border:2.5px solid var(--ink);transition:transform .15s,box-shadow .15s;line-height:1.2}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.btn-pink{background:var(--pink);color:var(--ink)}
.btn-ink{background:var(--deep);color:#fff;border-color:var(--ink)}
.btn-ghost{background:#fff;color:var(--ink)}
.btn-lg{font-size:1.2rem;padding:1.05rem 2rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.6rem 0 .8rem}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:.4rem clamp(1rem,4vw,2.5rem);border-bottom:2.5px solid var(--pink)}
.brand-logo img{width:auto;height:64px}
#nav{display:flex;align-items:center;gap:1.6rem}
#nav a:not(.btn){font-weight:800;text-decoration:none;color:var(--deep)}
#nav a:not(.btn):hover,#nav a[aria-current]{text-decoration:underline;text-decoration-color:var(--pink);text-decoration-thickness:4px;text-underline-offset:6px}
#nav .btn{padding:.6rem 1.2rem}
.nav-toggle{display:none;background:none;border:2.5px solid var(--ink);border-radius:14px;width:48px;height:44px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.nav-toggle i{display:block;width:22px;height:3px;background:var(--ink);border-radius:2px}

/* bubbles (one gentle moment: they drift up once on load) */
.bubbles{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.bubbles b{position:absolute;bottom:-40px;border-radius:50%;border:3px solid var(--teal);opacity:.0;animation:rise 9s ease-out forwards}
.bubbles b:nth-child(1){left:6%;width:26px;height:26px;animation-delay:.2s}
.bubbles b:nth-child(2){left:18%;width:14px;height:14px;animation-delay:1.1s}
.bubbles b:nth-child(3){left:38%;width:34px;height:34px;animation-delay:.6s}
.bubbles b:nth-child(4){left:52%;width:12px;height:12px;animation-delay:2s}
.bubbles b:nth-child(5){left:70%;width:22px;height:22px;animation-delay:1.4s}
.bubbles b:nth-child(6){left:83%;width:40px;height:40px;animation-delay:.9s;border-color:var(--pink-deep)}
.bubbles b:nth-child(7){left:93%;width:16px;height:16px;animation-delay:2.4s;border-color:var(--pink-deep)}
@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:.8}100%{transform:translateY(-110vh);opacity:0}}

/* hero */
.hero{position:relative;background:var(--ice);padding:clamp(2.5rem,6vw,5rem) 0 clamp(3rem,7vw,6rem);overflow:hidden}
.hero-grid{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
.hero h1{margin-bottom:1.2rem}
.lede{font-size:1.25rem;max-width:34ch;margin:0}
.hero-photo{position:relative;margin:0;justify-self:center;width:min(100%,430px)}
.hero-photo img{border-radius:var(--r);border:4px solid var(--ink);box-shadow:12px 12px 0 var(--pink);aspect-ratio:4/4.6;object-fit:cover;object-position:50% 38%}
.sticker{position:absolute;left:-1.4rem;bottom:2rem;background:var(--pink);border:3px solid var(--ink);border-radius:20px;padding:.5rem .9rem;font-family:var(--display);color:var(--ink);transform:rotate(-6deg);line-height:1.15;font-size:1.1rem}

/* find the truck */
.find{background:var(--blush);padding:clamp(3rem,7vw,6rem) 0}
.find-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
.find-photo{margin:0}
.find-photo img{border-radius:var(--r);border:4px solid var(--ink);box-shadow:-10px 10px 0 var(--teal);width:100%}
.find-copy p{max-width:46ch}
.find-copy h2{margin-bottom:1rem}

/* menu teaser */
.menu-tease{padding:clamp(3rem,7vw,6rem) 0 clamp(2rem,5vw,4rem)}
.sec-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem 2rem;margin-bottom:2rem}
.sec-head .script{margin:0}
.tease-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.tease-card{display:flex;flex-direction:column;border:3px solid var(--ink);border-radius:var(--r);padding:1.6rem;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}
.tease-card:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.tease-card h3{font-size:2rem;margin-bottom:.4rem}
.tease-card p{margin:0 0 1rem}
.tease-card ul{list-style:none;margin:0 0 1.2rem;padding:0;display:grid;gap:.55rem}
.tease-card li strong{display:block;font-weight:800}
.tease-card li span{font-size:.95rem;color:#333}
.t1{background:var(--pink)}
.t1 h3{color:var(--ink)}
.t2{background:var(--deep);color:#fff}
.t2 h3{color:#fff}
.t2 li span{color:#e7f7fa}
.tease-card.t2{color:#fff}
.more{margin-top:auto;font-weight:800;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:3px}
.bestnote{display:flex;align-items:center;gap:.5rem;margin:1.4rem 0 0;font-size:.95rem}

/* bottle icon */
.bottle{width:1.15em;height:1.15em;flex:none;fill:var(--pink);stroke:var(--ink);stroke-width:1.4;stroke-linejoin:round;vertical-align:-.2em}
.bottle .cross{fill:none;stroke:var(--ink);stroke-linecap:round}

/* hours + prices */
.hours-prices{padding:clamp(1.5rem,4vw,3rem) 0 clamp(3rem,7vw,6rem)}
.hp-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.panel{background:var(--ice);border:3px solid var(--ink);border-radius:var(--r);padding:clamp(1.3rem,3vw,2.2rem)}
.panel h2{font-size:2.2rem;margin-bottom:1rem}
.hours{margin:0}
.hours div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:2px dashed var(--teal)}
.hours dt{font-weight:800;color:var(--deep)}
.hours dd{margin:0;font-weight:700}
.prices{width:100%;border-collapse:collapse;font-weight:700}
.prices thead th{text-align:right;font-size:.9rem;padding:0 0 .5rem;color:var(--deep)}
.prices thead th:first-child{text-align:left}
.prices td{padding:.35rem 0;text-align:right}
.prices td:first-child{text-align:left}
.prices .grp{font-family:var(--display);font-weight:400;font-size:1.3rem;color:var(--deep);padding-top:.9rem;text-align:left;border-bottom:2px dashed var(--teal)}

/* heart */
.heart{background:var(--deep);color:#fff;position:relative}
.heart::before{content:"";display:block;height:26px;background:repeating-conic-gradient(var(--pink) 0 25%,var(--paper) 0 50%) 0 0/26px 26px}
.heart-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(1.5rem,5vw,4rem);align-items:center;padding:clamp(3rem,7vw,6rem) 0}
.heart h2{color:#fff;font-size:clamp(2.4rem,6vw,4.4rem);margin-bottom:1.2rem}
.heart p{max-width:44ch}
.heart .verse{color:var(--pink);font-size:2rem;margin-top:1.4rem}
.heart-photo{margin:0}
.heart-photo img{border-radius:var(--r);border:4px solid var(--ink);box-shadow:10px 10px 0 var(--pink);width:100%}

/* closer */
.closer{background:var(--blush);padding:clamp(2.5rem,6vw,4.5rem) 0}
.closer-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem}

/* footer */
.site-footer{background:var(--deep);color:#fff;padding-bottom:1.2rem}
.foot-grid{display:grid;grid-template-columns:auto 1fr auto;gap:2rem;align-items:center;padding:2.5rem 0 1.5rem}
.foot-logo{background:#fff;border-radius:24px;padding:.6rem 1rem}
.foot-logo img{height:82px;width:auto}
.foot-tag{font-family:var(--display);font-size:1.8rem;line-height:1.15;margin:0 0 .4rem}
.foot-small{margin:0;color:var(--ice)}
.foot-links{display:grid;gap:.4rem}
.foot-links a{color:#fff;font-weight:700}
.copy{text-align:center;margin:0;color:var(--ice);font-size:.9rem}

/* menu page */
.menu-hero{position:relative;background:var(--ice);padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(2rem,5vw,3.5rem);overflow:hidden}
.menu-hero .wrap{position:relative}
.menu-hero h1{margin-bottom:.8rem}
.price-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin-top:1.8rem}
.price-chips div{background:#fff;border:3px solid var(--ink);border-radius:20px;padding:.9rem 1.1rem;display:grid;gap:.1rem}
.price-chips strong{font-family:var(--display);font-weight:400;font-size:1.3rem;color:var(--deep)}
.price-chips span{font-weight:800}
.price-chips small{font-size:.88rem;color:#444}
.menu-tools{position:sticky;top:73px;z-index:40;background:#fff;border-bottom:2.5px solid var(--pink)}
.tools-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1.5rem;padding:.7rem 0}
.tabs{display:flex;gap:.5rem;flex-wrap:wrap}
.tabs a{text-decoration:none;font-weight:800;color:var(--ink);border:2.5px solid var(--ink);padding:.4rem 1rem;border-radius:999px;background:var(--blush)}
.tabs a:hover{background:var(--pink)}
.filters{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.search input{font:inherit;font-weight:600;padding:.5rem 1rem;border:2.5px solid var(--ink);border-radius:999px;min-width:220px;background:#fff}
.chip{font:inherit;font-weight:800;display:inline-flex;gap:.4rem;align-items:center;padding:.45rem 1rem;border:2.5px solid var(--ink);border-radius:999px;background:#fff;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--pink)}
.menu-body{padding:2rem 0 3rem}
.menu-sec{margin-bottom:3rem}
.menu-sec>h2{font-size:clamp(2.2rem,5vw,3.4rem);margin:1rem 0 1.4rem;text-align:center}
.brand{margin-bottom:2.2rem}
.brand h3{text-align:center;margin-bottom:1rem}
.brand h3 span{display:inline-block;background:var(--pink);color:var(--ink);border:3px solid var(--ink);border-radius:999px;padding:.25rem 1.4rem;font-size:1.5rem}
.drinks{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}
.drink{background:var(--blush);border:2.5px solid var(--ink);border-radius:20px;padding:1rem 1.2rem}
.drink h4{font-size:1.25rem;display:flex;align-items:center;gap:.4rem;color:var(--deep);margin-bottom:.3rem}
.drink p{margin:0;font-size:.98rem;line-height:1.45}
.drink .note{margin-top:.5rem;font-size:.88rem;font-style:italic;color:var(--deep)}
.best-tag{display:inline-flex}
.is-best{background:#fff;box-shadow:5px 5px 0 var(--pink)}
.legend{display:flex;gap:.5rem;align-items:center;justify-content:center;font-weight:700}
.empty{text-align:center;font-weight:700;font-size:1.2rem}
.is-hidden{display:none!important}

/* responsive */
@media (max-width:860px){
  .hero-grid,.find-grid,.heart-grid,.hp-grid,.tease-grid{grid-template-columns:1fr}
  .hero-photo{order:-1;width:min(100%,360px)}
  .foot-grid{grid-template-columns:1fr;text-align:center;justify-items:center}
  .nav-toggle{display:flex}
  #nav{position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.5rem 1.2rem;border-bottom:2.5px solid var(--pink);display:none}
  #nav.open{display:flex}
  #nav a:not(.btn){padding:.8rem 0;border-bottom:2px dashed var(--ice)}
  #nav .btn{margin-top:.8rem;text-align:center}
  .menu-tools{position:static}
  .search{flex:1 1 100%}.search input{width:100%;min-width:0}
  .filters{width:100%}
  .sticker{left:.5rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .bubbles{display:none}
  .btn,.tease-card{transition:none}
}

/* v2 additions */
.peek{font-weight:800;margin:0 0 .6rem!important}
.all-menu{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;margin-top:1.8rem;background:var(--blush);border:3px dashed var(--pink-deep);border-radius:var(--r);padding:1.3rem 1.6rem}
.all-menu p{margin:0;font-size:1.15rem;max-width:44ch}
.page-hero{position:relative;background:var(--ice);padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(2.5rem,5vw,4rem);overflow:hidden}
.page-hero .wrap{position:relative}
.page-hero h1{margin-bottom:.8rem}
.where-body{padding:clamp(2rem,5vw,4rem) 0 clamp(3rem,7vw,6rem)}
.where-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.social-list{list-style:none;margin:1rem 0;padding:0}
.social-list li{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:.6rem 0;border-bottom:2px dashed var(--teal)}
.social-list a{font-weight:800;font-size:1.15rem}
.where-photo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,4rem);align-items:center;margin-top:clamp(2.5rem,6vw,4.5rem)}
.where-photo img{border-radius:var(--r);border:4px solid var(--ink);box-shadow:-10px 10px 0 var(--teal);width:100%}
.where-photo h2{margin-bottom:.8rem}
.form-wrap{padding:clamp(2rem,5vw,4rem) 0 clamp(3rem,7vw,6rem)}
.form-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(1.5rem,5vw,3.5rem);align-items:start}
.req-form{display:grid;gap:1.1rem;background:var(--blush);border:3px solid var(--ink);border-radius:var(--r);padding:clamp(1.3rem,3vw,2.2rem)}
.req-form label{display:grid;gap:.35rem;font-weight:800;color:var(--deep)}
.req-form input,.req-form select,.req-form textarea{font:inherit;font-weight:600;color:var(--ink);padding:.7rem .9rem;border:2.5px solid var(--ink);border-radius:16px;background:#fff;width:100%}
.req-form textarea{resize:vertical}
.req-form button{justify-self:start;cursor:pointer}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.form-side img{border-radius:var(--r);border:4px solid var(--ink);box-shadow:10px 10px 0 var(--pink);aspect-ratio:4/4.6;object-fit:cover;object-position:50% 45%;width:100%}
.thanks{min-height:50vh}
.foot-links{justify-items:start}
@media (max-width:860px){
  .where-grid,.where-photo,.form-grid,.f2{grid-template-columns:1fr}
  .form-side{display:none}
}

/* iOS date/time inputs overflowing their box */
.req-form label,.req-form input,.req-form select,.req-form textarea{min-width:0;max-width:100%}
.req-form input[type="date"]{-webkit-appearance:none;appearance:none;display:block;min-height:3.1rem;text-align:left;line-height:1.2}
.req-form input[type="date"]::-webkit-date-and-time-value{text-align:left;min-height:1.2em}
.req-form input[type="date"]::-webkit-calendar-picker-indicator{margin:0}

/* v3: homepage order */
.menu-tease .all-menu{margin:0 0 1.5rem}
.menu-tease{padding-bottom:clamp(3rem,7vw,6rem)}
.home-hours{padding:clamp(3rem,7vw,6rem) 0}

/* FAQ */
.faq{padding:clamp(3rem,7vw,5rem) 0}
.faq-in{max-width:820px}
.faq h2{margin-bottom:1.4rem}
.faq details{border:2.5px solid var(--ink);border-radius:20px;background:var(--blush);margin-bottom:.8rem;padding:0 1.2rem}
.faq summary{cursor:pointer;font-weight:800;color:var(--deep);padding:1rem 0;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--display);font-size:1.5rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 1.1rem;max-width:62ch}

/* verse */
.verse-quote{margin:1.6rem 0 0;padding:.2rem 0 .2rem 1.2rem;border-left:5px solid var(--pink);max-width:48ch}
.verse-quote p{margin:0 0 .6rem;font-size:1.1rem;line-height:1.6}
.verse-quote cite{font-family:var(--script);font-style:normal;font-size:1.7rem;color:var(--pink)}
.verse-quote .niv{display:block;margin-top:.6rem;font-size:.78rem;line-height:1.4;color:var(--ice);opacity:.85}
