
/* =========================================================
   LV RENEW & REFINE — PRODUCT / BOOKING PAGE
   ========================================================= */

:root {
  --rr-espresso: #281108;
  --rr-brown: #452116;
  --rr-gold: #d9a247;
  --rr-gold-light: #efca78;
  --rr-cream: #f8f2e9;
  --rr-ivory: #fffaf4;
  --rr-text: #38241a;
  --rr-muted: #735f53;
  --rr-border: rgba(110,75,48,.18);
}


.page-renew-refine {
  background:
    var(--rr-cream);

  color:
    var(--rr-text);
}


/* =========================================================
   PRODUCT HERO
   ========================================================= */

.rr-product-hero {
  width:
    min(1240px, calc(100% - 44px));

  margin:
    42px auto 0;

  display:
    grid;

  grid-template-columns:
    1.08fr .92fr;

  min-height:
    620px;

  overflow:
    hidden;

  border:
    1px solid
    var(--rr-border);

  border-radius:
    26px;

  background:
    #fffaf4;

  box-shadow:
    0 28px 70px
    rgba(63,36,20,.10);
}


.rr-product-image {
  position:
    relative;

  min-height:
    620px;

  background:
    linear-gradient(
      180deg,
      rgba(25,10,4,.02),
      rgba(25,10,4,.16)
    ),
    url("assets/images/hydro-facials.png")
    center center / cover no-repeat;
}


.rr-product-badge {
  position:
    absolute;

  left:
    28px;

  bottom:
    28px;

  padding:
    10px 15px;

  border-radius:
    999px;

  background:
    rgba(255,250,244,.94);

  color:
    #4e3222;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    .15em;
}


.rr-product-summary {
  display:
    flex;

  flex-direction:
    column;

  justify-content:
    center;

  padding:
    58px;
}


.rr-eyebrow {
  margin:
    0 0 14px;

  color:
    #a16b2e;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    .20em;

  text-transform:
    uppercase;
}


.rr-product-summary h1 {
  margin:
    0;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    clamp(64px, 7vw, 92px);

  font-weight:
    500;

  line-height:
    .84;

  letter-spacing:
    -.045em;
}


.rr-subtitle {
  margin:
    27px 0;

  color:
    var(--rr-muted);

  font-size:
    16px;

  line-height:
    1.7;
}


.rr-price-row {
  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  margin:
    4px 0 28px;

  border-top:
    1px solid
    var(--rr-border);

  border-bottom:
    1px solid
    var(--rr-border);
}


.rr-price-row div {
  padding:
    18px 0;
}


.rr-price-row div + div {
  padding-left:
    25px;

  border-left:
    1px solid
    var(--rr-border);
}


.rr-price-row span {
  display:
    block;

  margin-bottom:
    5px;

  color:
    #8d7565;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    .15em;
}


.rr-price-row strong {
  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    28px;

  font-weight:
    600;
}


.rr-primary-button {
  min-height:
    52px;

  padding:
    0 26px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    fit-content;

  border:
    1px solid
    #daa64c;

  background:
    linear-gradient(
      135deg,
      #efca78,
      #cf9841
    );

  color:
    #251108;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    10px;

  font-weight:
    800;

  letter-spacing:
    .10em;

  text-decoration:
    none;

  text-transform:
    uppercase;

  cursor:
    pointer;
}


.rr-small-note {
  margin:
    14px 0 0;

  color:
    #8b7769;

  font-size:
    11px;
}


/* =========================================================
   INCLUDED
   ========================================================= */

.rr-included {
  padding:
    95px 24px;
}


.rr-container {
  width:
    min(1160px, 100%);

  margin:
    0 auto;
}


.rr-section-heading {
  max-width:
    680px;

  margin-bottom:
    45px;
}


.rr-section-heading h2 {
  margin:
    0;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    clamp(44px, 5vw, 66px);

  font-weight:
    500;

  line-height:
    .95;
}


.rr-included-grid {
  display:
    grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap:
    16px;
}


.rr-included-grid article {
  min-height:
    210px;

  padding:
    24px;

  border:
    1px solid
    var(--rr-border);

  border-radius:
    18px;

  background:
    rgba(255,255,255,.58);
}


.rr-included-grid article > span {
  display:
    block;

  margin-bottom:
    18px;

  color:
    #ba8137;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    .12em;
}


.rr-included-grid h3 {
  margin:
    0 0 10px;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    24px;

  line-height:
    1;
}


.rr-included-grid p {
  margin:
    0;

  color:
    var(--rr-muted);

  font-size:
    12px;

  line-height:
    1.6;
}


/* =========================================================
   BOOKING
   ========================================================= */

.rr-booking {
  padding:
    92px 24px;

  background:
    #efe3d6;
}


.rr-booking-layout {
  width:
    min(1160px, 100%);

  margin:
    0 auto;

  display:
    grid;

  grid-template-columns:
    minmax(0, 1.15fr)
    minmax(340px, .85fr);

  gap:
    56px;
}


.rr-booking-form-column h2 {
  max-width:
    650px;

  margin:
    0;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    clamp(46px, 5vw, 68px);

  font-weight:
    500;

  line-height:
    .94;
}


.rr-booking-intro {
  max-width:
    620px;

  margin:
    20px 0 32px;

  color:
    var(--rr-muted);

  line-height:
    1.7;
}


.rr-booking-form {
  display:
    grid;

  gap:
    18px;
}


.rr-field-grid {
  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    16px;
}


.rr-booking-form label > span {
  display:
    block;

  margin-bottom:
    8px;

  color:
    #523a2c;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    .08em;

  text-transform:
    uppercase;
}


.rr-booking-form input,
.rr-booking-form select,
.rr-booking-form textarea {
  width:
    100%;

  padding:
    14px 15px;

  border:
    1px solid
    rgba(96,61,39,.24);

  border-radius:
    10px;

  outline:
    none;

  background:
    rgba(255,255,255,.76);

  color:
    #38241a;

  font:
    inherit;
}


.rr-booking-form input:focus,
.rr-booking-form select:focus,
.rr-booking-form textarea:focus {
  border-color:
    #c18a3d;

  box-shadow:
    0 0 0 3px
    rgba(193,138,61,.09);
}


.rr-consent {
  display:
    grid !important;

  grid-template-columns:
    auto 1fr;

  align-items:
    start;

  gap:
    10px;
}


.rr-consent input {
  width:
    auto;

  margin-top:
    3px;
}


.rr-consent span {
  margin:
    0 !important;

  text-transform:
    none !important;

  letter-spacing:
    0 !important;

  line-height:
    1.5;
}


.rr-continue-button {
  border-radius:
    0;
}


/* =========================================================
   ORDER CARD
   ========================================================= */

.rr-order-card {
  align-self:
    start;

  position:
    sticky;

  top:
    110px;

  padding:
    28px;

  border:
    1px solid
    rgba(91,56,36,.18);

  border-radius:
    20px;

  background:
    #fffaf4;

  box-shadow:
    0 18px 40px
    rgba(66,38,22,.08);
}


.rr-order-kicker {
  margin:
    0 0 20px;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    .18em;

  color:
    #9a6b36;
}


.rr-order-product {
  display:
    grid;

  grid-template-columns:
    90px 1fr;

  gap:
    16px;

  align-items:
    center;

  padding-bottom:
    22px;

  border-bottom:
    1px solid
    var(--rr-border);
}


.rr-order-thumb {
  width:
    90px;

  height:
    90px;

  border-radius:
    12px;

  background:
    url("assets/images/hydro-facials.png")
    center center / cover no-repeat;
}


.rr-order-product h3 {
  margin:
    0 0 6px;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    25px;

  line-height:
    .95;
}


.rr-order-product p {
  margin:
    0;

  color:
    var(--rr-muted);

  font-size:
    11px;
}


.rr-order-line {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  padding:
    18px 0;

  border-bottom:
    1px solid
    var(--rr-border);

  font-size:
    13px;
}


.rr-total {
  font-size:
    17px;
}


.rr-total strong {
  font-size:
    22px;
}


/* =========================================================
   PAYMENT PREVIEW
   ========================================================= */

.rr-payment-preview {
  margin-top:
    24px;

  padding:
    22px;

  border:
    1px solid
    rgba(190,137,58,.25);

  border-radius:
    16px;

  background:
    #f7efe6;
}


.rr-lock {
  width:
    38px;

  height:
    38px;

  display:
    grid;

  place-items:
    center;

  margin-bottom:
    12px;

  border:
    1px solid
    #c38b3e;

  border-radius:
    50%;

  color:
    #a66f2f;
}


.rr-payment-preview h3 {
  margin:
    0 0 7px;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    28px;
}


.rr-payment-preview > p {
  color:
    var(--rr-muted);

  font-size:
    11px;

  line-height:
    1.55;
}


.rr-payment-fields {
  display:
    grid;

  gap:
    10px;

  margin:
    20px 0 14px;
}


.rr-payment-fields > div,
.rr-payment-small-grid span {
  min-height:
    45px;

  padding:
    13px;

  border:
    1px solid
    rgba(91,58,39,.20);

  border-radius:
    8px;

  background:
    rgba(255,255,255,.75);

  color:
    #a69385;

  font-size:
    12px;
}


.rr-payment-small-grid {
  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    10px;
}


.rr-payment-button {
  width:
    100%;

  min-height:
    49px;

  border:
    0;

  border-radius:
    8px;

  background:
    #c6b4a4;

  color:
    white;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    .08em;

  cursor:
    not-allowed;
}


.rr-demo-note {
  margin-bottom:
    0;

  text-align:
    center;

  font-size:
    9px !important;
}


/* =========================================================
   CONFIDENCE
   ========================================================= */

.rr-confidence {
  width:
    min(1160px, calc(100% - 48px));

  margin:
    0 auto;

  padding:
    72px 0 85px;

  display:
    grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap:
    1px;

  background:
    rgba(115,78,50,.14);
}


.rr-confidence > div {
  padding:
    32px;

  background:
    var(--rr-cream);
}


.rr-confidence > div > span {
  color:
    #b97f36;

  font-size:
    24px;
}


.rr-confidence h3 {
  margin:
    12px 0 8px;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    27px;
}


.rr-confidence p {
  margin:
    0;

  color:
    var(--rr-muted);

  font-size:
    12px;

  line-height:
    1.55;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

  .rr-product-hero {
    grid-template-columns:
      1fr;
  }


  .rr-product-image {
    min-height:
      520px;
  }


  .rr-included-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .rr-booking-layout {
    grid-template-columns:
      1fr;
  }


  .rr-order-card {
    position:
      static;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 680px) {

  .page-renew-refine {
    padding-top:
      82px;
  }


  .rr-product-hero {
    width:
      calc(100% - 24px);

    margin-top:
      16px;

    border-radius:
      18px;
  }


  .rr-product-image {
    min-height:
      410px;

    background-position:
      68% center;
  }


  .rr-product-summary {
    padding:
      32px 22px 34px;
  }


  .rr-product-summary h1 {
    font-size:
      58px;
  }


  .rr-included {
    padding:
      66px 14px;
  }


  .rr-included-grid {
    grid-template-columns:
      1fr;
  }


  .rr-included-grid article {
    min-height:
      auto;
  }


  .rr-booking {
    padding:
      66px 14px;
  }


  .rr-field-grid {
    grid-template-columns:
      1fr;
  }


  .rr-order-card {
    padding:
      20px;
  }


  .rr-confidence {
    width:
      calc(100% - 28px);

    grid-template-columns:
      1fr;

    padding:
      48px 0 62px;
  }

}

/* =========================================================
   RENEW & REFINE — BOOKING-FIRST CONVERSION LAYOUT
   ========================================================= */

/* Make the opening product summary more compact */
.rr-product-hero {
  min-height:
    500px !important;

  margin-bottom:
    0 !important;
}


.rr-product-image {
  min-height:
    500px !important;
}


.rr-product-summary {
  padding:
    44px
    48px !important;
}


.rr-product-summary h1 {
  font-size:
    clamp(58px, 6vw, 82px) !important;
}


.rr-subtitle {
  margin:
    20px
    0 !important;
}


.rr-price-row {
  margin:
    2px
    0
    18px !important;
}


/* Replace second booking CTA with quiet information link */
.rr-details-link {
  display:
    inline-flex !important;

  width:
    fit-content !important;

  align-items:
    center !important;

  margin-top:
    2px !important;

  color:
    #9b682d !important;

  font-family:
    "Montserrat",
    sans-serif !important;

  font-size:
    9px !important;

  font-weight:
    700 !important;

  letter-spacing:
    .10em !important;

  text-decoration:
    none !important;

  text-transform:
    uppercase !important;
}


.rr-details-link:hover {
  color:
    #6f421f !important;
}


/* Booking starts immediately after product summary */
.rr-booking {
  padding:
    68px
    24px
    78px !important;

  background:
    linear-gradient(
      180deg,
      #efe3d6 0%,
      #f4eadf 100%
    ) !important;
}


.rr-booking-layout {
  align-items:
    start !important;
}


.rr-booking-form-column .rr-eyebrow {
  margin-bottom:
    10px !important;
}


.rr-booking-form-column h2 {
  font-size:
    clamp(42px, 4.5vw, 60px) !important;

  max-width:
    600px !important;
}


.rr-booking-intro {
  margin:
    16px
    0
    26px !important;
}


/* Order summary remains visible next to form */
.rr-order-card {
  top:
    100px !important;
}


/* Push the long-form information visually into
   a secondary "learn more" area */
.rr-included {
  padding:
    88px
    24px !important;

  background:
    #faf6f0 !important;
}


.rr-section-heading {
  margin:
    0 auto
    42px !important;

  text-align:
    center !important;
}


.rr-section-heading h2 {
  max-width:
    760px !important;

  margin:
    0 auto !important;
}


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

@media (max-width: 680px) {

  .rr-product-hero {
    margin-top:
      12px !important;

    min-height:
      auto !important;
  }


  .rr-product-image {
    min-height:
      330px !important;
  }


  .rr-product-summary {
    padding:
      26px
      20px
      28px !important;
  }


  .rr-product-summary h1 {
    font-size:
      51px !important;
  }


  .rr-subtitle {
    font-size:
      14px !important;

    line-height:
      1.6 !important;
  }


  .rr-booking {
    padding:
      44px
      14px
      54px !important;
  }


  .rr-booking-form-column h2 {
    font-size:
      42px !important;
  }


  .rr-order-card {
    margin-top:
      8px !important;
  }


  .rr-included {
    padding:
      64px
      14px !important;
  }

}

/* =========================================================
   RENEW & REFINE — LIVE SLOT SELECTOR
   ========================================================= */

.rr-time-help {
  display:
    block;

  margin-top:
    7px;

  color:
    #8a7466;

  font-size:
    10px;

  line-height:
    1.45;
}


.rr-booking-form select:disabled {
  opacity:
    .65;

  cursor:
    not-allowed;

  background:
    rgba(240,232,223,.78);
}


.rr-booking-form select:not(:disabled) {
  cursor:
    pointer;
}

/* =========================================================
   RENEW & REFINE — LIVE SLOT SELECTOR
   ========================================================= */

.rr-time-help {
  display:
    block;

  margin-top:
    7px;

  color:
    #8a7466;

  font-size:
    10px;

  line-height:
    1.45;
}


.rr-booking-form select:disabled {
  opacity:
    .65;

  cursor:
    not-allowed;

  background:
    rgba(240,232,223,.78);
}


.rr-booking-form select:not(:disabled) {
  cursor:
    pointer;
}

/* =========================================================
   RENEW & REFINE — DEMO CHECKOUT EXPERIENCE
   ========================================================= */

.rr-demo-status {
  width:
    fit-content;

  margin:
    0
    0
    14px;

  padding:
    6px
    10px;

  border-radius:
    999px;

  background:
    #382016;

  color:
    #f2c971;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    .14em;
}


.rr-demo-description {
  margin-bottom:
    14px !important;
}


.rr-demo-warning,
.rr-confirmation-alert {
  margin:
    16px
    0;

  padding:
    10px
    12px;

  border:
    1px solid
    rgba(191,135,54,.30);

  border-radius:
    8px;

  background:
    #fff4dc;

  color:
    #714615;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    .07em;

  text-align:
    center;
}


.rr-demo-card-wrap {
  display:
    grid;

  gap:
    12px;

  margin:
    20px
    0;
}


.rr-demo-card-wrap label span {
  display:
    block;

  margin-bottom:
    6px;

  color:
    #624838;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    .08em;

  text-transform:
    uppercase;
}


.rr-demo-card-wrap input {
  width:
    100%;

  min-height:
    45px;

  padding:
    0
    13px;

  border:
    1px solid
    rgba(91,58,39,.20);

  border-radius:
    8px;

  outline:
    0;

  background:
    white;

  color:
    #38241a;

  font-size:
    13px;
}


.rr-demo-card-row {
  display:
    grid;

  grid-template-columns:
    1fr
    1fr;

  gap:
    10px;
}


.rr-demo-pay-button {
  width:
    100%;

  min-height:
    52px;

  border:
    1px solid
    #d29b45;

  border-radius:
    8px;

  background:
    linear-gradient(
      135deg,
      #efca78,
      #ce9540
    );

  color:
    #261108;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    9px;

  font-weight:
    800;

  letter-spacing:
    .08em;

  text-transform:
    uppercase;

  cursor:
    pointer;
}


.rr-demo-pay-button:hover {
  box-shadow:
    0 10px 20px
    rgba(72,39,18,.15);
}


.rr-demo-pay-button:disabled {
  opacity:
    .65;

  cursor:
    wait;
}


.rr-demo-security {
  display:
    grid;

  grid-template-columns:
    24px
    1fr;

  gap:
    8px;

  align-items:
    start;

  margin-top:
    12px;

  color:
    #897367;

  font-size:
    9px;
}


.rr-demo-security p {
  margin:
    0;
}


/* =========================================================
   DEMO CONFIRMATION
   ========================================================= */

.rr-demo-confirmation {
  text-align:
    left;
}


.rr-confirmation-check {
  width:
    58px;

  height:
    58px;

  display:
    grid;

  place-items:
    center;

  margin-bottom:
    18px;

  border-radius:
    50%;

  background:
    #382016;

  color:
    #efc66f;

  font-size:
    25px;
}


.rr-demo-confirmation h3 {
  margin:
    0 0
    10px;

  font-size:
    34px;
}


.rr-confirmation-lead {
  margin:
    0 0
    18px;
}


.rr-confirmation-details {
  margin:
    22px
    0;

  border-top:
    1px solid
    rgba(94,61,40,.15);
}


.rr-confirmation-details > div {
  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    18px;

  padding:
    12px
    0;

  border-bottom:
    1px solid
    rgba(94,61,40,.15);
}


.rr-confirmation-details span {
  color:
    #887466;

  font-size:
    10px;
}


.rr-confirmation-details strong {
  max-width:
    58%;

  color:
    #38241a;

  font-size:
    11px;

  text-align:
    right;
}


.rr-confirmation-contact {
  color:
    #6c584c;

  font-size:
    10px;

  line-height:
    1.55;
}


.rr-demo-next-step {
  margin-top:
    22px;

  padding:
    18px;

  border-radius:
    12px;

  background:
    #382016;

  color:
    #fff9f1;
}


.rr-demo-next-step span {
  display:
    block;

  margin-bottom:
    7px;

  color:
    #efc66f;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    .10em;

  text-transform:
    uppercase;
}


.rr-demo-next-step p {
  margin:
    0;

  color:
    rgba(255,255,255,.82);

  font-size:
    10px;

  line-height:
    1.55;
}


@media (max-width: 520px) {

  .rr-demo-card-row {
    grid-template-columns:
      1fr;
  }


  .rr-confirmation-details > div {
    display:
      grid;

    grid-template-columns:
      1fr;
  }


  .rr-confirmation-details strong {
    max-width:
      100%;

    text-align:
      left;
  }

}

/* =========================================================
   MOBILE-FIRST TWO-STEP BOOKING
   ========================================================= */

.rr-wizard-progress {
  display:
    grid;

  grid-template-columns:
    auto
    1fr
    auto;

  align-items:
    center;

  gap:
    10px;

  margin:
    0
    0
    24px;
}


.rr-step-indicator {
  padding:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    7px;

  border:
    0;

  background:
    transparent;

  color:
    #9b8779;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    8px;

  font-weight:
    700;

  pointer-events:
    none;
}


.rr-step-indicator span {
  width:
    26px;

  height:
    26px;

  display:
    grid;

  place-items:
    center;

  border:
    1px solid
    rgba(79,48,30,.22);

  border-radius:
    50%;
}


.rr-step-indicator.is-active {
  color:
    #4b2c1c;
}


.rr-step-indicator.is-active span,
.rr-step-indicator.is-complete span {
  border-color:
    #c48a3a;

  background:
    #3a1d11;

  color:
    #edc36b;
}


.rr-step-line {
  height:
    1px;

  background:
    rgba(77,47,30,.18);
}


.rr-form-step {
  display:
    none;
}


.rr-form-step.is-active {
  display:
    grid;

  gap:
    17px;

  animation:
    rrStepIn .25s ease;
}


@keyframes rrStepIn {

  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }

}


.rr-step-heading span {
  display:
    block;

  margin-bottom:
    5px;

  color:
    #a46d2e;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    .12em;
}


.rr-step-heading h3 {
  margin:
    0;

  color:
    #40281d;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    32px;

  font-weight:
    500;
}


.rr-wizard-actions {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;
}


.rr-back-button {
  min-height:
    50px;

  padding:
    0 15px;

  border:
    0;

  background:
    transparent;

  color:
    #795b49;

  font-size:
    10px;

  font-weight:
    700;

  cursor:
    pointer;
}


/* Checkout stays visually secondary until form is complete */

#paymentPreview {
  transition:
    opacity .2s ease,
    transform .2s ease;
}


/* MOBILE */

@media (max-width: 680px) {

  .rr-booking {
    padding:
      30px
      12px
      44px !important;
  }


  .rr-booking-layout {
    display:
      block !important;
  }


  .rr-booking-form-column h2 {
    font-size:
      38px !important;

    line-height:
      .94 !important;
  }


  .rr-booking-intro {
    margin-bottom:
      19px !important;

    font-size:
      12px;
  }


  .rr-booking-form {
    padding:
      18px;

    border-radius:
      16px;

    background:
      rgba(255,255,255,.62);
  }


  .rr-field-grid {
    grid-template-columns:
      1fr !important;

    gap:
      14px !important;
  }


  .rr-booking-form input,
  .rr-booking-form select {
    min-height:
      48px;
  }


  .rr-booking-form textarea {
    min-height:
      82px;
  }


  .rr-wizard-next,
  .rr-wizard-actions .rr-primary-button {
    width:
      100% !important;
  }


  .rr-wizard-actions {
    display:
      grid;

    grid-template-columns:
      auto
      1fr;
  }


  .rr-order-card {
    margin-top:
      18px !important;
  }


  .rr-payment-preview {
    margin-top:
      16px !important;
  }

}

/* =========================================================
   LV RENEW & REFINE
   PREMIUM CONVERSION CHECKOUT — FINAL OVERRIDE
   ========================================================= */

.rr-premium-booking {
  padding:
    84px
    24px !important;

  background:
    #f4ede5 !important;
}


.rr-premium-shell {
  width:
    min(1180px, 100%);

  margin:
    0 auto;

  display:
    grid;

  grid-template-columns:
    360px
    minmax(0, 1fr);

  overflow:
    hidden;

  border:
    1px solid
    rgba(87,52,31,.11);

  border-radius:
    28px;

  background:
    #fffaf6;

  box-shadow:
    0 32px 90px
    rgba(49,26,14,.12);
}



/* =========================================================
   SERVICE PANEL
   ========================================================= */

.rr-premium-service {
  position:
    relative;

  padding:
    34px;

  overflow:
    hidden;

  background:
    #2d160d;

  color:
    white;
}


.rr-premium-service::before {
  content:
    "";

  position:
    absolute;

  inset:
    0;

  background:
    linear-gradient(
      180deg,
      rgba(33,14,6,.08),
      rgba(33,14,6,.92)
    ),
    url("assets/images/hydro-facials.png")
    center
    top
    / cover
    no-repeat;

  opacity:
    .45;
}


.rr-premium-service > * {
  position:
    relative;

  z-index:
    2;
}


.rr-premium-eyebrow {
  margin:
    0
    0
    26px;

  color:
    #e3bb67;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    .16em;
}


.rr-premium-service-image {
  width:
    58px;

  height:
    58px;

  display:
    grid;

  place-items:
    center;

  margin:
    0
    0
    170px;

  border:
    1px solid
    rgba(239,198,111,.55);

  border-radius:
    50%;

  background:
    rgba(38,15,7,.42);

  backdrop-filter:
    blur(8px);
}


.rr-premium-service-image span {
  color:
    #e8bf69;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    23px;

  font-weight:
    600;
}


.rr-premium-service-copy h2 {
  margin:
    0;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    55px;

  font-weight:
    500;

  line-height:
    .84;
}


.rr-premium-service-copy > p {
  margin:
    15px
    0
    24px;

  color:
    rgba(255,255,255,.73);

  font-size:
    10px;

  line-height:
    1.5;
}


.rr-premium-service-meta {
  display:
    grid;

  grid-template-columns:
    1fr
    1fr;

  margin-bottom:
    24px;

  border-top:
    1px solid
    rgba(255,255,255,.16);

  border-bottom:
    1px solid
    rgba(255,255,255,.16);
}


.rr-premium-service-meta > div {
  padding:
    14px
    0;
}


.rr-premium-service-meta > div + div {
  padding-left:
    18px;

  border-left:
    1px solid
    rgba(255,255,255,.16);
}


.rr-premium-service-meta span {
  display:
    block;

  margin-bottom:
    4px;

  color:
    rgba(255,255,255,.48);

  font-size:
    7px;

  font-weight:
    700;

  letter-spacing:
    .09em;

  text-transform:
    uppercase;
}


.rr-premium-service-meta strong {
  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    21px;

  font-weight:
    500;
}


.rr-premium-benefit {
  margin:
    10px
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    9px;

  color:
    rgba(255,255,255,.76);

  font-size:
    9px;
}


.rr-premium-benefit span {
  color:
    #e0af56;
}



/* =========================================================
   RIGHT FLOW
   ========================================================= */

.rr-premium-flow {
  min-width:
    0;

  padding:
    34px
    46px
    44px;
}


.rr-premium-top {
  margin-bottom:
    46px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    30px;
}


.rr-premium-top > p {
  margin:
    0;

  color:
    #a37239;

  font-size:
    7px;

  font-weight:
    800;

  letter-spacing:
    .15em;
}


.rr-premium-progress {
  display:
    flex;

  align-items:
    center;

  gap:
    7px;
}


.rr-progress-item {
  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  color:
    #a58e7f;
}


.rr-progress-item > span {
  width:
    24px;

  height:
    24px;

  display:
    grid;

  place-items:
    center;

  border:
    1px solid
    rgba(63,37,22,.18);

  border-radius:
    50%;

  font-size:
    8px;

  font-weight:
    700;
}


.rr-progress-item small {
  font-size:
    7px;

  font-weight:
    700;
}


.rr-progress-item.is-active {
  color:
    #3c2113;
}


.rr-progress-item.is-active > span,
.rr-progress-item.is-complete > span {
  border-color:
    #3a1d10;

  background:
    #3a1d10;

  color:
    #e9bd67;
}


.rr-progress-line {
  width:
    25px;

  height:
    1px;

  background:
    rgba(64,38,23,.16);
}



/* =========================================================
   STEP
   ========================================================= */

.rr-premium-step {
  display:
    none;
}


.rr-premium-step.is-active {
  display:
    block;

  animation:
    rrPremiumIn .28s ease;
}


@keyframes rrPremiumIn {

  from {
    opacity:
      0;

    transform:
      translateY(6px);
  }

  to {
    opacity:
      1;

    transform:
      translateY(0);
  }

}


.rr-premium-heading {
  max-width:
    590px;

  margin-bottom:
    30px;
}


.rr-premium-heading > span {
  display:
    block;

  margin-bottom:
    8px;

  color:
    #ad7534;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    .12em;
}


.rr-premium-heading h2 {
  margin:
    0;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    clamp(43px, 5vw, 60px);

  font-weight:
    500;

  line-height:
    .93;
}


.rr-premium-heading p {
  margin:
    15px
    0
    0;

  color:
    #816c5e;

  font-size:
    11px;

  line-height:
    1.6;
}



/* =========================================================
   FIELDS
   ========================================================= */

.rr-premium-fields {
  display:
    grid;

  gap:
    16px;
}


.rr-premium-two {
  display:
    grid;

  grid-template-columns:
    1fr
    1fr;

  gap:
    13px;
}


.rr-premium-form label > span,
.rr-premium-field-title {
  display:
    block;

  margin-bottom:
    7px;

  color:
    #684d3c;

  font-size:
    8px;

  font-weight:
    800;

  letter-spacing:
    .04em;

  text-transform:
    uppercase;
}


.rr-premium-form input,
.rr-premium-form textarea {
  width:
    100%;

  min-height:
    51px;

  padding:
    0
    15px;

  border:
    1px solid
    rgba(70,42,25,.14);

  border-radius:
    10px;

  outline:
    0;

  background:
    #fff;

  color:
    #392319;

  font:
    inherit;

  font-size:
    12px;

  transition:
    border-color .15s ease,
    box-shadow .15s ease;
}


.rr-premium-form textarea {
  min-height:
    82px;

  padding:
    13px
    15px;

  resize:
    vertical;
}


.rr-premium-form input:focus,
.rr-premium-form textarea:focus {
  border-color:
    #c68e43;

  box-shadow:
    0 0 0 3px
    rgba(198,142,67,.08);
}


.rr-premium-primary,
.rr-premium-pay {
  width:
    100%;

  min-height:
    54px;

  margin-top:
    22px;

  padding:
    0
    20px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    14px;

  border:
    1px solid
    #c78d3c;

  border-radius:
    10px;

  background:
    linear-gradient(
      135deg,
      #edc56d,
      #ce963f
    );

  color:
    #2b140a;

  font-size:
    9px;

  font-weight:
    800;

  letter-spacing:
    .08em;

  text-transform:
    uppercase;

  cursor:
    pointer;

  box-shadow:
    0 10px 24px
    rgba(161,102,35,.14);
}


.rr-premium-primary:hover,
.rr-premium-pay:hover {
  transform:
    translateY(-1px);

  box-shadow:
    0 14px 28px
    rgba(161,102,35,.20);
}


.rr-premium-privacy {
  margin:
    11px
    0
    0;

  color:
    #9c897c;

  font-size:
    8px;

  text-align:
    center;
}



/* =========================================================
   APPOINTMENT
   ========================================================= */

.rr-premium-appointment-card {
  padding:
    22px;

  border:
    1px solid
    rgba(70,42,25,.11);

  border-radius:
    14px;

  background:
    #f9f3ed;
}


.rr-premium-date input {
  background:
    white;
}


.rr-premium-time-area {
  margin-top:
    22px;
}


.rr-premium-time-slots {
  display:
    grid;

  grid-template-columns:
    repeat(4, 1fr);

  gap:
    8px;
}


.rr-premium-time-button {
  min-height:
    42px;

  padding:
    7px;

  border:
    1px solid
    rgba(71,42,25,.15);

  border-radius:
    8px;

  background:
    white;

  color:
    #543626;

  font-family:
    "Montserrat",
    sans-serif;

  font-size:
    9px;

  font-weight:
    700;

  cursor:
    pointer;
}


.rr-premium-time-button:hover {
  border-color:
    #c89147;

  background:
    #fff9f1;
}


.rr-premium-time-button.is-selected {
  border-color:
    #3a1d10;

  background:
    #3a1d10;

  color:
    #efc874;
}


.rr-no-times {
  grid-column:
    1 / -1;

  padding:
    20px;

  border:
    1px dashed
    rgba(81,49,29,.18);

  border-radius:
    9px;

  color:
    #8d7869;

  font-size:
    10px;

  text-align:
    center;
}


.rr-premium-goals {
  display:
    block;

  margin-top:
    17px;
}


.rr-premium-goals small {
  color:
    #a99689;

  font-size:
    7px;

  font-weight:
    500;

  text-transform:
    none;
}


.rr-premium-consent {
  margin-top:
    15px;

  display:
    grid !important;

  grid-template-columns:
    17px
    1fr;

  gap:
    9px;

  align-items:
    start;
}


.rr-premium-consent input {
  width:
    16px;

  min-height:
    auto;

  margin-top:
    1px;
}


.rr-premium-consent span {
  margin:
    0 !important;

  color:
    #816d60 !important;

  font-size:
    8px !important;

  font-weight:
    500 !important;

  line-height:
    1.5;

  letter-spacing:
    0 !important;

  text-transform:
    none !important;
}


.rr-premium-navigation {
  display:
    grid;

  grid-template-columns:
    auto
    minmax(240px, 1fr);

  gap:
    12px;

  align-items:
    end;
}


.rr-premium-back {
  min-height:
    54px;

  padding:
    0
    18px;

  border:
    0;

  background:
    transparent;

  color:
    #795e4e;

  font-size:
    9px;

  font-weight:
    700;

  cursor:
    pointer;
}



/* =========================================================
   CHECKOUT
   ========================================================= */

.rr-premium-review {
  display:
    grid;

  grid-template-columns:
    1fr
    1fr;

  gap:
    10px;

  margin-bottom:
    18px;
}


.rr-premium-review > div {
  padding:
    15px;

  border:
    1px solid
    rgba(70,42,25,.11);

  border-radius:
    10px;

  background:
    #f9f3ed;
}


.rr-premium-review span {
  display:
    block;

  margin-bottom:
    5px;

  color:
    #958074;

  font-size:
    7px;

  font-weight:
    800;

  text-transform:
    uppercase;
}


.rr-premium-review strong {
  color:
    #41291d;

  font-size:
    10px;
}


.rr-premium-payment {
  padding:
    23px;

  border:
    1px solid
    rgba(69,41,24,.12);

  border-radius:
    16px;

  background:
    #fff;
}


.rr-payment-heading {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    20px;

  margin-bottom:
    16px;
}


.rr-payment-heading span {
  color:
    #a36e31;

  font-size:
    7px;

  font-weight:
    800;

  letter-spacing:
    .1em;
}


.rr-payment-heading h3 {
  margin:
    4px
    0
    0;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    28px;

  font-weight:
    500;
}


.rr-secure-pill {
  padding:
    7px
    10px;

  border:
    1px solid
    rgba(74,45,27,.14);

  border-radius:
    999px;

  color:
    #80695a;

  font-size:
    8px;
}


.rr-demo-banner {
  margin-bottom:
    16px;

  padding:
    9px;

  border-radius:
    7px;

  background:
    #fff3d9;

  color:
    #73501d;

  font-size:
    7px;

  font-weight:
    800;

  letter-spacing:
    .05em;

  text-align:
    center;
}


.rr-card-input-shell {
  position:
    relative;
}


.rr-card-input-shell strong {
  position:
    absolute;

  right:
    14px;

  top:
    50%;

  transform:
    translateY(-50%);

  color:
    #392219;

  font-size:
    8px;

  letter-spacing:
    .05em;
}


.rr-premium-card-number input {
  padding-right:
    60px;
}


.rr-premium-total {
  padding:
    14px
    0;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    20px;

  border-bottom:
    1px solid
    rgba(74,44,27,.11);
}


.rr-premium-total span {
  color:
    #513426;

  font-size:
    10px;
}


.rr-premium-total small {
  display:
    block;

  margin-top:
    3px;

  color:
    #9b8779;

  font-size:
    7px;
}


.rr-premium-total strong {
  color:
    #392219;

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size:
    21px;
}


.rr-premium-grand-total {
  border-bottom:
    0;
}


.rr-premium-grand-total span {
  font-weight:
    800;
}


.rr-premium-grand-total strong {
  font-size:
    28px;
}


.rr-premium-pay {
  margin-top:
    10px;

  min-height:
    58px;
}


.rr-premium-pay:disabled {
  opacity:
    .70;

  cursor:
    wait;
}


.rr-premium-powered {
  margin-top:
    12px;

  display:
    grid;

  grid-template-columns:
    18px
    1fr;

  gap:
    8px;

  color:
    #978377;
}


.rr-premium-powered p {
  margin:
    0;

  font-size:
    7px;

  line-height:
    1.5;
}


.rr-premium-checkout-back {
  display:
    block;

  margin:
    10px
    auto
    0;

  min-height:
    34px;
}


.rr-pay-spinner {
  width:
    13px;

  height:
    13px;

  display:
    inline-block;

  border:
    2px solid
    rgba(43,20,10,.25);

  border-top-color:
    #2b140a;

  border-radius:
    50%;

  animation:
    rrPaySpin .7s linear infinite;
}


@keyframes rrPaySpin {

  to {
    transform:
      rotate(360deg);
  }

}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 930px) {

  .rr-premium-shell {
    grid-template-columns:
      300px
      minmax(0, 1fr);
  }


  .rr-premium-service {
    padding:
      27px;
  }


  .rr-premium-service-image {
    margin-bottom:
      120px;
  }


  .rr-premium-flow {
    padding:
      30px;
  }


  .rr-premium-time-slots {
    grid-template-columns:
      repeat(3, 1fr);
  }

}



/* =========================================================
   MOBILE — PRIMARY EXPERIENCE
   ========================================================= */

@media (max-width: 720px) {

  .rr-premium-booking {
    padding:
      18px
      10px
      44px !important;
  }


  .rr-premium-shell {
    display:
      block;

    border-radius:
      20px;

    box-shadow:
      0 18px 50px
      rgba(49,26,14,.10);
  }


  .rr-premium-service {
    padding:
      19px
      19px
      21px;

    min-height:
      auto;
  }


  .rr-premium-service::before {
    background-position:
      center 36%;
  }


  .rr-premium-eyebrow {
    margin-bottom:
      13px;
  }


  .rr-premium-service-image {
    width:
      43px;

    height:
      43px;

    margin:
      0
      0
      64px;
  }


  .rr-premium-service-copy h2 {
    font-size:
      43px;
  }


  .rr-premium-service-copy > p {
    margin:
      10px
      0
      14px;
  }


  .rr-premium-service-meta {
    margin-bottom:
      0;
  }


  .rr-premium-benefit {
    display:
      none;
  }


  .rr-premium-flow {
    padding:
      22px
      17px
      27px;
  }


  .rr-premium-top {
    margin-bottom:
      28px;

    display:
      block;
  }


  .rr-premium-top > p {
    display:
      none;
  }


  .rr-premium-progress {
    justify-content:
      center;
  }


  .rr-progress-item small {
    display:
      none;
  }


  .rr-progress-line {
    width:
      42px;
  }


  .rr-premium-heading {
    margin-bottom:
      21px;
  }


  .rr-premium-heading h2 {
    font-size:
      40px;
  }


  .rr-premium-heading p {
    margin-top:
      11px;

    font-size:
      10px;
  }


  .rr-premium-two {
    grid-template-columns:
      1fr;
  }


  .rr-premium-form input {
    min-height:
      50px;

    font-size:
      16px;
  }


  .rr-premium-form textarea {
    font-size:
      16px;
  }


  .rr-premium-time-slots {
    grid-template-columns:
      repeat(3, 1fr);
  }


  .rr-premium-time-button {
    min-height:
      46px;

    font-size:
      10px;
  }


  .rr-premium-navigation {
    grid-template-columns:
      74px
      1fr;
  }


  .rr-premium-review {
    grid-template-columns:
      1fr;
  }


  .rr-premium-payment {
    padding:
      17px;
  }


  .rr-premium-pay {
    min-height:
      57px;
  }

}



/* VERY SMALL PHONES */

@media (max-width: 390px) {

  .rr-premium-time-slots {
    grid-template-columns:
      repeat(2, 1fr);
  }


  .rr-premium-flow {
    padding-left:
      14px;

    padding-right:
      14px;
  }

}

/* ============================================================
   RENEW & REFINE - BOOKING SECTION AS HERO
   ============================================================ */

.booking-hero {
  padding-top: 32px !important;
  margin-top: 0 !important;
}

.booking-hero .section-heading,
.booking-hero .booking-section-heading {
  margin-top: 0 !important;
}

.booking-hero .booking-shell,
.booking-hero .booking-layout,
.booking-hero .booking-grid,
.booking-hero .booking-card-wrap {
  margin-top: 0 !important;
}

.booking-hero .booking-shell {
  box-shadow: 0 18px 48px rgba(36, 18, 10, 0.10) !important;
}

.booking-hero .booking-form-card,
.booking-hero .booking-summary-card,
.booking-hero .booking-panel,
.booking-hero .booking-card {
  box-shadow: 0 16px 38px rgba(36, 18, 10, 0.08) !important;
}

.booking-hero + section {
  padding-top: 56px !important;
}

@media (max-width: 980px) {
  .booking-hero {
    padding-top: 18px !important;
  }

  .booking-hero + section {
    padding-top: 38px !important;
  }
}

@media (max-width: 640px) {
  .booking-hero {
    padding-top: 10px !important;
  }

  .booking-hero + section {
    padding-top: 28px !important;
  }
}

/* =========================================================
   PREMIUM BOOKING AS PRIMARY HERO — FINAL
   ========================================================= */

.rr-premium-booking.booking-hero {
  padding:
    34px
    24px
    78px !important;

  margin:
    0 !important;

  background:
    linear-gradient(
      180deg,
      #f9f4ed 0%,
      #f2e8dc 100%
    ) !important;
}


.rr-premium-booking.booking-hero .rr-premium-shell {
  margin:
    0 auto !important;
}


/* The product/card itself now serves as the visual hero */
.rr-premium-booking.booking-hero .rr-premium-shell {
  box-shadow:
    0 32px 85px
    rgba(55,29,16,.13) !important;
}


@media (max-width: 720px) {

  .rr-premium-booking.booking-hero {
    padding:
      12px
      10px
      42px !important;
  }


  .rr-premium-booking.booking-hero .rr-premium-shell {
    border-radius:
      18px !important;
  }

}

/* =========================================================
   PREMIUM STEP 3 VISIBILITY SAFETY
   ========================================================= */

.rr-premium-step {
  display: none !important;
}

.rr-premium-step.is-active {
  display: block !important;
}

[data-premium-step="3"].is-active {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
