/* ==========================================================================
   Rebuild pages — scoped polish for 17 static content pages.
   Loaded via functions.php only on those slugs so nothing else is affected.
   Brand palette: #25292c dark, var(--blue) cyan accent, #f9f4f4 off-white.
   ========================================================================== */


:root{
  --blue:     #063478;
}

.rebuild-page {
  margin: 0;
}

/* Override the theme's default <section> padding inside rebuild pages,
   then each block/hero/CTA controls its own vertical rhythm. */
.rebuild-page section {
  padding-top: 0;
  padding-bottom: 0;
}

/* --------------------------------------------------------------------------
   HERO STRIP
   -------------------------------------------------------------------------- */
.rebuild-page .rebuild-hero {
  background: #25292c;
  padding: 80px 20px 70px;
  text-align: center;
}

.rebuild-page .rebuild-hero h1 {
  color: #ffffff !important;
  font-size: 48px !important;
  line-height: 1.15 !important;
  margin: 0 auto 24px;
  max-width: 900px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 800 !important;
  /* Neutralize theme's 'section h1' outline rule */
  -webkit-text-stroke-width: 0 !important;
  -webkit-text-fill-color: #ffffff !important;
}

.rebuild-page .rebuild-hero__rule {
  display: block;
  width: 60px;
  height: 3px;
  background: var(--blue);
  margin: 0 auto 24px;
}

.rebuild-page .rebuild-hero__lead {
  color: #d3d3d3;
  font-size: 22px;
  line-height: 1.5;
  font-weight: 400;
  margin: 0 auto;
  max-width: 700px;
  letter-spacing: 0.5px;
}

/* --------------------------------------------------------------------------
   CONTENT BLOCKS — alternating white / off-white rhythm
   -------------------------------------------------------------------------- */
.rebuild-page .rebuild-block {
  padding: 60px 20px;
  background: #ffffff;
}

/* Zebra — every other block is off-white.
   Count starts at 2 because .rebuild-hero is the first <section>. */
.rebuild-page .rebuild-block:nth-of-type(odd) {
  background: #f9f4f4;
}

.rebuild-page .rebuild-block__inner {
  max-width: 760px;
  margin: 0 auto;
}

/* H2 override — beat theme's outlined 'section h2' rule.
   We use a higher-specificity selector and !important where needed. */
.rebuild-page .rebuild-block h2 {
  color: #25292c !important;
  -webkit-text-stroke-width: 0 !important;
  -webkit-text-fill-color: #25292c !important;
  font-family: "Helvetica Now Display", sans-serif !important;
  font-size: 30px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  text-align: left !important;
  letter-spacing: 1.5px;
  margin: 0 0 28px;
  padding-bottom: 14px;
  border-bottom: 3px solid var(--blue);
  display: inline-block;
}

.rebuild-page .rebuild-block h3 {
  font-family: "Helvetica Now Display", sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #25292c;
  margin: 32px 0 12px;
  letter-spacing: 0.5px;
  text-transform: none;
}

.rebuild-page .rebuild-block p {
  font-size: 18px;
  line-height: 1.7;
  color: #25292c;
  margin: 0 0 18px;
}

.rebuild-page .rebuild-block ul {
  font-size: 18px;
  line-height: 1.7;
  color: #25292c;
  padding-left: 22px;
  margin: 0 0 24px;
}

.rebuild-page .rebuild-block li {
  margin-bottom: 10px;
}

.rebuild-page .rebuild-block li strong {
  color: #25292c;
}

/* Inline links inside content blocks — theme's base 'a' rule in style.css is white + uppercase
   + 14px !important for hero/nav context; we override all of those inside rebuild blocks. */
.rebuild-page .rebuild-block a {
  color: #3568bc !important;
  text-decoration: underline !important;
  text-transform: none !important;
  font-size: inherit !important;
}

.rebuild-page .rebuild-block a:hover {
  color: var(--blue) !important;
}

/* FAQ list */
.rebuild-page .faq-item {
  padding: 20px 0;
  border-bottom: 1px solid #e5e5e5;
}

.rebuild-page .faq-item:last-child {
  border-bottom: 0;
}

.rebuild-page .faq-item h3 {
  margin: 0 0 8px;
  font-size: 20px;
}

.rebuild-page .faq-item p {
  margin: 0;
}

/* --------------------------------------------------------------------------
   CTA STRIP
   -------------------------------------------------------------------------- */
.rebuild-page .rebuild-cta {
  background: #25292c;
  padding: 60px 20px 70px;
  text-align: center;
}

.rebuild-page .rebuild-cta h3 {
  color: #ffffff;
  font-size: 32px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin: 0 0 14px;
}

.rebuild-page .rebuild-cta p {
  color: #d3d3d3;
  font-size: 18px;
  line-height: 1.5;
  max-width: 600px;
  margin: 0 auto 30px;
}

.rebuild-page .rebuild-cta .btn-primary {
  background: var(--blue) !important;
  color: #25292c !important;
  border: 1px solid var(--blue) !important;
  padding: 16px 36px !important;
  font-weight: 800 !important;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-block;
  font-size: 15px;
}

.rebuild-page .rebuild-cta .btn-primary:hover {
  background: #25292c !important;
  color: var(--blue) !important;
}

/* --------------------------------------------------------------------------
   RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width: 640px) {
  .rebuild-page .rebuild-hero { padding: 56px 20px 48px; }
  .rebuild-page .rebuild-hero h1 { font-size: 30px !important; line-height: 1.15 !important; }
  .rebuild-page .rebuild-hero__lead { font-size: 17px; }
  .rebuild-page .rebuild-block { padding: 44px 20px; }
  .rebuild-page .rebuild-block h2 { font-size: 22px !important; }
  .rebuild-page .rebuild-block h3 { font-size: 19px; }
  .rebuild-page .rebuild-block p,
  .rebuild-page .rebuild-block ul { font-size: 16px; }
  .rebuild-page .rebuild-cta { padding: 48px 20px; }
  .rebuild-page .rebuild-cta h3 { font-size: 24px; }
  .rebuild-page .rebuild-cta p { font-size: 16px; }
}

/* --------------------------------------------------------------------------
   WOMEN'S BJJ & SELF-DEFENSE — design-pass additions
   (mid-page CTA button + myth/reality list; scoped so other rebuild pages
   are unaffected)
   -------------------------------------------------------------------------- */

/* Inline CTA inside a content block. Must out-rank the .rebuild-block a rule,
   which forces blue underlined text-link styling with !important. */
.rebuild-page .rebuild-block__cta-wrap {
  margin-top: 34px;
  margin-bottom: 0;
  text-align: center;
}

.rebuild-page .rebuild-block a.rebuild-block__cta {
  display: inline-block;
  background: var(--blue) !important;
  color: #ffffff !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: 1px;
  padding: 15px 34px !important;
  border: 1px solid var(--blue);
  transition: background-color .15s ease, color .15s ease;
}

.rebuild-page .rebuild-block a.rebuild-block__cta:hover {
  background: #25292c !important;
  color: #ffffff !important;
}

/* Myth -> reality list */
.rebuild-page .rebuild-block ul.myth-reality {
  list-style: none;
  padding-left: 0;
  margin: 30px 0 0;
}

.rebuild-page .rebuild-block ul.myth-reality li {
  padding: 18px 0;
  margin: 0;
  border-bottom: 1px solid #e5e5e5;
}

.rebuild-page .rebuild-block ul.myth-reality li:first-child {
  border-top: 1px solid #e5e5e5;
}

.rebuild-page .myth-reality__myth,
.rebuild-page .myth-reality__reality {
  display: block;
}

.rebuild-page .myth-reality__myth {
  color: #8a8a8a;
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 6px;
}

.rebuild-page .myth-reality__myth::before {
  content: "\2715\00a0\00a0";
  color: #c0392b;
  font-weight: 700;
}

.rebuild-page .myth-reality__reality {
  color: #25292c;
  font-size: 18px;
  line-height: 1.6;
  font-weight: 600;
}

.rebuild-page .myth-reality__reality::before {
  content: "\2713\00a0\00a0";
  color: var(--blue);
  font-weight: 800;
}

@media (max-width: 640px) {
  .rebuild-page .rebuild-block a.rebuild-block__cta { padding: 13px 26px !important; font-size: 14px !important; }
  .rebuild-page .myth-reality__myth { font-size: 15px; }
  .rebuild-page .myth-reality__reality { font-size: 16px; }
}