:root {
  --espresso: #281910;
  --espresso-2: #392519;
  --brown: #68452e;
  --gold: #c49a5a;
  --gold-light: #dfc18f;
  --cream: #f4ede3;
  --cream-light: #faf6f0;
  --taupe: #c7b7a6;
  --text: #34271e;
  --muted: #7c6d61;
  --line: #dccfbe;
  --white: #fff;
  --shell: 1180px;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Montserrat", Arial, sans-serif;
}


* {
  box-sizing: border-box;
}


html {
  scroll-behavior: smooth;
}


body {
  margin: 0;

  background: var(--cream-light);

  color: var(--text);

  font-family: var(--sans);
}


a {
  color: inherit;
}


.shell {
  width: min(calc(100% - 48px), var(--shell));

  margin-inline: auto;
}


.skip-link {
  position: fixed;

  top: -100px;
  left: 15px;

  z-index: 999;

  padding: 10px 15px;

  background: #fff;

  color: #000;
}


.skip-link:focus {
  top: 15px;
}


.sr-only {
  position: absolute;

  width: 1px;
  height: 1px;

  overflow: hidden;

  clip: rect(0,0,0,0);
}


/* ========================================================
   HEADER
   ======================================================== */

.site-header {
  position: absolute;

  z-index: 100;

  top: 0;
  left: 0;
  right: 0;

  background: var(--espresso);
}


.header-inner {
  position: relative;

  min-height: 86px;

  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 38px;
}


.brand {
  position: absolute;

  left: 0;
  top: 18px;

  z-index: 5;

  text-decoration: none;
}


.brand-round {
  width: 130px;
  height: 130px;

  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;

  border: 2px solid var(--gold);

  border-radius: 50%;

  background: var(--espresso);

  color: var(--gold-light);

  box-shadow: 0 12px 30px rgba(0,0,0,.18);
}


.brand-round::before,
.brand-round::after {
  content: "❧";

  position: absolute;

  bottom: 17px;

  font-size: 27px;

  opacity: .8;
}


.brand-round::before {
  left: 15px;

  transform: rotate(-28deg);
}


.brand-round::after {
  right: 15px;

  transform: scaleX(-1) rotate(-28deg);
}


.brand-round strong {
  margin: 5px 0;

  font-family: var(--serif);

  font-size: 50px;

  font-weight: 500;

  line-height: .8;
}


.brand-top,
.brand-bottom {
  font-size: 8px;

  letter-spacing: .12em;
}


.site-nav {
  display: flex;

  align-items: center;

  gap: 31px;
}


.site-nav a {
  color: rgba(255,255,255,.78);

  text-decoration: none;

  font-size: 9px;

  text-transform: uppercase;

  font-weight: 600;

  letter-spacing: .08em;
}


.site-nav a:hover {
  color: var(--gold-light);
}


.header-book {
  min-height: 40px;

  padding: 0 24px;

  display: flex;

  align-items: center;

  border-radius: 5px;

  background: var(--gold-light);

  color: var(--espresso);

  text-decoration: none;

  text-transform: uppercase;

  font-size: 10px;

  font-weight: 700;
}


.menu-toggle {
  display: none;

  border: 0;

  background: none;
}


.menu-toggle > span:not(.sr-only) {
  width: 27px;
  height: 1px;

  margin: 6px 0;

  display: block;

  background: white;
}


/* ========================================================
   HERO
   ======================================================== */

.hero {
  padding-top: 86px;

  background: var(--cream);
}


.hero-grid {
  min-height: 590px;

  display: grid;

  grid-template-columns: .92fr 1.2fr;

  overflow: hidden;
}


.hero-copy {
  padding: 104px 65px 55px 45px;

  display: flex;

  flex-direction: column;

  justify-content: center;

  background:
    linear-gradient(
      135deg,
      #f2e7d7 0%,
      #eadccc 100%
    );
}


.hero-kicker {
  margin: 0 0 15px;

  color: var(--gold);

  font-size: 9px;

  font-weight: 700;

  letter-spacing: .18em;
}


.hero h1 {
  margin: 0;

  max-width: 520px;

  font-family: var(--serif);

  font-size: clamp(64px, 5.7vw, 90px);

  font-weight: 500;

  line-height: .88;

  letter-spacing: -.035em;
}


.hero-rule {
  margin: 20px 0 16px;

  width: 270px;

  display: flex;

  align-items: center;

  gap: 8px;
}


.hero-rule span {
  height: 1px;

  flex: 1;

  background: var(--gold);
}


.hero-rule b {
  color: var(--gold);

  font-size: 11px;
}


.hero-lead {
  margin: 0 0 23px;

  font-family: var(--serif);

  font-size: 20px;

  line-height: 1.22;
}


.btn {
  min-height: 45px;

  padding: 0 22px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 13px;

  border-radius: 4px;

  text-decoration: none;

  text-transform: uppercase;

  font-size: 9px;

  font-weight: 700;

  letter-spacing: .03em;
}


.btn-dark {
  width: fit-content;

  background: var(--espresso);

  color: #fff;
}


.hero-features {
  margin-top: 28px;

  display: grid;

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

  gap: 12px;
}


.hero-features > div {
  display: flex;

  align-items: center;

  gap: 7px;
}


.hero-features > div > span {
  width: 34px;
  height: 34px;

  display: flex;

  align-items: center;
  justify-content: center;

  border: 1px solid var(--gold);

  border-radius: 50%;

  color: var(--gold);
}


.hero-features small {
  color: #67594d;

  font-size: 7px;

  line-height: 1.3;
}


/* HERO ROOM PLACEHOLDER */

.hero-image {
  position: relative;

  overflow: hidden;

  background:
    linear-gradient(
      180deg,
      rgba(85,57,39,.07),
      rgba(64,37,22,.05)
    ),
    linear-gradient(
      115deg,
      #d8c2ab 0%,
      #b79778 46%,
      #927056 100%
    );
}


.room-glow {
  position: absolute;

  inset: 0;

  background:
    radial-gradient(
      circle at 47% 31%,
      rgba(255,229,188,.6),
      transparent 20%
    );
}


.spa-mirror {
  position: absolute;

  width: 150px;
  height: 230px;

  top: 80px;
  left: 44%;

  border: 5px solid #463024;

  border-radius: 90px;

  background:
    radial-gradient(circle, #d9c4a8, #564035);

  box-shadow:
    0 0 0 7px #d4a963,
    0 0 38px rgba(255,214,151,.8);
}


.treatment-bed {
  position: absolute;

  width: 76%;
  height: 210px;

  right: -7%;
  bottom: 0;

  border-radius: 35px 0 0 0;

  background:
    linear-gradient(
      180deg,
      #efe7da 0%,
      #d3c5b2 100%
    );

  box-shadow: 0 -20px 45px rgba(0,0,0,.10);
}


.treatment-bed::after {
  content: "";

  position: absolute;

  inset: 35px 0 auto 0;

  height: 3px;

  background: rgba(139,111,86,.15);
}


.bed-pillow {
  position: absolute;

  width: 130px;
  height: 45px;

  top: -18px;
  left: 45%;

  border-radius: 22px;

  background: #e7daca;
}


.spa-cabinet {
  position: absolute;

  width: 210px;
  height: 110px;

  bottom: 125px;
  left: 26%;

  background: #765039;

  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}


.spa-plant {
  position: absolute;

  width: 90px;
  height: 180px;

  right: 12%;
  top: 140px;

  border-radius: 70% 30% 70% 30%;

  background:
    linear-gradient(
      90deg,
      transparent 45%,
      #304126 47%,
      #304126 53%,
      transparent 55%
    );
}


.spa-plant::before,
.spa-plant::after {
  content: "";

  position: absolute;

  width: 55px;
  height: 100px;

  background: #495d38;

  border-radius: 100% 0 100% 0;
}


.spa-plant::before {
  left: 3px;

  transform: rotate(-30deg);
}


.spa-plant::after {
  right: 3px;

  transform: scaleX(-1) rotate(-30deg);
}


/* ========================================================
   CONFIDENCE BAR
   ======================================================== */

.confidence-strip {
  background: var(--espresso);

  color: var(--gold-light);
}


.confidence-inner {
  min-height: 70px;

  display: flex;

  align-items: center;
  justify-content: center;

  gap: 28px;

  text-align: center;
}


.confidence-inner div {
  display: flex;

  flex-direction: column;

  gap: 4px;
}


.confidence-inner strong {
  font-family: var(--serif);

  font-size: 17px;

  letter-spacing: .12em;

  font-weight: 500;
}


.confidence-inner small {
  color: rgba(255,255,255,.65);

  font-size: 7px;
}


/* ========================================================
   GENERAL SECTION
   ======================================================== */

.section {
  padding: 72px 0;
}


.eyebrow {
  margin: 0 0 7px;

  color: var(--gold);

  font-size: 9px;

  font-weight: 700;

  letter-spacing: .15em;
}


.center-heading {
  text-align: center;
}


.center-heading h2,
.about-content h2,
.gallery-inner h2 {
  margin: 0;

  font-family: var(--serif);

  font-weight: 500;

  line-height: .95;
}


.center-heading h2 {
  font-size: 49px;
}


/* ========================================================
   SERVICES
   ======================================================== */

.services {
  background: var(--cream-light);
}


.service-grid {
  margin-top: 32px;

  display: grid;

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

  gap: 14px;
}


.service-card {
  overflow: hidden;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: #fff;
}


.service-photo {
  position: relative;

  height: 200px;

  display: flex;

  align-items: flex-end;
  justify-content: center;

  background-size: cover;

  background-position: center;
}


.service-wax {
  background:
    linear-gradient(
      130deg,
      #a56f45,
      #d2a57a
    );
}


.service-facial {
  background:
    linear-gradient(
      130deg,
      #d6bca7,
      #f0ded2
    );
}


.service-hydro {
  background:
    linear-gradient(
      130deg,
      #809db8,
      #d3e6ea
    );
}


.service-addon {
  background:
    linear-gradient(
      130deg,
      #5e3f66,
      #9f74b4
    );
}


.service-symbol {
  width: 42px;
  height: 42px;

  margin-bottom: -20px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #fff;

  color: var(--gold);

  box-shadow: 0 4px 12px rgba(0,0,0,.12);
}


.service-body {
  padding: 34px 18px 20px;

  text-align: center;
}


.service-body h3 {
  margin: 0 0 10px;

  font-family: var(--serif);

  font-size: 22px;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: .06em;
}


.service-body p {
  min-height: 64px;

  margin: 0;

  color: var(--muted);

  font-size: 9px;

  line-height: 1.55;
}


.service-body a {
  margin-top: 13px;

  padding: 8px 14px;

  display: inline-block;

  border: 1px solid var(--line);

  text-decoration: none;

  text-transform: uppercase;

  color: #5b4839;

  font-size: 8px;
}


.services-action {
  margin-top: 20px;

  text-align: center;
}


/* ========================================================
   ABOUT
   ======================================================== */

.about {
  padding: 0;

  background: var(--cream);
}


.about-grid {
  min-height: 390px;

  display: grid;

  grid-template-columns: 1fr 1.2fr .72fr;

  align-items: stretch;
}


.about-visual {
  background:
    linear-gradient(
      130deg,
      #5b3a27,
      #8e6245
    );

  display: flex;

  align-items: center;
  justify-content: center;
}


.about-room {
  width: 70%;
  height: 76%;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50% 50% 10px 10px;

  background: rgba(39,23,15,.86);

  box-shadow: 0 0 45px rgba(221,184,126,.22);
}


.about-logo {
  width: 150px;
  height: 150px;

  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;

  border: 1px solid var(--gold);

  border-radius: 50%;

  color: var(--gold-light);
}


.about-logo strong {
  font-family: var(--serif);

  font-size: 60px;

  font-weight: 500;
}


.about-logo span {
  font-size: 7px;

  letter-spacing: .14em;
}


.about-content {
  padding: 60px 55px;

  display: flex;

  flex-direction: column;

  justify-content: center;
}


.about-content h2 {
  font-size: 48px;
}


.about-content > p:not(.eyebrow) {
  margin: 20px 0 25px;

  color: var(--muted);

  font-size: 11px;

  line-height: 1.75;
}


.about-benefits {
  padding: 55px 25px;

  display: flex;

  flex-direction: column;

  justify-content: center;

  gap: 25px;
}


.about-benefits > div {
  display: flex;

  align-items: center;

  gap: 13px;
}


.about-benefits span {
  width: 34px;
  height: 34px;

  flex: 0 0 34px;

  display: flex;

  align-items: center;
  justify-content: center;

  border: 1px solid var(--gold);

  border-radius: 50%;

  color: var(--gold);
}


.about-benefits p {
  margin: 0;

  font-size: 9px;
}


/* ========================================================
   REVIEWS
   ======================================================== */

.reviews {
  padding-top: 60px;

  background: var(--cream-light);
}


.review-grid {
  margin-top: 28px;

  display: grid;

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

  gap: 16px;
}


.review-card {
  min-height: 145px;

  padding: 24px;

  border: 1px solid var(--line);

  text-align: center;

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


.stars {
  margin-bottom: 10px;

  color: var(--gold);

  font-size: 10px;

  letter-spacing: .08em;
}


.review-card p {
  color: #66574b;

  font-family: var(--serif);

  font-size: 14px;

  line-height: 1.45;
}


.review-card strong {
  font-size: 8px;
}


.review-dots {
  margin-top: 22px;

  display: flex;

  justify-content: center;

  gap: 6px;
}


.review-dots span {
  width: 7px;
  height: 7px;

  border-radius: 50%;

  background: #c7b8aa;
}


.review-dots .active {
  background: var(--espresso);
}


/* ========================================================
   GALLERY PLACEHOLDER
   ======================================================== */

.gallery {
  padding: 85px 0;

  background: #efe4d6;
}


.gallery-inner {
  text-align: center;
}


.gallery-inner h2 {
  font-size: 58px;
}


.gallery-inner > p:last-child {
  max-width: 520px;

  margin: 20px auto 0;

  color: var(--muted);

  font-size: 11px;

  line-height: 1.7;
}


/* ========================================================
   BOOK CTA
   ======================================================== */

.booking {
  padding: 24px 0;

  border-top: 1px solid var(--line);

  border-bottom: 1px solid var(--line);

  background: var(--cream);
}


.booking-inner {
  display: grid;

  grid-template-columns: 45px 1fr auto;

  align-items: center;

  gap: 18px;
}


.booking-icon {
  width: 38px;
  height: 38px;

  display: flex;

  align-items: center;
  justify-content: center;

  border: 1px solid var(--gold);

  border-radius: 50%;

  color: var(--gold);
}


.booking-inner > div:nth-child(2) {
  display: flex;

  flex-direction: column;
}


.booking-inner span {
  font-family: var(--serif);

  font-size: 18px;
}


.booking-inner small {
  font-size: 8px;

  color: var(--muted);
}


/* ========================================================
   FOOTER
   ======================================================== */

.site-footer {
  padding: 52px 0 20px;

  background: var(--espresso);

  color: #fff;
}


.footer-grid {
  display: grid;

  grid-template-columns: 1.25fr .8fr .8fr 1fr 1fr;

  gap: 35px;
}


.footer-logo {
  position: relative;

  width: 120px;
  height: 120px;
}


.footer-grid h3 {
  margin: 0 0 15px;

  color: var(--gold-light);

  font-family: var(--serif);

  font-size: 15px;

  text-transform: uppercase;

  letter-spacing: .05em;
}


.footer-grid > div:not(.footer-brand) {
  display: flex;

  flex-direction: column;

  align-items: flex-start;
}


.footer-grid a,
.footer-grid p {
  margin: 0 0 7px;

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

  text-decoration: none;

  font-size: 8px;

  line-height: 1.45;
}


.footer-book-btn {
  padding: 9px 12px;

  border: 1px solid var(--gold);

  color: var(--gold-light) !important;
}


.footer-bottom {
  margin-top: 35px;

  padding-top: 18px;

  display: flex;

  justify-content: space-between;

  gap: 30px;

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

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

  font-size: 7px;
}


.footer-bottom a {
  color: var(--gold-light);

  text-decoration: none;
}


.mobile-book-bar {
  display: none;
}


/* ========================================================
   REVEAL
   ======================================================== */

.reveal {
  opacity: 0;

  transform: translateY(18px);

  transition:
    opacity .65s ease,
    transform .65s ease;
}


.reveal.is-visible {
  opacity: 1;

  transform: none;
}


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

@media (max-width: 960px) {

  .header-inner {
    min-height: 76px;
  }

  .brand {
    top: 12px;
  }

  .brand-round {
    width: 105px;
    height: 105px;
  }

  .brand-round strong {
    font-size: 39px;
  }

  .menu-toggle {
    margin-left: auto;

    display: block;

    z-index: 102;
  }

  .site-nav {
    position: fixed;

    z-index: 101;

    inset: 0;

    padding: 110px 28px 40px;

    flex-direction: column;

    align-items: flex-start;

    gap: 0;

    background: var(--espresso);

    transform: translateX(100%);

    transition: transform .28s ease;
  }

  .site-nav.open {
    transform: translateX(0);
  }

  .site-nav > a {
    width: 100%;

    padding: 14px 0;

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

    font-family: var(--serif);

    font-size: 29px;

    text-transform: none;
  }

  .header-book {
    display: none;
  }

  .menu-toggle.active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .menu-toggle.active span:nth-child(2) {
    opacity: 0;
  }

  .menu-toggle.active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .hero-grid {
    grid-template-columns: 1fr 1fr;
  }

  .hero-copy {
    padding-left: 25px;
    padding-right: 25px;
  }

  .hero-features {
    grid-template-columns: 1fr 1fr;
  }

  .service-grid {
    grid-template-columns: repeat(2,1fr);
  }

  .about-grid {
    grid-template-columns: 1fr 1fr;
  }

  .about-benefits {
    grid-column: 1 / -1;

    flex-direction: row;

    justify-content: space-between;
  }

  .footer-grid {
    grid-template-columns: repeat(3,1fr);
  }

}


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

@media (max-width: 680px) {

  .shell {
    width: min(calc(100% - 28px), var(--shell));
  }

  .site-header {
    position: absolute;
  }

  .brand {
    left: 10px;
  }

  .brand-round {
    width: 92px;
    height: 92px;
  }

  .brand-round strong {
    font-size: 35px;
  }

  .brand-top,
  .brand-bottom {
    font-size: 5px;
  }

  .hero {
    padding-top: 76px;
  }

  .hero-grid {
    width: 100%;

    grid-template-columns: 1fr;
  }

  .hero-copy {
    padding:
      95px
      24px
      40px;

    min-height: 535px;
  }

  .hero h1 {
    font-size: 57px;
  }

  .hero-rule {
    width: 230px;
  }

  .hero-lead {
    font-size: 18px;
  }

  .hero-features {
    margin-top: 24px;

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

  .hero-image {
    min-height: 430px;
  }

  .treatment-bed {
    width: 88%;
  }

  .spa-mirror {
    left: 28%;
  }

  .spa-plant {
    right: 9%;
  }

  .confidence-inner {
    padding: 18px 0;
  }

  .confidence-inner strong {
    font-size: 13px;
  }

  .confidence-inner > span {
    display: none;
  }

  .section {
    padding: 65px 0;
  }

  .center-heading h2 {
    font-size: 39px;
  }

  .service-grid {
    grid-template-columns: 1fr;
  }

  .service-photo {
    height: 250px;
  }

  .service-body p {
    min-height: 0;
  }

  .about-grid {
    grid-template-columns: 1fr;
  }

  .about-visual {
    min-height: 380px;
  }

  .about-content {
    padding: 55px 25px;
  }

  .about-benefits {
    grid-column: auto;

    padding: 35px 25px;

    flex-direction: column;

    align-items: flex-start;
  }

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

  .gallery-inner h2 {
    font-size: 45px;
  }

  .booking-inner {
    grid-template-columns: 42px 1fr;
  }

  .booking-inner .btn {
    grid-column: 1 / -1;

    width: 100%;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;

    gap: 32px;
  }

  .footer-brand {
    grid-column: 1 / -1;
  }

  .footer-bottom {
    flex-direction: column;
  }

  .mobile-book-bar {
    position: fixed;

    z-index: 90;

    left: 12px;
    right: 12px;
    bottom: 12px;

    display: grid;

    grid-template-columns: .8fr 1.2fr;

    overflow: hidden;

    border-radius: 999px;

    background: rgba(40,25,16,.96);

    box-shadow: 0 8px 28px rgba(0,0,0,.30);
  }

  .mobile-book-bar a {
    min-height: 54px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #fff;

    text-decoration: none;

    font-size: 10px;

    font-weight: 700;
  }

  .mobile-book-bar a + a {
    background: var(--gold-light);

    color: var(--espresso);
  }

  .site-footer {
    padding-bottom: 90px;
  }

}


@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
  }

  .reveal {
    opacity: 1;

    transform: none;
  }

}

/* ==========================================================
   LV APPROVED PRODUCTION LOGO
   ========================================================== */

.brand {
  position: absolute !important;
  left: 0 !important;
  top: 10px !important;

  z-index: 5;

  display: block;

  text-decoration: none;
}

.brand-logo {
  display: block;

  width: 125px;
  height: 125px;

  object-fit: contain;

  filter: drop-shadow(0 9px 16px rgba(0,0,0,.22));
}


/* Remove old generated logo styling */
.brand-round,
.brand-top,
.brand-bottom {
  display: none !important;
}


/* FOOTER */

.footer-brand {
  display: flex;

  align-items: flex-start;
}

.footer-brand a {
  display: inline-block;
}

.footer-logo-image {
  display: block;

  width: 125px;
  height: 125px;

  object-fit: contain;
}


/* TABLET */

@media (max-width: 960px) {

  .brand {
    top: 7px !important;
  }

  .brand-logo {
    width: 105px;
    height: 105px;
  }

}


/* MOBILE */

@media (max-width: 680px) {

  .brand {
    left: 8px !important;
    top: 7px !important;
  }

  .brand-logo {
    width: 92px;
    height: 92px;
  }

  .footer-logo-image {
    width: 110px;
    height: 110px;
  }

}

/* ==========================================================
   APPROVED LV LOGO — FINAL
   ========================================================== */

.site-header,
.header-inner {
  overflow: visible !important;
}

body .site-header .brand {
  position: absolute !important;
  left: 0 !important;
  top: 7px !important;

  display: block !important;

  width: 125px !important;
  height: 125px !important;

  z-index: 500 !important;
}

body .site-header .brand-logo {
  display: block !important;

  width: 125px !important;
  height: 125px !important;

  max-width: none !important;
  max-height: none !important;

  object-fit: contain !important;

  opacity: 1 !important;
  visibility: visible !important;

  filter: drop-shadow(0 8px 16px rgba(0,0,0,.25));
}


/* FOOTER */

body .footer-brand {
  display: block !important;
}

body .footer-brand a {
  display: inline-block !important;
}

body .footer-logo-image {
  display: block !important;

  width: 125px !important;
  height: 125px !important;

  object-fit: contain !important;

  opacity: 1 !important;
  visibility: visible !important;
}


/* TABLET */

@media (max-width: 960px) {

  body .site-header .brand {
    width: 105px !important;
    height: 105px !important;

    top: 6px !important;
  }

  body .site-header .brand-logo {
    width: 105px !important;
    height: 105px !important;
  }

}


/* MOBILE */

@media (max-width: 680px) {

  body .site-header .brand {
    left: 8px !important;
    top: 5px !important;

    width: 92px !important;
    height: 92px !important;
  }

  body .site-header .brand-logo {
    width: 92px !important;
    height: 92px !important;
  }

  body .footer-logo-image {
    width: 110px !important;
    height: 110px !important;
  }

}

/* ==========================================================
   LV WAX STUDIO — PRODUCTION HERO IMAGE
   ========================================================== */

.hero {
  position: relative;

  min-height: 650px;

  padding-top: 86px;

  display: flex;
  align-items: center;

  overflow: hidden;

  background:
    linear-gradient(
      90deg,
      rgba(244,237,227,.98) 0%,
      rgba(244,237,227,.94) 25%,
      rgba(244,237,227,.72) 42%,
      rgba(244,237,227,.12) 62%,
      rgba(244,237,227,0) 78%
    ),
    url('assets/images/hero-1.png')
    72% center / cover no-repeat !important;
}


/* Remove the simulated spa-room artwork */
.hero-image {
  display: none !important;
}


/* Hero becomes one full-width content area */
.hero-grid {
  min-height: 650px;

  display: block !important;

  overflow: visible !important;
}


/* Copy overlays left side */
.hero-copy {
  position: relative;

  z-index: 3;

  width: 48%;
  max-width: 600px;

  min-height: 650px;

  padding:
    115px
    40px
    60px
    38px !important;

  display: flex;

  flex-direction: column;

  justify-content: center;

  background: transparent !important;
}


/* Headline */
.hero h1 {
  max-width: 560px;

  font-size: clamp(68px, 6vw, 96px);

  line-height: .88;
}


/* Description */
.hero-lead {
  font-size: 21px;
}


/* CTA */
.hero .btn-dark {
  min-height: 48px;

  padding: 0 24px;
}


/* Feature icons */
.hero-features {
  max-width: 520px;
}


/* Desktop XL */
@media (min-width: 1400px) {

  .hero {
    min-height: 720px;

    background-position: 74% center !important;
  }

  .hero-grid,
  .hero-copy {
    min-height: 720px;
  }

  .hero-copy {
    width: 46%;

    padding-left: 25px !important;
  }

}


/* TABLET */

@media (max-width: 960px) {

  .hero {
    min-height: 650px;

    background:
      linear-gradient(
        90deg,
        rgba(244,237,227,.97) 0%,
        rgba(244,237,227,.91) 35%,
        rgba(244,237,227,.46) 58%,
        rgba(244,237,227,0) 82%
      ),
      url('assets/images/hero-1.png')
      68% center / cover no-repeat !important;
  }

  .hero-copy {
    width: 58%;
  }

}


/* MOBILE */

@media (max-width: 680px) {

  .hero {
    min-height: 900px;

    padding-top: 76px;

    align-items: flex-start;

    background:
      linear-gradient(
        180deg,
        rgba(244,237,227,.98) 0%,
        rgba(244,237,227,.93) 41%,
        rgba(244,237,227,.50) 55%,
        rgba(244,237,227,.06) 69%,
        rgba(244,237,227,0) 78%
      ),
      url('assets/images/hero-1.png')
      72% bottom / auto 58% no-repeat !important;

    background-color: var(--cream);
  }

  .hero-grid {
    min-height: 900px;
  }

  .hero-copy {
    width: 100%;

    max-width: none;

    min-height: 900px;

    padding:
      105px
      24px
      440px !important;

    justify-content: flex-start;
  }

  .hero h1 {
    max-width: 400px;

    font-size: 58px;
  }

  .hero-lead {
    font-size: 18px;
  }

  .hero-features {
    max-width: 360px;
  }

}

/* ==========================================================
   HERO FEATURE READABILITY FIX
   ========================================================== */

.hero-features {
  margin-top: 30px !important;
  gap: 12px !important;
}

.hero-features > div {
  min-height: 58px;

  padding: 10px 12px;

  border: 1px solid rgba(116,83,47,.22);

  border-radius: 999px;

  background: rgba(250,246,240,.84);

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  box-shadow: 0 4px 16px rgba(80,54,34,.07);
}

.hero-features > div > span {
  width: 36px !important;
  height: 36px !important;

  flex: 0 0 36px;

  color: #9f6f32 !important;

  border-color: #c49a5a !important;

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

.hero-features small {
  color: #4b382b !important;

  font-size: 9px !important;

  font-weight: 600;

  line-height: 1.35 !important;

  letter-spacing: 0;
}


/* MOBILE */

@media (max-width: 680px) {

  .hero-features {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .hero-features > div {
    min-height: 60px;
    padding: 9px 10px;
  }

  .hero-features small {
    font-size: 8.5px !important;
  }

}

/* ==========================================================
   LUXURY GLOWING CTA EDGE
   ========================================================== */

.hero .btn-dark {
  position: relative;

  border: 1px solid rgba(226,189,114,.85);

  background:
    linear-gradient(
      180deg,
      #2b1b12 0%,
      #1f140e 100%
    );

  color: #fff;

  box-shadow:
    0 0 0 1px rgba(226,189,114,.12),
    0 0 12px rgba(226,189,114,.28),
    0 0 28px rgba(226,189,114,.16),
    inset 0 1px 0 rgba(255,255,255,.08);

  transition:
    transform .2s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}

.hero .btn-dark::before {
  content: "";

  position: absolute;
  inset: -2px;

  border-radius: inherit;

  border: 1px solid rgba(226,189,114,.36);

  pointer-events: none;

  filter: blur(2px);
}

.hero .btn-dark:hover {
  transform: translateY(-2px);

  border-color: #e2bd72;

  box-shadow:
    0 0 0 1px rgba(226,189,114,.25),
    0 0 16px rgba(226,189,114,.42),
    0 0 38px rgba(226,189,114,.24),
    inset 0 1px 0 rgba(255,255,255,.10);
}

/* ==========================================================
   HERO CTA — STRONG GOLD LIGHTED EDGE
   KEEP THIS LAST
   ========================================================== */

body .hero .btn-dark {
  position: relative !important;

  overflow: visible !important;

  border: 1px solid #e2bd72 !important;

  background:
    linear-gradient(
      180deg,
      #2a1b12 0%,
      #160d08 100%
    ) !important;

  color: #fff !important;

  box-shadow:
    0 0 4px rgba(226,189,114,.95),
    0 0 10px rgba(226,189,114,.70),
    0 0 24px rgba(226,189,114,.42),
    0 0 42px rgba(226,189,114,.20),
    inset 0 0 8px rgba(226,189,114,.12) !important;
}


/* Bright illuminated rim */
body .hero .btn-dark::before {
  content: "" !important;

  position: absolute !important;

  inset: -3px !important;

  z-index: -1 !important;

  border-radius: 6px !important;

  background:
    linear-gradient(
      90deg,
      rgba(226,189,114,.15),
      rgba(255,232,177,.95),
      rgba(226,189,114,.25),
      rgba(255,232,177,.95),
      rgba(226,189,114,.15)
    ) !important;

  filter: blur(4px) !important;

  opacity: .85 !important;

  pointer-events: none !important;
}


/* Crisp inner highlight */
body .hero .btn-dark::after {
  content: "" !important;

  position: absolute !important;

  inset: 1px !important;

  border-radius: 3px !important;

  border:
    1px solid rgba(255,226,165,.22) !important;

  pointer-events: none !important;
}


body .hero .btn-dark:hover {
  transform: translateY(-2px) !important;

  box-shadow:
    0 0 6px rgba(255,226,165,1),
    0 0 14px rgba(226,189,114,.90),
    0 0 30px rgba(226,189,114,.60),
    0 0 55px rgba(226,189,114,.30),
    inset 0 0 10px rgba(226,189,114,.15) !important;
}

/* ==========================================================
   BODY WAXING CARD IMAGE
   ========================================================== */

.service-wax {
  background:
    linear-gradient(
      180deg,
      rgba(40,25,16,.04),
      rgba(40,25,16,.10)
    ),
    url('assets/images/body-waxing.png')
    center center / cover no-repeat !important;
}

/* ==========================================================
   LV WAX STUDIO — PRODUCTION HERO IMAGE
   ========================================================== */

.hero {
  position: relative;

  min-height: 650px;

  padding-top: 86px;

  display: flex;
  align-items: center;

  overflow: hidden;

  background:
    linear-gradient(
      90deg,
      rgba(244,237,227,.98) 0%,
      rgba(244,237,227,.94) 25%,
      rgba(244,237,227,.72) 42%,
      rgba(244,237,227,.12) 62%,
      rgba(244,237,227,0) 78%
    ),
    url('assets/images/hero-1.png')
    72% center / cover no-repeat !important;
}


/* Remove the simulated spa-room artwork */
.hero-image {
  display: none !important;
}


/* Hero becomes one full-width content area */
.hero-grid {
  min-height: 650px;

  display: block !important;

  overflow: visible !important;
}


/* Copy overlays left side */
.hero-copy {
  position: relative;

  z-index: 3;

  width: 48%;
  max-width: 600px;

  min-height: 650px;

  padding:
    115px
    40px
    60px
    38px !important;

  display: flex;

  flex-direction: column;

  justify-content: center;

  background: transparent !important;
}


/* Headline */
.hero h1 {
  max-width: 560px;

  font-size: clamp(68px, 6vw, 96px);

  line-height: .88;
}


/* Description */
.hero-lead {
  font-size: 21px;
}


/* CTA */
.hero .btn-dark {
  min-height: 48px;

  padding: 0 24px;
}


/* Feature icons */
.hero-features {
  max-width: 520px;
}


/* Desktop XL */
@media (min-width: 1400px) {

  .hero {
    min-height: 720px;

    background-position: 74% center !important;
  }

  .hero-grid,
  .hero-copy {
    min-height: 720px;
  }

  .hero-copy {
    width: 46%;

    padding-left: 25px !important;
  }

}


/* TABLET */

@media (max-width: 960px) {

  .hero {
    min-height: 650px;

    background:
      linear-gradient(
        90deg,
        rgba(244,237,227,.97) 0%,
        rgba(244,237,227,.91) 35%,
        rgba(244,237,227,.46) 58%,
        rgba(244,237,227,0) 82%
      ),
      url('assets/images/hero-1.png')
      68% center / cover no-repeat !important;
  }

  .hero-copy {
    width: 58%;
  }

}


/* MOBILE */

@media (max-width: 680px) {

  .hero {
    min-height: 900px;

    padding-top: 76px;

    align-items: flex-start;

    background:
      linear-gradient(
        180deg,
        rgba(244,237,227,.98) 0%,
        rgba(244,237,227,.93) 41%,
        rgba(244,237,227,.50) 55%,
        rgba(244,237,227,.06) 69%,
        rgba(244,237,227,0) 78%
      ),
      url('assets/images/hero-1.png')
      72% bottom / auto 58% no-repeat !important;

    background-color: var(--cream);
  }

  .hero-grid {
    min-height: 900px;
  }

  .hero-copy {
    width: 100%;

    max-width: none;

    min-height: 900px;

    padding:
      105px
      24px
      440px !important;

    justify-content: flex-start;
  }

  .hero h1 {
    max-width: 400px;

    font-size: 58px;
  }

  .hero-lead {
    font-size: 18px;
  }

  .hero-features {
    max-width: 360px;
  }

}

/* ==========================================================
   FACIALS CARD IMAGE
   ========================================================== */

.service-facial {
  background:
    linear-gradient(
      180deg,
      rgba(40,25,16,.04),
      rgba(40,25,16,.10)
    ),
    url('assets/images/facials.png')
    center center / cover no-repeat !important;
}

/* ==========================================================
   HYDRO FACIALS CARD IMAGE
   ========================================================== */

.service-hydro {
  background:
    linear-gradient(
      180deg,
      rgba(40,25,16,.04),
      rgba(40,25,16,.10)
    ),
    url('assets/images/hydro-facials.png')
    center center / cover no-repeat !important;
}

/* ==========================================================
   ADD-ONS CARD IMAGE
   ========================================================== */

.service-addon {
  background:
    linear-gradient(
      180deg,
      rgba(40,25,16,.04),
      rgba(40,25,16,.10)
    ),
    url('assets/images/add-ons.png')
    center center / cover no-repeat !important;
}

/* ==========================================================
   WHERE BEAUTY MEETS CARE — REAL IMAGE
   ========================================================== */

.about-visual {
  min-height: 430px;

  background:
    linear-gradient(
      180deg,
      rgba(40,25,16,.04),
      rgba(40,25,16,.12)
    ),
    url('assets/images/meet-care.png')
    center center / cover no-repeat !important;

  display: block !important;
}


/* Hide temporary generated LV room graphic */
.about-room {
  display: none !important;
}


/* TABLET */

@media (max-width: 960px) {

  .about-visual {
    min-height: 420px;
  }

}


/* MOBILE */

@media (max-width: 680px) {

  .about-visual {
    min-height: 390px;

    background-position: center center !important;
  }

}

/* =========================================================
   HOMEPAGE — LARGER MOBILE LOGO
   ========================================================= */

@media (max-width: 820px) {

  body .site-header .brand {
    width: 120px !important;
    height: 120px !important;

    top: 5px !important;

    z-index: 600 !important;
  }

  body .site-header .brand-logo {
    width: 120px !important;
    height: 120px !important;

    max-width: none !important;
    max-height: none !important;

    object-fit: contain !important;

    filter:
      drop-shadow(0 8px 16px rgba(0,0,0,.28)) !important;
  }

}


@media (max-width: 680px) {

  body .site-header .brand {
    width: 114px !important;
    height: 114px !important;

    top: 4px !important;
  }

  body .site-header .brand-logo {
    width: 114px !important;
    height: 114px !important;
  }

}

/* =========================================================
   HOMEPAGE — CONTACT / CONFIDENCE STRIP
   ========================================================= */

.home-contact-strip {
  position: relative !important;

  background:
    linear-gradient(
      135deg,
      #1b0d07 0%,
      #30170c 52%,
      #1b0d07 100%
    ) !important;

  color: white !important;

  border-top:
    1px solid
    rgba(224,181,94,.22) !important;

  border-bottom:
    1px solid
    rgba(224,181,94,.22) !important;
}


.home-contact-strip-inner {
  width: min(92%, 1180px) !important;

  min-height: 105px !important;

  margin:
    0
    auto !important;

  display: grid !important;

  grid-template-columns:
    1fr
    1.2fr
    1fr !important;

  align-items: center !important;

  gap: 28px !important;

  padding:
    18px
    0 !important;
}


.contact-strip-item {
  display: flex !important;

  flex-direction: column !important;

  gap: 5px !important;
}


.contact-strip-location {
  text-align: left !important;
}


.contact-strip-phone {
  text-align: right !important;

  align-items: flex-end !important;
}


.contact-strip-label {
  color: #dda94f !important;

  font-size: 8px !important;

  font-weight: 700 !important;

  letter-spacing: .17em !important;
}


.contact-strip-item a {
  color:
    rgba(255,255,255,.88) !important;

  text-decoration: none !important;

  font-size: 10px !important;

  line-height: 1.65 !important;
}


.contact-strip-item a:hover {
  color: #efc66f !important;
}


.contact-strip-link {
  color: #dca64a !important;

  font-size: 8px !important;

  font-weight: 700 !important;

  letter-spacing: .07em !important;

  text-transform: uppercase !important;
}


.contact-strip-center {
  padding:
    0
    30px !important;

  text-align: center !important;

  border-left:
    1px solid
    rgba(224,181,94,.22) !important;

  border-right:
    1px solid
    rgba(224,181,94,.22) !important;
}


.contact-strip-center strong {
  display: block !important;

  color: #e8b95b !important;

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

  font-size: 18px !important;

  font-weight: 500 !important;

  letter-spacing: .06em !important;
}


.contact-strip-center span {
  display: block !important;

  margin-top: 5px !important;

  color:
    rgba(255,255,255,.72) !important;

  font-size: 9px !important;

  letter-spacing: .08em !important;
}



/* =========================================================
   HOMEPAGE — OBVIOUS GOLD BOOKING BUTTONS
   Match service-page CTA treatment
   ========================================================= */

.site-header .header-book,
.hero a[href*="lilyv.glossgenius.com"],
.footer-book-btn,
a.btn[href*="lilyv.glossgenius.com"] {
  background:
    linear-gradient(
      135deg,
      #f0cc79 0%,
      #d89d3f 52%,
      #eabd62 100%
    ) !important;

  color: #211008 !important;

  border:
    1px solid
    #f3d58e !important;

  font-weight: 800 !important;

  box-shadow:
    0 0 0 1px rgba(255,226,162,.20),
    0 0 18px rgba(222,169,71,.38),
    0 10px 24px rgba(0,0,0,.20) !important;

  transition:
    transform .2s ease,
    filter .2s ease,
    box-shadow .2s ease !important;
}


.site-header .header-book:hover,
.hero a[href*="lilyv.glossgenius.com"]:hover,
.footer-book-btn:hover,
a.btn[href*="lilyv.glossgenius.com"]:hover {
  transform:
    translateY(-2px) !important;

  filter:
    brightness(1.06) !important;

  box-shadow:
    0 0 22px rgba(231,187,93,.55),
    0 14px 28px rgba(0,0,0,.24) !important;
}



/* =========================================================
   MOBILE CONTACT STRIP
   ========================================================= */

@media (max-width: 760px) {

  .home-contact-strip-inner {
    width: 100% !important;

    grid-template-columns:
      1fr !important;

    gap: 0 !important;

    padding:
      22px
      22px !important;
  }


  .contact-strip-center {
    order: 1 !important;

    padding:
      0
      0
      20px !important;

    margin-bottom: 18px !important;

    border-left: 0 !important;
    border-right: 0 !important;

    border-bottom:
      1px solid
      rgba(224,181,94,.22) !important;
  }


  .contact-strip-location {
    order: 2 !important;

    text-align: center !important;

    align-items: center !important;

    padding-bottom: 16px !important;
  }


  .contact-strip-phone {
    order: 3 !important;

    text-align: center !important;

    align-items: center !important;

    padding-top: 16px !important;

    border-top:
      1px solid
      rgba(224,181,94,.16) !important;
  }


  .contact-strip-center strong {
    font-size: 20px !important;
  }


  .contact-strip-item a {
    font-size: 11px !important;
  }

}

/* =========================================================
   HOMEPAGE — CONTACT + CONFIDENCE STRIP
   ========================================================= */

.home-contact-strip {
  position: relative !important;

  background:
    linear-gradient(
      135deg,
      #211108 0%,
      #32190d 50%,
      #211108 100%
    ) !important;

  border-top:
    1px solid
    rgba(225,183,96,.20) !important;

  border-bottom:
    1px solid
    rgba(225,183,96,.20) !important;
}


.home-contact-strip-inner {
  width: min(94%, 1180px) !important;

  min-height: 98px !important;

  margin: 0 auto !important;

  padding:
    15px
    0 !important;

  display: grid !important;

  grid-template-columns:
    1fr
    1.25fr
    1fr !important;

  align-items: center !important;

  gap: 25px !important;
}


.home-strip-contact {
  display: flex !important;

  flex-direction: column !important;

  gap: 4px !important;
}


.home-strip-address {
  text-align: left !important;
}


.home-strip-phone {
  align-items: flex-end !important;

  text-align: right !important;
}


.home-strip-label {
  color: #e1ad53 !important;

  font-size: 8px !important;

  font-weight: 700 !important;

  letter-spacing: .18em !important;
}


.home-strip-contact a {
  color:
    rgba(255,255,255,.88) !important;

  text-decoration: none !important;

  font-size: 10px !important;

  line-height: 1.55 !important;
}


.home-strip-contact a:hover {
  color: #efc76f !important;
}


.home-strip-contact-link {
  margin-top: 2px !important;

  color: #dda84b !important;

  font-size: 8px !important;

  font-weight: 700 !important;

  letter-spacing: .08em !important;

  text-transform: uppercase !important;
}


.home-strip-confidence {
  padding:
    0
    25px !important;

  text-align: center !important;

  border-left:
    1px solid
    rgba(226,185,99,.22) !important;

  border-right:
    1px solid
    rgba(226,185,99,.22) !important;
}


.home-strip-confidence strong {
  display: block !important;

  color: #e5b457 !important;

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

  font-size: 18px !important;

  font-weight: 500 !important;

  letter-spacing: .07em !important;
}


.home-strip-confidence span {
  display: block !important;

  margin-top: 4px !important;

  color:
    rgba(255,255,255,.70) !important;

  font-size: 9px !important;

  letter-spacing: .07em !important;
}



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

@media (max-width: 760px) {

  .home-contact-strip-inner {
    width: 100% !important;

    min-height: auto !important;

    padding:
      22px
      20px !important;

    grid-template-columns:
      1fr !important;

    gap: 0 !important;
  }


  .home-strip-confidence {
    order: 1 !important;

    padding:
      0
      0
      18px !important;

    margin-bottom: 17px !important;

    border-left: 0 !important;
    border-right: 0 !important;

    border-bottom:
      1px solid
      rgba(226,185,99,.20) !important;
  }


  .home-strip-address {
    order: 2 !important;

    align-items: center !important;

    text-align: center !important;

    padding-bottom: 15px !important;
  }


  .home-strip-phone {
    order: 3 !important;

    align-items: center !important;

    text-align: center !important;

    padding-top: 15px !important;

    border-top:
      1px solid
      rgba(226,185,99,.15) !important;
  }


  .home-strip-confidence strong {
    font-size: 20px !important;
  }


  .home-strip-contact a {
    font-size: 11px !important;
  }

}

/* =========================================================
   HOMEPAGE STRIP — POLISHED PROFESSIONAL VERSION
   ========================================================= */

.home-contact-strip {
  position: relative !important;
  background: linear-gradient(135deg, #241108 0%, #34180d 50%, #241108 100%) !important;
  border-top: 1px solid rgba(229, 188, 100, 0.18) !important;
  border-bottom: 1px solid rgba(229, 188, 100, 0.18) !important;
}

.home-contact-strip-inner {
  width: min(94%, 1180px) !important;
  margin: 0 auto !important;
  padding: 24px 0 !important;
  display: grid !important;
  grid-template-columns: 1fr 1.2fr 1fr !important;
  gap: 28px !important;
  align-items: center !important;
}

.home-strip-card {
  min-height: 110px !important;
  padding: 16px 20px !important;
  border: 1px solid rgba(229, 188, 100, 0.12) !important;
  background: rgba(255, 255, 255, 0.02) !important;
  backdrop-filter: blur(4px) !important;
}

.home-strip-card-left {
  text-align: left !important;
}

.home-strip-card-center {
  text-align: center !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

.home-strip-card-right {
  text-align: right !important;
}

.home-strip-kicker {
  display: inline-block !important;
  margin-bottom: 8px !important;
  color: #e4b45f !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}

.home-strip-title {
  margin: 0 0 6px !important;
  color: #f5e7c5 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 26px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

.home-strip-center-title {
  margin: 0 0 6px !important;
  color: #e7bb6a !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 32px !important;
  font-weight: 500 !important;
  line-height: 1.05 !important;
}

.home-strip-center-text {
  margin: 0 !important;
  color: rgba(255,255,255,0.78) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.home-strip-main-link {
  display: inline-block !important;
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

.home-strip-main-link:hover {
  color: #efc56d !important;
}

.home-strip-subtext {
  margin: 4px 0 0 !important;
  color: rgba(255,255,255,0.72) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.home-strip-action-link {
  display: inline-block !important;
  margin-top: 8px !important;
  color: #e4b45f !important;
  text-decoration: none !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.home-strip-action-link:hover {
  color: #f2cc7c !important;
}

@media (max-width: 900px) {
  .home-contact-strip-inner {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 20px 16px !important;
  }

  .home-strip-card,
  .home-strip-card-left,
  .home-strip-card-center,
  .home-strip-card-right {
    text-align: center !important;
  }

  .home-strip-card {
    min-height: auto !important;
    padding: 18px 16px !important;
  }

  .home-strip-title {
    font-size: 24px !important;
  }

  .home-strip-center-title {
    font-size: 28px !important;
  }

  .home-strip-main-link {
    font-size: 15px !important;
  }
}

@media (max-width: 560px) {
  .home-strip-kicker {
    font-size: 9px !important;
  }

  .home-strip-title {
    font-size: 22px !important;
  }

  .home-strip-center-title {
    font-size: 24px !important;
  }

  .home-strip-center-text,
  .home-strip-subtext {
    font-size: 12px !important;
  }

  .home-strip-main-link {
    font-size: 14px !important;
  }
}

/* =========================================================
   HOMEPAGE — STICKY NAVIGATION HEADER
   ========================================================= */

.site-header {
  position: sticky !important;
  position: -webkit-sticky !important;

  top: 0 !important;

  z-index: 9999 !important;

  background:
    rgba(35, 18, 10, .97) !important;

  box-shadow:
    0 8px 24px
    rgba(24, 11, 6, .16) !important;

  backdrop-filter:
    blur(10px) !important;

  -webkit-backdrop-filter:
    blur(10px) !important;
}

.site-header .header-inner {
  position: relative !important;

  z-index: 10000 !important;
}


/* Keep large logo above page content while scrolling */

.site-header .brand {
  z-index: 10001 !important;
}


/* =========================================================
   HOMEPAGE — MOBILE FIXED HEADER
   Desktop remains sticky
   ========================================================= */

@media (max-width: 820px) {

  .site-header {
    position: fixed !important;

    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;

    z-index: 99999 !important;

    overflow: visible !important;

    background:
      rgba(31, 15, 8, .98) !important;

    box-shadow:
      0 7px 22px
      rgba(20, 9, 5, .22) !important;

    backdrop-filter:
      blur(10px) !important;

    -webkit-backdrop-filter:
      blur(10px) !important;
  }


  .site-header .header-inner {
    position: relative !important;

    z-index: 100000 !important;

    overflow: visible !important;
  }


  .site-header .brand {
    z-index: 100002 !important;
  }


  /*
    Reserve space for fixed header so the hero
    does not jump underneath it.
  */
  body {
    padding-top: 82px !important;
  }

}

/* =========================================================
   HOMEPAGE — MOBILE HERO TOP SPACING
   Keep fixed header, remove excessive blank area
   ========================================================= */

@media (max-width: 820px) {

  .hero {
    padding-top: 0 !important;
  }

  .hero-grid {
    padding-top: 0 !important;
  }

  .hero-copy {
    padding-top: 48px !important;
  }

}


@media (max-width: 680px) {

  .hero {
    padding-top: 0 !important;
  }

  .hero-copy {
    padding-top: 42px !important;
  }

}

/* =========================================================
   HOMEPAGE — FINAL MOBILE HERO VERTICAL BALANCE
   ========================================================= */

@media (max-width: 820px) {

  .hero-copy {
    padding-top: 72px !important;
  }

}

@media (max-width: 680px) {

  .hero-copy {
    padding-top: 66px !important;
  }

}

/* =========================================================
   HOMEPAGE — MOBILE HERO IMAGE PULLED UP
   ========================================================= */

@media (max-width: 820px) {

  .hero {
    overflow: hidden !important;
  }

  .hero-copy {
    padding-bottom: 18px !important;
  }

  .hero-visual,
  .hero-media,
  .hero-image-wrap,
  .hero-image {
    margin-top: -90px !important;
    position: relative !important;
    z-index: 1 !important;
  }

}

@media (max-width: 680px) {

  .hero-visual,
  .hero-media,
  .hero-image-wrap,
  .hero-image {
    margin-top: -120px !important;
  }

}

/* =========================================================
   HOMEPAGE — MOBILE HERO IMAGE PULLED UP
   ========================================================= */

@media (max-width: 820px) {

  .hero {
    overflow: hidden !important;
  }

  .hero-copy {
    padding-bottom: 18px !important;
  }

  .hero-visual,
  .hero-media,
  .hero-image-wrap,
  .hero-image {
    margin-top: -90px !important;
    position: relative !important;
    z-index: 1 !important;
  }

}

@media (max-width: 680px) {

  .hero-visual,
  .hero-media,
  .hero-image-wrap,
  .hero-image {
    margin-top: -120px !important;
  }

}

/* =========================================================
   HOMEPAGE — MOBILE HERO OVERLAY FIX
   Removes blank white area and overlays text on image
   ========================================================= */

@media (max-width: 820px) {

  .hero,
  .home-hero {
    position: relative !important;
    overflow: hidden !important;
    padding-top: 112px !important;
    padding-bottom: 0 !important;
    background: #f2ece3 !important;
  }

  .hero-grid,
  .hero-shell,
  .hero-inner,
  .hero-layout {
    position: relative !important;
    display: block !important;
    min-height: 980px !important;
  }

  .hero-visual,
  .hero-media,
  .hero-image-wrap,
  .hero-image,
  .hero-art {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 980px !important;
    margin: 0 !important;
    z-index: 1 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
  }

  .hero-visual img,
  .hero-media img,
  .hero-image-wrap img,
  .hero-image img,
  .hero-art img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 58% !important;
    display: block !important;
  }

  .hero-copy,
  .hero-content,
  .hero-text,
  .hero-panel {
    position: relative !important;
    z-index: 4 !important;
    max-width: none !important;
    width: auto !important;
    margin: 430px 24px 0 !important;
    padding: 26px 24px 24px !important;
    background: rgba(44, 20, 10, 0.44) !important;
    border: 1px solid rgba(231, 189, 104, 0.28) !important;
    box-shadow: 0 18px 36px rgba(0,0,0,.22) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
  }

  .hero-copy > *,
  .hero-content > *,
  .hero-text > *,
  .hero-panel > * {
    position: relative !important;
    z-index: 5 !important;
  }

  .hero-copy h1,
  .hero-content h1,
  .hero-text h1,
  .hero-panel h1 {
    color: #fffdf9 !important;
    margin-bottom: 14px !important;
  }

  .hero-copy p,
  .hero-content p,
  .hero-text p,
  .hero-panel p,
  .hero-copy .hero-location,
  .hero-content .hero-location,
  .hero-text .hero-location,
  .hero-panel .hero-location {
    color: rgba(255,255,255,.92) !important;
  }

  .hero-copy .eyebrow,
  .hero-content .eyebrow,
  .hero-text .eyebrow,
  .hero-panel .eyebrow,
  .hero-copy .kicker,
  .hero-content .kicker,
  .hero-text .kicker,
  .hero-panel .kicker {
    color: #e7bd68 !important;
  }

  .hero-copy .btn,
  .hero-content .btn,
  .hero-text .btn,
  .hero-panel .btn,
  .hero-copy .hero-cta,
  .hero-content .hero-cta,
  .hero-text .hero-cta,
  .hero-panel .hero-cta {
    position: relative !important;
    z-index: 6 !important;
  }

  .hero-copy .btn-primary,
  .hero-content .btn-primary,
  .hero-text .btn-primary,
  .hero-panel .btn-primary,
  .hero-copy .btn-gold,
  .hero-content .btn-gold,
  .hero-text .btn-gold,
  .hero-panel .btn-gold,
  .hero-copy .btn-dark,
  .hero-content .btn-dark,
  .hero-text .btn-dark,
  .hero-panel .btn-dark {
    box-shadow: 0 0 0 1px rgba(255,255,255,.10), 0 0 24px rgba(231,189,104,.35) !important;
  }

  .hero-features,
  .hero-pills,
  .hero-highlights,
  .hero-trust,
  .hero-benefits {
    position: relative !important;
    z-index: 4 !important;
    margin: 18px 24px 28px !important;
  }

  .hero-copy + .hero-features,
  .hero-copy + .hero-pills,
  .hero-copy + .hero-highlights,
  .hero-copy + .hero-trust,
  .hero-copy + .hero-benefits {
    margin-top: 16px !important;
  }

  .hero-strip,
  .hero-bar,
  .announcement-bar {
    position: relative !important;
    z-index: 4 !important;
  }
}

@media (max-width: 680px) {

  .hero,
  .home-hero {
    padding-top: 104px !important;
  }

  .hero-grid,
  .hero-shell,
  .hero-inner,
  .hero-layout {
    min-height: 920px !important;
  }

  .hero-visual,
  .hero-media,
  .hero-image-wrap,
  .hero-image,
  .hero-art {
    height: 920px !important;
  }

  .hero-visual img,
  .hero-media img,
  .hero-image-wrap img,
  .hero-image img,
  .hero-art img {
    object-position: center 54% !important;
  }

  .hero-copy,
  .hero-content,
  .hero-text,
  .hero-panel {
    margin: 390px 18px 0 !important;
    padding: 22px 18px 20px !important;
  }

  .hero-features,
  .hero-pills,
  .hero-highlights,
  .hero-trust,
  .hero-benefits {
    margin: 14px 18px 22px !important;
  }
}

@media (max-width: 480px) {

  .hero-grid,
  .hero-shell,
  .hero-inner,
  .hero-layout {
    min-height: 880px !important;
  }

  .hero-visual,
  .hero-media,
  .hero-image-wrap,
  .hero-image,
  .hero-art {
    height: 880px !important;
  }

  .hero-copy,
  .hero-content,
  .hero-text,
  .hero-panel {
    margin: 370px 14px 0 !important;
    padding: 20px 16px 18px !important;
  }

  .hero-visual img,
  .hero-media img,
  .hero-image-wrap img,
  .hero-image img,
  .hero-art img {
    object-position: center 52% !important;
  }
}
