/*
 REACH Wrestling Site Pack
 Designed to sit on top of Kadence global colours/typography.
 Primary red: #ED1C24
*/

:root {
  --reach-red: #ED1C24;
  --reach-red-dark: #B51218;
  --reach-black: #000000;
  --reach-charcoal: #121212;
  --reach-charcoal-2: #1B1B1B;
  --reach-white: #FFFFFF;
  --reach-grey: #B5B5B5;
  --reach-border: rgba(255,255,255,.12);
}

.reach-page {
  background: var(--reach-black);
  color: var(--reach-white);
  overflow: hidden;
}

.reach-page, .reach-page * { box-sizing: border-box; }

.reach-page > .wp-block-group,
.reach-section,
.reach-hero,
.reach-page-hero {
  padding-left: clamp(20px, 5vw, 72px);
  padding-right: clamp(20px, 5vw, 72px);
}

.reach-section {
  padding-top: clamp(64px, 8vw, 110px);
  padding-bottom: clamp(64px, 8vw, 110px);
  background: var(--reach-black);
}

.reach-section--dark { background: var(--reach-charcoal); }

.reach-section--red-edge {
  position: relative;
  background: linear-gradient(100deg, rgba(237,28,36,.18), transparent 40%), var(--reach-black);
  border-top: 1px solid rgba(237,28,36,.5);
  border-bottom: 1px solid rgba(237,28,36,.25);
}

.reach-section > *,
.reach-page-hero > *,
.reach-hero > * {
  width: min(1180px, 100%);
  margin-left: auto;
  margin-right: auto;
}

.reach-hero {
  min-height: 680px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  isolation: isolate;
  padding-top: 110px;
  padding-bottom: 110px;
  background:
    radial-gradient(circle at 78% 34%, rgba(237,28,36,.34), transparent 22%),
    linear-gradient(115deg, #000 0%, #090909 47%, #1C0506 100%);
}

.reach-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .35;
  background:
    repeating-linear-gradient(115deg, transparent 0 65px, rgba(255,255,255,.025) 66px 67px),
    linear-gradient(90deg, transparent 0 62%, rgba(237,28,36,.16) 62% 63%, transparent 63%);
}

.reach-hero::after, .reach-page-hero::after {
  content: "";
  position: absolute;
  left: clamp(20px, 5vw, 72px);
  right: clamp(20px, 5vw, 72px);
  bottom: 0;
  height: 4px;
  background: var(--reach-red);
}

.reach-page-hero {
  min-height: 420px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  padding-top: 90px;
  padding-bottom: 90px;
  background: linear-gradient(120deg, #000 10%, #101010 68%, #260708 100%);
}

.reach-page h1, .reach-page h2, .reach-page h3,
.reach-page h4, .reach-page h5, .reach-page h6 {
  color: var(--reach-white);
  margin-top: 0;
}

.reach-hero-title {
  max-width: 920px !important;
  margin-left: 0 !important;
  font-size: clamp(52px, 8vw, 104px) !important;
  line-height: .94 !important;
  letter-spacing: -.02em !important;
}

.reach-hero-copy, .reach-lead {
  max-width: 800px !important;
  margin-left: 0 !important;
  color: #E3E3E3;
  font-size: clamp(18px, 2vw, 22px);
}

.reach-kicker {
  color: var(--reach-red) !important;
  font-weight: 800;
  letter-spacing: .18em;
  font-size: 13px;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.reach-feature-event {
  background: linear-gradient(90deg, rgba(237,28,36,.12), transparent 55%), var(--reach-charcoal);
  border-bottom: 1px solid var(--reach-border);
}

.reach-grid, .reach-split, .reach-event-grid,
.reach-three-grid, .reach-two-grid {
  gap: clamp(24px, 4vw, 44px);
  align-items: stretch;
}

.reach-card, .reach-event-card, .reach-roster-card,
.reach-episode-card, .reach-contact-card, .reach-mini-panel {
  height: 100%;
  padding: clamp(24px, 3vw, 38px) !important;
  background: var(--reach-charcoal-2);
  border: 1px solid var(--reach-border);
  position: relative;
}

.reach-card::before, .reach-event-card::before,
.reach-roster-card::before, .reach-episode-card::before {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: 4px; height: 100%;
  background: var(--reach-red);
}

.reach-card:hover, .reach-event-card:hover,
.reach-roster-card:hover, .reach-episode-card:hover {
  border-color: rgba(237,28,36,.6);
  transform: translateY(-2px);
  transition: .2s ease;
}

.reach-event-card .reach-media-placeholder,
.reach-roster-card .reach-media-placeholder {
  margin: -38px -38px 30px;
}

.reach-media-placeholder {
  min-height: 260px;
  display: grid;
  place-items: center;
  padding: 30px;
  color: #D2D2D2;
  text-align: center;
  font-weight: 700;
  letter-spacing: .12em;
  font-size: 12px;
  background:
    linear-gradient(135deg, rgba(237,28,36,.18), transparent 45%),
    repeating-linear-gradient(45deg, #191919 0 12px, #151515 12px 24px);
  border: 1px dashed rgba(255,255,255,.25);
}

.reach-btn-primary .wp-block-button__link,
.reach-page .wp-block-button:not(.reach-btn-secondary) .wp-block-button__link {
  background: var(--reach-red);
  color: var(--reach-white);
  border: 1px solid var(--reach-red);
  border-radius: 2px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.reach-btn-primary .wp-block-button__link:hover,
.reach-page .wp-block-button:not(.reach-btn-secondary) .wp-block-button__link:hover {
  background: var(--reach-red-dark);
  border-color: var(--reach-red-dark);
  color: var(--reach-white);
}

.reach-btn-secondary .wp-block-button__link {
  background: transparent !important;
  color: var(--reach-white) !important;
  border: 1px solid rgba(255,255,255,.55) !important;
  border-radius: 2px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.reach-btn-secondary .wp-block-button__link:hover {
  border-color: var(--reach-red) !important;
  color: var(--reach-red) !important;
}

.reach-cta {
  text-align: center;
  background: linear-gradient(120deg, rgba(237,28,36,.20), rgba(237,28,36,.04)), #080808;
  border-top: 1px solid rgba(237,28,36,.35);
}

.reach-cta .wp-block-buttons { justify-content: center; }

.reach-admin-note {
  width: min(1180px, calc(100% - 40px));
  margin: 28px auto;
  padding: 18px 22px !important;
  border: 2px dashed #F0B429;
  background: #2A2107;
  color: #FFF;
}

.reach-roster-grid, .reach-episode-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 22px;
}

.reach-roster-card, .reach-episode-card { margin: 0 !important; }
.reach-episode-card { min-height: 180px; }

.reach-episode-card p:last-child {
  color: var(--reach-grey);
  font-size: 14px;
}

.reach-page a:not(.wp-block-button__link) { color: var(--reach-red); }
.reach-page a:not(.wp-block-button__link):hover { color: var(--reach-white); }

@media (max-width: 1024px) {
  .reach-roster-grid, .reach-episode-grid {
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
  .reach-hero { min-height: 600px; }
}

@media (max-width: 780px) {
  .reach-roster-grid, .reach-episode-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .reach-hero {
    min-height: 540px;
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .reach-event-card .reach-media-placeholder,
  .reach-roster-card .reach-media-placeholder {
    margin: -24px -24px 24px;
  }
}

@media (max-width: 520px) {
  .reach-roster-grid, .reach-episode-grid { grid-template-columns: 1fr; }
  .reach-page-hero { min-height: 340px; }
}



/* v1.1 editable media layout */
.reach-media-image { margin:0; overflow:hidden; background:#111; }
.reach-media-image img { width:100%; display:block; object-fit:cover; }
.reach-media-image--landscape img { aspect-ratio:16/10; }
.reach-media-image--portrait img,
.reach-media-image--poster img { aspect-ratio:4/5; }
.reach-media-image--wrestler img { aspect-ratio:3/4; object-position:50% 20%; }
.reach-media-image--square img { aspect-ratio:1/1; }
.reach-next-event { align-items:center; }
.reach-next-event > .wp-block-column:first-child { flex-basis:36%; }
.reach-next-event > .wp-block-column:last-child { flex-basis:64%; }
.reach-card > .reach-media-image { margin:-38px -38px 30px; width:calc(100% + 76px); max-width:none; }
.reach-roster-card > .reach-media-image { margin:-38px -38px 26px; width:calc(100% + 76px); max-width:none; }
.reach-episode-card > .reach-media-image { margin:-38px -38px 24px; width:calc(100% + 76px); max-width:none; }
.reach-page-hero.wp-block-cover,
.reach-hero.wp-block-cover { color:#fff; }
.reach-page-hero.wp-block-cover .wp-block-cover__inner-container,
.reach-hero.wp-block-cover .wp-block-cover__inner-container { width:min(1180px,100%); margin:0 auto; }
.reach-hero.wp-block-cover::before,
.reach-hero.wp-block-cover::after,
.reach-page-hero.wp-block-cover::after { pointer-events:none; }
@media(max-width:780px){
 .reach-card > .reach-media-image,.reach-roster-card > .reach-media-image,.reach-episode-card > .reach-media-image{margin:-24px -24px 22px;width:calc(100% + 48px)}
 .reach-next-event > .wp-block-column:first-child,.reach-next-event > .wp-block-column:last-child{flex-basis:100%}
}