/* ════════════════════════════════════════════════════════════
   JTCC Private Lessons Page Template
   Design system: Barlow · Green #6AA308 · Blue #1B4EA0
   All rules scoped to .private-lessons-page to avoid conflicts.
════════════════════════════════════════════════════════════ */

/* ─── CSS Variables ─────────────────────────────────────── */

.private-lessons-page {
  --pl-text:        #1C1C1C;
  --pl-text-soft:   #707070;
  --pl-bg:          #FFFFFF;
  --pl-bg-soft:     #F8F8F8;
  --pl-bg-grey:     #F0F0F0;
  --pl-border:      #DEDEDE;
  --pl-green:       #6AA308;
  --pl-green-lt:    #97CA3E;
  --pl-green-pale:  #D0E5AA;
  --pl-green-mist:  #F8FFED;
  --pl-blue:        #1B4EA0;
  --pl-blue-dk:     #0B2550;
  --pl-red:         #C71616;

  font-family: "Barlow", system-ui, -apple-system, "Segoe UI", Helvetica, sans-serif;
  color: var(--pl-text);
  background: var(--pl-bg);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

/* ─── Keyframes ─────────────────────────────────────────── */

@keyframes pl-ken-burns {
  from { transform: scale(1.06); }
  to   { transform: scale(1.0); }
}
@keyframes pl-fade-up {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: none; }
}

.private-lessons-page .pl-fade-up {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .55s ease, transform .55s ease;
}
.private-lessons-page .pl-fade-up.in-view {
  opacity: 1;
  transform: none;
}

/* ════════════════════════════════════════════════════════════
   HERO
════════════════════════════════════════════════════════════ */

/* Suppress the animated padding-top jump caused by main.js setting div#page
   padding-top after load. The body class is only present on this template,
   so this rule has zero impact on any other page. */
body.page-template-template-private-lessons div#page {
  transition: padding-top 0s !important;
}

.private-lessons-page .pl-hero {
  position: relative;
  overflow: hidden;
  min-height: 540px;
  display: flex;
  align-items: flex-end;
  background: var(--pl-blue-dk);
}

.private-lessons-page .pl-hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.private-lessons-page .pl-hero-bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}
/* Ken Burns zoom — only when ACF "Hero Image Animation" is enabled.
   Pre-position at scale(1.06) so the visual state matches the animation's
   first frame; JS adds .pl-hero-img-ready once the image has loaded,
   which starts the animation with no visible jump. */
.private-lessons-page .pl-hero-anim .pl-hero-bg img {
  transform: scale(1.06);
}
.private-lessons-page .pl-hero-anim .pl-hero-bg img.pl-hero-img-ready {
  animation: pl-ken-burns 8s ease-out forwards;
}

.private-lessons-page .pl-hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(115deg, rgba(11,37,80,.85) 35%, rgba(11,37,80,.35) 75%, rgba(11,37,80,.15)),
    linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.4));
  pointer-events: none;
}

.private-lessons-page .pl-hero-container {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
}

.private-lessons-page .pl-hero-content {
  padding: 5rem 40px 5rem;
  max-width: 720px;
}

.private-lessons-page .pl-eyebrow {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--pl-green-lt);
  margin: 0 0 22px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  animation: pl-fade-up .6s ease both .2s;
}
.private-lessons-page .pl-eyebrow::before {
  content: "";
  display: inline-block;
  width: 36px;
  height: 1px;
  background: var(--pl-green-lt);
}
.private-lessons-page .pl-eyebrow--mobile { display: none; }
@media (max-width: 640px) {
  .private-lessons-page .pl-eyebrow--desktop { display: none; }
  .private-lessons-page .pl-eyebrow--mobile { display: inline-flex; }
}

.private-lessons-page .pl-h1 {
  font-size: clamp(34px, 4vw + 8px, 72px);
  font-weight: 700;
  color: #fff;
  line-height: 1.05;
  margin: 0 0 22px;
  letter-spacing: -.005em;
  animation: pl-fade-up .6s ease both .35s;
}
.private-lessons-page .pl-h1 .pl-h1-em {
  color: var(--pl-green-lt);
}

.private-lessons-page .pl-hero-body {
  font-size: 20px;
  font-weight: 400;
  color: rgba(255,255,255,.85);
  line-height: 1.65;
  margin: 0 0 36px;
  max-width: 580px;
  animation: pl-fade-up .6s ease both .5s;
}

.private-lessons-page .pl-hero-buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  animation: pl-fade-up .6s ease both .65s;
}

/* ════════════════════════════════════════════════════════════
   BUTTONS
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-btn,
.private-lessons-page .pl-book-btn,
.private-lessons-page .pl-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Barlow", sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: .01em;
  padding: 16px 36px;
  border-radius: 38px;
  border: 2px solid transparent;
  cursor: pointer;
  text-decoration: none;
  line-height: 1;
  transition: background .18s ease, color .18s ease, border-color .18s ease,
              transform .18s ease, box-shadow .18s ease;
}
.private-lessons-page .pl-btn:hover,
.private-lessons-page .pl-book-btn:hover,
.private-lessons-page .pl-cta-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(28,28,28,.12);
}

/* Green solid */
.private-lessons-page .pl-btn-green {
  background: var(--pl-green);
  color: #fff;
  border-color: var(--pl-green);
}
.private-lessons-page .pl-btn-green:hover {
  background: var(--pl-green-lt);
  border-color: var(--pl-green-lt);
  color: var(--pl-text);
}

/* White outline (hero) */
.private-lessons-page .pl-btn-outline-white {
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,.65);
}
.private-lessons-page .pl-btn-outline-white:hover {
  background: #fff;
  color: var(--pl-text);
  border-color: #fff;
}

/* Dark outline (on white bg) */
.private-lessons-page .pl-btn-outline-dark {
  background: transparent;
  color: var(--pl-text);
  border: 2px solid var(--pl-text);
  font-size: 16px;
  padding: 12px 26px;
}
.private-lessons-page .pl-btn-outline-dark:hover {
  background: var(--pl-text);
  color: #fff;
}

/* Tier booking buttons */
.private-lessons-page .pl-book-btn {
  width: 100%;
  margin-top: auto;
  font-size: 17px;
  padding: 15px 26px;
}
.private-lessons-page .pl-bbtn-green {
  background: var(--pl-green);
  color: #fff;
  border-color: var(--pl-green);
}
.private-lessons-page .pl-bbtn-green:hover {
  background: var(--pl-green-lt);
  border-color: var(--pl-green-lt);
  color: var(--pl-text);
}
.private-lessons-page .pl-bbtn-blue {
  background: var(--pl-blue);
  color: #fff;
  border-color: var(--pl-blue);
}
.private-lessons-page .pl-bbtn-blue:hover {
  background: var(--pl-blue-dk);
  border-color: var(--pl-blue-dk);
}
.private-lessons-page .pl-bbtn-outline {
  background: #fff;
  color: var(--pl-text);
  border-color: var(--pl-text);
}
.private-lessons-page .pl-bbtn-outline:hover {
  background: var(--pl-text);
  color: #fff;
}

/* ════════════════════════════════════════════════════════════
   SECTION CHROME
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
}

.private-lessons-page .pl-page-body .pl-container {
  padding: 0;
}

.private-lessons-page .pl-sec {
  padding: 5rem 40px 4.5rem;
}
.private-lessons-page .pl-sec + .pl-sec {
  padding-top: 1.5rem;
}

/* Section rule: green hairline + centered white label box */
.private-lessons-page .pl-section-rule {
  position: relative;
  height: 33px;
  margin-bottom: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.private-lessons-page .pl-section-rule::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 50%;
  height: 1px;
  background: var(--pl-green-lt);
}
.private-lessons-page .pl-section-rule-label {
  position: relative;
  background: #fff;
  border: 1px solid var(--pl-green-lt);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--pl-text);
  padding: 8px 22px;
  white-space: nowrap;
}

/* Section headings */
.private-lessons-page .pl-sh {
  font-size: clamp(28px, 2vw + 16px, 44px);
  font-weight: 700;
  line-height: 1.15;
  margin: 0 0 18px;
  color: var(--pl-text);
  letter-spacing: -.005em;
}
.private-lessons-page .pl-ss {
  font-size: 18px;
  font-weight: 400;
  color: var(--pl-text);
  line-height: 1.7;
  max-width: 760px;
  margin: 0;
}
.private-lessons-page .pl-ss p { margin: 0 0 1em; }
.private-lessons-page .pl-ss p:last-child { margin-bottom: 0; }

.private-lessons-page .pl-snote {
  font-size: 15px;
  color: var(--pl-text-soft);
  font-style: italic;
  margin-top: 18px;
  padding: 12px 18px;
  background: var(--pl-green-mist);
  border-left: 3px solid var(--pl-green);
  border-radius: 0 4px 4px 0;
}

/* ════════════════════════════════════════════════════════════
   ABOUT SECTION
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-about-grid {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.private-lessons-page .pl-about-content {
  max-width: 760px;
}
.private-lessons-page .pl-about-img {
  display: none;
  position: relative;
  overflow: hidden;
}
.private-lessons-page .pl-about-img picture,
.private-lessons-page .pl-about-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}
.private-lessons-page .pl-about-img::before {
  content: "";
  position: absolute;
  top: -22px; left: -22px;
  width: 140px; height: 140px;
  background: var(--pl-green-lt);
  z-index: -1;
}

/* Stats row */
.private-lessons-page .pl-stat-row {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin: 2.5rem 0 0;
  padding-top: 2rem;
  border-top: 1px solid var(--pl-border);
}
.private-lessons-page .pl-stat {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.private-lessons-page .pl-stat-n {
  font-size: clamp(32px, 2vw + 14px, 48px);
  font-weight: 700;
  color: var(--pl-green);
  line-height: 1;
  display: block;
}
.private-lessons-page .pl-stat-l {
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--pl-text-soft);
}

/* ════════════════════════════════════════════════════════════
   POLICY CARDS
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-policy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-top: 2rem;
}
.private-lessons-page .pl-policy-card {
  padding: 28px 26px 26px;
  background: var(--pl-bg-soft);
  border: 1px solid transparent;
  position: relative;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.private-lessons-page .pl-policy-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 36px; height: 4px;
  background: var(--pl-green);
}
.private-lessons-page .pl-policy-card:hover {
  background: #fff;
  border-color: var(--pl-green-lt);
  transform: translateY(-2px);
}
.private-lessons-page .pl-policy-card h3 {
  font-size: 18px;
  font-weight: 700;
  color: var(--pl-text);
  margin: 0 0 8px;
}
.private-lessons-page .pl-policy-card p {
  font-size: 16px;
  color: var(--pl-text);
  line-height: 1.6;
  margin: 0;
}

/* ════════════════════════════════════════════════════════════
   COACHING TIERS
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-tiers-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin: 8px 0 28px;
}
.private-lessons-page .pl-tiers-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 28px;
}

.private-lessons-page .pl-tier-card {
  background: #fff;
  border: 2px solid transparent;
  outline: 1px solid var(--pl-border);
  outline-offset: -1px;
  padding: 0 28px 28px;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transition: border-color .22s ease, transform .22s ease,
              box-shadow .22s ease, outline-color .22s ease;
}
.private-lessons-page .pl-tier-card:hover {
  border-color: var(--pl-green-lt);
  outline-color: transparent;
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(28,28,28,.08);
}

/* Tier image — full-bleed at card top */
.private-lessons-page .pl-tier-img {
  margin: 0 -28px 24px;
  width: calc(100% + 56px) !important;
  overflow: hidden;
  position: relative;
  background: #e8e8e8;
  display: block !important; /* global figure rule sets display:grid !important */
  padding: 0 !important;     /* global figure rule adds 15px top/left padding */
}
.private-lessons-page .pl-tier-img picture {
  display: block;
  width: 100%;
  height: 100%;
}
.private-lessons-page .pl-tier-img img {
  width: 100% !important;
  height: 220px;
  object-fit: cover;
  object-position: center 30%;
  display: block;
  transition: transform .5s ease;
}
.private-lessons-page .pl-tier-card:hover .pl-tier-img img {
  transform: scale(1.05);
}

/* Tier badges */
.private-lessons-page .pl-tier-badge {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .14em;
  padding: 6px 14px;
  display: inline-block;
  margin-bottom: 14px;
  width: fit-content;
}
.private-lessons-page .pl-badge-director { background: var(--pl-green); color: #fff; }
.private-lessons-page .pl-badge-senior   { background: var(--pl-blue);  color: #fff; }
.private-lessons-page .pl-badge-staff    { background: var(--pl-bg-grey); color: var(--pl-text); }

/* Tier text */
.private-lessons-page .pl-tier-name {
  font-size: 26px;
  font-weight: 700;
  color: var(--pl-text);
  margin: 0 0 8px;
  line-height: 1.15;
}
.private-lessons-page .pl-tier-desc {
  font-size: 16px;
  font-weight: 400;
  color: var(--pl-text-soft);
  margin: 0 0 22px;
  line-height: 1.55;
}
.private-lessons-page .pl-tier-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 4px;
}
.private-lessons-page .pl-price-big {
  font-size: 42px;
  font-weight: 700;
  color: var(--pl-text);
  line-height: 1;
}
.private-lessons-page .pl-price-label {
  font-size: 16px;
  color: var(--pl-text-soft);
}
.private-lessons-page .pl-tier-nonmember {
  font-size: 14px;
  color: var(--pl-text-soft);
  margin: 0 0 22px;
}
.private-lessons-page .pl-divider {
  border: none;
  border-top: 1px solid var(--pl-border);
  margin: 18px 0;
}

/* Feature list */
.private-lessons-page .pl-features {
  list-style: none;
  padding: 0;
  margin: 0 0 26px;
}
.private-lessons-page .pl-feature {
  font-size: 16px;
  color: var(--pl-text);
  padding: 9px 0;
  border-bottom: 1px solid var(--pl-border);
  display: flex;
  align-items: flex-start;
  gap: 12px;
  line-height: 1.45;
}
.private-lessons-page .pl-features .pl-feature:last-child {
  border-bottom: none;
}
.private-lessons-page .pl-check-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  background: var(--pl-green);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 3px;
  border-radius: 50%;
}

/* ════════════════════════════════════════════════════════════
   CAROUSEL
════════════════════════════════════════════════════════════ */

/* Ensure nothing clips the control buttons at the right edge */
.private-lessons-page .pl-carousel-sec,
.private-lessons-page .pl-carousel-sec .pl-container,
.private-lessons-page .pl-carousel-header,
.private-lessons-page .pl-carousel-controls {
  overflow: visible;
}

.private-lessons-page .pl-carousel-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 28px;
}
.private-lessons-page .pl-carousel-controls {
  display: flex;
  gap: 10px;
  align-items: center;
  padding-right: 8px;
}
.private-lessons-page .pl-carousel-btn {
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: none;
  box-shadow: 0 0 0 1.5px #1c1c1c;
  color: var(--pl-text);
  border-radius: 50%;
  cursor: pointer;
  will-change: transform;
  transition: background .18s ease, color .18s ease,
              transform .18s ease, box-shadow .18s ease;
}
.private-lessons-page .pl-carousel-btn:hover {
  background: var(--pl-green);
  box-shadow: 0 0 0 1.5px var(--pl-green), 0 6px 18px rgba(106,163,8,.28);
  color: #fff;
  transform: translateZ(0) translateY(-2px);
}
.private-lessons-page .pl-carousel-btn:active {
  transform: translateZ(0) translateY(0);
  box-shadow: 0 0 0 1.5px var(--pl-green);
}

.private-lessons-page .pl-carousel-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 48px) / 4);
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding-bottom: 6px;
}
.private-lessons-page .pl-carousel-track::-webkit-scrollbar { display: none; }

.private-lessons-page .pl-carousel-slide {
  scroll-snap-align: start;
  position: relative;
  overflow: hidden;
  background: var(--pl-bg-grey);
  display: block !important;  /* global figure sets display:grid !important */
  padding: 0 !important;      /* global figure adds 15px top/left padding */
  margin: 0;                  /* global figure adds 1em top/bottom margin */
}
.private-lessons-page .pl-carousel-slide img {
  display: block;
  width: 100%;
  height: 360px;
  object-fit: cover;
  transition: transform .5s ease;
}
.private-lessons-page .pl-carousel-slide:hover img {
  transform: scale(1.04);
}
.private-lessons-page .pl-carousel-slide figcaption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 16px 18px;
  font-size: 15px;
  color: #fff;
  background: linear-gradient(to top, rgba(11,37,80,.92) 0%, rgba(11,37,80,.55) 60%, rgba(11,37,80,0) 100%);
  letter-spacing: .01em;
}
/* Strong overlay variant — toggled via ACF "Strong Caption Overlay" field */
.private-lessons-page .pl-overlay-strong .pl-carousel-slide figcaption {
  padding: 20px 18px 16px;
  background: linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(0,0,0,.72) 45%, rgba(0,0,0,.28) 75%, rgba(0,0,0,0) 100%);
}
.private-lessons-page .pl-carousel-slide figcaption strong {
  display: block;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--pl-green-lt);
  margin-bottom: 2px;
}

.private-lessons-page .pl-carousel-dots {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 22px;
}
.private-lessons-page .pl-carousel-dot {
  width: 28px;
  height: 4px;
  background: var(--pl-border);
  border: none;
  cursor: pointer;
  transition: background .18s ease;
  padding: 0;
}
.private-lessons-page .pl-carousel-dot.is-active {
  background: var(--pl-green);
}

/* ════════════════════════════════════════════════════════════
   PACKAGES TABLE
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-pkg-wrap {
  margin-top: 32px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--pl-border);
}
.private-lessons-page .pl-pkg-header,
.private-lessons-page .pl-pkg-row {
  display: grid;
  grid-template-columns: minmax(170px, 1.1fr) repeat(3, minmax(0, 1fr));
  min-width: 720px;
}
.private-lessons-page .pl-pkg-header {
  background: var(--pl-blue);
}
.private-lessons-page .pl-pkg-header-cell {
  font-size: 17px;
  font-weight: 500;
  color: #fff;
  padding: 18px 22px;
  text-align: center;
  letter-spacing: .04em;
}
.private-lessons-page .pl-pkg-header-cell:first-child {
  text-align: left;
  background: var(--pl-blue-dk);
  font-weight: 600;
}
.private-lessons-page .pl-pkg-header-cell:nth-child(3) {
  background: rgba(255,255,255,.10);
}
.private-lessons-page .pl-pkg-row {
  border-top: 1px solid var(--pl-border);
}
.private-lessons-page .pl-pkg-row:nth-child(odd)  { background: var(--pl-bg-soft); }
.private-lessons-page .pl-pkg-row:nth-child(even) { background: #fff; }

.private-lessons-page .pl-pkg-tier-cell {
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  border-right: 1px solid var(--pl-border);
}
.private-lessons-page .pl-pkg-tier-badge {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
  padding: 4px 10px;
  width: fit-content;
}
.private-lessons-page .pl-pkg-tier-rate {
  font-size: 16px;
  font-weight: 500;
  color: var(--pl-text-soft);
}
.private-lessons-page .pl-pkg-cell {
  padding: 22px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-right: 1px solid var(--pl-border);
}
.private-lessons-page .pl-pkg-cell:last-child {
  border-right: none;
}
.private-lessons-page .pl-pkg-price {
  font-size: 26px;
  font-weight: 700;
  color: var(--pl-text);
  line-height: 1;
}
.private-lessons-page .pl-pkg-vs {
  font-size: 15px;
  color: var(--pl-text-soft);
}
.private-lessons-page .pl-pkg-save {
  display: inline-block;
  font-size: 13px;
  font-weight: 600;
  background: var(--pl-green);
  color: #fff;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 4px 10px;
}
.private-lessons-page .pl-popular-col {
  background: transparent !important;
}
.private-lessons-page .pl-pkg-col-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--pl-green);
  text-transform: uppercase;
  letter-spacing: .12em;
}

/* ════════════════════════════════════════════════════════════
   CTA BANNER
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-cta {
  background: var(--pl-blue);
  padding: 5rem 40px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.private-lessons-page .pl-cta::before,
.private-lessons-page .pl-cta::after {
  content: "";
  position: absolute;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  pointer-events: none;
}
.private-lessons-page .pl-cta::before {
  top: -120px;
  left: -80px;
  background: var(--pl-green-lt);
  opacity: .12;
}
.private-lessons-page .pl-cta::after {
  bottom: -120px;
  right: -80px;
  background: var(--pl-green);
  opacity: .15;
}
.private-lessons-page .pl-cta .pl-container {
  position: relative;
  z-index: 1;
}
.private-lessons-page .pl-cta h2 {
  font-size: clamp(28px, 2vw + 16px, 44px);
  font-weight: 700;
  color: #fff;
  margin: 0 0 14px;
  line-height: 1.1;
}
.private-lessons-page .pl-cta p {
  font-size: 18px;
  color: rgba(255,255,255,.85);
  margin: 0 0 32px;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}
.private-lessons-page .pl-cta-row {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: center;
}
.private-lessons-page .pl-cta-btn {
  background: rgba(255,255,255,.10);
  color: #fff;
  border: 2px solid rgba(255,255,255,.45);
  font-size: 17px;
  padding: 14px 28px;
}
.private-lessons-page .pl-cta-btn:hover {
  background: #fff;
  color: var(--pl-text);
  border-color: #fff;
}
.private-lessons-page .pl-cta-btn-green {
  background: var(--pl-green);
  color: #fff;
  border-color: var(--pl-green);
}
.private-lessons-page .pl-cta-btn-green:hover {
  background: var(--pl-green-lt);
  color: var(--pl-text);
  border-color: var(--pl-green-lt);
}

/* ════════════════════════════════════════════════════════════
   CONTACT / FORM SECTION
════════════════════════════════════════════════════════════ */

.private-lessons-page .pl-contact-sec {
  padding: 5rem 40px;
  background: var(--pl-bg-soft);
}
.private-lessons-page .pl-contact-grid {
  max-width: 1280px;
  margin: 0 auto;
  display: block;
}
.private-lessons-page .pl-contact-info {
  margin-bottom: 2.5rem;
}

/* Video thumbnail */
.private-lessons-page .pl-contact-photo {
  display: block !important; /* global figure sets display:grid !important — must override */
  margin-top: 2rem;
  position: relative;
  padding: 0 !important;     /* global figure adds 15px top/left padding */
}
.private-lessons-page .pl-video-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  background: var(--pl-blue-dk);
  overflow: hidden;
  cursor: pointer;
  display: block;
}
.private-lessons-page .pl-video-frame picture { display: block; width: 100%; height: 100%; }
.private-lessons-page .pl-video-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  display: block;
  filter: brightness(.72) saturate(1.05);
  transition: filter .25s ease, transform .6s ease;
}
.private-lessons-page .pl-video-frame:hover img {
  filter: brightness(.62) saturate(1.05);
  transform: scale(1.02);
}
/* No-overlay mode — static photo at full brightness, no pointer cursor */
.private-lessons-page .pl-no-overlay .pl-video-frame {
  cursor: default;
}
.private-lessons-page .pl-no-overlay .pl-video-frame img {
  filter: none;
}
.private-lessons-page .pl-no-overlay .pl-video-frame:hover img {
  filter: none;
  transform: none;
}
.private-lessons-page .pl-video-frame .pl-video-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.private-lessons-page .pl-play-btn {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.private-lessons-page .pl-play-btn::before {
  content: "";
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  transition: transform .25s ease, background .25s ease;
}
.private-lessons-page .pl-video-frame:hover .pl-play-btn::before {
  transform: scale(1.06);
  background: var(--pl-green);
}
.private-lessons-page .pl-play-btn::after {
  content: "";
  position: absolute;
  width: 0; height: 0;
  border-style: solid;
  border-width: 14px 0 14px 22px;
  border-color: transparent transparent transparent var(--pl-blue-dk);
  margin-left: 6px;
  transition: border-color .25s ease;
}
.private-lessons-page .pl-video-frame:hover .pl-play-btn::after {
  border-color: transparent transparent transparent #fff;
}
.private-lessons-page .pl-video-meta {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 18px 20px 16px;
  background: linear-gradient(to top, rgba(11,37,80,.85) 0%, rgba(11,37,80,0) 100%);
  color: #fff;
  pointer-events: none;
}
.private-lessons-page .pl-video-title {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.private-lessons-page .pl-video-duration {
  font-size: 12px;
  font-weight: 500;
  opacity: .85;
  letter-spacing: .04em;
}

/* Form wrapper — styles the shortcode output container */
.private-lessons-page .pl-contact-form-wrap {
  background: #fff;
  padding: 2.5rem;
  border: 1px solid var(--pl-border);
}

/* ── Desktop carousel: 4-up, hide nav only when all slides fit ── */
@media (min-width: 1025px) {
  .private-lessons-page .pl-carousel-sec:not(.has-overflow) .pl-carousel-controls,
  .private-lessons-page .pl-carousel-sec:not(.has-overflow) .pl-carousel-dots { display: none; }
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════════════════════ */

/* ── Tablet (≤1024px) ─────────────────────────────────────── */
@media (max-width: 1024px) {
  .private-lessons-page .pl-sec,
  .private-lessons-page .pl-cta,
  .private-lessons-page .pl-contact-sec { padding: 4rem 32px; }
  .private-lessons-page .pl-hero-content { padding: 4rem 32px; }

  .private-lessons-page .pl-tiers-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
  .private-lessons-page .pl-tier-card { padding: 0 24px 28px; }
  .private-lessons-page .pl-tier-img { margin: 0 -24px 20px; width: calc(100% + 48px) !important; }
  .private-lessons-page .pl-tier-img img { height: 200px !important; }

  .private-lessons-page .pl-carousel-track { grid-auto-columns: calc((100% - 32px) / 3); }
  .private-lessons-page .pl-carousel-controls,
  .private-lessons-page .pl-carousel-dots { display: flex; }
}

@media (max-width: 900px) {
  .private-lessons-page .pl-carousel-track {
    grid-auto-columns: calc((100% - 16px) / 2);
  }
  .private-lessons-page .pl-carousel-slide img { height: 320px; }

  .private-lessons-page .pl-pkg-header,
  .private-lessons-page .pl-pkg-row {
    grid-template-columns: minmax(140px, 0.9fr) repeat(3, minmax(0, 1fr));
    min-width: 0;
  }
  .private-lessons-page .pl-pkg-tier-cell { padding: 18px; }
  .private-lessons-page .pl-pkg-cell { padding: 18px 12px; }
  .private-lessons-page .pl-pkg-price { font-size: 22px; }
  .private-lessons-page .pl-pkg-vs,
  .private-lessons-page .pl-pkg-tier-rate { font-size: 14px; }
}

@media (max-width: 900px) {
  .private-lessons-page .pl-stat-row { grid-template-columns: 1fr 1fr; }
}

/* ── Larger than tablet — about + contact 2-col ──────────── */
@media (min-width: 960px) {
  .private-lessons-page .pl-about-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 4rem;
    align-items: center;
  }
  .private-lessons-page .pl-about-img {
    display: block;
    height: 500px;
  }
  .private-lessons-page .pl-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 4rem;
    align-items: start;
  }
  .private-lessons-page .pl-contact-info { margin-bottom: 0; max-width: 460px; }
}

@media (min-width: 1280px) {
  .private-lessons-page .pl-about-grid { grid-template-columns: 1fr 1.1fr; gap: 5rem; }
  .private-lessons-page .pl-about-img  { height: 580px; }
  .private-lessons-page .pl-sec,
  .private-lessons-page .pl-cta,
  .private-lessons-page .pl-contact-sec { padding: 6rem 40px; }
}

@media (min-width: 1600px) {
  .private-lessons-page .pl-container { max-width: 1440px; }
  .private-lessons-page .pl-hero-content { max-width: 800px; padding: 6rem 40px; }
}

/* ── Mobile ≤768px — disable scroll animations so content is always visible.
   IntersectionObserver is unreliable on iOS Safari and adds no value on
   small screens where users scroll quickly. ──────────────────────────────── */
@media (max-width: 768px) {
  .private-lessons-page .pl-fade-up {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ── Mobile (≤640px) ──────────────────────────────────────── */
@media (max-width: 640px) {
  .private-lessons-page .pl-hero { min-height: 440px; }
  .private-lessons-page .pl-hero-content { padding: 2.75rem 20px 2.5rem; }
  .private-lessons-page .pl-hero-body { font-size: 17px; }

  .private-lessons-page .pl-sec,
  .private-lessons-page .pl-cta,
  .private-lessons-page .pl-contact-sec { padding: 2.75rem 20px; }

  .private-lessons-page .pl-ss { font-size: 16px; }
  .private-lessons-page .pl-policy-grid { grid-template-columns: 1fr; }
  .private-lessons-page .pl-stat-row { grid-template-columns: 1fr; gap: 1.5rem; }

  .private-lessons-page .pl-tiers-grid {
    grid-template-columns: 1fr;
    max-width: 480px;
    margin-inline: auto;
    gap: 18px;
  }
  .private-lessons-page .pl-tier-card { padding: 0 22px 26px; }
  .private-lessons-page .pl-tier-img { margin: 0 -22px 18px; width: calc(100% + 44px) !important; }
  .private-lessons-page .pl-tier-img img { height: 180px !important; }

  .private-lessons-page .pl-tiers-header { flex-direction: column; align-items: flex-start; gap: 16px; }
  .private-lessons-page .pl-carousel-header { flex-direction: column; align-items: flex-start; gap: 16px; }
  .private-lessons-page .pl-carousel-controls { display: none; }
  .private-lessons-page .pl-carousel-track { grid-auto-columns: 100%; }
  .private-lessons-page .pl-carousel-slide img { height: 280px; }

  .private-lessons-page .pl-section-rule-label { font-size: 13px; padding: 6px 16px; }

  /* Packages mobile cards */
  .private-lessons-page .pl-pkg-wrap {
    border: none;
    background: transparent;
    overflow: visible;
    margin-top: 24px;
  }
  .private-lessons-page .pl-pkg-row + .pl-pkg-row {
    margin-top: 36px;
  }
  .private-lessons-page .pl-pkg-header { display: none; }
  .private-lessons-page .pl-pkg-row {
    display: block;
    min-width: 0;
    background: #fff !important;
    border: 1px solid var(--pl-border);
    border-radius: 12px;
    overflow: hidden;
    padding: 0;
  }
  .private-lessons-page .pl-pkg-tier-cell {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    background: var(--pl-blue-dk);
    border-right: none;
    border-bottom: 1px solid var(--pl-border);
  }
  .private-lessons-page .pl-pkg-tier-cell .pl-pkg-tier-rate {
    color: rgba(255,255,255,.85);
    font-size: 15px;
  }
  .private-lessons-page .pl-pkg-cell {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "label price" "compare save";
    column-gap: 16px;
    row-gap: 4px;
    text-align: left;
    align-items: center;
    padding: 16px 18px;
    border-right: none;
    border-bottom: 1px solid var(--pl-border);
    background: #fff;
  }
  .private-lessons-page .pl-pkg-cell:last-child { border-bottom: none; }
  .private-lessons-page .pl-pkg-cell::before {
    grid-area: label;
    font-size: 13px;
    font-weight: 600;
    color: var(--pl-text-soft);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-family: "Barlow", sans-serif;
  }
  .private-lessons-page .pl-pkg-row .pl-pkg-cell:nth-of-type(2)::before { content: "4 Lessons"; }
  .private-lessons-page .pl-pkg-row .pl-pkg-cell:nth-of-type(3)::before { content: "8 Lessons"; }
  .private-lessons-page .pl-pkg-row .pl-pkg-cell:nth-of-type(4)::before { content: "12 Lessons"; }
  .private-lessons-page .pl-popular-col {
    background: linear-gradient(180deg, rgba(154,205,50,.16), rgba(154,205,50,.06)) !important;
    position: relative;
    padding-top: 46px; /* carve out space for the badge above the grid rows */
  }
  .private-lessons-page .pl-popular-col::after {
    content: "Most popular";
    position: absolute;
    top: 12px; left: 18px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    background: var(--pl-green);
    color: #fff;
    padding: 3px 8px;
    border-radius: 4px;
    font-family: "Barlow", sans-serif;
  }
  .private-lessons-page .pl-pkg-col-label { display: none; }
  .private-lessons-page .pl-pkg-price {
    grid-area: price;
    font-size: 22px;
    text-align: right;
  }
  .private-lessons-page .pl-pkg-vs { grid-area: compare; font-size: 14px; }
  .private-lessons-page .pl-pkg-save { grid-area: save; justify-self: end; }

  .private-lessons-page .pl-cta-row { flex-direction: column; align-items: stretch; }
  .private-lessons-page .pl-cta-btn { width: 100%; }

  .private-lessons-page .pl-contact-form-wrap { padding: 1.5rem; }
  .private-lessons-page .pl-contact-form-wrap .frm_form_field:has(select) { grid-column: 1 / -1; }
}

/* ════════════════════════════════════════════════════════════
   FORMIDABLE FORMS — Private Lessons contact form only.
   Scoped to .private-lessons-page .pl-contact-form-wrap so
   NO other Formidable forms on the site are affected.
   Extra safety: also requires the CSS class "pl-contact-form"
   set on the form in Formidable → Form Settings → CSS Class.
════════════════════════════════════════════════════════════ */

/* ── Box-sizing & inherited style reset ──────────────────── */
.private-lessons-page .pl-contact-form-wrap,
.private-lessons-page .pl-contact-form-wrap * {
  box-sizing: border-box;
}

/* ── Form shell ─────────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm-show-form,
.private-lessons-page .pl-contact-form-wrap form {
  font-family: "Barlow", system-ui, sans-serif;
  color: var(--pl-text);
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ── Field rows & two-column grid ───────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm_form_fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
/* Fieldset is the only direct child — span both columns so the
   inner 12-col sub-grid gets the full container width (not half). */
.private-lessons-page .pl-contact-form-wrap .frm_form_fields > fieldset {
  grid-column: 1 / -1;
}
/* position:relative gives the hidden Select2 accessible <select>
   a containing block so width:100% resolves against the field
   (≈305px) instead of the viewport (≈1526px), preventing overflow. */
.private-lessons-page .pl-contact-form-wrap .frm_form_field {
  position: relative;
}
/* Full-width fields: textarea, message, captcha, submit row */
.private-lessons-page .pl-contact-form-wrap .frm_form_field.frm_full,
.private-lessons-page .pl-contact-form-wrap .frm_form_field.frm_section_heading,
.private-lessons-page .pl-contact-form-wrap .frm_submit,
.private-lessons-page .pl-contact-form-wrap .frm_form_field:has(textarea),
.private-lessons-page .pl-contact-form-wrap .frm_form_field:has(.cf-turnstile),
.private-lessons-page .pl-contact-form-wrap .frm_form_field:has([class*="turnstile"]) {
  grid-column: 1 / -1;
}
/* Select fields sit 2-up on desktop; stack on mobile (see ≤640px override below) */

/* ── Labels ─────────────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm_primary_label,
.private-lessons-page .pl-contact-form-wrap label {
  font-family: "Barlow", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--pl-text);
  display: block;
  margin-bottom: 8px;
  text-transform: none;
  letter-spacing: 0;
}
.private-lessons-page .pl-contact-form-wrap .frm_opt_container label {
  font-weight: 400;
  font-size: 15px;
}

/* ── Inputs, selects ────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap input[type="text"],
.private-lessons-page .pl-contact-form-wrap input[type="email"],
.private-lessons-page .pl-contact-form-wrap input[type="tel"],
.private-lessons-page .pl-contact-form-wrap input[type="number"],
.private-lessons-page .pl-contact-form-wrap input[type="url"],
.private-lessons-page .pl-contact-form-wrap select {
  font-family: "Barlow", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  padding: 14px 18px !important;
  border-radius: 38px !important;
  border: 1px solid var(--pl-border) !important;
  background: #fff !important;
  color: var(--pl-text) !important;
  width: 100% !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
  outline: none !important;
  transition: border-color .18s ease, box-shadow .18s ease;
  -webkit-appearance: none;
  appearance: none;
}
/* Keep select arrow visible */
.private-lessons-page .pl-contact-form-wrap select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23707070' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 18px center !important;
  padding-right: 44px !important;
}

/* ── intl-tel-input phone field wrapper ─────────────────── */
.private-lessons-page .pl-contact-form-wrap .iti {
  width: 100%;
  display: block;
}
.private-lessons-page .pl-contact-form-wrap .iti input[type="tel"] {
  padding-left: 54px !important;
}
.private-lessons-page .pl-contact-form-wrap .iti__selected-country-primary,
.private-lessons-page .pl-contact-form-wrap .iti__selected-country-primary:hover {
  border-radius: 38px 0 0 38px;
  background: transparent !important;
}

/* ── Textarea ───────────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap textarea {
  font-family: "Barlow", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  padding: 14px 18px !important;
  border-radius: 22px !important;
  border: 1px solid var(--pl-border) !important;
  background: #fff !important;
  color: var(--pl-text) !important;
  width: 100% !important;
  min-height: 80px;
  resize: vertical;
  line-height: 1.55;
  box-shadow: none !important;
  transition: border-color .18s ease, box-shadow .18s ease;
}

/* ── Focus states ───────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap input:focus,
.private-lessons-page .pl-contact-form-wrap select:focus,
.private-lessons-page .pl-contact-form-wrap textarea:focus {
  outline: none !important;
  border-color: var(--pl-green) !important;
  box-shadow: 0 0 0 4px rgba(106,163,8,.12) !important;
}

/* ── Placeholder ────────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap input::placeholder,
.private-lessons-page .pl-contact-form-wrap textarea::placeholder {
  color: #a8a8a8;
}

/* ── Submit button ──────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm_submit {
  margin-top: 0 !important;
}
.private-lessons-page .pl-contact-form-wrap .frm_submit button,
.private-lessons-page .pl-contact-form-wrap .frm_submit input[type="submit"],
.private-lessons-page .pl-contact-form-wrap .frm_button_submit {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Barlow", sans-serif;
  font-size: 18px;
  font-weight: 500;
  padding: 15px 38px;
  border-radius: 38px;
  border: 2px solid var(--pl-green);
  background: var(--pl-green);
  color: #fff;
  cursor: pointer;
  line-height: 1;
  letter-spacing: .01em;
  transition: background .18s ease, border-color .18s ease, color .18s ease,
              transform .18s ease, box-shadow .18s ease;
}
.private-lessons-page .pl-contact-form-wrap .frm_submit button:hover,
.private-lessons-page .pl-contact-form-wrap .frm_submit input[type="submit"]:hover,
.private-lessons-page .pl-contact-form-wrap .frm_button_submit:hover {
  background: var(--pl-green-lt);
  border-color: var(--pl-green-lt);
  color: var(--pl-text);
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(28,28,28,.12);
}

/* ── Validation errors ──────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm_error,
.private-lessons-page .pl-contact-form-wrap .frm_error_style {
  font-family: "Barlow", sans-serif;
  font-size: 13px;
  color: var(--pl-red);
  margin-top: 6px;
}
.private-lessons-page .pl-contact-form-wrap input.frm_invalid,
.private-lessons-page .pl-contact-form-wrap textarea.frm_invalid,
.private-lessons-page .pl-contact-form-wrap select.frm_invalid {
  border-color: var(--pl-red);
  box-shadow: 0 0 0 3px rgba(199,22,22,.10);
}

/* ── Success message ────────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm_message,
.private-lessons-page .pl-contact-form-wrap .frm_message p {
  font-family: "Barlow", sans-serif;
  font-size: 16px;
  color: var(--pl-green);
  background: var(--pl-green-mist);
  border-left: 3px solid var(--pl-green);
  padding: 14px 18px;
  border-radius: 0 4px 4px 0;
  margin: 0;
}

/* ── Cloudflare Turnstile — center it ───────────────────── */
.private-lessons-page .pl-contact-form-wrap .cf-turnstile,
.private-lessons-page .pl-contact-form-wrap [class*="turnstile"] {
  margin-top: 0 !important;
}

/* ── Required asterisk ──────────────────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm_required {
  color: var(--pl-red);
  margin-left: 2px;
}

/* ── Description / helper text ─────────────────────────── */
.private-lessons-page .pl-contact-form-wrap .frm_description,
.private-lessons-page .pl-contact-form-wrap .frm_help {
  font-family: "Barlow", sans-serif;
  font-size: 13px;
  color: var(--pl-text-soft);
  margin-top: 5px;
}

/* ── Select2 overrides ──────────────────────────────────── */
/* main.js runs $(".frm_forms select").select2() globally;
   these rules style the replacement widget to match our design. */

/* Belt-and-suspenders: clamp the hidden accessible <select> so
   its position:absolute + width:100% can't overflow the viewport
   even if the containing-block chain changes unexpectedly. */
.private-lessons-page .pl-contact-form-wrap .select2-hidden-accessible {
  width: 1px !important;
}

.private-lessons-page .pl-contact-form-wrap .select2-container {
  width: 100% !important;
  display: block !important;
}
.private-lessons-page .pl-contact-form-wrap .select2-container .select2-selection--single {
  height: auto !important;
  padding: 14px 44px 14px 18px !important;
  border-radius: 38px !important;
  border: 1px solid var(--pl-border) !important;
  background: #fff !important;
  box-shadow: none !important;
  outline: none !important;
  font-family: "Barlow", sans-serif !important;
}
.private-lessons-page .pl-contact-form-wrap .select2-container .select2-selection__rendered {
  font-family: "Barlow", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: var(--pl-text) !important;
  line-height: 1.4 !important;
  padding: 0 !important;
}
.private-lessons-page .pl-contact-form-wrap .select2-container .select2-selection__placeholder {
  color: #a8a8a8 !important;
}
.private-lessons-page .pl-contact-form-wrap .select2-container .select2-selection__arrow {
  position: absolute !important;
  top: 50% !important;
  right: 18px !important;
  transform: translateY(-50%) !important;
  width: auto !important;
  height: auto !important;
}
.private-lessons-page .pl-contact-form-wrap .select2-container .select2-selection__arrow b {
  border-color: #707070 transparent transparent transparent !important;
  border-style: solid !important;
  border-width: 5px 4px 0 !important;
  margin: 0 !important;
  position: static !important;
}
.private-lessons-page .pl-contact-form-wrap .select2-container--focus .select2-selection--single,
.private-lessons-page .pl-contact-form-wrap .select2-container--open .select2-selection--single {
  border-color: var(--pl-green) !important;
  box-shadow: 0 0 0 4px rgba(106,163,8,.12) !important;
}

/* ── Mobile: single column ──────────────────────────────── */
@media (max-width: 640px) {
  .private-lessons-page .pl-contact-form-wrap .frm_form_fields {
    grid-template-columns: 1fr;
  }
  .private-lessons-page .pl-contact-form-wrap .frm_form_field:has(select) {
    grid-column: 1;
  }
}

/* ── Very small phones (≤380px) — Turnstile widget is 300px fixed-width ── */
@media (max-width: 380px) {
  .private-lessons-page .pl-contact-form-wrap {
    padding: 1rem; /* tighten from 1.5rem to reclaim 16px total */
  }
  .private-lessons-page .pl-contact-form-wrap .cf-turnstile,
  .private-lessons-page .pl-contact-form-wrap [class*="turnstile"] {
    transform: scale(0.82);
    transform-origin: left center;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .private-lessons-page *,
  .private-lessons-page *::before,
  .private-lessons-page *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .private-lessons-page .pl-fade-up { opacity: 1; transform: none; }
}

/* ════════════════════════════════════════════════════════════
   BODY BACKGROUND — Private Lessons template only (desktop)
   ════════════════════════════════════════════════════════════
   The global theme renders a `<section class="home-contact-section">`
   "Get In Touch" CTA above the real <footer>. It has `margin-top: 234px`,
   and because margins live *outside* the box, that 234px reveals the
   page's body background as a white strip below this template's
   light-grey contact section. Painting just the body the same
   `--pl-bg-soft` (#F8F8F8) the contact section uses makes that gap
   blend seamlessly into the section above without touching the global
   footer's blue CTA at all. Scoped to desktop because the seam doesn't
   show on mobile, and to `body.page-template-template-private-lessons`
   (the class WordPress emits from this template's filename) so no
   other page on the site is affected. */
@media (min-width: 1025px) {
  body.page-template-template-private-lessons {
    background-color: #F8F8F8;
  }
}
