/*
  Homepage-only styles for The Dugout Training Facility.

  This file does not replace or modify style.css.
*/


/* ==========================================================
   HEADER AND PAGE
========================================================== */

.home-nav {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.home-board {
  padding-top: 8px;
}

/* ==========================================================
   CONTACT STRIP
========================================================== */

.home-contact-strip {
  display: flex;
  justify-content: center;

  padding: 10px 18px;
}

.home-contact-pill {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;

  gap: 10px;
  width: 100%;
  max-width: 1100px;

  padding: 10px 18px;

  border: 1px solid #374151;
  border-radius: 999px;

  background: #0b1120;

  color: #e5e7eb;

  font-size: .84rem;
}

.home-contact-pill a{
  color:#22c55e;
  font-weight:700;
  text-decoration:none;
}

.home-contact-pill a:hover{
  text-decoration:underline;
}

.info-divider{
  color:#6b7280;
}

/* ==========================================================
   MOBILE HERO CONTACT
========================================================== */

@media (max-width: 900px) {

  .hero-contact {
    justify-content: flex-start;
  }

}

@media (max-width: 700px) {

  .hero-contact {
    flex-direction: column;
    width: 100%;
  }

  .hero-contact-item {
    width: 100%;
    min-width: 0;
  }

}
/* ==========================================================
   WELCOME
========================================================== */

.home-welcome {
  margin-bottom: 18px;
  padding: 24px;

  border: 1px solid #1f2937;
  border-radius: 18px;

  background:
    radial-gradient(
      circle at top left,
      #111827,
      #020617 68%
    );

  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.65);
}

.home-kicker {
  margin: 0 0 8px;

  color: #fde68a;

  font-size: 0.78rem;
  font-weight: 700;

  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.home-welcome h2 {
  max-width: 780px;
  margin: 0;

  color: #f9fafb;

  font-size: clamp(1.5rem, 4vw, 2.3rem);
  line-height: 1.15;

  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.home-copy {
  max-width: 850px;
  margin: 14px 0 0;

  color: #d1d5db;

  font-size: 1rem;
  line-height: 1.7;
}

.home-actions {
  display: flex;
  flex-wrap: wrap;

  gap: 10px;
  margin-top: 20px;
}


/* ==========================================================
   MONTHLY MEMBERSHIP SECTION
========================================================== */

.pricing-section {
  margin-bottom: 18px;
  padding: 24px;

  border: 1px solid #1f2937;
  border-radius: 18px;

  background:
    radial-gradient(
      circle at top left,
      #111827,
      #020617 70%
    );

  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.65);

  scroll-margin-top: 20px;
}

.pricing-heading {
  margin-bottom: 18px;
  text-align: center;
}

.pricing-heading h2 {
  margin: 0;

  color: #ffffff;

  font-size: clamp(1.75rem, 4vw, 2.7rem);
  line-height: 1.1;

  letter-spacing: 0.07em;
  text-transform: uppercase;
}


/* ==========================================================
   FEATURED MEMBERSHIP CARD
========================================================== */

.membership-feature-card {
  overflow: hidden;
  padding: 22px;

  border: 1px solid #dc2626;
  border-radius: 16px;

  background:
    linear-gradient(
      120deg,
      rgba(74, 16, 30, 0.78),
      rgba(2, 6, 23, 0.98) 58%
    );

  box-shadow:
    0 18px 38px rgba(0, 0, 0, 0.58);
}


/* ==========================================================
   MEMBERSHIP TOP
========================================================== */

.membership-top {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(330px, 0.72fr);

  align-items: stretch;

  gap: 22px;
}

.membership-top-main {
  display: grid;

  grid-template-columns:
    auto
    minmax(0, 1fr);

  align-items: center;

  gap: 38px;
  min-width: 0;
}

.membership-price-large {
  flex-shrink: 0;
}

.membership-price-large strong {
  display: block;

  color: #22c55e;

  font-size: clamp(4.8rem, 8vw, 6.8rem);
  font-weight: 900;
  line-height: 0.82;
}

.membership-price-large span {
  display: block;
  margin-top: 15px;

  color: #ffffff;

  font-size: 0.9rem;
  font-weight: 900;

  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.membership-feature-copy {
  max-width: 450px;
  margin: 0;

  color: #f3f4f6;

  font-size: 1.08rem;
  line-height: 1.65;
}


/* ==========================================================
   BECOME A MEMBER
========================================================== */

.membership-contact {
  display: flex;
  justify-content: center;
  flex-direction: column;

  min-width: 0;
  padding: 20px;

  border: 1px solid #475569;
  border-radius: 14px;

  background:
    linear-gradient(
      145deg,
      rgba(15, 23, 42, 0.98),
      rgba(2, 6, 23, 0.98)
    );
}

.membership-contact strong {
  display: block;

  color: #fde047;

  font-size: 0.9rem;
  font-weight: 900;

  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.membership-contact p {
  margin: 10px 0 6px;

  color: #e5e7eb;

  font-size: 0.84rem;
  line-height: 1.55;
}

.membership-contact a {
  display: block;
  margin-top: 8px;

  color: #22c55e;

  font-size: 0.92rem;
  font-weight: 900;

  overflow-wrap: anywhere;
  text-decoration: none;
}

.membership-contact a:hover {
  text-decoration: underline;
}


/* ==========================================================
   MEMBERSHIP HIGHLIGHTS
========================================================== */

.membership-highlights {
  display: grid;

  grid-template-columns:
    repeat(5, minmax(0, 1fr));

  gap: 12px;
  margin-top: 20px;
}

.membership-highlight {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;

  min-height: 150px;
  padding: 18px 12px;

  border: 1px solid #475569;
  border-radius: 14px;

  background:
    linear-gradient(
      145deg,
      rgba(15, 23, 42, 0.96),
      rgba(2, 6, 23, 0.98)
    );

  text-align: center;
}

.membership-highlight-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 52px;
  height: 52px;
  margin-bottom: 12px;

  border: 2px solid #dc2626;
  border-radius: 999px;

  color: #ef4444;

  font-size: 0.78rem;
  font-weight: 900;

  letter-spacing: 0.05em;
}

.membership-highlight strong {
  display: block;

  color: #ffffff;

  font-size: 1.15rem;
  font-weight: 900;
  line-height: 1.15;

  text-transform: uppercase;
}

.membership-highlight span {
  display: block;
  margin-top: 7px;

  color: #d1d5db;

  font-size: 0.77rem;
  line-height: 1.4;
}


/* ==========================================================
   MEMBERSHIP LOWER AREA
========================================================== */

.membership-content-grid {
  display: grid;

  grid-template-columns:
    minmax(0, 1.28fr)
    minmax(340px, 0.72fr);

  gap: 22px;
  margin-top: 22px;
}

.membership-includes {
  min-width: 0;
}

.membership-content-grid h4 {
  margin: 0;

  color: #fde047;

  font-size: 1rem;
  font-weight: 900;

  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.membership-list {
  columns: 2;
  column-gap: 32px;

  margin-top: 13px;
}

.membership-list li {
  break-inside: avoid;

  margin-bottom: 5px;
}

.membership-information {
  display: flex;
  flex-direction: column;

  gap: 12px;
}


/* ==========================================================
   WALK-IN FEE BOX
========================================================== */

.walk-in-box {
  display: flex;
  align-items: center;

  gap: 17px;
  padding: 16px;

  border: 1px solid #22c55e;
  border-radius: 14px;

  background:
    linear-gradient(
      135deg,
      rgba(21, 128, 61, 0.16),
      rgba(2, 6, 23, 0.98)
    );
}

.walk-in-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 54px;
  min-width: 54px;
  height: 54px;

  border: 2px solid #22c55e;
  border-radius: 999px;

  color: #22c55e;

  font-size: 1.5rem;
  font-weight: 900;
}

.walk-in-box strong {
  display: block;

  color: #22c55e;

  font-size: 0.95rem;
  font-weight: 900;

  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.walk-in-box p {
  margin: 5px 0 0;

  color: #f3f4f6;

  font-size: 0.85rem;
  line-height: 1.45;
}

.walk-in-box b {
  color: #ffffff;
}


/* ==========================================================
   SPECIAL MEMBERSHIP OPTIONS
========================================================== */

.pricing-special {
  padding: 16px;

  border: 1px solid #dc2626;
  border-radius: 14px;

  background:
    linear-gradient(
      135deg,
      rgba(127, 29, 29, 0.22),
      rgba(2, 6, 23, 0.98)
    );
}

.pricing-special strong {
  display: block;

  color: #fde047;

  font-size: 0.82rem;
  font-weight: 900;

  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.pricing-special p {
  margin: 8px 0 0;

  color: #d1d5db;

  font-size: 0.8rem;
  line-height: 1.55;
}


/* ==========================================================
   MEMBERSHIP RESPONSIVE
========================================================== */

@media (max-width: 1100px) {

  .membership-highlights {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }

  .membership-content-grid {
    grid-template-columns: 1fr;
  }

}


@media (max-width: 900px) {

  .membership-top {
    grid-template-columns: 1fr;
  }

  .membership-top-main {
    grid-template-columns:
      auto
      minmax(0, 1fr);
  }

  .membership-highlights {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .membership-list {
    columns: 1;
  }

}


@media (max-width: 700px) {

  .membership-feature-card {
    padding: 18px;
  }

  .membership-top-main {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .membership-feature-copy {
    max-width: none;
  }

  .membership-price-large strong {
    font-size: 4.8rem;
  }

  .membership-highlights {
    grid-template-columns: 1fr;
  }

  .membership-highlight {
    min-height: 120px;
  }

  .walk-in-box {
    align-items: flex-start;
  }

}

/* ==========================================================
   OTHER PRICING OPTIONS
========================================================== */

.pricing-options-grid {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 14px;
  margin-top: 16px;
}

.pricing-card {
  display: flex;
  flex-direction: column;

  min-width: 0;
  padding: 19px;

  border: 1px solid #1f2937;
  border-radius: 15px;

  background: #020617;

  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.48);

  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.pricing-card:hover {
  transform: translateY(-2px);

  border-color: #7f1d1d;

  box-shadow:
    0 20px 38px rgba(0, 0, 0, 0.62);
}

.pricing-card-label {
  margin: 0 0 7px;

  color: #fde68a;

  font-size: 0.72rem;
  font-weight: 800;

  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.pricing-amount {
  margin-top: 7px;
}

.pricing-amount strong {
  color: #22c55e;

  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
}

.pricing-amount span {
  display: inline-block;
  margin-left: 5px;

  color: #d1d5db;

  font-size: 0.72rem;
  font-weight: 800;

  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.pricing-text-price {
  margin-top: 7px;

  color: #22c55e;

  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1.1;

  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.pricing-summary {
  margin: 13px 0 0;

  color: #d1d5db;

  font-size: 0.88rem;
  line-height: 1.55;
}

.pricing-list {
  margin: 14px 0 16px;
  padding-left: 20px;

  color: #e5e7eb;

  font-size: 0.84rem;
  line-height: 1.65;
}

.pricing-list li {
  margin-bottom: 3px;
}

.pricing-notice,
.pricing-special {
  padding: 13px;

  border-radius: 11px;
}

.pricing-notice {
  margin-top: auto;

  border: 1px solid #374151;

  background: #0b1120;
}

.pricing-special {
  border: 1px solid #7f1d1d;

  background:
    linear-gradient(
      135deg,
      rgba(127, 29, 29, 0.25),
      rgba(11, 17, 32, 0.92)
    );
}

.pricing-notice strong,
.pricing-special strong {
  display: block;

  color: #fde68a;

  font-size: 0.73rem;
  font-weight: 800;

  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.pricing-notice p,
.pricing-special p {
  margin: 7px 0 0;

  color: #d1d5db;

  font-size: 0.78rem;
  line-height: 1.5;
}

.pricing-card > .info-btn {
  align-self: flex-start;
  margin-top: 15px;
}

/* ==========================================================
   TWO FACILITIES BANNER
========================================================== */

.mission-banner {
  margin-bottom: 18px;
  padding: 26px 22px;

  border: 1px solid #7f1d1d;
  border-radius: 18px;

  background:
    linear-gradient(
      135deg,
      rgba(127, 29, 29, 0.96),
      rgba(153, 27, 27, 0.92),
      rgba(15, 23, 42, 0.98)
    );

  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.65);

  text-align: center;
}

.mission-small {
  margin: 0 0 7px;

  color: #fde68a;

  font-size: 0.76rem;
  font-weight: 800;

  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.mission-banner h2 {
  margin: 0;

  color: #ffffff;

  font-size: clamp(1.7rem, 4vw, 2.7rem);
  line-height: 1.1;

  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mission-banner > p:last-child {
  max-width: 720px;
  margin: 10px auto 0;

  color: #e5e7eb;

  font-size: 0.96rem;
  line-height: 1.6;
}


/* ==========================================================
   FACILITIES
========================================================== */

.facilities-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 18px;
  margin-bottom: 18px;
}

.facility-card {
  display: flex;
  flex-direction: column;

  overflow: hidden;

  border: 1px solid #1f2937;
  border-radius: 18px;

  background: #020617;

  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.65);
}

.facility-card--team {
  border-color: #991b1b;
}

.facility-card-top,
.facility-card-body {
  padding: 22px;
}

.facility-card-top {
  padding-bottom: 12px;
}

.facility-label {
  margin: 0 0 7px;

  color: #fde68a;

  font-size: 0.74rem;
  font-weight: 800;

  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.facility-card h2 {
  margin: 0;

  color: #f9fafb;

  font-size: 1.4rem;
  line-height: 1.2;

  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.facility-description {
  margin: 12px 0 0;

  color: #d1d5db;

  font-size: 0.94rem;
  line-height: 1.6;
}


/* ==========================================================
   FACILITY PHOTOS
========================================================== */

.facility-photo-wrap {
  position: relative;

  width: 100%;
  height: 260px;

  overflow: hidden;

  background: #111827;
}

.facility-photo {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  opacity: 1;

  transition:
    opacity 0.45s ease;

  will-change: opacity;
}

.facility-photo-badge {
  position: absolute;
  left: 14px;
  bottom: 14px;

  padding: 7px 12px;

  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;

  background: rgba(127, 29, 29, 0.92);
  color: #ffffff;

  font-size: 0.7rem;
  font-weight: 800;

  letter-spacing: 0.1em;
  text-transform: uppercase;
}


/* ==========================================================
   FACILITY STATS
========================================================== */

.facility-details {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 8px;

  padding: 0 22px 4px;
}

.facility-feature {
  padding: 14px 8px;

  border: 1px solid #1f2937;
  border-radius: 12px;

  background: #0b1120;

  text-align: center;
}

.facility-feature strong {
  display: block;

  color: #22c55e;

  font-size: 1.6rem;
  line-height: 1;
}

.facility-feature span {
  display: block;
  margin-top: 6px;

  color: #d1d5db;

  font-size: 0.72rem;

  letter-spacing: 0.07em;
  text-transform: uppercase;
}


/* ==========================================================
   FACILITY LISTS AND ACTIONS
========================================================== */

.facility-list {
  margin: 14px 22px 18px;
  padding-left: 20px;

  color: #e5e7eb;

  font-size: 0.91rem;
  line-height: 1.7;
}

.facility-list li {
  margin-bottom: 3px;
}

.facility-card-body .facility-list {
  margin-right: 0;
  margin-left: 0;
}

.facility-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;

  gap: 12px;

  margin-top: auto;
  padding: 0 22px 22px;
}

.facility-text-link {
  color: #fde68a;

  font-size: 0.76rem;
  font-weight: 800;

  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}

.facility-text-link:hover {
  text-decoration: underline;
}


/* ==========================================================
   TEAM FACILITY PRICE AND CONTACT
========================================================== */

.team-price {
  margin-top: 8px;

  color: #22c55e;

  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
}

.team-price span {
  display: inline-block;
  margin-left: 5px;

  color: #d1d5db;

  font-size: 0.8rem;
  font-weight: 700;

  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.team-phone {
  display: inline-block;
  margin-top: 16px;

  color: #fde68a;

  font-size: 1.05rem;
  font-weight: 800;

  text-decoration: none;
}

.team-phone:hover {
  text-decoration: underline;
}

.team-availability {
  margin: 5px 0 0;

  color: #9ca3af;

  font-size: 0.82rem;
  line-height: 1.5;
}

/* ==========================================================
   TRAINERS SECTION
========================================================== */

.home-trainers-section {
  margin-bottom: 18px;
  padding: 24px;

  border: 1px solid #1f2937;
  border-radius: 18px;

  background:
    radial-gradient(
      circle at top left,
      #111827,
      #020617 68%
    );

  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.65);
}

.home-section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;

  gap: 18px;
  margin-bottom: 18px;
}

.home-section-label {
  margin: 0 0 7px;

  color: #fde68a;

  font-size: .76rem;
  font-weight: 800;

  letter-spacing: .15em;
  text-transform: uppercase;
}

.home-section-header h2 {
  margin: 0;

  color: #f9fafb;

  font-size: clamp(1.55rem,3.2vw,2.2rem);
  line-height: 1.15;

  letter-spacing: .05em;
  text-transform: uppercase;
}

.home-section-copy {
  max-width: 760px;
  margin: 10px 0 0;

  color: #d1d5db;

  font-size: .94rem;
  line-height: 1.6;
}

.home-trainer-status {
  margin: 0;

  color: #9ca3af;

  font-size: .85rem;
}


/* ==========================================================
   TRAINER GRID
========================================================== */

.home-trainer-grid {

  display:grid;

  grid-template-columns:
      repeat(var(--trainer-card-count,3),minmax(0,1fr));

  gap:16px;

  margin-top:14px;

  transition:
      opacity .2s ease,
      transform .2s ease;
}

.home-trainer-grid--changing{

    opacity:0;

    transform:translateX(8px);

}


/* ==========================================================
   TRAINER CARD
========================================================== */

.home-trainer-card{

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:1px solid #1f2937;
    border-radius:16px;

    background:#020617;

    box-shadow:
        0 16px 34px rgba(0,0,0,.55);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.home-trainer-card:hover{

    transform:translateY(-3px);

    border-color:#7f1d1d;

    box-shadow:
        0 22px 44px rgba(0,0,0,.70);

}


/* ==========================================================
   TRAINER PHOTO
========================================================== */

.home-trainer-photo-wrap{

    position:relative;

    width:100%;
    height:250px;

    overflow:hidden;

    border-bottom:1px solid #1f2937;

    background:#0b1120;

}

.home-trainer-photo{

    display:block;

    width:100%;
    height:100%;

    object-fit:cover;
    object-position:center top;

}

.home-trainer-placeholder{

    display:flex;
    align-items:center;
    justify-content:center;

    width:100%;
    height:100%;

    background:
        radial-gradient(circle at top,#1f2937,#020617 72%);

    color:#fde68a;

    font-size:3rem;
    font-weight:900;

}

.home-trainer-photo-fallback{

    display:none;

}


/* ==========================================================
   TRAINER BODY
========================================================== */

.home-trainer-card-body{

    display:flex;
    flex:1;
    flex-direction:column;

    padding:18px;

}

.home-trainer-title{

    margin:0 0 6px;

    color:#fde68a;

    font-size:.72rem;
    font-weight:800;

    letter-spacing:.12em;
    text-transform:uppercase;

}

.home-trainer-card h3{

    margin:0;

    color:#ffffff;

    font-size:1.2rem;
    line-height:1.2;

    letter-spacing:.04em;
    text-transform:uppercase;

}

.home-trainer-specialties{

    display:flex;
    flex-wrap:wrap;

    gap:6px;

    margin-top:12px;

}

.home-trainer-specialties span{

    padding:5px 8px;

    border:1px solid #374151;
    border-radius:999px;

    background:#0b1120;

    color:#d1d5db;

    font-size:.65rem;
    font-weight:700;

    letter-spacing:.05em;
    text-transform:uppercase;

}

.home-trainer-bio{

    margin:14px 0 0;

    color:#cbd5e1;

    font-size:.86rem;
    line-height:1.55;

}

.home-trainer-link{

    margin-top:auto;

    padding-top:18px;

    color:#fde68a;

    font-size:.75rem;
    font-weight:800;

    letter-spacing:.08em;
    text-decoration:none;
    text-transform:uppercase;

}

.home-trainer-link:hover{

    text-decoration:underline;

}


/* ==========================================================
   TRAINER CONTROLS
========================================================== */

.trainer-controls{

    display:flex;
    align-items:center;

    gap:8px;

}

.trainer-arrow{

    display:flex;
    align-items:center;
    justify-content:center;

    width:38px;
    height:38px;

    border:1px solid #374151;
    border-radius:999px;

    background:#0b1120;

    color:#ffffff;

    cursor:pointer;

    transition:.2s;

}

.trainer-arrow:hover{

    background:#7f1d1d;

    border-color:#991b1b;

}

.trainer-counter{

    color:#9ca3af;

    font-size:.75rem;

    letter-spacing:.08em;
    text-transform:uppercase;

}


/* ==========================================================
   TRAINER PRICING NOTE
========================================================== */

.trainer-lesson-note{

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:18px;

    margin-top:18px;

    padding:16px;

    border:1px solid #7f1d1d;
    border-radius:12px;

    background:
        linear-gradient(
            135deg,
            rgba(127,29,29,.25),
            rgba(11,17,32,.92)
        );

}

.trainer-lesson-note strong{

    display:block;

    color:#fde68a;

    font-size:.8rem;

    letter-spacing:.08em;
    text-transform:uppercase;

}

.trainer-lesson-note p{

    margin:7px 0 0;

    color:#d1d5db;

    line-height:1.6;

    font-size:.84rem;

}

.trainer-lesson-note .info-btn{

    flex-shrink:0;

}

/* ==========================================================
   DASHBOARD
========================================================== */

.dashboard-section{

    display:grid;

    grid-template-columns:
        minmax(0,1.15fr)
        minmax(300px,.85fr);

    gap:20px;

    margin-bottom:18px;

    padding:22px;

    border:1px solid #1f2937;
    border-radius:18px;

    background:
        radial-gradient(
            circle at top left,
            #111827,
            #020617 68%
        );

    box-shadow:
        0 18px 40px rgba(0,0,0,.65);

}

.dashboard-content{

    min-width:0;

}

.dashboard-label{

    margin:0 0 8px;

    color:#fde68a;

    font-size:.76rem;
    font-weight:800;

    letter-spacing:.16em;
    text-transform:uppercase;

}

.dashboard-content h2{

    margin:0;

    color:#ffffff;

    font-size:clamp(1.45rem,3vw,2rem);

    line-height:1.15;

    letter-spacing:.04em;
    text-transform:uppercase;

}

.dashboard-intro{

    margin-top:12px;

    color:#d1d5db;

    line-height:1.6;

}

.dashboard-checklist{

    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:8px;

    margin-top:16px;

}

.dashboard-check-item{

    display:flex;
    align-items:center;

    gap:10px;

    padding:11px;

    border:1px solid #1f2937;
    border-radius:10px;

    background:#0b1120;

    color:#e5e7eb;

    font-size:.82rem;
    font-weight:700;

}

.dashboard-check-mark{

    display:flex;
    align-items:center;
    justify-content:center;

    width:22px;
    height:22px;

    border-radius:999px;

    background:rgba(34,197,94,.18);

    color:#86efac;

    font-weight:900;

}

.dashboard-actions{

    display:flex;
    flex-wrap:wrap;

    gap:12px;

    margin-top:18px;

}

.dashboard-link{

    color:#fde68a;

    font-size:.76rem;
    font-weight:800;

    letter-spacing:.08em;
    text-decoration:none;
    text-transform:uppercase;

}

.dashboard-link:hover{

    text-decoration:underline;

}


/* ==========================================================
   DASHBOARD PREVIEW
========================================================== */

.dashboard-preview{

    overflow:hidden;

    border:1px solid #374151;
    border-radius:16px;

    background:#020617;

    box-shadow:
        0 18px 40px rgba(0,0,0,.70);

}

.preview-header{

    display:flex;
    align-items:center;

    gap:10px;

    padding:12px;

    border-bottom:1px solid #7f1d1d;

    background:
        linear-gradient(
            90deg,
            #7f1d1d,
            #991b1b
        );

}

.preview-header img{

    width:42px;
    height:42px;

}

.preview-status-row{

    display:flex;

    flex-wrap:wrap;

    gap:6px;

    padding:9px 11px;

    background:#0b1120;

}

.preview-status{

    padding:4px 8px;

    border-radius:999px;

    color:#ffffff;

    font-size:.58rem;
    font-weight:800;

    text-transform:uppercase;

}

.preview-status--open{
    background:#15803d;
}

.preview-status--busy{
    background:#b91c1c;
}

.preview-status--reserved{
    background:#1d4ed8;
}

.preview-grid{

    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:8px;

    padding:11px;

}

.preview-card{

    padding:10px;

    border:1px solid #1f2937;
    border-radius:10px;

    background:#0b1120;

}

.preview-card span{

    display:block;

    color:#d1d5db;

    font-size:.65rem;

    text-transform:uppercase;

}

.preview-card strong{

    display:block;

    margin-top:8px;

}

.preview-bottom{

    display:grid;

    grid-template-columns:
        repeat(4,1fr);

}

.preview-bottom span{

    padding:9px;

    background:#0b1120;

    color:#9ca3af;

    font-size:.55rem;

    text-align:center;

}


/* ==========================================================
   QUICK LINKS
========================================================== */

.home-grid{

    grid-template-columns:
        repeat(3,minmax(0,1fr));

}

.home-card{

    min-height:220px;

    padding:18px;

}

.home-card p{

    margin-top:8px;

    color:#e5e7eb;

    line-height:1.6;

}

.home-card-link{

    margin-top:auto;

    color:#fde68a;

    font-size:.78rem;
    font-weight:700;

    text-decoration:none;
    text-transform:uppercase;

}

.home-card-link:hover{

    text-decoration:underline;

}


/* ==========================================================
   FOOTER
========================================================== */

.home-footer-link{

    color:#9ca3af;

    font-size:.8rem;

}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width:1100px){

    .dashboard-section{
        grid-template-columns:1fr;
    }

    .membership-content-grid{
        grid-template-columns:1fr;
    }

}

@media (max-width:900px){

    .facilities-grid,
    .home-grid{

        grid-template-columns:1fr;

    }

    .membership-top{

        grid-template-columns:1fr;

    }

    .membership-highlights{

        grid-template-columns:
            repeat(2,1fr);

    }

    .membership-list{

        columns:1;

    }

    .home-trainer-grid{

        grid-template-columns:
            repeat(2,minmax(0,1fr));

    }

}

@media (max-width:700px){

    .home-nav{

        justify-content:flex-start;

    }

    .home-welcome,
    .pricing-section,
    .dashboard-section,
    .home-trainers-section{

        padding:18px;

    }

    .membership-highlights{

        grid-template-columns:1fr;

    }

    .dashboard-checklist{

        grid-template-columns:1fr;

    }

    .home-trainer-grid{

        grid-template-columns:1fr;

    }

    .facility-photo-wrap{

        height:220px;

    }

    .home-trainer-photo-wrap{

        height:290px;

    }

}

/* ==========================================================
   MEMBERSHIP CORRECTION
   Restores compact stat boxes
========================================================== */

.membership-highlights {
  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 9px;
  margin-top: 16px;
}

.membership-highlight {
  display: flex;
  align-items: center;
  justify-content: center;

  min-height: 68px;
  padding: 11px 9px;

  text-align: center;
}

.membership-highlight-icon {
  display: none;
}

.membership-highlight strong {
  font-size: 1.3rem;
  line-height: 1.15;
}

.membership-highlight span {
  display: none;
}


/* Small walk-in information box */

.walk-in-box {
  display: block;

  padding: 13px;

  border: 1px solid #22c55e;
  border-radius: 11px;

  background:
    linear-gradient(
      135deg,
      rgba(21, 128, 61, 0.18),
      rgba(11, 17, 32, 0.94)
    );
}

.walk-in-icon {
  display: none;
}

.walk-in-box strong {
  display: block;

  color: #86efac;

  font-size: 0.75rem;
  font-weight: 800;

  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.walk-in-box p {
  margin: 6px 0 0;

  color: #e5e7eb;

  font-size: 0.8rem;
  line-height: 1.45;
}

/* Walk-In Box */

.walk-in-price {

    margin-top: 12px;

    color: #22c55e;

    font-size: 2rem;
    font-weight: 900;

    line-height: 1;

}

.walk-in-hours {

    display: block;

    margin-top: 6px;

    color: #d1d5db;

    font-size: .75rem;

    letter-spacing: .08em;
    text-transform: uppercase;

}

/* ==========================================================
   FIX PRICING CARDS ON PHONES
========================================================== */

@media (max-width: 700px) {

  .pricing-options-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .pricing-card {
    width: 100%;
    min-width: 0;
  }

  .pricing-text-price,
  .pricing-amount strong {
    font-size: 1.8rem;
  }

  .pricing-summary,
  .pricing-list {
    font-size: 0.9rem;
    line-height: 1.55;
  }

}

@media (max-width: 700px) {

  .home-contact-pill {
    flex-direction: column;
    gap: 6px;

    border-radius: 14px;
  }

  .info-divider {
    display: none;
  }

}

/* ==========================================================
   MOBILE CONTACT STRIP FIX
========================================================== */

@media (max-width: 700px) {

  .home-contact-strip {
    padding: 10px 16px;
  }

  .home-contact-pill {
    display: flex;
    align-items: flex-start;
    flex-direction: column;

    gap: 5px;
    width: 100%;
    max-width: none;
    padding: 12px 14px;

    border-radius: 14px;

    font-size: 0.78rem;
    line-height: 1.35;
    text-align: left;
  }

  .home-contact-pill a {
    display: inline;
    font-size: 0.8rem;
  }

  .home-contact-pill .info-divider {
    display: none;
  }

}