.home-hero .hero-wrapper { background-color: var(--primary-dark-color); min-height: 32rem; }
.home-hero .hero-content { padding: clamp(5rem, 6vw, 6rem) 0; color: var(--white-color); }
.home-hero .hero-content h2 { color: inherit; }
.home-products:not(.slick-initialized) {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
}
.home-products .menu-thumbnail {
    aspect-ratio: 4 / 5;
    overflow: hidden;
}
.home-products .menu-thumbnail img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.home-products .slick-slide { margin-inline: .75rem; }
.home-carousel .slick-dots { display: flex; justify-content: center; gap: .5rem; }
.home-carousel .slick-dots button {
    width: .75rem;
    height: .75rem;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: 0;
}
.home-carousel .slick-active button { background: currentColor; }
.home-why-us .order-bg-wrapper { background: var(--primary-dark-color); }
.home-why-us h2, .home-why-us h3 { color: var(--white-color); }
.doner-model {
    display: grid;
    place-items: center;
    min-height: 23rem;
    perspective: 750px;
    isolation: isolate;
}
.doner-poster { display: none; max-height: 23rem; object-fit: contain; }
.doner-spit {
    --radius: clamp(62px, 9vw, 92px);
    position: relative;
    width: 1px;
    height: 265px;
    transform-style: preserve-3d;
    transform: rotateY(-20deg);
}
.doner-spit::before {
    content: '';
    position: absolute;
    inset: -32px auto;
    width: 8px;
    border-radius: 4px;
    background: linear-gradient(90deg, #494949, #e9e5df 54%, #7b716a);
    transform: translateX(-50%);
}
.doner-spit span {
    position: absolute;
    inset: 0 auto;
    width: calc(var(--radius) * .57);
    backface-visibility: hidden;
    clip-path: polygon(0 3%, 50% 0, 100% 3%, 82% 63%, 68% 89%, 56% 100%, 44% 100%, 32% 89%, 18% 63%);
    transform: rotateY(calc(var(--face) * 30deg)) translateZ(var(--radius)) translateX(-50%) rotateX(-10deg);
    background:
        linear-gradient(90deg, #29100880, transparent 45%, #29100870),
        repeating-linear-gradient(174deg, #633015 0 3px, #ad6333 4px 6px, #733718 8px 12px, #d58b4c 13px 15px, #49210f 17px 19px);
}
.doner-spit span:nth-child(even) { filter: brightness(.84); background-position: 0 7px; }
@media (max-width: 991px) {
    .home-products:not(.slick-initialized) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    .home-products:not(.slick-initialized) { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .doner-model:has(.doner-poster) .doner-spit { display: none; }
    .doner-poster { display: block; }
}

.home-hero .hero-wrapper {
    --hero-overlay: linear-gradient(180deg, rgb(0 0 0 / 56%), transparent 26%),
        linear-gradient(90deg, rgb(0 0 0 / 60%), rgb(0 0 0 / 36%) 44%, transparent 80%);
}

@media (max-width: 767px) {
    .home-hero .hero-wrapper {
        --hero-overlay: linear-gradient(180deg, rgb(0 0 0 / 55%), rgb(0 0 0 / 45%) 34%, rgb(0 0 0 / 62%) 82%, rgb(0 0 0 / 40%));
    }
}

.home-process {
    background: radial-gradient(ellipse at center, #443126, var(--primary-dark-color) 70%);
    color: var(--white-color);
}
.home-process h2, .home-process h3 { color: inherit; }
.process-stage { position: relative; padding-block: 4rem; }
.process-intro { max-width: 34rem; }
.process-model { position: relative; min-width: 0; }
.process-model canvas { display: block; width: 100%; height: 100%; }
.process-model.has-webgl .doner-model { display: none; }
.process-steps {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}
.process-step img { display: block; margin: 0 auto 1rem; }
.process-step h3 { font-size: clamp(1.25rem, 2vw, 2rem); margin-bottom: .5rem; }
.process-stage.is-pinned { height: calc(100svh - var(--process-header-height, 0px)); padding-block: 0; }
.is-pinned .process-intro {
    position: absolute;
    z-index: 2;
    top: 50%;
    width: 38%;
    transform: translateY(-50%);
}
.is-pinned .process-model {
    position: absolute;
    top: 0;
    left: 25%;
    width: 50%;
    height: 100%;
}
.is-pinned .process-steps {
    position: absolute;
    inset: 15% 5%;
    grid-template-columns: minmax(0, 1fr) 1.35fr minmax(0, 1fr);
    align-items: center;
}
.is-pinned .process-step:nth-child(odd) { grid-column: 1; }
.is-pinned .process-step:nth-child(even) { grid-column: 3; }
@media (max-width: 575px) {
    .process-steps { grid-template-columns: minmax(0, 1fr); }
}
.process-model.has-webgl { height: min(64vw, 26rem); }
.is-pinned .process-model.has-webgl { height: 100%; }