@charset "UTF-8";

@font-face {
  font-family: "untitled-font-1";
  src:url("fonts/untitled-font-1.eot");
  src:url("fonts/untitled-font-1.eot?#iefix") format("embedded-opentype"),
    url("fonts/untitled-font-1.woff") format("woff"),
    url("fonts/untitled-font-1.ttf") format("truetype"),
    url("fonts/untitled-font-1.svg#untitled-font-1") format("svg");
  font-weight: normal;
  font-style: normal;

}

[data-icon]:before {
  font-family: "untitled-font-1" !important;
  content: attr(data-icon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "untitled-font-1" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-asl:before {
  content: "\61";
}
.icon-instagram:before {
  content: "\63";
}
.icon-menu:before {
  content: "\64";
}
.icon-facebook:before {
  content: "\62";
}
.icon-twitter:before {
  content: "\65";
}
.icon-whatsapp:before {
  content: "\66";
}
.icon-phone:before {
  content: "\67";
}
.icon-map-marker:before {
  content: "\68";
}

/* ==========================================================
   MANOS BALSÁMICAS — renovación visual 2026
   Estética: bienestar natural, botánica mediterránea y calma.
   ========================================================== */
:root {
  --mb-forest: #29483d;
  --mb-forest-deep: #1e362e;
  --mb-sage: #dce5d8;
  --mb-cream: #f8f6ef;
  --mb-paper: #fffdf8;
  --mb-terracotta: #b96f50;
  --mb-ink: #28332d;
  --mb-muted: #68736b;
  --mb-line: rgba(41,72,61,.14);
  --mb-shadow: 0 18px 50px rgba(32,52,43,.10);
}
html { scroll-behavior: smooth; }
body {
  background: var(--mb-cream);
  color: var(--mb-ink);
  font-family: 'Montserrat', Arial, sans-serif;
  font-size: 15px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}
img { height: auto; }
a { transition: color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease; }
.container { width: min(1160px, calc(100% - 44px)); }
.container--flex { gap: 22px; }
.main-header {
  background: var(--mb-paper);
  border-bottom: 1px solid var(--mb-line);
  padding: 13px 0;
}
.main-header .container { min-height: 74px; }
.logo-container.column { width: auto; flex: 1 1 260px; }
.logo {
  color: var(--mb-forest);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.65rem, 3vw, 2.2rem);
  font-style: normal;
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: 1.15;
  padding: 0;
}
.main-header__contactInfo.column { width: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px 22px; }
.main-header__contactInfo p { margin: 0; font-size: .82rem; }
.main-header__contactInfo__phone { background: transparent; color: var(--mb-forest); padding: 0; font-weight: 700; }
.main-header__contactInfo__phone a { color: inherit; text-decoration: none; }
.main-header__contactInfo__address { color: var(--mb-muted); padding: 0; }
.main-nav { background: var(--mb-forest); padding: 0; position: sticky; top: 0; box-shadow: 0 5px 18px rgba(20,38,30,.09); }
.main-nav > .container { min-height: 58px; }
.icon-menu { display: none; color: white; cursor: pointer; font-size: 1.4rem; padding: 8px; }
.menu { display: flex; align-items: center; gap: 4px; position: static; width: auto; height: auto; overflow: visible; background: transparent; margin: 0; }
.menu__item { list-style: none; }
.menu__link { border-radius: 30px; color: rgba(255,255,255,.84); display: block; font-size: .85rem; font-weight: 600; padding: 10px 18px; }
.menu__link:hover, .menu__link--select { background: rgba(255,255,255,.13); color: #fff; }
.social-icon { gap: 8px; align-items: center; }
.social-icon__link { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; color: white; }
.social-icon [class*="social-icon"] { background: transparent; color: white; width: auto; height: auto; }
.social-icon__link:hover { background: white; color: var(--mb-forest); }
.banner { margin-top: 0; position: relative; overflow: hidden; background: var(--mb-forest-deep); }
.banner:before { background: linear-gradient(90deg, rgba(20,42,33,.78) 0%, rgba(20,42,33,.42) 48%, rgba(20,42,33,.10) 100%); z-index: 1; }
.banner__img { height: clamp(360px, 48vw, 590px); object-fit: cover; object-position: center 48%; }
.banner__content {
  width: min(1160px, calc(100% - 44px));
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  color: #fff; text-align: left; font-size: clamp(2.6rem, 6.2vw, 5.5rem);
  font-family: Georgia, 'Times New Roman', serif; font-weight: 400; line-height: 1.03;
  letter-spacing: -.055em; text-wrap: balance; z-index: 2;
}
.banner__content .hero-kicker { display: block; color: #e3c4a5; font: 700 .72rem/1.5 'Montserrat', Arial, sans-serif; letter-spacing: .19em; margin-bottom: 20px; text-transform: uppercase; }
.banner__content .hero-copy { display: block; max-width: 560px; font: 400 clamp(.98rem, 1.5vw, 1.15rem)/1.8 'Montserrat', Arial, sans-serif; letter-spacing: 0; margin-top: 23px; color: rgba(255,255,255,.9); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero-actions a { display: inline-block; border: 1px solid rgba(255,255,255,.7); border-radius: 30px; color: white; font: 700 .82rem 'Montserrat', Arial, sans-serif; letter-spacing: .02em; padding: 13px 22px; text-decoration: none; }
.hero-actions a:first-child { background: #e4c5a8; border-color: #e4c5a8; color: var(--mb-forest-deep); }
.hero-actions a:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,.16); }
.group { padding: clamp(42px, 6vw, 78px) 0; }
.group--color { background: var(--mb-sage); }
.group--color .container { background: transparent; color: var(--mb-ink); padding: 0; max-width: 860px; text-align: center; }
.main__title, .group__title { color: var(--mb-forest); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2rem, 4vw, 3rem); font-style: normal; font-weight: 400; letter-spacing: -.045em; line-height: 1.15; margin: 0 0 18px; text-align: center; }
.main__txt { color: #526158; font-size: 1rem; line-height: 1.9; margin: 0 auto; max-width: 760px; }
.main__about__description .container { align-items: center; gap: clamp(28px, 6vw, 76px); }
.main__about__description .column { width: calc(50% - 38px); }
.main__about__description img { border-radius: 4px 90px 4px 4px; box-shadow: var(--mb-shadow); max-height: 470px; object-fit: cover; }
.column__title { color: var(--mb-forest); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 400; line-height: 1.2; margin-bottom: 15px; }
.column__txt, .our-team__txt { color: var(--mb-muted); line-height: 1.85; }
.btn, .btn2 { background: var(--mb-forest); border: 1px solid var(--mb-forest); border-radius: 30px; color: white; font-size: .82rem; font-weight: 700; letter-spacing: .015em; padding: 12px 20px; text-decoration: none; width: fit-content; min-width: 135px; }
.btn { margin: 22px 0 0; }
.btn2 { margin: 14px auto 8px; }
.btn:hover, .btn2:hover { background: var(--mb-terracotta); border-color: var(--mb-terracotta); color: white; transform: translateY(-2px); }
.the-best { background: var(--mb-paper); }
.the-best > .group__title, .gallery > .group__title { margin-bottom: 32px; }
.containter.container--flex, .container.container--flex { align-items: stretch; }
.the-best .column--50-25 { background: #fff; border: 1px solid var(--mb-line); border-radius: 5px 5px 20px 5px; box-shadow: 0 8px 28px rgba(32,52,43,.045); margin: 0 0 22px; overflow: hidden; padding: 0 0 18px; text-align: center; transition: transform .25s ease, box-shadow .25s ease; }
.the-best .column--50-25:hover { box-shadow: var(--mb-shadow); transform: translateY(-5px); }
.the-best__img { height: 230px; max-width: none; object-fit: cover; width: 100%; }
.the-best .btn2 { min-height: 48px; width: calc(100% - 30px); }
.the-best__price { color: var(--mb-terracotta); font-weight: 700; font-size: .95rem; }
.gallery { background: var(--mb-cream); }
.our-team .container { align-items: stretch; }
.our-team .column--33 { background: var(--mb-paper); border: 1px solid var(--mb-line); border-radius: 5px 5px 26px 5px; margin-bottom: 22px; overflow: hidden; padding: 24px; }
.our-team__title { color: var(--mb-forest); font-family: Georgia, 'Times New Roman', serif; font-size: 1.6rem; font-weight: 400; margin-bottom: 16px; }
.our-team__img { border-radius: 3px 3px 34px 3px; height: 250px; object-fit: cover; margin-bottom: 18px; }
.main-footer { background: var(--mb-forest-deep); color: rgba(255,255,255,.75); padding: 54px 0 20px; }
.main-footer .container { align-items: flex-start; }
.main-footer .column--33 { width: calc(33.333% - 20px); }
.main-footer .column__title { color: #f5eadb; font-family: Georgia, 'Times New Roman', serif; font-size: 1.35rem; margin-bottom: 12px; }
.main-footer .column__txt { color: rgba(255,255,255,.68); font-size: .85rem; margin: 8px 0; }
.main-footer a { color: #f1d7bd; text-decoration: none; }
.main-footer a:hover { color: white; }
.copy { border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.55); font-size: .76rem; margin: 28px 0 0; padding-top: 18px; text-align: center; width: 100%; }
.modal__content { border-radius: 8px; }
input, button, textarea, select { font: inherit; }
:focus-visible { outline: 3px solid #d6a27f; outline-offset: 3px; }
@media (min-width: 780px) {
  .the-best .column--50-25 { width: calc(25% - 17px); }
  .our-team .column--33 { width: calc(33.333% - 16px); }
}
@media (max-width: 779px) {
  .container { width: min(100% - 30px, 620px); }
  .main-header .container { gap: 8px; }
  .main-header__contactInfo.column { justify-content: flex-start; gap: 2px 14px; }
  .main-header__contactInfo p { font-size: .72rem; }
  .main-nav > .container { min-height: 54px; }
  .icon-menu { display: block; }
  .menu { position: absolute; top: 54px; left: 0; width: 100%; display: block; height: 0; overflow: hidden; background: var(--mb-forest-deep); transition: height .25s ease; }
  .menu.mostrar { height: 270px; }
  .menu__link { border-radius: 0; padding: 12px 22px; }
  .social-icon { margin-left: auto; }
  .banner__img { height: 470px; }
  .banner:before { background: linear-gradient(90deg, rgba(20,42,33,.8), rgba(20,42,33,.35)); }
  .banner__content { width: calc(100% - 36px); font-size: clamp(2.6rem, 10vw, 4rem); }
  .banner__content .hero-copy { max-width: 470px; font-size: .93rem; }
  .main__about__description .column { width: 100%; }
  .main__about__description img { max-height: 360px; }
  .the-best .column--50-25 { width: calc(50% - 11px); }
  .the-best__img { height: 190px; }
  .our-team .column--33, .main-footer .column--33 { width: 100%; }
}
@media (max-width: 460px) {
  .main-header .container { align-items: flex-start; flex-direction: column; gap: 9px; }
  .main-header__contactInfo.column { display: block; }
  .main-header__contactInfo p { margin: 2px 0; }
  .the-best .column--50-25 { width: 100%; }
  .the-best__img { height: 235px; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .hero-actions a { text-align: center; }
}