.pay-section { background: linear-gradient(135deg, #edf7ff, #d9edfc); }
    .membership-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 88px; align-items: start; }
    .section-intro { position: sticky; top: 112px; }
    .section-intro h2 { max-width: 470px; }
    .section-intro > p:not(.eyebrow) { max-width: 470px; margin-top: 24px; color: #3f6277; font-size: 1.05rem; }
    .access-note { display: flex; gap: 12px; align-items: flex-start; margin-top: 28px; padding: 18px; color: #27495e; background: rgba(255,255,255,.58); border-left: 4px solid var(--cyan); }
    .access-note svg { flex: 0 0 auto; width: 22px; fill: none; stroke: var(--blue); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .access-note strong { display: block; margin-bottom: 3px; color: var(--navy); }
    .access-note p { margin: 0; font-size: .9rem; }

    .price-list { border-top: 1px solid rgba(7,31,54,.22); }
    .price-row {
      display: grid;
      grid-template-columns: 56px 1fr auto;
      gap: 22px;
      align-items: center;
      min-height: 118px;
      padding: 20px 4px;
      border-bottom: 1px solid rgba(7,31,54,.22);
    }
    .price-index { color: var(--blue); font-weight: 900; }
    .price-row h3 { margin-bottom: 5px; }
    .price-row p { margin: 0; color: var(--muted); font-size: .92rem; }
    .price { color: var(--navy); font-family: "Manrope", sans-serif; font-size: 2.2rem; font-weight: 800; white-space: nowrap; }
    .price small { display: block; color: var(--muted); font-family: "DM Sans", sans-serif; font-size: .7rem; font-weight: 700; text-align: right; text-transform: uppercase; }
    .annual-section { background: #fff; }
    .annual-heading { display: grid; grid-template-columns: 1fr .9fr; gap: 70px; align-items: end; margin-bottom: 52px; }
    .annual-heading h1 { font-family: "Manrope", system-ui, sans-serif; font-size: 4.51rem; font-weight: 800; }
    .annual-heading p:last-child { max-width: 520px; margin: 0; color: var(--muted); font-size: 1.05rem; }
    .plan-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; }
    .plan {
      position: relative;
      min-height: 242px;
      overflow: hidden;
      padding: 26px;
      color: white;
      background: #07588f;
      border-radius: var(--radius);
    }
    .plan:nth-child(1), .plan:nth-child(2), .plan:nth-child(3) { grid-column: span 4; }
    .plan:nth-child(4), .plan:nth-child(5) { grid-column: span 6; }
    .plan::after { content: ""; position: absolute; right: -34px; bottom: -42px; width: 120px; aspect-ratio: 1; border: 2px solid rgba(56,156,233,.48); border-radius: 50%; }
    .plan h3 { color: white; font-size: 1.55rem; }
    .plan .plan-price { margin: 48px 0 0; color: #ffe36a; font-family: "Archivo Black", sans-serif; font-size: 2.85rem; line-height: 1; }
    .plan .plan-price span { font-family: "DM Sans", sans-serif; font-size: .76rem; font-weight: 700; text-transform: uppercase; }
    .plan p:last-child { max-width: 290px; margin: 14px 0 0; color: #bdd3df; font-size: .9rem; }
    .extras-section { background: var(--cream); }
    .extras-section.section-pad { padding: 58px 0; }
    .extras-layout { display: grid; grid-template-columns: .65fr 1.35fr; gap: 54px; align-items: start; }
    .extras-layout h2 { max-width: 390px; font-size: clamp(2.35rem, 4vw, 3.2rem); }
    .extras-table { border-top: 1px solid rgba(16,42,66,.22); }
    .extra-row { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; min-height: 56px; border-bottom: 1px solid rgba(16,42,66,.22); }
    .extra-row strong { font-size: 1.02rem; }
    .extra-row span { color: var(--blue); font-family: "Manrope", sans-serif; font-size: 1.25rem; font-weight: 800; white-space: nowrap; }
    .key-note { margin-top: 16px; color: var(--muted); font-size: .86rem; }

    .payment-section { color: var(--ink); background: #e8f4fd; }
    .payment-section h2, .payment-section h3 { color: var(--navy); }
    .payment-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
    .contact-panel, .payment-panel { min-height: 400px; padding: 64px max(5vw, 64px); }
    .contact-panel { padding-left: max(64px, 5vw, calc((100vw - 1180px) / 2)); background: #d9edfc; }
    .payment-panel { color: var(--ink); background: #f0f8fe; border-left: 1px solid rgba(16,42,66,.12); }
    .payment-panel h2 { color: var(--navy); }
    .contact-panel > p:not(.eyebrow), .payment-panel > p:not(.eyebrow) { max-width: 520px; margin-top: 22px; }
    .contact-details { display: grid; gap: 14px; margin: 32px 0; }
    .contact-details a { display: inline-flex; width: fit-content; align-items: center; gap: 12px; color: var(--navy); font-size: 1.06rem; font-weight: 750; text-decoration: none; }
    .contact-details a { max-width: 100%; overflow-wrap: anywhere; }
    .contact-details svg { width: 20px; fill: none; stroke: var(--cyan); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .button-cyan { color: white; background: var(--blue); }
    .button.button-cyan:hover { color: white; background: var(--navy-2); border-color: transparent; }

    .join-band { background: url("../images/team-court.webp") center 44% / cover no-repeat; }
    .join-overlay { background: linear-gradient(90deg, rgba(35,31,32,.96), rgba(35,31,32,.84) 55%, rgba(35,31,32,.36)); }
    .join-inner { min-height: 390px; display: flex; align-items: center; justify-content: space-between; gap: 54px; }
    .join-band h2 { max-width: 700px; color: white; }
    .join-band p:not(.eyebrow) { max-width: 590px; margin-top: 18px; color: #d4e4e9; }
    .join-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; }
    .join-band .button-yellow { color: white; background: var(--blue); border-color: var(--blue); }
    .join-band .button-yellow:hover { color: white; background: var(--navy-2); border-color: var(--navy-2); }

    @media (max-width: 1060px) {
      .contact-panel { padding-left: 24px; }
      .annual-heading h1 { font-size: 3.8rem; }
      .membership-layout, .extras-layout { grid-template-columns: 1fr; gap: 46px; }
      .section-intro { position: static; }
      .plan:nth-child(n) { grid-column: span 6; }
    }

    @media (max-width: 820px) {
      .annual-heading { grid-template-columns: 1fr; gap: 20px; }
      .annual-heading h1 { font-size: 3.3rem; }
      .payment-layout { grid-template-columns: 1fr; }
      .contact-panel, .payment-panel { min-height: auto; padding: 60px 32px; }
      .contact-panel { padding-left: 16px; }
      .join-inner { min-height: 430px; flex-direction: column; align-items: flex-start; justify-content: center; }
      .join-actions { justify-content: flex-start; }
    }

    @media (max-width: 600px) {
      .annual-section.section-pad { padding-top: 44px; padding-bottom: 44px; }
      .annual-heading h1 { font-size: 3.476rem; }
      .pay-section.section-pad { padding-top: 48px; }
      .section-intro h2 { font-size: 2.695rem; }
      .price-row { grid-template-columns: 38px 1fr; gap: 12px; min-height: 128px; }
      .price { grid-column: 2; font-size: 1.85rem; }
      .price small { display: inline; margin-left: 6px; }
      .plan-grid { grid-template-columns: 1fr; }
      .plan:nth-child(n) { grid-column: auto; min-height: 220px; }
      .extra-row { grid-template-columns: 1fr; gap: 3px; padding: 14px 0; }
      .extras-section.section-pad { padding: 46px 0 32px; }
      .extras-layout h2 { font-size: 2.585rem; }
      .contact-panel, .payment-panel { padding: 42px 26px 50px; }
      .contact-panel h2, .payment-panel h2, .join-band h2 { font-size: 2.695rem; }
      .join-inner { min-height: 500px; }
      .join-actions { flex-direction: column; width: 100%; max-width: 260px; }
    }

    @media (min-width: 341px) and (max-width: 420px) {
      .annual-heading { overflow: hidden; }
      .annual-heading h1 { transform: scaleX(.91); transform-origin: left top; }
    }

    @media (max-width: 340px) {
      .annual-heading h1 { font-size: 2.75rem; }
    }