/*
 * Treatment + promotion detail-page aesthetic refresh.
 *
 * Structure, content, functionality and trademarked logo assets are unchanged.
 * This file is scoped to active treatment and promotion detail pages.
 */

.detail-aesthetic-refresh {
  --detail-pink: #d770ad;
  --detail-pink-dark: #bd568f;
  --detail-blue: #3399ff;
  --detail-cyan: rgba(173, 216, 230, 0.93);
  --detail-ink: #4d4a4c;
  --detail-muted: #756f73;
  --detail-line: #e9e3e7;
  --detail-blush: #fdf8fb;
  --detail-blue-wash: #f6fbff;
  --detail-font-body: "Roboto", "Helvetica Neue", Arial, sans-serif;
  --detail-font-display: "Playball", Georgia, serif;
}

/* Approved header direction: light utility bar, cyan navigation, pink CTA. */
.detail-aesthetic-refresh .header-top {
  background: #f7fbfd !important;
  border-bottom: 1px solid #e4eef2;
  padding-bottom: 6px;
  padding-top: 6px;
}

.detail-aesthetic-refresh .header-top a.text-gray {
  color: #666 !important;
}

.detail-aesthetic-refresh .header-nav-wrapper {
  background: var(--detail-cyan) !important;
  border-bottom: 1px solid rgba(129, 183, 201, 0.55);
  box-shadow: 0 5px 18px rgba(73, 121, 137, 0.1);
}

.detail-aesthetic-refresh .menuzord-menu > li > a {
  color: #4f4b4d;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.55px;
}

.detail-aesthetic-refresh .menuzord-menu .label-success {
  background: var(--detail-pink);
  border-radius: 10px;
  font-size: 8px;
  padding: 3px 6px;
  vertical-align: 2px;
}

.detail-aesthetic-refresh .header-nav .btn-theme-colored,
.detail-aesthetic-refresh .header-top .btn_book_now {
  background: var(--detail-pink) !important;
  border-color: var(--detail-pink) !important;
  border-radius: 4px;
  color: #fff !important;
}

.detail-aesthetic-refresh .header-nav .btn-theme-colored:hover,
.detail-aesthetic-refresh .header-top .btn_book_now:hover {
  background: var(--detail-pink-dark) !important;
  border-color: var(--detail-pink-dark) !important;
}

.detail-aesthetic-refresh .menuzord .megamenu {
  border: 1px solid var(--detail-line);
  border-top: 2px solid var(--detail-pink);
  box-shadow: 0 14px 30px rgba(62, 49, 56, 0.12);
}

/* Shared detail-page language. */
.detail-aesthetic-refresh .main-content {
  background: #fff;
}

.detail-aesthetic-refresh .main-content h2,
.detail-aesthetic-refresh .main-content h3,
.detail-aesthetic-refresh .main-content h5 {
  color: var(--detail-ink);
}

.detail-aesthetic-refresh .main-content .subtitle {
  color: var(--detail-muted);
  font-size: 15px;
  letter-spacing: 0.25px;
  line-height: 1.85;
}

.detail-aesthetic-refresh .main-content img.img-responsive,
.detail-aesthetic-refresh .main-content img.img-fullwidth,
.detail-aesthetic-refresh .main-content article img {
  height: auto !important;
  object-fit: contain;
}

.detail-aesthetic-refresh #blog-posts-wrapper article.post {
  border-color: var(--detail-line) !important;
  border-radius: 7px;
  box-shadow: 0 8px 24px rgba(67, 50, 59, 0.075);
  overflow: hidden;
}

.detail-aesthetic-refresh #blog-posts-wrapper article.post img {
  display: block;
}

.detail-aesthetic-refresh #footer {
  background: #464145 !important;
  border-top: 3px solid rgba(215, 112, 173, 0.7);
}

.detail-aesthetic-refresh #footer .list-border li {
  border-color: rgba(255, 255, 255, 0.09);
}

/* Treatment detail page. */
.detail-treatment-refresh .main-content > section {
  background:
    radial-gradient(circle at 95% 3%, rgba(51, 153, 255, 0.045), transparent 20%),
    #fff;
}

.detail-treatment-refresh .sidebar {
  background: var(--detail-blue-wash);
  border: 1px solid #e1edf4;
  border-radius: 7px;
  box-shadow: 0 8px 22px rgba(73, 121, 137, 0.07);
  padding: 22px 18px 12px;
}

.detail-treatment-refresh .sidebar .widget-title {
  color: var(--detail-ink);
  font-size: 19px;
  letter-spacing: 0.3px;
}

.detail-treatment-refresh .sidebar .panel {
  border-bottom: 1px solid #e5edf1;
  margin-bottom: 6px;
}

.detail-treatment-refresh .sidebar .panel-title a {
  line-height: 1.5;
}

.detail-treatment-refresh .blog-pull-right > .blog-posts > .col-md-12 {
  padding-left: 30px;
}

.detail-treatment-refresh .blog-pull-right article.post:first-child {
  background: #fff;
  border-bottom: 1px solid var(--detail-line);
  padding-bottom: 38px !important;
}

.detail-treatment-refresh .blog-pull-right article.post:first-child h5 {
  font-size: 32px !important;
  line-height: 1.28;
  margin-bottom: 24px !important;
}

.detail-treatment-refresh .blog-pull-right article.post:first-child .entry-header img {
  border: 1px solid var(--detail-line);
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(67, 50, 59, 0.08);
}

.detail-treatment-refresh .blog-pull-right article.post:first-child > p,
.detail-treatment-refresh .blog-pull-right article.post:first-child > ul {
  max-width: 820px;
}

.detail-treatment-refresh .blog-pull-right article.post:first-child > ul li {
  margin-bottom: 11px;
}

.detail-treatment-refresh .blog-pull-right article.post:first-child > ul.check {
  background: var(--detail-blue-wash);
  border-left: 3px solid var(--detail-blue);
  border-radius: 0 6px 6px 0;
  color: #557181 !important;
  padding: 18px 24px 12px 46px;
}

.detail-treatment-refresh .blog-pull-right article.post:first-child .text-center .btn {
  background: var(--detail-pink) !important;
  border: 1px solid var(--detail-pink) !important;
  border-radius: 4px;
  box-shadow: 0 7px 18px rgba(215, 112, 173, 0.22);
  color: #fff !important;
  min-height: 44px;
}

.detail-treatment-refresh .blog-pull-right article.post:first-child .text-center .btn:hover {
  background: var(--detail-pink-dark) !important;
  border-color: var(--detail-pink-dark) !important;
}

.detail-treatment-refresh #blog-posts-wrapper {
  margin-top: 6px;
}

.detail-treatment-refresh #blog-posts-wrapper article.post .entry-meta {
  background: var(--detail-blush);
  min-height: 105px;
}

/* Promotion detail page: the offer, evidence and form are the visual anchors. */
.detail-promotion-refresh .main-content > section:first-child {
  background:
    linear-gradient(150deg, rgba(253, 248, 251, 0.8), rgba(246, 251, 255, 0.72)),
    #fff;
}

.detail-promotion-refresh .main-content > section:first-child > .container {
  background: #fff;
  border: 1px solid var(--detail-line);
  border-radius: 8px;
  box-shadow: 0 14px 36px rgba(67, 50, 59, 0.08);
  margin-bottom: 45px !important;
  margin-top: 40px !important;
  padding: 36px 42px 42px !important;
}

.detail-promotion-refresh .main-content > section:first-child > .container > .row > .col-md-12 > article.post {
  border-bottom: 0;
  padding-bottom: 0 !important;
}

.detail-promotion-refresh .main-content > section:first-child h5.font-30 {
  color: var(--detail-pink-dark);
  font-size: 34px !important;
  line-height: 1.25;
  margin-bottom: 20px;
}

/*
 * Promotion typography system.
 *
 * Long commercial offer titles use the highly legible Roboto already loaded
 * by the site. Short section headings use the existing Playball display face
 * for a restrained touch of the brand's established character.
 */
.detail-promotion-refresh .main-content > section:first-child h1.font-30,
.detail-promotion-refresh .main-content > section:first-child h5.font-30 {
  color: var(--detail-pink-dark) !important;
  font-family: var(--detail-font-body) !important;
  font-size: 32px !important;
  font-style: normal;
  font-weight: 500 !important;
  letter-spacing: -0.25px;
  line-height: 1.3;
}

.detail-promotion-refresh .main-content h2.font-36,
.detail-promotion-refresh .main-content h3.font-36 {
  color: var(--detail-ink) !important;
  font-family: var(--detail-font-display) !important;
  font-style: normal;
  font-weight: 400 !important;
  line-height: 1.25;
}

.detail-promotion-refresh .main-content h2.font-36 .text-theme-color-blue,
.detail-promotion-refresh .main-content h3.font-36 .text-theme-color-blue {
  color: var(--detail-blue) !important;
}

.detail-promotion-refresh .main-content .entry-title {
  color: var(--detail-ink) !important;
  font-family: var(--detail-font-body) !important;
  font-style: normal;
  font-weight: 500 !important;
  line-height: 1.45;
}

.detail-promotion-refresh .main-content > section:first-child ul.check {
  background: var(--detail-blue-wash);
  border-left: 3px solid var(--detail-blue);
  border-radius: 0 6px 6px 0;
  color: #557181 !important;
  display: inline-block;
  padding: 18px 28px 12px 48px;
}

.detail-promotion-refresh .main-content > section:first-child ul.list.check {
  margin-bottom: 34px !important;
}

.detail-promotion-refresh .promotion-offer-media {
  margin-top: 34px;
}

.detail-promotion-refresh .promotion-offer-media img {
  border: 1px solid var(--detail-line);
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(67, 50, 59, 0.09);
  display: block;
  height: auto !important;
  width: 100%;
}

.detail-promotion-refresh video {
  border: 1px solid var(--detail-line);
  border-radius: 7px;
  box-shadow: 0 8px 22px rgba(67, 50, 59, 0.07);
}

.detail-promotion-refresh #contact_form {
  background: var(--detail-blush);
  border: 1px solid #eddee6;
  box-shadow: 0 10px 28px rgba(67, 50, 59, 0.075);
  padding: 28px 28px 16px;
}

.detail-promotion-refresh #contact_form .form-control {
  background: #fff;
  min-height: 44px;
}

.detail-promotion-refresh #contact_form button[type="submit"] {
  background: var(--detail-pink) !important;
  border-color: var(--detail-pink) !important;
  color: #fff !important;
  min-height: 42px;
  padding-left: 20px;
  padding-right: 20px;
}

.detail-promotion-refresh #contact_form button[type="submit"]:hover {
  background: var(--detail-pink-dark) !important;
  border-color: var(--detail-pink-dark) !important;
}

.detail-promotion-refresh #contact_form button[type="reset"] {
  background: #fff !important;
  color: #6b6669 !important;
}

.detail-promotion-refresh .main-content h3.font-36,
.detail-promotion-refresh .main-content h2.font-36 {
  font-size: 31px !important;
  letter-spacing: 0.15px;
  margin-bottom: 25px !important;
  position: relative;
}

.detail-promotion-refresh .main-content h3.font-36::after,
.detail-promotion-refresh .main-content h2.font-36::after {
  background: linear-gradient(90deg, var(--detail-pink), var(--detail-blue));
  border-radius: 2px;
  content: "";
  display: block;
  height: 2px;
  margin-top: 13px;
  width: 45px;
}

.detail-promotion-refresh .reviews-badges {
  align-items: center;
  background: var(--detail-blue-wash);
  border: 1px solid #e1edf4;
  border-radius: 7px;
  display: flex;
  justify-content: center;
  margin: 0 auto 15px;
  min-height: 150px;
  padding: 18px;
}

.detail-promotion-refresh .promotion-reviews-section .section-title {
  margin-bottom: 28px;
}

.detail-promotion-refresh .promotion-reviews-section {
  margin-bottom: 34px;
  margin-top: 34px;
}

.detail-promotion-refresh .promotion-reviews-section .section-title h2 {
  text-align: left;
}

.detail-promotion-refresh .promotion-reviews-section .section-title [class*="col-"] {
  float: none;
  margin-left: 0;
  text-align: left;
  width: 100%;
}

.detail-promotion-refresh .promotion-terms-section {
  background: #fafafa;
  border-bottom: 1px solid #eee;
  border-top: 1px solid #eee;
  color: #777;
  padding: 34px 0 32px;
}

.detail-promotion-refresh .promotion-terms-section .container {
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

.detail-promotion-refresh .promotion-terms-title {
  color: #5d585b;
  font-weight: 600;
  margin-top: 0 !important;
}

.detail-aesthetic-refresh .fat-freeze-process,
.detail-aesthetic-refresh .mts-process {
  background: #fbfefe;
  border: 1px solid #dceef1;
  border-radius: 10px;
  margin: 42px 0 36px;
  padding: 30px 28px 24px;
}

.detail-aesthetic-refresh .fat-freeze-process-image,
.detail-aesthetic-refresh .mts-process-image {
  border-radius: 8px;
  display: block;
  height: auto;
  margin: 0 auto 26px;
  width: 100%;
}

.detail-aesthetic-refresh .fat-freeze-process-steps,
.detail-aesthetic-refresh .mts-process-steps {
  display: flex;
  flex-wrap: wrap;
}

.detail-aesthetic-refresh .fat-freeze-process-steps > [class*="col-"],
.detail-aesthetic-refresh .mts-process-steps > [class*="col-"] {
  display: flex;
}

.detail-aesthetic-refresh .fat-freeze-process-step,
.detail-aesthetic-refresh .mts-process-step {
  border-top: 2px solid #67c7d0;
  padding: 18px 4px 4px;
  width: 100%;
}

.detail-aesthetic-refresh .fat-freeze-step-number,
.detail-aesthetic-refresh .mts-step-number {
  align-items: center;
  background: #64c6cf;
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  font-size: 16px;
  font-weight: 700;
  height: 30px;
  justify-content: center;
  margin-bottom: 9px;
  width: 30px;
}

.detail-aesthetic-refresh .fat-freeze-process-step h3,
.detail-aesthetic-refresh .mts-process-step h3 {
  color: #514c4f;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 17px;
  font-weight: 600;
  margin: 0 0 8px;
}

.detail-aesthetic-refresh .fat-freeze-process-step p,
.detail-aesthetic-refresh .mts-process-step p {
  color: #6e696c;
  font-size: 14px;
  line-height: 1.65;
  margin-bottom: 0;
}

.detail-aesthetic-refresh .fat-freeze-process-note,
.detail-aesthetic-refresh .mts-process-note {
  color: #777;
  font-size: 12px;
  font-style: italic;
  margin: 20px 0 0;
  text-align: center;
}

@media (max-width: 991px) {
  .detail-treatment-refresh .sidebar {
    margin-bottom: 30px;
  }

  .detail-treatment-refresh .blog-pull-right > .blog-posts > .col-md-12 {
    padding-left: 15px;
  }
}

@media (max-width: 767px) {
  .detail-promotion-refresh .main-content > section:first-child > .container {
    border-left: 0;
    border-radius: 0;
    border-right: 0;
    margin-top: 20px !important;
    padding: 28px 18px 30px !important;
  }

  .detail-treatment-refresh .blog-pull-right article.post:first-child h5,
  .detail-promotion-refresh .main-content > section:first-child h5.font-30 {
    font-size: 27px !important;
  }

  .detail-promotion-refresh .main-content > section:first-child h1.font-30 {
    font-size: 27px !important;
  }

  .detail-promotion-refresh .main-content h2.font-36,
  .detail-promotion-refresh .main-content h3.font-36 {
    font-size: 29px !important;
  }

  .detail-promotion-refresh #contact_form {
    padding: 23px 18px 12px;
  }

  .detail-promotion-refresh .promotion-offer-media {
    margin-top: 28px;
  }

  .detail-promotion-refresh .promotion-terms-section {
    padding: 28px 0 26px;
  }

  .detail-promotion-refresh .reviews-badges {
    min-height: 112px;
    padding: 10px;
  }

  .detail-aesthetic-refresh .fat-freeze-process,
  .detail-aesthetic-refresh .mts-process {
    padding: 24px 18px 20px;
  }

  .detail-aesthetic-refresh .fat-freeze-process-steps,
  .detail-aesthetic-refresh .mts-process-steps {
    display: block;
  }

  .detail-aesthetic-refresh .fat-freeze-process-steps > [class*="col-"],
  .detail-aesthetic-refresh .mts-process-steps > [class*="col-"] {
    display: block;
  }

  .detail-aesthetic-refresh .fat-freeze-process-step,
  .detail-aesthetic-refresh .mts-process-step {
    margin-bottom: 20px;
  }
}