:root {
  color-scheme: light;

  --cream: #f8f1e8;
  --cream-light: #fffaf4;
  --sand: #e8d6c3;
  --taupe: #c9ab90;
  --bronze: #aa7e52;
  --bronze-dark: #83603e;
  --brown: #4a2d1d;
  --dark: #251813;
  --white: #ffffff;

  --page-bg: #fffaf4;
  --header-bg: rgba(255, 250, 244, 0.96);
  --hero-start: #fcf6ef;
  --hero-end: #eee0d1;
  --trust-bg: #fffaf5;
  --treatments-bg: #f4eadf;
  --payments-bg: #fffaf4;
  --faq-bg: #ead8c4;

  --surface: #fffaf4;
  --surface-card: #ffffff;
  --surface-soft: rgba(255, 255, 255, 0.68);
  --surface-social: rgba(255, 250, 244, 0.8);
  --surface-floating: rgba(255, 250, 244, 0.94);

  --heading: #4a2d1d;
  --text: #36261f;
  --muted: #79685f;

  --line: rgba(74, 45, 29, 0.13);
  --line-strong: rgba(74, 45, 29, 0.25);

  --input-bg: #ffffff;

  --shadow:
    0 24px 70px rgba(63, 39, 27, 0.12);

  --container:
    min(1020px, calc(100% - 48px));
}


/* DARK MODE */

html[data-theme="dark"] {
  color-scheme: dark;

  --page-bg: #140e0b;
  --header-bg: rgba(20, 14, 11, 0.95);

  --hero-start: #17100d;
  --hero-end: #2a1b14;

  --trust-bg: #1a120e;
  --treatments-bg: #1c130f;
  --payments-bg: #17100d;
  --faq-bg: #2a1d16;

  --surface: #1b130f;
  --surface-card: #211711;
  --surface-soft: rgba(255, 255, 255, 0.055);
  --surface-social: rgba(255, 255, 255, 0.045);
  --surface-floating: rgba(28, 19, 15, 0.95);

  --heading: #f3e6da;
  --text: #eee2d7;
  --muted: #b8a79b;

  --line: rgba(255, 236, 220, 0.11);
  --line-strong: rgba(255, 236, 220, 0.22);

  --input-bg: #211711;

  --shadow:
    0 24px 70px rgba(0, 0, 0, 0.3);
}


/* RESET */

* {
  box-sizing: border-box;
}


html {
  scroll-behavior: smooth;
}


body {
  margin: 0;

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

  color:
    var(--text);

  background:
    var(--page-bg);

  overflow-x: hidden;

  line-height: 1.6;

  transition:
    background-color 0.35s ease,
    color 0.35s ease;
}


body.modal-open {
  overflow: hidden;
}


img {
  display: block;
  max-width: 100%;
}


button,
input,
select,
textarea {
  font: inherit;
}


button {
  cursor: pointer;
}


a {
  color: inherit;
  text-decoration: none;
}


p,
h1,
h2,
h3,
h4 {
  margin-top: 0;
}


.container {
  width:
    var(--container);

  margin-inline:
    auto;
}


/* HEADER */

.site-header {
  position: sticky;

  top: 0;

  z-index: 1000;

  background:
    var(--header-bg);

  backdrop-filter:
    blur(20px);

  border-bottom:
    1px solid transparent;

  transition:
    background-color 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.3s ease;
}


.site-header.scrolled {
  box-shadow:
    0 12px 35px
    rgba(0, 0, 0, 0.09);

  border-color:
    var(--line);
}


.nav-container {
  min-height:
    76px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    24px;
}


/* LOGO */

.brand {
  width:
    150px;

  height:
    70px;

  flex-shrink:
    0;

  display:
    flex;

  align-items:
    center;

  overflow:
    hidden;
}


.brand-logo {
  width:
    150px;

  height:
    70px;

  display:
    block;

  object-fit:
    cover;

  object-position:
    center 48%;
}


/* NAVIGATION */

.main-nav {
  display:
    flex;

  align-items:
    center;

  gap:
    17px;
}


.nav-link {
  position:
    relative;

  padding:
    29px 0;

  border:
    0;

  background:
    transparent;

  font-size:
    9px;

  font-weight:
    600;

  color:
    var(--text);

  transition:
    color 0.3s ease;
}


.nav-link::after {
  content:
    "";

  position:
    absolute;

  left:
    0;

  right:
    0;

  bottom:
    21px;

  height:
    1px;

  background:
    var(--bronze);

  transform:
    scaleX(0);

  transform-origin:
    left;

  transition:
    0.25s ease;
}


.nav-link:hover::after,
.nav-link.active::after {
  transform:
    scaleX(1);
}


.nav-dropdown {
  position:
    relative;
}


.dropdown-menu {
  position:
    absolute;

  top:
    calc(100% - 8px);

  left:
    -20px;

  width:
    210px;

  padding:
    9px;

  background:
    var(--surface);

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

  border-radius:
    14px;

  box-shadow:
    var(--shadow);

  opacity:
    0;

  visibility:
    hidden;

  transform:
    translateY(8px);

  transition:
    0.25s ease;
}


.nav-dropdown:hover
.dropdown-menu,

.nav-dropdown.open
.dropdown-menu {
  opacity:
    1;

  visibility:
    visible;

  transform:
    translateY(0);
}


.dropdown-menu a {
  display:
    block;

  padding:
    10px 11px;

  border-radius:
    9px;

  font-size:
    10px;

  color:
    var(--muted);
}


.dropdown-menu a:hover {
  background:
    var(--surface-soft);

  color:
    var(--text);
}


.nav-book {
  padding:
    10px 15px;

  background:
    var(--brown);

  color:
    white;

  border-radius:
    999px;

  font-size:
    9px;

  font-weight:
    600;
}


html[data-theme="dark"]
.nav-book {
  background:
    var(--bronze);

  color:
    #1c110b;
}


/* THEME TOGGLE */

.theme-toggle {
  position:
    relative;

  width:
    38px;

  height:
    38px;

  flex-shrink:
    0;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    50%;

  background:
    var(--surface-soft);

  color:
    var(--text);

  overflow:
    hidden;

  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease,
    transform 0.25s ease;
}


.theme-toggle:hover {
  transform:
    translateY(-2px);

  border-color:
    var(--bronze);
}


.theme-sun,
.theme-moon {
  position:
    absolute;

  display:
    grid;

  place-items:
    center;

  font-size:
    17px;

  line-height:
    1;

  transition:
    opacity 0.25s ease,
    transform 0.3s ease;
}


.theme-sun {
  opacity:
    0;

  transform:
    rotate(-90deg)
    scale(0.5);
}


.theme-moon {
  opacity:
    1;

  transform:
    rotate(0)
    scale(1);
}


html[data-theme="dark"]
.theme-sun {
  opacity:
    1;

  transform:
    rotate(0)
    scale(1);
}


html[data-theme="dark"]
.theme-moon {
  opacity:
    0;

  transform:
    rotate(90deg)
    scale(0.5);
}


/* MOBILE MENU */

.menu-toggle {
  display:
    none;

  border:
    0;

  background:
    transparent;
}


.menu-toggle span {
  display:
    block;

  width:
    28px;

  height:
    1.5px;

  margin:
    5px 0;

  background:
    var(--text);
}


/* GENERAL */

.section {
  padding:
    90px 0;
}


.section-eyebrow {
  display:
    inline-block;

  margin-bottom:
    13px;

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    0.21em;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.section-eyebrow {
  color:
    #d2aa82;
}


.section-eyebrow.light {
  color:
    #dab998;
}


h1,
h2,
h3 {
  font-family:
    "Cormorant Garamond",
    serif;

  font-weight:
    500;

  color:
    var(--heading);
}


h2 {
  font-size:
    clamp(
      39px,
      4.2vw,
      59px
    );

  line-height:
    0.99;

  letter-spacing:
    -0.035em;
}


h2 em {
  color:
    var(--bronze);
}


.section-header {
  display:
    grid;

  grid-template-columns:
    1.25fr 0.75fr;

  gap:
    42px;

  align-items:
    end;

  margin-bottom:
    44px;
}


.section-header p {
  max-width:
    370px;

  font-size:
    11px;

  color:
    var(--muted);
}


/* BUTTONS */

.button {
  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  min-height:
    41px;

  padding:
    0 19px;

  border:
    1px solid transparent;

  border-radius:
    999px;

  font-size:
    9px;

  font-weight:
    700;

  transition:
    0.25s ease;
}


.button:hover {
  transform:
    translateY(-2px);
}


.button-primary {
  background:
    var(--bronze);

  color:
    white;
}


.button-secondary {
  border-color:
    var(--line-strong);

  color:
    var(--text);
}


.button-dark {
  background:
    var(--brown);

  color:
    white;
}


html[data-theme="dark"]
.button-dark {
  background:
    var(--bronze);

  color:
    #1d120c;
}


/* HERO */

.hero {
  background:
    linear-gradient(
      120deg,
      var(--hero-start),
      var(--hero-end)
    );

  overflow:
    hidden;

  transition:
    background 0.35s ease;
}


.hero-grid {
  height:
    537px;

  display:
    grid;

  grid-template-columns:
    0.94fr 1.06fr;

  gap:
    44px;

  align-items:
    center;
}


.hero-copy {
  padding:
    20px 0 14px;
}


.hero-overline {
  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  font-size:
    7px;

  letter-spacing:
    0.18em;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.hero-overline {
  color:
    #d0a57d;
}


.hero-overline span {
  width:
    29px;

  height:
    1px;

  background:
    var(--bronze);
}


.hero h1 {
  font-size:
    clamp(
      62px,
      5.7vw,
      82px
    );

  line-height:
    0.84;

  letter-spacing:
    -0.04em;

  margin:
    20px 0 21px;
}


.hero h1 em {
  color:
    var(--bronze);
}


.hero-description {
  max-width:
    460px;

  margin-bottom:
    0;

  font-size:
    12.5px;

  line-height:
    1.65;

  color:
    var(--muted);
}


.hero-actions {
  display:
    flex;

  gap:
    10px;

  margin:
    23px 0 25px;
}


.hero-contact {
  display:
    flex;

  gap:
    42px;
}


.hero-contact div {
  display:
    flex;

  flex-direction:
    column;
}


.hero-contact span {
  margin-bottom:
    4px;

  font-size:
    6px;

  letter-spacing:
    0.18em;

  color:
    var(--muted);
}


.hero-contact a,
.hero-contact strong {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    17px;

  font-weight:
    600;

  color:
    var(--heading);
}


/* SOCIAL */

.hero-social {
  margin-top:
    20px;

  padding-top:
    17px;

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


.hero-social-label {
  display:
    block;

  margin-bottom:
    10px;

  font-size:
    7.5px;

  font-weight:
    700;

  letter-spacing:
    0.18em;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.hero-social-label {
  color:
    #d0a57d;
}


.hero-social-buttons {
  display:
    grid;

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

  gap:
    9px;
}


.hero-social-button {
  min-height:
    52px;

  padding:
    7px 13px 7px 7px;

  display:
    flex;

  align-items:
    center;

  gap:
    10px;

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

  border-radius:
    999px;

  background:
    var(--surface-social);

  color:
    var(--text);

  font-size:
    10px;

  font-weight:
    700;

  transition:
    0.3s ease;
}


.hero-social-name {
  font-size:
    10px;

  font-weight:
    700;

  line-height:
    1;
}


.hero-social-button:hover {
  transform:
    translateY(-3px);

  background:
    var(--brown);

  color:
    white;

  border-color:
    var(--brown);

  box-shadow:
    0 14px 30px
    rgba(74, 45, 29, 0.13);
}


html[data-theme="dark"]
.hero-social-button:hover {
  background:
    var(--bronze);

  color:
    #1d120c;

  border-color:
    var(--bronze);
}


.hero-social-icon {
  width:
    37px;

  height:
    37px;

  min-width:
    37px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  background:
    #ead8c4;

  color:
    var(--brown);
}


html[data-theme="dark"]
.hero-social-icon {
  background:
    rgba(201, 154, 105, 0.18);

  color:
    #ddb68e;
}


.hero-social-icon svg {
  width:
    18px;

  height:
    18px;

  fill:
    currentColor;

  stroke:
    currentColor;

  stroke-width:
    1.4;
}


.hero-social-button.instagram
.hero-social-icon svg {
  fill:
    none;
}


.hero-social-button.instagram
.instagram-dot {
  fill:
    currentColor;

  stroke:
    none;
}


/* HERO IMAGE */

.hero-visual {
  position:
    relative;

  height:
    537px;
}


.hero-photo {
  position:
    absolute;

  inset:
    0;

  border-radius:
    255px 255px 0 0;

  background:
    url("MANILAAES.jpg")
    92% center / cover
    no-repeat;

  box-shadow:
    var(--shadow);
}


.hero-floating-card {
  position:
    absolute;

  left:
    -20px;

  bottom:
    28px;

  width:
    205px;

  padding:
    19px;

  background:
    var(--surface-floating);

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

  border-radius:
    16px;

  box-shadow:
    var(--shadow);

  color:
    var(--text);

  backdrop-filter:
    blur(14px);
}


.hero-floating-card span {
  font-size:
    6px;

  letter-spacing:
    0.19em;
}


.hero-floating-card strong {
  display:
    block;

  margin:
    7px 0 12px;

  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    18px;

  color:
    var(--heading);
}


.hero-floating-card a {
  font-size:
    8px;
}


/* TRUST */

.trust-strip {
  background:
    var(--trust-bg);

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

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

  transition:
    background-color 0.35s ease;
}


.trust-grid {
  display:
    grid;

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


.trust-grid article {
  min-height:
    72px;

  display:
    flex;

  align-items:
    center;

  gap:
    12px;

  padding:
    13px 18px;

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


.trust-grid article:last-child {
  border-right:
    0;
}


.trust-number {
  flex-shrink:
    0;

  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    22px;

  color:
    var(--taupe);
}


.trust-grid strong {
  display:
    block;

  margin-bottom:
    1px;

  font-size:
    9px;

  color:
    var(--text);
}


.trust-grid p {
  margin:
    0;

  white-space:
    nowrap;

  font-size:
    6.7px;

  color:
    var(--muted);
}


/* CONTACT */

.contact-section {
  position:
    relative;

  background:
    var(--brown);

  color:
    #f9efe5;

  overflow:
    hidden;
}


html[data-theme="dark"]
.contact-section {
  background:
    #22150f;
}


.contact-section .container {
  position:
    relative;

  z-index:
    1;
}


.contact-main {
  display:
    grid;

  grid-template-columns:
    0.85fr 1.15fr;

  gap:
    52px;

  align-items:
    center;
}


.contact-information {
  padding:
    20px 12px 20px 0;
}


.contact-section
.section-eyebrow {
  color:
    #d4a979;
}


.contact-section h2 {
  color:
    #fff8f1;
}


.contact-section h2 em {
  color:
    #d7a773;
}


.contact-address {
  max-width:
    420px;

  font-size:
    11px;

  color:
    rgba(255, 247, 239, 0.68);
}


.contact-details {
  display:
    grid;

  gap:
    15px;

  margin:
    25px 0;

  padding:
    22px 0;

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

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


.contact-details div {
  display:
    flex;

  flex-direction:
    column;
}


.contact-details small {
  margin-bottom:
    3px;

  font-size:
    6px;

  letter-spacing:
    0.18em;

  color:
    #d6ad84;
}


.contact-details a,
.contact-details strong {
  font-size:
    11px;

  color:
    #fff8f1;
}


.contact-details span {
  font-size:
    10px;

  color:
    rgba(255, 248, 241, 0.7);
}


.contact-directions-button {
  min-width:
    135px;

  background:
    #f7eadc;

  color:
    var(--brown);

  border:
    1px solid
    #f7eadc;
}


/* MAP */

.clinic-map-card {
  position:
    relative;

  min-height:
    485px;

  overflow:
    hidden;

  border:
    1px solid
    rgba(255, 255, 255, 0.12);

  border-radius:
    185px 185px 18px 18px;

  box-shadow:
    0 28px 60px
    rgba(17, 9, 5, 0.28);

  isolation:
    isolate;

  transition:
    0.35s ease;
}


.clinic-map-card:hover {
  transform:
    translateY(-6px);
}


.clinic-map-card img {
  position:
    absolute;

  inset:
    0;

  width:
    100%;

  height:
    100%;

  object-fit:
    cover;

  z-index:
    -2;

  transition:
    transform 0.8s ease;
}


.clinic-map-card:hover img {
  transform:
    scale(1.04);
}


.clinic-map-shade {
  position:
    absolute;

  inset:
    0;

  z-index:
    -1;

  background:
    linear-gradient(
      to bottom,
      rgba(34, 18, 11, 0.04) 20%,
      rgba(34, 18, 11, 0.12) 42%,
      rgba(30, 18, 12, 0.78) 100%
    );
}


.clinic-map-top {
  position:
    absolute;

  top:
    28px;

  left:
    30px;

  right:
    30px;

  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  color:
    white;
}


.clinic-map-top > span:first-child {
  padding:
    7px 10px;

  border-radius:
    999px;

  background:
    rgba(66, 36, 23, 0.55);

  font-size:
    7px;

  font-weight:
    700;
}


.clinic-map-icon {
  width:
    38px;

  height:
    38px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  background:
    rgba(255, 250, 244, 0.94);

  color:
    var(--brown);
}


.clinic-map-bottom {
  position:
    absolute;

  left:
    32px;

  right:
    32px;

  bottom:
    30px;

  color:
    white;
}


.clinic-map-bottom small {
  display:
    block;

  margin-bottom:
    4px;

  font-size:
    6px;
}


.clinic-map-bottom strong {
  display:
    block;

  margin-bottom:
    3px;

  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    39px;

  font-weight:
    500;

  line-height:
    1;
}


.clinic-map-bottom span {
  font-size:
    9px;
}


/* TREATMENTS */

.treatments-section {
  background:
    var(--treatments-bg);

  transition:
    background-color 0.35s ease;
}


.service-filters {
  display:
    flex;

  gap:
    7px;

  flex-wrap:
    wrap;

  margin-bottom:
    25px;
}


.service-filter {
  padding:
    7px 13px;

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

  border-radius:
    999px;

  background:
    var(--surface-soft);

  color:
    var(--muted);

  font-size:
    8px;
}


.service-filter:hover,
.service-filter.active {
  background:
    var(--brown);

  color:
    white;
}


html[data-theme="dark"]
.service-filter:hover,

html[data-theme="dark"]
.service-filter.active {
  background:
    var(--bronze);

  color:
    #1b110b;
}


.services-grid {
  display:
    grid;

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

  gap:
    12px;
}


.service-card {
  min-height:
    265px;

  padding:
    20px;

  display:
    flex;

  flex-direction:
    column;

  text-align:
    left;

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

  border-radius:
    17px;

  background:
    var(--surface-soft);

  color:
    var(--text);

  transition:
    0.32s ease;
}


.service-card:hover {
  transform:
    translateY(-7px);

  background:
    var(--brown);

  color:
    white;

  border-color:
    var(--brown);
}


.service-card-top {
  display:
    flex;

  justify-content:
    space-between;

  font-size:
    6px;

  letter-spacing:
    0.15em;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.service-card-top {
  color:
    #d0a57d;
}


.service-card:hover
.service-card-top {
  color:
    #e0bd9b;
}


.service-card h3 {
  margin:
    42px 0 10px;

  font-size:
    25px;
}


.service-card:hover h3 {
  color:
    white;
}


.service-card p {
  font-size:
    9px;

  color:
    var(--muted);
}


.service-card:hover p {
  color:
    rgba(255, 255, 255, 0.7);
}


.service-card-bottom {
  margin-top:
    auto;

  padding-top:
    16px;

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

  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;
}


.service-card-bottom strong {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    19px;

  color:
    var(--heading);
}


.service-card:hover
.service-card-bottom strong {
  color:
    white;
}


.service-view {
  font-size:
    8px;

  font-weight:
    700;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.service-view {
  color:
    #d0a57d;
}


.service-card:hover
.service-view {
  color:
    #efcfaf;
}


/* COMPLETE MENU BUTTON */

.center-button {
  display:
    flex;

  justify-content:
    center;

  margin-top:
    40px;
}


.complete-menu-button {
  width:
    min(440px, 100%);

  min-height:
    74px;

  padding:
    13px 20px 13px 27px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    20px;

  border:
    0;

  border-radius:
    999px;

  background:
    var(--brown);

  color:
    white;

  text-align:
    left;

  box-shadow:
    0 16px 36px
    rgba(74, 45, 29, 0.14);

  transition:
    0.3s ease;
}


html[data-theme="dark"]
.complete-menu-button {
  background:
    #5c3824;
}


.complete-menu-button:hover {
  transform:
    translateY(-3px);

  box-shadow:
    0 22px 45px
    rgba(74, 45, 29, 0.22);
}


.complete-menu-copy {
  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;

  justify-content:
    center;
}


.complete-menu-copy > span {
  margin-bottom:
    3px;

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

  font-size:
    7px;

  font-weight:
    600;

  line-height:
    1;

  letter-spacing:
    0.16em;

  color:
    #d5ae88;
}


.complete-menu-copy strong {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    25px;

  font-weight:
    600;

  line-height:
    1.05;

  color:
    #fffaf5;
}


.complete-menu-arrow {
  width:
    43px;

  height:
    43px;

  flex-shrink:
    0;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  background:
    rgba(255, 255, 255, 0.11);

  font-size:
    15px;

  color:
    white;

  transition:
    0.3s ease;
}


.complete-menu-button:hover
.complete-menu-arrow {
  transform:
    translateX(3px);

  background:
    rgba(255, 255, 255, 0.17);
}


/* PROMOTIONS */

.promo-section {
  background:
    var(--brown);

  color:
    white;

  overflow:
    hidden;
}


html[data-theme="dark"]
.promo-section {
  background:
    #1f130e;
}


.promo-heading h2 {
  color:
    white;
}


.promo-heading h2 em {
  color:
    #d8aa7b;
}


.promo-heading p {
  color:
    rgba(255, 255, 255, 0.65);
}


.promo-controls {
  display:
    flex;

  justify-content:
    flex-end;

  gap:
    7px;

  margin-bottom:
    15px;
}


.promo-controls button {
  width:
    37px;

  height:
    37px;

  border-radius:
    50%;

  border:
    1px solid
    rgba(255, 255, 255, 0.18);

  background:
    transparent;

  color:
    white;
}


.promo-track {
  display:
    flex;

  gap:
    15px;

  overflow-x:
    auto;

  scrollbar-width:
    none;

  scroll-behavior:
    smooth;
}


.promo-track::-webkit-scrollbar {
  display:
    none;
}


.promo-card {
  flex:
    0 0
    calc((100% - 30px) / 3);

  border:
    0;

  padding:
    0;

  border-radius:
    16px;

  overflow:
    hidden;

  aspect-ratio:
    1 / 1.2;

  background:
    #321e14;
}


.promo-card img {
  width:
    100%;

  height:
    100%;

  object-fit:
    cover;
}


/* PAYMENTS */

.payments-section {
  background:
    var(--payments-bg);

  transition:
    background-color 0.35s ease;
}


.card-payment-layout {
  display:
    grid;

  grid-template-columns:
    1.4fr 0.6fr;

  gap:
    18px;
}


.accepted-cards {
  position:
    relative;

  min-height:
    420px;

  padding:
    0;

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

  border-radius:
    19px;

  overflow:
    hidden;

  background:
    var(--surface-card);
}


.accepted-cards img {
  width:
    100%;

  height:
    100%;

  min-height:
    420px;

  object-fit:
    contain;
}


.accepted-cards-hover {
  position:
    absolute;

  left:
    17px;

  right:
    17px;

  bottom:
    17px;

  padding:
    10px 14px;

  display:
    flex;

  justify-content:
    space-between;

  border-radius:
    999px;

  background:
    rgba(43, 25, 18, 0.84);

  color:
    white;

  opacity:
    0;

  transition:
    0.25s ease;

  font-size:
    8px;
}


.accepted-cards:hover
.accepted-cards-hover {
  opacity:
    1;
}


.qr-payment-grid {
  display:
    grid;

  gap:
    12px;
}


.payment-option {
  width:
    100%;

  min-height:
    120px;

  padding:
    18px;

  display:
    grid;

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

  gap:
    14px;

  align-items:
    center;

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

  border-radius:
    16px;

  background:
    var(--surface-card);

  color:
    var(--text);

  text-align:
    left;

  transition:
    0.3s ease;
}


.payment-option:hover {
  transform:
    translateY(-4px);
}


.payment-symbol {
  width:
    40px;

  height:
    40px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  background:
    var(--brown);

  color:
    white;

  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    19px;
}


html[data-theme="dark"]
.payment-symbol {
  background:
    var(--bronze);

  color:
    #1e130c;
}


.payment-copy {
  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;

  gap:
    3px;
}


.payment-copy small {
  font-size:
    6px;

  letter-spacing:
    0.15em;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.payment-copy small {
  color:
    #d0a57d;
}


.payment-copy strong {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    22px;

  line-height:
    1;

  font-weight:
    500;

  color:
    var(--heading);
}


.payment-arrow {
  color:
    var(--text);
}


/* FAQ */

.faq-section {
  background:
    var(--faq-bg);

  transition:
    background-color 0.35s ease;
}


.faq-layout {
  display:
    grid;

  grid-template-columns:
    0.8fr 1.2fr;

  gap:
    72px;
}


.faq-intro {
  position:
    sticky;

  top:
    110px;

  align-self:
    start;
}


.faq-intro p {
  color:
    var(--muted);
}


.faq-list {
  border-top:
    1px solid
    var(--line);
}


.faq-item {
  border-bottom:
    1px solid
    var(--line);
}


.faq-question {
  width:
    100%;

  min-height:
    78px;

  padding:
    21px 4px;

  border:
    0;

  background:
    transparent;

  color:
    var(--text);

  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  gap:
    28px;

  text-align:
    left;
}


.faq-question > span:first-child {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    23px;
}


.faq-icon {
  width:
    34px;

  height:
    34px;

  display:
    grid;

  place-items:
    center;

  flex-shrink:
    0;

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

  border-radius:
    50%;
}


.faq-item.active
.faq-icon {
  transform:
    rotate(45deg);

  background:
    var(--brown);

  color:
    white;
}


html[data-theme="dark"]
.faq-item.active
.faq-icon {
  background:
    var(--bronze);

  color:
    #1e130c;
}


.faq-answer {
  display:
    grid;

  grid-template-rows:
    0fr;

  transition:
    0.35s ease;
}


.faq-answer > div {
  overflow:
    hidden;
}


.faq-item.active
.faq-answer {
  grid-template-rows:
    1fr;
}


.faq-answer p {
  margin:
    0 60px 23px 0;

  font-size:
    10px;

  color:
    var(--muted);
}


/* BOOKING */

.booking-section {
  padding:
    90px 0;

  background:
    linear-gradient(
      rgba(38, 23, 17, 0.94),
      rgba(38, 23, 17, 0.96)
    ),
    url("MANILAAES.jpg");

  background-size:
    cover;

  background-position:
    center;

  color:
    white;
}


html[data-theme="dark"]
.booking-section {
  background:
    linear-gradient(
      rgba(15, 9, 6, 0.94),
      rgba(15, 9, 6, 0.97)
    ),
    url("MANILAAES.jpg");

  background-size:
    cover;

  background-position:
    center;
}


.booking-grid {
  display:
    grid;

  grid-template-columns:
    0.9fr 1.1fr;

  gap:
    60px;

  align-items:
    center;
}


.booking-intro h2 {
  color:
    white;
}


.booking-intro h2 em {
  color:
    #d9aa7b;
}


.booking-intro > p {
  font-size:
    11px;

  color:
    rgba(255, 255, 255, 0.67);
}


.booking-contact {
  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    40px;

  margin-top:
    31px;
}


.booking-number {
  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;
}


.booking-number small {
  display:
    block;

  margin-bottom:
    6px;

  font-size:
    6px;

  font-weight:
    600;

  letter-spacing:
    0.16em;

  color:
    #cfa478;
}


.booking-number a {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    22px;

  color:
    white;
}


.booking-form {
  padding:
    26px;

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

  border-radius:
    19px;

  background:
    var(--surface);

  color:
    var(--text);

  box-shadow:
    0 22px 60px
    rgba(0, 0, 0, 0.14);
}


.form-grid {
  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    13px;
}


.booking-form label {
  display:
    grid;

  gap:
    6px;

  margin-bottom:
    13px;

  font-size:
    9px;

  font-weight:
    600;

  color:
    var(--text);
}


.booking-form input,
.booking-form select,
.booking-form textarea {
  width:
    100%;

  padding:
    11px 12px;

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

  border-radius:
    9px;

  background:
    var(--input-bg);

  color:
    var(--text);

  font-size:
    10px;

  outline:
    none;

  transition:
    0.2s ease;
}


.booking-form input::placeholder,
.booking-form textarea::placeholder {
  color:
    var(--muted);
}


.booking-form input:focus,
.booking-form select:focus,
.booking-form textarea:focus {
  border-color:
    var(--bronze);

  box-shadow:
    0 0 0 3px
    rgba(170, 126, 82, 0.08);
}


.booking-form textarea {
  resize:
    vertical;
}


/* BOOKING CHANNELS */

.booking-options {
  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    11px;

  margin-top:
    16px;
}


.booking-channel {
  width:
    100%;

  min-height:
    72px;

  padding:
    10px 13px 10px 10px;

  display:
    grid;

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

  gap:
    11px;

  align-items:
    center;

  border:
    0;

  border-radius:
    16px;

  text-align:
    left;

  transition:
    0.28s ease;
}


.booking-channel:hover {
  transform:
    translateY(-3px);
}


.booking-messenger {
  background:
    #4a2d1d;

  color:
    white;
}


.booking-whatsapp {
  background:
    #b48656;

  color:
    white;
}


html[data-theme="dark"]
.booking-messenger {
  background:
    #4e3021;
}


html[data-theme="dark"]
.booking-whatsapp {
  background:
    #9a6f45;
}


.booking-channel-icon {
  width:
    42px;

  height:
    42px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  font-size:
    10px;

  font-weight:
    700;
}


.messenger-icon {
  background:
    #168aff;

  color:
    white;

  font-size:
    14px;
}


.whatsapp-icon {
  background:
    #25d366;

  color:
    white;
}


.booking-channel-copy {
  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;
}


.booking-channel-copy small {
  margin-bottom:
    2px;

  font-size:
    5.8px;

  line-height:
    1;

  letter-spacing:
    0.13em;

  opacity:
    0.72;
}


.booking-channel-copy strong {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    18px;

  line-height:
    1;

  font-weight:
    600;
}


.booking-channel-arrow {
  font-size:
    14px;
}


.booking-channel-help {
  margin-top:
    11px;

  padding:
    0 4px;
}


.booking-channel-help p {
  margin:
    5px 0 0;

  font-size:
    6.8px;

  line-height:
    1.55;

  color:
    var(--muted);
}


.booking-channel-help strong {
  color:
    var(--heading);
}


/* FOOTER */

.site-footer {
  padding:
    62px 0 23px;

  background:
    var(--dark);

  color:
    rgba(255, 255, 255, 0.64);
}


html[data-theme="dark"]
.site-footer {
  background:
    #0d0806;
}


.footer-grid {
  display:
    grid;

  grid-template-columns:
    2fr 1fr 1fr 1fr;

  gap:
    40px;
}


.footer-m {
  font-family:
    "Cormorant Garamond",
    serif;

  font-size:
    65px;

  line-height:
    0.8;

  color:
    #c59869;
}


.footer-brand {
  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;
}


.footer-brand strong {
  color:
    white;

  font-size:
    10px;
}


.footer-brand span,
.footer-brand p,
.footer-links {
  font-size:
    9px;
}


.footer-links {
  display:
    flex;

  flex-direction:
    column;

  gap:
    8px;
}


.footer-links h4 {
  color:
    white;
}


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

  padding-top:
    17px;

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

  display:
    flex;

  justify-content:
    space-between;

  gap:
    20px;

  font-size:
    8px;
}


/* FLOATING MESSENGER */

.floating-messenger {
  position:
    fixed;

  right:
    17px;

  bottom:
    17px;

  z-index:
    900;

  border:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    9px;

  padding:
    7px 15px 7px 7px;

  border-radius:
    999px;

  background:
    var(--brown);

  color:
    white;

  font-size:
    10px;

  box-shadow:
    0 15px 35px
    rgba(74, 45, 29, 0.2);

  transition:
    0.25s ease;
}


html[data-theme="dark"]
.floating-messenger {
  background:
    #5c3824;
}


.floating-messenger:hover {
  transform:
    translateY(-3px);
}


.messenger-bubble {
  width:
    32px;

  height:
    32px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  background:
    #168aff;

  color:
    white;

  font-weight:
    700;

  font-size:
    13px;
}


.mobile-booking {
  display:
    none;
}


/* TOAST */

.copy-toast {
  position:
    fixed;

  left:
    50%;

  bottom:
    28px;

  z-index:
    5000;

  width:
    min(430px, calc(100% - 30px));

  transform:
    translate(-50%, 120px);

  opacity:
    0;

  visibility:
    hidden;

  padding:
    14px 18px;

  display:
    flex;

  align-items:
    center;

  gap:
    12px;

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

  border-radius:
    16px;

  background:
    var(--surface);

  color:
    var(--text);

  box-shadow:
    0 24px 70px
    rgba(35, 21, 15, 0.25);

  transition:
    0.35s ease;
}


.copy-toast.show {
  transform:
    translate(-50%, 0);

  opacity:
    1;

  visibility:
    visible;
}


.copy-toast-icon {
  width:
    35px;

  height:
    35px;

  min-width:
    35px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    50%;

  background:
    var(--brown);

  color:
    white;

  font-weight:
    700;
}


.copy-toast div {
  display:
    flex;

  flex-direction:
    column;
}


.copy-toast strong {
  font-size:
    10px;
}


.copy-toast div span {
  margin-top:
    2px;

  font-size:
    8px;

  color:
    var(--muted);
}


/* IMAGE MODAL */

.image-modal {
  position:
    fixed;

  inset:
    0;

  z-index:
    3000;

  display:
    none;

  align-items:
    center;

  justify-content:
    center;

  padding:
    20px;
}


.image-modal.open {
  display:
    flex;
}


.modal-overlay {
  position:
    absolute;

  inset:
    0;

  background:
    rgba(12, 7, 5, 0.92);
}


.image-modal-content {
  position:
    relative;

  z-index:
    1;

  width:
    min(1000px, 96vw);

  max-height:
    96vh;

  padding:
    17px;

  overflow-y:
    auto;

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

  border-radius:
    18px;

  background:
    var(--surface);
}


.modal-heading {
  padding-right:
    50px;
}


.modal-heading span {
  font-size:
    8px;

  letter-spacing:
    0.17em;

  color:
    var(--bronze);
}


.modal-heading h3 {
  margin:
    4px 0 12px;

  font-size:
    28px;
}


.image-modal-content img {
  width:
    100%;

  max-height:
    calc(96vh - 110px);

  object-fit:
    contain;
}


.modal-close {
  position:
    absolute;

  right:
    22px;

  top:
    20px;

  width:
    34px;

  height:
    34px;

  border:
    0;

  border-radius:
    50%;

  background:
    var(--brown);

  color:
    white;
}


/* SERVICE MENU MODAL */

.menu-modal {
  position:
    fixed;

  inset:
    0;

  z-index:
    3100;

  display:
    none;
}


.menu-modal.open {
  display:
    block;
}


.menu-modal-overlay {
  position:
    absolute;

  inset:
    0;

  background:
    rgba(12, 7, 5, 0.9);
}


.menu-modal-panel {
  position:
    absolute;

  top:
    3vh;

  bottom:
    3vh;

  left:
    50%;

  transform:
    translateX(-50%);

  width:
    min(920px, 94vw);

  padding:
    27px;

  overflow-y:
    auto;

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

  border-radius:
    21px;

  background:
    var(--surface);

  color:
    var(--text);
}


.menu-modal-header {
  display:
    flex;

  justify-content:
    space-between;

  align-items:
    flex-start;
}


.menu-modal-header span {
  font-size:
    7px;

  letter-spacing:
    0.17em;

  color:
    var(--bronze);
}


.menu-modal-header h2 {
  margin:
    7px 0 0;
}


.menu-modal-header button {
  width:
    37px;

  height:
    37px;

  border:
    0;

  border-radius:
    50%;

  background:
    var(--brown);

  color:
    white;
}


.full-menu-content {
  display:
    grid;

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

  gap:
    17px;

  padding:
    25px 0;
}


.menu-category {
  padding:
    20px;

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

  border-radius:
    14px;

  background:
    var(--surface-soft);
}


.menu-category h3 {
  margin-bottom:
    15px;

  font-size:
    24px;
}


.menu-item {
  padding:
    8px 0;

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


.menu-item:last-child {
  border-bottom:
    0;
}


.menu-item-main {
  display:
    grid;

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

  gap:
    12px;

  align-items:
    start;
}


.menu-item-name {
  font-size:
    9px;

  font-weight:
    600;

  color:
    var(--text);
}


.menu-item-price {
  white-space:
    nowrap;

  font-size:
    9px;

  font-weight:
    700;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.menu-item-price {
  color:
    #d0a57d;
}


.menu-item-extra {
  margin-top:
    4px;

  text-align:
    right;

  font-size:
    8px;

  font-weight:
    700;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.menu-item-extra {
  color:
    #d0a57d;
}


.menu-item-details {
  margin:
    6px 0 0;

  padding-left:
    15px;

  font-size:
    8px;

  line-height:
    1.65;

  color:
    var(--muted);
}


.menu-item-details li {
  margin:
    1px 0;
}


.menu-note-only {
  padding:
    7px 0;

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

  text-align:
    right;

  font-size:
    8px;

  font-weight:
    700;

  color:
    var(--bronze-dark);
}


html[data-theme="dark"]
.menu-note-only {
  color:
    #d0a57d;
}


/* REVEAL */

.reveal {
  opacity:
    0;

  transform:
    translateY(22px);

  transition:
    opacity 0.75s ease,
    transform 0.75s ease;
}


.reveal.visible {
  opacity:
    1;

  transform:
    translateY(0);
}


/* SHORT LAPTOP */

@media
(min-width: 901px)
and
(max-height: 850px) {

  .nav-container {
    min-height:
      72px;
  }


  .brand {
    width:
      142px;

    height:
      66px;
  }


  .brand-logo {
    width:
      142px;

    height:
      66px;
  }


  .hero-grid,
  .hero-visual {
    height:
      507px;
  }


  .hero h1 {
    font-size:
      clamp(
        59px,
        5.35vw,
        78px
      );

    margin:
      17px 0 18px;
  }


  .hero-actions {
    margin:
      20px 0 21px;
  }


  .hero-social {
    margin-top:
      17px;

    padding-top:
      15px;
  }


  .hero-social-button {
    min-height:
      49px;
  }


  .hero-floating-card {
    bottom:
      22px;
  }


  .trust-grid article {
    min-height:
      68px;

    padding:
      11px 17px;
  }

}


/* MEDIUM */

@media (max-width: 1100px) {

  :root {
    --container:
      min(960px, calc(100% - 40px));
  }


  .main-nav {
    gap:
      13px;
  }


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


  .card-payment-layout {
    grid-template-columns:
      1fr;
  }

}


/* TABLET */

@media (max-width: 900px) {

  .nav-container {
    min-height:
      70px;
  }


  .brand {
    width:
      128px;

    height:
      62px;
  }


  .brand-logo {
    width:
      128px;

    height:
      62px;
  }


  .menu-toggle {
    display:
      block;
  }


  .main-nav {
    position:
      fixed;

    top:
      70px;

    left:
      14px;

    right:
      14px;

    display:
      none;

    flex-direction:
      column;

    align-items:
      stretch;

    gap:
      0;

    padding:
      16px;

    background:
      var(--surface);

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

    border-radius:
      18px;

    box-shadow:
      var(--shadow);
  }


  .main-nav.open {
    display:
      flex;
  }


  .main-nav .nav-link {
    width:
      100%;

    padding:
      13px;

    text-align:
      left;
  }


  .main-nav
  .nav-link::after {
    display:
      none;
  }


  .nav-book {
    margin-top:
      8px;

    text-align:
      center;
  }


  .theme-toggle {
    margin:
      12px auto 0;
  }


  .dropdown-menu {
    position:
      static;

    width:
      100%;

    display:
      none;

    opacity:
      1;

    visibility:
      visible;

    transform:
      none;

    box-shadow:
      none;
  }


  .nav-dropdown.open
  .dropdown-menu {
    display:
      block;
  }


  .hero-grid {
    height:
      auto;

    grid-template-columns:
      1fr;

    padding-top:
      20px;
  }


  .hero-visual {
    height:
      580px;
  }


  .contact-main,
  .faq-layout,
  .booking-grid {
    grid-template-columns:
      1fr;
  }


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


  .trust-grid p {
    white-space:
      normal;
  }


  .faq-intro {
    position:
      static;
  }


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


  .full-menu-content {
    grid-template-columns:
      1fr;
  }

}


/* MOBILE */

@media (max-width: 640px) {

  :root {
    --container:
      min(100% - 28px, 1200px);
  }


  body {
    padding-bottom:
      62px;
  }


  .section {
    padding:
      70px 0;
  }


  .nav-container {
    min-height:
      66px;
  }


  .brand {
    width:
      108px;

    height:
      56px;
  }


  .brand-logo {
    width:
      108px;

    height:
      56px;

    object-position:
      center 48%;
  }


  .hero-copy {
    padding:
      33px 0;
  }


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


  .hero-description {
    font-size:
      14px;
  }


  .hero-actions {
    display:
      grid;
  }


  .hero-contact {
    display:
      grid;

    gap:
      16px;
  }


  .hero-contact a,
  .hero-contact strong {
    font-size:
      20px;
  }


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


  .hero-social-button {
    min-height:
      68px;

    font-size:
      13px;

    gap:
      12px;
  }


  .hero-social-name {
    font-size:
      13px;
  }


  .hero-social-icon {
    width:
      45px;

    height:
      45px;

    min-width:
      45px;
  }


  .hero-social-icon svg {
    width:
      21px;

    height:
      21px;
  }


  .hero-visual {
    height:
      500px;
  }


  .hero-photo {
    border-radius:
      165px
      165px
      20px
      20px;
  }


  .hero-floating-card {
    left:
      16px;

    right:
      16px;

    bottom:
      18px;

    width:
      auto;
  }


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


  .trust-grid article {
    min-height:
      92px;

    padding:
      16px 13px;
  }


  .trust-grid p {
    white-space:
      normal;
  }


  .clinic-map-card {
    min-height:
      455px;

    border-radius:
      145px
      145px
      18px
      18px;
  }


  .clinic-map-bottom strong {
    font-size:
      35px;
  }


  .section-header {
    grid-template-columns:
      1fr;

    gap:
      16px;
  }


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


  .service-filters {
    flex-wrap:
      nowrap;

    overflow-x:
      auto;
  }


  .complete-menu-button {
    width:
      100%;

    min-height:
      74px;
  }


  .complete-menu-copy strong {
    font-size:
      24px;
  }


  .promo-card {
    flex:
      0 0 86%;
  }


  .accepted-cards,
  .accepted-cards img {
    min-height:
      300px;
  }


  .accepted-cards-hover {
    opacity:
      1;
  }


  .booking-contact,
  .form-grid {
    grid-template-columns:
      1fr;
  }


  .booking-options {
    grid-template-columns:
      1fr;

    gap:
      9px;
  }


  .booking-channel {
    min-height:
      68px;
  }


  .booking-channel-copy strong {
    font-size:
      19px;
  }


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


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


  .floating-messenger {
    display:
      none;
  }


  .mobile-booking {
    position:
      fixed;

    left:
      12px;

    right:
      12px;

    bottom:
      9px;

    z-index:
      1500;

    height:
      50px;

    display:
      flex;

    align-items:
      center;

    justify-content:
      center;

    border-radius:
      999px;

    background:
      var(--brown);

    color:
      white;

    font-size:
      11px;

    font-weight:
      700;

    box-shadow:
      0 15px 35px
      rgba(74, 45, 29, 0.2);
  }


  html[data-theme="dark"]
  .mobile-booking {
    background:
      var(--bronze);

    color:
      #1d120c;
  }


  .full-menu-content {
    grid-template-columns:
      1fr;
  }


  .copy-toast {
    bottom:
      76px;
  }

}