:root {
  --lohe-manager-charcoal: #232323;
  --lohe-manager-mocha: #685d54;
  --lohe-manager-taupe: #a39382;
  --lohe-manager-oat: #e5ded2;
  --lohe-manager-milk: #fbf7f4;
}

/* Corrección global de anchura solicitada. */
@media (min-width: 921px) {
  .lohe-manager-active .section > .container > .content-box:not(.faq-box),
  .lohe-manager-active .section > .container > .meta-box:not(.faq-box) {
    padding-right: 0 !important;
  }

  .lohe-manager-active .content-box--wide > :not(.steps-list):not(.hero-actions),
  .lohe-manager-active .micro-topic-content > :not(.hero-actions):not(.micro-subtopics-grid),
  .lohe-manager-active .eventos-photo-copy > :not(.hero-actions) {
    max-width: none !important;
  }
}

/* Párrafos y listados deben utilizar todo el ancho de su bloque. En diseños
   con columnas, el 100 % sigue siendo únicamente el ancho de esa columna. */
.lohe-manager-active .content-box,
.lohe-manager-active .meta-box,
.lohe-manager-active .content-box > ul,
.lohe-manager-active .content-box > ol,
.lohe-manager-active .content-box .reasons-list,
.lohe-manager-active .content-box .micro-bullets {
  width: 100% !important;
  max-width: none !important;
}

.lohe-manager-active .content-box li,
.lohe-manager-active .meta-box li {
  width: auto !important;
  max-width: none !important;
}

.lohe-hide-mobile {
  display: block;
}

.lohe-hide-reserve-buttons .hero-actions .button--primary {
  display: none !important;
}

.lohe-empty-component {
  padding: 1rem 1.2rem;
  border: 1px dashed rgba(104, 93, 84, 0.4);
  border-radius: 1rem;
  color: var(--lohe-manager-mocha);
  background: rgba(229, 222, 210, 0.28);
}

.lohe-inserted-section {
  grid-column: 1 / -1;
  width: 100%;
  padding: clamp(1.35rem, 3vw, 2.4rem) 0;
}

.lohe-inserted-section > .container {
  width: 100%;
  max-width: none;
  padding-inline: 0;
}

/* Las secciones originales ya aportan separación. Galerías, feeds y FAQ no
   deben sumar un segundo padding completo cuando aparecen consecutivamente. */
.lohe-inserted-section .section-heading {
  margin-bottom: clamp(.9rem, 2vw, 1.35rem);
}

.lohe-inserted-section + .faq-box,
.lohe-inserted-section + .lohe-faq-section,
.lohe-results-gallery + .lohe-faq-section {
  margin-top: clamp(1.25rem, 2.5vw, 2rem) !important;
}

.lohe-linea-editorial + .lohe-inserted-section {
  margin-top: clamp(1.25rem, 3vw, 2.5rem);
}

/* wpautop puede introducir un <br> entre enlaces consecutivos y crear una
   fila vacía dentro del flex de botones. */
.lohe-manager-active .hero-actions > br {
  display: none !important;
}

.lohe-manager-active .hero-actions > .button {
  margin: 0 !important;
}

/* Shooting y rodajes. */
.lohe-manager-active[data-page="maquillaje-moda-tv"] .hero + .section {
  padding-top: clamp(1.5rem, 3vw, 2.25rem) !important;
  padding-bottom: clamp(1.35rem, 2.7vw, 2rem) !important;
}

.lohe-manager-active[data-page="maquillaje-moda-tv"] .hero + .section > .container > p,
.lohe-manager-active[data-page="maquillaje-moda-tv"] .hero + .section > p {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 clamp(1rem, 2vw, 1.4rem) !important;
}

.lohe-manager-active[data-page="maquillaje-moda-tv"] .hero + .section .micro-topic-trigger {
  padding: 1.05rem 1.5rem !important;
}

.lohe-manager-active[data-page="maquillaje-moda-tv"] .section--milk {
  padding-top: clamp(1.35rem, 2.7vw, 2rem) !important;
}

.lohe-manager-active[data-page="maquillaje-moda-tv"] .lohe-instagram-section {
  padding-top: 0;
  padding-bottom: clamp(1.2rem, 2.5vw, 1.8rem);
}

/* Maquillaje para eventos. */
.lohe-manager-active[data-page="maquillaje-eventos"] .section--eventos-photo {
  padding-bottom: clamp(1.5rem, 3vw, 2.4rem) !important;
}

.lohe-manager-active[data-page="maquillaje-eventos"] .section--eventos-photo + .section {
  padding-top: clamp(1.5rem, 3vw, 2.4rem) !important;
  padding-bottom: clamp(1.5rem, 3vw, 2.4rem) !important;
}

.lohe-manager-active[data-page="maquillaje-eventos"] .section--eventos-photo + .section + .section {
  padding-top: clamp(1.5rem, 3vw, 2.4rem) !important;
}

/* Cabeceras administrables. */
.lohe-managed-hero {
  --lohe-overlay-opacity: 0.56;
}

.lohe-managed-hero.lohe-overlay-soft { --lohe-overlay-opacity: 0.32 !important; }
.lohe-managed-hero.lohe-overlay-medium { --lohe-overlay-opacity: 0.56 !important; }
.lohe-managed-hero.lohe-overlay-strong { --lohe-overlay-opacity: 0.78 !important; }

.lohe-managed-hero::before {
  z-index: 1 !important;
  pointer-events: none;
}

.lohe-managed-hero.lohe-overlay-dark::before {
  background: rgba(35, 35, 35, var(--lohe-overlay-opacity)) !important;
}

.lohe-managed-hero.lohe-overlay-dark-gradient::before {
  background: linear-gradient(90deg, rgba(35, 35, 35, var(--lohe-overlay-opacity)) 0%, rgba(35, 35, 35, calc(var(--lohe-overlay-opacity) * .74)) 48%, rgba(35, 35, 35, .08) 100%) !important;
}

.lohe-managed-hero.lohe-overlay-light::before {
  background: rgba(251, 247, 244, var(--lohe-overlay-opacity)) !important;
}

.lohe-managed-hero.lohe-overlay-light-gradient::before {
  background: linear-gradient(90deg, rgba(251, 247, 244, var(--lohe-overlay-opacity)) 0%, rgba(229, 222, 210, calc(var(--lohe-overlay-opacity) * .74)) 54%, rgba(251, 247, 244, .08) 100%) !important;
}

/* Valores explícitos para evitar que los overlays heredados del tema igualen
   visualmente las tres intensidades. */
.lohe-managed-hero.lohe-overlay-dark.lohe-overlay-soft::before { background: rgba(35, 35, 35, .32) !important; }
.lohe-managed-hero.lohe-overlay-dark.lohe-overlay-medium::before { background: rgba(35, 35, 35, .56) !important; }
.lohe-managed-hero.lohe-overlay-dark.lohe-overlay-strong::before { background: rgba(35, 35, 35, .78) !important; }
.lohe-managed-hero.lohe-overlay-dark-gradient.lohe-overlay-soft::before { background: linear-gradient(90deg, rgba(35,35,35,.32), rgba(35,35,35,.20) 50%, rgba(35,35,35,.04)) !important; }
.lohe-managed-hero.lohe-overlay-dark-gradient.lohe-overlay-medium::before { background: linear-gradient(90deg, rgba(35,35,35,.56), rgba(35,35,35,.38) 50%, rgba(35,35,35,.08)) !important; }
.lohe-managed-hero.lohe-overlay-dark-gradient.lohe-overlay-strong::before { background: linear-gradient(90deg, rgba(35,35,35,.78), rgba(35,35,35,.62) 50%, rgba(35,35,35,.18)) !important; }
.lohe-managed-hero.lohe-overlay-light.lohe-overlay-soft::before { background: rgba(251,247,244,.36) !important; }
.lohe-managed-hero.lohe-overlay-light.lohe-overlay-medium::before { background: rgba(251,247,244,.62) !important; }
.lohe-managed-hero.lohe-overlay-light.lohe-overlay-strong::before { background: rgba(251,247,244,.82) !important; }
.lohe-managed-hero.lohe-overlay-light-gradient.lohe-overlay-soft::before { background: linear-gradient(90deg, rgba(251,247,244,.56), rgba(229,222,210,.32) 54%, rgba(251,247,244,.04)) !important; }
.lohe-managed-hero.lohe-overlay-light-gradient.lohe-overlay-medium::before { background: linear-gradient(90deg, rgba(251,247,244,.78), rgba(229,222,210,.52) 54%, rgba(251,247,244,.08)) !important; }
.lohe-managed-hero.lohe-overlay-light-gradient.lohe-overlay-strong::before { background: linear-gradient(90deg, rgba(251,247,244,.94), rgba(229,222,210,.78) 54%, rgba(251,247,244,.18)) !important; }

.lohe-managed-hero.lohe-overlay-none::before {
  background: transparent !important;
}

.lohe-managed-hero .hero-inner {
  z-index: 3 !important;
}

.lohe-managed-hero.lohe-overlay-dark .hero-title,
.lohe-managed-hero.lohe-overlay-dark .hero-copy,
.lohe-managed-hero.lohe-overlay-dark .hero-copy--lead,
.lohe-managed-hero.lohe-overlay-dark-gradient .hero-title,
.lohe-managed-hero.lohe-overlay-dark-gradient .hero-copy,
.lohe-managed-hero.lohe-overlay-dark-gradient .hero-copy--lead {
  color: var(--lohe-manager-milk) !important;
  text-shadow: 0 2px 18px rgba(35, 35, 35, .3);
}

.lohe-managed-hero.lohe-overlay-light .hero-title,
.lohe-managed-hero.lohe-overlay-light .hero-copy,
.lohe-managed-hero.lohe-overlay-light .hero-copy--lead,
.lohe-managed-hero.lohe-overlay-light-gradient .hero-title,
.lohe-managed-hero.lohe-overlay-light-gradient .hero-copy,
.lohe-managed-hero.lohe-overlay-light-gradient .hero-copy--lead {
  color: var(--lohe-manager-charcoal) !important;
  text-shadow: none;
}

.lohe-managed-hero.lohe-position-left,
.lohe-managed-hero.lohe-position-left .lohe-gallery__image { background-position: left center !important; object-position: left center; }
.lohe-managed-hero.lohe-position-center,
.lohe-managed-hero.lohe-position-center .lohe-gallery__image { background-position: center center !important; object-position: center center; }
.lohe-managed-hero.lohe-position-right,
.lohe-managed-hero.lohe-position-right .lohe-gallery__image { background-position: right center !important; object-position: right center; }

.lohe-hero-mode-slider .hero-shape-blur,
.lohe-hero-mode-compact .hero-shape-blur {
  display: none !important;
}

.lohe-manager-active .lohe-managed-hero.lohe-hero-mode-compact {
  width: min(1180px, calc(100% - 2rem));
  min-height: 0 !important;
  margin-top: 1.2rem;
  background: var(--lohe-manager-mocha) !important;
  border-radius: 1.6rem;
  box-shadow: 0 16px 44px rgba(35, 35, 35, .1);
}

.lohe-managed-hero.lohe-hero-mode-compact::before,
.lohe-managed-hero.lohe-hero-mode-compact::after {
  display: none !important;
}

.lohe-managed-hero.lohe-hero-mode-compact .hero-inner {
  min-height: 0 !important;
  padding: clamp(2rem, 4vw, 3.4rem);
}

.lohe-managed-hero.lohe-hero-mode-compact .hero-title,
.lohe-managed-hero.lohe-hero-mode-compact .hero-copy,
.lohe-managed-hero.lohe-hero-mode-compact .hero-copy--lead {
  color: var(--lohe-manager-milk) !important;
  max-width: 66ch;
}

/* Galerías. */
.lohe-gallery {
  position: relative;
  width: 100%;
}

.lohe-gallery__track {
  display: grid;
  grid-template-columns: repeat(var(--lohe-columns, 3), minmax(0, 1fr));
  gap: 1rem;
}

.lohe-gallery__item {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 1.5rem;
  background: rgba(229, 222, 210, .52);
}

.lohe-gallery__image,
.lohe-gallery__open {
  display: block;
  width: 100%;
}

.lohe-gallery__image {
  height: var(--lohe-gallery-height, 360px);
  object-fit: cover;
}

.lohe-gallery__open {
  appearance: none;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.lohe-gallery--fit-contain .lohe-gallery__image { object-fit: contain; }
.lohe-gallery--fit-natural .lohe-gallery__image { width: 100%; height: auto; object-fit: contain; }

.lohe-gallery--proportional .lohe-gallery__track {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 1rem;
}

.lohe-gallery--proportional .lohe-gallery__item {
  flex: 0 0 auto;
  height: var(--lohe-gallery-height, 320px);
}

.lohe-gallery--proportional .lohe-gallery__image,
.lohe-gallery--proportional .lohe-gallery__open {
  width: auto;
  height: 100%;
}

.lohe-gallery--carousel {
  overflow: hidden;
}

.lohe-gallery--carousel .lohe-gallery__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.lohe-gallery--carousel .lohe-gallery__track::-webkit-scrollbar { display: none; }
.lohe-gallery--carousel .lohe-gallery__item { flex: 0 0 min(78vw, 420px); scroll-snap-align: center; }

.lohe-gallery--slideshow {
  min-height: var(--lohe-gallery-height, 500px);
  overflow: hidden;
  border-radius: 1.7rem;
}

.lohe-gallery--slideshow .lohe-gallery__track {
  position: absolute;
  inset: 0;
  display: block;
}

.lohe-gallery--slideshow .lohe-gallery__item {
  position: absolute;
  inset: 0;
  opacity: 0;
  border-radius: inherit;
  transition: opacity .7s ease;
}

.lohe-gallery--slideshow .lohe-gallery__item { pointer-events: none; }
.lohe-gallery--slideshow .lohe-gallery__item.is-active { opacity: 1; pointer-events: auto; }
.lohe-gallery--slideshow .lohe-gallery__image { width: 100%; height: 100%; object-fit: cover; }

.lohe-gallery--context-hero {
  position: absolute;
  inset: 0;
  z-index: 0;
  min-height: 100%;
  border-radius: inherit;
}

.lohe-gallery--context-hero .lohe-gallery__arrow,
.lohe-gallery--context-hero .lohe-gallery__dots {
  z-index: 4;
}

.lohe-gallery__arrow {
  position: absolute;
  top: 50%;
  z-index: 5;
  width: 2.8rem;
  height: 2.8rem;
  transform: translateY(-50%);
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 50%;
  background: rgba(35,35,35,.45);
  color: white;
  font-size: 1.65rem;
  cursor: pointer;
}

.lohe-gallery__arrow--prev { left: 1rem; }
.lohe-gallery__arrow--next { right: 1rem; }

.lohe-gallery__dots {
  position: absolute;
  left: 50%;
  bottom: 1rem;
  z-index: 5;
  display: flex;
  gap: .45rem;
  transform: translateX(-50%);
}

.lohe-gallery__dot {
  width: .65rem;
  height: .65rem;
  padding: 0;
  border: 1px solid white;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}

.lohe-gallery__dot.is-active { background: white; }

/* Tarjetas de servicios. */
.lohe-service-grid {
  align-items: stretch;
}

.lohe-service-card {
  position: relative;
  isolation: isolate;
  display: flex !important;
  flex-direction: column;
  min-height: 22rem !important;
  overflow: hidden;
  padding: clamp(1.35rem, 3vw, 2rem) !important;
  background: var(--lohe-card-image, linear-gradient(135deg, #a39382, #685d54)) center / cover no-repeat !important;
  color: var(--lohe-manager-milk) !important;
  text-decoration: none;
}

.lohe-service-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(35, 35, 35, var(--lohe-card-overlay, .52));
  transition: background-color .25s ease;
}

.lohe-service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(180deg, transparent 20%, rgba(35,35,35,.28) 100%);
}

.lohe-service-card h3,
.lohe-service-card p,
.lohe-service-card .card-link-copy {
  color: var(--lohe-manager-milk) !important;
}

.lohe-service-card .card-link-copy { margin-top: auto; }
.lohe-service-card:hover::before { background: rgba(35, 35, 35, calc(var(--lohe-card-overlay, .52) + .08)); }

/* Las FAQ reutilizan deliberadamente las clases visuales del tema. El prefijo
   LOHË mantiene aislado únicamente su comportamiento JavaScript. */
.lohe-faq-answer > :first-child { margin-top: 0; }

/* Bloques editoriales. */
.lohe-editorial { display: grid; gap: clamp(2.4rem, 6vw, 5rem); }
.lohe-editorial__row,
.lohe-treatment-dialog__block {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: clamp(1.5rem, 4vw, 4rem);
  align-items: center;
}
.lohe-editorial__row--media-left .lohe-editorial__media,
.lohe-treatment-dialog__block--left .lohe-treatment-dialog__media { order: -1; }
.lohe-editorial__row--text-only {
  display: block;
  width: 100%;
}
.lohe-editorial__row--text-only .lohe-editorial__copy,
.lohe-editorial__row--text-only .lohe-editorial__copy > * {
  width: 100%;
  max-width: none;
}

/* Proceso visual: pensado para textos breves asociados a fotografías
   verticales. En escritorio funciona como una infografía de tres pasos. */
.lohe-editorial--process {
  grid-template-columns: repeat(var(--lohe-editorial-columns, 3), minmax(0, 1fr));
  gap: clamp(1rem, 2.2vw, 1.5rem);
  counter-reset: lohe-process-step;
}

.lohe-editorial--process .lohe-editorial__row--process-intro,
.lohe-editorial--process .lohe-editorial__row--process-heading {
  grid-column: 1 / -1;
}

.lohe-editorial--process .lohe-editorial__row--process-intro + .lohe-editorial__row--process-heading {
  margin-top: -.35rem;
}

.lohe-editorial--process .lohe-editorial__row--process-step {
  counter-increment: lohe-process-step;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(163,147,130,.22);
  border-radius: 1.4rem;
  background: rgba(255,255,255,.72);
  box-shadow: 0 14px 36px rgba(35,35,35,.06);
}

.lohe-editorial--process .lohe-editorial__row--process-step .lohe-editorial__media {
  order: -1;
  display: block;
  padding: .55rem;
}

.lohe-editorial--process .lohe-editorial__row--process-step .lohe-editorial__media img {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  border-radius: 1rem;
  background: transparent;
}

.lohe-editorial--process .lohe-editorial__row--process-step .lohe-editorial__copy {
  position: relative;
  flex: 1;
  padding: 1.05rem 1.2rem 1.3rem;
}

.lohe-editorial--process .lohe-editorial__row--process-step .lohe-editorial__copy::before {
  content: "0" counter(lohe-process-step);
  display: inline-grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  margin-bottom: .8rem;
  border-radius: 50%;
  background: var(--lohe-manager-mocha);
  color: var(--lohe-manager-milk);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .08em;
}

.lohe-editorial--process .lohe-editorial__row--process-step .lohe-editorial__copy p {
  margin: 0;
  font-size: clamp(1rem, 1.2vw, 1.12rem);
  line-height: 1.55;
}

/* Ejemplo editorial del modal de cejas: imágenes verticales completas y
   alternancia clara, sin convertirlas en fondos ni recortarlas. */
.lohe-treatment-dialog .lohe-treatment-dialog__intro {
  margin-bottom: clamp(1.25rem, 3vw, 2rem);
}

.lohe-treatment-dialog .lohe-treatment-dialog__block {
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
  margin: clamp(1.8rem, 4vw, 3.5rem) 0;
  padding: clamp(1rem, 2vw, 1.4rem);
  border-radius: 1.4rem;
  background: rgba(229,222,210,.34);
}

.lohe-treatment-dialog .lohe-treatment-dialog__media img {
  width: min(100%, 390px);
  height: auto;
  max-height: none;
  margin-inline: auto;
  object-fit: contain;
  background: transparent;
}

.lohe-treatment-dialog .lohe-treatment-dialog__copy p {
  font-size: clamp(1rem, 1.25vw, 1.13rem);
  line-height: 1.65;
}
.lohe-editorial__media,
.lohe-treatment-dialog__media { display: grid; gap: 1rem; }
.lohe-editorial__media img,
.lohe-treatment-dialog__media img {
  display: block;
  width: 100%;
  max-height: 620px;
  object-fit: contain;
  border-radius: 1.4rem;
  background: rgba(229,222,210,.4);
}

/* Tratamientos y modal indexable. */
.lohe-treatment-list { display: grid; gap: .7rem; }
.lohe-treatment-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 5.3rem;
  padding: 1rem 1.2rem;
  border: 1px solid rgba(163,147,130,.24);
  border-radius: 1rem;
  background: rgba(255,255,255,.82);
  color: var(--lohe-manager-charcoal);
  text-decoration: none;
  box-shadow: 0 12px 30px rgba(35,35,35,.05);
}
.lohe-treatment-card strong,
.lohe-treatment-card small { display: block; }
.lohe-treatment-card small { margin-top: .3rem; color: var(--lohe-manager-mocha); }
.lohe-treatment-card em { display: inline-block; margin-top: .45rem; padding: .15rem .55rem; border-radius: 999px; background: var(--lohe-manager-oat); font-size: .72rem; font-style: normal; }
.lohe-treatment-card--coming-soon { opacity: .7; pointer-events: none; }
.lohe-treatment-card--hidden { display: none; }

.lohe-treatment-dialog {
  width: min(1120px, calc(100% - 2rem));
  max-height: calc(100dvh - 2rem);
  padding: 0;
  border: 0;
  border-radius: 1.7rem;
  background: var(--lohe-manager-milk);
  color: var(--lohe-manager-charcoal);
  box-shadow: 0 30px 90px rgba(0,0,0,.28);
}
.lohe-treatment-dialog::backdrop { background: rgba(24,22,20,.72); backdrop-filter: blur(5px); }
.lohe-treatment-dialog__shell { position: relative; padding: clamp(1.2rem, 4vw, 3.6rem); }
.lohe-treatment-dialog__close { position: sticky; top: 0; z-index: 10; float: right; width: 2.8rem; height: 2.8rem; border: 0; border-radius: 50%; background: var(--lohe-manager-charcoal); color: white; font-size: 1.45rem; cursor: pointer; }
.lohe-treatment-dialog__hero { clear: both; margin-bottom: 2rem; }
.lohe-treatment-dialog__hero-image { display: block; width: 100%; max-height: 520px; object-fit: cover; border-radius: 1.35rem; }
.lohe-treatment-dialog__intro { max-width: 760px; margin-bottom: clamp(2rem, 6vw, 4.5rem); }
.lohe-treatment-dialog__intro h1 { margin-bottom: 1rem; font-family: var(--serif, serif); }
.lohe-treatment-dialog__block { margin: clamp(2.5rem, 7vw, 6rem) 0; }
.lohe-treatment-dialog__gallery { margin-top: 3rem; }
.lohe-treatment-dialog__actions { margin-top: 2.5rem; }
body.lohe-dialog-open { overflow: hidden; }

/* Instagram. */
.lohe-instagram-grid { display: grid; grid-template-columns: repeat(var(--lohe-instagram-columns, 3), minmax(0, 1fr)); gap: 1rem; }
.lohe-instagram-item { overflow: hidden; aspect-ratio: 1; border-radius: 1.2rem; background: var(--lohe-manager-oat); }
.lohe-instagram-item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.lohe-instagram-item:hover img { transform: scale(1.025); }

/* Ajustes específicos derivados del inventario. */
.lohe-manager-active[data-page="belly-painting"] .belly-tiles { align-items: stretch !important; }
.lohe-manager-active[data-page="belly-painting"] .belly-tile { height: 100%; }
.lohe-belly-gallery { grid-column: 1 / -1; margin-top: .5rem; }

.lohe-manager-active .steps-list--eventos li {
  min-height: 0 !important;
  height: auto;
  align-self: stretch;
}
.lohe-manager-active .steps-list--eventos li > div { min-height: 0 !important; height: auto !important; }
.lohe-manager-active .steps-list--eventos h3 { min-height: 0 !important; }

.lohe-manager-active[data-page="sobre-lohe"] .team-profile-media {
  width: 100%;
  height: auto !important;
  aspect-ratio: auto !important;
  background: rgba(229,222,210,.45);
}
.lohe-manager-active[data-page="sobre-lohe"] .team-profile-media img {
  width: 100%;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
}

/* Visor navegable. */
.lohe-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: grid;
  place-items: center;
  padding: 2rem;
  background: rgba(20,18,17,.88);
}
.lohe-lightbox:not([open]) { display: none; }
.lohe-lightbox img { max-width: min(1200px, 96vw); max-height: 90vh; object-fit: contain; }
.lohe-lightbox button { border: 0; border-radius: 50%; background: white; color: var(--lohe-manager-charcoal); font-size: 1.4rem; cursor: pointer; }
.lohe-lightbox__close { position: absolute; top: 1rem; right: 1rem; width: 3rem; height: 3rem; }
.lohe-lightbox__nav { position: absolute; top: 50%; width: 3.2rem; height: 3.2rem; transform: translateY(-50%); }
.lohe-lightbox__nav--prev { left: 1rem; }
.lohe-lightbox__nav--next { right: 1rem; }

/* Ajustes editoriales solicitados en septiembre de 2026. */
.lohe-mobile-only { display: none !important; }
.lohe-page-actions-wrap { margin-top: clamp(1.2rem, 2.6vw, 2rem); margin-bottom: clamp(1.2rem, 2.6vw, 2rem); }
.lohe-page-actions { margin-top: 0 !important; }
.lohe-inline-info { margin-top: 1.15rem; border-top: 1px solid rgba(104,93,84,.22); border-bottom: 1px solid rgba(104,93,84,.22); }
.lohe-inline-info__trigger { display: grid; grid-template-columns: 1fr auto; align-items: center; width: 100%; padding: 1rem 0; border: 0; background: transparent; color: var(--lohe-manager-charcoal); font: 500 1rem/1.3 var(--sans, sans-serif); text-align: left; cursor: pointer; }
.lohe-inline-info__trigger::after { content: "+"; color: var(--lohe-manager-mocha); font-size: 1.35rem; transition: transform .2s ease; }
.lohe-inline-info.is-open .lohe-inline-info__trigger::after { transform: rotate(45deg); }
.lohe-inline-info__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .25s ease; }
.lohe-inline-info__panel > div { overflow: hidden; }
.lohe-inline-info__panel p { margin: 0; padding: 0 0 1.1rem; white-space: pre-line; color: rgba(35,35,35,.8); line-height: 1.7; }
.lohe-inline-info.is-open .lohe-inline-info__panel { grid-template-rows: 1fr; }
.lohe-no-top-actions .hero-actions { margin-top: 0 !important; padding-top: 0 !important; }
.lohe-coming-soon { pointer-events: none; opacity: .72; }
.lohe-coming-soon__label { display: inline-flex; align-self: flex-start; margin-top: .65rem; padding: .25rem .65rem; border-radius: 999px; background: rgba(229,222,210,.88); color: var(--lohe-manager-mocha); font-size: .7rem; font-style: normal; letter-spacing: .09em; text-transform: uppercase; }

body[data-page="home"] .lohe-gallery--context-hero .lohe-gallery__arrow,
body[data-page="servicios-esteticos"] .lohe-gallery--context-hero .lohe-gallery__arrow { display: none !important; }

body[data-page="micropigmentacion"] .hero + .section { padding-bottom: 0 !important; }

body[data-page="maquillaje-novias"] .micro-topic .button--secondary,
body[data-page="maquillaje-novias"] .micro-topic .button--secondary:hover,
body[data-page="maquillaje-novias"] .micro-topic .button--secondary:focus-visible {
  border-color: var(--lohe-manager-mocha) !important;
  background: var(--lohe-manager-mocha) !important;
  color: var(--lohe-manager-milk) !important;
}

.lohe-treatment-dialog__intro h1 { margin-top: .35rem; margin-bottom: 1.35rem; }
.lohe-treatment-dialog__lead p + p,
.lohe-treatment-dialog__copy p + p { margin-top: 1.15rem; }
.lohe-treatment-dialog__copy h2 { margin-bottom: 1rem; }
.lohe-treatment-dialog__copy h2 + p { margin-top: 0; }

@media (max-width: 768px) {
  .lohe-mobile-only { display: block !important; }
  .lohe-mobile-copy-source { display: none !important; }

  .lohe-mobile-hero-copy { padding-top: 1.15rem !important; padding-bottom: 1.15rem !important; }
  .lohe-mobile-hero-copy .container { width: calc(100% - 2rem); }
  .lohe-mobile-hero-copy p { color: rgba(35,35,35,.82) !important; font-size: 1rem; line-height: 1.7; }

  body[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider {
    min-height: 84vh !important;
    min-height: 84svh !important;
  }

  body[data-page="home"] .lohe-managed-hero .hero-inner {
    display: flex !important;
    align-items: flex-start;
    justify-content: center;
    min-height: 84svh !important;
    padding: 6.2rem 1rem 1.5rem !important;
  }

  body[data-page="home"] .lohe-managed-hero .hero-title {
    display: block;
    width: min(100%, 34rem);
    margin: 0 auto;
    padding: .9rem 1rem 1rem;
    border: 1px solid rgba(255,255,255,.56);
    border-radius: 1rem;
    background: rgba(251,247,244,.7);
    color: var(--lohe-manager-charcoal) !important;
    text-align: center;
    text-shadow: none !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }

  body[data-page="home"] .lohe-managed-hero .hero-title * { color: inherit !important; }
  body[data-page="home"] .lohe-managed-hero .hero-copy,
  body[data-page="home"] .lohe-managed-hero .hero-copy--lead,
  body[data-page="home"] .lohe-managed-hero .hero-actions { display: none !important; }

  body[data-page="home"] .lohe-gallery--context-hero .lohe-gallery__dots,
  body[data-page="servicios-esteticos"] .lohe-gallery--context-hero .lohe-gallery__dots { display: none !important; }

  body[data-page="home"] .lohe-service-grid,
  body[data-page="maquillaje"] .lohe-service-grid {
    width: calc(100% - 2rem) !important;
    margin-inline: auto !important;
    gap: 1rem !important;
  }

  body[data-page="home"] .lohe-service-card,
  body[data-page="maquillaje"] .lohe-service-card { width: 100% !important; margin: 0 !important; }

  body[data-page="maquillaje-eventos"] .lohe-hide-hero-content-mobile .hero-inner,
  body[data-page="belly-painting"] .lohe-hide-hero-content-mobile .hero-inner { display: block !important; }

  .lohe-contact-only .button--primary { display: none !important; }
  .lohe-contact-only .button--secondary { border-color: var(--lohe-manager-mocha) !important; background: var(--lohe-manager-mocha) !important; color: var(--lohe-manager-milk) !important; }
  .lohe-desktop-original-action { display: none !important; }
  .lohe-mobile-service-actions { display: flex !important; }

  body[data-page="tatuajes"] .card-grid,
  body[data-page="tatuajes"] .lohe-service-grid { grid-template-columns: 1fr !important; }

  body[data-page="tatuajes-linea-fina"] .lohe-mobile-hero-copy + .section,
  body[data-page="tatuajes-linea-fina"] .lohe-editorial__copy { color: var(--lohe-manager-charcoal) !important; }
  body[data-page="tatuajes-linea-fina"] .button--primary { border-color: var(--lohe-manager-charcoal) !important; background: var(--lohe-manager-charcoal) !important; color: var(--lohe-manager-milk) !important; }

  body[data-page="sobre-lohe"] .lohe-managed-hero .hero-inner .eyebrow,
  body[data-page="sobre-lohe"] .lohe-managed-hero .hero-actions { display: none !important; }

  .lohe-page-actions-wrap { width: calc(100% - 2rem); margin-top: 1.1rem; margin-bottom: 1.1rem; }
  .lohe-page-actions { display: flex !important; }
  .lohe-page-actions .button { flex: 1 1 12rem; }

  .lohe-lightbox { padding: 1rem; }
  .lohe-lightbox__nav { width: 2.75rem; height: 2.75rem; }
  .lohe-lightbox__nav--prev { left: .35rem; }
  .lohe-lightbox__nav--next { right: .35rem; }
  .lohe-hide-mobile { display: none !important; }
  .lohe-hide-hero-content-mobile .hero-inner { display: none !important; }

  .lohe-managed-hero.lohe-hero-mode-compact { width: calc(100% - 1.2rem); }
  .lohe-managed-hero.lohe-hero-mode-compact .hero-inner { padding: 1.5rem 1.2rem; }

  /* La cabecera móvil recupera una presencia vertical amplia. La fotografía
     se centra y se recorta sin deformarse, como en el diseño anterior. */
  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider {
    width: 100% !important;
    height: auto !important;
    min-height: 68vh !important;
    min-height: 68svh !important;
    aspect-ratio: auto;
    margin-inline: 0 !important;
    border-radius: 0 !important;
    background: var(--lohe-manager-oat) !important;
  }

  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider .lohe-gallery--context-hero,
  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider .lohe-gallery--slideshow {
    min-height: 100% !important;
  }

  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider .lohe-gallery__image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .lohe-manager-active .hero .hero-actions {
    gap: .65rem !important;
  }

  .lohe-inserted-section {
    padding-block: 1.15rem;
  }

  .lohe-inserted-section + .faq-box,
  .lohe-inserted-section + .lohe-faq-section,
  .lohe-results-gallery + .lohe-faq-section {
    margin-top: 1rem !important;
  }

  .lohe-manager-active[data-page="maquillaje-moda-tv"] .hero + .section,
  .lohe-manager-active[data-page="maquillaje-moda-tv"] .section--milk,
  .lohe-manager-active[data-page="maquillaje-eventos"] .section--eventos-photo,
  .lohe-manager-active[data-page="maquillaje-eventos"] .section--eventos-photo + .section,
  .lohe-manager-active[data-page="maquillaje-eventos"] .section--eventos-photo + .section + .section {
    padding-top: 1.35rem !important;
    padding-bottom: 1.35rem !important;
  }

  .lohe-gallery__track { grid-template-columns: repeat(var(--lohe-mobile-columns, 1), minmax(0, 1fr)); }
  .lohe-gallery__image { height: min(var(--lohe-gallery-height, 360px), 72vw); }
  .lohe-gallery--proportional { overflow: hidden; }
  .lohe-gallery--proportional .lohe-gallery__track { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .lohe-gallery--proportional .lohe-gallery__item { height: min(var(--lohe-gallery-height, 320px), 68vw); scroll-snap-align: start; }
  .lohe-gallery__arrow { width: 2.45rem; height: 2.45rem; }

  .lohe-service-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 1rem !important; overflow: visible; }
  .lohe-service-card { width: 100%; min-height: 18rem !important; }

  .lohe-editorial__row,
  .lohe-treatment-dialog__block { grid-template-columns: 1fr; gap: 1.2rem; }
  .lohe-editorial__media,
  .lohe-treatment-dialog__media { order: -1 !important; justify-items: center; }
  .lohe-editorial__media img,
  .lohe-treatment-dialog__media img { width: auto; max-width: 100%; max-height: 70vh; }

  .lohe-editorial--process {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .lohe-editorial--process .lohe-editorial__row--process-intro,
  .lohe-editorial--process .lohe-editorial__row--process-heading {
    grid-column: auto;
  }

  .lohe-editorial--process .lohe-editorial__row--process-step .lohe-editorial__media img,
  .lohe-treatment-dialog .lohe-treatment-dialog__media img {
    width: 100%;
    max-height: none;
  }

  .lohe-treatment-dialog .lohe-treatment-dialog__block {
    grid-template-columns: 1fr;
    gap: 1rem;
    margin: 1.2rem 0;
    padding: .8rem;
  }

  .lohe-treatment-dialog { width: 100%; max-width: none; max-height: 100dvh; height: 100dvh; border-radius: 0; }
  .lohe-treatment-dialog__shell { padding: 1rem; }
  .lohe-treatment-dialog__close { top: .5rem; }

  .lohe-instagram-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem; }
  .lohe-instagram-item { border-radius: .55rem; }

  .lohe-manager-active[data-page="belly-painting"] .belly-tiles { display: flex; flex-direction: column; }
  .lohe-manager-active[data-page="belly-painting"] .belly-tile:first-child { order: 1; }
  .lohe-manager-active[data-page="belly-painting"] .lohe-belly-gallery { order: 2; }
  .lohe-manager-active[data-page="belly-painting"] .belly-tile:nth-child(2) { order: 3; }
  .lohe-manager-active[data-page="belly-painting"] .belly-tiles-actions { order: 4; }
}

@media (max-width: 768px) {
  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider,
  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider .lohe-gallery--context-hero,
  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider .lohe-gallery--slideshow,
  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider .hero-inner {
    min-height: 84vh !important;
    min-height: 84svh !important;
  }
}

/* Revisión visual 1.0.6. */
.lohe-editorial-process-prelude {
  max-width: 76ch;
  margin: 0 0 clamp(1.8rem, 4vw, 3rem);
  color: var(--lohe-manager-charcoal);
}

.lohe-editorial-process-prelude p {
  margin: 0 0 clamp(1.2rem, 2.5vw, 1.8rem);
  font-size: clamp(1rem, 1.25vw, 1.13rem);
  line-height: 1.7;
}

.lohe-editorial-process-prelude h2 {
  margin: 0;
  font-family: var(--serif, serif);
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  line-height: 1.15;
}

/* Separación entre las barras de acciones y la sección siguiente. */
.lohe-manager-active[data-page="maquillaje-moda-tv"] .lohe-contact-only {
  margin-bottom: clamp(2.6rem, 5vw, 4rem);
}

.lohe-manager-active[data-page="servicios-esteticos-cejas"] .lohe-page-actions-wrap,
.lohe-manager-active[data-page="servicios-esteticos-pestanas"] .lohe-page-actions-wrap,
.lohe-manager-active[data-page="servicios-esteticos-labios"] .lohe-page-actions-wrap,
.lohe-manager-active[data-page="sobre-lohe"] .lohe-page-actions-wrap {
  margin-top: clamp(2.8rem, 5vw, 4.2rem);
  margin-bottom: clamp(2.8rem, 5vw, 4.2rem);
}

.lohe-manager-active[data-page="tatuajes-linea-fina"] .lohe-page-actions-wrap {
  margin-top: clamp(2.5rem, 5vw, 4rem);
}

/* Botones legibles incluso sobre fotografías muy claras. */
.lohe-manager-active[data-page="maquillaje-eventos"] .hero .button--secondary,
.lohe-manager-active[data-page="maquillaje-eventos"] .hero .button--secondary:hover,
.lohe-manager-active[data-page="maquillaje-eventos"] .hero .button--secondary:focus-visible,
.lohe-manager-active[data-page="tatuajes-linea-fina"] .button--primary,
.lohe-manager-active[data-page="tatuajes-linea-fina"] .button--primary:hover,
.lohe-manager-active[data-page="tatuajes-linea-fina"] .button--primary:focus-visible {
  border-color: var(--lohe-manager-charcoal) !important;
  background: var(--lohe-manager-charcoal) !important;
  color: var(--lohe-manager-milk) !important;
  box-shadow: 0 10px 26px rgba(35,35,35,.2);
}

@media (max-width: 768px) {
  /* El título de la portada queda superpuesto al pie del slider. */
  .lohe-manager-active[data-page="home"] .lohe-managed-hero.lohe-hero-mode-slider .hero-inner {
    position: absolute !important;
    inset: 0 !important;
    z-index: 5 !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 100% !important;
    padding: 1.5rem 1rem 2rem !important;
    pointer-events: none;
  }

  .lohe-manager-active[data-page="home"] .lohe-managed-hero .hero-title {
    width: min(100%, 34rem);
    padding: .9rem 1rem 1rem;
    background: rgba(251,247,244,.76);
    border: 1px solid rgba(255,255,255,.62);
    border-radius: 1rem;
    color: var(--lohe-manager-charcoal) !important;
    text-align: center;
    text-shadow: none !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }

  /* Eventos: título y acciones al pie de la fotografía. */
  .lohe-manager-active[data-page="maquillaje-eventos"] .lohe-managed-hero .hero-inner {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    min-height: inherit !important;
    padding-bottom: 1.6rem !important;
  }

  .lohe-manager-active[data-page="maquillaje-eventos"] .lohe-managed-hero .hero-inner > div {
    width: 100%;
  }

  /* Tatuajes: breadcrumb, título y botones permanecen dentro de la imagen. */
  .lohe-manager-active[data-page="tatuajes"] .lohe-managed-hero .hero-inner {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    min-height: inherit !important;
    padding-bottom: 1.6rem !important;
  }

  .lohe-manager-active[data-page="tatuajes"] .lohe-managed-hero .hero-inner > div {
    width: 100%;
  }

  .lohe-manager-active[data-page="tatuajes"] .lohe-managed-hero .eyebrow {
    display: block !important;
    margin-bottom: .7rem !important;
  }

  .lohe-manager-active[data-page="tatuajes"] .lohe-managed-hero .hero-title {
    margin-bottom: 1.15rem !important;
  }

  .lohe-manager-active[data-page="tatuajes"] .lohe-managed-hero .hero-actions {
    margin-top: 0 !important;
  }

  .lohe-manager-active[data-page="maquillaje-eventos"] .lohe-managed-hero .hero-title,
  .lohe-manager-active[data-page="tatuajes"] .lohe-managed-hero .hero-title,
  .lohe-manager-active[data-page="maquillaje-eventos"] .lohe-managed-hero .eyebrow,
  .lohe-manager-active[data-page="tatuajes"] .lohe-managed-hero .eyebrow {
    text-shadow: 0 2px 16px rgba(0,0,0,.62) !important;
  }

  .lohe-manager-active[data-page="maquillaje-moda-tv"] .lohe-contact-only,
  .lohe-manager-active[data-page="servicios-esteticos-cejas"] .lohe-page-actions-wrap,
  .lohe-manager-active[data-page="servicios-esteticos-pestanas"] .lohe-page-actions-wrap,
  .lohe-manager-active[data-page="servicios-esteticos-labios"] .lohe-page-actions-wrap,
  .lohe-manager-active[data-page="sobre-lohe"] .lohe-page-actions-wrap {
    margin-top: 2.2rem;
    margin-bottom: 2.8rem;
  }
}

/* Ajustes finales 1.0.7. */
.lohe-home-slider-title {
  display: none;
}

.lohe-manager-active[data-page="maquillaje-eventos"] .lohe-managed-hero .hero-title {
  text-shadow: none !important;
}

@media (min-width: 769px) {
  .lohe-manager-active .lohe-managed-hero.lohe-hero-mode-compact .hero-inner > div {
    width: 100% !important;
  }

  .lohe-manager-active .lohe-managed-hero.lohe-hero-mode-compact .hero-title,
  .lohe-manager-active .lohe-managed-hero.lohe-hero-mode-compact .hero-copy,
  .lohe-manager-active .lohe-managed-hero.lohe-hero-mode-compact .hero-copy--lead {
    width: 100% !important;
    max-width: none !important;
  }

  .lohe-manager-active[data-page="tatuajes-linea-fina"] .lohe-editorial-process-prelude {
    width: 100% !important;
    max-width: none !important;
  }

  .lohe-manager-active[data-page="tatuajes-linea-fina"] .lohe-editorial-process-prelude h2,
  .lohe-manager-active[data-page="tatuajes-linea-fina"] .lohe-editorial-process-prelude p {
    width: 100% !important;
    max-width: none !important;
  }
}

@media (max-width: 768px) {
  .lohe-manager-active[data-page="home"] .lohe-home-title-source {
    display: none !important;
  }

  .lohe-manager-active[data-page="home"] .lohe-home-slider-title {
    position: absolute;
    inset: 0;
    z-index: 6;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 1.5rem 1rem 2rem;
    pointer-events: none;
  }

  .lohe-manager-active[data-page="home"] .lohe-home-slider-title .hero-title,
  .lohe-manager-active[data-page="home"] .lohe-home-slider-title > h1,
  .lohe-manager-active[data-page="home"] .lohe-home-slider-title > h2 {
    display: block !important;
    width: min(100%, 34rem) !important;
    max-width: none !important;
    margin: 0 !important;
    padding: .9rem 1rem 1rem !important;
    border: 1px solid rgba(255,255,255,.68);
    border-radius: 1rem;
    background: rgba(251,247,244,.18) !important;
    color: #fff !important;
    text-align: center;
    text-shadow: 0 2px 18px rgba(20,18,17,.72) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }

  .lohe-manager-active[data-page="home"] .lohe-home-slider-title .hero-title *,
  .lohe-manager-active[data-page="home"] .lohe-home-slider-title > h1 *,
  .lohe-manager-active[data-page="home"] .lohe-home-slider-title > h2 * {
    color: #fff !important;
    text-shadow: inherit !important;
  }

  .lohe-manager-active[data-page="maquillaje-eventos"] .lohe-managed-hero .hero-title {
    text-shadow: none !important;
  }
}
