/* hsc-camp.css — calmer calls to action for the camp + booking pages.
   Loaded after hsc.css on /swim-camps/ and /clinic-booking/ only.

   Buttons: red with dark text, the same as every other page (Brian,
   18 Oct 2026: red on some pages and green on others was confusing; green
   was his pick on 2026-09-30, so --cta-bg is the one switch if he wants it back). Links: the text colour, underlined,
   never browser blue or red. */
:root {
  --cta-bg: #FF2E20;
  --cta-fg: #0A0807;
  --link: #F2EEEB;
  --link-line: rgba(242, 238, 235, 0.45);
}

.btn-primary { background: var(--cta-bg); color: var(--cta-fg); letter-spacing: 0.04em; }
.btn-primary:hover { opacity: 0.9; }
.btn-outline { letter-spacing: 0.04em; }

main p a:not([class]), main li a:not([class]), .faq-answer-inner a {
  color: var(--link);
  text-decoration: underline;
  text-decoration-color: var(--link-line);
  text-underline-offset: 3px;
}
main p a:not([class]):hover, main li a:not([class]):hover, .faq-answer-inner a:hover {
  text-decoration-color: var(--link);
}

/* No one-word last lines on phones */
main p, main li, .faq-answer-inner, .waitlist-copy p, .coach-banner p { text-wrap: pretty; }
main h1, main h2, main h3, .waitlist-copy h2, .coach-banner h2 { text-wrap: balance; }

/* Big red blocks toned down: the closing banner and waiting-list strip sit on
   the dark surface, with the green button doing the work. */
.coach-banner { background: var(--bg2, #141110); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.coach-banner h2 { color: var(--text); }
.coach-banner p { color: var(--mid); }
.coach-banner .btn-dark { background: var(--cta-bg); color: var(--cta-fg); border: none; }
.waitlist-strip { border-top-color: var(--rule); }
.waitlist-btn { background: var(--cta-bg); color: var(--cta-fg); font-family: var(--font-body); font-size: 14px; font-weight: 700; letter-spacing: 0.02em; text-transform: none; }
.camp-card { border-top-color: rgba(242, 238, 235, 0.35) !important; }
.service-card[style*="rgba(255,46,32"] { border-color: rgba(242, 238, 235, 0.35) !important; }

/* Readability: buttons and small labels in normal case (long runs of spaced
   capitals were hard to read); a touch more air in the condensed headings. */
.btn-primary, .btn-outline, .btn-dark { text-transform: none; font-size: 15px; letter-spacing: 0.01em; }
main .label, .waitlist-copy .label { font-family: var(--font-body); text-transform: none; letter-spacing: 0.02em; font-size: 14px; font-weight: 600; }
main h1, main h2, main h3, .waitlist-copy h2, .coach-banner h2 { letter-spacing: 0.025em; }
.cb-step > h3, .cb-panel h2 { letter-spacing: 0.04em; }

/* ── Camp motion: speed, shine, power (Oct 2026) ─────────────────────────
   Speed streaks race across camp panels; a gloss sweeps across the green
   buttons; picked days pop and the total flashes. Decoration only: the
   streak markup is aria-hidden, animations are transform/opacity (no layout
   shift), and none of it runs for prefers-reduced-motion. */
.hsc-streaks { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.hsc-streaks i { position: absolute; left: -40%; height: 2px; width: 30%; border-radius: 2px; opacity: 0;
  background: linear-gradient(90deg, rgba(255,46,32,0), rgba(255,46,32,.55), rgba(242,238,235,.8)); }
.hsc-streaks i:nth-child(1) { top: 18%; --d: 1.6s; width: 34%; animation-delay: .1s; }
.hsc-streaks i:nth-child(2) { top: 34%; --d: 2.1s; width: 22%; animation-delay: .9s; }
.hsc-streaks i:nth-child(3) { top: 52%; --d: 1.4s; width: 40%; animation-delay: .4s; }
.hsc-streaks i:nth-child(4) { top: 67%; --d: 1.9s; width: 26%; animation-delay: 1.4s; }
.hsc-streaks i:nth-child(5) { top: 82%; --d: 1.7s; width: 30%; animation-delay: .7s; }
.hsc-streaks i:nth-child(6) { top: 9%;  --d: 2.4s; width: 18%; animation-delay: 1.8s; }
.camp-live { position: relative; overflow: hidden; isolation: isolate; }
.camp-live > :not(.hsc-streaks) { position: relative; z-index: 2; }
.btn-primary, .cb-btn { position: relative; overflow: hidden; }
@media (prefers-reduced-motion: no-preference) {
  .hsc-streaks i { animation: hsc-streak var(--d) cubic-bezier(.3,.1,.3,1) infinite; }
  .btn-primary::after, .cb-btn:not(:disabled)::after { content: ""; position: absolute; top: -30%; bottom: -30%; width: 42%; left: -60%;
    background: linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-20deg); animation: hsc-shine 3.2s ease-in-out infinite; pointer-events: none; }
  .cb-btn.ghost::after, .btn-outline::after { display: none; }
  .hsc-pop { animation: hsc-pop .35s cubic-bezier(.2,.9,.3,1.5); }
  .hsc-flash { animation: hsc-flash .6s ease-out; }
}
@keyframes hsc-streak { 0% { transform: translateX(0); opacity: 0; } 10% { opacity: .9; } 70% { opacity: .6; } 100% { transform: translateX(420%); opacity: 0; } }
@keyframes hsc-shine { 0%, 55% { left: -60%; } 85%, 100% { left: 130%; } }
@keyframes hsc-pop { 0% { transform: scale(1); } 40% { transform: scale(1.08); } 100% { transform: scale(1); } }
@keyframes hsc-flash { 0% { background: rgba(255,46,32,.45); } 100% { background: transparent; } }