
.ember-app { position: relative; min-height: 100vh; }

.ember-wrap {
  width: 1180px;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 26px;
}


.ember-top-of-hour {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}

.ember-main { padding-top: 110px; }

.ember-band {
  position: relative;
  width: 100%;
  padding: 67.776px 0;
}
.ember-main > .ember-band:nth-of-type(even) { background: #1c1f36; }
.ember-main > .ember-band:nth-of-type(odd) { background: #23263f; }


.ember-segment {
  position: relative;
  width: 100%;
  text-align: center;
  padding: 112px 16px;
  background:
    radial-gradient(40% 60% at 20% 20%, rgba(255, 122, 89, 0.28) 0, transparent 60%),
    radial-gradient(50% 50% at 80% 30%, rgba(169, 216, 240, 0.22) 0, transparent 60%),
    radial-gradient(45% 55% at 55% 95%, rgba(255, 210, 122, 0.16) 0, transparent 60%),
    #15172a;
}
.ember-segment-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  grid-template-areas:
    "head media"
    "offer media"
    "quick media"
    "stats stats";
  column-gap: 42px;
  row-gap: 26px;
  align-items: start;
}
.ember-segment-head { grid-area: head; text-align: center; }
.ember-segment-media { grid-area: media; align-self: start; }
.ember-segment-offer { grid-area: offer; }
.ember-segment-quick { grid-area: quick; min-width: 0; }
.ember-segment-stats { grid-area: stats; }

.ember-photo {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  border-radius: 18px;
  box-shadow: 0 26px 68px rgba(0, 0, 0, 0.45);
}


.ember-giant-stats {
  display: flex;
  justify-content: center;
  gap: 68px;
  margin-top: 16px;
  padding-top: 26px;
  border-top: 1px solid rgba(246, 241, 231, 0.14);
}
.ember-giant-stat { text-align: center; }
.ember-giant-num {
  display: block;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 54px;
  font-weight: 700;
  line-height: 1;
  color: #ff8a6b;
}
.ember-giant-label {
  display: block;
  margin-top: 10px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #c9c6d6;
}

.cards-uniform-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 26px;
}


.parallax { background-attachment: fixed; }
.ember-interlude {
  position: relative;
  padding: 68px 0;
  background-color: #2a1d2b;
  background-image:
    radial-gradient(60% 120% at 15% 50%, rgba(255, 122, 89, 0.55) 0, transparent 70%),
    radial-gradient(50% 110% at 85% 40%, rgba(169, 216, 240, 0.35) 0, transparent 70%),
    linear-gradient(120deg, #15172a 0%, #3a2232 100%);
  background-size: cover;
  text-align: center;
}


.ember-brush {
  height: 40px;
  margin-top: -1px;
  background: #ff7a59;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='40'%3E%3Cpath d='M0 20 Q300 0 600 20 T1200 20 V40 H0Z'/%3E%3C/svg%3E") bottom/cover no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='40'%3E%3Cpath d='M0 20 Q300 0 600 20 T1200 20 V40 H0Z'/%3E%3C/svg%3E") bottom/cover no-repeat;
}


.ember-page-head {
  padding: 42px 0 26px;
  background:
    radial-gradient(50% 80% at 10% 0%, rgba(255, 122, 89, 0.22) 0, transparent 60%),
    #15172a;
}
.ember-crumbs { font-size: 14px; color: #c9c6d6; margin-bottom: 16px; }
.ember-crumbs ol { display: flex; flex-wrap: wrap; gap: 10px; }
.ember-crumbs li + li::before { content: "›"; margin-right: 10px; color: #a8a6bb; }
.ember-crumbs a { color: #c9c6d6; }

.ember-legal-crawl { max-width: 780px; }
.ember-legal-crawl h1 { font-size: 40px; }


.ember-end-card {
  background: #0f1120;
  color: #cbd0e0;
  padding: 42px 0 26px;
}
.ember-end-cols {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 42px;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 26px;
}
.ember-end-bottom {
  max-width: 1180px;
  margin: 42px auto 0;
  padding: 26px 26px 0;
  border-top: 1px solid rgba(203, 208, 224, 0.18);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 26px;
}

@media (max-width: 1024px) {
  .ember-segment { padding: 41.888px 16px 67.776px; }
  .ember-segment-grid { column-gap: 26px; }
  .ember-giant-stats { gap: 42px; }
  .ember-giant-num { font-size: 44px; }
}

@media (max-width: 767px) {
  .ember-wrap { padding: 0 16px; }
  .ember-main { padding-top: 92px; }
  .ember-band { padding: 42px 0; }
  .ember-segment { padding: 16px 0 42px; }
  .ember-segment-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "head" "media" "offer" "quick" "stats";
    row-gap: 16px;
  }
  .ember-photo { max-width: 100%; border-radius: 14px; }
  .ember-giant-stats { gap: 16px; justify-content: space-between; }
  .ember-giant-num { font-size: 34px; }
  .ember-giant-label { font-size: 11px; letter-spacing: 1px; }
  .parallax { background-attachment: scroll; }
  .ember-legal-crawl h1 { font-size: 30px; }
  .ember-end-cols { grid-template-columns: 1fr 1fr; gap: 26px; padding: 0 16px; }
  .ember-end-brand { grid-column: 1 / -1; }
  .ember-end-bottom { flex-direction: column; align-items: flex-start; padding: 26px 16px 0; }

  
  .ember-swipe {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 16px;
  }
  .ember-swipe > * {
    flex: 0 0 84%;
    min-width: 84%;
    scroll-snap-align: start;
  }
}


.ember-unit { min-width: 0; }
.ember-unit--header { isolation: isolate; }
.ember-unit--main { display: block; min-height: 60vh; }
.ember-unit--section { width: 100%; }
.ember-unit--footer { overflow: hidden; }
.ember-unit__inner { position: relative; }
.ember-unit__content { min-width: 0; }


.ember-rundown h2,
.ember-tune-in h2,
.ember-on-record h2,
.ember-credits h2,
.ember-listener-qa h2 { max-width: 760px; }
.ember-sign-off { border-top: 3px solid #ff7a59; }
.ember-queue { min-height: 420px; }
.ember-contact-desk { min-height: 360px; }
.ember-tune-in .ember-card { --card-bg: #e9f4fb; }

.ember-segment-head h1 { -webkit-hyphens: manual; hyphens: manual; }
@media (max-width: 767px) {
  .ember-segment-head h1 { -webkit-hyphens: auto; hyphens: auto; }
}
