/**
 * EMBER & IRON – BRAND UNIFICATION
 * Capa final de coherencia visual (quiet luxury 2026)
 */

/* Widgets y áreas heredadas */
.widget,
.widget_text,
.widget_nav_menu,
.widget_recent_entries,
.widget_recent_comments,
.widget_categories,
.widget_meta {
  font-family: var(--font-body, 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  font-weight: 300;
  color: var(--color-steel, #3A3F47);
}

.widget a {
  color: var(--color-ember-copper, #B87333);
  text-decoration: none;
  transition: color var(--transition-medium, 0.3s ease);
}

.widget a:hover {
  color: #ffffff;
}

/* Cards: fondo Deep Surface #1A1A1A, borde Cold Ash 12% (reservas: sin caja, contenido integrado) */
.ei-card-glass,
.ei-menu-item,
.plato-item,
.ei-menu-section,
.ritual-section .wp-block-kadence-column {
  position: relative;
  background: #1A1A1A;
  border: 1px solid rgba(184, 186, 185, 0.12);
  box-shadow: var(--shadow-subtle, 0 4px 20px rgba(0, 0, 0, 0.5));
}

/* Tipografía: títulos Cormorant Garamond, texto DM Sans (sistema EMBER & IRON) */
.site,
.site-main,
.site-footer,
.site-header,
.entry-content,
.entry-hero {
  font-family: var(--font-body, 'DM Sans', sans-serif);
}

.entry-title,
.page-title,
.kadence-page-title,
.ei-menu-title,
.menu-seccion h2,
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display, 'Cormorant Garamond', serif);
}

/* Navegación principal coherente */
.site-header .main-navigation a,
.site-header .kadence-menu a,
#primary-menu > li > a,
.primary-menu > li > a {
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.16em;
}

/* =====================
   Migración CSS adicional (Customizer)
   ===================== */

/* Logo texto más pequeño en móvil (header/footer) */
@media (max-width: 768px) {
  .ei-logo {
    font-size: 18px;
    letter-spacing: 3px;
    margin-bottom: 14px;
  }
}

/* Título del sitio en el header de Kadence (logo texto) */
@media (max-width: 768px) {
  .site-branding .site-title,
  .site-branding .site-title a {
    font-size: 18px !important;
    letter-spacing: 0.15em !important;
  }
}

/* Efecto suave para imágenes en móvil (zoom y brillo muy ligero al tocar) */
@media (max-width: 768px) {
  .entry-content img:hover,
  .wp-block-image:hover img,
  .wp-block-kadence-rowlayout img:hover,
  .kadence-image:hover img,
  img.ei-hover:hover {
    transform: scale(1.02);
  }
}

@media (max-width: 768px) {
  /* HOME – primera imagen después del hero, la que va a la derecha del texto */
  .home .entry-content > .wp-block-kadence-rowlayout:nth-of-type(2) img {
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}

@media (max-width: 768px) {
  /* HOME – sección final (La Cava):
     primero textos, luego botella, y sin efectos raros en móvil */

  /* Aseguramos layout en columna para poder cambiar el orden */
  .home .entry-content > .wp-block-kadence-rowlayout:last-of-type .kt-row-layout-inner {
    display: flex;
    flex-direction: column;
  }

  /* Columna 1 (normalmente la botella) pasa a ir debajo */
  .home .entry-content > .wp-block-kadence-rowlayout:last-of-type .wp-block-kadence-column:nth-of-type(1) {
    order: 2;
  }

  /* Columna 2 (texto de La Cava) pasa a ir arriba */
  .home .entry-content > .wp-block-kadence-rowlayout:last-of-type .wp-block-kadence-column:nth-of-type(2) {
    order: 1;
  }

  /* En esa última sección, imágenes sin transform ni hover en móvil */
  .home .entry-content > .wp-block-kadence-rowlayout:last-of-type img {
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}

/* HERO HOME – Ken Burns suave específico para móvil */
@keyframes ei-kenburns-row-mobile {
  0% {
    background-size: 102%;
    background-position: 50% 50%;
  }
  100% {
    background-size: 106%;
    background-position: 50% 50%;
  }
}

@media (max-width: 768px) {
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type {
    /* Usar la versión mobile del Ken Burns en lugar de la general */
    animation: ei-kenburns-row-mobile 26s ease-in-out infinite alternate !important;
    will-change: background-size, background-position;
  }
}

/* CAVA – botella totalmente estable en móvil (solo efecto de sombra) */
@media (max-width: 768px) {
  .cava-premium-section .bottle-img,
  .cava-premium-section .bottle-img:hover {
    transform: none !important;
    filter: drop-shadow(0 15px 50px rgba(0,0,0,0.9)) !important;
    transition: none !important;
  }
}

/* CAVA – botella y humos completamente estables en móvil */
@media (max-width: 768px) {

  /* Congelamos cualquier transform y animación en la parte visual */
  .cava-premium-section .bottle-wrapper,
  .cava-premium-section .bottle-img,
  .cava-premium-section .cava-fog,
  .cava-premium-section .cava-fog-extra,
  .cava-premium-section .bottle-shadow {
    transform: none !important;
    transition: none !important;
  }

  /* Anulamos explícitamente el hover de la botella */
  .cava-premium-section .bottle-wrapper:hover .bottle-img {
    transform: none !important;
  }

  /* Bajamos un poco los blur para que el móvil sufra menos al hacer scroll */
  .cava-premium-section .cava-fog {
    filter: blur(40px) !important;
  }

  .cava-premium-section .cava-fog-extra {
    filter: blur(60px) !important;
  }
}

/* Imágenes con liquid reveal: versión ligera en móvil (sin clip-path pesado) */
@media (max-width: 768px) {
  .ei-img-reveal {
    clip-path: none !important;
    transform: translateY(0) scale(1.02) !important;
    transition:
      transform 0.6s cubic-bezier(0.19, 1, 0.22, 1),
      opacity 0.6s ease-out !important;
  }
}

/* RITUAL – diseño premium solo en móvil */
@media (max-width: 768px) {

  /* Cada paso del ritual como “escena” bien recortada */
  .ritual-section {
    min-height: 60vh;
    padding: 72px 20px;
    background-size: cover !important;
    background-position: center center !important;
    background-attachment: scroll !important;
    margin-bottom: 32px;
  }

  /* Texto más cómodo de leer y centrado */
  .ritual-inner {
    max-width: 90%;
    margin: 0 auto;
    text-align: center;
  }

  .ritual-title {
    font-size: clamp(1.9rem, 5vw, 2.4rem);
    letter-spacing: 0.16em;
  }

  .ritual-body {
    font-size: 0.95rem;
    line-height: 1.9;
  }

  /* Overlay un poco más oscuro para que la imagen no “queme” al texto */
  .ritual-overlay {
    background: rgba(0, 0, 0, 0.55);
  }

  /* Un poco más de espacio entre tag, línea y título en móvil */
  .ritual-tag {
    margin-bottom: 1.2rem;
  }
  .ritual-accent-line {
    margin-bottom: 1.4rem;
  }
}

@media (max-width: 768px) {
  /* Ritual – ajustar título "Degustación" para que no se parta en móvil */
  .ritual-section:nth-of-type(5) .ritual-title {
    font-size: 1.7rem;
    letter-spacing: 0.14em;
  }
}

/* RITUAL – Ken Burns fuerte solo en móvil */
@keyframes ritual-mobile-pan {
  0% {
    background-size: 115%;
    background-position: 50% 60%;
  }
  100% {
    background-size: 130%;
    background-position: 50% 40%;
  }
}

@media (max-width: 768px) {
  .ritual-section {
    background-attachment: scroll !important;
    animation: ritual-mobile-pan 18s ease-in-out infinite alternate !important;
  }
}

@media (max-width: 768px) {
  .entry-hero .entry-hero-title {
    font-size: clamp(2.2rem, 7vw, 2.7rem);
    line-height: 1.1;
    letter-spacing: 0.08em;
  }

  .entry-hero .hero-section-inner-wrap {
    padding-top: 96px;
    padding-bottom: 80px;
  }
}

@media (max-width: 768px) {
  .entry-hero .entry-hero-subtitle,
  .entry-hero .entry-hero-description {
    color: rgba(245, 240, 235, 0.88);
  }
}

@media (max-width: 768px) {
  .entry-hero .entry-hero-buttons .btn-ember {
    padding: 14px 40px;
    font-size: 12px;
  }
}

/* HOME – mover la carne más arriba en el hero (todas las vistas) */
@media (prefers-reduced-motion: no-preference) {
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type {
    background-position: 50% 60% !important;
    animation: ei-kenburns-row 28s ease-in-out infinite alternate !important;
  }
}

/* Redefinimos el Ken Burns para que parta de ese encuadre más bajo */
@keyframes ei-kenburns-row {
  0% {
    background-size: 100%;
    background-position: 50% 60%;
  }
  100% {
    background-size: 115%;
    background-position: 52% 58%;
  }
}

/* HOME hero – overlay negro (#0D0D0D) a transparente para que el texto respire */
.home .entry-content > .wp-block-kadence-rowlayout:first-of-type::after {
    background: linear-gradient(to bottom, rgba(13, 13, 13, 0) 0%, #0D0D0D 100%) !important;
}

/* HOME – hero a pantalla completa y carne más arriba solo en móvil */
@media (max-width: 768px) {
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type {
    min-height: 100vh;
    background-size: cover !important;
    background-position: 50% 65% !important;
  }
}

/* HOME – títulos más compactos en móvil (menos espacio entre líneas) */
@media (max-width: 768px) {
  .home .entry-content h2,
  .home .entry-content h3 {
    line-height: 1.15;
    margin-bottom: 0.6em;
  }
}

/* HOME – ajustar títulos "Donde el hierro..." y "Cortes con nombre..." en móvil */
@media (max-width: 768px) {
  /* Segundo y tercer row de la home (tus dos secciones de texto) */
  .home .entry-content > .wp-block-kadence-rowlayout:nth-of-type(2) h2,
  .home .entry-content > .wp-block-kadence-rowlayout:nth-of-type(3) h2 {
    font-size: 1.9rem;
    line-height: 1.15;
    letter-spacing: 0.06em;
    margin-bottom: 0.5em;
  }
}

/* HOME – hacer más grande el título "RITUAL DEL FUEGO" solo en escritorio */
@media (min-width: 1025px) {
  .home .entry-content > .wp-block-kadence-rowlayout:nth-of-type(4) h2 {
    font-size: clamp(2.4rem, 3.4vw, 3rem);
    letter-spacing: 0.16em;
    line-height: 1.1;
  }
}

/* HOME – título "RITUAL DEL FUEGO" más grande solo en escritorio */
@media (min-width: 1025px) {
  .home .home-ritual-title {
    font-size: 3.2rem !important;
    letter-spacing: 0.14em;
    line-height: 1.1;
  }
}

/* HOME – ajustes del hero SOLO en tablet (769–1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  /* Fila hero de la home */
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type {
    min-height: 80vh;
    background-size: cover;
    background-position: 50% 70%;
  }

  /* Contenido interno del hero: sin padding inferior para fusión con sección siguiente */
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type .kt-row-layout-inner {
    padding-top: 80px;
    padding-bottom: 0 !important;
  }

  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type h1,
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type .entry-title {
    font-size: clamp(3rem, 4.8vw, 3.6rem);
    line-height: 1.1;
  }
}

/* HOME – Ajustes del hero solo en TABLET (769–1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  /* Fila hero (la primera row de contenido) */
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type {
    min-height: 90vh;
    background-size: cover !important;
    background-position: 50% 60% !important;
  }

  /* Contenedor del texto del hero en tablet */
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type .kt-row-layout-inner {
    padding-top: 120px;
    padding-bottom: 0 !important;
  }

  /* Título grande del hero solo en tablet */
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type h1,
  .home .entry-content > .wp-block-kadence-rowlayout:first-of-type h2 {
    font-size: clamp(2.8rem, 4vw, 3.4rem);
    line-height: 1.1;
  }
}

/* =====================
   HOME – RITUAL DEL FUEGO (HTML block)
   ===================== */

.home-ritual-video {
  position: relative;
  width: 100%;
  min-height: 650px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: var(--color-obsidian, #0D0D0D);
  font-family: var(--font-display, 'Cormorant Garamond', serif);
  margin-bottom: var(--space-3xl, 160px); /* 3XL spacing: aire de lujo tras Ritual del Fuego */
}

.home-ritual-video video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.home-ritual-overlay {
  position: absolute;
  inset: 0;
  background: none !important;
  z-index: 1;
}

.home-ritual-inner {
  position: relative;
  z-index: 2;
  padding: var(--space-sm, 16px);
  max-width: 900px;
  margin: 0 auto;
}

.home-ritual-accent {
  width: 80px;
  height: 1px;
  background: var(--color-copper, #B87333);
  margin: 0 auto var(--space-md, 24px) auto;
}

.home-ritual-subtitle {
  color: #B8BAB9;
  font-family: var(--font-body, 'DM Sans', sans-serif);
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 1.8;
  margin-bottom: 45px;
  font-size: 0.7rem;
  text-transform: uppercase;
}

.home-ritual-cta {
  margin-top: var(--space-sm, 16px);
}

@media (max-width: 768px) {
  .home-ritual-video {
    min-height: 520px;
  }

  .home-ritual-inner {
    padding: 24px var(--space-sm, 16px);
  }
}

/* =====================
   HOME – CAVA PREMIUM SECTION
   ===================== */

.cava-premium-section {
  background-color: var(--color-obsidian, #0D0D0D) !important;
  min-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  padding: 80px 5%;
}

.cava-bg-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: clamp(120px, 14vw, 240px);
  font-weight: 900;
  color: rgba(255, 255, 255, 0.08) !important;
  z-index: 1;
  pointer-events: none;
  letter-spacing: -0.3vw;
  text-transform: uppercase;
  white-space: nowrap;
  width: 100%;
  text-align: center;
  font-family: var(--font-body, 'DM Sans', sans-serif);
}

.cava-container {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 60px;
  max-width: 1200px;
  width: 100%;
  z-index: 5;
  align-items: center;
}

.cava-visual {
  position: relative;
}

.vertical-tag {
  position: absolute;
  left: -70px;
  top: 50%;
  transform: rotate(-90deg) translateY(-50%);
  color: var(--color-copper, #B87333) !important;
  font-size: 11px !important;
  letter-spacing: 5px;
  text-transform: uppercase;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0.5;
}

.bottle-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
}

.bottle-img {
  max-height: 65vh;
  position: relative;
  z-index: 10;
  filter: drop-shadow(0 15px 50px rgba(0,0,0,0.9));
  transition: transform 0.8s ease;
}

.bottle-wrapper:hover .bottle-img {
  transform: translateY(-15px);
}

.cava-fog {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 70%);
  z-index: 2;
  filter: blur(80px);
}

.cava-fog-extra {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 700px;
  height: 400px;
  background: radial-gradient(ellipse, rgba(184, 115, 51, 0.12) 0%, transparent 75%);
  z-index: 1;
  filter: blur(100px);
}

.bottle-shadow {
  position: absolute;
  bottom: -40px;
  width: 220px;
  height: 30px;
  background: radial-gradient(ellipse, rgba(184, 115, 51, 0.3) 0%, transparent 80%);
  z-index: 5;
}

.cava-h2 {
  font-size: clamp(3.5rem, 6vw, 5rem);
  color: #ffffff !important;
  margin: 10px 0;
  font-family: var(--font-display, 'Cormorant Garamond', serif);
}

.gold-divider {
  width: 60px;
  height: 1px;
  background: var(--color-copper, #B87333);
  margin: 30px 0;
}

.est-tag {
  color: var(--color-copper, #B87333) !important;
  letter-spacing: 4px;
  font-size: 12px;
  font-weight: bold;
}

.cava-description {
  color: rgba(245, 245, 245, 0.85);
  font-size: 1.15rem;
  max-width: 420px;
  line-height: 1.7;
}

@media (max-width: 900px) {
  .cava-container {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    text-align: center;
    gap: 40px;
  }

  .vertical-tag {
    display: none;
  }

  .cava-bg-title {
    font-size: 22vw;
    letter-spacing: -0.8vw;
  }

  .bottle-img {
    max-height: 45vh;
    transform: none;
    transition: none;
  }

  .bottle-wrapper:hover .bottle-img {
    transform: none;
  }
}