/*! © 2026 Dastan Invites, dastaninvites.com. All rights reserved. This invitation's design, code, artwork and music may not be copied, reused or resold. */

.hero {
    --pic-r: .5628;
    --lamp-l: 38.89%;
    --lamp-t: 0%;
    --lamp-w: 21.25%;
    --lamp-h: 28.71%;
    --piv-x: 51.5%;
    --piv-y: 0%;
    --swing-x: 49.84%;
    --swing-y: 0%;
    --glow-x: 49.61%;
    --glow-y: 22.47%;
    --in-l: 18.7%;
    --in-r: 83.32%;
    --in-t: 31.64%;
    --in-b: 70.69%;
    --steps: 2
}

.hero .h-dark {
    background-image: url(dark.webp)
}

.hero .h-lit,
.hero .h-light {
    background-image: url(hall.webp)
}

.hero .h-lamp-art {
    background-image: url(lamp.webp)
}

.hero .h-light:nth-child(1) {
    display: block;
    --x: 4.57%;
    --y: 85.94%;
    --rx: 11.57%;
    --ry: 13.98%;
    --step: 0
}

.hero .h-light:nth-child(2) {
    display: block;
    --x: 94.9%;
    --y: 85.77%;
    --rx: 11.78%;
    --ry: 14.16%;
    --step: 0
}

.hero .h-light:nth-child(3) {
    display: block;
    --x: 17.43%;
    --y: 81.46%;
    --rx: 9.55%;
    --ry: 10.21%;
    --step: 1
}

.hero .h-light:nth-child(4) {
    display: block;
    --x: 81.83%;
    --y: 81.46%;
    --rx: 9.34%;
    --ry: 10.21%;
    --step: 1
}

.hero .h-light:nth-child(5) {
    display: none
}

.hero .h-light:nth-child(6) {
    display: none
}

.hero .h-light:nth-child(7) {
    display: none
}

.hero .h-light:nth-child(8) {
    display: none
}

.hero .h-flame:nth-child(1) {
    display: block;
    --x: 8.51%;
    --y: 86.15%;
    --s: 13.26%
}

.hero .h-flame:nth-child(2) {
    display: block;
    --x: 91.37%;
    --y: 86.23%;
    --s: 14.37%
}

.hero .h-flame:nth-child(3) {
    display: block;
    --x: 96.8%;
    --y: 80.39%;
    --s: 15.47%
}

.hero .h-flame:nth-child(4) {
    display: block;
    --x: 2.84%;
    --y: 80.39%;
    --s: 13.82%
}

.hero .h-flame:nth-child(5) {
    display: block;
    --x: 91.26%;
    --y: 77.55%;
    --s: 4.97%
}

.hero .h-flame:nth-child(6) {
    display: block;
    --x: 8.54%;
    --y: 77.55%;
    --s: 4.97%
}

.hero .h-flame:nth-child(7) {
    display: block;
    --x: 80.3%;
    --y: 85.19%;
    --s: 12.71%
}

.hero .h-flame:nth-child(8) {
    display: block;
    --x: 19.55%;
    --y: 85.2%;
    --s: 12.71%
}

.hero .h-flame:nth-child(9) {
    display: block;
    --x: 80.18%;
    --y: 76.73%;
    --s: 3.32%
}

.hero .h-flame:nth-child(10) {
    display: block;
    --x: 19.51%;
    --y: 76.73%;
    --s: 3.32%
}

.hero .h-flame:nth-child(11) {
    display: block;
    --x: 16.58%;
    --y: 84.81%;
    --s: 6.63%
}

.hero .h-flame:nth-child(12) {
    display: block;
    --x: 83.32%;
    --y: 84.75%;
    --s: 6.08%
}

.hero .h-flame:nth-child(13) {
    display: block;
    --x: 96.84%;
    --y: 86.7%;
    --s: 3.32%
}

.hero .h-flame:nth-child(14) {
    display: block;
    --x: 3.05%;
    --y: 86.64%;
    --s: 2.76%
}

@media(min-aspect-ratio:5/8) {
    html:root .hero {
        --pic-r: .75;
        --lamp-l: 42.54%;
        --lamp-t: 0%;
        --lamp-w: 14.73%;
        --lamp-h: 28.73%;
        --piv-x: 50%;
        --piv-y: 0%;
        --swing-x: 49.91%;
        --swing-y: 0%;
        --glow-x: 49.89%;
        --glow-y: 22.25%;
        --in-l: 29.01%;
        --in-r: 71.64%;
        --in-t: 31.22%;
        --in-b: 67.68%;
        --steps: 4
    }
    html:root .hero .h-dark {
        background-image: url(dark-tab.webp)
    }
    html:root .hero .h-lit,
    html:root .hero .h-light {
        background-image: url(hall-tab.webp)
    }
    html:root .hero .h-lamp-art {
        background-image: url(lamp-tab.webp)
    }
    html:root .hero .h-light:nth-child(1) {
        display: block;
        --x: 2.85%;
        --y: 80.11%;
        --rx: 9.67%;
        --ry: 15.45%;
        --step: 0
    }
    html:root .hero .h-light:nth-child(2) {
        display: block;
        --x: 97.05%;
        --y: 80.11%;
        --rx: 9.76%;
        --ry: 15.45%;
        --step: 0
    }
    html:root .hero .h-light:nth-child(3) {
        display: block;
        --x: 9.94%;
        --y: 77.97%;
        --rx: 8.84%;
        --ry: 7.23%;
        --step: 1
    }
    html:root .hero .h-light:nth-child(4) {
        display: block;
        --x: 89.87%;
        --y: 77.97%;
        --rx: 8.84%;
        --ry: 7.23%;
        --step: 1
    }
    html:root .hero .h-light:nth-child(5) {
        display: block;
        --x: 16.39%;
        --y: 82.46%;
        --rx: 10.31%;
        --ry: 15.59%;
        --step: 2
    }
    html:root .hero .h-light:nth-child(6) {
        display: block;
        --x: 83.24%;
        --y: 82.67%;
        --rx: 10.5%;
        --ry: 15.66%;
        --step: 2
    }
    html:root .hero .h-light:nth-child(7) {
        display: block;
        --x: 25.97%;
        --y: 77.83%;
        --rx: 8.66%;
        --ry: 11.52%;
        --step: 3
    }
    html:root .hero .h-light:nth-child(8) {
        display: block;
        --x: 73.85%;
        --y: 78.04%;
        --rx: 8.84%;
        --ry: 11.72%;
        --step: 3
    }
    html:root .hero .h-flame:nth-child(1) {
        display: block;
        --x: 2.29%;
        --y: 87.14%;
        --s: 11.49%
    }
    html:root .hero .h-flame:nth-child(2) {
        display: block;
        --x: 97.59%;
        --y: 87.09%;
        --s: 11.49%
    }
    html:root .hero .h-flame:nth-child(3) {
        display: block;
        --x: 2.27%;
        --y: 76.82%;
        --s: 4.79%
    }
    html:root .hero .h-flame:nth-child(4) {
        display: block;
        --x: 97.73%;
        --y: 76.83%;
        --s: 4.79%
    }
    html:root .hero .h-flame:nth-child(5) {
        display: block;
        --x: 80.56%;
        --y: 82.16%;
        --s: 9.58%
    }
    html:root .hero .h-flame:nth-child(6) {
        display: block;
        --x: 19.21%;
        --y: 82.18%;
        --s: 9.1%
    }
    html:root .hero .h-flame:nth-child(7) {
        display: block;
        --x: 89.66%;
        --y: 78.24%;
        --s: 9.58%
    }
    html:root .hero .h-flame:nth-child(8) {
        display: block;
        --x: 10.23%;
        --y: 78.25%;
        --s: 9.58%
    }
    html:root .hero .h-flame:nth-child(9) {
        display: block;
        --x: 15.02%;
        --y: 76.74%;
        --s: 9.58%
    }
    html:root .hero .h-flame:nth-child(10) {
        display: block;
        --x: 84.75%;
        --y: 76.77%;
        --s: 9.58%
    }
    html:root .hero .h-flame:nth-child(11) {
        display: block;
        --x: 80.5%;
        --y: 74.21%;
        --s: 3.35%
    }
    html:root .hero .h-flame:nth-child(12) {
        display: block;
        --x: 19.2%;
        --y: 74.15%;
        --s: 3.83%
    }
    html:root .hero .h-flame:nth-child(13) {
        display: block;
        --x: 72.7%;
        --y: 81.51%;
        --s: 9.1%
    }
    html:root .hero .h-flame:nth-child(14) {
        display: block;
        --x: 27.5%;
        --y: 80.64%;
        --s: 9.58%
    }
}

@media(min-aspect-ratio:6/5) {
    html.is-tablet .hero {
        --pic-r: 1.3333;
        --lamp-l: 44.61%;
        --lamp-t: 0%;
        --lamp-w: 9.94%;
        --lamp-h: 31.68%;
        --piv-x: 52.78%;
        --piv-y: 0%;
        --swing-x: 49.86%;
        --swing-y: 0%;
        --glow-x: 49.63%;
        --glow-y: 23.71%;
        --in-l: 32.67%;
        --in-r: 68.02%;
        --in-t: 32.04%;
        --in-b: 69.89%;
        --steps: 3
    }
    html.is-tablet .hero .h-dark {
        background-image: url(dark-land.webp)
    }
    html.is-tablet .hero .h-lit,
    html.is-tablet .hero .h-light {
        background-image: url(hall-land.webp)
    }
    html.is-tablet .hero .h-lamp-art {
        background-image: url(lamp-land.webp)
    }
    html.is-tablet .hero .h-light:nth-child(1) {
        display: block;
        --x: 3.87%;
        --y: 79.1%;
        --rx: 8.66%;
        --ry: 22.22%;
        --step: 0
    }
    html.is-tablet .hero .h-light:nth-child(2) {
        display: block;
        --x: 94.89%;
        --y: 83.24%;
        --rx: 7.97%;
        --ry: 18.45%;
        --step: 0
    }
    html.is-tablet .hero .h-light:nth-child(3) {
        display: block;
        --x: 9.46%;
        --y: 89.59%;
        --rx: 7.35%;
        --ry: 15.78%;
        --step: 1
    }
    html.is-tablet .hero .h-light:nth-child(4) {
        display: block;
        --x: 9.46%;
        --y: 74.22%;
        --rx: 7.48%;
        --ry: 12.74%;
        --step: 1
    }
    html.is-tablet .hero .h-light:nth-child(5) {
        display: block;
        --x: 90.26%;
        --y: 87.11%;
        --rx: 7.35%;
        --ry: 13.29%;
        --step: 1
    }
    html.is-tablet .hero .h-light:nth-child(6) {
        display: block;
        --x: 90.26%;
        --y: 74.13%;
        --rx: 7.48%;
        --ry: 12.83%;
        --step: 1
    }
    html.is-tablet .hero .h-light:nth-child(7) {
        display: block;
        --x: 72.1%;
        --y: 82.87%;
        --rx: 11.97%;
        --ry: 19.92%;
        --step: 2
    }
    html.is-tablet .hero .h-light:nth-child(8) {
        display: block;
        --x: 27.97%;
        --y: 82.78%;
        --rx: 11.63%;
        --ry: 20.01%;
        --step: 2
    }
    html.is-tablet .hero .h-flame:nth-child(1) {
        display: block;
        --x: 90.28%;
        --y: 87.09%;
        --s: 5.03%
    }
    html.is-tablet .hero .h-flame:nth-child(2) {
        display: block;
        --x: 9.45%;
        --y: 87.19%;
        --s: 5.39%
    }
    html.is-tablet .hero .h-flame:nth-child(3) {
        display: block;
        --x: 90.29%;
        --y: 74.18%;
        --s: 3.23%
    }
    html.is-tablet .hero .h-flame:nth-child(4) {
        display: block;
        --x: 9.46%;
        --y: 74.23%;
        --s: 2.87%
    }
    html.is-tablet .hero .h-flame:nth-child(5) {
        display: block;
        --x: 72.96%;
        --y: 84.71%;
        --s: 5.03%
    }
    html.is-tablet .hero .h-flame:nth-child(6) {
        display: block;
        --x: 27.06%;
        --y: 84.81%;
        --s: 4.67%
    }
    html.is-tablet .hero .h-flame:nth-child(7) {
        display: block;
        --x: 24.06%;
        --y: 77.97%;
        --s: 5.03%
    }
    html.is-tablet .hero .h-flame:nth-child(8) {
        display: block;
        --x: 76.18%;
        --y: 78.17%;
        --s: 5.75%
    }
    html.is-tablet .hero .h-flame:nth-child(9) {
        display: block;
        --x: 4.72%;
        --y: 77.54%;
        --s: 4.31%
    }
    html.is-tablet .hero .h-flame:nth-child(10) {
        display: block;
        --x: 72.94%;
        --y: 75.99%;
        --s: 2.51%
    }
    html.is-tablet .hero .h-flame:nth-child(11) {
        display: block;
        --x: 95.1%;
        --y: 88.56%;
        --s: 4.31%
    }
    html.is-tablet .hero .h-flame:nth-child(12) {
        display: block;
        --x: 27.06%;
        --y: 76.05%;
        --s: 2.15%
    }
    html.is-tablet .hero .h-flame:nth-child(13) {
        display: block;
        --x: 95.25%;
        --y: 77.44%;
        --s: 2.15%
    }
    html.is-tablet .hero .h-flame:nth-child(14) {
        display: block;
        --x: 4.62%;
        --y: 88.54%;
        --s: 2.87%
    }
}