/* Simple variation: same tokens and components as style.css, one centred column, larger type and targets. */
.simple{font-size:16px}
.simple .site-shell{max-width:680px;padding:0 20px 112px}
.simple .site-header{height:auto;padding:18px 0;border-bottom:0}
.simple .brand-logo{width:64px}
.simple .contact-links{flex-direction:row;align-items:center;gap:18px;font-size:14px}
.simple .intro{flex-direction:column;align-items:flex-start;gap:10px;padding:14px 0 26px}
.simple .intro h1{font-size:clamp(42px,9vw,58px);letter-spacing:-2.2px}
.simple .opening-days{font-size:15px;white-space:normal;line-height:1.5}

/* Every step is its own card, stacked in order. */
.simple .booking-layout{display:flex;flex-direction:column;align-items:stretch;gap:16px}
.simple #booking-form{width:100%;display:grid;gap:16px;background:none;border:0;border-radius:0;overflow:visible}
.simple .form-section,.simple .form-section:last-child,.simple .summary-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:24px}
.simple .section-heading{align-items:center;gap:14px;margin-bottom:20px}
.simple .step-number{width:34px;height:34px;margin:0;background:var(--olive);border-color:var(--olive);color:var(--white);font-size:15px;font-weight:600}
.simple .section-heading h2{font-size:22px;letter-spacing:-.5px;line-height:1.3}
.simple .context-note{font-size:14px;line-height:1.6}
.simple .field-error{font-size:14px}

/* Services: one clear row each; name left, price right. */
.simple .service-options{grid-template-columns:1fr;gap:10px}
.simple .service-card{display:grid;grid-template-columns:44px minmax(0,1fr) auto 22px;column-gap:14px;row-gap:2px;align-items:center;min-height:82px;padding:14px 18px}
.simple .service-top{display:contents}
.simple .service-symbol{grid-column:1;grid-row:1/3}
.simple .service-name{grid-column:2;grid-row:1;align-self:end;font-size:17px}
.simple .service-description{grid-column:2;grid-row:2;align-self:start;margin:0;font-size:14px;line-height:1.4}
.simple .service-bottom{grid-column:3;grid-row:1/3;margin:0}
.simple .service-bottom strong{font-size:24px}
.simple .radio-indicator{grid-column:4;grid-row:1/3;width:22px;height:22px}
.simple .people-count{margin:16px 0 0;padding:10px 10px 10px 16px;background:var(--bg);border-radius:var(--radius);font-size:15px}
.simple .people-count select,.simple .person-service select{min-height:48px;font-size:16px}
.simple .people-count select:invalid{color:var(--muted)}
.simple .people-count.is-invalid{background:var(--error-bg);box-shadow:inset 0 0 0 1px var(--error)}
.simple .people-count.is-invalid select{border-color:var(--error)}
.simple .people-count.needs-answer{animation:people-prompt 1.2s ease-out}
@keyframes people-prompt{0%,40%{box-shadow:inset 0 0 0 2px var(--olive);background:var(--sage)}}
.simple #people-error{margin-top:8px}
.simple .person-heading{margin:16px 0 0;font-size:14px;font-weight:500;color:var(--muted)}
.simple .person-service{grid-template-columns:90px minmax(0,1fr);font-size:15px}

/* Day and time. */
.simple .date-heading h3,.simple .time-heading h3{font-size:16px}
.simple .date-navigation button{width:44px;height:44px;font-size:18px}
.simple .dates{gap:10px;margin-bottom:26px}
.simple .date-button{min-height:98px}
.simple .date-button span{font-size:12px}
.simple .date-button strong{font-size:28px}
.simple .date-button small{font-size:13px}
.simple .time-heading>span{font-size:13px}
.simple .time-slots{grid-template-columns:repeat(3,1fr);gap:10px}
.simple .time-button{height:52px;border-radius:10px;font-size:16px}
.simple .time-slots>.muted{font-size:15px}
.simple .repeat-label strong{font-size:15px}
.simple .repeat-label small{font-size:13px}
.simple .repeat-top,.simple .repeat-row{font-size:14px}
.simple .repeat-row small{font-size:12px}
.simple .repeat-top select,.simple .repeat-row select{font-size:16px}

/* Details. */
.simple .fields{grid-template-columns:1fr;gap:18px}
.simple .field label{font-size:15px}
.simple .field input{height:54px;padding:0 16px;border-radius:10px;font-size:16px}
.simple .privacy-note{font-size:13px;line-height:1.5}

/* Check and book. */
.simple .summary-column{position:static;width:100%}
.simple .summary-card{background:var(--sage);border-color:#dce1d4;box-shadow:none}
.simple .summary-service strong{font-size:17px}
.simple .summary-service div>span{font-size:14px}
.simple .summary-service>span{font-size:17px}
.simple .summary-person{font-size:14px}
.simple .summary-person small{font-size:13px}
.simple .summary-schedule{gap:14px;font-size:16px}
.simple .summary-icon,.simple svg.summary-icon{width:18px;height:18px}
.simple .summary-total div>span{font-size:16px}
.simple .summary-total small{font-size:13px}
.simple .summary-total strong{font-size:34px}
.simple .series-total{font-size:14px}
.simple .summary-card>.primary-button{display:flex;width:100%;min-height:58px;font-size:17px;border-radius:12px}
.simple .no-payment{display:block;font-size:13px}

/* Sticky bar at every width; slides away once the Check and book card is on screen. */
.simple .mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:10;align-items:center;justify-content:space-between;gap:12px;padding:12px max(20px,calc((100% - 640px) / 2)) max(12px,env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -5px 20px #252a2308;transition:transform .25s ease-out,visibility .25s}
.simple .mobile-bar>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.simple .mobile-bar strong{font-size:22px;font-weight:500;letter-spacing:-.7px}
.simple .mobile-bar>div>span{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.simple .mobile-bar .primary-button{min-height:52px;min-width:190px;font-size:15px}
.simple.summary-visible .mobile-bar{transform:translateY(110%);visibility:hidden}

/* Confirmation. */
.simple .confirmation{margin:0 0 40px;padding:36px 24px}
.simple .confirmation>p:not(.eyebrow){font-size:15px}
.simple .confirmed-row{font-size:15px}
.simple .confirmed-person{font-size:13px}
.simple .reference{font-size:12px!important}
.simple .confirmation-actions .primary-button,.simple .secondary-button{min-height:52px;font-size:15px}

.simple footer{font-size:13px}
.simple .footer-contact{font-size:13px}

@media(max-width:480px){
  .simple .site-shell{padding-left:16px;padding-right:16px}
  .simple .contact-links a[target] span{display:none}
  .simple .form-section,.simple .form-section:last-child,.simple .summary-card{padding:20px 16px}
  .simple .service-card{grid-template-columns:40px minmax(0,1fr) auto 20px;column-gap:12px;padding:14px}
  .simple .service-name{font-size:16px}
  .simple .service-description{font-size:13px}
  .simple .service-bottom strong{font-size:21px}
  .simple .radio-indicator{width:20px;height:20px}
  .simple .dates{gap:6px}
  .simple .date-button{min-height:88px}
  .simple .date-button strong{font-size:24px}
  .simple .people-count{gap:10px;font-size:14px}
  .simple .people-count select{width:124px}
  .simple .mobile-bar{padding-left:16px;padding-right:16px}
  .simple .mobile-bar .primary-button{min-width:0}
  .simple .confirmation-actions{flex-direction:column}
}

/* Location and owner approval page. */
.simple .location-note{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--olive);line-height:1.4}
.simple .location-icon{flex-shrink:0}
.simple .location-note span{color:var(--ink)}
.simple .summary-location{color:var(--muted)}
.simple .admin-booking{margin-top:32px;text-align:left}
.simple .admin-booking h1{font-size:40px}
.simple .admin-booking>p{color:var(--ink)!important}
.simple .admin-booking a{color:var(--olive);text-decoration:underline;text-underline-offset:3px}
.simple .admin-booking form{margin-top:22px}
.simple .admin-booking .primary-button{width:100%;justify-content:center;min-height:56px;font-size:16px}
.simple .admin-actions{display:grid;gap:10px;margin-top:22px}
.simple .admin-actions form{margin:0}
.simple .admin-actions .secondary-button{display:flex;align-items:center;justify-content:center;min-height:52px;font-size:15px;text-decoration:none;color:var(--ink)}
.simple .admin-booking .decline-button{background:var(--error);border-color:var(--error)}
.simple .admin-booking .decline-button:hover:not(:disabled){background:#8a2a21}

/* Brand logo (already olive, transparent) and per-service icons. */
.simple .brand-logo{width:92px;border-radius:0}
.simple .brand-logo img{filter:none}
.simple .intro h1{font-size:clamp(36px,7.5vw,50px);letter-spacing:-1.8px}
.simple .service-symbol-kids,.simple .service-symbol-highschool{background-size:contain;background-position:center}
.simple .service-symbol-kids{background-image:url("/icon-kids.png")}
.simple .service-symbol-highschool{background-image:url("/icon-highschool.png")}
@media(max-width:480px){.simple .brand-logo{width:76px}}
.simple .intro{padding-top:40px}
@media(max-width:480px){.simple .intro{padding-top:28px}}

/* One matching icon set in the booking summary. */
.simple .summary-schedule>div{gap:12px}
.simple .summary-schedule svg.summary-icon{width:20px;height:20px;color:var(--olive);flex-shrink:0}

/* Drawn arrow on Book buttons (the ↗ character shows as a blue emoji on iPhones). */
.simple .button-arrow{flex-shrink:0}
