/* ═══════════════════════════════════════
   CATERING PAGE — catering.css
═══════════════════════════════════════ */
/* body  */
html,
body {
  overflow-x: hidden;
}
/* ── CATERING INTRO ── */
.catering-intro {
  padding: 100px 80px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.catering-intro-img {
  position: relative;
  height: 520px;
  overflow: hidden;
}
.catering-intro-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 12s ease;
}
.catering-intro-img:hover img { transform: scale(1.04); }
.catering-intro-img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 50%, rgba(11,11,11,0.5) 100%);
}
.catering-intro-img-label {
  position: absolute;
  bottom: 28px; left: 28px; right: 28px;
  display: flex; gap: 12px; flex-wrap: wrap;
}
.ci-tag {
  background: rgba(11,11,11,0.85);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(199,154,59,0.3);
  padding: 8px 16px;
  font-size: 11px;
  color: var(--gld);
  letter-spacing: 1px;
  white-space: nowrap;
}
.catering-intro-text p {
  font-size: 15px;
  line-height: 1.92;
  color: rgba(247,245,242,0.58);
  font-weight: 300;
  margin-bottom: 22px;
}
.catering-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(199,154,59,0.1);
  margin-top: 36px;
}
.cat-stat {
  background: var(--blk);
  padding: 24px 20px;
  text-align: center;
}
.cat-stat-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 36px;
  font-weight: 600;
  color: var(--gld);
  line-height: 1;
  margin-bottom: 6px;
}
.cat-stat-label {
  font-size: 10px;
  color: rgba(247,245,242,0.38);
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* ── SERVICE CARDS ── */
.services-section {
  padding: 0 80px 100px;
}
.services-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 60px;
}
.service-card {
  background: var(--card);
  border: 1px solid var(--bdr);
  overflow: hidden;
  position: relative;
  transition: border-color 0.4s, box-shadow 0.4s, transform 0.4s;
  cursor: pointer;
}
.service-card:hover {
  border-color: var(--gld);
  box-shadow: 0 24px 60px rgba(0,0,0,0.5), 0 0 28px rgba(199,154,59,0.08);
  transform: translateY(-6px);
}
.service-card-img {
  position: relative;
  height: 240px;
  overflow: hidden;
}
.service-card-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.16,1,0.3,1);
}
.service-card:hover .service-card-img img { transform: scale(1.07); }
.service-card-img::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 40%, rgba(11,11,11,0.7) 100%);
}
.service-card-badge {
  position: absolute;
  bottom: 16px; left: 20px;
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 500;
  color: var(--ofw);
  z-index: 1;
}
.service-card-body {
  padding: 28px 32px 36px;
}
.service-card-icon {
  font-size: 28px;
  margin-bottom: 16px;
}
.service-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px;
  font-weight: 500;
  margin-bottom: 10px;
  color: var(--ofw);
}
.service-card-desc {
  font-size: 13px;
  color: rgba(247,245,242,0.48);
  line-height: 1.85;
  margin-bottom: 20px;
}
.service-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.svc-tag {
  padding: 4px 14px;
  border: 1px solid rgba(199,154,59,0.22);
  font-size: 11px;
  color: rgba(247,245,242,0.42);
  letter-spacing: 0.5px;
  transition: border-color 0.3s, color 0.3s;
}
.service-card:hover .svc-tag {
  border-color: rgba(199,154,59,0.4);
  color: rgba(247,245,242,0.6);
}
.service-card-arrow {
  position: absolute;
  top: 28px; right: 28px;
  width: 36px; height: 36px;
  border: 1px solid rgba(199,154,59,0.2);
  display: flex; align-items: center; justify-content: center;
  color: rgba(199,154,59,0.5);
  font-size: 18px;
  transition: all 0.3s;
}
.service-card:hover .service-card-arrow {
  border-color: var(--gld);
  color: var(--gld);
  background: rgba(199,154,59,0.08);
}

/* ── PROCESS SECTION ── */
.process-section {
  padding: 80px 80px 100px;
  background: #0a0a0a;
  border-top: 1px solid rgba(199,154,59,0.1);
  border-bottom: 1px solid rgba(199,154,59,0.1);
}
.process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 60px;
}
.process-step {
  padding: 52px 36px 52px;
  border-right: 1px solid rgba(199,154,59,0.1);
  text-align: center;
  position: relative;
  transition: background 0.3s;
}
.process-step:last-child { border-right: none; }
.process-step:hover { background: rgba(199,154,59,0.04); }
.process-step::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--gld);
  opacity: 0;
  transition: opacity 0.4s;
}
.process-step:hover::before { opacity: 1; }
.process-step-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 64px;
  font-weight: 300;
  color: rgba(199,154,59,0.15);
  line-height: 1;
  margin-bottom: 16px;
}
.process-step-icon {
  font-size: 32px;
  margin-bottom: 18px;
  display: block;
}
.process-step-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 500;
  color: var(--ofw);
  margin-bottom: 10px;
}
.process-step-desc {
  font-size: 13px;
  color: rgba(247,245,242,0.42);
  line-height: 1.75;
}
.process-arrow {
  position: absolute;
  right: -16px; top: 50%;
  transform: translateY(-50%);
  color: rgba(199,154,59,0.3);
  font-size: 20px;
  z-index: 1;
}
.process-step:last-child .process-arrow { display: none; }

/* ── PACKAGES ── */
.packages-section {
  padding: 80px 80px 100px;
}
.packages-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 60px;
}
.pkg-card {
  background: var(--card);
  border: 1px solid var(--bdr);
  padding: 48px 40px;
  position: relative;
  transition: border-color 0.4s, box-shadow 0.4s;
}
.pkg-card:hover { border-color: rgba(199,154,59,0.4); box-shadow: 0 20px 50px rgba(0,0,0,0.4); }
.pkg-card.featured {
  border-color: var(--gld);
  background: linear-gradient(160deg, rgba(199,154,59,0.06) 0%, var(--card) 60%);
}
.pkg-featured-badge {
  position: absolute;
  top: -1px; left: 50%;
  transform: translateX(-50%);
  background: var(--gld);
  color: var(--blk);
  font-size: 9px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 700;
  padding: 6px 22px;
  white-space: nowrap;
}
.pkg-tier {
  font-size: 10px;
  letter-spacing: 3px;
  color: var(--gld);
  text-transform: uppercase;
  margin-bottom: 8px;
}
.pkg-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 500;
  color: var(--ofw);
  margin-bottom: 6px;
}
.pkg-guests {
  font-size: 12px;
  color: rgba(247,245,242,0.36);
  letter-spacing: 1px;
  margin-bottom: 28px;
}
.pkg-price-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 8px;
  padding-bottom: 28px;
  border-bottom: 1px solid rgba(199,154,59,0.15);
}
.pkg-price {
  font-family: 'Cormorant Garamond', serif;
  font-size: 48px;
  font-weight: 600;
  color: var(--gld);
  line-height: 1;
}
.pkg-per { font-size: 13px; color: rgba(247,245,242,0.38); }
.pkg-features {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 24px 0 32px;
}
.pkg-feat {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: rgba(247,245,242,0.55);
  line-height: 1.5;
}
.pkg-feat::before {
  content: '✓';
  color: var(--gld);
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 2px;
}

/* ── WHY CHOOSE US ── */
.why-section {
  padding: 80px 80px 100px;
  background: #0a0a0a;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  margin-top: 60px;
}
.why-item {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.why-item-icon {
  width: 56px; height: 56px;
  border: 1px solid rgba(199,154,59,0.28);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}
.why-item-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 500;
}
.why-item-desc {
  font-size: 13px;
  color: rgba(247,245,242,0.45);
  line-height: 1.8;
}

/* ── ENQUIRY FORM ── */
.enquiry-section {
  padding: 80px 80px 100px;
  background: var(--blk);
}
.enquiry-grid {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 80px;
  align-items: start;
  margin-top: 60px;
}
.enquiry-info h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 400;
  margin-bottom: 16px;
}
.enquiry-info p {
  font-size: 14px;
  color: rgba(247,245,242,0.5);
  line-height: 1.85;
  margin-bottom: 32px;
}
.enquiry-contacts {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.enq-contact-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.enq-contact-icon {
  width: 40px; height: 40px;
  border: 1px solid rgba(199,154,59,0.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}
.enq-contact-label {
  font-size: 10px; letter-spacing: 2px;
  color: var(--gld); text-transform: uppercase; margin-bottom: 4px;
}
.enq-contact-val {
  font-size: 13px; color: rgba(247,245,242,0.5); line-height: 1.6;
}
.enquiry-form-note {
  font-size: 11px;
  color: rgba(247,245,242,0.28);
  text-align: center;
  margin-top: 14px;
  line-height: 1.7;
}

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .catering-intro,
  .enquiry-grid { grid-template-columns: 1fr; gap: 52px; }
  .catering-intro-img { height: 380px; }
  .services-grid { grid-template-columns: 1fr; }
  .process-grid { grid-template-columns: 1fr 1fr; }
  .process-step { border-bottom: 1px solid rgba(199,154,59,0.1); }
  .packages-grid { grid-template-columns: 1fr; max-width: 480px; margin-left: auto; margin-right: auto; }
  .why-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .catering-intro,
  .services-section,
  .process-section,
  .packages-section,
  .why-section,
  .enquiry-section { padding: 60px 24px; }
  .services-grid,
  .process-grid,
  .packages-grid,
  .why-grid { grid-template-columns: 1fr; }
  .catering-stats { grid-template-columns: 1fr; }
  .process-step { border-right: none; }

}

/* MOBILE FIX */
/* ==================================
   MOBILE OPTIMIZATION
================================== */
@media (max-width:768px){

  /* Sections */
  .catering-intro,
  .services-section,
  .process-section,
  .packages-section,
  .why-section,
  .enquiry-section{
    padding:48px 16px;
  }

  /* Hero */


  .page-title{
    font-size:2.2rem;
    line-height:1.15;
  }

  .page-subtitle{
    font-size:14px;
    line-height:1.7;
  }

  /* Intro */
  .catering-intro-img{
    height:280px;
  }

  .cat-stat{
    padding:18px;
  }

  .cat-stat-num{
    font-size:28px;
  }

  /* Service Cards */
  .service-card-img{
    height:180px;
  }

  .service-card-body{
    padding:18px;
  }

  .service-card-title{
    font-size:22px;
  }

  .service-card-desc{
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .service-card:hover{
    transform:none !important;
  }
  /* Process */
  .process-step{
    padding:32px 20px;
  }

  .process-step-num{
    font-size:42px;
  }

  .process-arrow{
    display:none;
  }

  /* Packages */
  .pkg-card{
    padding:28px 20px;
  }

  .pkg-name{
    font-size:24px;
  }

  .pkg-price{
    font-size:36px;
  }

  /* Enquiry */
  .enquiry-grid{
    gap:40px;
  }

  .enquiry-info h3{
    font-size:28px;
  }

  /* Mobile reveal animations */
  .reveal,
  .reveal-l,
  .reveal-r{
    opacity:0;
    transform:translateY(24px);
    transition:
      opacity .8s cubic-bezier(.16,1,.3,1),
      transform .8s cubic-bezier(.16,1,.3,1);
  }

  .reveal.vis,
  .reveal-l.vis,
  .reveal-r.vis{
    opacity:1;
    transform:translateY(0);
  }
  .hero-description,
.catering-intro p {
  font-size: 14px;
  line-height: 1.7;
}
.catering-stats{
  grid-template-columns:repeat(3,1fr) !important;
  gap:1px;
}

.cat-stat{
  padding:14px 8px;
}

.cat-stat-num{
  font-size:22px;
}

.cat-stat-label{
  font-size:8px;
  letter-spacing:1px;
}
.process-grid{
  display:flex;
  overflow-x:auto;

  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;

  gap:16px;
  background:transparent !important;
  padding-bottom:16px;
}

.process-grid::-webkit-scrollbar{
  display:none;
}

.process-step{
  min-width:100%;
  flex:0 0 100%;

  scroll-snap-align:center;

  border-right:none !important;

  padding:28px 20px !important;

  background:#0f0f0f;
  border:1px solid rgba(199,154,59,.15);
  border-radius:18px;
  overflow: hidden;
}
.process-step-num{
  font-size:48px;
  color:rgba(199,154,59,.22);
}
.process-arrow{
  display:none !important;
}
/* dots */
.process-dots{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;

  margin-top:20px;
}

.process-dots span{
  width:8px;
  height:8px;

  border-radius:50%;

  background:rgba(199,154,59,.25);

  transition:all .3s ease;
}

.process-dots span.active{
  width:24px;
  border-radius:999px;
  background:var(--gld);
}
.packages-grid{
  display:flex !important;
  overflow-x:auto;

  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;

  gap:18px;
  padding-top:16px;
  padding-bottom:16px;
}

.packages-grid::-webkit-scrollbar{
  display:none;
}

.pkg-card{
  min-width:90%;
  flex:0 0 90%;

  scroll-snap-align:center;

  margin:0 !important;
}
.pkg-card.featured{
  transform:scale(1.02);
  border-width:2px;
}
.why-grid{
  display:flex;
  flex-direction:column;
  gap:0;
  margin-top:32px;
}

.why-item{
  display:grid;
  grid-template-columns:44px 1fr 24px;
  align-items:center;
  gap:16px;
  
}

.why-item::after{
  content:"+";

  position:absolute;
  right:0;
  top:7.5%;

  color:var(--gld);

  font-size:24px;

  transition:.3s;
}

.why-item.active::after{
  transform:rotate(45deg);
}

.why-item-icon{
  width:44px;
  height:44px;
  font-size:20px;
}

.why-item-desc{
  max-height:0;
  overflow:hidden;
  grid-column:2 / 4;
  opacity:0;

  transition:
    max-height .35s ease,
    opacity .25s ease;

  margin-top:0;
  padding-bottom:10%;
}

.why-item.active .why-item-desc{
  max-height:150px;
  opacity:1;
  margin-top:12px;
}
}