/* Brand styling is scoped to individual plan pages and the Costa landing page. */
.client-plan-surface .plan-brand-link { display: inline-flex; color: inherit; text-decoration: none; }
.costa-wordmark { display: inline-flex; flex-direction: column; gap: .35rem; font-family: Inter, sans-serif; line-height: 1.1; }
.costa-wordmark strong { font-size: 1.1rem; letter-spacing: -.025em; font-weight: 800; }
.costa-wordmark > span { font-size: .65rem; font-weight: 600; letter-spacing: .14em; }
.client-plan-surface .plan-overview { margin: 0 0 1.25rem; }
.client-plan-surface .plan-overview p, .client-plan-surface .week-focus { white-space: pre-line; line-height: 1.65; font-size: .95rem; overflow-wrap: anywhere; }
.client-plan-surface .week-focus { padding: .9rem 1rem; margin: .6rem 0; color: var(--ink); background: var(--color-surface-secondary); border-radius: .4rem; }
.client-plan-surface .week-focus strong { display: block; font-size: .75rem; letter-spacing: .04em; margin-bottom: .3rem; }
.plan-home { max-width: 800px; margin: 0 auto; padding: clamp(1.5rem, 6vw, 4rem) 1.25rem; }
.plan-home h1 { font-size: clamp(2.2rem, 6vw, 4rem); line-height: 1.1; margin: 3rem 0 1rem; }
.plan-home p { font-size: 1rem; line-height: 1.7; max-width: 58ch; }
.plan-home form { display: grid; gap: .65rem; margin: 2rem 0; max-width: 480px; }
.plan-home input { width: 100%; min-width: 0; font: inherit; padding: .9rem; color: var(--ink); background: var(--color-input-background); border: 1px solid var(--color-input-border); border-radius: .35rem; }
.plan-home .button { min-height: 44px; }
.plan-home-footer { margin-top: 3rem; font-size: .85rem; }
html[data-plan-brand="costa"] { --page-background-image: none; --shadow: none; --shadow-soft: none; --shadow-crisp: none; }
html[data-plan-brand="costa"][data-theme="light"] {
  --color-page-background: #fff; --color-page-background-deep: #fff;
  --color-surface-elevated: #fff; --color-surface-secondary: #f4f4f4; --color-surface-inset: #f7f7f7;
  --color-text-primary: #242424; --color-text-strong: #111; --color-text-secondary: #474747; --color-text-muted: #626262;
  --color-border: #e3e3e3; --color-border-strong: #c9c9c9; --color-divider: #e3e3e3;
  --color-accent: #222; --color-accent-hover: #444; --color-accent-text: #fff; --color-link: #202020; --color-link-hover: #555;
  --color-selected: #ececec; --color-hover: #f2f2f2; --color-input-background: #fff; --color-input-border: #bdbdbd; --color-focus-ring: #245c8d;
}
html[data-plan-brand="costa"][data-theme="dark"] {
  --color-page-background: #111; --color-page-background-deep: #111;
  --color-surface-elevated: #191919; --color-surface-secondary: #222; --color-surface-inset: #171717;
  --color-text-primary: #e6e6e6; --color-text-strong: #fff; --color-text-secondary: #ccc; --color-text-muted: #b0b0b0;
  --color-border: #333; --color-border-strong: #555; --color-divider: #333;
  --color-accent: #eee; --color-accent-hover: #fff; --color-accent-text: #111; --color-link: #eee; --color-link-hover: #fff;
  --color-selected: #333; --color-hover: #292929; --color-input-background: #191919; --color-input-border: #666; --color-focus-ring: #96cbff;
}
html[data-plan-brand="costa"] .client-plan-surface { font-family: Inter, sans-serif; }
html[data-plan-brand="costa"] .client-plan-surface :is(h1,h2,h3,.stat-value,.week-number) { font-family: Inter, sans-serif; letter-spacing: -.025em; }
html[data-plan-brand="costa"] .client-plan-surface .hero { background: var(--color-surface-elevated); border-bottom: 1px solid var(--color-border); }
html[data-plan-brand="costa"] .client-plan-surface .hero::before { display: none; }
html[data-plan-brand="costa"] .client-plan-surface .hero h1 { font-size: clamp(2rem, 5vw, 3.5rem); text-transform: none; line-height: 1.12; }
html[data-plan-brand="costa"] .client-plan-surface .workout-row { background: var(--color-surface-elevated); border-bottom-color: var(--color-border); }
html[data-plan-brand="costa"] .client-plan-surface .workout-row.today { background: var(--color-selected); }
html[data-plan-brand="costa"] .client-plan-surface .workout-detail p { background: var(--color-surface-secondary); }
html[data-plan-brand="costa"] .client-plan-surface .week-chip.current { background: var(--color-accent); color: var(--color-accent-text); }

/* Shared reading layout: keep source order at every screen width. */
.client-plan-surface .plan-page .content {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  max-width: 1040px;
  margin-inline: auto;
  padding-block: 1.5rem 4rem;
}
.client-plan-surface .plan-page .hero-inner { max-width: 1040px; padding-block: 1.75rem; }
.client-plan-surface .plan-page .brand-row { padding-right: 5rem; gap: 1rem; }
.client-plan-surface .plan-page .hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
.client-plan-surface .plan-page .hero-actions:empty { display: none; }
.client-plan-surface .plan-overview { margin: 0; }
.client-plan-surface .plan-overview p { max-width: 78ch; margin-bottom: 0; }
.client-plan-surface .overview-stack { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.client-plan-surface .week-nav-shell { position: relative; overflow: visible; }
.client-plan-surface .week-nav {
  background: var(--color-page-background);
  border-block: 1px solid var(--color-border);
  box-shadow: none;
  padding: .5rem 0;
  gap: .4rem;
}
.client-plan-surface .button.week-chip { min-height: 44px; height: auto; padding: .7rem 1rem; box-shadow: none; border: 1px solid var(--color-border); }
.client-plan-surface .button.week-chip.current { color: var(--color-accent-text); background: var(--color-accent); border-color: var(--color-accent); }
.client-plan-surface .plan-detail-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.client-plan-surface .plan-detail-toolbar p { color: var(--muted); margin: 0; font-size: .85rem; line-height: 1.5; }
.client-plan-surface .plan-detail-toolbar .button { min-height: 44px; flex-shrink: 0; font-size: .8rem; }
.client-plan-surface .weeks { gap: 1.5rem; }
.client-plan-surface .week-card { scroll-margin-top: 5rem; }
.client-plan-surface .week-heading { padding: 1.25rem; gap: .75rem; }
.client-plan-surface .week-heading h2 { font-size: 1.35rem; line-height: 1.3; }
.client-plan-surface .week-kicker { flex-wrap: wrap; gap: .5rem 1rem; font-size: .75rem; line-height: 1.5; }
.client-plan-surface .week-kicker > span { white-space: normal; overflow: visible; }
.client-plan-surface .week-phase-meta { color: var(--muted-strong); font-size: .75rem; }
.client-plan-surface .week-focus { margin: 0; }
.client-plan-surface .week-body { padding: 1rem; gap: 1rem; }
.client-plan-surface .mini-day { min-height: 48px; height: auto; }
.client-plan-surface .mini-day-name { font-size: .65rem; }
.client-plan-surface .mini-day strong { font-size: .85rem; }
.client-plan-surface .workout-row { padding: .85rem 1rem; gap: .35rem .8rem; grid-template-columns: 6rem minmax(0, 1fr) auto; }
.client-plan-surface .workout-row time { font-size: .8rem; line-height: 1.5; white-space: normal; }
.client-plan-surface .workout-row-text { display: grid; gap: .25rem; }
.client-plan-surface .workout-row h3 { font-size: 1rem; line-height: 1.45; white-space: normal; overflow-wrap: anywhere; }
.client-plan-surface .workout-secondary { font-size: .82rem; line-height: 1.45; white-space: normal; }
.client-plan-surface .workout-mileage { font-size: .9rem; line-height: 1.4; }
.client-plan-surface .workout-detail { margin-top: 0; }
.client-plan-surface .workout-detail summary { min-height: 44px; align-content: center; font-size: .82rem; padding-block: .5rem; text-decoration: none; }
.client-plan-surface .workout-detail summary:hover { text-decoration: underline; }
.client-plan-surface .workout-detail p { max-width: 76ch; margin: .25rem 0 .5rem; font-size: 1rem; }
.detail-label-open, .workout-detail[open] .detail-label-closed { display: none; }
.workout-detail[open] .detail-label-open { display: inline; }
.client-plan-surface .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
html[data-plan-brand="costa"] .client-plan-surface :is(.panel, .week-card) { box-shadow: none; background: var(--color-surface-elevated); border-color: var(--color-border); }
html[data-plan-brand="costa"] .client-plan-surface .date-tile { background: var(--color-surface-secondary); border-color: var(--color-border); }
html[data-plan-brand="costa"] .client-plan-surface .hero h1 { max-width: 22ch; font-size: clamp(2rem, 5vw, 3rem); }
@media (max-width: 640px) {
  .client-plan-surface .overview-stack { grid-template-columns: 1fr; }
  .client-plan-surface .plan-page .brand-row { flex-direction: column; align-items: flex-start; gap: .75rem; }
  .client-plan-surface .plan-page .hero-grid { grid-template-columns: 1fr; }
  .client-plan-surface .plan-detail-toolbar { flex-wrap: wrap; }
  .client-plan-surface .week-heading { padding: 1rem; }
  .client-plan-surface .week-body { padding: .6rem; }
  .client-plan-surface .workout-row { grid-template-columns: minmax(0, 1fr) auto; padding: .75rem; gap: .35rem .65rem; }
  .client-plan-surface .workout-row time { grid-column: 1 / -1; }
  .client-plan-surface .workout-main { align-items: flex-start; }
  .client-plan-surface .workout-icon { margin-top: .45rem; }
  .client-plan-surface .workout-detail p { padding: .75rem; }
}