/*
Theme Name: Tournament Gear - Liberty Cup
Theme URI: https://libertycup.usssa.com/
Description: Child theme for the Liberty Cup specialty site. Inherits from Tournament Gear parent theme with custom styling for the Liberty Cup homepage.
Author: RNC
Version: 1.0.0
Template: tournamentgear
Text Domain: tg-libertycup
*/

/* ==========================================================================
   Liberty Cup - Custom Styles
   ========================================================================== */

:root {
  --lc-navy: #1b2a4a;
  --lc-navy-dark: #141f38;
  --lc-red: #c8102e;
  --lc-red-dark: #a00d24;
  --lc-white: #ffffff;
  --lc-gray-light: #f5f5f5;
  --lc-gray: #666666;
  --lc-gold: #c9b037;
}

/* ----- Hero Overrides (featured_event_banner_cta Full Width) ----- */

.se-hero ._heading {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 800;
  font-size: 56px;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.se-hero ._subheading {
  font-style: italic;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
}

.se-hero ._subheading p {
  font-size: 15px;
  font-weight: 400;
  opacity: 0.9;
  max-width: 500px;
}

.se-hero ._buttons li a {
  display: inline-block;
  padding: 12px 28px;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.se-hero ._buttons li a._alt {
  background: var(--lc-red);
  color: var(--lc-white);
  border: 2px solid var(--lc-red);
}

.se-hero ._buttons li a._alt:hover {
  background: var(--lc-red-dark);
  border-color: var(--lc-red-dark);
}

/* Second button style (outline) - add class via ACF button or target nth-child */
.se-hero ._buttons li:nth-child(2) a {
  background: transparent;
  color: var(--lc-white);
  border: 2px solid var(--lc-white);
}

.se-hero ._buttons li:nth-child(2) a:hover {
  background: rgba(255, 255, 255, 0.15);
}

@media (max-width: 767px) {
  .se-hero ._heading {
    font-size: 36px;
  }

  .se-hero ._buttons {
    flex-direction: column;
    gap: 10px;
  }

  .se-hero ._buttons li a {
    display: block;
    text-align: center;
  }
}

/* ----- Program Components (content_block 3 Columns) ----- */

.content-block-module .content-heading {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.content-block-module .box-grid__col {
  text-align: center;
}

.content-block-module .box-grid__col h3,
.content-block-module .box-grid__col h4 {
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 8px;
}

/* ----- Content + Image sections ----- */

.section-ci .box-content h2,
.section-ci .box-content h3 {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* ----- What's Included (content_logo_block with dark bg) -----
   To activate: add a custom class 'lc-dark-section' via ACF or
   target by module ID in the page */

.lc-dark-section,
.section.lc-whats-included {
  background: var(--lc-navy);
  color: var(--lc-white);
  padding: 60px 0;
}

.lc-dark-section .about-us-side._text,
.section.lc-whats-included .about-us-side._text {
  color: var(--lc-white);
}

.lc-dark-section .about-us-side._text h2,
.lc-dark-section .about-us-side._text h3 {
  color: var(--lc-white);
}

.lc-dark-section .about-us-side._text ul li {
  color: var(--lc-white);
  position: relative;
  padding-left: 24px;
  margin-bottom: 8px;
}

.lc-dark-section .about-us-side._text ul li::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--lc-red);
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 8px;
}

.lc-dark-section .about-us-side._text .btn,
.lc-dark-section .about-us-side._text a.btn {
  background: var(--lc-red);
  color: var(--lc-white);
  border-color: var(--lc-red);
  margin-top: 16px;
}

/* ----- Awards Winners Prize (4_column_image_grid) ----- */

.section-team .box-heading {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 0.5px;
}

.section-team .box-item-box {
  background: var(--lc-white);
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  padding: 20px;
  text-align: center;
  transition: box-shadow 0.3s ease;
}

.section-team .box-item-box:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

/* ----- Learn How States Win (content_image reverse) ----- */

.section-ci-reverse .box-content h2,
.section-ci-reverse .box-content h3 {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.section-ci .box-content .btn,
.section-ci-reverse .box-content .btn {
  background: var(--lc-navy);
  color: var(--lc-white);
  border-color: var(--lc-navy);
  padding: 12px 28px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 0.5px;
  border-radius: 4px;
}

.section-ci .box-content .btn:hover,
.section-ci-reverse .box-content .btn:hover {
  background: var(--lc-navy-dark);
  border-color: var(--lc-navy-dark);
}

/* ----- Sponsored By (logos) ----- */

.section-partners .headline-title {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* ----- FAQ ----- */

.section-faq .box-heading {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.section-faq .box-item-question {
  font-weight: 600;
  font-size: 16px;
  cursor: pointer;
  padding: 16px 0;
  border-bottom: 1px solid #e0e0e0;
  position: relative;
  padding-right: 30px;
}

.section-faq .box-item-question::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border-right: 2px solid var(--lc-gray);
  border-bottom: 2px solid var(--lc-gray);
  transform: translateY(-50%) rotate(45deg);
  transition: transform 0.3s ease;
}

.section-faq .box-item.active .box-item-question::after {
  transform: translateY(-30%) rotate(-135deg);
}

/* ----- Bottom CTA Banner (contact_form or info_block) ----- */

.lc-cta-banner,
.section.lc-bottom-cta {
  background: var(--lc-red);
  color: var(--lc-white);
  padding: 60px 0;
  text-align: center;
}

.lc-cta-banner h2,
.lc-cta-banner h3,
.lc-cta-banner ._heading {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--lc-white);
  font-size: 36px;
  letter-spacing: 1px;
}

.lc-cta-banner p,
.lc-cta-banner ._subheading p {
  color: rgba(255, 255, 255, 0.9);
  max-width: 700px;
  margin: 12px auto 24px;
  font-size: 15px;
  line-height: 1.6;
}

.lc-cta-banner .btn,
.lc-cta-banner a.btn {
  background: var(--lc-white);
  color: var(--lc-red);
  border-color: var(--lc-white);
  padding: 12px 32px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 0.5px;
  border-radius: 4px;
}

.lc-cta-banner .btn:hover,
.lc-cta-banner a.btn:hover {
  background: rgba(255, 255, 255, 0.9);
}

@media (max-width: 767px) {
  .lc-cta-banner h2,
  .lc-cta-banner h3,
  .lc-cta-banner ._heading {
    font-size: 28px;
  }
}

/* ----- Section Headings Global ----- */

.headline-title._center {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* ----- Info Block (general use) ----- */

.section-info-block .info-block_title {
  font-family: "Oswald", "Arial Narrow", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}
