/* V20 Traiteur only. Every selector is scoped to .v20-traiteur. */
.v20-traiteur {
  width: 100%;
  min-width: 0;
  overflow: clip;
  background: var(--lt-crema);
  color: var(--lt-tinta);
  font-family: var(--font-body);
}

.v20-traiteur :where(section, article, nav, div, picture) { min-width: 0; }
.v20-traiteur :where(h1, h2, h3, p, ol) { margin-top: 0; }
.v20-traiteur :where(p, li) { overflow-wrap: break-word; }
.v20-traiteur picture,
.v20-traiteur picture img { display: block; width: 100%; }
.v20-traiteur picture img { height: 100%; object-fit: cover; }
.v20-traiteur .v20-display { overflow: visible; }
.v20-traiteur .v20-button { max-width: 100%; }

.v20-traiteur .v20-traiteur-actions {
  display: grid;
  gap: var(--sp-2);
  width: 100%;
}

/* T1: full-photo carta hero with the fixed V20 text plane. */
.v20-traiteur .v20-traiteur-hero {
  position: relative;
  display: grid;
  min-height: min(78svh, 40rem);
  overflow: hidden;
  background: var(--lt-noche);
  color: var(--lt-crema);
}

.v20-traiteur .v20-traiteur-hero__media,
.v20-traiteur .v20-traiteur-hero__media picture,
.v20-traiteur .v20-traiteur-hero__image,
.v20-traiteur .v20-traiteur-hero__scrim {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.v20-traiteur .v20-traiteur-hero__image { object-position: 50% 54%; }
.v20-traiteur .v20-traiteur-hero__scrim {
  background: linear-gradient(180deg, rgba(33, 21, 17, .73) 0%, rgba(33, 21, 17, .61) 18%, rgba(33, 21, 17, .46) 34%, rgba(33, 21, 17, .76) 62%, rgba(33, 21, 17, .94) 100%);
}

.v20-traiteur .v20-traiteur-hero::after {
  position: absolute;
  inset: 12px;
  z-index: 1;
  border: 2px solid rgba(255, 247, 236, .9);
  border-radius: var(--r-card);
  content: "";
  pointer-events: none;
}

.v20-traiteur .v20-traiteur-hero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-block: var(--sp-2) var(--sp-7);
}

.v20-traiteur .v20-traiteur-breadcrumbs {
  max-width: calc(100% - var(--sp-3));
  overflow-x: auto;
  scrollbar-width: none;
}
.v20-traiteur .v20-traiteur-breadcrumbs ol {
  display: flex;
  align-items: center;
  width: max-content;
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
}
.v20-traiteur .v20-traiteur-breadcrumbs li {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--lt-crema-soft);
  font-size: var(--fs-caption);
}
.v20-traiteur .v20-traiteur-breadcrumbs li + li::before { margin-inline: .65rem; color: var(--lt-marigold-bright); content: "·"; }
.v20-traiteur .v20-traiteur-breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; color: var(--lt-crema); }

.v20-traiteur .v20-traiteur-hero__copy { max-width: 48rem; }
.v20-traiteur .v20-traiteur-stamp {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .55rem .75rem;
  border: 2px solid var(--lt-tinta);
  border-radius: var(--r-stamp);
  background: var(--lt-marigold);
  color: var(--lt-tinta);
  box-shadow: var(--shadow-card);
  font-family: var(--font-display);
  font-size: var(--fs-label);
  letter-spacing: .06em;
  text-transform: uppercase;
  transform: rotate(-2deg);
}
.v20-traiteur .v20-traiteur-hero h1 {
  max-width: 13ch;
  margin: var(--sp-4) 0;
  color: var(--lt-crema);
  text-wrap: balance;
}
.v20-traiteur .v20-traiteur-hero__copy > p {
  max-width: 58ch;
  margin-bottom: var(--sp-5);
  color: var(--lt-crema);
  font-size: var(--fs-body-lg);
}

/* T2: sticky, touch-safe index for the seven absorbed pages. */
.v20-traiteur .v20-traiteur-jump {
  position: sticky;
  top: var(--v20-header-h);
  z-index: 80;
  border-bottom: var(--bw-hair);
  background: var(--lt-crema);
}
.v20-traiteur .v20-traiteur-jump__inner { padding-block: var(--sp-2); }
.v20-traiteur .v20-traiteur-jump__inner > span {
  display: block;
  margin-bottom: var(--sp-1);
  color: var(--lt-ink-soft);
  font-size: var(--fs-fine);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.v20-traiteur .v20-traiteur-jump__links {
  display: flex;
  gap: var(--sp-2);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.v20-traiteur .v20-traiteur-jump__links a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 44px;
  padding: .55rem .85rem;
  border: 2px solid var(--lt-tinta);
  border-radius: var(--r-pill);
  color: var(--lt-tinta);
  font-size: var(--fs-label);
  font-weight: 700;
  line-height: 1.1;
  text-decoration: none;
}
.v20-traiteur .v20-traiteur-jump__links a:hover { background: var(--lt-tinta); color: var(--lt-crema); }

.v20-traiteur .v20-traiteur-services { padding-block: var(--section-y); background: var(--lt-crema); }
.v20-traiteur .v20-traiteur-section-head { max-width: calc(var(--wrap-text) + (2 * var(--gutter))); }
.v20-traiteur .v20-traiteur-section-head h2 { margin-bottom: var(--sp-4); color: var(--lt-rouge); }
.v20-traiteur .v20-traiteur-section-head > p { margin-bottom: 0; color: var(--lt-ink-soft); font-size: var(--fs-body-lg); }
.v20-traiteur .v20-traiteur-services__list { display: grid; gap: var(--sp-8); margin-top: var(--sp-8); }
.v20-traiteur .v20-traiteur-service {
  display: grid;
  gap: var(--sp-5);
  align-items: center;
  scroll-margin-top: calc(var(--v20-header-h) + 5.5rem);
}
.v20-traiteur .v20-traiteur-service__media {
  position: relative;
  min-height: 0;
  aspect-ratio: 4 / 3;
  padding: var(--sp-3);
  overflow: hidden;
  border: var(--bw-frame);
  border-radius: var(--r-card);
  background: var(--lt-blanco);
  box-shadow: var(--shadow-card);
}
.v20-traiteur .v20-traiteur-service__media picture,
.v20-traiteur .v20-traiteur-service__image { height: 100%; border-radius: var(--r-media); }
.v20-traiteur .v20-traiteur-service__index,
.v20-traiteur .v20-traiteur-process__steps > li > span {
  display: inline-grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  border: 2px solid var(--lt-tinta);
  border-radius: var(--r-stamp);
  background: var(--lt-marigold);
  color: var(--lt-tinta);
  font-family: var(--font-display);
  font-size: var(--fs-label);
  letter-spacing: .06em;
}
.v20-traiteur .v20-traiteur-service__index { position: absolute; top: var(--sp-5); right: var(--sp-5); box-shadow: var(--shadow-card); transform: rotate(2deg); }
.v20-traiteur .v20-traiteur-service__copy { width: 100%; max-width: 39rem; }
.v20-traiteur .v20-traiteur-service__copy h3 { margin-bottom: var(--sp-4); color: var(--lt-tinta); }
.v20-traiteur .v20-traiteur-service__copy p { max-width: 62ch; color: var(--lt-ink-soft); }
.v20-traiteur .v20-traiteur-service__copy p:last-child { margin-bottom: 0; padding-top: var(--sp-3); border-top: var(--bw-hair); color: var(--lt-tinta); }

/* T4: the page's only noche section, plus the global noche footer. */
.v20-traiteur .v20-traiteur-process { padding-block: var(--section-y); background: var(--lt-noche); color: var(--lt-crema); }
.v20-traiteur .v20-traiteur-process__head { display: grid; gap: var(--sp-6); align-items: end; }
.v20-traiteur .v20-traiteur-process__head h2 { max-width: 17ch; margin-bottom: var(--sp-4); color: var(--lt-crema); }
.v20-traiteur .v20-traiteur-process__head p { max-width: 60ch; margin-bottom: 0; color: var(--lt-crema-soft); font-size: var(--fs-body-lg); }
.v20-traiteur .v20-traiteur-process__steps {
  display: grid;
  gap: var(--sp-4);
  margin: var(--sp-8) 0 var(--sp-7);
  padding: 0;
  list-style: none;
}
.v20-traiteur .v20-traiteur-process__steps li {
  padding: var(--sp-5);
  border: 2px solid rgba(255, 247, 236, .82);
  border-radius: var(--r-card);
}
.v20-traiteur .v20-traiteur-process__steps h3 { margin: var(--sp-4) 0 var(--sp-3); color: var(--lt-crema); }
.v20-traiteur .v20-traiteur-process__steps p { margin-bottom: 0; color: var(--lt-crema-soft); }
.v20-traiteur .v20-traiteur-proof {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
  padding-top: var(--sp-5);
  border-top: 1px solid rgba(255, 247, 236, .2);
}
.v20-traiteur .v20-traiteur-proof span {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .45rem .7rem;
  border: 1px solid rgba(255, 247, 236, .42);
  border-radius: var(--r-stamp);
  color: var(--lt-crema);
  font-weight: 700;
}

/* T5: shared native FAQ grammar. */
.v20-traiteur .v20-traiteur-faq { padding-block: var(--section-y); background: var(--lt-crema-deep); color: var(--lt-tinta); }
.v20-traiteur .v20-traiteur-faq__inner { max-width: calc(var(--wrap-text) + (2 * var(--gutter))); }
.v20-traiteur .v20-traiteur-faq h2 { margin-bottom: var(--sp-6); color: var(--lt-rouge); }
.v20-traiteur .v20-traiteur-faq__items { border-top: var(--bw-hair); }
.v20-traiteur .v20-traiteur-faq details { border-bottom: var(--bw-hair); }
.v20-traiteur .v20-traiteur-faq summary {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: var(--sp-3) 3rem var(--sp-3) 0;
  background: transparent;
  color: var(--lt-tinta);
  cursor: pointer;
  font-weight: 700;
  list-style: none;
}
.v20-traiteur .v20-traiteur-faq summary::-webkit-details-marker { display: none; }
.v20-traiteur .v20-traiteur-faq summary span::before,
.v20-traiteur .v20-traiteur-faq summary span::after {
  position: absolute;
  top: 50%;
  right: var(--sp-2);
  width: 18px;
  height: 2px;
  background: var(--lt-rosa-deep);
  content: "";
}
.v20-traiteur .v20-traiteur-faq summary span::after { transform: rotate(90deg); transition: transform var(--duration-state) var(--ease-out); }
.v20-traiteur .v20-traiteur-faq details[open] summary span::after { transform: rotate(0); }
.v20-traiteur .v20-traiteur-faq details > p { max-width: 70ch; margin: 0; padding: 0 3rem var(--sp-5) 0; color: var(--lt-ink-soft); }

.v20-traiteur .v20-traiteur-cross { padding-block: var(--section-y); background: var(--lt-crema); }
.v20-traiteur .v20-traiteur-cross__grid { display: grid; gap: var(--sp-4); margin-top: var(--sp-7); }
.v20-traiteur .v20-traiteur-cross__grid article {
  display: flex;
  flex-direction: column;
  padding: var(--sp-5);
  border: var(--bw-frame);
  border-radius: var(--r-card);
  background: var(--lt-blanco);
  box-shadow: var(--shadow-card);
}
.v20-traiteur .v20-traiteur-cross__grid h3 { margin-bottom: var(--sp-3); font-size: var(--fs-body-lg); }
.v20-traiteur .v20-traiteur-cross__grid p { margin-bottom: var(--sp-4); color: var(--lt-ink-soft); }
.v20-traiteur .v20-traiteur-cross__grid a { display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; color: var(--lt-rosa-deep); font-weight: 700; }

.v20-traiteur .v20-traiteur-cta { padding-block: var(--section-y); background: var(--lt-rosa); color: var(--lt-tinta); }
.v20-traiteur .v20-traiteur-cta__inner { display: grid; gap: var(--sp-6); align-items: center; }
.v20-traiteur .v20-traiteur-cta h2 { max-width: 18ch; margin-bottom: var(--sp-4); color: var(--lt-tinta); }
.v20-traiteur .v20-traiteur-cta p { max-width: 58ch; margin-bottom: 0; font-size: var(--fs-body-lg); }
.v20-traiteur .v20-traiteur-cta__primary { border-color: var(--lt-tinta); background: var(--lt-tinta); color: var(--lt-crema); }
.v20-traiteur .v20-traiteur-cta__primary:hover { background: var(--lt-noche); color: var(--lt-crema); }
.v20-traiteur .v20-traiteur-cta__secondary { border-color: var(--lt-tinta); color: var(--lt-tinta); }
.v20-traiteur .v20-traiteur-cta__secondary:hover { background: var(--lt-tinta); color: var(--lt-crema); }
.v20-traiteur .v20-traiteur-hero a.v20-button--on-dark { border-color: var(--lt-crema); color: var(--lt-crema) !important; }
.v20-traiteur .v20-traiteur-hero a.v20-button--on-dark:hover { background: var(--lt-crema); color: var(--lt-tinta) !important; }
.v20-traiteur .v20-traiteur-cta a.v20-traiteur-cta__secondary { border-color: var(--lt-tinta); color: var(--lt-tinta) !important; }

@media (min-width: 600px) {
  .v20-traiteur .v20-traiteur-actions { grid-template-columns: repeat(2, max-content); width: auto; }
  .v20-traiteur .v20-traiteur-cross__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  .v20-traiteur .v20-traiteur-hero { min-height: min(82svh, 45rem); }
  .v20-traiteur .v20-traiteur-hero__inner { padding-block: var(--sp-3) var(--sp-8); }
  .v20-traiteur .v20-traiteur-jump__inner { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--sp-4); }
  .v20-traiteur .v20-traiteur-jump__inner > span { margin-bottom: 0; }
  .v20-traiteur .v20-traiteur-process__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .v20-traiteur .v20-traiteur-service { grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr); gap: clamp(2rem, 5vw, 5.5rem); }
  .v20-traiteur .v20-traiteur-service--reverse .v20-traiteur-service__media { order: 2; }
  .v20-traiteur .v20-traiteur-service--reverse .v20-traiteur-service__copy { justify-self: end; }
  .v20-traiteur .v20-traiteur-process__head { grid-template-columns: minmax(0, 1fr) auto; }
  .v20-traiteur .v20-traiteur-cta__inner { grid-template-columns: minmax(0, 1fr) auto; }
}

@media (min-width: 900px) and (max-width: 1100px) {
  .v20-traiteur .v20-traiteur-cta__inner { grid-template-columns: minmax(0, 1fr); }
  .v20-traiteur .v20-traiteur-cta h2 { max-width: 28ch; }
}

@media (min-width: 1024px) {
  .v20-traiteur .v20-traiteur-cross__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 430px) {
  .v20-traiteur .v20-traiteur-actions .v20-button { width: 100%; white-space: normal; text-align: center; }
  .v20-traiteur .v20-traiteur-proof span { flex: 1 1 calc(50% - var(--sp-2)); justify-content: center; text-align: center; }
}
