/* Sequential booking, with one shared visual language across every screen. */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#book .booking-heading{max-width:840px;margin:0 auto 38px;text-align:center;display:block}
#book .booking-heading>div{max-width:none}
#book .booking-heading h2{font-size:clamp(38px,4.2vw,60px);line-height:1.12;max-width:820px;margin:0 auto 20px}
#book .booking-heading p:not(.overline){font-size:15px;line-height:1.85;max-width:590px;margin:auto}
.booking-shell{max-width:970px;margin:auto;border:1px solid #dce4eb;border-radius:24px;background:#fff;box-shadow:0 14px 50px #173f6008;overflow:hidden}
.booking-host{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 38px;border-bottom:1px solid #e7edf2;background:#fafcff}
.booking-host-name{display:block;font:25px/1.2 var(--serif);letter-spacing:-.5px;color:var(--ink)}
.booking-host-note{display:block;font-size:11px;line-height:1.7;color:var(--body);margin-top:5px}
.booking-host .timezone{margin:0;font-size:11px;display:flex;gap:8px;align-items:center;color:var(--ink);white-space:nowrap}
.booking-host .timezone svg{width:17px;height:17px}
#book .mode-notice{display:flex;gap:14px;align-items:baseline;background:#f4f7fa;color:#486175;margin:0;padding:13px 38px;border:0}
#book .mode-notice>span{font-size:11px;line-height:1.7;font-weight:600;white-space:nowrap;margin:0}
#book .mode-notice p{font-size:11px;line-height:1.7;color:inherit;margin:0}
.booking-progress{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;max-width:710px;padding:30px 16px 24px;margin:auto;scroll-margin-top:8px}
.booking-progress button{position:relative;border:0;padding:0 5px;background:transparent;color:#8594a0;display:flex;flex-direction:column;align-items:center;gap:10px;font-size:12px;line-height:1.5;min-height:79px;opacity:1}
.booking-progress button::before{content:"";position:absolute;top:24px;right:calc(50% + 30px);width:calc(100% - 60px);height:1px;background:#e1e7ed}
.booking-progress button:first-child::before{content:none}
.booking-progress .progress-icon{display:grid;place-items:center;flex-shrink:0;border:1px solid #dde5ec;border-radius:50%;width:49px;height:49px;background:#fff;position:relative}
.booking-progress svg{width:23px;height:23px;stroke-width:1.5;stroke:currentColor;fill:none;stroke-linecap:round;stroke-linejoin:round}
.booking-progress button[aria-current=step]{color:#173f60;font-weight:600}
.booking-progress button[aria-current=step] .progress-icon{background:#173f60;color:#fff;border-color:#173f60;box-shadow:0 0 0 5px #edf2f7}
.booking-progress button.is-complete{color:#466b8b}
.booking-progress button.is-complete .progress-icon{background:#eaf1f7;border-color:#d9e5ef}
.booking-progress button:not(:disabled):hover .progress-icon{border-color:#173f60}
.wizard-body{max-width:740px;padding:8px 40px 28px;margin:auto}
#book .wizard-panel{padding:0;margin:0;border:0;max-width:none;min-width:0}
.wizard-title{text-align:center;margin:10px 0 29px}
.wizard-kicker{display:block;color:#758696;font-size:10px;letter-spacing:1.7px;line-height:1.8;margin-bottom:12px}
#book .wizard-title h3{font:36px/1.2 var(--serif);letter-spacing:-1px;color:var(--ink);margin:0 0 13px;scroll-margin-top:120px}
.wizard-title h3:focus{outline:none}
#book .wizard-title p{font-size:14px;line-height:1.8;color:var(--body);max-width:530px;margin:auto}
.visit-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.visit-option{display:flex;align-items:center;gap:12px;padding:21px 17px;min-height:96px;border:1px solid #dbe4ec;border-radius:16px;background:#fff;text-align:left;color:var(--ink);transition:background .15s,border-color .15s}
.visit-option:hover{background:#f6f9fc;border-color:#aabed0}
.visit-option[aria-pressed=true]{border-color:#6c8da9;background:#edf3f8}
.option-number{font:18px/1 var(--serif);color:#7b95ab;min-width:23px;flex-shrink:0}
.visit-option>span:nth-child(2){flex:1;min-width:0}
.visit-option strong{font:500 14px/1.6 var(--sans);display:block}
.visit-option small{font-size:11px;line-height:1.7;color:#667c8d;display:block;margin-top:4px}
.choice-mark{display:block;width:19px;height:19px;flex-shrink:0;border:1px solid #c9d5df;border-radius:50%;position:relative}
.visit-option[aria-pressed=true] .choice-mark{background:#173f60;border-color:#173f60}
.visit-option[aria-pressed=true] .choice-mark::after{content:"";position:absolute;left:6px;top:3px;width:5px;height:9px;border:solid #fff;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.guidance-option{grid-column:1/-1;min-height:88px}
#book .wizard-calendar{max-width:460px;margin:auto;border:1px solid #e0e7ee;border-radius:20px;padding:20px 24px 0;background:#fff}
#book .calendar-header{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:10px;margin:0 0 16px}
#book #calendar-month{font:500 18px/1.5 var(--sans);letter-spacing:-.3px;text-align:center;margin:0}
#book .calendar-header button{width:44px;height:44px;background:#f3f7fa;border:0;border-radius:50%;display:grid;place-items:center}
#book .calendar-header button:hover:not(:disabled){background:#e4edf5}
#book .calendar-header button:disabled{opacity:.3}
#book .calendar-weekdays,#book .calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;text-align:center}
#book .calendar-weekdays{font-size:11px;color:#768795;line-height:30px;margin-bottom:9px}
#book .calendar-grid button{width:100%;max-width:48px;height:auto;aspect-ratio:1;border:1px solid #e0e7ed;background:#fff;border-radius:50%;font-size:14px;color:#2c4e69;padding:0;justify-self:center}
#book .calendar-grid button:not(:disabled):hover{background:#edf3f8;border-color:#8ba5bb}
#book .calendar-grid button:disabled{opacity:1;color:#c2ccd4;border-color:transparent;background:transparent;text-decoration:line-through;text-decoration-thickness:1px}
#book .calendar-grid button[aria-pressed=true]{color:#fff;background:#173f60;border-color:#173f60}
#book .date-summary{font-size:12px;line-height:1.7;color:#345b7a;margin:19px -24px 0;padding:15px 12px;text-align:center;border-top:1px solid #e4ebf1;border-radius:0 0 19px 19px;background:#f5f8fb;min-height:53px}
#book .wizard-note{font-size:12px;line-height:1.8;color:#738493;margin:21px auto 0;text-align:center;max-width:490px}
#book .wizard-time-fieldset{border:0;margin:0;padding:0;min-width:0}
#book .time-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
#book .time-options label{min-width:0;position:relative}
#book .time-options input{position:absolute;opacity:0;width:1px;height:1px;margin:0;padding:0;min-height:0}
#book .time-options .time-choice{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;min-height:181px;border:1px solid #dbe4ec;border-radius:20px;padding:20px 8px;background:#fff;color:#244762;text-align:center}
#book .time-choice svg{width:34px;height:34px;stroke:currentColor;fill:none;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;margin-bottom:22px}
#book .time-choice strong{font:500 15px/1.5 var(--sans)}
#book .time-choice small{font-size:11px;line-height:1.7;color:#718595;margin-top:5px}
#book .time-options input:checked+.time-choice{border:1px solid #6c8da9;background:#edf3f8;color:#173f60}
#book .time-options label:hover .time-choice{border-color:#8ba5bb}
#book .time-options input:focus-visible+.time-choice{outline:2px solid #173f60;outline-offset:4px}
#book .details-panel .field-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
#book .details-panel .field{margin-bottom:22px;min-width:0}
#book .details-panel .field>label{font-size:14px;line-height:1.6;color:#254762;display:block;margin-bottom:9px}
#book .details-panel input:not([type=checkbox]),#book .details-panel textarea{font:16px/1.55 var(--sans);width:100%;min-height:52px;border:1px solid #d7e1e9;border-radius:14px;background:#fbfcfe;color:#173f60;padding:13px 15px;box-shadow:none}
#book .details-panel input::placeholder,#book .details-panel textarea::placeholder{color:#8b9aa7;font-size:13px}
#book .details-panel textarea{resize:vertical;min-height:110px}
#book .details-panel .field small{font-size:11px;line-height:1.8;color:#768794;display:block;margin-top:7px}
#book .consent{font-size:12px;line-height:1.85;margin:2px 0 0;gap:12px;color:#5a6f80}
#book .consent input{width:20px;height:20px;margin-top:2px;accent-color:#173f60}
#book .form-error{padding:13px 16px;border-radius:12px;background:#fff3f0;color:#953f35;font-size:13px;line-height:1.75;margin:24px 0 0}
#book [aria-invalid=true]{outline:2px solid #b56b5f;outline-offset:3px}
.wizard-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:32px;padding-top:25px;border-top:1px solid #e5ebf0}
.wizard-actions .button{border-radius:100px;min-height:50px;min-width:164px;padding:13px 22px;justify-content:space-between;font-size:13px;background:#173f60;border-color:#173f60;color:#fff}
.wizard-actions .button:hover:not(:disabled){background:#245577}
.wizard-actions .button:disabled{opacity:.55;cursor:wait}
.wizard-back{display:flex;align-items:center;gap:7px;border:0;background:transparent;color:#527087;font-size:13px;min-height:48px;padding:8px 2px}
.wizard-back svg{width:18px;height:18px}
#wizard-step-count{font-size:11px;line-height:1.6;color:#8292a0;margin-right:auto}
.wizard-back:not([hidden])+#wizard-step-count{margin:0 auto}
#book .form-footnote{font-size:11px;line-height:1.8;color:#7d8d99;text-align:center;max-width:500px;margin:20px auto 0}
#book .booking-result{padding:35px 38px;border:0}
#book .booking-result h3{font-size:36px}
#book .booking-result{scroll-margin-top:95px}
.result-heading{display:flex;gap:18px;align-items:center;margin-bottom:18px}
.result-mark{display:grid;place-items:center;width:60px;height:60px;flex-shrink:0;border-radius:50%;background:#e4edf5;color:#173f60}
.result-mark svg{width:27px;height:27px}
.result-heading .overline{font-size:10px;letter-spacing:1.5px;margin:0 0 8px;color:#5b7890}
#book .result-heading h3{margin:0}
#result-description{font-size:14px;line-height:1.8;color:#5a6f80;max-width:650px;margin-bottom:25px}
.result-flow-title{font-size:12px;line-height:1.8;color:#6c8192;margin-bottom:12px}
.notification-flow{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:24px}
.notification-flow article{display:flex;gap:13px;align-items:flex-start;padding:20px 18px;border:1px solid #dbe5ed;border-radius:20px;background:#f3f7fa}
.notification-icon{width:37px;height:37px;display:grid;place-items:center;border-radius:50%;background:#fff;flex-shrink:0;color:#345b7a}
.notification-icon svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.notification-flow h4{font:500 14px/1.6 var(--sans);margin:0 0 5px;color:#173f60}
.notification-flow p{font-size:11px;line-height:1.8;color:#687f91;margin:0;overflow-wrap:anywhere}
#book #result-details{font-size:12px;margin-bottom:18px}
#result-footnote{font-size:12px;line-height:1.85;color:#6c8192;margin-bottom:0}
#book .booking-result .button{margin-top:22px}
@media(prefers-reduced-motion:no-preference){
  .booking-result:not([hidden]) .notification-flow article{animation:notification-in .42s both}
  .booking-result:not([hidden]) .notification-flow article+article{animation-delay:.12s}
  @keyframes notification-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
}
@media(max-width:700px){
  .result-heading{gap:13px;margin-bottom:15px}
  .result-mark{width:47px;height:47px}
  .result-mark svg{width:22px;height:22px}
  #book .result-heading h3{font-size:29px}
  .result-heading .overline{font-size:9px;margin-bottom:6px}
  #result-description{font-size:13px;line-height:1.8;margin-bottom:20px}
  .notification-flow{grid-template-columns:1fr;gap:10px;margin-bottom:20px}
  .notification-flow article{padding:15px;border-radius:17px}
  .notification-flow h4{font-size:13px}
  .notification-flow p{font-size:11px}
  #book .booking-result{scroll-margin-top:90px}
  #book #result-details{grid-template-columns:100px 1fr;font-size:11px}
}
@media(max-width:700px){
  #book .booking-heading{margin-bottom:28px}
  #book .booking-heading h2{font-size:38px;line-height:1.16}
  #book .booking-heading p:not(.overline){font-size:14px;line-height:1.85}
  .booking-host{padding:22px 22px;gap:15px}
  .booking-host-name{font-size:22px}
  .booking-host-note{font-size:10px}
  .booking-host .timezone{font-size:10px;gap:5px}
  .booking-host .timezone svg{width:15px;height:15px}
  #book .mode-notice{padding:14px 22px;display:block}
  #book .mode-notice>span{font-size:10px;display:block;margin-bottom:4px}
  #book .mode-notice p{font-size:10px}
  .booking-progress{padding:27px 12px 18px;scroll-margin-top:8px}
  .booking-progress button{font-size:10px;gap:9px;min-height:72px;padding:0 2px}
  .booking-progress .progress-icon{width:43px;height:43px}
  .booking-progress svg{width:20px;height:20px}
  .booking-progress button::before{top:21px;right:calc(50% + 25px);width:calc(100% - 50px)}
  .wizard-body{padding:4px 22px 23px}
  .wizard-title{margin:8px 0 24px}
  .wizard-kicker{font-size:9px;letter-spacing:1.2px;margin-bottom:10px}
  #book .wizard-title h3{font-size:30px;line-height:1.25;letter-spacing:-.7px;margin-bottom:12px;scroll-margin-top:105px}
  #book .wizard-title p{font-size:13px;line-height:1.85}
  .visit-options{grid-template-columns:1fr;gap:11px}
  .visit-option,.guidance-option{min-height:87px;padding:17px 16px;gap:14px}
  .visit-option strong{font-size:14px}
  .visit-option small{font-size:11px}
  #book .wizard-calendar{padding:15px 5px 0;border:0;border-radius:0;max-width:460px;margin-left:-17px;margin-right:-17px}
  #book #calendar-month{font-size:15px}
  #book .calendar-header{gap:5px;margin-bottom:12px}
  #book .calendar-weekdays,#book .calendar-grid{gap:3px}
  #book .calendar-weekdays{font-size:10px}
  #book .calendar-grid button{font-size:12px}
  #book .date-summary{margin:17px 0 0;font-size:11px;padding:13px 8px;border-radius:12px;border:0}
  #book .wizard-note{font-size:11px;line-height:1.85;margin-top:19px}
  #book .time-options{grid-template-columns:1fr;gap:12px}
  #book .time-options .time-choice{min-height:91px;display:grid;grid-template-columns:38px 1fr;column-gap:20px;row-gap:2px;text-align:left;align-content:center;justify-items:start;padding:17px 23px;border-radius:16px}
  #book .time-choice svg{width:32px;height:32px;margin:0;grid-row:1/3}
  #book .time-choice strong{font-size:15px;grid-column:2}
  #book .time-choice small{font-size:11px;grid-column:2;margin:0}
  #book .details-panel .field-row{grid-template-columns:1fr;gap:0}
  #book .details-panel .field>label{font-size:14px}
  #book .details-panel .field{margin-bottom:21px}
  #book .details-panel input:not([type=checkbox]),#book .details-panel textarea{font-size:16px}
  #book .consent{font-size:11px;line-height:1.9}
  .wizard-actions{gap:12px;flex-wrap:wrap;margin-top:26px;padding-top:20px}
  .wizard-actions .button{min-width:0;font-size:12px;padding:13px 19px;gap:16px}
  #wizard-step-count{font-size:10px}
  .wizard-back{font-size:12px}
  .wizard-back:not([hidden])+#wizard-step-count{display:none}
  #book .form-footnote{font-size:10px;line-height:1.9;margin-top:18px}
  #book .booking-result{padding:28px 22px}
}
@media(max-width:380px){
  .booking-host{padding:20px 16px;gap:8px}
  .booking-host-name{font-size:20px}
  .booking-host .timezone{font-size:8px;gap:4px}
  .booking-host .timezone svg{width:13px;height:13px}
  .wizard-body{padding-left:15px;padding-right:15px}
  #book .mode-notice{padding-left:16px;padding-right:16px}
  .booking-progress{padding-left:8px;padding-right:8px}
  .booking-progress .progress-icon{width:38px;height:38px}
  .booking-progress button::before{top:19px;right:calc(50% + 22px);width:calc(100% - 44px)}
  #book .wizard-title h3{font-size:28px}
  .visit-option{padding:15px 12px;gap:9px}
  .visit-option strong{font-size:13px}
  #book .wizard-calendar{padding-left:3px;padding-right:3px;margin-left:-12px;margin-right:-12px}
  #book .calendar-weekdays,#book .calendar-grid{gap:3px}
  #book .date-summary{margin-left:0;margin-right:0;font-size:10px}
  #book .calendar-grid button{font-size:11px}
  .wizard-actions .button{padding-left:16px;padding-right:16px;gap:10px;font-size:11px}
}
