/* =========================================================
   ISTOREA EXPERIENCE THE ENERGY — v1.6.0
   Editorial six-tile gallery collage.
   Created and Designed by Kshitiz Jain
   ========================================================= */

.ixen-section,
.ixen-section *,
.ixen-section *::before,
.ixen-section *::after {
    box-sizing:border-box;
}

.ixen-section {
    --ixen-bg:#030303;
    --ixen-gold:#DDB54B;
    --ixen-white:#F4EFE7;
    --ixen-muted:#CFCAC0;

    position:relative;

    width:100% !important;
    max-width:100% !important;

    min-height:720px;

    margin:0 !important;
    padding:54px 0 42px !important;

    overflow:hidden !important;

    background:var(--ixen-bg);
    color:var(--ixen-white);

    isolation:isolate;
}

.ixen-backdrop,
.ixen-backdrop img,
.ixen-backdrop span {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
}

.ixen-backdrop {
    z-index:0;
}

.ixen-backdrop img {
    object-fit:cover;
    object-position:center;

    filter:
        saturate(.42)
        brightness(.24);

    transform:scale(1.025);

    transition:
        transform 1.1s cubic-bezier(.2,.75,.2,1);
}

.ixen-section.is-visible .ixen-backdrop img {
    transform:scale(1);
}

.ixen-backdrop span {
    background:
        radial-gradient(
            circle at 70% 42%,
            rgba(221,181,75,.055),
            transparent 31%
        ),
        linear-gradient(
            90deg,
            rgba(0,0,0,.96) 0%,
            rgba(0,0,0,.82) 25%,
            rgba(0,0,0,.66) 58%,
            rgba(0,0,0,.88) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0,0,0,.68),
            rgba(0,0,0,.88)
        );
}

.ixen-shell {
    position:relative;
    z-index:3;

    width:min(1440px, calc(100% - 48px));
    min-height:624px;

    margin:0 auto;
}

/* Left editorial copy */
.ixen-copy {
    position:absolute;
    left:0;
    top:34px;

    width:360px;

    z-index:12;

    opacity:0;
    transform:translate3d(-20px,18px,0);

    transition:
        opacity .65s ease,
        transform .72s cubic-bezier(.2,.75,.2,1);
}

.ixen-section.is-visible .ixen-copy {
    opacity:1;
    transform:none;
}

.ixen-eyebrow {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:17px;
}

.ixen-eyebrow > span {
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--ixen-gold);
    box-shadow:0 0 18px rgba(221,181,75,.35);
}

.ixen-eyebrow p {
    margin:0;

    color:rgba(246,226,171,.89);

    font-family:Arial,Helvetica,sans-serif;
    font-size:9px;
    font-weight:700;
    line-height:1;
    letter-spacing:.34em;
    text-transform:uppercase;
}

.ixen-copy h2 {
    margin:0;

    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(54px,4.55vw,78px);
    font-weight:400;
    line-height:.93;
    letter-spacing:-.045em;
    text-transform:uppercase;
}

.ixen-copy h2 span,
.ixen-copy h2 em {
    display:block;
    font-style:normal;
}

.ixen-copy h2 span {
    color:var(--ixen-white);
}

.ixen-copy h2 em {
    margin-top:9px;
    color:var(--ixen-gold);
}

.ixen-subtitle {
    margin:18px 0 0;

    color:rgba(244,239,231,.78);

    font-family:Georgia,"Times New Roman",serif;
    font-size:17px;
    line-height:1.3;
}

.ixen-mini-rule {
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:20px;
}

.ixen-mini-rule b {
    width:43px;
    height:43px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(221,181,75,.42);
    border-radius:50%;

    color:var(--ixen-gold);

    font-size:10px;
    font-weight:400;
}

.ixen-mini-rule span {
    width:84px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            rgba(221,181,75,.58),
            transparent
        );
}

/* Collage */
.ixen-collage {
    position:absolute;

    left:320px;
    right:0;
    top:0;

    height:590px;
}

.ixen-tile {
    position:absolute;

    display:block;

    overflow:hidden;

    border:1px solid rgba(255,255,255,.12);
    border-radius:15px;

    background:#080808;

    box-shadow:
        0 24px 58px rgba(0,0,0,.38);

    color:inherit;
    text-decoration:none !important;

    opacity:0;

    transform:
        translate3d(
            0,
            28px,
            0
        )
        scale(.985);

    transition:
        opacity .62s ease,
        transform .75s cubic-bezier(.2,.75,.2,1),
        border-color .28s ease,
        box-shadow .28s ease;

    will-change:auto;
}

.ixen-section.is-visible .ixen-tile {
    opacity:1;
    transform:none;
}

.ixen-section.is-visible .ixen-tile--1 {
    transition-delay:.05s;
}

.ixen-section.is-visible .ixen-tile--2 {
    transition-delay:.12s;
}

.ixen-section.is-visible .ixen-tile--3 {
    transition-delay:.18s;
}

.ixen-section.is-visible .ixen-tile--4 {
    transition-delay:.10s;
}

.ixen-section.is-visible .ixen-tile--5 {
    transition-delay:.22s;
}

.ixen-section.is-visible .ixen-tile--6 {
    transition-delay:.26s;
}

/* Approved six-tile layout */
.ixen-tile--1 {
    left:14%;
    top:90px;

    width:48%;
    height:365px;

    z-index:4;
}

.ixen-tile--2 {
    left:53%;
    top:0;

    width:23%;
    height:264px;

    z-index:7;
}

.ixen-tile--3 {
    right:0;
    top:158px;

    width:27%;
    height:256px;

    z-index:6;
}

.ixen-tile--4 {
    left:0;
    top:270px;

    width:29%;
    height:230px;

    z-index:6;
}

.ixen-tile--5 {
    left:17%;
    top:418px;

    width:32%;
    height:174px;

    z-index:8;
}

.ixen-tile--6 {
    left:48%;
    top:425px;

    width:34%;
    height:166px;

    z-index:8;
}

.ixen-media,
.ixen-media img,
.ixen-media video,
.ixen-shade {
    position:absolute;
    inset:0;

    width:100%;
    height:100%;
}

.ixen-media {
    overflow:hidden;
}

.ixen-media img,
.ixen-media video {
    display:block;

    object-fit:cover;
    object-position:center;

    background:#080808;

    transition:
        transform .7s cubic-bezier(.2,.75,.2,1),
        opacity .24s ease,
        filter .3s ease;
}

.ixen-media img {
    transform:scale(1.025);
}

.ixen-media img:not([data-ixen-loaded="1"]) {
    opacity:0;
}

.ixen-media img[data-ixen-loaded="1"] {
    opacity:1;
}

.ixen-media video {
    z-index:2;
    opacity:0;
    visibility:hidden;
    transform:none !important;
}

.ixen-tile.is-video-playing .ixen-media video {
    opacity:1;
    visibility:visible;
}

.ixen-tile.is-video-playing .ixen-media img {
    opacity:0;
}

.ixen-shade {
    z-index:3;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.07) 0%,
            rgba(0,0,0,.04) 48%,
            rgba(0,0,0,.22) 68%,
            rgba(0,0,0,.77) 100%
        );

    pointer-events:none;
}

.ixen-label {
    position:absolute;
    left:18px;
    top:17px;

    z-index:5;

    max-width:75%;
}

.ixen-label h3 {
    margin:0;

    color:var(--ixen-white);

    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    line-height:1.35;
    letter-spacing:.12em;
    text-transform:uppercase;

    text-shadow:0 2px 13px rgba(0,0,0,.7);
}

.ixen-label > span {
    display:block;
    margin-top:9px;

    color:var(--ixen-gold);

    font-size:10px;
    line-height:1;
}

.ixen-play {
    position:absolute;

    left:22px;
    bottom:19px;

    z-index:6;

    width:43px;
    height:43px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(221,181,75,.72);
    border-radius:50%;

    background:rgba(5,5,5,.58);

    color:var(--ixen-gold);

    font-size:13px;

    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);

    pointer-events:none;
}

/* CTA */
.ixen-cta-wrap {
    position:absolute;

    left:50%;
    bottom:-7px;

    z-index:14;

    transform:translateX(-50%);
}

.ixen-cta {
    min-width:300px;
    min-height:57px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:38px;

    padding:0 27px;

    border:1px solid rgba(221,181,75,.84);
    border-radius:999px;

    background:rgba(3,3,3,.78);

    color:var(--ixen-gold) !important;
    text-decoration:none !important;

    box-shadow:
        0 18px 38px rgba(0,0,0,.30);

    backdrop-filter:blur(9px);
    -webkit-backdrop-filter:blur(9px);

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

.ixen-cta span {
    font-family:Arial,Helvetica,sans-serif;
    font-size:11px;
    font-weight:700;
    line-height:1;
    letter-spacing:.2em;
    text-transform:uppercase;
}

.ixen-cta b {
    font-family:Arial,Helvetica,sans-serif;
    font-size:21px;
    font-weight:400;
    line-height:1;

    transition:transform .25s ease;
}

/* Hover */
@media (hover:hover) and (pointer:fine) {

    .ixen-tile:hover {
        border-color:rgba(221,181,75,.52);

        box-shadow:
            0 28px 64px rgba(0,0,0,.44),
            0 0 25px rgba(221,181,75,.055);
    }

    .ixen-tile:hover .ixen-media img {
        transform:scale(1.065);
    }

    .ixen-cta:hover {
        transform:translateY(-3px);

        background:rgba(221,181,75,.085);

        box-shadow:
            0 22px 46px rgba(0,0,0,.35);
    }

    .ixen-cta:hover b {
        transform:translateX(5px);
    }
}

/* Tablet */
@media (max-width:1180px) and (min-width:768px) {

    .ixen-section {
        min-height:670px;
        padding-top:42px !important;
    }

    .ixen-shell {
        width:min(1100px, calc(100% - 34px));
        min-height:580px;
    }

    .ixen-copy {
        width:290px;
        top:30px;
    }

    .ixen-copy h2 {
        font-size:clamp(44px,5vw,60px);
    }

    .ixen-collage {
        left:265px;
        height:540px;
    }

    .ixen-tile--1 {
        top:90px;
        height:335px;
    }

    .ixen-tile--2 {
        height:235px;
    }

    .ixen-tile--3 {
        top:150px;
        height:230px;
    }

    .ixen-tile--4 {
        top:265px;
        height:205px;
    }

    .ixen-tile--5 {
        top:394px;
        height:150px;
    }

    .ixen-tile--6 {
        top:398px;
        height:146px;
    }
}

/* Mobile — curated horizontal editorial gallery */
@media (max-width:767px) {

    .ixen-section {
        min-height:0;

        padding:30px 0 28px !important;
    }

    .ixen-backdrop img {
        filter:
            saturate(.38)
            brightness(.20);
    }

    .ixen-backdrop span {
        background:
            linear-gradient(
                180deg,
                rgba(0,0,0,.90),
                rgba(0,0,0,.78) 42%,
                rgba(0,0,0,.95)
            );
    }

    .ixen-shell {
        width:100%;
        min-height:0;
    }

    .ixen-copy {
        position:relative;
        left:auto;
        top:auto;

        width:calc(100% - 30px);

        margin:0 auto 22px;

        text-align:center;
    }

    .ixen-eyebrow {
        justify-content:center;
        margin-bottom:10px;
    }

    .ixen-eyebrow p {
        font-size:7.5px;
        letter-spacing:.27em;
    }

    .ixen-copy h2 {
        font-size:clamp(35px,10vw,43px);
        line-height:.95;
    }

    .ixen-copy h2 em {
        margin-top:3px;
    }

    .ixen-subtitle {
        margin-top:10px;
        font-size:13px;
    }

    .ixen-mini-rule {
        justify-content:center;
        margin-top:13px;
    }

    .ixen-mini-rule b {
        width:34px;
        height:34px;
        font-size:8px;
    }

    .ixen-mini-rule span {
        width:60px;
    }

    .ixen-collage {
        position:relative;

        left:auto;
        right:auto;
        top:auto;

        width:100%;
        height:365px;

        display:flex;
        align-items:center;

        gap:12px;

        padding:0 13vw;

        overflow-x:auto;
        overflow-y:hidden;

        scroll-snap-type:x mandatory;
        scrollbar-width:none;

        -webkit-overflow-scrolling:touch;
    }

    .ixen-collage::-webkit-scrollbar {
        display:none;
    }

    .ixen-tile,
    .ixen-tile--1,
    .ixen-tile--2,
    .ixen-tile--3,
    .ixen-tile--4,
    .ixen-tile--5,
    .ixen-tile--6 {
        position:relative;

        left:auto;
        right:auto;
        top:auto;

        flex:0 0 74vw;

        width:74vw;
        height:340px;

        border-radius:17px;

        scroll-snap-align:center;
    }

    .ixen-label {
        left:15px;
        top:15px;
    }

    .ixen-label h3 {
        font-size:8.5px;
    }

    .ixen-play {
        left:17px;
        bottom:16px;

        width:39px;
        height:39px;

        font-size:11px;
    }

    .ixen-media img {
        transform:none !important;
    }

    .ixen-cta-wrap {
        position:relative;

        left:auto;
        bottom:auto;

        margin:22px auto 0;

        transform:none;

        text-align:center;
    }

    .ixen-cta {
        width:min(300px, calc(100% - 40px));
        min-width:0;
        min-height:52px;

        margin:0 auto;

        gap:28px;
    }

    .ixen-cta span {
        font-size:9.5px;
    }
}

@media (max-width:390px) {

    .ixen-section {
        padding-top:26px !important;
    }

    .ixen-copy h2 {
        font-size:33px;
    }

    .ixen-collage {
        height:340px;
        padding:0 12vw;
    }

    .ixen-tile,
    .ixen-tile--1,
    .ixen-tile--2,
    .ixen-tile--3,
    .ixen-tile--4,
    .ixen-tile--5,
    .ixen-tile--6 {
        flex-basis:76vw;

        width:76vw;
        height:318px;
    }
}

@media (prefers-reduced-motion:reduce) {

    .ixen-copy,
    .ixen-tile,
    .ixen-backdrop img,
    .ixen-media img,
    .ixen-media video,
    .ixen-cta,
    .ixen-cta b {
        transition:none !important;
    }

    .ixen-copy,
    .ixen-tile {
        opacity:1 !important;
        transform:none !important;
    }
}