/* ===== Page shell ===== */
.se-wrap {
  background:#000;
  color:#fff;
  padding:1.5rem 1rem 3rem;
  margin-top:100px;
}

/* ===== Top bar ===== */
.se-topbar { display:flex; justify-content:center; margin-bottom:1rem; }
.se-cal-btn {
  display:inline-block;
  background:#f5efe3;
  color:#000;
  text-decoration:none;
  padding:.5rem .9rem;
  border-radius:.5rem;
  font-weight:600;
}

/* ===== HERO: two columns by default; poster stays on the right ===== */
.se-hero{
  max-width:1150px;
  margin:0 auto 1.25rem;
  display:grid;
  grid-template-columns: 1fr clamp(160px, 28vw, 340px);
  gap:24px;
  align-items:start;
}
.se-hero-main{ min-width:0; }           /* prevents text overflow */
.se-hero-poster{ align-self:start; }
.se-poster-img{
    max-width: 270px;
  width:100%;
  height:auto;

  border-radius:.75rem;
  display:block;
}

/* Below 900px, keep two columns but shrink poster column a bit */
@media (max-width:900px){
  .se-hero{ grid-template-columns: 1fr clamp(140px, 30vw, 220px); gap:16px; }
}

/* Stack only on very small screens (≤500px) */
@media (max-width:500px){
  .se-hero{ grid-template-columns:1fr; gap:14px; }
  .se-buy-btn{
    margin-top:20px;
    margin-bottom: 20px;
  }

 
  /* DOM order is main then aside so poster naturally goes below */
}

/* ===== Title, date, badges ===== */
.se-date-row{
  opacity:.85;
  display:flex;
  gap:.5rem;
  align-items:center;
  font-size:.95rem;
  letter-spacing:.02em;
}
.se-title{
  font-size:clamp(32px,4vw,56px);
  margin:.25rem 0 .5rem;
  line-height:1.1;
}
.se-badges{ display:flex; flex-wrap:wrap; gap:.4rem; }
.se-badge{
  background:#141414;
  border:1px solid #222;
  padding:.25rem .55rem;
  border-radius:.5rem;
  font-size:.85rem;
  opacity:.95;
}

/* ===== Times stacked (Start / Ends) ===== */
.se-time-stack{
  margin:.5rem 0 1rem;
  display:flex;
  flex-direction:column;
  gap:.25rem;
}
.se-time-line{ display:flex; gap:.5rem; align-items:baseline; }
.se-time-label{
  font-size:.85rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.75;
}
.se-time-value{ font-weight:600; }

/* ===== Content sections ===== */
.se-notes, .se-desc, .se-tables, .se-policies, .se-cta{
  max-width:1150px;
  margin:0 auto 1.25rem;
}
.se-block-title{
  font-size:.9rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  margin:2rem 0 .6rem;
}

/* Notes */
.se-notes-list{ margin:.3rem 0 0; padding-left:1.1rem; }
.se-notes-list li{ margin:.15rem 0; line-height:1.6; }

/* Description */
.se-desc-inner{ color:#eee; line-height:1.7; }
.se-desc-inner p{ margin:0 0 .9rem; }

/* ===== Tables image (kept inside a frame; no stretch, no overflow) ===== */
.se-tables-imgwrap{
  background:#0f0f0f;
  border:1px solid #1a1a1a;
  border-radius:.9rem;
  padding:.6rem;
  width:100%;
  margin:0 auto;
  box-sizing:border-box;
  overflow:hidden;                 /* clip rounded corners & prevent spill */
}
.se-tables-img{
  display:block;
  width:100%;
  height:auto;                     /* preserve aspect ratio */
  border-radius:.6rem;
}
/* Optional: cap very tall images on small screens */

/* ===== Policies box ===== */

.se-policies-list{ margin:0; padding-left:0rem; margin-left: 0rem; }
.se-policies-list li{ line-height:1.6; margin:.15rem 0; margin-left: 0;}

/* ===== CTA ===== */
.se-cta{ text-align:center; margin-top:1.5rem; }
.se-buy-btn{
  display:inline-block;
  background:#2a66ff;
  color:#fff;
  text-decoration:none;
  padding:.7rem 1.1rem;
  border-radius:.7rem;
  font-weight:700;
}
.se-buy-btn:hover{ filter:brightness(1.1); }




/* Make the Eat App overlay stick to the viewport */
#eatapp-widget,
[id^="eatapp-widget"],
.eatapp-widget,
.eatapp-widget-overlay {
  position: fixed !important;
  inset: 0 !important;                 /* top/right/bottom/left: 0 */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2147483000 !important;       /* above everything */
  background: rgba(0,0,0,.45) !important; /* if their overlay is transparent */
  min-height:80vh!important;
}

/* Size the iframe/panel so it always fits in the current viewport */
#eatapp-widget iframe,
#eatapp-widget > * {
  max-width: min(100vw, 520px) !important;   /* limit width */
  width: 100% !important;

  /* full height in viewport */
  height: 90vh !important;                   /* 90% of viewport height */
  max-height: 90vh !important;

  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 30px 80px rgba(0,0,0,.55) !important;
}