:root{
  --cream:#E8DDCB;
  --orange:#CF6D2E;
  --navy:#263B56;
  --navy-deep:#1C2D44;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--cream);
  color:var(--navy);
  font-family:"Montserrat","Avenir Next","Avenir","Segoe UI",Helvetica,Arial,sans-serif;
  font-weight:700;
  line-height:1.25;
}
a{color:inherit}
a:focus-visible{outline:4px solid var(--navy);outline-offset:3px}

/* ---------- Home page: stacked orange-framed panels, like the menus ---------- */
.frame{
  max-width:560px;
  margin:0 auto;
  padding:clamp(14px,4vw,32px);
}
.panels{border:12px solid var(--orange);}
.panel{padding:clamp(20px,6vw,34px) clamp(20px,6vw,34px)}
.panel + .panel{border-top:12px solid var(--orange)}
.panel.logo{padding:0}
.panel.logo img{display:block;width:100%;height:auto}

.kicker{margin:0;font-size:clamp(20px,6vw,28px);font-weight:700;letter-spacing:.01em;text-transform:uppercase}
.phone{
  display:block;
  margin:10px 0 6px;
  font-size:clamp(34px,11vw,52px);
  font-weight:800;
  letter-spacing:-.01em;
  text-decoration:none;
  white-space:nowrap;
}
.order{margin:0 0 20px;font-size:clamp(16px,4.6vw,21px);text-transform:uppercase}

.actions{display:flex;gap:12px}
.btn{
  flex:1;
  display:block;
  text-align:center;
  text-decoration:none;
  padding:16px 12px;
  background:var(--navy);
  color:var(--cream);
  font-size:clamp(17px,5vw,22px);
  font-weight:800;
  border-radius:4px;
}
.btn:hover{background:var(--navy-deep)}
.btn.ghost{background:transparent;color:var(--navy);border:3px solid var(--navy);padding:13px 12px}
.btn.ghost:hover{background:rgba(38,59,86,.08)}

.menu-link{
  display:block;
  text-decoration:none;
  padding:clamp(20px,6vw,30px) clamp(20px,6vw,34px);
}
.menu-link:hover{background:rgba(207,109,46,.12)}
.panel + .menu-link,.menu-link + .menu-link{border-top:12px solid var(--orange)}
.menu-link .name{
  display:block;
  font-size:clamp(38px,12vw,60px);
  font-weight:800;
  line-height:1;
  letter-spacing:.005em;
  text-transform:uppercase;
}
.menu-link .price{display:block;margin-top:10px;font-size:clamp(17px,5vw,22px)}
.menu-link .flavors{display:block;margin-top:6px;font-size:clamp(14px,4vw,17px);font-weight:600}
.menu-link .go{
  display:inline-block;margin-top:14px;padding-bottom:3px;
  border-bottom:4px solid var(--orange);
  font-size:clamp(15px,4.4vw,18px);font-weight:800;
}

/* ---------- Menu item pages: the JPEG is the page ---------- */
.item{max-width:540px;margin:0 auto;padding:0 0 28px}
.item img{display:block;width:100%;height:auto}
.item .actions{padding:8px 16px 0}
.item .more{margin:18px 16px 0;text-align:center;font-size:17px}
.item .more a{margin:0 10px;padding-bottom:2px;border-bottom:3px solid var(--orange);text-decoration:none;font-weight:800}
