/* Corporate catering page (owner brief 2026-10-25): drop-off services, set-up buffets, the site-visit step and the
   "How we work" rules. Loads after canapes-page.css and reuses its cb-* cards, linen textures and feathered photos. */

/* Hero motion: drifting oak and chestnut leaves instead of embers, so no fire glow or flicker (owner 2026-10-25) */
body[data-hero-fx="leaves"] .mhero-glow,body[data-hero-fx="leaves"] .mhero-visual::after{display:none!important}
.menu-page .am-leaves{mix-blend-mode:normal}

/* Five drop-off services: three across, then two centred */
.menu-page main .co-grid-5{grid-template-columns:repeat(6,minmax(0,1fr))}
.menu-page main .co-grid-5>.cb-card{grid-column:span 2}
.menu-page main .co-grid-5>.cb-card:nth-child(4){grid-column:2/span 2}
.menu-page main .co-grid-5 .cb-tier{background:var(--gold-dark)}
.menu-page main .co-grid-5 .cb-card{--tier:var(--gold)}

/* Buffet set-up animation from the homepage corporate card (driven by app.js), on a navy linen panel */
.menu-page main .co-scene{max-width:760px;margin:0 auto 40px;padding:28px 34px 24px;border-radius:10px;background-color:var(--navy);background-image:var(--tex-sand),var(--tex-threads-soft),var(--tex-weave-soft),radial-gradient(ellipse 60% 90% at 80% 0%,#22356f66,#0000 70%),linear-gradient(160deg,#16275a,#122150 55%,#0f1c47);box-shadow:0 18px 40px -26px #0c173c99}
.menu-page main .co-scene .buffet-scene{margin:0 0 14px;padding-top:0}
.menu-page main .co-scene p{text-align:center;color:#c9d2e6;font-size:.9375rem;line-height:1.6}
.menu-page main .co-scene strong{color:var(--gold-light);font-weight:600}
@media(max-width:600px){.menu-page main .co-scene{padding:20px 16px 18px;margin-bottom:28px}}

/* Cross-links to the canapé and grazing pages */
.menu-page main .co-also{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:44px}
.menu-page main .co-also-link{position:relative;display:block;overflow:hidden;border-radius:8px;min-height:170px;color:#fff;text-decoration:none;background:var(--navy-deep)}
.menu-page main .co-also-link img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;transition:transform 1s var(--am-ease,ease),opacity .4s ease}
.menu-page main .co-also-link:hover img{transform:scale(1.05);opacity:.5}
.menu-page main .co-also-link span{position:relative;display:block;padding:44px 30px 30px;font-family:var(--serif);font-size:1.6rem;line-height:1.2;background:linear-gradient(90deg,#0c173cd9,#0c173c40 75%,#0000)}
.menu-page main .co-also-link small{display:block;font-family:var(--sans);font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-light);margin-bottom:8px}

/* Signature step: we visit, we photograph, we show you */
.menu-page main .co-visit-inner{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:center;padding-block:72px}
.menu-page main .co-visit-photo{margin:0}
.menu-page main .co-visit-photo img{display:block;width:100%;height:auto;border-radius:14px;-webkit-mask-image:var(--banner-feather);-webkit-mask-composite:source-in;mask-image:var(--banner-feather);mask-composite:intersect}
.menu-page main .co-visit h2{color:#fff;margin-top:12px;font-size:clamp(2rem,3.2vw,2.7rem)}
.menu-page main .co-visit h2 em{color:var(--gold-light)}
.menu-page main .co-visit-inner>div>p:last-child{color:#c9d2e6;margin-top:18px;max-width:540px;line-height:1.75}

/* How we work: nine rules on parchment cards */
.menu-page main .co-rules-list{list-style:none;counter-reset:rule;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.menu-page main .co-rules-list li{counter-increment:rule;position:relative;padding:26px 26px 24px 70px;border:1px solid #e6dccb;border-radius:6px;background-color:#fffdf8;background-image:var(--tex-grain),var(--tex-weave-soft),linear-gradient(180deg,#fffefa,#fbf6ec);box-shadow:0 14px 30px -24px #4a3a2259}
.menu-page main .co-rules-list li::before{content:counter(rule,decimal-leading-zero);position:absolute;left:22px;top:22px;font-family:var(--serif);font-size:1.6rem;color:var(--gold-dark);line-height:1}
.menu-page main .co-rules-list h3{font-size:1.15rem;letter-spacing:-.01em}
.menu-page main .co-rules-list p{font-size:.9375rem;color:var(--muted);line-height:1.6;margin-top:6px}
.menu-page main .co-rules-list li:last-child{background-color:#f8f0e0;background-image:var(--tex-grain),var(--tex-weave-soft),var(--tex-mottle),linear-gradient(180deg,#faf3e6,#f3e8d4)}
.menu-page main .co-deposit{max-width:820px;margin:30px auto 0;padding:22px 28px;border-left:3px solid var(--gold);background:#fffaf0;color:var(--muted);line-height:1.7;font-size:.9375rem}
.menu-page main .co-deposit strong{color:var(--navy)}

@media(max-width:1100px){
  .menu-page main .co-rules-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .menu-page main .co-grid-5{grid-template-columns:1fr}
  .menu-page main .co-grid-5>.cb-card,.menu-page main .co-grid-5>.cb-card:nth-child(4){grid-column:auto}
  .menu-page main .co-also{grid-template-columns:1fr}
  .menu-page main .co-visit-inner{grid-template-columns:1fr;gap:30px;padding-block:52px}
}
@media(max-width:600px){
  .menu-page main .co-rules-list{grid-template-columns:1fr}
  .menu-page main .co-rules-list li{padding:22px 20px 20px 62px}
  .menu-page main .co-also-link span{font-size:1.35rem;padding:36px 22px 24px}
}
