/*
Theme Name:   Hestia MTTC
Theme URI:    https://milwaukeettc.org
Description:  Milwaukee Table Tennis Club 2026 rebrand. Child theme for Hestia (Themeisle).
Author:       Donovan Green
Author URI:   https://corecreative.com
Template:     hestia
Version:      1.0.3
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  hestia-mttc
*/

/* =========================================================
   1. Brand tokens
   ========================================================= */
:root {
  --mttc-blue: #283891;
  --mttc-blue-dark: #1d2a6e;
  --mttc-blue-tint: #eef0fa;
  --mttc-red: #ed1c24;
  --mttc-red-dark: #c8141b;
  --mttc-red-tint: #fdeced;
  --mttc-ink: #1b1f3a;
  --mttc-text: #3b4056;
  --mttc-muted: #6a6f86;
  --mttc-line: #dfe3ee;
  --mttc-bg: #f6f7fb;
  --mttc-white: #ffffff;
  --mttc-radius: 12px;
  --mttc-shadow: 0 10px 30px rgba(27, 31, 58, 0.10);
  --mttc-nav-h: 84px;
  --mttc-head: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --mttc-body: "Nunito Sans", "Helvetica Neue", Arial, sans-serif;
  --mttc-max: 1120px;
}

/* =========================================================
   2. Hestia base overrides (type, colors, buttons, nav, layout)
   ========================================================= */
/* Bootstrap 3 (loaded by Hestia) sets html to 10px, which shrinks every rem value in this file to 62.5% of the
   design. Restore the normal 16px root so 1rem = 16px, as in the static preview. */
html { font-size: 16px !important; }
body {
  font-family: var(--mttc-body);
  color: var(--mttc-text);
  font-size: 17px;
  line-height: 1.6;
  background: var(--mttc-white);
}

h1, h2, h3, h4, h5, h6,
.hestia-title, .title, .card-title, .info-title, .footer-brand,
.footer-big h4, .footer-big h5, .media .media-heading {
  font-family: var(--mttc-head) !important;
  font-weight: 800;
  color: var(--mttc-blue);
  letter-spacing: -0.01em;
}

a { color: var(--mttc-red); }
a:hover, a:focus { color: var(--mttc-red-dark); }

/* Hestia buttons -> brand pills */
.btn.btn-primary,
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:active,
.btn.btn-primary:active:focus,
.btn.btn-danger, .btn.btn-danger:hover,
input[type="submit"].btn, button.btn,
.mc4wp-form input[type="submit"],
.wpcf7 input[type="submit"] {
  font-family: var(--mttc-head);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
  background-color: var(--mttc-red) !important;
  border-color: var(--mttc-red) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 12px 28px;
  box-shadow: 0 8px 20px rgba(237, 28, 36, 0.25) !important;
  transition: transform .15s ease, background-color .15s ease;
}
.btn.btn-primary:hover, .mc4wp-form input[type="submit"]:hover, .wpcf7 input[type="submit"]:hover {
  background-color: var(--mttc-red-dark) !important;
  transform: translateY(-1px);
}

/* Hide the old top bar completely (Facebook/Twitter strip) */
.hestia-top-bar { display: none !important; }
.navbar.header-with-topbar { top: 0 !important; }

/* Navigation */
.navbar,
.navbar.navbar-transparent,
.navbar.navbar-color-on-scroll,
.navbar.navbar-not-transparent {
  background-color: #fff !important;
  color: var(--mttc-blue) !important;
  box-shadow: 0 2px 14px rgba(27, 31, 58, 0.10) !important;
  border-bottom: 4px solid var(--mttc-red);
}
.navbar.navbar-transparent > .container { padding-top: 0; }
.navbar > .container { display: flex; align-items: center; min-height: var(--mttc-nav-h); padding-top: 0 !important; padding-bottom: 0 !important; }
.navbar.navbar-fixed-top { margin-bottom: 0 !important; }
.navbar .navbar-header { display: flex; align-items: center; }
/* Hestia hides the logo wrapper once the transparent front-page bar becomes solid on scroll; keep it. */
.navbar .navbar-header .title-logo-wrapper { display: block !important; }
.navbar .navbar-header .navbar-brand { padding: 8px 15px; }
.navbar .navbar-header .navbar-brand img { max-height: 58px !important; width: auto; transition: max-height .2s ease; }
.navbar.navbar-scroll-point .navbar-header .navbar-brand img { max-height: 46px !important; }

.navbar .navbar-nav > li > a,
.navbar .navbar-nav > li > a:hover,
.navbar .navbar-nav > li > a:focus {
  font-family: var(--mttc-head);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mttc-blue) !important;
  padding: 12px 14px;
  position: relative;
}
.navbar .navbar-nav > li > a::after {
  content: "";
  position: absolute;
  left: 14px; right: 14px; bottom: 6px;
  height: 3px;
  background: var(--mttc-red);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .18s ease;
}
.navbar .navbar-nav > li > a:hover::after,
.navbar .navbar-nav > li.active > a::after,
.navbar .navbar-nav > li.current-menu-item > a::after { transform: scaleX(1); }
.navbar .navbar-nav > .active:not(.btn) > a { background: transparent !important; }

/* Header widget area: "Support the Club" button, hide search */
.navbar .header-widgets-wrapper .widget_search { display: none; }
.navbar .header-sidebar-wrapper { order: 3; margin-left: auto; }
.navbar .header-widgets-wrapper .widget { margin: 0; padding: 0; }
.btn-donate, a.btn-donate, .navbar a.btn-donate {
  display: inline-block;
  font-family: var(--mttc-head);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff !important;
  background: var(--mttc-red) !important;
  border-radius: 999px !important;
  padding: 11px 22px !important;
  margin: 0 0 0 10px !important;
  box-shadow: 0 8px 20px rgba(237, 28, 36, 0.28);
}
.btn-donate:hover { background: var(--mttc-red-dark) !important; color: #fff !important; }
.navbar .navbar-toggle .icon-bar { background-color: var(--mttc-blue) !important; }

/* Desktop (992px and up): one row - logo left, menu right, Support button after the menu */
@media (min-width: 992px) {
  .navbar > .container { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center; justify-content: flex-start; }
  .navbar .navbar-header { order: 1; flex: 0 0 auto !important; width: auto !important; float: none !important; margin: 0 !important; display: flex; align-items: center; }
  .navbar .navbar-collapse { order: 2; flex: 1 1 0% !important; min-width: 0 !important; width: auto !important; display: flex !important; justify-content: flex-end; align-items: center; float: none !important; padding: 0 !important; margin: 0 !important; height: auto !important; }
  .navbar .navbar-collapse .navbar-nav { float: none !important; display: flex; align-items: center; flex-wrap: nowrap; margin: 0 !important; width: auto !important; min-width: 0 !important; }
  .navbar .header-sidebar-wrapper { order: 3; flex: 0 0 auto !important; width: auto !important; margin: 0 0 0 6px !important; padding: 0 !important; float: none !important; display: block !important; }
  .navbar .navbar-nav > li.mttc-mobile-support { display: none !important; }
  .navbar .navbar-toggle-wrapper, .navbar .navbar-toggle { display: none !important; }
}
/* Small desktop (992-1199px): tighten so everything stays on one row */
@media (min-width: 992px) and (max-width: 1199px) {
  .navbar .navbar-header .navbar-brand { padding: 8px 10px 8px 0; }
  .navbar .navbar-header .navbar-brand img { max-height: 50px !important; }
  .navbar .navbar-nav > li > a { font-size: 13px; padding: 12px 9px; letter-spacing: .04em; }
  .navbar .navbar-nav > li > a::after { left: 9px; right: 9px; }
  .btn-donate, a.btn-donate, .navbar a.btn-donate { font-size: 12px; padding: 10px 16px !important; margin-left: 4px !important; }
}
/* Tablet (768-991px): logo + Support button on the first row, menu centred on a second row */
@media (min-width: 768px) and (max-width: 991px) {
  :root { --mttc-nav-h: 72px; }
  .navbar > .container { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center; min-height: 0; padding-top: 4px; }
  .navbar .navbar-header { order: 1; flex: 1 1 auto !important; width: auto !important; float: none !important; margin: 0 !important; display: flex; align-items: center; min-height: 64px; }
  .navbar .navbar-header .navbar-brand { padding: 6px 15px 6px 0; }
  .navbar .navbar-header .navbar-brand img { max-height: 48px !important; }
  .navbar .header-sidebar-wrapper { order: 2; flex: 0 0 auto !important; width: auto !important; margin: 0 0 0 auto !important; padding: 0 !important; float: none !important; display: block !important; }
  .btn-donate, a.btn-donate, .navbar a.btn-donate { font-size: 12px; padding: 10px 18px !important; margin: 0 !important; }
  .navbar .navbar-collapse { order: 3; flex: 0 0 100% !important; width: 100% !important; display: flex !important; justify-content: center; float: none !important; padding: 0 0 4px !important; margin: 0 !important; height: auto !important; border-top: 1px solid var(--mttc-line); }
  .navbar .navbar-collapse .navbar-nav { float: none !important; display: flex; flex-wrap: wrap; justify-content: center; margin: 0 !important; width: auto !important; min-width: 0 !important; }
  .navbar .navbar-nav > li > a { font-size: 13px; padding: 10px 12px; }
  .navbar .navbar-nav > li > a::after { left: 12px; right: 12px; bottom: 3px; }
  .navbar .navbar-nav > li.mttc-mobile-support { display: none !important; }
  .navbar .navbar-toggle-wrapper, .navbar .navbar-toggle { display: none !important; }
}
/* Phone (under 768px): Hestia's hamburger menu, restyled */
@media (max-width: 767px) {
  :root { --mttc-nav-h: 72px; }
  .navbar > .container { min-height: var(--mttc-nav-h); }
  .navbar .navbar-header .navbar-brand img { max-height: 44px !important; }
  .navbar .header-sidebar-wrapper { display: none; }
  /* Drop-down panel sits directly under the bar (works with or without the WP admin bar), never over the X */
  .navbar.navbar-fixed-top .navbar-collapse { position: absolute !important; top: calc(100% + 4px) !important; left: 0; right: 0; width: 100%; margin: 0 !important; max-height: calc(100vh - 130px) !important; overflow-y: auto; background: #fff !important; box-shadow: 0 14px 28px rgba(27,31,58,.16); }
  /* Logged-in admins: keep the bar below the 46px WordPress toolbar */
  body.admin-bar .navbar.navbar-fixed-top { top: 46px; }
  .navbar .navbar-toggle { position: relative; z-index: 2; }
  .navbar .navbar-collapse .navbar-nav { padding: 6px 0 12px; margin: 0; }
  .navbar .navbar-nav > li > a { font-size: 16px; padding: 14px 20px; }
  .navbar .navbar-nav > li > a::after { display: none; }
  /* Mobile-only support button appended by mttc.js */
  .navbar .navbar-nav > li.mttc-mobile-support > a { color: #fff !important; background: var(--mttc-red) !important; margin: 10px 20px; border-radius: 999px; text-align: center; }
}

/* Full-width page builder template: remove Hestia's raised card and add nav offset */
.page-template-template-pagebuilder-full-width .main,
.page-template-template-pagebuilder-blank .main {
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff;
  /* Exactly the fixed bar's height (mttc.js measures it; the calc is the no-JS fallback). Hestia's own inline
     padding on .pagebuilder-section is zeroed below, otherwise the offset is applied twice and a white gap appears. */
  padding-top: var(--mttc-nav-total, calc(var(--mttc-nav-h) + 4px));
}
.page-template-template-pagebuilder-full-width .pagebuilder-section,
.page-template-template-pagebuilder-blank .pagebuilder-section { padding: 0 !important; }
.page-template-template-pagebuilder-full-width .page-header { display: none; }

/* Default-template pages, blog, archives: restyle Hestia's header + card */
.page-header.header-small { min-height: 320px; }
.page-header .header-filter::before { background: linear-gradient(135deg, rgba(40,56,145,.92), rgba(29,42,110,.86)) !important; }
.page-header .hestia-title, .page-header .hestia-title a { color: #fff !important; font-weight: 900; }
.main-raised { border-radius: var(--mttc-radius) var(--mttc-radius) 0 0; box-shadow: var(--mttc-shadow) !important; }
.card, .card-blog { border-radius: var(--mttc-radius); box-shadow: var(--mttc-shadow) !important; }
.card-blog .card-title a { color: var(--mttc-blue) !important; }
.card-blog .card-title a:hover { color: var(--mttc-red) !important; }
.card-blog .category a, .blog-post .category a, .label.label-primary { color: var(--mttc-red) !important; }
.moretag, .more-link, .card-blog a.moretag { color: var(--mttc-red) !important; font-family: var(--mttc-head); font-weight: 700; }
.card-blog .card-description, .blog-post .card-description, .single-post .card-description, .section-text p, .single-post .entry-content p { font-size: 1.05rem !important; line-height: 1.65; color: var(--mttc-text) !important; }
.card-blog .category a, .blog-post .category a { font-size: .84rem !important; letter-spacing: .1em; font-family: var(--mttc-head); font-weight: 700; }
.card-blog .author, .blog-post .author { font-size: .95rem; color: var(--mttc-muted); }
.blog-sidebar-wrapper .widget h5 { color: var(--mttc-blue); }
.pagination > li > a, .pagination > li > span { color: var(--mttc-blue); }
.pagination > .active > a, .pagination > .active > span { background: var(--mttc-red) !important; border-color: var(--mttc-red) !important; }

/* =========================================================
   3. Layout primitives
   ========================================================= */
.mttc-container { max-width: var(--mttc-max); margin: 0 auto; padding: 0 20px; }
.mttc-container--narrow { max-width: 860px; }
.mttc-section { padding: 56px 0; }
.mttc-section--tight { padding: 36px 0; }
.mttc-section--tint { background: var(--mttc-bg); }
.mttc-section__title {
  font-family: var(--mttc-head);
  font-weight: 900;
  font-size: clamp(1.65rem, 3vw, 2.4rem);
  line-height: 1.15;
  color: var(--mttc-red);
  text-align: center;
  margin: 0 0 28px;
}
.mttc-section__title--blue { color: var(--mttc-blue); }
.mttc-section__lead { text-align: center; max-width: 720px; margin: -12px auto 32px; color: var(--mttc-muted); font-size: 1.05rem; }
.mttc-rule { border: 0; height: 3px; background: var(--mttc-red); width: min(var(--mttc-max), calc(100% - 40px)); margin: 0 auto; }
.mttc-rule--blue { background: var(--mttc-blue); }
.mttc-center { text-align: center; }
.mttc-grid { display: grid; gap: 28px; }
.mttc-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mttc-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mttc-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 991px) { .mttc-grid--3, .mttc-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .mttc-grid--2, .mttc-grid--3, .mttc-grid--4 { grid-template-columns: 1fr; } }

.mttc-eyebrow {
  display: inline-block;
  font-family: var(--mttc-head);
  font-weight: 700;
  font-size: 0.84rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mttc-red);
  margin-bottom: 8px;
}
.mttc-prose p { margin: 0 0 1em; }
.mttc-prose ul { padding-left: 1.2em; margin: 0 0 1em; }
.mttc-prose li { margin-bottom: .35em; }
.mttc-prose h3 { font-size: 1.35rem; margin: 1.6em 0 .5em; }
.mttc-prose a { font-weight: 700; text-decoration: underline; text-decoration-color: rgba(237,28,36,.35); text-underline-offset: 3px; }

/* Buttons */
.mttc-btn {
  display: inline-block;
  font-family: var(--mttc-head);
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff !important;
  background: var(--mttc-red);
  border: 2px solid var(--mttc-red);
  border-radius: 999px;
  padding: 13px 30px;
  text-decoration: none !important;
  box-shadow: 0 8px 20px rgba(237, 28, 36, 0.25);
  transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.mttc-btn:hover, .mttc-btn:focus { background: var(--mttc-red-dark); border-color: var(--mttc-red-dark); transform: translateY(-2px); color: #fff; }
.mttc-btn--blue { background: var(--mttc-blue); border-color: var(--mttc-blue); box-shadow: 0 8px 20px rgba(40, 56, 145, 0.25); }
.mttc-btn--blue:hover, .mttc-btn--blue:focus { background: var(--mttc-blue-dark); border-color: var(--mttc-blue-dark); }
.mttc-btn--outline { background: transparent; color: var(--mttc-blue) !important; border-color: var(--mttc-blue); box-shadow: none; }
.mttc-btn--outline:hover { background: var(--mttc-blue); color: #fff !important; }
.mttc-btn--white { background: #fff; color: var(--mttc-blue) !important; border-color: #fff; box-shadow: 0 8px 20px rgba(0,0,0,.18); }
.mttc-btn--white:hover { background: var(--mttc-blue-tint); border-color: var(--mttc-blue-tint); }
.mttc-btn--sm { padding: 10px 22px; font-size: 0.88rem; }
.mttc-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 24px; }

/* =========================================================
   4. Home: hero + tagline
   ========================================================= */
.mttc-hero {
  position: relative;
  min-height: clamp(380px, 52vw, 720px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mttc-blue-dark) url("assets/img/mttc-hero.jpg") center 40% / cover no-repeat;
  overflow: hidden;
}
.mttc-hero::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(29,42,110,.15) 0%, rgba(29,42,110,0) 40%, rgba(29,42,110,.35) 100%);
}
.mttc-hero__logo {
  position: relative;
  z-index: 1;
  width: min(960px, 90vw);
  height: auto;
  filter: drop-shadow(0 18px 30px rgba(0,0,0,.30));
}
.mttc-hero__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (max-width: 640px) {
  .mttc-hero { background-image: url("assets/img/mttc-hero-mobile.jpg"); min-height: 320px; }
  .mttc-hero__logo { width: 94vw; }
}

.mttc-tagline {
  font-family: var(--mttc-head);
  font-weight: 800;
  font-size: clamp(1.25rem, 2.5vw, 2rem);
  line-height: 1.25;
  color: var(--mttc-blue);
  text-align: center;
  margin: 0;
  padding: 44px 20px 32px;
}

/* =========================================================
   5. Home: Open Play + calendar
   ========================================================= */
.mttc-openplay { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: start; }
.mttc-calendar {
  background: #fff;
  border: 1px solid var(--mttc-line);
  border-top: 5px solid var(--mttc-red);
  border-radius: var(--mttc-radius);
  box-shadow: var(--mttc-shadow);
  overflow: hidden;
}
.mttc-calendar iframe { display: block; width: 100%; height: 320px; border: 0; }
.mttc-calendar__foot { padding: 12px 16px; border-top: 1px solid var(--mttc-line); font-size: .95rem; display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.mttc-calendar__foot a { font-weight: 700; }
.mttc-openplay__text p { margin: 0 0 1em; }
.mttc-openplay__text strong { color: var(--mttc-blue); }
@media (max-width: 900px) { .mttc-openplay { grid-template-columns: 1fr; } }

/* =========================================================
   6. Pricing cards (Membership / Day Pass)
   ========================================================= */
.mttc-price-card {
  border: 4px solid var(--mttc-blue);
  border-radius: 8px;
  background: #fff;
  max-width: 920px;
  margin: 0 auto 28px;
  overflow: hidden;
}
.mttc-price-card--red { border-color: var(--mttc-red); max-width: 640px; }
.mttc-price-card__head {
  background: var(--mttc-blue);
  color: #fff;
  font-family: var(--mttc-head);
  font-weight: 900;
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  text-align: center;
  padding: 14px 20px;
  margin: 0;
}
.mttc-price-card--red .mttc-price-card__head { background: var(--mttc-red); }
.mttc-price-card__body { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding: 32px 28px; align-items: start; }
.mttc-price-card--red .mttc-price-card__body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mttc-price { text-align: center; color: var(--mttc-blue); }
.mttc-price-card--red .mttc-price { color: var(--mttc-red); }
.mttc-price__label { font-family: var(--mttc-head); font-weight: 500; font-size: clamp(1.1rem, 1.8vw, 1.45rem); letter-spacing: 0.04em; text-transform: uppercase; line-height: 1.1; }
.mttc-price__amount { font-family: var(--mttc-head); font-weight: 900; font-size: clamp(1.6rem, 2.6vw, 2.1rem); line-height: 1.1; margin-top: 6px; }
.mttc-price__amount small { font-size: 0.55em; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; vertical-align: baseline; }
.mttc-price__note { font-size: .92rem; margin-top: 6px; color: var(--mttc-blue); opacity: .9; }
.mttc-price-card--red .mttc-price__note { color: var(--mttc-red); }
.mttc-benefits { color: var(--mttc-blue); }
.mttc-benefits__title { font-family: var(--mttc-head); font-weight: 500; font-size: clamp(1.1rem, 1.8vw, 1.45rem); letter-spacing: .04em; text-transform: uppercase; line-height: 1.1; margin: 0 0 10px; text-align: center; }
.mttc-benefits ul { list-style: none; padding: 0; margin: 0; font-size: .98rem; line-height: 1.45; }
.mttc-benefits li { padding-left: 14px; position: relative; margin-bottom: 6px; }
.mttc-benefits li::before { content: ""; position: absolute; left: 0; top: .5em; width: 6px; height: 6px; border-radius: 50%; background: var(--mttc-red); }
.mttc-price-card__foot { text-align: center; padding: 0 28px 28px; }
@media (max-width: 760px) {
  .mttc-price-card__body, .mttc-price-card--red .mttc-price-card__body { grid-template-columns: 1fr; gap: 28px; padding: 26px 20px; }
  .mttc-benefits ul { display: inline-block; text-align: left; }
}

/* =========================================================
   7. Location cards
   ========================================================= */
.mttc-locations { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; max-width: 900px; margin: 0 auto; }
.mttc-location {
  border: 4px solid var(--mttc-blue);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-align: center;
}
.mttc-location__title {
  font-family: var(--mttc-head);
  font-weight: 900;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--mttc-red);
  margin: 0;
  padding: 16px 12px 12px;
}
.mttc-location--blue .mttc-location__title { color: var(--mttc-blue); }
.mttc-location__img { display: block; width: 100%; height: auto; }
.mttc-location__body { padding: 22px 22px 8px; }
.mttc-location__name { font-family: var(--mttc-head); font-weight: 800; color: var(--mttc-blue); font-size: 1.1rem; margin: 0 0 2px; }
.mttc-location__addr { color: var(--mttc-blue); font-size: 1rem; margin: 0 0 4px; }
.mttc-location__note { color: var(--mttc-red); font-size: .95rem; margin: 0 0 18px; }
.mttc-hours { list-style: none; padding: 18px 16px 28px; margin: 0; display: grid; gap: 18px; }
.mttc-hours__day { display: block; font-family: var(--mttc-head); font-weight: 600; font-size: clamp(1.15rem, 1.8vw, 1.5rem); letter-spacing: .05em; text-transform: uppercase; color: var(--mttc-red); line-height: 1.1; }
.mttc-hours__time { display: block; font-family: var(--mttc-head); font-weight: 500; font-size: clamp(1rem, 1.5vw, 1.25rem); letter-spacing: .04em; color: var(--mttc-red); margin-top: 4px; }
.mttc-location--blue .mttc-hours__day, .mttc-location--blue .mttc-hours__time { color: var(--mttc-blue); }
@media (max-width: 700px) { .mttc-locations { grid-template-columns: 1fr; max-width: 480px; } }

/* =========================================================
   8. CTA band, page header, people, tiers, misc
   ========================================================= */
.mttc-band {
  background: var(--mttc-blue) url("assets/img/mttc-mke-mark.png") right -60px center / 380px auto no-repeat;
  color: #fff;
  padding: 56px 0;
  position: relative;
  overflow: hidden;
}
.mttc-band::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--mttc-blue) 55%, rgba(40,56,145,.88)); }
.mttc-band > * { position: relative; }
.mttc-band__title { color: #fff; font-family: var(--mttc-head); font-weight: 900; font-size: clamp(1.5rem, 2.8vw, 2.2rem); margin: 0 0 10px; }
.mttc-band p { color: rgba(255,255,255,.88); max-width: 620px; margin: 0 0 22px; font-size: 1.05rem; }
.mttc-band .mttc-actions { justify-content: flex-start; margin-top: 0; }
.mttc-band--red { background-color: var(--mttc-red); }
.mttc-band--red::before { background: linear-gradient(90deg, var(--mttc-red) 55%, rgba(237,28,36,.9)); }
.mttc-band--red .mttc-btn--white { color: var(--mttc-red) !important; }
.mttc-band--center { text-align: center; }
.mttc-band--center p { margin-left: auto; margin-right: auto; }
.mttc-band--center .mttc-actions { justify-content: center; }

.mttc-page-header {
  background: var(--mttc-blue);
  color: #fff;
  padding: 64px 0 56px;
  position: relative;
  overflow: hidden;
}
.mttc-page-header::after {
  content: "";
  position: absolute; right: -40px; top: -40px; bottom: -40px; width: 420px;
  background: url("assets/img/mttc-mke-mark.png") center / contain no-repeat;
  opacity: .08;
  filter: brightness(0) invert(1);
}
.mttc-page-header .mttc-eyebrow { color: #ffb3b6; }
.mttc-page-header__title { color: #fff; font-family: var(--mttc-head); font-weight: 900; font-size: clamp(2rem, 4.2vw, 3.2rem); line-height: 1.05; margin: 0 0 12px; }
.mttc-page-header__lead { color: rgba(255,255,255,.88); font-size: 1.15rem; max-width: 680px; margin: 0; }
.mttc-page-header .mttc-container { position: relative; z-index: 1; }

/* People (coaches, board) */
.mttc-coach {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
  background: #fff;
  border: 1px solid var(--mttc-line);
  border-left: 6px solid var(--mttc-blue);
  border-radius: var(--mttc-radius);
  box-shadow: var(--mttc-shadow);
  padding: 28px;
  margin-bottom: 24px;
}
.mttc-coach:nth-of-type(even) { border-left-color: var(--mttc-red); }
.mttc-coach__img { width: 200px; height: 200px; object-fit: cover; object-position: center top; border-radius: 10px; background: var(--mttc-bg); }
.mttc-coach__name { font-family: var(--mttc-head); font-weight: 800; font-size: 1.5rem; color: var(--mttc-blue); margin: 0 0 4px; }
.mttc-coach__cert { font-family: var(--mttc-head); font-weight: 700; font-size: .86rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mttc-red); margin: 0 0 12px; }
.mttc-coach__bio p { margin: 0 0 .8em; }
.mttc-coach__actions { margin-top: 14px; }
@media (max-width: 640px) {
  .mttc-coach { grid-template-columns: 1fr; padding: 20px; }
  .mttc-coach__img { width: 140px; height: 140px; }
}

.mttc-person { background: #fff; border: 1px solid var(--mttc-line); border-radius: var(--mttc-radius); box-shadow: var(--mttc-shadow); overflow: hidden; display: flex; flex-direction: column; }
.mttc-person__img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; object-position: center top; background: var(--mttc-bg); }
.mttc-person__body { padding: 18px 18px 22px; }
.mttc-person__name { font-family: var(--mttc-head); font-weight: 800; font-size: 1.15rem; color: var(--mttc-blue); margin: 0 0 2px; }
.mttc-person__role { font-family: var(--mttc-head); font-weight: 700; font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; color: var(--mttc-red); margin: 0 0 10px; }
.mttc-person__bio { font-size: 1rem; color: var(--mttc-text); margin: 0; }

/* Sponsorship tiers */
.mttc-tier { background: #fff; border: 1px solid var(--mttc-line); border-radius: var(--mttc-radius); box-shadow: var(--mttc-shadow); overflow: hidden; display: flex; flex-direction: column; }
.mttc-tier__head { padding: 18px 20px 16px; text-align: center; color: #fff; background: var(--mttc-blue); }
.mttc-tier__name { display: block; font-family: var(--mttc-head); font-weight: 900; font-size: 1.1rem; letter-spacing: .08em; text-transform: uppercase; }
.mttc-tier__price { display: block; font-family: var(--mttc-head); font-weight: 900; font-size: 2rem; line-height: 1.1; margin-top: 4px; }
.mttc-tier--platinum .mttc-tier__head { background: linear-gradient(135deg, #3a4a9f, var(--mttc-blue-dark)); }
.mttc-tier--gold .mttc-tier__head { background: linear-gradient(135deg, #f3b73a, #d9931a); }
.mttc-tier--silver .mttc-tier__head { background: linear-gradient(135deg, #9aa1b3, #6f778c); }
.mttc-tier--bronze .mttc-tier__head { background: linear-gradient(135deg, #d0894a, #a8612b); }
.mttc-tier ul { list-style: none; margin: 0; padding: 20px 22px 24px; font-size: 1rem; flex: 1; }
.mttc-tier li { position: relative; padding-left: 22px; margin-bottom: 10px; }
.mttc-tier li::before { content: ""; position: absolute; left: 0; top: .45em; width: 12px; height: 12px; border-radius: 50%; background: var(--mttc-red); box-shadow: inset 0 0 0 3px #fff, 0 0 0 1px var(--mttc-red); }

/* Sponsor lists (About) */
.mttc-sponsors { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 20px; }
.mttc-sponsors__group { background: #fff; border: 1px solid var(--mttc-line); border-radius: var(--mttc-radius); padding: 20px; }
.mttc-sponsors__level { font-family: var(--mttc-head); font-weight: 800; font-size: .85rem; letter-spacing: .1em; text-transform: uppercase; color: var(--mttc-red); margin: 0 0 10px; }
.mttc-sponsors__group ul { list-style: none; margin: 0; padding: 0; }
.mttc-sponsors__group li { padding: 6px 0; border-bottom: 1px dashed var(--mttc-line); font-weight: 600; color: var(--mttc-blue); }
.mttc-sponsors__group li:last-child { border-bottom: 0; }
.mttc-sponsors__group img { max-height: 44px; width: auto; }
@media (max-width: 991px) { .mttc-sponsors { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px) { .mttc-sponsors { grid-template-columns: 1fr; } }

/* Mission quote */
.mttc-quote {
  border-left: 6px solid var(--mttc-red);
  background: var(--mttc-blue-tint);
  border-radius: 0 var(--mttc-radius) var(--mttc-radius) 0;
  padding: 24px 28px;
  margin: 24px 0;
  font-family: var(--mttc-head);
  font-weight: 600;
  font-size: 1.1rem;
  line-height: 1.5;
  color: var(--mttc-blue);
}
.mttc-quote p { margin: 0; }

/* Split intro with MKE mark */
.mttc-split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 40px; align-items: center; }
.mttc-split__mark { width: 100%; max-width: 320px; margin: 0 auto; display: block; }
@media (max-width: 800px) { .mttc-split { grid-template-columns: 1fr; } .mttc-split__mark { max-width: 220px; } }

/* Info cards (contact page, pro shop) */
.mttc-info { background: #fff; border: 1px solid var(--mttc-line); border-top: 5px solid var(--mttc-blue); border-radius: var(--mttc-radius); box-shadow: var(--mttc-shadow); padding: 24px; }
.mttc-info--red { border-top-color: var(--mttc-red); }
.mttc-info__title { font-family: var(--mttc-head); font-weight: 800; font-size: 1.15rem; color: var(--mttc-blue); margin: 0 0 10px; }
.mttc-info p { margin: 0 0 .6em; }
.mttc-info a { font-weight: 700; }
.mttc-info__list { list-style: none; padding: 0; margin: 0; }
.mttc-info__list li { padding: 8px 0; border-bottom: 1px dashed var(--mttc-line); }
.mttc-info__list li:last-child { border-bottom: 0; }

.mttc-shop-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; margin: 28px 0; }
.mttc-shop-grid img { width: 100%; aspect-ratio: 1/1; object-fit: contain; background: #fff; border: 1px solid var(--mttc-line); border-radius: var(--mttc-radius); padding: 16px; }
@media (max-width: 600px) { .mttc-shop-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; } .mttc-shop-grid img { padding: 8px; } }

.mttc-links { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.mttc-links li { background: #fff; border: 1px solid var(--mttc-line); border-radius: 10px; padding: 14px 16px; }
.mttc-links li a { font-family: var(--mttc-head); font-weight: 700; color: var(--mttc-blue); text-decoration: none; }
.mttc-links li a:hover { color: var(--mttc-red); }
.mttc-links li span { display: block; font-size: .95rem; color: var(--mttc-muted); margin-top: 2px; }
@media (max-width: 600px) { .mttc-links { grid-template-columns: 1fr; } }

/* Contact Form 7 */
.wpcf7 label { font-family: var(--mttc-head); font-weight: 700; font-size: .85rem; color: var(--mttc-blue); letter-spacing: .04em; text-transform: uppercase; display: block; margin-bottom: 14px; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea,
.mttc-form input[type="text"], .mttc-form input[type="email"], .mttc-form input[type="tel"], .mttc-form textarea {
  display: block; width: 100%; margin-top: 6px; padding: 12px 14px;
  border: 2px solid var(--mttc-line); border-radius: 10px; font-family: var(--mttc-body); font-size: 1rem; color: var(--mttc-ink); background: #fff;
}
.wpcf7 input:focus, .wpcf7 textarea:focus, .mttc-form input:focus, .mttc-form textarea:focus { outline: none; border-color: var(--mttc-blue); box-shadow: 0 0 0 3px rgba(40,56,145,.15); }

/* =========================================================
   9. Footer (rendered by functions.php)
   ========================================================= */
footer.footer.mttc-footer, .mttc-footer { background: var(--mttc-blue-dark) !important; color: rgba(255,255,255,.88); font-size: 1rem; }
.mttc-footer a { color: #fff; }
.mttc-footer a:hover { color: #ffb3b6; }
.mttc-footer__top { padding: 56px 0 40px; }
.mttc-footer__grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1.3fr; gap: 36px; }
.mttc-footer__badge { width: 130px; height: auto; display: block; margin-bottom: 16px; }
.mttc-footer__mission { font-size: 1rem; line-height: 1.55; margin: 0; }
.mttc-footer h5, .mttc-footer .mttc-footer__title {
  font-family: var(--mttc-head) !important; font-weight: 800; font-size: .85rem; letter-spacing: .12em; text-transform: uppercase; color: #fff !important; margin: 0 0 14px;
}
.mttc-footer h5::after, .mttc-footer .mttc-footer__title::after { content: ""; display: block; width: 32px; height: 3px; background: var(--mttc-red); margin-top: 8px; border-radius: 2px; }
.mttc-footer p { margin: 0 0 10px; }
.mttc-footer strong { color: #fff; }
.mttc-footer__list { list-style: none; margin: 0; padding: 0; }
.mttc-footer__list li { margin-bottom: 8px; }
.mttc-footer__social { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mttc-head); font-weight: 700; text-decoration: none; margin-top: 6px; }
.mttc-footer__social svg { width: 22px; height: 22px; fill: currentColor; }
.mttc-footer .mc4wp-form label, .mttc-footer .mttc-form label { display: block; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; font-family: var(--mttc-head); font-weight: 700; color: rgba(255,255,255,.8); margin: 0 0 4px; }
.mttc-footer .mc4wp-form p, .mttc-footer .mttc-form p { margin: 0 0 10px; }
.mttc-footer .mc4wp-form input[type="text"], .mttc-footer .mc4wp-form input[type="tel"], .mttc-footer .mc4wp-form input[type="email"],
.mttc-footer .mttc-form input[type="text"], .mttc-footer .mttc-form input[type="tel"], .mttc-footer .mttc-form input[type="email"] {
  width: 100%; padding: 10px 12px; border-radius: 8px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: #fff; font-family: var(--mttc-body); font-size: .95rem;
}
.mttc-footer .mc4wp-form input::placeholder, .mttc-footer .mttc-form input::placeholder { color: rgba(255,255,255,.5); }
.mttc-footer .newsletter-signup { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; }
.mttc-footer .newsletter-signup__email { min-width: 0; }
.mttc-footer .newsletter-signup__button input, .mttc-footer .mttc-form input[type="submit"] { white-space: nowrap; padding: 11px 20px; }
.mttc-footer .mc4wp-response { margin-top: 10px; font-size: .9rem; }
.mttc-footer__bottom { border-top: 1px solid rgba(255,255,255,.12); padding: 20px 0; }
.mttc-footer__bottom .mttc-container { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; font-size: .92rem; }
.mttc-footer__menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 22px; }
.mttc-footer__menu a { font-family: var(--mttc-head); font-weight: 700; font-size: .86rem; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; }
.mttc-footer__copy { margin: 0; color: rgba(255,255,255,.6); }
@media (max-width: 991px) { .mttc-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .mttc-footer__grid { grid-template-columns: 1fr; } .mttc-footer .newsletter-signup { grid-template-columns: 1fr; } }

/* Code & Conduct */
.mttc-conduct { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.mttc-conduct__item { background: #fff; border: 1px solid var(--mttc-line); border-top: 5px solid var(--mttc-red); border-radius: var(--mttc-radius); padding: 20px 18px 22px; }
.mttc-conduct__item:nth-child(even) { border-top-color: var(--mttc-blue); }
.mttc-conduct__title { font-family: var(--mttc-head); font-weight: 900; font-size: 1.05rem; letter-spacing: .04em; text-transform: uppercase; color: var(--mttc-red); margin: 0 0 8px; }
.mttc-conduct__item:nth-child(even) .mttc-conduct__title { color: var(--mttc-blue); }
.mttc-conduct__item p { margin: 0; font-family: var(--mttc-head); font-weight: 700; font-size: 1rem; line-height: 1.45; color: var(--mttc-blue); }
.mttc-conduct__ask { text-align: center; font-family: var(--mttc-head); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--mttc-red); margin: 26px 0 0; }
@media (max-width: 1100px) { .mttc-conduct { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .mttc-conduct { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .mttc-conduct { grid-template-columns: 1fr; } }

/* =========================================================
   9. Club jersey (Pro Shop) + Home teaser
   ========================================================= */
.mttc-jersey { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 44px; align-items: center; }
.mttc-jersey__media { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); grid-auto-rows: 1fr; gap: 14px; }
.mttc-jersey__hero { grid-row: 1 / span 2; width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: var(--mttc-radius); box-shadow: var(--mttc-shadow); }
.mttc-jersey__flat { width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; background: #fff; border: 1px solid var(--mttc-line); border-radius: var(--mttc-radius); }
.mttc-pill { display: inline-block; font-family: var(--mttc-head); font-weight: 800; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: #fff; background: var(--mttc-red); border-radius: 999px; padding: 6px 12px; margin-bottom: 14px; }
.mttc-jersey__title { font-family: var(--mttc-head); font-weight: 900; color: var(--mttc-blue); font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.1; margin: 0 0 12px; }
.mttc-jersey__body p { margin: 0 0 14px; }
.mttc-jersey__specs { list-style: none; padding: 0; margin: 0 0 18px; display: flex; flex-wrap: wrap; gap: 8px; }
.mttc-jersey__specs li { font-family: var(--mttc-head); font-weight: 700; font-size: .84rem; letter-spacing: .04em; color: var(--mttc-blue); background: var(--mttc-blue-tint); border-radius: 999px; padding: 6px 12px; margin: 0; }
.mttc-jersey .mttc-actions { justify-content: flex-start; margin-top: 4px; }
@media (max-width: 860px) { .mttc-jersey { grid-template-columns: 1fr; gap: 26px; } }
@media (max-width: 480px) { .mttc-jersey__media { grid-template-columns: 1fr 1fr; } .mttc-jersey__hero { grid-column: 1 / -1; grid-row: auto; } }

.mttc-teaser { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 24px; align-items: center; background: #fff; border: 1px solid var(--mttc-line); border-top: 4px solid var(--mttc-red); border-radius: var(--mttc-radius); box-shadow: var(--mttc-shadow); padding: 20px 26px; max-width: 900px; margin: 0 auto; }
.mttc-teaser__img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 8px; border: 1px solid var(--mttc-line); }
.mttc-teaser .mttc-pill { margin-bottom: 8px; }
.mttc-teaser__title { font-family: var(--mttc-head); font-weight: 900; color: var(--mttc-blue); font-size: 1.35rem; margin: 0 0 6px; }
.mttc-teaser p { margin: 0; color: var(--mttc-text); }
@media (max-width: 700px) { .mttc-teaser { grid-template-columns: 1fr; text-align: center; } .mttc-teaser__img { max-width: 180px; margin: 0 auto; } }

/* Utility */
.mttc-hidden { display: none !important; }
.screen-reader-text, .mttc-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }
@media (prefers-reduced-motion: reduce) { .mttc-btn, .btn, .navbar .navbar-nav > li > a::after { transition: none !important; } }
