/**
 * InQ House — Home
 * Solo se carga en la portada (is_front_page()).
 * Usar estas clases en los contenedores principales de Elementor.
 */

/* 01. Hero */
.home.inq-house-site .inq-home-hero {
    position: relative;
    min-height: min(840px, 92svh);
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    background: var(--inq-espresso);
    color: var(--inq-cream);
}

.home.inq-house-site .inq-home-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(15,15,14,.78) 0%, rgba(15,15,14,.35) 52%, rgba(15,15,14,.08) 100%);
}

.home.inq-house-site .inq-home-hero > .e-con-inner,
.home.inq-house-site .inq-home-hero > .elementor-container {
    position: relative;
    z-index: 1;
}

.home.inq-house-site .inq-home-hero h1 {
    max-width: 9ch;
    color: var(--inq-cream);
    font-size: var(--inq-text-hero);
}

.home.inq-house-site .inq-home-hero .inq-highlight {
    color: var(--inq-green-apple);
}

/* 02. Intro */
.home.inq-house-site .inq-home-intro {
    background: var(--inq-cream);
}

.home.inq-house-site .inq-home-intro h2 {
    max-width: 15ch;
    font-size: var(--inq-text-2xl);
}

/* 03. Mundos */
.home.inq-house-site .inq-worlds .inq-card:nth-child(1) { background: var(--inq-green-apple); }
.home.inq-house-site .inq-worlds .inq-card:nth-child(2) { background: var(--inq-green-olive); color: var(--inq-cream); }
.home.inq-house-site .inq-worlds .inq-card:nth-child(3) { background: var(--inq-espresso); color: var(--inq-cream); }
.home.inq-house-site .inq-worlds .inq-card:nth-child(4) { background: var(--inq-terracotta); color: var(--inq-cream); }

/* 04. Rituales */
.home.inq-house-site .inq-ritual-card {
    min-height: 420px;
    display: flex;
    align-items: flex-end;
    position: relative;
    overflow: hidden;
    border-radius: var(--inq-radius-lg);
}

.home.inq-house-site .inq-ritual-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 35%, rgba(15,15,14,.72) 100%);
}

.home.inq-house-site .inq-ritual-card > * {
    position: relative;
    z-index: 1;
}

/* 05. Productos */
.home.inq-house-site .inq-product-card {
    overflow: hidden;
    border: 1px solid var(--inq-color-border);
    border-radius: var(--inq-radius-md);
    background: var(--inq-white);
}

.home.inq-house-site .inq-product-card .inq-product-image {
    aspect-ratio: 4 / 3;
    overflow: hidden;
}

.home.inq-house-site .inq-product-card .inq-product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 500ms cubic-bezier(.2,.7,.2,1);
}

.home.inq-house-site .inq-product-card:hover .inq-product-image img {
    transform: scale(1.04);
}

/* 06. Espacios */
.home.inq-house-site .inq-moment-card {
    background: var(--inq-white);
}

/* 07. Manifesto */
.home.inq-house-site .inq-home-manifesto {
    background: var(--inq-espresso);
    color: var(--inq-cream);
}

.home.inq-house-site .inq-home-manifesto .inq-accent {
    color: var(--inq-green-apple);
}

/* 08. Eventos */
.home.inq-house-site .inq-event-date {
    display: inline-grid;
    place-items: center;
    min-width: 58px;
    min-height: 58px;
    border-radius: var(--inq-radius-sm);
    background: var(--inq-green-apple);
    color: var(--inq-black);
    font-family: var(--inq-font-display);
    line-height: .9;
}

/* 09. Bienestar */
.home.inq-house-site .inq-wellness {
    background: var(--inq-green-apple);
    color: var(--inq-espresso);
}

/* 10. Footer visual */
.home.inq-house-site .inq-footer {
    background: var(--inq-espresso);
    color: var(--inq-cream);
}

@media (max-width: 767px) {
    .home.inq-house-site .inq-home-hero {
        min-height: 78svh;
    }

    .home.inq-house-site .inq-home-hero::after {
        background: linear-gradient(180deg, rgba(15,15,14,.15) 15%, rgba(15,15,14,.84) 100%);
    }

    .home.inq-house-site .inq-ritual-card {
        min-height: 340px;
    }
}
