/* Homepage hero: the two awards under the buttons (div.venn-hero__awards, 4 Oct 2026).
   Food Made Good 3 Star badge (white, stars kept gold) and the We're Smart Green Guide radishes, no box around them,
   centred under "reserve a table" / "view menu" on phones, tablets and computers. Replaces the ratings pill.
   The buttons sit in div.venn-hero__act with the awards under them; on computers (1024 and wider) the buttons keep
   their natural width and the pair sits level with the address / hours row. The hero is one screen tall there, so
   it does not get longer.
   Selectors carry .venn-hero because the homepage's inline styles load after this file.
   Second version (4 Oct 2026): from 1100px wide the badge is twice the size (96px). The buttons and the pair then sit in
   a column pinned to the bottom right of the foot, out of the flow, so the headline and the text do not move up; the pair
   is as wide as the two buttons, so the edges line up.
   Third version (4 Oct 2026): the badge is twice the size on phones and tablets too (88px, was 44px), and 66px (was 48px)
   between 1024 and 1099 where the hero is shorter. */
.venn-hero .venn-hero__act{display:flex;flex-direction:column;align-items:center;gap:12px}
.venn-hero .venn-hero__act .venn-hero__btns{align-self:stretch}
.venn-hero .venn-hero__awards{display:inline-flex;align-items:center;padding:8px 6px;color:#fff;font-family:'Inter',sans-serif;line-height:1;white-space:nowrap}
.venn-hero .venn-hero__awards a{display:flex;align-items:center;gap:10px;padding:0 14px;color:inherit;text-decoration:none;border:0}
.venn-hero .venn-hero__awards a:focus-visible{outline:1px solid #fff;outline-offset:3px;border-radius:12px}
.venn-hero .va-fmg img{display:block;height:88px;width:auto;filter:drop-shadow(0 1px 5px rgba(0,0,0,.6))}
.venn-hero .va-sep{width:1px;align-self:stretch;margin:4px 0;background:#fff;opacity:.28}
.venn-hero .venn-hero__awards .va-ws{flex-direction:column;align-items:flex-start;gap:5px}
.venn-hero .va-marks{display:block;height:16px;width:auto;filter:drop-shadow(0 1px 5px rgba(0,0,0,.6))}
.venn-hero .va-d{font-weight:400;font-size:10.5px;letter-spacing:.005em;text-shadow:0 1px 8px rgba(0,0,0,.7),0 0 18px rgba(0,0,0,.4)}
.venn-hero .va-n{font-weight:300;font-size:9px;letter-spacing:.01em;opacity:.82;text-shadow:0 1px 8px rgba(0,0,0,.7),0 0 18px rgba(0,0,0,.4)}
@media(min-width:1024px){
  .venn-hero .venn-hero__foot{align-items:flex-end}
  .venn-hero .va-fmg img{height:66px}
  .venn-hero .va-marks{height:17px}
  .venn-hero .va-d{font-size:11px}
  .venn-hero .va-n{font-size:9.5px}
}
@media(min-width:1100px){
  .venn-hero .venn-hero__foot{position:relative;min-height:38px}
  .venn-hero .venn-hero__act{position:absolute;right:0;bottom:0;gap:10px}
  .venn-hero .venn-hero__awards{padding:0}
  .venn-hero .venn-hero__awards a{padding:0 10px}
  .venn-hero .va-fmg img{height:96px}
  .venn-hero .va-marks{height:17px}
}

/* 360°Eat Guide (26 Oct 2026): a third mark after We're Smart, the guide's own wordmark in white with "pioneer" under it,
   linking to venn's page in the guide. On phones the row shrinks a little so the three stay on one line.
   The two buttons now take their width from the row of marks (contain:inline-size stops them widening it) and stick out a
   little past it at each end: they sit side by side at every size, so tablets no longer get two full-width bars.
   From 1100 to 1279 the three marks are too wide to float in the bottom right corner (the "changes with the late autumn
   harvest" line ran under the badge), so there the buttons and marks stay in the row beside the address and hours. */
.venn-hero .va-360{display:flex;flex-direction:column;align-items:center;gap:6px}
.venn-hero .va-360 img{display:block;height:44px;width:auto;filter:drop-shadow(0 1px 5px rgba(0,0,0,.6))}
.venn-hero .venn-hero__act{align-self:center}
.venn-hero .venn-hero__act .venn-hero__btns{align-self:stretch;contain:inline-size;display:flex;flex-direction:row;flex-wrap:nowrap;gap:10px;margin:0}
.venn-hero .venn-hero__act .venn-hero__btns a{flex:1 1 0;min-width:0;text-align:center;white-space:nowrap;padding-left:10px;padding-right:10px}
@media(max-width:480px){
  .venn-hero .venn-hero__awards a{padding:0 9px}
  .venn-hero .va-fmg img{height:72px}
  .venn-hero .va-360 img{height:36px}
  .venn-hero .va-d{font-size:10px}
}
@media(min-width:1024px){
  .venn-hero .venn-hero__act{margin-left:32px;flex-shrink:0}
}
@media(min-width:1100px){
  .venn-hero .va-360 img{height:46px}
}
@media(min-width:1100px) and (max-width:1279px){
  .venn-hero .venn-hero__foot{min-height:0}
  .venn-hero .venn-hero__act{position:static;right:auto;bottom:auto;gap:12px}
  .venn-hero .va-fmg img{height:80px}
  .venn-hero .va-360 img{height:40px}
}