/* ==========================================================================
   catuabar.nl — HOUSE design system (Minimal · Cinematic · Elegant · clean)
   Our own styles. Replaces the theme/option experiment. Motion + grounding
   (expansive nav, expansive footer) are part of the system, not add-ons.
   ========================================================================== */

/* --- self-hosted typography: Cormorant Garamond (display) + Open Sans (text) --- */
@font-face { font-family:'Cormorant Garamond'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../fonts/cormorant-garamond-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Cormorant Garamond'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../fonts/cormorant-garamond-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Cormorant Garamond'; font-style:normal; font-weight:700; font-display:swap;
  src:url('../fonts/cormorant-garamond-700-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Open Sans'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url('../fonts/open-sans-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

:root {
  --paper:#faf8f5;
  --ink:#15140f;
  --muted:#6f6a61;
  --line:#e6e1d8;
  --accent:#3f6b4c;      /* CatuaBar green, used sparingly */
  --accent-2:#c9a86a;    /* gold hairline accent */
  --dark:#12120f;        /* cinematic bands + footer */
  --white:#ffffff;
  --font-display:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body:'Open Sans', system-ui, -apple-system, sans-serif;
  --container:1180px;
  --inner:1100px;
  --pad:40px;
  --sec:clamp(56px, 8vw, 120px);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; overflow-x:clip; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-body);
  font-size:16px; line-height:1.75; -webkit-font-smoothing:antialiased; overflow-x:clip;
  padding-top:var(--header-h, 72px); padding-bottom:var(--tebi-h, 0px); }

img { max-width:100%; height:auto; display:block; }
.site-footer__credit a { color:#cfc9bf; }
picture { display:block; }
a { color:inherit; text-decoration:none; }
h1,h2,h3,h4 { font-family:var(--font-display); font-weight:500; line-height:1.12; letter-spacing:-.005em; margin:0 0 18px; }
h1 { font-size:clamp(2.4rem, 5vw, 4rem); }
h2 { font-size:clamp(1.9rem, 3.4vw, 2.9rem); }
h3 { font-size:clamp(1.4rem, 2.2vw, 1.9rem); }
p { margin:0 0 18px; }
.eyebrow { font-family:var(--font-body); font-size:12px; font-weight:600; letter-spacing:.32em;
  text-transform:uppercase; color:var(--muted); margin:0 0 14px; }
.rule { width:56px; height:1px; background:var(--accent-2); border:0; margin:24px auto; }
.center { text-align:center; }

/* --- top bar: logo + nav links + language switcher + reserve CTA, fixed --- */
.site-header { position:fixed; left:0; right:0; top:0; z-index:50; background:var(--dark);
  padding:16px 10px; box-shadow:0 2px 12px rgba(0,0,0,.25); }
.site-header__inner { max-width:var(--container); margin:0 auto; padding:0 10px; display:flex; align-items:center; gap:20px; }
.site-header__logo img { width:150px; height:auto; }
.site-header__ctas { display:flex; gap:10px; margin-left:4px; }
.site-header__cta { margin:0; white-space:nowrap; }

.lang-switch { position:relative; }
.lang-switch__current { display:flex; align-items:center; gap:8px; background:transparent; border:1px solid #fff4; border-radius:2px;
  padding:7px 12px; color:#fff; font-size:12px; font-weight:600; letter-spacing:.08em; cursor:pointer; }
.lang-switch__current img, .lang-switch__list img { border-radius:2px; display:block; }
.lang-switch__list { position:absolute; right:0; top:100%; margin-top:6px; background:#fff; border:1px solid var(--line);
  box-shadow:0 18px 40px rgba(0,0,0,.18); list-style:none; padding:6px; min-width:120px; opacity:0; visibility:hidden;
  transform:translateY(-6px); transition:.2s var(--ease); z-index:60; }
.lang-switch.is-open .lang-switch__list { opacity:1; visibility:visible; transform:none; }
.lang-switch__list a { display:flex; align-items:center; gap:8px; padding:8px 10px; color:var(--ink); font-size:13px; }
.lang-switch__list a:hover { background:var(--paper); }

.site-nav { list-style:none; margin:0 auto 0 24px; padding:0; display:flex; align-items:center; gap:4px; }
.site-nav__item--ctas { display:none; }
.site-nav__link { position:relative; display:inline-block; padding:10px 14px; color:#fff; font-size:13px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; }
.site-nav__link::after { content:''; position:absolute; left:14px; right:14px; bottom:6px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.site-nav__link:hover::after, .site-nav__link[aria-current="page"]::after { transform:scaleX(1); }
.site-nav__sub { position:absolute; top:100%; left:0; min-width:230px; background:#fff; border:1px solid var(--line);
  box-shadow:0 24px 50px rgba(0,0,0,.12); padding:10px; margin:0; list-style:none; opacity:0; visibility:hidden;
  transform:translateY(6px); transition:.25s var(--ease); }
.site-nav__item { position:relative; }
.site-nav__sub-toggle { display:none; }
.site-nav__item.has-sub:hover .site-nav__sub, .site-nav__item:focus-within .site-nav__sub { opacity:1; visibility:visible; transform:none; }
.site-nav__sub a { display:block; padding:9px 12px; font-size:14px; color:var(--ink); }
.site-nav__sub a:hover { background:var(--paper); color:var(--accent); }
.nav-toggle { display:none; margin-left:auto; background:transparent; border:1px solid #fff6; border-radius:2px; padding:9px 11px; cursor:pointer; }
.nav-toggle span { display:block; width:20px; height:1.5px; background:#fff; margin:4px 0; }

/* --- buttons: restrained, elegant --- */
.btn { display:inline-block; font-family:var(--font-body); font-size:12.5px; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; padding:15px 26px; border:1px solid var(--ink); color:var(--ink); background:transparent;
  cursor:pointer; transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
.btn:hover { background:var(--ink); color:var(--paper); }
.btn--solid { background:var(--accent); border-color:var(--accent); color:#fff; }
.btn--solid:hover { background:var(--ink); border-color:var(--ink); }
.btn--light { border-color:#fff; color:#fff; }
.btn--light:hover { background:#fff; color:var(--ink); }
.btn--accent { background:var(--accent); border-color:var(--accent); color:#fff; }
.btn--accent:hover { background:#2f5339; border-color:#2f5339; }
.btn--accent-2 { background:var(--accent-2); border-color:var(--accent-2); color:var(--ink); }
.btn--accent-2:hover { background:#b4925a; border-color:#b4925a; }
.btn--sm { padding:11px 20px; }

/* --- cinematic hero --- */
.hero { position:relative; min-height:92vh; display:flex; align-items:flex-end; overflow:hidden;
  background:#0e0d0b center/cover no-repeat; color:#fff; }
.hero__media { position:absolute; inset:0; z-index:0; background-size:cover; background-position:center; transform:scale(1.06); animation:kenburns 16s var(--ease) forwards; }
.hero::before { content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(10,10,8,.35) 0%, rgba(10,10,8,.05) 40%, rgba(10,10,8,.72) 100%); }
.hero__inner { position:relative; z-index:2; max-width:var(--container); margin:0 auto; width:100%; padding:0 30px clamp(48px, 8vw, 110px); }
.hero__eyebrow { font-size:12px; letter-spacing:.34em; text-transform:uppercase; color:rgba(255,255,255,.8); margin:0 0 16px; }
.hero__title { font-family:var(--font-display); font-weight:500; font-size:clamp(2.8rem, 7vw, 6rem); line-height:1; margin:0 0 20px; }
.hero__lead { max-width:46ch; color:rgba(255,255,255,.86); margin:0 0 30px; }
.hero__actions { display:flex; gap:14px; flex-wrap:wrap; }
@keyframes kenburns { to { transform:scale(1); } }
.hero--compact { min-height:56vh; }

/* crossfade hero: multiple .hero__media--slide layers, one .is-active at a time */
.hero--crossfade .hero__media--slide { opacity:0; animation:none; transform:scale(1); transition:opacity 1.6s ease; }
.hero--crossfade .hero__media--slide.is-active { opacity:1; animation:kenburns 6s var(--ease) forwards; }

/* split hero: boutique two-column layout -- dark text panel + full-bleed image column */
.hero--split { align-items:stretch; min-height:100vh; background:var(--dark); }
.hero--split::before { display:none; }
.hero--split .hero__panel { flex:0 0 42%; display:flex; flex-direction:column; justify-content:center;
  padding:clamp(40px,6vw,64px) clamp(32px,5vw,80px); border-right:1px solid var(--accent-2); position:relative; z-index:2; }
.hero--split .hero__eyebrow { color:var(--accent-2); }
.hero--split .hero__title { font-size:clamp(2.6rem, 4.6vw, 4.6rem); }
.hero--split .hero__lead { font-size:1.02rem; font-weight:300; }
.hero--split .hero__media-col { position:relative; flex:1 1 58%; overflow:hidden; }
.hero--split .hero__media-col .hero__media { position:absolute; inset:0; }
@media (max-width:900px) {
  .hero--split { flex-direction:column; min-height:auto; }
  .hero--split .hero__panel { flex:none; border-right:0; border-bottom:1px solid var(--accent-2); padding:56px 24px; order:2; }
  .hero--split .hero__media-col { flex:none; height:56vh; order:1; }
}

/* continuous scroll throughout the site (no viewport-locked/scroll-snap sections). bg-gold/bg-green
   sections render as a highlighted full-width band inline with normal page flow. */
.section-band { margin:0 0 var(--sec); margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  padding:48px calc(50vw - 50% + var(--pad)); }
.section-band--gold { background:var(--accent-2); }
.section-band--gold .eyebrow { color:var(--ink); }
.section-band--green { background:var(--accent); color:#fff; }
.section-band--green .eyebrow { color:#fff; opacity:.85; }
.section-band--green h2 { color:#fff; }
.section-band--green p { color:rgba(255,255,255,.85); }
.section-band--green .btn--solid { background:#fff; color:var(--accent); border-color:#fff; }
.section-band--dark { background:var(--dark); color:#fff; }
.section-band--dark .eyebrow { color:#fff; opacity:.7; }
.section-band--dark h2 { color:#fff; }
.section-band--dark p { color:rgba(255,255,255,.75); }
.section-band--dark .event-card { border-top-color:rgba(255,255,255,.3); }
.section-band--dark .event-card__title { color:#fff; }
.section-band--dark .event-card__by, .section-band--dark .event-card__sum { color:rgba(255,255,255,.75); }
.section-band--dark .btn { border-color:#fff; color:#fff; }
.section-band--dark .btn:hover { background:#fff; color:var(--dark); }

/* --- breadcrumbs: sits as the first element inside .content, right below the hero;
   .content already supplies the horizontal padding/max-width and its own top padding
   (var(--sec)) for the hero gap, so this only needs a tight bottom margin of its own. */
.breadcrumbs { margin:0 0 20px; }
.breadcrumbs ol { display:flex; flex-wrap:wrap; align-items:center; gap:6px; list-style:none; padding:0; margin:0; font-size:13px; color:var(--muted); }
.breadcrumbs li { display:flex; align-items:center; gap:6px; }
.breadcrumbs li:not(:last-child)::after { content:'/'; color:var(--line); }
.breadcrumbs a { color:var(--muted); text-decoration:none; border-bottom:1px solid transparent; transition:color .2s var(--ease), border-color .2s var(--ease); }
.breadcrumbs a:hover { color:var(--accent); border-color:var(--accent); }
.breadcrumbs [aria-current="page"] { color:var(--ink); }

/* --- content + sections --- */
.content { background:var(--white); max-width:var(--container); margin:0 auto; padding:var(--sec) var(--pad); }
.section { padding:0 0 var(--sec); }
.section:last-child { padding-bottom:0; }
.section-head { text-align:center; max-width:64ch; margin:0 auto var(--sec); }
.instagram-feed__cta { margin-top:12px; }
.event-list__see-more { margin-top:28px; }

/* /sitemap: professional column layout, grouped by section + locale */
.sitemap-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(28px,4vw,56px); margin:0 0 var(--sec); }
.sitemap-group h2 { font-size:1.15rem; text-align:left; margin:0 0 14px; padding-bottom:10px; border-bottom:1px solid var(--accent-2); }
.sitemap-group__list { list-style:none; margin:0; padding:0; }
.sitemap-group__list li { border-bottom:1px solid var(--line); }
.sitemap-group__list a { display:block; padding:9px 0; font-size:14px; color:var(--muted); }
.sitemap-group__list a:hover { color:var(--accent); }
@media (max-width:860px) {
  .sitemap-grid { grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:560px) {
  .sitemap-grid { grid-template-columns:1fr; }
}

/* sticky category label for long scrolling menus (cocktails, wine) */
.menu-cat-head { position:sticky; top:var(--header-h, 72px); z-index:5; background:var(--white);
  text-align:center; padding:14px 0; margin:0 0 24px; border-bottom:1px solid var(--line); }
.menu-cat-head h2 { margin:0; }
.lede { color:var(--muted); font-size:clamp(1.02rem, 1.3vw, 1.18rem); text-align:center; max-width:62ch; margin:0 auto 48px; }
.section-title-band { text-align:center; padding:0 0 40px; }
.section-title-band h1, .section-title-band h2 { margin:0; }
.section-title-band .subtitle { margin-top:10px; color:var(--muted); letter-spacing:.14em; text-transform:uppercase; font-size:12px; }

.prose { color:var(--muted); max-width:74ch; margin:0 auto var(--sec); }
.prose h1,.prose h2,.prose h3 { color:var(--ink); text-align:center; }
.prose:has(.plan-detail) { max-width:none; }
.plan-detail { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.prose .plan-detail__item h3 { text-align:left; font-size:1.2rem; margin:0 0 10px; border-top:2px solid var(--ink); padding-top:16px; }
.prose .plan-detail__item p { text-align:left; margin:0; }
@media (max-width:860px) { .plan-detail { grid-template-columns:1fr; gap:24px; } }
.prose p { text-align:center; }
.prose--left { margin-left:0; margin-right:auto; }
.prose--left p { text-align:left; }
.prose a:not(.btn) { color:var(--accent); border-bottom:1px solid var(--accent-2); }
.prose img { width:100%; margin:22px 0; }

/* cinematic quote band */
.quote-band { background:var(--dark); color:#fff; text-align:center; padding:clamp(56px,9vw,120px) 30px; }
.quote-band { font-family:var(--font-display); font-weight:400; font-size:clamp(1.7rem,3.6vw,3rem); line-height:1.25; }
.quote-band em { color:var(--accent-2); font-style:italic; }

/* two-column rows */
.feature-row { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,72px); align-items:center; margin:0 0 var(--sec); }
.feature-row__media { position:relative; }
.feature-row__media img { width:100%; }
.feature-row__badge { position:absolute; right:-20px; bottom:-20px; z-index:2; background:var(--ink); color:#fff;
  padding:18px 26px; font-family:var(--font-display); font-size:1.3rem; box-shadow:0 18px 40px rgba(0,0,0,.25); }
.feature-row__title { font-size:clamp(1.5rem,2.4vw,2.1rem); text-align:left; }
.photo-overlap { position:relative; }
.photo-overlap__tag { position:absolute; left:-18px; bottom:-18px; z-index:2; margin:0; background:var(--accent-2); color:var(--ink);
  padding:14px 22px; font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; box-shadow:0 18px 40px rgba(0,0,0,.25); }
@media (max-width:720px) { .photo-overlap__tag { left:10px; bottom:10px; padding:10px 16px; font-size:11px; } }
.feature-row--reverse .feature-row__media { order:2; }
.feature-row .prose { margin:0; }
.feature-row .prose p { text-align:left; }

/* homepage "Our Story" teaser: text + photo, two-column feature row */
.story-teaser__grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:center; width:100%; }
.story-teaser__text .eyebrow { text-align:left; }
.story-teaser__text h2 { text-align:left; }
.story-teaser__text p { color:var(--muted); text-align:left; }
.story-teaser__media { overflow:hidden; }
.story-teaser__media img { width:100%; height:auto; display:block; }
.story-teaser__links { display:flex; gap:14px; flex-wrap:wrap; margin-top:18px; }
@media (max-width:860px) {
  .story-teaser__grid { grid-template-columns:1fr; }
  .story-teaser__media { order:-1; }
}

/* grids */
.gallery { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:220px; gap:0; margin:22px 0; }
.gallery__trigger { display:block; width:100%; height:100%; padding:0; margin:0; border:0; background:none; cursor:zoom-in; }
.gallery picture { position:relative; overflow:hidden; display:block; height:100%; }
.gallery img { width:100%; height:116%; object-fit:cover; position:relative; top:-8%; will-change:transform; }

/* full-screen gallery lightbox */
.lightbox { position:fixed; inset:0; z-index:10020; background:rgba(10,10,8,.94); display:flex; align-items:center; justify-content:center; }
.lightbox[hidden] { display:none; }
.lightbox__img { max-width:90vw; max-height:88vh; object-fit:contain; }
.lightbox__close, .lightbox__prev, .lightbox__next { position:absolute; background:none; border:0; color:#fff; cursor:pointer;
  font-size:28px; line-height:1; padding:12px; }
.lightbox__close:hover, .lightbox__prev:hover, .lightbox__next:hover { color:var(--accent-2); }
.lightbox__close { top:12px; right:12px; }
.lightbox__prev { left:12px; top:50%; transform:translateY(-50%); }
.lightbox__next { right:12px; top:50%; transform:translateY(-50%); }
@media (max-width:560px) { .lightbox__prev, .lightbox__next { font-size:22px; padding:8px; } }
.cols { display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,56px); align-items:center; margin:var(--sec) 0; }
.cols .prose p { text-align:left; }
.col-image img { width:100%; }
.image-block { margin:22px 0; } .image-block img { width:100%; }

/* card-grid: landing-page cards (Experience, Explore) */
.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.card-grid__item { display:block; text-decoration:none; color:inherit; border-top:2px solid var(--ink); padding-top:20px; transition:border-color .25s var(--ease); }
.card-grid__item:hover { border-color:var(--accent); }
.card-grid__media { width:100%; height:220px; background-size:cover; background-position:center; margin-bottom:16px; }
.card-grid__item h3 { font-size:1.35rem; margin:0 0 8px; }
.card-grid__item p { color:var(--muted); font-size:14px; margin:0 0 10px; }
.card-grid__link { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); font-weight:600; }
@media (max-width:860px) { .card-grid { grid-template-columns:1fr; } }

/* decorative cocktail-motif SVG divider -- citrus wheel, ice, bar spoon, olive pick */
.motif-divider { margin:40px 0; text-align:center; }
.motif-divider img { width:100%; max-width:640px; height:auto; }

/* --- expansive footer (grounding) --- */
.site-footer { background:var(--dark); color:#cfc9bf; padding:clamp(56px,8vw,110px) 30px clamp(28px,3vw,44px); }
.site-footer__inner { max-width:var(--container); margin:0 auto; }
.site-footer__top { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(24px,3vw,56px); }
.site-footer__top > * { min-width:0; }
.site-footer__brand { grid-column:1 / -1; }
.site-footer__brand img { width:190px; margin-bottom:18px; }
.site-footer__brand p { color:#8f8a80; font-size:14px; max-width:34ch; }
.site-footer__heading { font-family:var(--font-body); font-size:12px; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:#fff; margin:0 0 16px; }
.site-footer__links { list-style:none; padding:0; margin:0; }
.site-footer__links a { display:block; padding:5px 0; color:#b7b1a7; font-size:14px; transition:color .25s var(--ease), padding-left .25s var(--ease); }
.site-footer__links a:hover { color:#fff; padding-left:5px; }
.newsletter { margin:clamp(36px,5vw,64px) 0 0; padding-top:34px; border-top:1px solid #2a2a26; display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.newsletter label { font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:#fff; }
.newsletter input { flex:1 1 220px; min-width:0; background:transparent; border:1px solid #3a3a34; color:#fff; padding:14px 16px; font-family:var(--font-body); }
.newsletter input::placeholder { color:#7c776d; }
.site-footer__bottom { margin-top:clamp(28px,4vw,52px); padding-top:26px; border-top:1px solid #2a2a26; display:flex; gap:20px; flex-wrap:wrap; align-items:center; justify-content:space-between; color:#8f8a80; font-size:13px; }
.site-footer__bottom a { color:#cfc9bf; }
.site-footer__age { display:inline-block; border:1px solid var(--accent-2); color:var(--accent-2); padding:8px 14px; font-size:12px; letter-spacing:.14em; text-transform:uppercase; }
.site-footer__social { display:flex; flex-wrap:wrap; gap:16px; list-style:none; padding:0; margin:0; }
.site-footer__social a { color:#b7b1a7; font-size:14px; text-transform:uppercase; letter-spacing:.1em; transition:color .25s var(--ease); }
.site-footer__social a:hover { color:#fff; }

/* event showcase */
.event-list { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.event-card { border-top:2px solid var(--ink); padding-top:20px; }
.event-card__date { font-family:var(--font-display); font-size:1.6rem; color:var(--accent); margin:0 0 6px; }
.event-card__title { font-size:1.35rem; margin:0 0 8px; }
.event-card__by { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 0 12px; }
.event-card__sum { color:var(--muted); font-size:15px; }
.event-card .btn { margin-top:8px; }
.event-card__actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; }
.event-card__actions .btn { margin-top:0; }
.experience-strip { background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.experience-strip__inner { max-width:var(--container); margin:0 auto; padding:clamp(36px,5vw,64px) 30px; display:grid;
  grid-template-columns:repeat(3,1fr); gap:30px; text-align:center; }
.experience-strip h3 { margin:0 0 6px; }
.experience-strip p { color:var(--muted); margin:0; font-size:14px; }

/* cocktail grid + detail */
.cocktail-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:0 0 var(--sec); }
.cocktail-card { display:block; border-top:2px solid var(--ink); padding-top:20px; text-decoration:none; color:inherit; }
.cocktail-card__media { width:100%; height:200px; background-size:cover; background-position:center; margin-bottom:16px; }
.cocktail-card h3 { font-size:1.35rem; margin:0 0 8px; }
.cocktail-card__origin { color:var(--muted); font-size:13px; letter-spacing:.06em; margin:0 0 8px; }
.cocktail-card__price { font-family:var(--font-display); color:var(--accent); font-size:1.2rem; margin:0; }
.cocktail-detail__media, .event-detail__media { height:44vh; background-size:cover; background-position:center; }
.cocktail-detail__origin { color:var(--muted); font-size:14px; letter-spacing:.06em; margin:0 0 24px; }
.cocktail-detail__ingredients { list-style:none; padding:0; margin:0 0 24px; color:var(--muted); }
.cocktail-detail__ingredients li { padding:8px 0; border-bottom:1px solid var(--line); }
.cocktail-detail__price { font-family:var(--font-display); color:var(--accent); font-size:1.6rem; margin:0 0 24px; }
.event-detail__by { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 0 20px; }
.event-detail__attrs { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:18px; margin:0 0 32px;
  padding:20px; border:1px solid var(--line); border-radius:4px; background:var(--paper); }
.event-detail__attrs dt { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 0 4px; }
.event-detail__attrs dd { margin:0; font-family:var(--font-display); font-size:1.15rem; color:var(--ink); }
.btn--outline { background:transparent; border-color:var(--ink); color:var(--ink); }
.btn--outline:hover { background:var(--ink); color:var(--paper); }
.event-detail__actions { display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; margin:0 0 32px; }
.event-detail__share { display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-size:13px; }
.event-detail__share span { color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:11px; }
.event-detail__share a, .event-detail__copy-link { color:var(--ink); text-decoration:underline; background:none; border:none; padding:0; font:inherit; cursor:pointer; }
.event-detail__share a:hover, .event-detail__copy-link:hover { color:var(--accent); }

/* seasonal menu showcase */
.menu-download { text-align:center; margin:var(--sec) 0; }
.menu-showcase { display:grid; gap:48px; }
.menu-showcase__menu h3 { font-size:1.6rem; margin:0 0 6px; }
.menu-showcase__pairing { font-size:12px; letter-spacing:.14em; text-transform:uppercase; margin:0 0 16px; }
.menu-showcase__pairing a { color:var(--accent-2); border-bottom:1px solid var(--accent-2); }
.menu-showcase__item { border-top:1px solid var(--line); padding:16px 0; }
.menu-showcase__item-name { font-weight:600; margin:0 0 4px; display:flex; justify-content:space-between; gap:12px; }
.menu-showcase__item-name span { color:var(--accent); font-weight:400; }
.menu-showcase__item-desc { color:var(--muted); font-size:14px; margin:0; }
.menu-showcase__photo { margin:28px 0; border-radius:2px; overflow:hidden; }
.menu-showcase__photo img { width:100%; height:420px; object-fit:cover; display:block; }
@media (max-width:720px) { .menu-showcase__photo img { height:260px; } }

/* wine list */
.wine-list__group { max-width:74ch; margin:0 auto var(--sec); }
.wine-row { display:flex; justify-content:space-between; gap:24px; border-top:1px solid var(--line); padding:16px 0; }
.wine-row__name { font-family:var(--font-display); font-size:1.15rem; margin:0 0 2px; }
.wine-row__origin { color:var(--muted); font-size:13px; letter-spacing:.04em; margin:0 0 4px; }
.wine-row__desc { color:var(--muted); font-size:13px; font-style:italic; margin:0; }
.wine-row__price { text-align:right; white-space:nowrap; }
.wine-row__price span { color:var(--muted); font-size:13px; margin-right:10px; }
.wine-row__price strong { font-family:var(--font-display); color:var(--accent); font-size:1.1rem; }

/* staff / team */
.staff-grid__group { max-width:640px; margin:0 auto 48px; }
.staff-grid__group img { width:100%; display:block; }
.staff-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.staff-card { text-align:center; }
.staff-card__photo { width:140px; height:140px; border-radius:50%; background-size:cover; background-position:center; margin:0 auto 16px; background-color:var(--paper); }
.staff-card h3 { font-size:1.25rem; margin:0 0 4px; }
.staff-card__role { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin:0 0 10px; }
.staff-card__bio { color:var(--muted); font-size:14px; }

/* contact info (NAP) */
.contact-info { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin:0 0 var(--sec); }
.contact-info__block--name { grid-column:1 / -1; }
.contact-info__business-name { font-family:var(--font-display); font-size:clamp(1.8rem,4vw,2.6rem); margin:0 0 8px; }
.contact-info__hours { list-style:none; margin:0; padding:0; }
.contact-info__hours li { display:flex; justify-content:space-between; gap:16px; padding:4px 0; border-bottom:1px solid var(--line); font-size:14px; }
.contact-info__hours li span:first-child { color:var(--muted); }
.page-contact-us .content { display:grid; grid-template-columns:1fr 1.2fr; gap:56px; align-items:start; }
.page-contact-us .contact-info { grid-template-columns:1fr; gap:24px; }
@media (max-width:860px) {
  .page-contact-us .content { grid-template-columns:1fr; gap:40px; }
}

/* contact cta */
.contact-cta { text-align:center; padding:var(--sec) 0; margin:0 0 var(--sec); }
.contact-cta p { color:var(--muted); max-width:52ch; margin:0 auto 24px; }
.contact-cta--dark { background:var(--dark); color:#fff;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  padding-left:calc(50vw - 50%); padding-right:calc(50vw - 50%); }
.contact-cta--dark p { color:rgba(255,255,255,.75); }

/* location map: static OSM tile mosaic (no iframe/WebGL/API-key dependency) */
.map-section-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:clamp(24px,4vw,56px); align-items:stretch; }
.map-info-card { background:var(--dark); color:#fff; padding:clamp(28px,4vw,48px); display:flex; flex-direction:column;
  justify-content:center; gap:14px; border-top:3px solid var(--accent-2); }
.map-info-card p { margin:0; }
.map-info-card__address { font-family:var(--font-display); font-size:1.3rem; color:var(--accent-2); }
.map-info-card a { color:#fff; border-bottom:1px solid var(--accent-2); }
.map-info-card a:hover { color:var(--accent-2); }
.map-info-card .btn { margin-top:10px; align-self:flex-start; }
@media (max-width:860px) { .map-section-grid { grid-template-columns:1fr; } }
.map-embed { position:relative; width:100%; height:440px; margin:0 0 12px; overflow:hidden; }
.map-tiles { position:absolute; inset:0; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(3,1fr); }
.map-tiles img { width:100%; height:100%; display:block; object-fit:cover; }
.map-pin { position:absolute; width:14px; height:14px; margin:-18px 0 0 -7px; border-radius:50% 50% 50% 0;
  background:var(--accent); transform:rotate(-45deg); box-shadow:0 2px 6px rgba(0,0,0,.4); z-index:2; }
.map-pin::after { content:""; position:absolute; inset:3px; background:var(--paper); border-radius:50%; }
.map-attribution { position:absolute; right:8px; bottom:6px; z-index:2; margin:0; font-size:11px;
  background:rgba(255,255,255,.85); padding:2px 8px; }
.map-attribution a { color:var(--ink); text-decoration:underline; }
@media (max-width:720px) { .map-embed { height:320px; } }

/* areas served */
.area-list { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:0 0 var(--sec); }
.area-list__item { border-top:2px solid var(--ink); padding-top:16px; }
.area-list__dist { color:var(--muted); font-size:13px; margin:0; }
@media (max-width:720px) { .area-list { grid-template-columns:1fr; } }

/* --- contact form --- */
.form { max-width:560px; margin:24px 0; }
.form label { display:block; margin:16px 0 6px; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.form input, .form textarea, .form select { width:100%; padding:14px 16px; border:1px solid var(--line); background:#fdfcfa; color:var(--ink); font-family:var(--font-body); font-size:16px; }
.form textarea { min-height:150px; resize:vertical; }
.form input[type="checkbox"] { width:auto; display:inline-block; margin:0 8px 0 0; vertical-align:middle; }
.form label:has(input[type="checkbox"]) { display:flex; align-items:center; text-transform:none; letter-spacing:normal; font-size:14px; color:var(--ink); }
.form__event-fields { border-left:2px solid var(--accent-2); padding-left:16px; margin:16px 0; }
.form .btn { margin-top:20px; }

/* --- motion (progressive enhancement) --- */
.reveal { opacity:0; transform:translateY(22px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.btn.reveal { transition:opacity .9s var(--ease), transform .9s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
.reveal.is-in { opacity:1; transform:none; }
.card-grid__item.reveal { transition:opacity .9s var(--ease), transform .9s var(--ease), border-color .25s var(--ease); }
.reveal-delay-1 { transition-delay:.08s; } .reveal-delay-2 { transition-delay:.16s; } .reveal-delay-3 { transition-delay:.24s; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity:1; transform:none; transition:none; }
  .hero__media { animation:none; transform:none; }
  html { scroll-behavior:auto; }
}

/* --- responsive --- */
@media (max-width:1023px) {
  .nav-toggle { display:block; order:3; }
  .site-header__ctas { display:none; }
  .lang-switch { order:2; }
  .site-nav { position:absolute; top:100%; left:0; right:0; background:var(--dark); display:none; flex-direction:column; align-items:stretch; padding:14px 22px 26px; margin:0; order:5; width:100%;
    max-height:calc(100dvh - var(--header-h, 72px)); overflow-y:auto; -webkit-overflow-scrolling:touch; }
  .site-nav__item--ctas { display:flex; gap:10px; flex-wrap:wrap; padding:18px 4px 4px; border-bottom:0; }
  .site-header__logo img { width:124px; }
  .site-nav.is-open { display:flex; }
  .site-nav__link { color:#fff; padding:14px 4px; border-bottom:1px solid #26262226; }
  .site-nav__sub { position:static; opacity:1; visibility:visible; transform:none; background:transparent; box-shadow:none; border:0;
    padding:0 0 0 14px; max-height:0; overflow:hidden; transition:max-height .25s var(--ease); }
  .site-nav__sub a { color:#b7b1a7; }
  .site-nav__item.has-sub > .site-nav__link::after { display:none; }
  .site-nav__sub-toggle { display:block; position:absolute; top:0; right:0; width:44px; height:44px; background:transparent; border:0; cursor:pointer; }
  .site-nav__sub-toggle::before { content:''; position:absolute; top:50%; left:50%; width:9px; height:9px; margin:-6px 0 0 -5px;
    border-right:1.5px solid #fff; border-bottom:1.5px solid #fff; transform:rotate(45deg); transition:transform .2s var(--ease); }
  .site-nav__sub-toggle[aria-expanded="true"]::before { transform:rotate(-135deg); margin-top:-3px; }
  .site-nav__sub-toggle[aria-expanded="true"] + .site-nav__sub { max-height:400px; }
  .feature-row, .cols, .cocktail-grid, .event-list, .staff-grid, .contact-info { grid-template-columns:1fr; gap:22px; }
  .wine-row { flex-direction:column; gap:4px; }
  .wine-row__price { text-align:left; }
  .feature-row__badge { right:10px; bottom:10px; padding:12px 18px; font-size:1.05rem; }
  .feature-row--reverse .feature-row__media { order:0; }
  .feature-row__title, .feature-row .prose p, .cols .prose p { text-align:left; }
  .gallery { grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
  .experience-strip__inner { grid-template-columns:1fr; }
  .site-footer__top { grid-template-columns:1fr 1fr; }
  .site-footer__brand { grid-column:1 / -1; }
  .content { padding:clamp(36px,7vw,64px) 18px; }
  .section-band { padding:36px calc(50vw - 50% + 18px); }
}
@media (max-width:620px) { .site-footer__top { grid-template-columns:1fr; } }
