@font-face{
    font-family:HabinBatang;
    src:url('/assets/shared/fonts/gowunbatang-1.ttf') format('truetype');
    font-weight:400;
    font-display:swap;
}
.window-main .hero{
    background:#e8ede5;
    color:#304438;
}
.window-main .hero-inner{
    position:relative;
    display:flex;
    align-items:center;
    min-height:clamp(640px,calc(90svh - 96px),820px);
    isolation:isolate;
}
.window-main .hero-visual{
    position:absolute;
    inset:0 0 0 24%;
    background:#e8ede5;
    z-index:-2;
}
.window-main .hero-frame::after{
    background:linear-gradient(90deg,#e8ede5 0%,rgba(232,237,229,.65) 25%,rgba(232,237,229,.12) 58%,transparent 80%);
}
.window-main .hero-inner::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(90deg,rgba(232,237,229,.9),rgba(232,237,229,.42) 35%,transparent 65%);
    pointer-events:none;
}
.window-main .hero-copy{
    position:relative;
    width:56%;
    padding:65px 0 150px 5vw;
    color:#304438;
    background:none;
}
.window-main .hero-kicker{
    color:#526650;
    font-size:12px;
    margin-bottom:28px;
}
.window-main .hero-copy h1{
    font-family:HabinBatang,serif;
    font-weight:400;
    font-size:clamp(38px,3.5vw,56px);
    line-height:1.35;
    letter-spacing:-.045em;
    max-width:640px;
    text-wrap:balance;
}
.window-main .hero-copy h1 em{
    font-style:normal;
}
.window-main .hero-copy p{
    color:#526650;
    margin:30px 0;
    max-width:390px;
}
.window-main .hero-cta{
    color:#304438;
    background:transparent;
    border:0;
    border-bottom:1px solid #526650;
    padding:14px 0;
    gap:48px;
}
.window-main .hero-cta:hover{
    background:rgba(255,255,255,.3);
}
.window-main .hero-film-link{
    width:auto;
    max-width:350px;
    margin-top:40px;
    padding:14px 18px;
    border:0;
    background:rgba(255,255,250,.8);
    color:#304438;
    gap:12px;
}
.window-main .film-mini{
    width:68px;
}
.window-main .hero-film-link small{
    color:#5b6b56;
}
.window-main .hero-film-link>svg{
    margin-left:20px;
}
.window-main .panorama-journey{
    width:min(500px,44%);
    right:5vw;
    bottom:28px;
    color:#304438;
}
.window-main .hero-photo-caption{
    color:#304438;
    text-shadow:none;
}
.window-main .hero-controls{
    background:rgba(255,255,250,.2);
    color:#304438;
    padding:5px 8px;
    border-radius:3px;
}
.window-main .hero-controls button{
    border-color:#52665050;
    color:#304438;
    background:transparent;
}
.window-main .hero-controls button:hover{
    background:rgba(255,255,250,.3);
}
.window-main .hero-progress{
    background:#ffffffb3;
}
.window-main .hero-progress>i{
    background:#526650;
}
@media(max-width:1000px){
    .window-main .hero-copy{
        width:65%;
        padding-left:24px;
    }
    .window-main .hero-copy h1{
        font-size:42px;
    }
    .window-main .panorama-journey{
        right:24px;
        width:48%;
    }
}
@media(max-width:600px){
    .window-main .hero-inner{
        min-height:740px;
        align-items:flex-start;
    }
    .window-main .hero-visual{
        inset:180px 0 0;
        height:auto;
    }
    .window-main .hero-frame::after{
        background:linear-gradient(180deg,#e8ede5,rgba(232,237,229,.35) 38%,transparent 65%);
    }
    .window-main .hero-inner::before{
        background:linear-gradient(180deg,#e8ede5 8%,rgba(232,237,229,.9) 24%,transparent 58%);
    }
    .window-main .hero-copy{
        width:100%;
        padding:38px 24px 180px;
    }
    .window-main .hero-copy h1{
        font-size:36px;
        max-width:100%;
    }
    .window-main .hero-kicker{
        margin-bottom:18px;
    }
    .window-main .hero-copy p{
        font-size:13px;
        margin:18px 0;
    }
    .window-main .hero-cta{
        font-size:13px;
        padding:10px 0;
    }
    .window-main .hero-film-link{
        margin-top:22px;
        padding:10px 12px;
    }
    .window-main .panorama-journey{
        right:24px;
        left:24px;
        width:auto;
        bottom:22px;
    }
}
