/* V15 responsive-flow refinement: preserves V14's approved colors,
   checkout payload, menu prices, and production isolation. */
.site-v5{--v15-teal:#003f4a;--v15-red:#bd0b24;--v15-cream:#fff7eb;}

/* Hero: the artwork is natively 16:9, but the viewport must win on short
   laptop screens. The food remains a single independent image. */
@media(min-width:991px){
 .site-v5 .hero-section{
  aspect-ratio:auto;
  height:min(56.25vw,calc(100svh - 145px));
  min-height:min(490px,calc(100svh - 128px));
  max-height:980px;
  overflow:hidden;
 }
 .site-v5 .hero-layout{height:100%}
 .site-v5 .hero-visual,.site-v5 .hero-visual img{height:100%}
 .site-v5 .hero-visual img{object-position:center 49%}
 .site-v5 .hero-copy{width:min(43%,640px)}
 .site-v5 .hero-copy h1{font-size:clamp(42px,4.55vw,76px)}
}

/* Shortcuts use the same ocean teal, cream and amber used by the restaurant. */
.site-v5 .reference-delivery-bar{
 background:linear-gradient(180deg,transparent 0,transparent 88px,#fff8ec 88px,#fff8ec);
}
.site-v5 .reference-delivery-inner a{
 background:linear-gradient(142deg,#00515c,#003943 76%);
 border:1px solid #206973;
 border-top:3px solid #e2b566;
 color:#fff9ed;
 box-shadow:0 12px 25px #001f292a;
}
.site-v5 .reference-delivery-inner a:hover{
 background:linear-gradient(142deg,#006371,#00424d 76%);
 box-shadow:0 16px 31px #00313a40;
}
.site-v5 .reference-delivery-inner a > i:first-child{
 color:#f6c76e;background:#ffffff12;border:1px solid #ffffff29;
}
.site-v5 .reference-delivery-inner a strong{color:#fff9ee}
.site-v5 .reference-delivery-inner a small{color:#d8e8e7}
.site-v5 .reference-delivery-inner a > .service-arr{color:#ffc66e}

/* Specials: editorial title ABOVE a photo pair, unlike the split guide and
   unlike the delivery section. Avoid vast unused side column on desktop. */
@media(min-width:1101px){
 .site-v5 .specials-layout{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
  gap:clamp(18px,2.5vw,43px);
  max-width:1600px;
 }
 .site-v5 .specials-intro{
  display:grid;
  grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr);
  column-gap:clamp(28px,4vw,75px);
  row-gap:6px;
  align-items:center;
  width:100%;
  max-width:none;
 }
 .site-v5 .specials-intro > .eyebrow{grid-column:1/-1}
 .site-v5 .specials-layout .specials-intro h2{
  grid-column:1;
  grid-row:2/4;
  font-size:clamp(52px,5.1vw,88px)!important;
  margin:4px 0;
  max-width:820px;
 }
 .site-v5 .specials-intro > p{
  grid-column:2;grid-row:2;
  font-size:clamp(15px,1.1vw,19px);
  margin:0;
 }
 .site-v5 .specials-signatures{
  grid-column:2;grid-row:3;
  margin:5px 0;
  flex-direction:row;flex-wrap:wrap;
  gap:9px 23px;
 }
 .site-v5 .specials-signatures span{font-size:clamp(13px,.95vw,16px)}
 .site-v5 .editorial-link{grid-column:2;grid-row:4;margin:0;padding:6px 0;justify-self:start}
 .site-v5 .specials-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(18px,2vw,34px);
  width:100%;
 }
 .site-v5 .special-card{aspect-ratio:16 / 9}
 .site-v5 .special-content{padding:clamp(21px,2vw,36px)}
 .site-v5 .special-content h3{font-size:clamp(26px,2.3vw,38px)!important}
}

/* Remove unique slanted stripes, keep a calm tonal ocean texture. */
.site-v5 .steps-section{
 background:radial-gradient(ellipse at 10% 75%,#12616c 0%,transparent 38%),
            linear-gradient(124deg,#003641,#004e58 79%,#003c47);
}
.site-v5 .steps-section::before{display:none!important}

/* Delivery is the inverse of Specials' and Steps' imagery: food photo on the
   left, copy and factual service details on the right. */
@media(min-width:991px){
 .site-v5 .delivery-layout{
  display:grid;
  grid-template-columns:minmax(0,1.07fr) minmax(0,.93fr);
  gap:clamp(48px,5.6vw,116px);
 }
 .site-v5 .delivery-photo{grid-column:1;grid-row:1;justify-self:stretch}
 .site-v5 .delivery-copy{grid-column:2;grid-row:1}
 .site-v5 .delivery-copy h2{font-size:clamp(43px,4.75vw,77px)!important}
}

/* Ultrawide monitors: maintain 16:9 media, not forced 1935px section heights.
   Content is held in readable-width frames and sections stop growing vertically. */
@media(min-width:2200px){
 .site-v5 .hero-section{height:min(56.25vw,calc(100svh - 170px),980px)}
 .site-v5 .hero-layout{max-width:1920px}
 .site-v5 .hero-copy h1{font-size:clamp(65px,3.2vw,84px)}
 .site-v5 .hero-visual img{object-position:center 51%}
 .site-v5 .specials-section,
 .site-v5 .steps-section,
 .site-v5 .delivery-section,
 .site-v5 .faq-section{
  aspect-ratio:auto;
  height:auto;
  min-height:clamp(680px,74svh,950px);
  max-height:none;
  padding-block:clamp(64px,5svh,110px);
 }
 .site-v5 .specials-layout,
 .site-v5 .steps-layout,
 .site-v5 .delivery-layout,
 .site-v5 .faq-layout{max-width:1860px}
 .site-v5 .specials-grid{max-width:1740px;margin-inline:auto}
 .site-v5 .specials-intro{max-width:1740px;margin-inline:auto}
 .site-v5 .specials-layout .specials-intro h2{font-size:clamp(72px,3.2vw,96px)!important}
 .site-v5 .faq-heading h2{font-size:clamp(62px,3.2vw,88px)!important}
 .site-v5 .delivery-copy h2{font-size:clamp(61px,3.1vw,85px)!important}
 .site-v5 .steps-heading h2{font-size:clamp(65px,3.3vw,92px)!important}
 .site-v5 .reference-delivery-inner{max-width:1740px}
 .site-v5 .menu-section>.container{max-width:1820px}
}

/* Visual customization modal. Product picture + actual image-backed radio
   options, with proper labels, keyboard navigation and adequate tap sizes. */
.site-v5 .modal-wrap{padding:clamp(12px,2.5vw,34px);overflow:hidden}
.site-v5 .modal{
 display:grid;
 grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
 width:min(960px,95vw);
 max-height:min(90svh,880px);
 border-radius:19px;
 overflow:hidden;
 background:#fffbf3;
 box-shadow:0 28px 90px #0007;
}
.site-v5 .modal-visual{
 position:relative;
 width:100%;
 height:100%;
 max-height:none;
 overflow:hidden;
 background:#e6e0d4;
}
.site-v5 .modal-visual img{
 width:100%;
 height:100%;
 min-height:100%;
 object-fit:cover;
 object-position:center center;
}
.site-v5 .modal-content{
 display:flex;
 flex-direction:column;
 align-items:stretch;
 min-width:0;
 min-height:0;
 max-height:min(90svh,880px);
 overflow-y:auto;
 padding:clamp(20px,2.25vw,36px);
 gap:12px;
 scrollbar-width:thin;
}
.site-v5 .modal h2{
 font-family:'Plus Jakarta Sans','Manrope',sans-serif;
 font-size:clamp(27px,2.3vw,37px);
 color:#003b45;
 line-height:1.16;
 margin:0;
}
.site-v5 .modal #choice-desc{
 margin:0;
 color:#536b6e;
 font-size:14px;
 line-height:1.55;
}
.site-v5 .modal-top{gap:15px;align-items:center}
.site-v5 .modal-top .icon-button{
 flex-shrink:0;
 min-width:44px;min-height:44px;width:44px;height:44px;
}
.site-v5 #choice-options{display:flex;flex-direction:column;gap:18px}
.site-v5 .choice-group{
 min-width:0;
 display:block;
 margin:0;
 padding:0;
 border:0;
}
.site-v5 .choice-group legend{
 display:block;
 padding:0;
 margin-bottom:11px;
 font-weight:850;
 font-size:15px;
 color:#003b45;
}
.site-v5 .choice-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:11px;
}
.site-v5 .choice-tile{
 position:relative;
 display:flex;
 flex-direction:column;
 align-items:stretch;
 min-width:0;
 min-height:0;
 padding:6px;
 border:2px solid #e2d7c9;
 border-radius:12px;
 cursor:pointer;
 background:white;
 box-shadow:0 3px 12px #0e30300c;
 transition:border-color .12s,box-shadow .12s;
}
.site-v5 .choice-tile:has(input:checked){
 border-color:#bd0b24;
 background:#fff8f4;
 box-shadow:0 0 0 2px #bd0b2433;
}
.site-v5 .choice-tile:has(input:focus-visible){
 outline:3px solid #f3b55e;
 outline-offset:2px;
}
.site-v5 .choice-tile input{
 position:absolute;
 opacity:0;
 width:1px;
 height:1px;
 top:0;
 left:0;
}
.site-v5 .choice-media{
 display:block;
 width:100%;
 height:auto;
 aspect-ratio:16/10;
 border-radius:8px;
 overflow:hidden;
 background:#f2ecdf;
}
.site-v5 .choice-media img{
 display:block;width:100%;height:100%;
 object-fit:cover;
}
.site-v5 .choice-name{
 flex:1;
 display:flex;align-items:center;justify-content:center;
 min-height:37px;
 text-align:center;
 font-weight:800;
 color:#1c484e;
 font-size:12.5px;
 line-height:1.25;
 padding:5px 2px;
}
.site-v5 .choice-check{
 position:absolute;right:11px;top:11px;
 display:grid;place-items:center;
 width:22px;height:22px;
 background:#bd0b24;color:white;
 border-radius:50%;
 font-size:14px;
 box-shadow:0 3px 6px #0003;
 opacity:0;transform:scale(.8);
}
.site-v5 .choice-tile:has(input:checked) .choice-check{opacity:1;transform:scale(1)}
.site-v5 #confirm-choice{
 position:sticky;
 bottom:0;
 z-index:2;
 min-height:53px;
 margin-top:10px;
 padding:13px;
 background:#bd0b24;
 border:2px solid #fff8f3;
 border-radius:14px;
 font-size:15px;
 box-shadow:0 -8px 16px #fff8f4d4;
}

/* Contextual add-ons: subtle, optional. No surprise additions or discounts. */
.site-v5 .peek-pairings,
.site-v5 .drawer-pairing{
 display:block;
 padding:15px 12px;
 margin:15px 0;
 border-radius:11px;
 border:1px solid #dfd4bf;
 background:#fff5e7;
}
.site-v5 .peek-pairings[hidden],
.site-v5 .drawer-pairing[hidden],
.site-v5 .pairing-nudge[hidden]{display:none!important}
.site-v5 .pairing-heading{
 display:flex;
 align-items:center;
 gap:7px;
 margin-bottom:11px;
 color:#003c49;
 font-size:13px;
}
.site-v5 .pairing-heading i{color:#bc0f27;font-size:20px}
.site-v5 .pairing-list{display:grid;gap:11px}
.site-v5 .pairing-card{
 display:grid;
 grid-template-columns:58px minmax(0,1fr) auto;
 align-items:center;
 gap:9px;
}
.site-v5 .pairing-card img{
 width:58px;height:52px;
 object-fit:contain;
 border-radius:7px;
 background:#f3eadf;
}
.site-v5 .pairing-info{display:flex;flex-direction:column;gap:4px;min-width:0}
.site-v5 .pairing-info strong{font-size:12px;line-height:1.3;color:#003946}
.site-v5 .pairing-info small{font-size:13px;font-weight:800;color:#b40c22}
.site-v5 .pairing-card button{
 min-width:82px;min-height:43px;
 border:0;border-radius:50px;
 background:#004b56;color:#fff;
 font-size:12px;font-weight:800;
 padding:8px;
}
.site-v5 .drawer-pairing{margin:12px 0 14px}
.site-v5 .pairing-nudge{
 position:fixed;
 z-index:53;
 right:clamp(14px,3vw,38px);
 bottom:clamp(21px,2.8vw,40px);
 display:grid;
 grid-template-columns:61px minmax(0,1fr) auto;
 align-items:center;
 gap:9px;
 width:min(420px,calc(100vw - 28px));
 max-width:420px;
 min-height:92px;
 padding:12px 15px 12px 11px;
 border:1px solid #e4d3be;
 border-top:4px solid #f5c878;
 border-radius:15px;
 background:#fffaf1;
 box-shadow:0 18px 44px #00182255;
 color:#003c49;
}
.site-v5 .pairing-nudge-photo img{
 width:60px;height:60px;
 object-fit:contain;
 background:#f4ead9;
 border-radius:9px;
}
.site-v5 .pairing-nudge-info{
 display:flex;flex-direction:column;gap:2px;
 min-width:0;
 padding-right:5px;
}
.site-v5 .pairing-nudge-info span{font-size:10px;color:#6f7270;line-height:1.25}
.site-v5 .pairing-nudge-info strong{font-size:13px;line-height:1.18;font-weight:850}
.site-v5 .pairing-nudge-info small{font-weight:900;color:#b80e24;font-size:12px}
.site-v5 .pairing-nudge-add{
 min-height:42px;
 border:0;border-radius:10px;
 background:#bb0c23;color:white;
 font-size:12px;
 font-weight:800;
 white-space:nowrap;
 padding:10px;
}
.site-v5 .pairing-dismiss{
 position:absolute;top:-12px;right:-9px;
 width:29px;height:29px;
 border:1px solid #dabba9;
 background:white;color:#003b45;
 border-radius:50%;
 font-weight:800;
 font-size:19px;
 display:grid;place-items:center;
}

/* Beverage packshots now use identical native 16:9 image canvases, no forced
   cover crops. The original 360x250 JPEG-like pixel sources remain intact. */
.site-v5 #drink-products .product-photo img,
.site-v5 .product-card[data-id="agua"] .product-photo img,
.site-v5 .product-card[data-id="jarritos"] .product-photo img{
 object-fit:contain;
 object-position:center;
}
@media(max-width:990px){
 .site-v5 .modal{
  width:min(690px,95vw);
  grid-template-columns:minmax(0,.64fr) minmax(0,1.36fr);
 }
 .site-v5 .choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .site-v5 .modal-content{padding:19px}
 .site-v5 .choice-name{font-size:12px}
}
@media(max-width:680px){
 .site-v5 .reference-delivery-bar{background:#fff8ec}
 .site-v5 .reference-delivery-inner a{
  background:linear-gradient(145deg,#00515b,#003c45);
  border-top-color:#efbf67;
  min-height:0;
  box-shadow:0 7px 16px #00414d22;
 }
 .site-v5 .reference-delivery-inner a strong{color:white}
 .site-v5 .modal-wrap{padding:10px}
 .site-v5 .modal{
  width:min(430px,100%);
  max-height:94svh;
  grid-template-columns:1fr;
  grid-template-rows:auto minmax(0,1fr);
  border-radius:17px;
  overflow:hidden;
 }
 .site-v5 .modal-visual{
  height:clamp(95px,18svh,155px);
  max-height:155px;
 }
 .site-v5 .modal-visual img{height:100%;object-position:center}
 .site-v5 .modal-content{
  min-height:0;max-height:none;
  padding:14px 16px 17px;
  overflow-y:auto;
  gap:8px;
 }
 .site-v5 .modal h2{font-size:23px}
 .site-v5 .modal #choice-desc{font-size:12px;margin:0}
 .site-v5 .choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .site-v5 .choice-group legend{font-size:13px;margin-bottom:8px}
 .site-v5 .choice-tile{padding:5px}
 .site-v5 .choice-media{aspect-ratio:16/9}
 .site-v5 .choice-name{min-height:28px;font-size:11.5px}
 .site-v5 #confirm-choice{
  margin-top:6px;
  min-height:50px;
  width:100%;
  padding:9px;
  font-size:13px;
 }
 .site-v5 .pairing-nudge{
  bottom:84px;
  right:12px;
  width:calc(100vw - 24px);
  grid-template-columns:46px minmax(0,1fr) 80px;
  padding:10px;
  min-height:80px;
 }
 .site-v5 .pairing-nudge-photo img{width:46px;height:46px}
 .site-v5 .pairing-nudge-info strong{font-size:12px}
 .site-v5 .pairing-nudge-add{font-size:11px;min-height:40px}
 .site-v5 .pairing-card{grid-template-columns:44px minmax(0,1fr) 78px;gap:7px}
 .site-v5 .pairing-card img{width:44px;height:44px}
 .site-v5 .pairing-card button{min-width:78px;font-size:11px}
}
@media(max-width:360px){
 .site-v5 .choice-grid{gap:6px}
 .site-v5 .choice-tile{padding:4px}
 .site-v5 .choice-name{font-size:10.5px;line-height:1.2}
 .site-v5 .modal-visual{height:100px}
}
@media(prefers-reduced-motion:reduce){
 .site-v5 .choice-tile{transition:none}
}

/* Ultra-wide second-pass: increase content density without blowing up the
   16:9 artwork or requiring a horizontal scrollbar. */
@media(min-width:2200px){
 .site-v5 .site-header .nav-inner,
 .site-v5 .footer-grid,
 .site-v5 .site-footer>.container{max-width:2400px}
 .site-v5 .hero-layout{max-width:2350px}
 .site-v5 .hero-copy{width:36%;max-width:750px}
 .site-v5 .hero-copy h1{font-size:clamp(70px,3.1vw,94px)}
 .site-v5 .hero-visual{
  position:absolute;
  inset:0 0 0 auto;
  width:min(76vw,2650px);
  height:100%;
 }
 .site-v5 .hero-visual img{object-position:50% 46%}
 .site-v5 .hero-section::before{
  background:linear-gradient(90deg,#00323d 0%,#00323de8 24%,#00323dcc 38%,#00323d6a 60%,transparent 79%);
 }
 .site-v5 .specials-layout{max-width:2440px}
 .site-v5 .specials-intro{max-width:2340px}
 .site-v5 .specials-grid{max-width:2340px}
 .site-v5 .steps-layout{max-width:2240px}
 .site-v5 .steps-grid{max-width:1100px;justify-self:end;width:100%}
 .site-v5 .delivery-layout,.site-v5 .faq-layout{max-width:2320px}
 .site-v5 .reference-delivery-inner{max-width:2320px}
 .site-v5 .menu-section>.container{max-width:2390px}
 .site-v5 .closing-inner{max-width:2350px}
}

/* On panoramic screens, preserve the *whole* 16:9 food composition within the
   shorter hero instead of chopping off the shrimp cocktail at the top. */
@media(min-width:2200px){
 .site-v5 .hero-visual{background:#003b45}
 .site-v5 .hero-visual img{
  object-fit:contain;
  object-position:right center;
 }
}
