:root {
  --koz-ink: #14100d;
  --koz-surface: #1b1714;
  --koz-surface-raised: #221d19;
  --koz-paper: #f4eee4;
  --koz-orange: #e45d2f;
  --koz-olive: #96966a;
  --koz-line: rgba(244, 238, 228, 0.12);
  --koz-radius: 6px;
  --koz-shadow: 0 24px 70px rgba(0, 0, 0, 0.26);
  --koz-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html { scroll-behavior: smooth; overflow-x: hidden; }
body {
  overflow-x: hidden;
  background: var(--koz-ink) !important;
  color: var(--koz-paper) !important;
  font-family: "Instrument Sans", sans-serif !important;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
}

::selection { background: var(--koz-orange); color: var(--koz-ink); }
a, button, input, textarea { border-radius: var(--koz-radius); }
a { transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .25s var(--koz-ease), box-shadow .25s ease !important; }
a[href]:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--koz-orange);
  outline-offset: 4px;
}

/* Keep the prototype structure, but give every interactive surface one finish. */
a[style*="padding:15px 30px"], a[style*="padding:14px 29px"], a[style*="padding:14px 24px"], a[style*="padding:12px 22px"], a[style*="padding:11px 21px"] {
  display: inline-flex !important;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  border-radius: var(--koz-radius) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.13);
}
a[style*="background:#d95425"] { background: var(--koz-orange) !important; }
a[style*="background:#d95425"]:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(228,93,47,.22); }

nav, header { backdrop-filter: blur(14px); }
[style*="border:1px solid rgba(242,236,224,.09)"] {
  border-color: var(--koz-line) !important;
  border-radius: var(--koz-radius) !important;
  box-shadow: 0 18px 55px rgba(0,0,0,.12);
}

/* Real imagery replaces CloudDesign image slots. */
x-import[id], image-slot[id] { display: block; width: 100%; height: 100%; background-color: #211a16; background-size: cover; background-position: center; overflow: hidden; color: transparent !important; font-size: 0 !important; }
x-import[id] > *, image-slot[id] > * { opacity: 0 !important; }
:is(x-import,image-slot)#home-hero { background-image: linear-gradient(90deg, rgba(10,8,7,.74) 0%, rgba(10,8,7,.18) 52%, rgba(10,8,7,.02) 100%), url("assets/koz-hero.png"); background-position: center; }
:is(x-import,image-slot)#home-best-1, :is(x-import,image-slot)#menu-fav-1 { background-image: url("assets/durum-adana.png"); background-position: center; }
:is(x-import,image-slot)#home-best-2, :is(x-import,image-slot)#menu-fav-2 { background-image: url("assets/koz-hero.png"); background-position: 66% 48%; }
:is(x-import,image-slot)#home-best-3, :is(x-import,image-slot)#menu-fav-3 { background-image: url("assets/kapsalon.png"); background-position: center; }
:is(x-import,image-slot)#home-best-4, :is(x-import,image-slot)#menu-fav-4 { background-image: url("assets/loaded-fries.png"); background-position: center; }
:is(x-import,image-slot)#home-ed-1 { background-image: url("assets/durum-adana.png"); background-position: 58% center; }
:is(x-import,image-slot)#home-ed-2 { background-image: linear-gradient(rgba(20,16,13,.12), rgba(20,16,13,.35)), url("assets/koz-hero.png"); background-position: 72% center; }
:is(x-import,image-slot)#home-map { background: radial-gradient(circle at 58% 44%, rgba(228,93,47,.35) 0 4px, transparent 5px), linear-gradient(135deg,#25211d,#181512); position: relative; }
:is(x-import,image-slot)#home-map::after { content: "BREDABAAN 214 · MERKSEM"; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:max-content; max-width:80%; color:var(--koz-paper); font:700 14px "Instrument Sans",sans-serif; letter-spacing:.08em; }
:is(x-import,image-slot)#over-hero { background-image: linear-gradient(90deg, rgba(20,16,13,.12), transparent 55%), url("assets/about-grill.png"); background-position: center; }
:is(x-import,image-slot)#over-keuken { background-image: url("assets/about-prep.png"); background-position: center; }
:is(x-import,image-slot)#over-gast { background-image: linear-gradient(180deg, transparent 65%, rgba(20,16,13,.18)), url("assets/about-guests.png"); background-position: center; }
:is(x-import,image-slot)#catering-hero { background-image: linear-gradient(90deg, rgba(20,16,13,.14), transparent 58%), url("assets/catering-host.png"); background-position: center; }
:is(x-import,image-slot)#catering-setup { background-image: url("assets/catering-setup.png"); background-position: center; }
:is(x-import,image-slot)#catering-team { background-image: url("assets/catering-team.png"); background-position: center; }

.over-page-hero { max-width: 1320px !important; padding-top: clamp(72px, 9vw, 124px) !important; }
.over-page-hero > div { max-width: 940px !important; }
.over-wide-visual { max-width: 1360px !important; padding-inline: clamp(20px, 2.8vw, 38px) !important; }
.over-wide-visual > div { min-height: clamp(320px, 48vw, 610px) !important; aspect-ratio: 21 / 9; border-radius: var(--koz-radius); overflow: hidden; }
.over-story { max-width: 1320px !important; gap: clamp(92px, 12vw, 160px) !important; padding-block: clamp(96px, 11vw, 148px) !important; }
.over-story > div { grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr) !important; gap: clamp(48px, 7vw, 104px) !important; }
.over-story > div:nth-child(2) { grid-template-columns: minmax(360px, 1.1fr) minmax(0, .9fr) !important; }
.over-story image-slot { border-radius: var(--koz-radius); }
.over-story > div:first-child > div:last-child { transform: translateY(30px); }
.over-story > div:nth-child(2) > div:first-child { transform: translateY(-30px); }
.over-values { max-width: none !important; padding-inline: 0 !important; }
.over-values > div { padding-inline: max(5vw, calc((100vw - 1160px) / 2)) !important; }

.catering-page-hero { max-width: 1320px !important; padding-top: clamp(72px, 9vw, 124px) !important; }
.catering-page-hero > div { max-width: 920px !important; }
.catering-wide-visual { max-width: 1360px !important; padding-inline: clamp(20px, 2.8vw, 38px) !important; }
.catering-wide-visual > div { min-height: clamp(320px, 47vw, 600px) !important; border-radius: var(--koz-radius); overflow: hidden; }
.catering-packages { max-width: 1320px !important; padding-top: clamp(90px, 10vw, 136px) !important; }
.catering-packages > div:last-child { gap: clamp(28px, 3vw, 46px) !important; }
.catering-packages > div:last-child > div { background: transparent !important; border: 0 !important; border-top: 1px solid var(--koz-line) !important; padding-inline: 0 !important; }
.catering-people { max-width: 1320px; margin: 0 auto; padding: clamp(100px, 12vw, 164px) clamp(20px, 4vw, 40px); }
.catering-people-copy { display: grid; grid-template-columns: .7fr 1.35fr 1fr; gap: clamp(28px, 5vw, 76px); align-items: start; margin-bottom: clamp(44px, 6vw, 76px); }
.catering-people-copy > span { color: var(--koz-orange); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.catering-people-copy h2 { margin: 0; font: 700 clamp(38px, 5vw, 62px)/.98 "Big Shoulders Display", sans-serif; text-transform: uppercase; }
.catering-people-copy p { margin: 0; color: rgba(244,238,228,.72); font-size: 16px; line-height: 1.7; }
.catering-people-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(24px, 3.5vw, 54px); align-items: end; }
.catering-photo { position: relative; overflow: hidden; border-radius: var(--koz-radius); }
.catering-photo-setup { aspect-ratio: 4 / 3; }
.catering-photo-team { aspect-ratio: 4 / 3; transform: translateY(68px); }
.catering-process { max-width: none !important; padding-inline: 0 !important; }
.catering-process > div { padding-inline: max(5vw, calc((100vw - 1160px) / 2)) !important; }

.contact-page-hero { max-width: 1320px !important; padding-top: clamp(72px, 9vw, 124px) !important; }
.contact-intro { margin: 0; max-width: 58ch; color: rgba(244,238,228,.72); font-size: clamp(16px,2vw,19px); line-height: 1.65; }
.contact-quick-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: clamp(24px,4vw,44px); background: var(--koz-line); border: 1px solid var(--koz-line); }
.contact-quick-actions a { display: flex; flex-direction: column; gap: 8px; padding: clamp(20px,3vw,30px); background: var(--koz-ink); border-radius: 0; }
.contact-quick-actions a:hover { background: var(--koz-surface); transform: translateY(-2px); }
.contact-quick-actions span { color: var(--koz-orange); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.contact-quick-actions strong { font-size: clamp(15px,1.8vw,19px); overflow-wrap: anywhere; }
.contact-location { max-width: 1320px !important; }
:is(x-import,image-slot)#contact-map { position: relative; background-color: #e9dfcf; background-image: linear-gradient(28deg, transparent 44%, rgba(20,16,13,.11) 45%, rgba(20,16,13,.11) 48%, transparent 49%), linear-gradient(96deg, transparent 52%, rgba(228,93,47,.38) 53%, rgba(228,93,47,.38) 55%, transparent 56%), linear-gradient(150deg, transparent 46%, rgba(20,16,13,.08) 47%, rgba(20,16,13,.08) 50%, transparent 51%); }
:is(x-import,image-slot)#contact-map::after { content: "KÖZ · BREDABAAN 214"; position:absolute; left:52%; top:48%; transform:translate(-50%,-50%); padding:12px 16px; background:var(--koz-orange); color:var(--koz-ink); border-radius:var(--koz-radius); box-shadow:0 16px 40px rgba(20,16,13,.25); font:700 12px "Instrument Sans",sans-serif; letter-spacing:.06em; white-space:nowrap; }
.contact-access { display:flex; flex-wrap:wrap; gap:8px; }
.contact-access span { padding:7px 10px; border:1px solid var(--koz-line); color:rgba(244,238,228,.68); font-size:11px; font-weight:600; }
.contact-form-section { max-width: 1320px !important; padding-block: clamp(100px,11vw,150px) !important; }
.contact-form-section form { padding: clamp(24px,4vw,44px); background:var(--koz-surface); border-top:2px solid var(--koz-orange); }
.contact-form-section input, .contact-form-section select, .contact-form-section textarea { border-radius:var(--koz-radius); transition:border-color .2s ease,background .2s ease; }
.contact-form-section input:hover, .contact-form-section select:hover, .contact-form-section textarea:hover { border-color:rgba(244,238,228,.35) !important; }
.contact-consent { display:flex; gap:10px; align-items:flex-start; color:rgba(244,238,228,.62); font-size:12px; line-height:1.5; }
.contact-consent input { margin-top:3px; accent-color:var(--koz-orange); }
.contact-form-note { margin:0; color:rgba(244,238,228,.42); font-size:11.5px; line-height:1.5; }
.contact-service-strip { max-width:1320px; margin:0 auto; padding:0 clamp(20px,4vw,40px) clamp(90px,10vw,132px); display:grid; grid-template-columns:repeat(3,1fr); gap:1px; }
.contact-service-strip > div { display:flex; flex-direction:column; gap:7px; padding:24px 0; border-top:1px solid var(--koz-line); }
.contact-service-strip strong { font:700 26px "Big Shoulders Display",sans-serif; text-transform:uppercase; }
.contact-service-strip span { color:rgba(244,238,228,.58); font-size:13px; }

/* Calm, premium motion that respects reduced-motion preferences. */
.koz-reveal { opacity: 0; transform: translateY(24px); transition: opacity .75s var(--koz-ease), transform .75s var(--koz-ease); }
.koz-reveal.is-visible { opacity: 1; transform: none; }
.koz-header-brand { display:flex; align-items:center; gap:14px; min-width:max-content; }
.koz-header-return { display:inline-flex; align-items:center; gap:6px; padding:7px 9px; border:1px solid var(--koz-line); color:rgba(244,238,228,.72); font-size:11px; font-weight:700; text-decoration:none; }
.koz-header-return:hover { border-color:var(--koz-orange); color:var(--koz-orange); transform:translateX(-2px); }
.koz-lang-switch { display:inline-flex; align-items:center; gap:2px; padding:3px; border:1px solid var(--koz-line); }
.koz-lang-switch a { min-width:30px; padding:6px 7px; color:rgba(244,238,228,.62); font-size:11px; font-weight:800; text-align:center; text-decoration:none; }
.koz-lang-switch a[aria-current="page"] { background:var(--koz-paper); color:var(--koz-ink); }
[style*="overflow-x:auto"], [style*="overflow-x: auto"] { scrollbar-width: none; }
[style*="overflow-x:auto"]::-webkit-scrollbar, [style*="overflow-x: auto"]::-webkit-scrollbar { display: none; }

/* Seamless ticker: six equal sets move by exactly one set. */
.koz-marquee {
  mask-image: linear-gradient(90deg, transparent, #000 2.5%, #000 97.5%, transparent);
}

.koz-marquee-track {
  display: flex;
  width: max-content;
  animation: koz-premium-marquee 18s linear infinite;
  will-change: transform;
}

.koz-marquee-track > span {
  display: block;
  flex: none;
  padding-right: 2.25rem;
}

.koz-marquee:hover .koz-marquee-track { animation-play-state: paused; }

@keyframes koz-premium-marquee {
  to { transform: translate3d(-16.666666%, 0, 0); }
}

/* Editorial spacing: imagery leads, borders become quiet separators. */
section[data-screen-label="Bestsellers"] { max-width: 1320px !important; padding-top: clamp(88px, 11vw, 144px) !important; }
section[data-screen-label="Bestsellers"] > div:last-child { gap: clamp(28px, 3vw, 46px) !important; }
section[data-screen-label="Bestsellers"] > div:last-child > a {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
section[data-screen-label="Bestsellers"] > div:last-child > a > div:first-child {
  border-radius: var(--koz-radius);
  overflow: hidden;
}
section[data-screen-label="Bestsellers"] > div:last-child > a > div:last-child {
  padding: 20px 0 0 !important;
}
section[data-screen-label="Kwaliteit"] { max-width: none !important; padding-inline: 0 !important; }
section[data-screen-label="Kwaliteit"] > div { padding-inline: max(5vw, calc((100vw - 1160px) / 2)) !important; }
section[data-screen-label="Bestelopties"] > div:last-child > div {
  border: 0 !important;
  border-top: 1px solid var(--koz-line) !important;
  padding: 28px 0 !important;
  border-radius: 0 !important;
}

@media (max-width: 900px) {
  .koz-header-brand { gap:10px; }
  .koz-header-return { width:34px; height:34px; justify-content:center; padding:0; font-size:0; }
  .koz-header-return span:first-child { font-size:16px; }
  .koz-lang-switch { position:absolute; right:clamp(20px,4vw,40px); bottom:-42px; background:rgba(16,14,12,.93); backdrop-filter:blur(12px); }
  h1 { font-size: clamp(58px, 17vw, 96px) !important; line-height: .86 !important; }
  section { scroll-margin-top: 92px !important; }
  .over-story > div, .over-story > div:nth-child(2) { grid-template-columns: 1fr !important; }
  .over-story > div:first-child > div:last-child, .over-story > div:nth-child(2) > div:first-child { transform: none; }
  .catering-people-copy { grid-template-columns: 1fr; gap: 18px; }
  .catering-people-grid { grid-template-columns: 1fr; }
  .catering-photo-team { transform: none; }
  .contact-quick-actions { grid-template-columns:1fr; }
  .contact-service-strip { grid-template-columns:1fr; }
}

@media (max-width: 640px) {
  body { padding-bottom: 54px !important; }
  section { max-width: 100vw; }
  [style*="padding:clamp(64px,9vw,112px)"] { padding-top: 56px !important; padding-bottom: 64px !important; }
  [style*="padding:clamp(48px,7vw,80px)"] { padding-top: 44px !important; padding-bottom: 44px !important; }
  [style*="grid-template-columns:repeat(4,1fr)"] { grid-template-columns: 1fr 1fr !important; }
  [style*="box-shadow:18px 18px 0"] { box-shadow: 10px 10px 0 var(--koz-orange) !important; }
  [style*="white-space:nowrap"] { max-width: 100%; }
  a[style*="padding:15px 30px"], a[style*="padding:14px 29px"] { width: 100%; }
  :is(x-import,image-slot)#home-hero { background-image: linear-gradient(180deg, rgba(10,8,7,.2), rgba(10,8,7,.78)), url("assets/koz-hero.png"); background-position: 66% center; }
  .over-page-hero { padding-bottom: 34px !important; }
  .over-wide-visual > div { min-height: 300px !important; aspect-ratio: 4 / 5; }
  :is(x-import,image-slot)#over-hero { background-position: 62% center; }
  .over-story { gap: 78px !important; padding-top: 72px !important; }
  .over-story > div:nth-child(2) > div:first-child { order: 2 !important; }
  .over-story > div:nth-child(2) > div:last-child { order: 1 !important; }
  .catering-page-hero { padding-bottom: 34px !important; }
  .catering-wide-visual > div { min-height: 300px !important; aspect-ratio: 4 / 5; }
  :is(x-import,image-slot)#catering-hero { background-position: 56% center; }
  .catering-packages { padding-top: 72px !important; }
  .catering-packages > div:last-child { gap: 32px !important; }
  .catering-people { padding-top: 84px; padding-bottom: 84px; }
  .koz-marquee-track { animation-duration: 18s; }
  section[data-screen-label="Bestsellers"] > div:last-child { gap: 44px !important; }
}

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