#fw-section-custom-html-bb5dc3ec-5394-427e-a8e8-e22f61b669f2 {

/* Smooth scroll for :target jumps */
html { scroll-behavior: smooth; }

/* ===== Core shell ===== */
.k2t-shell {
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #f7f4fa;
  margin: 0;
}
.k2t-shell__card {
  max-width: 1100px;
  margin: 0 auto;
  background-color: #140c1c;
  border: 1px solid rgba(226,149,78,.22);
  border-radius: 16px;
  overflow: hidden;                  /* clip everything to the rounded outline */
  box-shadow: 0 10px 30px rgba(45,5,82,.35);
  display: flex;
  flex-direction: column-reverse;    /* header renders above embed */
}
.k2t-shell__top {
  display: flex;
  gap: 18px;
  padding: 18px;
  background-color: #0b0710;
}

/* ===== Cover & EQ ===== */
.k2t-shell__cover {
  position: relative;
  flex: 0 0 280px;
  height: 280px;
  background: #1a1122;
  border-radius: 12px;
  overflow: hidden;
  /* Subtle always-on glow that remains inside the card outline */
  box-shadow: 0 0 0 0 rgba(226,149,78,0.0), 0 6px 16px rgba(90,45,67,0.25);
  transition: box-shadow .25s ease, transform .25s ease;
}
.k2t-shell__cover a { display: block; height: 100%; }
.k2t-shell__cover img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: opacity .25s ease;
}
/* Intensify glow + tiny lift on hover */
.k2t-shell__cover:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 18px rgba(226,149,78,.25),
    0 10px 22px rgba(226,149,78,.22);
}
.k2t-shell__cover:hover img { opacity: .95; }

/* Decorative EQ */
.k2t-shell__eq {
  position: absolute; left: 10px; bottom: 10px;
  display: inline-flex; align-items: flex-end; gap: 4px;
  width: 42px; height: 28px; padding: 5px 3px; border-radius: 8px;
  background: linear-gradient(180deg, rgba(45,5,82,.55), rgba(90,45,67,.35));
  border: 1px solid rgba(226,149,78,.22);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}
.k2t-shell__eq span {
  display: block; width: 5px; height: 7px; border-radius: 3px;
  background: linear-gradient(180deg,#E2954E,#ffd9b3);
  transform-origin: bottom;
  animation: k2tPulse 1.25s ease-in-out infinite;
  opacity: .95;
}
.k2t-shell__eq span:nth-child(2){ animation-delay: .12s; }
.k2t-shell__eq span:nth-child(3){ animation-delay: .24s; }
.k2t-shell__eq span:nth-child(4){ animation-delay: .36s; }
.k2t-shell__eq span:nth-child(5){ animation-delay: .48s; }
@keyframes k2tPulse {
  0%{ transform: scaleY(.35);} 20%{ transform: scaleY(.9);}
  40%{ transform: scaleY(.5);} 60%{ transform: scaleY(1);}
  80%{ transform: scaleY(.45);} 100%{ transform: scaleY(.8);}
}

/* ===== Text ===== */
.k2t-shell__meta {
  display: flex; flex-direction: column; justify-content: center;
  gap: 10px; min-width: 0; flex: 1;
}
.k2t-shell__title {
  margin: 0; font-weight: 800; letter-spacing: .2px;
  font-size: 28px; line-height: 1.1; color: #E2954E;
}
.k2t-shell__subtitle { margin: 0; color: #cbbfd6; font-size: 16px; }

/* ===== Buttons (gradient + glow) ===== */
.k2t-shell__buttons {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; align-items: center;
}
.k2t-btn {
  display: inline-block; text-decoration: none; font-weight: 700; letter-spacing: .25px;
  padding: 10px 14px; border-radius: 999px; cursor: pointer;
  transition: opacity .15s ease, transform .15s ease, box-shadow .25s ease, background .25s ease;
}
.k2t-btn--primary {
  background: linear-gradient(90deg,#2D0552,#5A2D43);
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 6px 16px rgba(90,45,67,.35), inset 0 0 0 1px rgba(255,255,255,.06);
}
.k2t-btn--primary:hover,
.k2t-btn--primary:focus {
  opacity: .98; transform: translateY(-1px);
  background: linear-gradient(90deg,#2D0552,#5A2D43 60%, #E2954E);
  box-shadow: 0 10px 22px rgba(226,149,78,.35), inset 0 0 0 1px rgba(255,255,255,.10);
}
.k2t-btn--primary:active { transform: translateY(0); opacity: .92; }
.k2t-btn--primary:focus-visible { outline: 2px solid #E2954E; outline-offset: 2px; }

/* ===== Embed (expand/fade) ===== */
.k2t-shell__embed {
  max-height: 0; opacity: 0; overflow: hidden; padding: 0 18px;
  transition: max-height .45s ease, opacity .35s ease, padding .35s ease;
  background-color: #0b0710; /* stays clipped inside card */
}
.k2t-shell__embed iframe {
  display: block; width: 100%; height: 372px;
  border: 0; border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}

/* Reveal smoothly when targeted */
#k2t-player:target { max-height: 1000px; opacity: 1; padding: 0 18px 18px 18px; }

/* Swap header buttons on toggle */
.k2t-hidebtn { display: none; }
#k2t-player:target ~ .k2t-shell__top .k2t-show { display: none; }
#k2t-player:target ~ .k2t-shell__top .k2t-hidebtn { display: inline-block; }

/* ===== Accessibility ===== */
@media (prefers-reduced-motion: reduce){
  html { scroll-behavior: auto; }
  .k2t-shell__embed { transition: none; }
  .k2t-shell__eq span { animation: none; }
}

/* ===== Responsive ===== */
@media (max-width: 860px){
  .k2t-shell__top { flex-direction: column; }
  .k2t-shell__cover { flex-basis: auto; width: 100%; height: 260px; }
  .k2t-shell__title { font-size: 24px; }
}

}

#fw-section-custom-html-55f73b2c-0c2a-4cb2-b99d-b89346966622 {

/* === Sections & Headings === */
.twitch-section,
.sesspromo-section {
  max-width: 1000px;
  margin: 28px auto;
  padding: 0 16px;
  text-align: center;
}

.twitch-heading {
  font-weight: 800;
  font-size: 1.8rem;
  color: #E2954E;
  margin-bottom: 12px;
}

.twitch-status {
  font-size: 1rem;
  margin-bottom: 20px;
}
.twitch-status.is-live { color: #E2954E; }
.twitch-status.is-offline { color: #aaa; }

/* === LIVE pill === */
.live-pill {
  display: none;
  margin-left: .6rem;
  padding: 2px 10px 2px 8px;
  font-size: .85rem;
  font-weight: 800;
  color: #0b0b0f;
  background: #E2954E;
  border-radius: 999px;
  vertical-align: middle;
  position: relative;
  line-height: 1.6;
}
.live-pill::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #E2954E;
  box-shadow: 0 0 0 0 rgba(226,149,78,0.7);
  animation: livePulse 1.4s ease-out infinite;
}
@keyframes livePulse {
  0%   { box-shadow: 0 0 0 0 rgba(226,149,78,0.7); }
  70%  { box-shadow: 0 0 0 10px rgba(226,149,78,0); }
  100% { box-shadow: 0 0 0 0 rgba(226,149,78,0); }
}

/* === Container layout === */
.twitch-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
}
.twitch-container.one-live {
  flex-wrap: nowrap;
}
.twitch-container.personal-shows {
  justify-content: center;
}

/* === Square thumbnails (side-by-side when offline) === */
.show-thumb {
  display: inline-block;
  width: 100%;
  max-width: 360px;   /* 360px square thumbnails */
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  outline: 2px solid #5A2D43;
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* Square ratio */
.show-thumb::before {
  content: "";
  display: block;
  padding-top: 100%; /* 1:1 ratio */
}

/* Thumbnail image */
.show-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 14px;
}

/* Hover effect */
.show-thumb:hover {
  transform: scale(1.03);
  box-shadow: 0 0 20px rgba(226,149,78,0.5);
}

/* Follow tab */
.show-thumb .follow-cta {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  box-sizing: border-box;
  padding: 12px 16px;
  background: rgba(45,5,82,0.9);
  color: #fff;
  font-weight: 700;
  font-size: 0.9rem;
  text-align: center;
  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 14px;
  line-height: 1.25;
}

/* === Embedded Twitch Player (keep 16:9 for live) === */
.twitch-card {
  width: 100%;
  max-width: 720px; /* make player wider */
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  outline: 2px solid #5A2D43;
}
.twitch-card::before {
  content: "";
  display: block;
  padding-top: 56.25%; /* 16:9 ratio */
}
.twitch-card iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 14px;
}

/* === Sessions promo === */
.sesspromo-heading {
  font-weight: 800;
  font-size: 1.6rem;
  color: #E2954E;
  margin-bottom: 14px;
}
.sesspromo-section .show-thumb {
  display: inline-block;
  max-width: 480px; /* match main show size */
}

/* === Mobile adjustments === */
@media (max-width: 640px) {
  .twitch-heading { font-size: 1.5rem; }
  .sesspromo-heading { font-size: 1.35rem; }
  .twitch-container { flex-direction: column; align-items: center; }
  .twitch-container.one-live { flex-direction: column; }
  .show-thumb, .twitch-card { max-width: 100%; }
}

/* Glow effect on hover for the Follow tab */
.show-thumb:hover .follow-cta {
  background: rgba(226,149,78,0.95); /* gold tone */
  color: #0b0b0f; /* dark text for contrast */
  box-shadow: 0 0 14px rgba(226,149,78,0.7);
  transition: background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

/* --- Shimmer skeletons for loading --- */
.shimmer-card{
  width:100%;
  max-width:480px;
  height:0;
  padding-top:100%;            /* square placeholder */
  border-radius:14px;
  outline:2px solid #5A2D43;
  position:relative;
  overflow:hidden;
  background:#1b1330;
}
.shimmer-card::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.08), rgba(255,255,255,0));
  transform: translateX(-100%);
  animation: shimmerMove 1.2s infinite;
}
@keyframes shimmerMove{
  to{ transform: translateX(100%); }
}

/* --- Fade-in for player when it loads --- */
.fade-in{ animation: fadeInK2T .35s ease-out both; }
@keyframes fadeInK2T{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }

/* --- Clickable LIVE pill already styled; just ensure it's visibly link-like --- */
.live-pill{ text-decoration:none; }

/* --- Live actions under the player --- */
.live-actions{
  width:100%;
  max-width:720px;
  margin:10px auto 0;
  display:flex;
  justify-content:center;
}
.btn-follow{
  display:inline-block;
  padding:10px 16px;
  border-radius:12px;
  font-weight:800;
  background:#2D0552;
  color:#fff;
  border:1px solid #5A2D43;
  box-shadow: inset 0 0 0 1px rgba(226,149,78,.12);
  transition: box-shadow .2s, transform .2s, background .2s, color .2s;
  text-decoration:none;
}
.btn-follow:hover{
  box-shadow:0 0 0 2px rgba(226,149,78,.25);
  background:rgba(226,149,78,.95);
  color:#0b0b0f;
  transform:translateY(-1px);
}

/* Mobile: keep shimmer/cards full-width */
@media (max-width:640px){
  .shimmer-card{ max-width:100%; }
  .live-actions{ max-width:100%; }
}

/* --- Clickable LIVE pill behaves like a link (no underline) --- */
.live-pill { text-decoration: none; }
.live-pill:hover { filter: brightness(1.05); }

/* --- Loading shimmer skeleton --- */
.skeleton-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
}
.skeleton-box {
  width: 100%;
  max-width: 480px;
  border-radius: 14px;
  aspect-ratio: 1 / 1; /* square */
  background: linear-gradient(
    90deg,
    rgba(90,45,67,0.3) 0%,
    rgba(226,149,78,0.25) 50%,
    rgba(90,45,67,0.3) 100%
  );
  background-size: 200% 100%;
  animation: shimmer 1.2s linear infinite;
  outline: 2px solid #5A2D43;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: 0 0; }
}

/* Mobile fit for shimmer too */
@media (max-width: 640px) {
  .skeleton-box { max-width: 100%; }
}

}


#fw-section-custom-html-881ce11b-25c8-4261-a817-b9ace42f1979 {

/* Wrapper */
.sesspromo-section {
  max-width: 1000px;
  margin: 28px auto;
  padding: 0 16px;
  text-align: center;
}
.sesspromo-heading {
  font-weight: 800;
  font-size: 1.6rem;
  color: #E2954E;
  margin-bottom: 14px;
}

/* Square thumbnail card (480×480) */
.sesspromo-section .show-thumb {
  display: inline-block;
  width: 100%;
  max-width: 360px;
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  outline: 2px solid #5A2D43;
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.sesspromo-section .show-thumb::before {
  content: "";
  display: block;
  padding-top: 100%; /* 1:1 square */
}

/* Image fills the square */
.sesspromo-section .show-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 14px;
}

/* Hover lift + glow */
.sesspromo-section .show-thumb:hover {
  transform: scale(1.03);
  box-shadow: 0 0 20px rgba(226,149,78,0.5);
}

/* Follow tab */
.sesspromo-section .follow-cta {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  box-sizing: border-box;
  padding: 12px 16px;
  background: rgba(45,5,82,0.9);
  color: #fff;
  font-weight: 700;
  font-size: 0.9rem;
  text-align: center;
  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 14px;
  line-height: 1.25;
  pointer-events: none; /* whole tile stays clickable */
}
/* Gold glow on hover */
.sesspromo-section .show-thumb:hover .follow-cta {
  background: rgba(226,149,78,0.95);
  color: #0b0b0f;
  box-shadow: 0 0 14px rgba(226,149,78,0.7);
}

/* Mobile */
@media (max-width: 640px) {
  .sesspromo-heading { font-size: 1.35rem; }
  .sesspromo-section .show-thumb { max-width: 100%; }
}

}

#fw-section-custom-html-5435f554-fcb6-42b1-9d12-43ecff326459 {

/* Container & header */
.schedule-section{max-width:1000px;margin:28px auto;padding:0 16px}
.schedule-header{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.schedule-heading{font-weight:800;font-size:1.8rem;color:#E2954E;margin:0}

/* Toolbar (toggle) */
.schedule-toolbar{margin-left:auto}
.schedule-toggle{
  appearance:none;border:none;cursor:pointer;background:#2D0552;color:#fff;
  border:1px solid #5A2D43;border-radius:12px;padding:10px 14px;font-weight:800;letter-spacing:.2px;
  box-shadow:inset 0 0 0 1px rgba(226,149,78,.12);transition:box-shadow .2s,transform .2s
}
.schedule-toggle:hover{box-shadow:0 0 0 2px rgba(226,149,78,.15)}
.schedule-toggle:active{transform:scale(.98)}

/* Collapsible content */
.schedule-content.is-collapsed{display:none}

/* Themed timezone selector */
.tz-control{display:flex;align-items:center;gap:10px;margin:10px 0 14px}
.tz-control label{color:#cfcfcf;font-weight:700}
.select-wrap{position:relative;display:inline-flex;align-items:center}
.select-wrap::after{
  content:"";position:absolute;right:12px;pointer-events:none;width:10px;height:10px;
  border-right:2px solid #E2954E;border-bottom:2px solid #E2954E;transform:rotate(45deg)
}
#tzSelect{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;background:#2D0552;color:#fff;
  border:1px solid #5A2D43;border-radius:12px;padding:10px 38px 10px 14px;font-weight:800;
  letter-spacing:.2px;outline:none;box-shadow:inset 0 0 0 1px rgba(226,149,78,.12);
  min-width:320px;max-width:100%;
}
#tzSelect:hover{box-shadow:0 0 0 2px rgba(226,149,78,.15)}
#tzSelect:focus{box-shadow:0 0 0 2px rgba(226,149,78,.35)}

/* (Optgroup styles kept harmless if not used) */
#tzSelect optgroup{color:#ffd7b6;font-weight:800;background:#1a0f23}
#tzSelect option{color:#fff;background:#2D0552}

/* Cards grid & cards */
.schedule-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.schedule-card{
  position:relative;background:#2D0552;border-radius:16px;overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.35);outline:2px solid #5A2D43;transition:transform .25s,box-shadow .25s
}
.schedule-card:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(226,149,78,.15)}
.schedule-card .stripe{position:absolute;left:0;top:0;bottom:0;width:10px;background:#E2954E}
.schedule-card .card-body{text-align:left;padding:20px 22px 22px 32px}
.show-name{font-weight:800;font-size:1.35rem;color:#fff;margin-bottom:6px}
.show-note{display:block;font-weight:700;font-size:.9rem;color:#ffd7b6;margin-bottom:10px}

/* Time badge */
.time-badge.local-only{
  display:inline-block;border-radius:12px;padding:10px 12px;font-weight:800;font-size:1rem;
  background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.18)
}
.time-badge .tag{font-weight:800;color:#ffd7b6;margin-left:8px}

/* Footnote */
.schedule-foot{margin-top:12px;color:#aaa;font-size:.95rem;text-align:center}

/* Mobile tweaks */
@media (max-width:640px){
  .schedule-header{flex-direction:column;align-items:flex-start}
  .select-wrap{width:100%}
  #tzSelect{width:100%;min-width:0}
}

}




#fw-section-custom-html-1df9020c-2878-449d-a694-86c28eafb13a {

/* Row: edge-to-edge */
.home-links {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}

/* Three equal columns on desktop, full width on mobile */
.home-link {
  flex: 0 0 33.3333%;
  text-decoration: none;
  color: inherit;
  outline: none;
}

/* Tile wrapper enforces 3:4 portrait ratio */
.image-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;     /* portrait ratio */
  overflow: hidden;
  margin: 0;
}

/* Fallback for browsers without aspect-ratio */
.image-wrapper::before {
  content: "";
  display: block;
  padding-top: 133.333%;   /* 3:4 portrait ratio fallback */
}

/* Position image/overlay/label absolutely */
.image-wrapper img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;       /* crop/zoom to fill uniformly */
  filter: grayscale(100%);
  transition: filter 0.4s ease, transform 0.3s ease;
  z-index: 1;
}

/* Dark overlay behind text */
.image-wrapper::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.25) 0%,
    rgba(0,0,0,0.35) 50%,
    rgba(0,0,0,0.45) 100%
  );
  z-index: 2;
  pointer-events: none;
  transition: opacity 0.3s ease;
  opacity: 0.9;
}

/* Label on top */
.link-label {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: clamp(1.4rem, 4vw, 3rem);
  font-weight: 900;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-align: center;
  padding: 0 1rem;
  text-shadow: 0 4px 14px rgba(0,0,0,0.9);
  z-index: 3;
  pointer-events: none;
}

/* Hover/focus: reveal colour, zoom, soften overlay */
.home-link:hover img,
.home-link:focus-visible img {
  filter: grayscale(0%);
  transform: scale(1.05);
}

.home-link:hover .image-wrapper::after,
.home-link:focus-visible .image-wrapper::after {
  opacity: 0.6;
}

/* Keyboard focus ring */
.home-link:focus-visible .image-wrapper {
  box-shadow: 0 0 0 4px rgba(255,255,255,0.8), 0 0 0 8px rgba(0,0,0,0.6);
  border-radius: 2px;
}

/* Mobile: stack full width */
@media (max-width: 768px) {
  .home-link {
    flex: 0 0 100%;
  }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .image-wrapper img,
  .image-wrapper::after {
    transition: none;
  }
}

}
#fw-section-custom-html-0b82ae65-9a47-4d8e-89ab-b3fae537856d {

/* Wrapper */
.chat-section{
  max-width:1000px;
  margin:28px auto;
  padding:0 16px;
}

/* Header row (title + pill + toggle) */
.chat-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:10px;
}

/* Heading + live pill */
.chat-heading{
  display:flex;
  align-items:flex-end;
  gap:12px;
  font-weight:800;
  font-size:1.8rem;
  color:#E2954E;
  margin:0;
}
.chat-heading .live-pill{
  text-decoration:none;
  display:inline-block;
  font-weight:800;
  font-size:.9rem;
  padding:6px 10px;
  border-radius:999px;
  background:#E2954E;
  color:#0b0b0f;
  box-shadow:0 0 12px rgba(226,149,78,.35);
  transition:filter .2s ease, transform .2s ease;
}
.chat-heading .live-pill:hover{ filter:brightness(1.05); transform:translateY(-1px); }

/* Toggle button */
.chat-toggle{
  background:none;
  border:2px solid #5A2D43;
  border-radius:999px;
  padding:6px 14px;
  font-size:.9rem;
  font-weight:600;
  color:#E2954E;
  cursor:pointer;
  transition:all .2s ease;
}
.chat-toggle:hover{
  background:#5A2D43;
  color:#fff;
}

/* Chat card with slide + fade animation */
.chat-card{
  position:relative;
  background:#2D0552;
  border-radius:16px;
  overflow:hidden;
  outline:2px solid #5A2D43;
  box-shadow:0 10px 30px rgba(0,0,0,.35);

  max-height: 1000px;    /* tall enough to fit the iframe */
  opacity: 1;
  transition: max-height 0.5s ease, opacity 0.4s ease;
}
.chat-card.collapsed{
  max-height: 0;
  opacity: 0;
  overflow: hidden;
}

/* Chat iframe sizing */
#twitch-chat{
  display:block;
  width:100%;
  height:520px; /* tweak if you want taller/shorter chat */
  border:0;
}

/* Mobile */
@media (max-width:640px){
  .chat-heading{ font-size:1.5rem; }
  #twitch-chat{ height:460px; }
}

}
#fw-section-custom-html-897af531-09d3-411f-9d0c-64ea44fb2ec7 {

/* Live Shows Section */
.live-shows {
  text-align: center;
  margin: 2rem auto;
  max-width: 1600px;
  padding: 0 1rem;
}

.live-shows-heading {
  font-size: 1.8rem;
  margin-bottom: 1.5rem;
  color: #E2954E; /* Brand orange */
}

.live-shows-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0; /* flush together */
}

.live-show {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3 / 4; /* portrait 3:4 */
  display: block;
}

.live-show img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(100%);
  transform: scale(1);
  transition: filter 0.4s ease, transform 0.6s ease;
}

/* Overlay background layer */
.overlay-bg {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.25);
  transition: background 0.4s ease;
  z-index: 1;
}

.overlay-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  font-size: 2rem;
  font-weight: bold;
  color: #fff;
  text-shadow: 0px 2px 6px rgba(0,0,0,0.8);
  transition: transform 0.3s ease;
  z-index: 2; /* ensure above overlay */
  pointer-events: none; /* keeps block clickable */
}

/* Hover effects */
.live-show:hover img {
  filter: grayscale(0%);
  transform: scale(1.08);
}

.live-show:hover .overlay-bg {
  background: rgba(0, 0, 0, 0.45);
}

.live-show:hover .overlay-text {
  transform: translate(-50%, -50%) scale(1.1);
}

/* Mobile stacking */
@media (max-width: 768px) {
  .live-shows-grid {
    grid-template-columns: 1fr;
  }
  .overlay-text {
    font-size: 1.5rem;
  }
}

}