/* INSPIRE STUDIOS – 09-responsive.css — RESPONSIVE OVERRIDES */

/* 1190px and below: narrower side panel */
@media(max-width:1190px){
 .csb-page .csb-layout{grid-template-columns:275px minmax(0,1fr)}
 .csb-page .csb-main{padding:31px 25px 65px}
 .csb-page .csb-heading h1{font-size:43px}
 .csb-page .csb-package{padding:22px 20px}
 .csb-page .csb-package-name{font-size:26px}
 .csb-page .csb-photo{height:410px}
 .csb-page .csb-sidebar-bottom{min-height:430px;padding:28px 16px}
 .csb-page .csb-side-title{font-size:23px}
 .csb-page .csb-side-meta{gap:8px;font-size:12px}
 .csb-page .csb-side-meta .csb-side-date{font-size:11px;letter-spacing:-.38px}
 .csb-page .csb-calendar{padding:16px 10px}
 .csb-page .csb-day{min-height:53px}
 .csb-page .csb-day .csb-num{font-size:19px}
}

/* 940px and below: booking sidebar moves above main flow */
@media(max-width:940px){
 .csb-page .csb-layout{grid-template-columns:1fr}
 .csb-page .csb-sidebar{display:grid;grid-template-columns:1fr 1fr;min-height:250px}
 .csb-page .csb-photo{height:260px}
 .csb-page .csb-sidebar-bottom{min-height:260px;padding:28px 15px}
 .csb-page .csb-holly,.csb-page .csb-side-footer{display:none}
 .csb-page .csb-main{padding:29px 20px 65px}
 .csb-page .csb-heading h1{font-size:44px}
 .csb-page .csb-side-meta .csb-side-date{font-size:12px}
}

/* Phones: generous calendar symbols while keeping 7 dates per row */
@media(max-width:660px){
 .csb-page .csb-sidebar{grid-template-columns:1fr;display:block}
 .csb-page .csb-photo{height:350px}
 .csb-page .csb-photo img{object-position:center 30%}
 .csb-page .csb-photo-title{font-size:31px}
 .csb-page .csb-sidebar-bottom{min-height:0;padding:18px 16px 20px}
 .csb-page .csb-side-title{font-size:22px}
 .csb-page .csb-sidebar-bottom .csb-divider{display:none}
 .csb-page .csb-side-meta{display:flex;max-width:305px;font-size:12.5px;margin:12px auto 0;gap:10px}
 .csb-page .csb-side-meta .csb-side-date{font-size:12.5px;letter-spacing:-.2px}
 .csb-page .csb-side-meta svg{width:20px;height:20px;flex-basis:20px}
 .csb-page .csb-main{padding:22px 14px 82px}
 .csb-page .csb-heading{margin-bottom:17px}
 .csb-page .csb-heading h1{font-size:37px}
 .csb-page .csb-brand{font-size:12px;letter-spacing:2px}
 .csb-page .csb-subtitle{font-size:9px;letter-spacing:1.4px}
 .csb-page .csb-top-sprig{width:120px;height:100px}
 .csb-page .csb-stepper{gap:2px;margin-bottom:20px}
 .csb-page .csb-step{font-size:8px;gap:5px}
 .csb-page .csb-step-number{width:28px;height:28px;font-size:17px;box-shadow:0 0 0 3px #fbf7f1}
 .csb-page .csb-step:not(:last-child)::after{top:16px;width:calc(100% + 2px)}
 .csb-page .csb-grid2,.csb-page .csb-calendar-wrap,.csb-page .csb-date-time,.csb-page .csb-attendee-controls,.csb-page .csb-note-row{grid-template-columns:1fr}
 .csb-page .csb-fieldrow{grid-template-columns:1fr;gap:0}
 .csb-page .csb-panel{padding:17px}
 .csb-page .csb-package{min-height:0;padding:24px}
 .csb-page .csb-package-name{font-size:27px}
 .csb-page .csb-price{font-size:44px}
 .csb-page .csb-calendar{padding:15px 11px}
 .csb-page .csb-days-grid{gap:3px}
 .csb-page .csb-weekday{font-size:10px}
 .csb-page .csb-day{min-height:47px}
 .csb-page .csb-day .csb-num{font-size:18px}
 .csb-page .csb-day .csb-dot{width:9px;height:9px}
 .csb-page .csb-day .csb-symbol{font-size:20px;min-height:17px}
 .csb-page .csb-times{grid-template-columns:repeat(3,minmax(0,1fr))}
 .csb-page .csb-summary{position:static}
 .csb-page .csb-buttons{flex-direction:column-reverse;align-items:stretch}
 .csb-page .csb-buttons>*{width:100%;text-align:center}
 .csb-page .csb-success h2{font-size:42px}
 .csb-page .csb-settings-toggle{left:12px;bottom:12px}
 .csb-page .csb-settings{left:12px;bottom:65px}
 .csb-page .csb-admin-stats{gap:7px}
 .csb-page .csb-stat{padding:10px}
 .csb-page .csb-stat b{font-size:25px}
 .csb-page .csb-admin-bookings{font-size:9px}
 .csb-page .csb-admin-bookings th,.csb-page .csb-admin-bookings td{padding:6px 4px}
}





/* SIDEBAR - TABLET */

@media (max-width: 1190px) and (min-width: 941px) {
.csb-page .csb-layout {
grid-template-columns: 310px minmax(0, 1fr);
}
.csb-page .csb-side-title {
font-size: 20px;
letter-spacing: 0;
}
.csb-page .csb-side-meta,
.csb-page .csb-side-meta span {
font-size: 15px;
}
.csb-page .csb-side-meta .csb-side-date {
font-size: 15px;
letter-spacing: -0.45px;
}
}
/* SIDEBAR - SMALL TABLET */
@media (max-width: 940px) {
.csb-page .csb-side-title {
font-size: 21px;
letter-spacing: 0.2px;
}
.csb-page .csb-side-meta,
.csb-page .csb-side-meta span {
font-size: 16px;
}
.csb-page .csb-side-meta .csb-side-date {
font-size: 15.8px;
letter-spacing: -0.35px;
}
}
/* MOBILE CHANGES */
@media (max-width: 660px) {
.csb-page .csb-side-title {
font-size: 21px;
letter-spacing: 0.2px;
}
.csb-page .csb-side-meta,
.csb-page .csb-side-meta span {
font-size: 16px;
}
.csb-page .csb-side-meta .csb-side-date {
font-size: 15.8px;
letter-spacing: -0.45px;
}
.csb-page .csb-side-meta svg {
width: 23px;
height: 23px;
flex-basis: 23px;
}
.csb-page .csb-legend {
gap: 22px;
padding: 16px 18px;
font-size: 13.5px;
}
.csb-page .csb-deposit-notice {
font-size: 15px;
padding: 17px 15px;
}
.csb-page .csb-studio-location {
font-size: 15px;
}
}

@media(prefers-reduced-motion:reduce){.csb-page *{transition:none!important}}





/* MOBILE BRAND TITLE AND ORNAMENT */

@media (max-width: 660px) {
  .csb-page .csb-brand {
    font-family: 'Cinzel', Georgia, serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    line-height: 1.6;
  }

  .csb-page .csb-brand-mini {
    font-size: 28px;
    gap: 13px;
    margin: 9px auto 17px;
  }

  .csb-page .csb-brand-mini::before,
  .csb-page .csb-brand-mini::after {
    width: 55px;
    flex-basis: 55px;
  }

  .csb-page .csb-packages-actions {
    justify-content: center;
  }

  .csb-page .csb-packages-actions .csb-btn {
    font-size: 14px;
  }
}





/* =========================================
   COMPACT CALENDAR - DESKTOP & MOBILE
   ========================================= */

/* SHORTER CALENDAR DATE BOXES */

.csb-page .csb-calendar-vintage .csb-day {
  min-height: 70px;
  padding-top: 22px;
  padding-bottom: 3px;
}

.csb-page .csb-calendar-vintage .csb-cal-slot-list {
  gap: 1px;
}

.csb-page .csb-calendar-vintage .csb-cal-slot {
  padding: 1px 0;
}


/* =========================================
   MOBILE ONLY
   ========================================= */

@media (max-width: 660px) {

  /* STEP 1 - TWO PACKAGES SIDE BY SIDE */

  .csb-page .csb-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    align-items: stretch;
  }

  .csb-page .csb-package {
    min-width: 0;
    min-height: 0;
    padding: 13px 10px 14px;
    border-radius: 9px;
  }

  .csb-page .csb-package .csb-radio {
    top: 10px;
    right: 10px;
    width: 16px;
    height: 16px;
  }

  .csb-page .csb-package.selected .csb-radio:before {
    width: 8px;
    height: 8px;
  }

  .csb-page .csb-package-name {
    padding-right: 0;
    margin-top: 16px;
    font-size: 19px;
    line-height: 1.2;
    letter-spacing: 0;
  }

  /* SMALLER PACKAGE PRICES */

  .csb-page .csb-package .csb-price {
    font-size: 28px;
    line-height: 1.1;
    margin: 10px 0 3px;
  }

  /* PACKAGE INCLUSIONS */

  .csb-page .csb-package .csb-checks {
    margin-top: 12px;
  }

  .csb-page .csb-package .csb-checks li {
    gap: 5px;
    margin-bottom: 9px;
    font-size: 10.5px;
    line-height: 1.45;
    overflow-wrap: break-word;
  }

  .csb-page .csb-package .csb-check {
    font-size: 12px;
    line-height: 1.45;
  }

  .csb-page .csb-package .csb-pill {
    margin-top: 8px;
    padding: 7px 8px;
    font-size: 10px;
    line-height: 1.4;
  }

  /* SMALLER DEPOSIT NOTICE */

  .csb-page .csb-deposit-notice {
    margin: 17px 0 11px;
    padding: 12px 13px;
    font-size: 12.5px;
    line-height: 1.65;
  }

  /* STEP 1 - SMALLER CONTINUE BUTTON */

  .csb-page .csb-packages-actions {
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
  }

  .csb-page .csb-packages-actions .csb-btn {
    width: auto;
    max-width: 100%;
    min-height: 43px;
    padding: 11px 16px;
    font-size: 12.5px;
    line-height: 1.3;
  }


  /* =====================================
     STEP 2 - SWIPE BETWEEN MONTHS
     ===================================== */

  .csb-page .csb-calendar-wrap {
    display: flex;
    grid-template-columns: none;
    gap: 10px;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
  }

  .csb-page .csb-calendar-wrap > .csb-calendar-vintage {
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }


  /* SMALLER CALENDAR */

  .csb-page .csb-calendar-vintage {
    padding: 12px 8px;
  }

  .csb-page .csb-calendar-vintage .csb-calendar-head {
    margin-bottom: 11px;
  }

  .csb-page .csb-calendar-vintage .csb-calendar-head h3 {
    font-size: 17px;
  }

  .csb-page .csb-calendar-vintage .csb-weekday {
    padding: 5px 0 7px;
    font-size: 9px;
  }

  /* SHORTER DATE BOXES */

  .csb-page .csb-calendar-vintage .csb-day {
    min-height: 63px;
    padding: 19px 1px 3px;
  }

  /* DATE NUMBER TOP RIGHT */

  .csb-page .csb-calendar-vintage .csb-day .csb-num {
    top: 4px;
    right: 4px;
    font-size: 12px;
  }

  /* AVAILABLE HOURS INSIDE CALENDAR */

  .csb-page .csb-calendar-vintage .csb-cal-slot-list {
    gap: 1px;
  }

  .csb-page .csb-calendar-vintage .csb-cal-slot {
    padding: 1px 0;
    font-size: 9px;
    line-height: 1.1;
  }


  /* =====================================
     STEP 2 - SELECTED DATE PANEL
     ===================================== */

  .csb-page .csb-time-panel {
    margin-top: 11px;
    padding: 13px;
  }

  /* SMALLER SELECTED DATE TITLE */

  .csb-page .csb-time-panel h2.csb-time-heading {
    margin-bottom: 7px;
    font-size: 24px;
    line-height: 1.2;
  }

  .csb-page .csb-selected-day-number {
    font-size: 24px;
  }

  /* SESSIONS RESERVED / REMAINING */

  .csb-page .csb-times-availability {
    margin-bottom: 10px;
    font-size: 12px;
    line-height: 1.5;
  }

  .csb-page .csb-availability-number {
    font-size: 14px;
  }

  /* SMALLER TIME SLOT BUTTONS */

  .csb-page .csb-time-panel .csb-times {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin: 10px 0 12px;
  }

  .csb-page .csb-time-panel .csb-time {
    min-height: 62px;
    padding: 9px 5px;
  }

  /* SMALLER TIME NUMBERS */

  .csb-page .csb-time-panel .csb-time-hour {
    font-size: 17px;
  }

  /* SMALLER STATUS TEXT */

  .csb-page .csb-time-panel .csb-time-caption {
    margin-top: 4px;
    font-size: 10.5px;
    line-height: 1.3;
  }

  .csb-page .csb-time-note {
    margin-top: 7px;
    font-size: 11.5px;
    line-height: 1.5;
  }


  /* =====================================
     STEP 2 - COMPACT NAVIGATION BUTTONS
     ===================================== */

  .csb-page .csb-calendar-wrap ~ .csb-buttons {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 9px;
  }

  .csb-page .csb-calendar-wrap ~ .csb-buttons > * {
    width: auto;
    min-width: 0;
  }

  .csb-page .csb-calendar-wrap ~ .csb-buttons .csb-btn {
    min-height: 43px;
    padding: 11px 14px;
    font-size: 12px;
    line-height: 1.3;
  }

  .csb-page .csb-calendar-wrap ~ .csb-buttons .csb-ghost {
    padding: 8px 3px;
    font-size: 12px;
  }
}




/* MONTH MISMATCH NOTICE */

.csb-page .csb-wrong-month-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin: 12px 0;
  padding: 12px 14px;
  background: #fff0d2;
  color: #69451e;
  border: 1px solid #ddb775;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
}

.csb-page .csb-wrong-month-notice button {
  padding: 9px 12px;
  border: 1px solid #be985e;
  border-radius: 7px;
  background: #fffaf2;
  color: #6d2333;
  font-size: 12px;
  font-weight: 700;
}

.csb-page .csb-calendar-vintage
.csb-day.csb-preview-month:not(:disabled) {
  opacity: 1;
  background: #fff9ef;
  cursor: pointer;
}


/* MOBILE DESIGN - ALL BOOKING STEPS */

@media (max-width: 660px) {

  /* BACK AND NEXT BUTTONS */

  .csb-page #csb-content .csb-buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 17px;
  }

  .csb-page #csb-content .csb-buttons > * {
    width: auto;
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
  }

  .csb-page #csb-content .csb-buttons .csb-btn,
  .csb-page #csb-content > .csb-details-step + .csb-buttons .csb-btn {
    min-height: 44px;
    padding: 11px 14px;
    font-size: 12px;
    line-height: 1.3;
    letter-spacing: 0;
  }

  .csb-page #csb-content .csb-buttons .csb-ghost,
  .csb-page #csb-content > .csb-details-step + .csb-buttons .csb-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 14px;
    background: #fff9f0;
    border: 1px solid #d5b895;
    border-radius: 8px;
    color: #75253a;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
  }

  .csb-page #csb-content .csb-packages-actions,
  .csb-page #csb-content .csb-confirmation-actions {
    justify-content: flex-end;
  }


  /* STEP 3 - ADULTS AND CHILDREN */

  .csb-page #csb-content .csb-attendee-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .csb-page #csb-content
  .csb-date-time:has(.csb-attendee-controls)
  > .csb-panel:first-child {
    padding: 13px;
  }

  .csb-page #csb-content
  .csb-date-time:has(.csb-attendee-controls)
  > .csb-panel:first-child > h2 {
    font-size: 27px;
  }

  .csb-page #csb-content .csb-counter {
    min-width: 0;
    padding: 11px 8px;
    border-radius: 8px;
  }

  .csb-page #csb-content .csb-counter h3 {
    font-size: 21px;
  }

  .csb-page #csb-content .csb-counter .csb-small {
    font-size: 10px;
    line-height: 1.45;
    margin-top: 3px;
  }

  .csb-page #csb-content .csb-count-ui {
    justify-content: space-between;
    gap: 5px;
    margin-top: 11px;
  }

  .csb-page #csb-content .csb-count-ui button {
    width: 31px;
    height: 34px;
    flex: 0 0 31px;
    font-size: 20px;
  }

  .csb-page #csb-content .csb-count-ui strong {
    min-width: 15px;
    font-size: 19px;
  }


  /* CHILDREN INFORMATION NOTICE */

  .csb-page #csb-content
  .csb-date-time:has(.csb-attendee-controls)
  .csb-alert {
    display: block;
    padding: 10px 12px;
    margin-top: 13px;
    font-size: 11.5px;
    line-height: 1.5;
  }

  .csb-page #csb-content
  .csb-date-time:has(.csb-attendee-controls)
  .csb-alert-icon {
    display: none;
  }


  /* YOUR BOOKING - STEPS 3, 4 AND 5 */

  .csb-page #csb-content
  .csb-date-time .csb-summary {
    padding: 14px;
    border-radius: 9px;
  }

  .csb-page #csb-content
  .csb-date-time .csb-summary h2 {
    font-size: 27px;
    margin-bottom: 8px;
  }

  .csb-page #csb-content
  .csb-date-time .csb-summary .csb-row {
    gap: 9px;
    padding: 8px 0;
    font-size: 12px;
    line-height: 1.45;
  }

  .csb-page #csb-content
  .csb-date-time .csb-summary .csb-row strong {
    max-width: 58%;
    font-size: 12px;
    line-height: 1.45;
    overflow-wrap: anywhere;
  }

  .csb-page #csb-content
  .csb-date-time .csb-summary
  .csb-row strong.csb-money {
    font-family: 'Bodoni Moda', Georgia, serif;
    font-size: 17px;
  }

  .csb-page #csb-content
  .csb-date-time .csb-summary .csb-total {
    margin-top: 12px;
    padding: 11px 12px;
  }

  .csb-page #csb-content
  .csb-date-time .csb-summary .csb-total > span {
    font-size: 12px;
  }

  .csb-page #csb-content
  .csb-date-time .csb-summary .csb-total b {
    font-family: 'Bodoni Moda', Georgia, serif;
    font-size: 24px;
  }


  /* STEP 4 - CONTACT INFORMATION */

  .csb-page #csb-content
  .csb-details-step > .csb-panel:first-child {
    padding: 13px;
  }

  .csb-page #csb-content
  .csb-details-step > .csb-panel:first-child > h2 {
    font-size: 28px;
  }

  .csb-page #csb-content
  .csb-details-step .csb-details-intro {
    margin: 6px 0 13px;
    font-size: 12px;
  }


  /* FIRST NAME AND LAST NAME - SAME ROW */

  .csb-page #csb-content
  .csb-details-step .csb-fieldrow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  /* EMAIL AND PHONE - SEPARATE ROWS */

  .csb-page #csb-content
  .csb-details-step .csb-fieldrow
  > .csb-field:nth-child(n+3) {
    grid-column: 1 / -1;
  }

  .csb-page #csb-content
  .csb-details-step .csb-field {
    min-width: 0;
    margin-bottom: 7px;
    gap: 4px;
  }

  .csb-page #csb-content
  .csb-details-step .csb-field label {
    margin-bottom: 0;
    font-size: 12px;
  }

  .csb-page #csb-content
  .csb-details-step .csb-field > input {
    min-width: 0;
    min-height: 43px;
    padding: 9px;
    font-size: 16px;
    border-radius: 7px;
  }

  .csb-page #csb-content
  .csb-details-step .csb-field input::placeholder {
    font-size: 12px;
  }

  /* EMAIL WIDTH */

  .csb-page #csb-content
  .csb-details-step #csb-email {
    max-width: 315px;
  }


  /* TELEPHONE PREFIX AND NUMBER */

  .csb-page #csb-content
  .csb-details-step .csb-phone-control {
    max-width: 345px;
    min-height: 43px;
  }

  .csb-page #csb-content
  .csb-details-step .csb-phone-control select {
    width: 104px;
    flex: 0 0 104px;
    padding: 8px 5px;
    font-size: 12px;
  }

  .csb-page #csb-content
  .csb-details-step .csb-phone-control input {
    min-width: 0;
    width: 100%;
    padding: 9px;
    font-size: 16px;
  }


  /* TERMS AND CONDITIONS */

  .csb-page #csb-content
  .csb-details-step .csb-checkbox {
    gap: 8px;
    margin: 11px 0;
    font-size: 12px;
    line-height: 1.5;
  }

  .csb-page #csb-content
  .csb-details-step .csb-checkbox input {
    width: 16px;
    height: 16px;
    min-width: 16px;
    flex: 0 0 16px;
    margin-top: 2px;
  }

  .csb-page #csb-content
  .csb-details-step .csb-checkbox a {
    font-size: 12px;
  }

}
