.live-schedule { display: grid; gap: 1.5rem; margin-top: 2rem; }
.live-schedule-toolbar, .live-trial-fields { display: flex; flex-wrap: wrap; align-items: end; gap: 1rem; }
.live-schedule-toolbar label, .live-trial-form label { display: grid; flex: 1 1 180px; gap: 0.4rem; color: var(--muted-foreground); font-size: 0.8rem; font-weight: 700; }
.live-schedule select, .live-schedule input:not([type="checkbox"]), .live-schedule textarea { width: 100%; min-height: 46px; padding: 0.65rem 0.8rem; border: 1px solid rgba(255,255,255,.2); border-radius: 0.5rem; background: var(--surface-2); color: var(--foreground); font: 500 0.95rem var(--font-sans); }
.live-schedule textarea { resize: vertical; }
.live-schedule-week { display: flex; flex: 1 1 260px; align-items: center; justify-content: space-between; gap: 0.6rem; min-height: 46px; border: 1px solid var(--border); border-radius: 0.5rem; background: var(--surface-2); text-align: center; font-size: 0.8rem; font-weight: 700; }
.live-schedule-week button { min-width: 44px; min-height: 44px; border: 0; background: transparent; color: var(--primary); cursor: pointer; font-size: 1.2rem; }
.live-schedule-state { margin: 0; color: var(--muted-foreground); }
.live-schedule-state.is-error { color: #ff9a91; }
.live-schedule-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap: 0.85rem; }
.live-schedule-day { min-height: 10rem; padding: 1rem; border: 1px solid var(--border); border-radius: 0.75rem; background: var(--surface-2); }
.live-schedule-day h3 { margin-bottom: 1rem; color: var(--primary); font-size: 1.25rem; line-height: 1.15; text-transform: capitalize; }
.live-schedule-day ul { display: grid; gap: 0.7rem; margin: 0; }
.live-schedule-day li { display: grid; gap: 0.35rem; padding-block: 0.65rem; border-top: 1px solid var(--border); }
.live-schedule-day li:first-child { border-top: 0; }
.live-schedule-day strong { font-size: 0.9rem; }
.live-schedule-day span, .live-schedule-day p { color: var(--muted-foreground); font-size: 0.82rem; }
.live-schedule-day button { width: fit-content; min-height: 38px; padding: 0.4rem 0.75rem; border: 1px solid var(--primary); border-radius: 0.5rem; background: transparent; color: var(--primary); cursor: pointer; font-size: 0.78rem; font-weight: 700; }
.live-schedule-trials { display: grid; gap: 1.2rem; margin-top: 1rem; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--border); border-radius: 1rem; background: var(--surface); }
.live-schedule-trials h3 { margin-top: 0.5rem; font-size: clamp(1.8rem, 4vw, 2.5rem); }
.live-trial-form { display: grid; max-width: 800px; gap: 1rem; }
.live-trial-form .live-privacy { display: flex; align-items: start; gap: 0.7rem; color: var(--foreground); font-size: 0.85rem; font-weight: 500; }
.live-privacy input { flex: 0 0 auto; width: 1.1rem; height: 1.1rem; margin-top: 0.15rem; accent-color: var(--primary); }
.live-trial-form .btn { justify-self: start; }
#trial-state { margin: 0; color: var(--primary); }
#trial-success { padding: 1rem; border-left: 3px solid var(--primary); background: var(--surface-2); }
#trial-success p { margin: 0.4rem 0 0; color: var(--muted-foreground); }
.live-schedule-fallback { max-width: 48rem; margin: 0; color: var(--muted-foreground); font-size: 0.85rem; }

@media (max-width: 600px) {
  .live-schedule-toolbar, .live-trial-fields { display: grid; }
  .live-schedule-toolbar label, .live-trial-form label { width: 100%; }
  .live-schedule-week { width: 100%; }
  .live-schedule-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* A grade da página inicial é uma única navegação ilustrativa. */
.illustrative-link { display: block; margin-top: 2rem; padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid var(--border); border-radius: 1rem; background: var(--surface); color: var(--foreground); text-decoration: none; cursor: pointer; transition: border-color 160ms ease, box-shadow 160ms ease; }
.illustrative-link:hover, .illustrative-link:focus-visible { border-color: var(--primary); box-shadow: var(--shadow-glow); }
.illustrative-link:focus-visible, .booking-options button:focus-visible, .live-schedule-day button:focus-visible, .live-schedule-week button:focus-visible, .booking-slot:focus-visible, .booking-day-strip button:focus-visible, .booking-week-nav:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.illustrative-link-title { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; color: var(--primary); font-weight: 800; }
.illustrative-link-title span { font-size: 1.4rem; }
.illustrative-scroll { display: block; max-width: 100%; overflow-x: auto; }
.illustrative-table { width: 100%; min-width: 690px; border: 1px solid var(--border); border-collapse: separate; border-spacing: 0; border-radius: .5rem; overflow: hidden; }
.illustrative-table tr + tr > * { border-top: 1px solid var(--border); }
.illustrative-table th, .illustrative-table td { width: 14%; height: 55px; padding: .6rem .35rem; border-left: 1px solid var(--border); text-align: center; font-size: .85rem; }
.illustrative-table tr > :first-child { width: 72px; border-left: 0; color: var(--primary); font-weight: 800; }
.illustrative-table tbody tr > :nth-child(even) { background: rgba(255,255,255,.025); }
.illustrative-table thead { background: var(--surface-2); font-weight: 800; }
.illustrative-hint { display: block; padding-top: 1rem; color: var(--primary); font-size: .85rem; font-weight: 700; }
.illustrative-warning { margin: .8rem 0 0; color: var(--muted-foreground); font-size: .82rem; }

/* A agenda real só é montada na página de agendamento. */
.booking-page { --booking-individual: #ff8a1f; }
.booking-page [hidden] { display: none !important; }
.booking-intro { padding-top: clamp(8rem, 12vw, 11rem); padding-bottom: 3rem; background: radial-gradient(circle at 85% 15%, rgba(255,195,0,.12), transparent 40%); }
.booking-intro h1 { max-width: 900px; font-size: clamp(2.6rem, 7vw, 5.5rem); line-height: 1.04; }
.booking-intro p:not(.eyebrow) { max-width: 650px; color: var(--muted-foreground); }
.booking-flow { padding-top: 1rem; }
.booking-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.booking-choice { min-width: 0; min-height: 305px; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--border); border-radius: 1rem; background: var(--surface); }
.booking-choice h2 { margin: .5rem 0 1.25rem; font-size: clamp(1.6rem, 3vw, 2.3rem); }
.booking-options { display: grid; gap: .75rem; }
.booking-options button { min-height: 64px; padding: .9rem 1rem; border: 1px solid rgba(255,255,255,.22); border-radius: .7rem; background: var(--surface-2); color: var(--foreground); cursor: pointer; font: 700 1rem var(--font-sans); text-align: left; transition: border-color 150ms ease, background-color 150ms ease; }
.booking-options button:hover { border-color: var(--primary); }
.booking-options button[aria-pressed="true"] { border-color: var(--primary); background: rgba(255,195,0,.13); color: var(--primary); }
.booking-options button:disabled { opacity: .45; cursor: not-allowed; }
.booking-hint { margin: 1rem 0 0; color: var(--muted-foreground); font-size: .85rem; }
.teacher-option { display: flex; align-items: center; gap: .9rem; }
.teacher-avatar { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 50%; background: #343434; color: var(--primary); font-size: 1.2rem; }
.teacher-option small { display: block; margin-top: .2rem; color: var(--muted-foreground); font-size: .75rem; font-weight: 500; }
.booking-calendar { display: grid; min-width: 0; gap: 1.3rem; margin-top: 2rem; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--border); border-radius: 1rem; background: var(--surface); }
.booking-type-legend { display: flex; flex-wrap: wrap; gap: .65rem 1.25rem; padding: .8rem 1rem; border: 1px solid var(--border); border-radius: .65rem; background: var(--surface-2); }
.booking-type-key { display: inline-flex; align-items: center; gap: .55rem; color: var(--foreground); font-size: .82rem; font-weight: 800; }
.booking-type-key::before { width: .75rem; height: .75rem; border-radius: 50%; background: var(--type-color); content: ""; box-shadow: 0 0 0 3px color-mix(in srgb, var(--type-color) 18%, transparent); }
.booking-type-key-group { --type-color: var(--primary); }
.booking-type-key-individual { --type-color: var(--booking-individual); }
.booking-calendar > .booking-hint { margin: -.75rem 0 0; }
.booking-desktop-navigation, .booking-mobile-navigation { display: flex; min-width: 0; border: 1px solid var(--border); border-radius: .7rem; overflow: hidden; background: var(--surface-2); }
.booking-week-nav { flex: 0 0 44px; min-height: 64px; padding: 0; border: 0; background: var(--surface-2); color: var(--primary); cursor: pointer; font: 700 1.4rem var(--font-sans); }
.booking-week-nav[data-week-nav="prev"] { border-right: 1px solid var(--border); }
.booking-week-nav[data-week-nav="next"] { border-left: 1px solid var(--border); }
.booking-week-nav:hover { background: rgba(255,195,0,.14); }
.booking-table-scroll { flex: 1; min-width: 0; max-width: 100%; overflow-x: auto; }
.booking-week-table { width: 100%; min-width: 950px; border-collapse: collapse; table-layout: fixed; background: var(--surface-2); }
.booking-week-table caption { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.booking-week-table tr > :first-child { width: 76px; }
.booking-week-table th, .booking-week-table td { padding: .6rem .4rem; border-bottom: 1px solid var(--border); border-left: 1px solid var(--border); vertical-align: top; text-align: left; }
.booking-week-table tr > :first-child { border-left: 0; }
.booking-week-table tbody tr:last-child > * { border-bottom: 0; }
.booking-week-table thead th { padding-block: .8rem; color: var(--primary); font-size: .78rem; font-weight: 800; text-align: center; }
.booking-week-table thead th span, .booking-week-table thead th time { display: block; text-transform: capitalize; }
.booking-week-table thead th time { margin-top: .2rem; color: var(--foreground); }
.booking-week-table tbody th { color: var(--primary); font-size: .82rem; font-weight: 800; }
.booking-week-table td { font-size: .75rem; }
.booking-week-table td .booking-slot + .booking-slot { margin-top: .4rem; }
.booking-cell-empty { display: block; padding: 1.2rem .15rem; color: var(--muted-foreground); font-size: .73rem; text-align: center; }
.booking-table-empty { padding: 2rem !important; color: var(--muted-foreground); text-align: center !important; }
.booking-slot { --slot-accent: var(--primary); --slot-fill: rgba(255,195,0,.07); --slot-hover: rgba(255,195,0,.14); display: grid; width: 100%; min-height: 78px; gap: .22rem; padding: .55rem; border: 1px solid var(--slot-accent); border-radius: .5rem; background: var(--slot-fill); color: var(--foreground); cursor: pointer; font: 500 .72rem var(--font-sans); text-align: left; overflow-wrap: anywhere; }
.booking-slot-group { --slot-accent: var(--primary); }
.booking-slot-individual { --slot-accent: var(--booking-individual); --slot-fill: rgba(255,138,31,.08); --slot-hover: rgba(255,138,31,.16); }
.booking-slot strong { color: var(--foreground); font-size: .78rem; line-height: 1.2; }
.booking-slot span, .booking-slot small { color: var(--muted-foreground); line-height: 1.25; }
.booking-slot .booking-slot-time, .booking-slot .booking-slot-type { color: var(--slot-accent); font-weight: 800; }
.booking-slot small { color: var(--slot-accent); font-weight: 700; }
.booking-slot:hover { background: var(--slot-hover); }
.booking-slot.is-selected { border-color: var(--slot-accent); background: var(--slot-accent); color: var(--primary-foreground); }
.booking-slot.is-selected strong, .booking-slot.is-selected span, .booking-slot.is-selected small { color: var(--primary-foreground); }
.booking-slot-unavailable { border-color: color-mix(in srgb, var(--slot-accent) 45%, var(--border)); background: transparent; cursor: default; }
.booking-slot-unavailable strong, .booking-slot-unavailable span { color: var(--muted-foreground); }
.booking-slot-unavailable .booking-slot-type { color: var(--slot-accent); }
.booking-slot-unavailable .booking-slot-time { color: var(--muted-foreground); }
.booking-slot-unavailable:hover { background: transparent; }
.booking-mobile-calendar { display: none; }
.booking-page .live-schedule-trials { margin-top: 2rem; }
.booking-page .live-schedule-trials h2 { margin: .5rem 0; font-size: clamp(1.7rem, 4vw, 2.5rem); }
.booking-page .live-schedule-trials p { color: var(--muted-foreground); }
.booking-page .live-trial-form input:not([type="checkbox"]), .booking-page .live-trial-form textarea { width: 100%; min-height: 46px; padding: .65rem .8rem; border: 1px solid rgba(255,255,255,.2); border-radius: .5rem; background: var(--surface-2); color: var(--foreground); font: 500 .95rem var(--font-sans); }
.booking-page .live-trial-form textarea { resize: vertical; }
.trial-summary { padding: 1rem; border-left: 3px solid var(--primary); background: var(--surface-2); line-height: 1.7; }
.trial-success { margin-top: 2rem; padding: 1.25rem; border-left: 3px solid var(--primary); background: var(--surface); }
.trial-success p { margin: .4rem 0 0; color: var(--muted-foreground); }
.booking-contact { max-width: 55rem; margin-top: 2rem; color: var(--muted-foreground); }
.booking-contact a { color: var(--primary); }
@media (max-width: 760px) {
  .booking-intro .container, .booking-choice { text-align: center; }
  .booking-intro h1, .booking-intro p:not(.eyebrow) { margin-inline: auto; text-wrap: balance; }
  .booking-choices { grid-template-columns: 1fr; }
  .booking-choice { min-height: 0; }
  .booking-options button { text-align: left; }
  .booking-calendar .booking-type-legend { justify-content: center; }
  .booking-calendar > .booking-hint, .booking-calendar > .live-schedule-state { text-align: center; }
  .booking-desktop-navigation { display: none; }
  .booking-mobile-calendar { display: grid; min-width: 0; gap: 1rem; }
  .booking-day-strip { display: grid; flex: 1; grid-template-columns: repeat(7, minmax(34px, 1fr)); gap: 0; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
  .booking-mobile-navigation .booking-week-nav { flex-basis: 40px; min-height: 64px; }
  .booking-day-strip button { display: grid; min-width: 0; min-height: 64px; place-items: center; gap: .12rem; padding: .3rem 0; border: 1px solid var(--border); border-radius: .45rem; background: var(--surface-2); color: var(--foreground); cursor: pointer; font: 600 .68rem var(--font-sans); }
  .booking-day-strip button span { font-size: .64rem; text-transform: capitalize; }
  .booking-day-strip button strong { font-size: .83rem; }
  .booking-day-strip button i { width: 4px; height: 4px; border-radius: 50%; }
  .booking-day-strip button i.has-slots { background: var(--primary); }
  .booking-day-strip button[aria-pressed="true"] { border-color: var(--primary); background: rgba(255,195,0,.14); color: var(--primary); }
  .booking-day-strip button:disabled { opacity: .45; cursor: not-allowed; }
  .booking-day-scroll-hint { display: none; margin: -.5rem 0 0; color: var(--muted-foreground); font-size: .75rem; }
  .booking-day-slots h3 { margin: 0 0 .75rem; color: var(--primary); font-size: 1rem; text-transform: capitalize; }
  .booking-day-slot-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: .6rem; }
  .booking-day-slots .booking-slot { min-height: 74px; padding: .7rem; font-size: .78rem; }
  .booking-day-slots .booking-slot-time { color: var(--slot-accent); font-weight: 800; }
  .booking-day-slots .booking-slot.is-selected .booking-slot-time { color: var(--primary-foreground); }
  .booking-day-empty { margin: 0; padding: 1rem; border: 1px solid var(--border); border-radius: .5rem; color: var(--muted-foreground); text-align: center; }
  .booking-page .live-schedule-trials > div:first-child, .booking-contact { margin-inline: auto; text-align: center; }
}
@media (max-width: 430px) {
  .booking-intro { padding-top: 7rem; }
  .booking-calendar { padding: 1rem; }
}
@media (max-width: 360px) { .booking-day-scroll-hint { display: block; } }
@media (prefers-reduced-motion: reduce) { .illustrative-link, .booking-options button { transition: none; } }