:root {
  --green: #3d4c37;
  --green-deep: #2f3a2b;
  --rose: #efaeac;
  --aubergine: #33032b;
  --purple: #6c2568;
  --red: #a64e52;
  --cream: #f5f0e8;
  --paper: #fffdf8;
  --ink: #171717;
  --white: #fff;
  --max: 1440px;
  --gutter: clamp(1.25rem, 3.5vw, 4.5rem);
  --rockwell: Rockwell, "Rockwell Nova", "Roboto Slab", Georgia, serif;
  --sans: Inter, Arial, Helvetica, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); line-height: 1.55; }
img { display:block; width:100%; height:auto; }
a { color:inherit; }
button, input, select, textarea { font:inherit; }

.skip-link { position:fixed; left:1rem; top:-5rem; z-index:999; background:#fff; padding:.75rem 1rem; }
.skip-link:focus { top:1rem; }
.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; }

.site-header {
  position: sticky; top:0; z-index:100; min-height:76px;
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
  padding:.75rem var(--gutter); background:#000; color:#fff;
}
.brand { text-decoration:none; display:grid; grid-template-columns:auto auto; align-items:end; column-gap:.45rem; line-height:.83; }
.brand-kicker { font:700 .58rem/1 var(--rockwell); letter-spacing:.24em; grid-row:1; }
.brand-main { font:900 2.1rem/.78 var(--rockwell); grid-row:1/3; grid-column:2; letter-spacing:.08em; }
.brand-sub { grid-column:1/3; margin-top:.3rem; font:700 .58rem/1 var(--sans); letter-spacing:.29em; color:var(--rose); }
.main-nav { display:flex; align-items:center; gap:clamp(1rem,2vw,2rem); font-size:.82rem; text-transform:uppercase; letter-spacing:.08em; }
.main-nav a { text-decoration:none; }
.main-nav a:hover { color:var(--rose); }
.nav-cta { border:1px solid rgba(255,255,255,.55); padding:.72rem 1rem; }
.back-katz { color:var(--rose); }
.menu-toggle { display:none; background:none; border:0; padding:.6rem; }
.menu-toggle span:not(.sr-only) { display:block; width:26px; height:2px; margin:5px; background:#fff; }

.hero { min-height:calc(100svh - 76px); display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); position:relative; overflow:hidden; background:var(--aubergine); color:#fff; }
.hero-copy { padding:clamp(4rem,8vw,8rem) var(--gutter); display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; }
.eyebrow { margin:0 0 1.5rem; text-transform:uppercase; letter-spacing:.16em; font-size:.72rem; font-weight:700; }
.eyebrow.dark { color:var(--red); }
.hero h1, h2, h3 { font-family:var(--rockwell); }
.hero h1 { margin:0; font-size:clamp(3.7rem,8vw,8.5rem); line-height:.82; letter-spacing:-.04em; text-transform:uppercase; max-width:8ch; }
.hero h1 em { color:var(--rose); font-style:normal; }
.hero-lead { max-width:39rem; margin:2.2rem 0 0; font-size:clamp(1rem,1.35vw,1.25rem); color:rgba(255,255,255,.84); }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.5rem; margin-top:2.4rem; }
.button { display:inline-flex; align-items:center; justify-content:center; border:0; text-decoration:none; cursor:pointer; text-transform:uppercase; font-weight:800; letter-spacing:.08em; font-size:.78rem; padding:1rem 1.25rem; }
.button-light { background:var(--rose); color:var(--aubergine); }
.button-light:hover { background:#fff; }
.text-link { color:#fff; text-transform:uppercase; font-size:.76rem; letter-spacing:.08em; font-weight:700; text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:.15rem; }
.text-link.dark { color:var(--aubergine); }
.hero-media { background:linear-gradient(90deg,rgba(51,3,43,.2),rgba(51,3,43,0)), url('../img/hero-service.webp') center 43%/cover no-repeat; min-height:660px; }
.hero-stamp { position:absolute; right:-.75rem; bottom:-.8rem; z-index:3; font:900 clamp(2.2rem,5.5vw,6rem)/.72 var(--rockwell); color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.55); text-align:right; letter-spacing:.02em; pointer-events:none; }

.section-pad { padding:clamp(5rem,9vw,9rem) var(--gutter); }
.intro { max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(3rem,8vw,9rem); align-items:end; }
.intro h2, .story-copy h2, .references h2 { margin:0; font-size:clamp(3rem,6vw,6.8rem); line-height:.86; letter-spacing:-.045em; color:var(--green); }
.intro-copy { max-width:38rem; }
.large-copy { font-size:clamp(1.2rem,1.8vw,1.65rem); line-height:1.35; }

.services { display:grid; grid-template-columns:repeat(4,1fr); min-height:560px; }
.service-card { min-height:560px; position:relative; display:flex; align-items:flex-end; overflow:hidden; color:#fff; isolation:isolate; }
.service-card::before { content:""; position:absolute; inset:0; background-position:center; background-size:cover; transition:transform .55s ease; z-index:-2; }
.service-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.08) 25%,rgba(0,0,0,.8)); z-index:-1; }
.service-card:hover::before { transform:scale(1.035); }
.service-card--catering::before { background-image:url('../img/food-starters.webp'); }
.service-card--foodtruck::before { background-image:url('../img/foodtruck-front.webp'); }
.service-card--bars::before { background-image:url('../img/bar-beer.webp'); }
.service-card--events::before { background-image:url('../img/event-hall.webp'); }
.service-card__content { padding:2rem; }
.service-card__content > span { font:700 .7rem var(--sans); opacity:.7; }
.service-card h3 { margin:.45rem 0 .7rem; font-size:clamp(1.8rem,2.5vw,3rem); line-height:.92; text-transform:uppercase; }
.service-card p { margin:0; max-width:24rem; color:rgba(255,255,255,.84); }
.service-card small { display:block; margin-top:1rem; text-transform:uppercase; letter-spacing:.12em; color:var(--rose); }

.on-tour { position:relative; background:var(--green); color:#fff; display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(3rem,7vw,8rem); overflow:hidden; }
.tour-pattern { position:absolute; width:42vw; min-width:420px; aspect-ratio:.75; right:-12vw; top:-18%; background:url('../img/tapete.webp') center/cover; opacity:.16; mix-blend-mode:luminosity; transform:rotate(8deg); }
.tour-copy { align-self:center; position:relative; z-index:2; }
.tour-copy h2 { margin:0 0 2rem; font-size:clamp(3rem,6vw,6.5rem); line-height:.87; letter-spacing:-.04em; text-transform:uppercase; }
.tour-copy h2 em { color:var(--rose); font-style:normal; }
.tour-copy p:last-child { max-width:36rem; font-size:1.05rem; color:rgba(255,255,255,.82); }
.tour-gallery { position:relative; display:grid; grid-template-columns:1.2fr .8fr; grid-template-rows:1fr 1fr; gap:1rem; z-index:2; }
.tour-gallery figure { margin:0; min-height:260px; overflow:hidden; }
.tour-gallery__large { grid-row:1/3; min-height:650px !important; }
.tour-gallery img { width:100%; height:100%; object-fit:cover; }

.catering-story { max-width:var(--max); margin:auto; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(3rem,8vw,9rem); align-items:center; }
.story-images { position:relative; min-height:720px; }
.story-image { position:absolute; object-fit:cover; }
.story-image--main { width:78%; height:82%; left:0; top:0; }
.story-image--small { width:48%; height:46%; right:0; bottom:0; border:12px solid var(--paper); }
.story-copy h2 { font-size:clamp(3rem,5.5vw,6rem); margin-bottom:1.7rem; }

.big-events { min-height:760px; position:relative; display:flex; align-items:flex-end; color:#fff; overflow:hidden; }
.big-events__image, .big-events__overlay { position:absolute; inset:0; width:100%; height:100%; }
.big-events__image { object-fit:cover; }
.big-events__overlay { background:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.18) 65%),linear-gradient(0deg,rgba(0,0,0,.6),transparent 55%); }
.big-events__content { position:relative; z-index:2; width:100%; padding:clamp(4rem,7vw,7rem) var(--gutter); }
.big-events h2 { margin:0; font-size:clamp(4rem,8vw,9rem); line-height:.77; letter-spacing:-.04em; }
.facts { margin-top:3.3rem; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:rgba(255,255,255,.38); max-width:1100px; }
.facts div { padding:1.25rem; background:rgba(0,0,0,.45); backdrop-filter:blur(6px); }
.facts strong { display:block; font:800 clamp(1.4rem,2.5vw,2.4rem) var(--rockwell); color:var(--rose); }
.facts span { display:block; margin-top:.25rem; font-size:.82rem; }

.references { max-width:var(--max); margin:auto; display:grid; grid-template-columns:.9fr 1.1fr; grid-template-areas:"head list" "team list"; gap:clamp(2.5rem,5vw,6rem); }
.references-head { grid-area:head; }
.references-head p:last-child { max-width:35rem; }
.reference-list { grid-area:list; align-self:start; border-top:1px solid #ccc; }
.reference-list span { display:block; font:700 clamp(1.25rem,2vw,2rem)/1.15 var(--rockwell); padding:1.1rem 0; border-bottom:1px solid #ccc; color:var(--green); }
.references-team { grid-area:team; margin:0; max-width:620px; }
.references-team img { aspect-ratio:4/3; object-fit:cover; object-position:center; }

.request { background:var(--aubergine); color:#fff; display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(3rem,8vw,9rem); padding:clamp(5rem,9vw,9rem) var(--gutter); }
.request-copy h2 { margin:0 0 2rem; font-size:clamp(4rem,8vw,8rem); line-height:.78; letter-spacing:-.04em; }
.request-copy p:last-child { max-width:30rem; color:rgba(255,255,255,.78); font-size:1.1rem; }
.request-form { max-width:800px; width:100%; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
.request-form label > span, .request-form legend { display:block; margin-bottom:.45rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.09em; color:rgba(255,255,255,.75); }
.request-form input, .request-form select, .request-form textarea { width:100%; border:0; border-bottom:1px solid rgba(255,255,255,.45); border-radius:0; background:transparent; color:#fff; padding:.7rem .1rem; outline:none; }
.request-form select option { color:#111; }
.request-form input:focus, .request-form select:focus, .request-form textarea:focus { border-color:var(--rose); }
.request-form fieldset { border:0; padding:1.8rem 0 1rem; margin:0; }
.checks { display:flex; flex-wrap:wrap; gap:.6rem; }
.checks label { cursor:pointer; }
.checks input { position:absolute; opacity:0; pointer-events:none; }
.checks span { display:block !important; border:1px solid rgba(255,255,255,.35); padding:.65rem .85rem; margin:0 !important; color:#fff !important; }
.checks input:checked + span { background:var(--rose); border-color:var(--rose); color:var(--aubergine) !important; }
.message-field { display:block; margin-top:1rem; }
.privacy { display:flex !important; align-items:flex-start; gap:.7rem; margin:1.4rem 0; }
.privacy input { width:auto; margin-top:.2rem; }
.privacy span { text-transform:none !important; letter-spacing:0 !important; }
.form-note { margin:.9rem 0 0; font-size:.78rem; color:rgba(255,255,255,.55); }

.site-footer { background:#000; color:#fff; padding:2.5rem var(--gutter); display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:start; }
.footer-brand { font:800 1.6rem var(--rockwell); letter-spacing:.03em; }
.site-footer p { margin:.35rem 0 0; color:#aaa; font-size:.82rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:1rem 1.5rem; justify-content:flex-end; }
.footer-links a { text-decoration:none; font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; }
.footer-links a:hover { color:var(--rose); }
.copyright { grid-column:1/-1; border-top:1px solid #222; padding-top:1rem; }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 1050px) {
  .main-nav { position:fixed; inset:76px 0 auto 0; display:none; flex-direction:column; align-items:stretch; gap:0; padding:1rem var(--gutter) 1.5rem; background:#000; border-top:1px solid #222; }
  .main-nav.is-open { display:flex; }
  .main-nav a { padding:.8rem 0; }
  .menu-toggle { display:block; }
  .hero { grid-template-columns:1fr 1fr; }
  .services { grid-template-columns:1fr 1fr; }
  .on-tour, .catering-story, .request { grid-template-columns:1fr; }
  .story-images { min-height:620px; }
  .references { grid-template-columns:1fr 1fr; }
}

@media (max-width: 720px) {
  .site-header { min-height:68px; }
  .main-nav { inset:68px 0 auto 0; }
  .brand-main { font-size:1.75rem; }
  .hero { min-height:auto; grid-template-columns:1fr; }
  .hero-copy { padding-top:5rem; padding-bottom:4rem; }
  .hero h1 { font-size:clamp(3.6rem,17vw,6rem); }
  .hero-media { min-height:66svh; background-position:center 35%; }
  .hero-stamp { bottom:1rem; }
  .intro { grid-template-columns:1fr; }
  .services { grid-template-columns:1fr; }
  .service-card { min-height:72svh; }
  .tour-gallery { grid-template-columns:1fr 1fr; grid-template-rows:auto auto; }
  .tour-gallery__large { grid-column:1/3; grid-row:auto; min-height:500px !important; }
  .tour-gallery figure { min-height:230px; }
  .story-images { min-height:510px; }
  .story-image--main { width:86%; height:80%; }
  .story-image--small { width:50%; height:42%; border-width:8px; }
  .facts { grid-template-columns:1fr 1fr; }
  .references { grid-template-columns:1fr; grid-template-areas:"head" "team" "list"; }
  .field-grid { grid-template-columns:1fr; }
  .site-footer { grid-template-columns:1fr; }
  .footer-links { justify-content:flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition:none !important; animation:none !important; }
  .reveal { opacity:1; transform:none; }
}

/* ---------- V0.2 additions ---------- */
.foodtruck-feature {
  position:relative;
  overflow:hidden;
  background:var(--aubergine);
  color:#fff;
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:clamp(3rem,7vw,8rem);
  align-items:center;
}
.foodtruck-feature::before {
  content:"EL BARRIO";
  position:absolute;
  left:-.03em;
  bottom:-.24em;
  font:900 clamp(7rem,18vw,18rem)/1 var(--rockwell);
  letter-spacing:-.06em;
  color:rgba(255,255,255,.035);
  pointer-events:none;
  white-space:nowrap;
}
.foodtruck-copy,
.foodtruck-grid { position:relative; z-index:2; }
.foodtruck-copy h2 {
  margin:0 0 2rem;
  font-size:clamp(3rem,6vw,6.5rem);
  line-height:.87;
  letter-spacing:-.045em;
  text-transform:uppercase;
}
.foodtruck-copy h2 em { color:var(--rose); font-style:normal; }
.foodtruck-copy p:not(.eyebrow) { color:rgba(255,255,255,.82); max-width:40rem; }
.foodtruck-copy .large-copy { color:#fff; }
.foodtruck-copy .text-link { display:inline-block; margin-top:1.15rem; }
.foodtruck-grid {
  display:grid;
  grid-template-columns:1.12fr .88fr;
  grid-template-rows:1fr 1fr;
  gap:1rem;
}
.foodtruck-grid figure { margin:0; overflow:hidden; min-height:260px; }
.foodtruck-grid__truck { grid-row:1/3; min-height:650px !important; }
.foodtruck-grid img { height:100%; object-fit:cover; }

.own-events {
  max-width:var(--max);
  margin:0 auto;
}
.own-events__head {
  display:grid;
  grid-template-columns:1.08fr .92fr;
  column-gap:clamp(3rem,8vw,9rem);
  align-items:end;
  margin-bottom:clamp(2.5rem,5vw,5rem);
}
.own-events__head .eyebrow { grid-column:1/-1; }
.own-events__head h2 {
  margin:0;
  font-size:clamp(3rem,5.5vw,6.4rem);
  line-height:.86;
  letter-spacing:-.045em;
  color:var(--green);
  text-transform:uppercase;
}
.own-events__head h2 em { color:var(--red); font-style:normal; }
.own-events__head > p:not(.eyebrow) { max-width:39rem; }
.own-events__head > p:last-child { align-self:start; margin-top:.5rem; }
.own-events__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}
.event-tile {
  min-height:520px;
  position:relative;
  overflow:hidden;
  color:#fff;
  display:flex;
  align-items:flex-end;
  isolation:isolate;
}
.event-tile img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-2;
  transition:transform .55s ease;
}
.event-tile:hover img { transform:scale(1.025); }
.event-tile__shade {
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.82));
}
.event-tile__copy { padding:2rem; position:relative; z-index:2; }
.event-tile__copy span {
  display:block;
  margin-bottom:.6rem;
  font-size:.7rem;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:rgba(255,255,255,.72);
  font-weight:700;
}
.event-tile h3 {
  margin:0;
  max-width:12ch;
  font-size:clamp(2rem,4vw,4.4rem);
  line-height:.9;
  text-transform:uppercase;
}
.event-tile--placeholder { overflow:hidden; }
.event-tile--rose { background:var(--red); }
.event-tile--green { background:var(--green); }
.event-tile--purple { background:var(--purple); }
.event-tile--placeholder::after {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg,transparent 0 45%,rgba(255,255,255,.08) 45% 48%,transparent 48% 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 44px);
}
.event-tile__placeholder-mark {
  position:absolute;
  right:-.04em;
  top:.12em;
  font:900 clamp(4.2rem,9vw,9rem)/.76 var(--rockwell);
  text-align:right;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.35);
  letter-spacing:-.04em;
  z-index:1;
}

.event-moment {
  position:relative;
  min-height:680px;
  display:flex;
  align-items:flex-end;
  color:#fff;
  overflow:hidden;
}
.event-moment__image,
.event-moment__overlay { position:absolute; inset:0; width:100%; height:100%; }
.event-moment__image { object-fit:cover; object-position:center 54%; }
.event-moment__overlay { background:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.12) 70%),linear-gradient(0deg,rgba(0,0,0,.68),transparent 60%); }
.event-moment__content { position:relative; z-index:2; padding:clamp(4rem,7vw,7rem) var(--gutter); max-width:980px; }
.event-moment__quote {
  margin:0;
  font:700 clamp(2.2rem,4.5vw,5rem)/.98 var(--rockwell);
  letter-spacing:-.035em;
}

.contact-person {
  margin-top:clamp(2rem,4vw,4rem);
  max-width:460px;
  padding:1.5rem;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.055);
}
.contact-person__label {
  margin:0 0 .75rem !important;
  font-size:.68rem !important;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:800;
  color:var(--rose) !important;
}
.contact-person h3 {
  margin:0;
  font-size:clamp(1.8rem,3vw,2.8rem);
  line-height:1;
  color:#fff;
}
.contact-person > p:not(.contact-person__label):not(.contact-person__stadthalle) {
  margin:.45rem 0 1.25rem !important;
  color:rgba(255,255,255,.72) !important;
  font-size:.9rem !important;
}
.contact-person__links { display:grid; gap:.45rem; }
.contact-person__links a,
.contact-person__stadthalle a {
  color:#fff;
  text-decoration:none;
  width:max-content;
  max-width:100%;
  border-bottom:1px solid rgba(255,255,255,.35);
}
.contact-person__links a:hover,
.contact-person__stadthalle a:hover { color:var(--rose); border-color:var(--rose); }
.contact-person__stadthalle {
  margin:1.25rem 0 0 !important;
  padding-top:1.15rem;
  border-top:1px solid rgba(255,255,255,.16);
  font-size:.82rem !important;
  line-height:1.6;
  color:rgba(255,255,255,.62) !important;
}
.site-footer > div:first-child a { text-decoration:none; }
.site-footer > div:first-child a:hover { color:var(--rose); }

@media (max-width: 1050px) {
  .foodtruck-feature { grid-template-columns:1fr; }
  .own-events__head { grid-template-columns:1fr; }
  .own-events__head h2 { margin-bottom:1.8rem; }
  .own-events__head > p:last-child { margin-top:0; }
}

@media (max-width: 720px) {
  .foodtruck-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto auto; }
  .foodtruck-grid__truck { grid-column:1/3; grid-row:auto; min-height:500px !important; }
  .foodtruck-grid figure { min-height:220px; }
  .own-events__grid { grid-template-columns:1fr; }
  .event-tile { min-height:68svh; }
  .event-moment { min-height:66svh; }
  .contact-person { margin-top:2.25rem; }
}


/* ---------- V0.3 refinements ---------- */
.stadthalle-note {
  margin:1.65rem 0 1.9rem;
  padding:1rem 1.1rem;
  border-left:4px solid var(--rose);
  background:rgba(61,76,55,.07);
  color:#333;
}
.stadthalle-note strong { color:var(--green); }
.contact-person__head {
  display:grid;
  grid-template-columns:84px 1fr;
  gap:1rem;
  align-items:center;
  margin-bottom:1.15rem;
}
.contact-person__photo {
  width:84px;
  height:84px;
  border-radius:50%;
  object-fit:cover;
  background:#fff;
}
.contact-person__head .contact-person__label { margin-bottom:.5rem !important; }
.contact-person__head h3 { font-size:clamp(1.6rem,2.5vw,2.3rem); }
.contact-person__role {
  margin:.35rem 0 0 !important;
  color:rgba(255,255,255,.72) !important;
  font-size:.86rem !important;
}
.privacy a { color:#fff; text-underline-offset:2px; }
.privacy a:hover { color:var(--rose); }
@media (max-width:420px) {
  .contact-person__head { grid-template-columns:70px 1fr; }
  .contact-person__photo { width:70px; height:70px; }
}

/* ---------- V0.5 Fischertags gallery ---------- */
.event-gallery {
  background:#f6f1ea;
}
.event-gallery__head {
  display:grid;
  gap:1rem;
  max-width:780px;
  margin-bottom:2rem;
}
.event-gallery__head h2 {
  margin:0;
}
.event-gallery__head p:last-child {
  margin:0;
  color:#444;
}
.event-gallery__grid {
  display:grid;
  grid-template-columns:1.25fr .75fr .75fr 1.25fr;
  gap:1rem;
  align-items:stretch;
}
.event-gallery__item {
  margin:0;
  min-height:320px;
  overflow:hidden;
  border-radius:20px;
  background:#ddd;
  box-shadow:0 18px 45px rgba(0,0,0,.08);
}
.event-gallery__item--wide {
  min-height:360px;
}
.event-gallery__item img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

@media (max-width: 980px) {
  .event-gallery__grid {
    grid-template-columns:1fr 1fr;
  }
  .event-gallery__item,
  .event-gallery__item--wide {
    min-height:280px;
  }
}

@media (max-width: 720px) {
  .event-gallery__grid {
    grid-template-columns:1fr;
  }
  .event-gallery__item,
  .event-gallery__item--wide {
    min-height:240px;
  }
}


/* ---------- V0.6 Hero refinement ---------- */
.brand-text {
  display:block;
  font:800 clamp(1.35rem, 2.1vw, 1.8rem)/1 var(--rockwell);
  letter-spacing:.035em;
  color:#fff;
  white-space:nowrap;
}
.hero-copy .eyebrow {
  margin-bottom:1.35rem;
}
.hero-lead {
  max-width:36rem;
}
@media (max-width: 720px) {
  .brand-text { font-size:1.35rem; }
}


/* ---------- V0.10 Foodtruck concepts ---------- */
.foodtruck-options {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem;
  margin:1.5rem 0 .35rem;
  max-width:44rem;
}
.foodtruck-option {
  padding:1rem 1.05rem;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.055);
}
.foodtruck-option strong {
  display:block;
  margin-bottom:.35rem;
  font:700 .78rem/1 var(--sans);
  letter-spacing:.12em;
  color:var(--rose);
}
.foodtruck-option span {
  display:block;
  color:rgba(255,255,255,.88);
  font-size:.92rem;
  line-height:1.45;
}
.foodtruck-actions {
  display:flex;
  flex-wrap:wrap;
  gap:1rem 1.6rem;
  align-items:center;
  margin-top:.55rem;
}
.foodtruck-copy .foodtruck-actions .text-link { margin-top:1rem; }
.foodtruck-secondary { opacity:.78; }
.foodtruck-secondary:hover { opacity:1; }
@media (max-width:720px) {
  .foodtruck-options { grid-template-columns:1fr; }
}


/* ---------- V0.11 Großveranstaltungen ---------- */
.big-events__lead {
  max-width:50rem;
  margin:1.65rem 0 0;
  font-size:clamp(1rem,1.6vw,1.2rem);
  line-height:1.65;
  color:rgba(255,255,255,.88);
}


/* ---------- V0.14 KATZ on Tour ---------- */
.tour-gallery {
  grid-template-columns:1fr 1fr;
  grid-template-rows:minmax(300px, .95fr) minmax(280px, .8fr);
}
.tour-gallery__large {
  grid-column:1 / 3;
  grid-row:1;
  min-height:0 !important;
}
.tour-gallery > figure:not(.tour-gallery__large) {
  min-height:0;
}
.tour-gallery__kitchen img {
  object-position:78% center;
}

/* ---------- V0.14 Referenzen ---------- */
.reference-list {
  display:grid;
  gap:2.2rem;
  border-top:0;
}
.reference-group {
  border-top:1px solid #ccc;
}
.reference-group__title {
  margin:0;
  padding:1rem 0 .45rem;
  font:700 .72rem/1.2 var(--sans);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#777;
}
.reference-group span {
  display:block;
  font:700 clamp(1.15rem,1.8vw,1.8rem)/1.15 var(--rockwell);
  padding:.9rem 0;
  border-bottom:1px solid #ccc;
  color:var(--green);
}

@media (max-width: 720px) {
  .tour-gallery {
    grid-template-columns:1fr;
    grid-template-rows:auto;
  }
  .tour-gallery__large {
    grid-column:1;
    min-height:310px !important;
  }
  .tour-gallery > figure:not(.tour-gallery__large) {
    min-height:250px;
  }
}


/* ---------- V0.15 Kontakt ---------- */
.contact-person__hours {
  margin:.15rem 0 .45rem !important;
  color:rgba(255,255,255,.58) !important;
  font-size:.76rem !important;
  line-height:1.4;
}


/* ---------- V0.16 Footer ---------- */
.site-footer {
  display:grid;
  grid-template-columns:minmax(260px,1.4fr) minmax(180px,.8fr) minmax(150px,.6fr);
  gap:2.5rem;
  align-items:start;
}
.site-footer__brand p {
  line-height:1.65;
}
.footer-links {
  display:flex;
  flex-direction:column;
  gap:.55rem;
}
.footer-links__title {
  margin-bottom:.25rem;
  font:700 .7rem/1.2 var(--sans);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.45);
}
.footer-links a {
  width:max-content;
  max-width:100%;
}
.copyright {
  grid-column:1 / -1;
  margin-top:.5rem;
  padding-top:1.15rem;
  border-top:1px solid rgba(255,255,255,.12);
}

@media (max-width: 820px) {
  .site-footer {
    grid-template-columns:1fr 1fr;
  }
  .site-footer__brand {
    grid-column:1 / -1;
  }
}

@media (max-width: 560px) {
  .site-footer {
    grid-template-columns:1fr;
    gap:1.8rem;
  }
  .site-footer__brand,
  .copyright {
    grid-column:1;
  }
}


/* ---------- V0.19 finaler Feinschliff ---------- */

/* Zur Hauptseite bewusst dezenter als die Catering-Navigation */
.back-katz {
  color:rgba(255,255,255,.48);
  font-size:.72rem;
}
.back-katz:hover {
  color:var(--rose);
}

/* KATZ on Tour: untere Bilder flacher, damit das komplette Küchen-Team sichtbar bleibt */
.tour-gallery {
  grid-template-rows:minmax(300px,.95fr) auto;
}
.tour-gallery > figure:not(.tour-gallery__large) {
  aspect-ratio:2 / 1;
}
.tour-gallery__kitchen img {
  object-position:center center;
}

/* KATZ GLANZ */
.event-tile__copy--glanz h3 {
  margin-bottom:1rem;
}
.event-tile__subtitle {
  margin:0 0 .5rem;
  max-width:22rem;
  font-size:.9rem;
  line-height:1.35;
  color:rgba(255,255,255,.92);
}
.event-tile__copy .event-tile__tags {
  margin:0;
  color:rgba(255,255,255,.7);
}

/* Mobile: Tour-Bilder wieder großzügiger */
@media (max-width: 720px) {
  .tour-gallery > figure:not(.tour-gallery__large) {
    aspect-ratio:auto;
    min-height:250px;
  }
}


/* ---------- V0.20 technischer Feinschliff ---------- */

/* Verhindert horizontales Seitenscrollen durch dekorative/transparente Elemente. */
html,
body {
  max-width:100%;
  overflow-x:clip;
}

/* Sticky Header bei Sprungmarken berücksichtigen. */
[id] {
  scroll-margin-top:92px;
}

/* Die unsichtbaren Auswahlfelder dürfen keine Seitenbreite erzeugen. */
.checks input {
  position:absolute;
  width:1px !important;
  height:1px !important;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
  opacity:0;
}

/* Sichtbare Tastatur-Fokuszustände. */
.main-nav a:focus-visible,
.button:focus-visible,
.text-link:focus-visible,
.footer-links a:focus-visible,
.contact-person a:focus-visible,
.privacy a:focus-visible,
.menu-toggle:focus-visible {
  outline:2px solid var(--rose);
  outline-offset:3px;
}
.request-form input:focus-visible,
.request-form select:focus-visible,
.request-form textarea:focus-visible {
  outline:2px solid var(--rose);
  outline-offset:3px;
}
.checks input:focus-visible + span {
  outline:2px solid var(--rose);
  outline-offset:2px;
}

/* Der lange Eventtitel braucht auf Tablet/Mobil etwas mehr horizontale Luft. */
.event-tile--fisch h3 {
  max-width:14ch;
}

/* Kleiner Footertext erfüllt damit auch bei kleiner Schrift den Kontrast sicher. */
.footer-links__title {
  color:rgba(255,255,255,.58);
}


/* ---------- V0.21 echter Formularversand ---------- */
.hp-field {
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

.form-note--success {
  color:#d9ffd6 !important;
}

.form-note--error {
  color:#ffd4d4 !important;
}


/* ---------- V0.23 iPhone / Mobile responsive fix ---------- */
@media (max-width: 720px) {
  /* Safari/Grid: lange Headlines dürfen die Spalte nicht breiter machen. */
  .intro,
  .intro > *,
  .story-copy,
  .foodtruck-copy,
  .on-tour,
  .tour-copy,
  .own-events,
  .own-events__head,
  .own-events__head > *,
  .references,
  .request,
  .request > * {
    min-width:0;
    max-width:100%;
  }

  /* Große Editorial-Headlines auf 390–430px kontrolliert skalieren. */
  .intro h2 {
    font-size:clamp(2.65rem,11.4vw,3.15rem);
    line-height:.91;
    letter-spacing:-.035em;
    overflow-wrap:normal;
    word-break:normal;
  }

  .story-copy h2 {
    font-size:clamp(2.75rem,12vw,3.35rem);
    line-height:.92;
    letter-spacing:-.035em;
  }

  .foodtruck-copy h2 {
    font-size:clamp(2.75rem,12vw,3.4rem);
    line-height:.9;
    letter-spacing:-.035em;
  }

  .tour-copy h2 {
    font-size:clamp(2.55rem,11.2vw,3.1rem);
    line-height:.9;
    letter-spacing:-.03em;
    overflow-wrap:normal;
    word-break:normal;
  }

  .own-events__head h2 {
    font-size:clamp(2.45rem,10.8vw,3rem);
    line-height:.91;
    letter-spacing:-.03em;
  }

  .big-events h2,
  .request-copy h2 {
    font-size:clamp(3rem,13vw,3.7rem);
  }

  /* Fließtexte dürfen niemals durch intrinsische Breiten abgeschnitten werden. */
  .intro-copy,
  .intro-copy p,
  .story-copy,
  .story-copy p,
  .foodtruck-copy,
  .foodtruck-copy p,
  .tour-copy,
  .tour-copy p,
  .own-events__head p,
  .big-events__lead,
  .references-head p,
  .request-copy p {
    width:100%;
    max-width:100%;
    overflow-wrap:break-word;
  }

  /* Etwas kompaktere Innenabstände auf iPhones. */
  .section-pad {
    padding-left:1.35rem;
    padding-right:1.35rem;
  }

  /* Catering-Fotocollage mobil kompakter und ohne große Leerfläche. */
  .story-images {
    min-height:0;
    display:grid;
    grid-template-columns:1fr;
    gap:0;
    padding-bottom:1rem;
  }

  .story-image {
    position:relative;
    inset:auto;
  }

  .story-image--main {
    width:100%;
    height:auto;
    aspect-ratio:4 / 3;
    object-fit:cover;
  }

  .story-image--small {
    width:68%;
    height:auto;
    aspect-ratio:4 / 3;
    justify-self:end;
    margin-top:-2.2rem;
    border:6px solid var(--paper);
    object-fit:cover;
  }

  /* Foodtruck-Optionen und Links sicher innerhalb des Screens. */
  .foodtruck-option,
  .foodtruck-actions,
  .foodtruck-actions a {
    max-width:100%;
  }

  .foodtruck-actions {
    align-items:flex-start;
  }

  /* KATZ on Tour: Bildblock ohne ungewollte Mindestbreite. */
  .tour-gallery {
    width:100%;
    min-width:0;
  }

  .tour-gallery figure {
    width:100%;
    min-width:0;
  }

  /* Event-Kacheln: große Titel sicher umbrechen. */
  .event-tile h3 {
    max-width:100%;
    overflow-wrap:break-word;
  }
}

/* iPhone 16 / kleinere Geräte */
@media (max-width: 430px) {
  :root {
    --gutter:1.25rem;
  }

  .site-header {
    padding-left:1.25rem;
    padding-right:1.25rem;
  }

  .brand-text {
    font-size:clamp(1.22rem,5.6vw,1.48rem);
    letter-spacing:.025em;
  }

  .menu-toggle {
    margin-right:-.35rem;
  }

  .intro .eyebrow,
  .story-copy .eyebrow,
  .tour-copy .eyebrow,
  .own-events__head .eyebrow {
    letter-spacing:.13em;
  }

  .large-copy {
    font-size:1.13rem;
  }

  .tour-copy p:last-child {
    font-size:1rem;
  }
}