/* RESET */
html, body {
  margin: 0;
  padding: 0;
  background: #0b0b0b;
  color: #eae6df;
  font-family: 'Arial', sans-serif;
  scroll-behavior: smooth;
}

/* HERO */
#hero {
  position: relative;
  background: linear-gradient(
    rgba(0,0,0,.65),
    rgba(0,0,0,.9)
  );
}


.hero-logo {
  max-width: 320px;
  filter: drop-shadow(0 0 25px rgba(0,0,0,.8));
}

.tagline {
  letter-spacing: 3px;
  font-size: 0.9rem;
  opacity: 0.8;
}

/* SECTIONS */
.section {
  padding: 100px 0;
}

.section.dark {
  background: #060606;
}

.section-title {
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 50px;
}

/* GUEST CARDS */
.guest-card {
  background: #111;
  border: 1px solid #222;
  padding: 20px;
  text-align: center;
  transition: transform .2s;
}

.guest-card:hover {
  transform: translateY(-5px);
}

.guest-card img {
  width: 100%;
  margin-bottom: 15px;
}

/* EPISODES */
#latest-video iframe {
  width: 100%;
  height: 500px;
  border: none;
}

.video-thumb {
  cursor: pointer;
  transition: opacity .2s;
}

.video-thumb:hover {
  opacity: 0.75;
}

/* SIGN DIVIDER */
.sign-divider {
  background: #000;
  text-align: center;
}

.sign-divider img {
  max-width: 100%;
}

/* CHARACTER SECTION */
.character-section {
  background: #000;
}

.character-img {
  max-width: 400px;
  filter: drop-shadow(0 0 40px rgba(0,0,0,.9));
}

/* FOOTER */
footer {
  background: #050505;
  font-size: 0.8rem;
  opacity: 0.6;
}

.video-thumb {
  cursor: pointer;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.video-thumb:hover {
  transform: scale(1.03);
  opacity: 0.8;
}


.footer-logo {
  max-width: 120px;
}

/* GUEST POSTER STYLE */
.guest-card img {
  object-fit: cover;
  width: 100%;
  filter: contrast(1.1) saturate(0.9);
  border: 1px solid #222;
}

.guest-card h5 {
  margin-top: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.guest-card p {
  font-size: 0.85rem;
  opacity: 0.7;
}

/* Optional hover effect */
.guest-card:hover img {
  filter: contrast(1.2) saturate(1);
}
/* HERO SETUP */
#hero {
  position: relative;
  overflow: hidden;
}

/* EMBERS — HERO ONLY */
#hero .embers {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image:
    radial-gradient(circle, rgba(255,120,0,.6) 1px, transparent 2px),
    radial-gradient(circle, rgba(255,200,100,.4) 1px, transparent 2px);
  background-size: 120px 120px, 180px 180px;
  animation: embers-float 40s linear infinite;
  opacity: 0.35;
}

/* KEEP HERO CONTENT ABOVE EMBERS */
#hero > div:not(.embers) {
  position: relative;
  z-index: 2;
}

/* EMBER FLOAT ANIMATION */
@keyframes embers-float {
  from {
    background-position: 0 100%, 50% 100%;
  }
  to {
    background-position: 0 -200%, 50% -200%;
  }
}

/* HEAT GLOW — HERO ONLY */
#hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      ellipse at bottom,
      rgba(255,80,0,.15),
      transparent 60%
    );
  animation: heatPulse 6s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}

/* HEAT PULSE */
@keyframes heatPulse {
  0%, 100% { opacity: 0.2; }
  50% { opacity: 0.45; }
}
/* BOOKING FORM SECTION */
.booking-section {
  background: #050505;
}

.booking-subtext {
  opacity: 0.75;
  font-size: 0.95rem;
}

/* FORM STYLING */
.booking-form {
  background: #0d0d0d;
  padding: 40px;
  border: 1px solid #222;
  box-shadow: 0 0 40px rgba(0,0,0,.8);
}

.booking-form .form-label {
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 1px;
  opacity: 0.7;
}

.booking-form .form-control {
  background: #000;
  border: 1px solid #222;
  color: #eae6df;
}

.booking-form .form-control::placeholder {
  color: #777;
}

.booking-form .form-control:focus {
  background: #000;
  border-color: #b30000;
  box-shadow: none;
  color: #fff;
}

.booking-form button {
  text-transform: uppercase;
  letter-spacing: 1px;
}
.booking-form button:hover {
  box-shadow: 0 0 15px rgba(255,80,0,.4);
}
/* CALENDAR SECTION */
.calendar-section {
  background: rgba(0,0,0,0.75);
}

/* CENTERING WRAPPER */
.calendar-outer {
  display: flex;
  justify-content: center;
}

/* FRAMED CALENDAR */
.calendar-wrapper {
  width: 100%;
  max-width: 820px;   /* <- keeps it clean on big screens */
  aspect-ratio: 4 / 3;
  background: #0b0b0b;
  border: 1px solid #222;
  box-shadow:
    0 0 40px rgba(0,0,0,.9),
    inset 0 0 40px rgba(0,0,0,.6);
  position: relative;
  overflow: hidden;
}

/* GOOGLE IFRAME */
.calendar-wrapper iframe {
  width: 100%;
  height: 100%;
  border: none;
  filter: invert(1) hue-rotate(180deg) contrast(1.15);
}
.calendar-wrapper::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 120px rgba(0,0,0,.85);
  pointer-events: none;
}