/* ══════════════════════════════════════════════════════════════════
   venn · the group invitation in the "dinner at venn" section of the homepage (EN and PT)
   10 Oct 2026. Links to /private-dining/ (/pt/private-dining/). The plum (lavender 800, #45374B) of the private
   dining page with the amber of its buttons; the button is set like the gift card's
   (.hg__btn) so the two sit together.
   Up to 1023 px: a box straight after the dinner text (on phones the text sits under the
     photo; from 768 it sits on the photo, with room to spare).
   1024 and up: the dinner text and the gift card already fill the photo, so the same
     line and button run as a plum band directly under the photo instead.
   The section's own rules (inline in index.html) force white text with !important, hence
   the !important on colours here.
   Built from _private-dining-prototypes/2026-10-10/refined.html (homepage view).
   ══════════════════════════════════════════════════════════════════ */
.venn-split .venn-split__text .hd-group{position:relative;margin:30px 0 26px;max-width:420px;padding:18px 20px 20px;background:rgba(69,55,75,.92);border:1px solid rgba(233,179,106,.5)}
.venn-split .venn-split__text .hd-group p{margin:0 !important;max-width:none !important;font-family:'Inter',sans-serif;font-weight:300;font-size:.9rem;line-height:1.55;color:#F1ECE2 !important;text-wrap:pretty}
.hd-group__btn,.venn-split .venn-split__text .hd-group__btn{display:flex;align-items:center;justify-content:space-between;gap:18px;width:fit-content;margin-top:14px !important;min-height:46px;padding:0 18px 0 20px;background:#E9B36A;color:#151714 !important;border:0 !important;font-family:'Inter',sans-serif;font-weight:400;font-size:.68rem;letter-spacing:.14em;line-height:1.2;text-decoration:none;text-transform:lowercase}
.hd-group__btn::after{content:"→";content:"→"/"";font-size:.9rem;letter-spacing:0;color:#151714 !important;transition:transform .3s}
/* the whole box takes the tap, not only the button */
.hd-group__btn::before{content:"";position:absolute;inset:0}
.hd-group:hover .hd-group__btn,.hd-group__btn:focus-visible{background:#F0C383}
.hd-group:hover .hd-group__btn::after,.hd-group__btn:focus-visible::after{transform:translateX(4px)}
.hd-group__btn:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media (prefers-reduced-motion:reduce){.hd-group__btn::after{transition:none}}
.hd-band{display:none}
/* phones: full width in the text column, the button across the box like the gift card's */
@media (max-width:767px){
  .venn-split .venn-split__text .hd-group{max-width:none;margin:26px 0 22px}
  .venn-split .venn-split__text .hd-group__btn{width:auto}
}
/* 1024 and up: the band under the photo */
@media (min-width:1024px){
  .venn-split .venn-split__text .hd-group{display:none}
  .hd-band{position:relative;display:flex;align-items:center;gap:32px;padding:22px 54px;background:#45374B;border-top:1px solid rgba(233,179,106,.5)}
  .hd-band p{margin:0;max-width:76ch;font-family:'Inter',sans-serif;font-weight:300;font-size:.92rem;line-height:1.55;color:#F1ECE2}
  .hd-band .hd-group__btn{flex:none;margin-top:0 !important}
}
