:root {
  --taupe: #9d9682;
  --taupe-dark: #8e8775;
  --taupe-deep: #756f61;
  --ink: #17191d;
  --muted: #6d7178;
  --green: #0aae62;
  --white: #fff;
  --shadow: 0 24px 70px rgba(0, 0, 0, .2);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { color-scheme: light; scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--taupe); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.brandbar { height: 88px; display: grid; place-items: center; background: var(--taupe); position: relative; z-index: 2; }
.brandbar__link { display: block; height: 78px; overflow: hidden; }
.brandbar__logo { width: 190px; height: auto; transform: translateY(-9px); }

.funnel-hero { position: relative; min-height: calc(100svh - 88px); isolation: isolate; background-position: center; background-size: cover; }
.funnel-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(7, 10, 12, .53); }
.funnel-hero--optin { background-image: url("/assets/optin-desktop.webp"); }
.funnel-hero--booking { background-image: url("/assets/booking-desktop.webp"); background-position: center 42%; }
.funnel-hero__content, .booking-wrap { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 24px 0 38px; text-align: center; color: #fff; }
.funnel-hero h1 { max-width: 1120px; margin: 0 auto; color: #fff; font-size: clamp(2.1rem, 4.1vw, 3.25rem); line-height: 1.12; letter-spacing: .005em; text-wrap: balance; }
.funnel-hero__subhead { margin: 23px auto 20px; font-size: 1.12rem; line-height: 1.45; }

.quiz-card { width: min(550px, 100%); margin: 0 auto; overflow: hidden; color: var(--ink); background: #fff; border-radius: 19px; box-shadow: var(--shadow); text-align: left; }
.quiz-card__body { min-height: 270px; padding: 31px 42px 25px; }
.quiz-step h2 { margin: 0 0 25px; font-size: 1.5rem; line-height: 1.3; text-align: center; text-wrap: balance; }
.choice-list { display: grid; gap: 13px; padding: 0; border: 0; margin: 0; }
.choice { display: flex; align-items: center; gap: 11px; cursor: pointer; font-size: .98rem; }
.choice input { width: 17px; height: 17px; margin: 0; accent-color: var(--taupe-dark); }
.choice:has(input:focus-visible) { outline: 3px solid rgba(157, 150, 130, .35); outline-offset: 4px; border-radius: 4px; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.field--wide { grid-column: 1 / -1; }
.field { display: grid; gap: 6px; }
.field span { font-size: .78rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #4f5258; }
.field small { font-weight: 500; text-transform: none; }
.field input { width: 100%; height: 47px; border: 1px solid #d3d5d8; border-radius: 8px; padding: 0 13px; color: var(--ink); background: #fff; outline: none; }
.field input:focus { border-color: var(--taupe-dark); box-shadow: 0 0 0 3px rgba(157, 150, 130, .2); }
.field input.is-invalid { border-color: #b42318; }
.quiz-card__privacy { margin: 16px 0 0; color: var(--muted); font-size: .73rem; line-height: 1.45; text-align: center; }
.quiz-card__footer { min-height: 50px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; color: #fff; background: var(--taupe); }
.quiz-card__count { align-self: center; grid-column: 2; font-size: .9rem; }
.quiz-card__back, .quiz-card__next { border: 0; color: #fff; background: transparent; cursor: pointer; }
.quiz-card__back { grid-column: 1; grid-row: 1; justify-self: start; width: 72px; font-size: 1.2rem; }
.quiz-card__next { grid-column: 3; grid-row: 1; justify-self: end; width: 102px; background: rgba(0, 0, 0, .09); font-size: 1.35rem; transition: background .2s ease; }
.quiz-card__next:hover { background: rgba(0, 0, 0, .16); }
.quiz-card__next:focus-visible, .quiz-card__back:focus-visible { outline: 3px solid #fff; outline-offset: -5px; }
.availability { margin: 22px 0 17px; color: #fff; font-size: 2rem; font-weight: 300; line-height: 1.2; }
.trust-badge { width: 146px; height: auto; margin: 0 auto; border-radius: 4px; }

.booking-wrap { padding-top: 25px; }
.booking-intro { max-width: 1130px; margin: 22px auto 35px; font-size: 1.05rem; line-height: 1.45; text-wrap: balance; }
.calendar-card { display: grid; grid-template-columns: 285px minmax(360px, 1fr) 210px; width: min(970px, 100%); min-height: 420px; margin: 0 auto; overflow: hidden; color: var(--ink); background: #fff; border-radius: 8px; box-shadow: var(--shadow); text-align: left; }
.service-summary { padding: 50px 25px 30px; border-right: 1px solid #e6e7e9; }
.service-summary h2 { margin: 0 0 16px; font-size: 1.35rem; line-height: 1.4; }
.service-summary p { color: #686c72; font-size: .82rem; line-height: 1.65; }
.service-meta { display: grid; gap: 11px; margin: 0 0 22px; padding: 0; list-style: none; color: #70747a; font-size: .85rem; }
.service-meta span { display: inline-grid; width: 19px; place-items: center; color: #697078; font-size: 1.05rem; }
.calendar-panel { padding: 29px 28px; }
.calendar-panel__head { display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; margin-bottom: 24px; text-align: center; }
.calendar-panel__head h3 { margin: 0; font-size: 1rem; }
.calendar-arrow { width: 38px; height: 38px; border: 0; border-radius: 50%; color: #687078; background: #f3f5f4; cursor: pointer; font-size: 1.7rem; line-height: 1; }
.calendar-arrow:hover { color: var(--green); background: #eaf8f1; }
.weekday-row, .calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; text-align: center; }
.weekday-row { margin-bottom: 7px; color: #34383e; font-size: .75rem; font-weight: 700; }
.calendar-day { aspect-ratio: 1; min-width: 32px; border: 0; border-radius: 50%; color: #aaadb1; background: transparent; }
.calendar-day.is-available { color: var(--green); background: #eff9f4; cursor: pointer; font-weight: 700; }
.calendar-day.is-available:hover, .calendar-day.is-selected { color: #fff; background: var(--green); }
.calendar-day:disabled { cursor: default; }
.time-panel { display: grid; align-content: start; gap: 10px; padding: 31px 20px; border-left: 1px solid #e6e7e9; }
.time-panel__label { margin: 0 0 4px; color: #61656b; font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.time-slot { min-height: 49px; border: 1px solid var(--green); border-radius: 5px; color: #078d4f; background: #fff; cursor: pointer; font-weight: 700; }
.time-slot:hover, .time-slot.is-selected { color: #fff; background: var(--green); }
.schedule-continue { display: grid; min-height: 49px; place-items: center; border-radius: 5px; color: #fff; background: #16181c; text-decoration: none; font-weight: 800; }
.financing { display: grid; justify-items: center; gap: 4px; margin-top: 5px; color: #fff; }
.financing span { font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.financing strong { display: flex; align-items: center; gap: 5px; font-size: 1.45rem; font-weight: 700; letter-spacing: -.04em; }
.financing strong > span { color: #ffcc05; font-size: 1.25rem; }
.financing small { margin-top: 4px; font-size: .5rem; letter-spacing: .12em; }

.thank-page { background: #fff; }
.thank-hero { min-height: 720px; padding: 0 20px 70px; color: #fff; background: var(--taupe-deep); text-align: center; }
.thank-hero__logo { width: 235px; height: auto; margin: 0 auto -6px; }
.thank-hero__content { width: min(860px, 100%); margin: 0 auto; }
.thank-hero h1 { max-width: 800px; margin: 7px auto 22px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.4rem, 4.5vw, 3.4rem); line-height: 1.18; text-wrap: balance; }
.thank-hero p { max-width: 750px; margin: 11px auto; font-size: 1.12rem; line-height: 1.45; }
.thank-hero a { color: #fff; font-weight: 800; }
.video-placeholder { position: relative; width: min(660px, 100%); margin: 36px auto 0; padding: 0; overflow: hidden; border: 0; border-radius: 2px; background: #1e2530; box-shadow: var(--shadow); cursor: pointer; }
.video-placeholder img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; filter: brightness(.62); }
.video-placeholder__play { position: absolute; inset: 50% auto auto 50%; display: grid; width: 64px; height: 64px; place-items: center; border: 2px solid rgba(255, 255, 255, .8); border-radius: 50%; color: #fff; background: rgba(0, 0, 0, .45); transform: translate(-50%, -50%); font-size: 1.55rem; padding-left: 4px; }
.video-placeholder__note { position: absolute; right: 12px; bottom: 10px; left: 12px; color: rgba(255, 255, 255, .82); font-size: .7rem; }
.work-section { padding: 64px 20px 78px; background: #fff; }
.work-section__inner { width: min(1050px, 100%); margin: 0 auto; text-align: center; }
.work-icon { width: 55px; margin: 0 auto 12px; }
.work-section h2, .visit-section h2 { margin: 0 0 38px; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.15; }
.carousel { position: relative; width: min(520px, 100%); margin: 0 auto; }
.carousel__viewport { overflow: hidden; background: #f2f2f2; }
.carousel__track { display: flex; transition: transform .42s cubic-bezier(.22, .61, .36, 1); }
.carousel__slide { min-width: 100%; margin: 0; }
.carousel__slide img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; }
.carousel__arrow { position: absolute; top: 50%; z-index: 1; width: 46px; height: 58px; border: 0; color: #fff; background: rgba(0, 0, 0, .35); transform: translateY(-50%); cursor: pointer; font-size: 2.3rem; }
.carousel__arrow--prev { left: 0; }
.carousel__arrow--next { right: 0; }
.carousel__dots { display: flex; justify-content: center; gap: 2px; margin-top: 8px; }
.carousel__dot { position: relative; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.carousel__dot::before { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: #181818; }
.carousel__dot.is-active::before { background: var(--taupe); outline: 2px solid var(--taupe); outline-offset: 2px; }
.visit-section { padding: 70px 20px 85px; color: #fff; background: var(--taupe-deep); }
.visit-section__inner { width: min(820px, 100%); margin: 0 auto; }
.visit-section h2 { margin-bottom: 28px; }
.visit-section__inner > p { max-width: 680px; font-size: 1.08rem; line-height: 1.55; }
.visit-section h3 { margin: 32px 0 20px; font-size: 1.05rem; }
.visit-list { display: grid; gap: 22px; margin: 0; padding: 0; list-style: none; }
.visit-list li { position: relative; display: grid; gap: 5px; padding-left: 30px; line-height: 1.45; }
.visit-list li::before { content: "✓"; position: absolute; top: 0; left: 0; display: grid; width: 20px; height: 20px; place-items: center; border: 1px solid rgba(255, 255, 255, .6); border-radius: 50%; font-size: .72rem; }
.visit-list span { color: #fff; }

@media (max-width: 800px) {
  .calendar-card { grid-template-columns: minmax(0, 1fr) 190px; }
  .service-summary { grid-column: 1 / -1; padding: 28px; border-right: 0; border-bottom: 1px solid #e6e7e9; }
  .service-summary p { max-width: 650px; }
}

@media (max-width: 680px) {
  .brandbar { height: 61px; }
  .brandbar__link { height: 57px; }
  .brandbar__logo { width: 156px; transform: translateY(-4px); }
  .funnel-hero { min-height: calc(100svh - 61px); }
  .funnel-hero--optin { background-image: url("/assets/optin-mobile.webp"); background-position: center top; }
  .funnel-hero--booking { background-image: url("/assets/booking-mobile.webp"); background-position: center top; }
  .funnel-hero::before { background: rgba(8, 10, 12, .5); }
  .funnel-hero__content, .booking-wrap { width: 100%; padding: 26px 15px 35px; }
  .funnel-hero h1 { font-size: 1.72rem; line-height: 1.22; }
  .funnel-hero__subhead { margin: 20px auto 64px; font-size: .91rem; line-height: 1.4; }
  .quiz-card { width: min(340px, calc(100vw - 40px)); border-radius: 0 0 18px 18px; }
  .quiz-card__body { min-height: 305px; padding: 32px 21px 25px; }
  .quiz-step h2 { max-width: 270px; margin: 0 auto 28px; font-size: 1.48rem; line-height: 1.43; }
  .choice-list { gap: 14px; }
  .choice { font-size: .91rem; }
  .field-grid { grid-template-columns: 1fr; gap: 12px; }
  .field--wide { grid-column: auto; }
  .quiz-card__footer { min-height: 51px; }
  .availability { margin: 74px 0 42px; font-size: 1.9rem; }
  .trust-badge { margin-bottom: 18px; }

  .booking-wrap { padding-top: 25px; }
  .booking-wrap h1 { max-width: 350px; font-size: 1.72rem; }
  .booking-intro { margin: 20px auto 19px; font-size: .88rem; line-height: 1.35; }
  .calendar-card { display: block; width: min(330px, calc(100vw - 30px)); border-radius: 9px; }
  .service-summary { padding: 34px 18px 20px; }
  .service-summary h2 { font-size: 1.35rem; }
  .service-summary p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
  .calendar-panel { padding: 24px 17px 28px; }
  .calendar-panel__head { margin-bottom: 21px; }
  .calendar-day { min-width: 30px; }
  .time-panel { padding: 24px 20px 30px; border-top: 1px solid #e6e7e9; border-left: 0; }
  .booking-wrap .availability { margin: 28px 0 18px; }

  .thank-hero { min-height: auto; padding: 0 20px 71px; }
  .thank-hero__logo { width: 175px; margin-bottom: -4px; }
  .thank-hero h1 { margin-top: 4px; font-family: inherit; font-size: 2.05rem; line-height: 1.4; font-weight: 800; }
  .thank-hero p { font-size: 1rem; line-height: 1.45; }
  .video-placeholder { margin-top: 58px; }
  .video-placeholder__play { width: 50px; height: 50px; font-size: 1.2rem; }
  .work-section { padding: 53px 20px 48px; }
  .work-icon { width: 50px; margin-bottom: 35px; }
  .work-section h2 { margin-bottom: 49px; font-size: 1.55rem; text-align: left; }
  .carousel { width: 100%; }
  .visit-section { padding: 42px 10px 58px; }
  .visit-section h2 { font-size: 1.75rem; }
  .visit-section__inner > p, .visit-list { font-size: .9rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
