:root {

    --paper: #f7f6f2;

    --paper-2: #efede7;

    --ink: #171713;

    --muted: #76736b;

    --line: rgba(23, 23, 19, .16);

    --accent: #9c7658;



    --serif: "Italiana", Georgia, serif;



    --side: clamp(24px, 5vw, 88px);

    --section: clamp(110px, 13vw, 220px);

}





.polish-l {

    font-family: "Bodoni Moda", Georgia, serif;

    font-weight: 400;

}



*,

*::before,

*::after {

    box-sizing: border-box;

}



html {

    scroll-behavior: smooth;

}



body {

    margin: 0;

    background: var(--paper);

    color: var(--ink);

    font-family: "DM Sans", sans-serif;

    font-weight: 300;

    overflow-x: hidden;

}



img {

    width: 100%;

    display: block;

}



a {

    color: inherit;

    text-decoration: none;

}



button {

    font: inherit;

}







.serif {

    font-family: var(--serif);

}



.eyebrow {

    display: flex;

    align-items: center;

    gap: 15px;



    font-size: 10px;

    font-weight: 500;

    letter-spacing: .28em;

    text-transform: uppercase;

}



.eyebrow::before {

    content: "";

    width: 32px;

    height: 1px;

    background: var(--accent);

}



h1,

h2,

h3,

p {

    margin-top: 0;

}



h1,

h2,

h3 {

    font-family: var(--serif);

    font-weight: 400;

}



h2 {

    font-size: clamp(46px, 5.4vw, 88px);

    line-height: .96;

    letter-spacing: -.02em;

}



h3 {

    font-size: clamp(30px, 3vw, 50px);

    line-height: 1;

}



p {

    font-size: 15px;

    line-height: 1.85;

    color: #656159;

}



.section-title {

    max-width: 800px;

    margin: 30px 0 90px;

}





/* ==============================================

   NAVIGATION

\============================================== */



.nav {

    position: fixed;

    z-index: 1000;



    top: 0;

    left: 0;

    right: 0;



    height: 82px;



    display: flex;

    align-items: center;

    justify-content: space-between;



    padding: 0 var(--side);



    transition:

        background .4s ease,

        height .4s ease,

        color .4s ease,

        border .4s ease;

}





.nav-on-hero {

    color: #fff;

}



.nav.scrolled {

    height: 66px;



    color: var(--ink);



    background: rgba(247, 246, 242, .90);



    backdrop-filter: blur(18px);

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



    border-bottom: 1px solid var(--line);

}



.brand {

    font-size: 11px;

    font-weight: 500;

    letter-spacing: .42em;

    white-space: nowrap;



}



.lang {

    font-size: 9px;

    font-weight: 500;

    letter-spacing: .20em;

}







.hero {

    position: relative;



    width: 100%;

    height: 100vh;

    min-height: 700px;



    overflow: hidden;



    background: #24221f;

}







.hero-video {

    position: absolute;

    z-index: 0;



    inset: 0;



    width: 100%;

    height: 100%;



    display: block;



    object-fit: cover;

    object-position: center;



    animation:

        heroVideoReveal

        1.8s

        cubic-bezier(.16, 1, .3, 1)

        forwards;

}





.hero-overlay {

    position: absolute;

    z-index: 1;



    inset: 0;



    background:

        linear-gradient(

            90deg,

            rgba(12, 12, 10, .52) 0%,

            rgba(12, 12, 10, .27) 38%,

            rgba(12, 12, 10, .05) 72%,

            rgba(12, 12, 10, .08) 100%

        );

}





.hero-overlay::after {

    content: "";



    position: absolute;

    inset: 0;



    background:

        linear-gradient(

            0deg,

            rgba(8, 8, 7, .25) 0%,

            transparent 38%

        );

}





.hero-content {

    position: absolute;

    z-index: 3;



    left: var(--side);

    bottom: clamp(120px, 16vh, 185px);



    width: min(900px, 76vw);



    color: #fff;

}





.hero-content h1 {

    margin: 0;



    max-width: 1000px;



    font-family: var(--serif);

    font-weight: 400;



    font-size: clamp(58px, 6.7vw, 116px);

    line-height: .98;

    letter-spacing: -.025em;



    color: #fff;



    text-wrap: balance;



    opacity: 0;

    transform: translateY(28px);



    animation:

        heroTextReveal

        1.2s

        .35s

        cubic-bezier(.16, 1, .3, 1)

        forwards;

}





.hero-content .hero-description {

    max-width: 520px;



    margin: 34px 0 0;



    font-size: 13px;

    font-weight: 300;

    line-height: 1.7;



    letter-spacing: .025em;



    color: rgba(255, 255, 255, .88);



    opacity: 0;

    transform: translateY(20px);



    animation:

        heroTextReveal

        1s

        .58s

        cubic-bezier(.16, 1, .3, 1)

        forwards;

}





.hero-button {

    display: inline-flex;

    align-items: center;

    justify-content: space-between;



    gap: 55px;



    min-width: 230px;



    margin-top: 30px;

    padding: 17px 20px;



    border: 1px solid rgba(255, 255, 255, .72);



    color: #fff;



    font-size: 9px;

    font-weight: 500;



    letter-spacing: .20em;

    text-transform: uppercase;



    opacity: 0;

    transform: translateY(18px);



    animation:

        heroTextReveal

        1s

        .76s

        cubic-bezier(.16, 1, .3, 1)

        forwards;



    transition:

        color .35s ease,

        background .35s ease,

        border-color .35s ease;

}





.hero-button-arrow {

    font-size: 15px;

    font-weight: 300;



    line-height: 1;



    transition: transform .35s ease;

}





.hero-button:hover {

    background: #fff;

    color: var(--ink);

    border-color: #fff;

}





.hero-button:hover .hero-button-arrow {

    transform: translateX(5px);

}





.hero-bottom {

    position: absolute;

    z-index: 3;



    left: var(--side);

    right: var(--side);

    bottom: 34px;



    display: flex;

    align-items: flex-end;

    justify-content: space-between;



    color: rgba(255, 255, 255, .72);



    font-size: 8px;

    font-weight: 400;



    letter-spacing: .24em;

    text-transform: uppercase;

}





.scroll-indicator {

    display: flex;

    align-items: center;



    gap: 16px;

}





.scroll-line {

    position: relative;



    display: block;



    width: 48px;

    height: 1px;



    overflow: hidden;



    background: rgba(255, 255, 255, .32);

}





.scroll-line::after {

    content: "";



    position: absolute;



    top: 0;

    left: 0;



    width: 50%;

    height: 1px;



    background: #fff;



    animation: scrollLine 2.2s ease-in-out infinite;

}





@keyframes heroVideoReveal {



    from {

        opacity: 0;

        transform: scale(1.045);

    }



    to {

        opacity: 1;

        transform: scale(1);

    }



}





@keyframes heroTextReveal {



    from {

        opacity: 0;

        transform: translateY(28px);

    }



    to {

        opacity: 1;

        transform: translateY(0);

    }



}





@keyframes scrollLine {



    0% {

        transform: translateX(-110%);

    }



    50% {

        transform: translateX(110%);

    }



    100% {

        transform: translateX(110%);

    }



}





.link-button {

    width: fit-content;



    display: inline-flex;

    align-items: center;

    gap: 30px;



    margin-top: 28px;

    padding: 15px 0;



    border-bottom: 1px solid var(--ink);



    font-size: 9px;

    font-weight: 500;



    letter-spacing: .23em;

    text-transform: uppercase;

}



.link-button span {

    transition: transform .3s ease;

}



.link-button:hover span {

    transform: translateX(8px);

}





.section {

    padding:

        var(--section)

        var(--side);

}



.container {

    max-width: 1500px;

    margin: 0 auto;

}







.intro {

    display: grid;

    grid-template-columns: .82fr 1.18fr;



    gap: clamp(60px, 10vw, 170px);



    align-items: center;

}



.intro-image {

    position: relative;

}



.intro-image img {

    aspect-ratio: .82;

    object-fit: cover;

}



.intro-copy {

    max-width: 680px;

}



.intro-copy h2 {

    margin: 25px 0 40px;

}



.intro-copy p {

    max-width: 570px;

}







.reveal-image {

    overflow: hidden;

}



.reveal-image img {

    transform: scale(1.08);



    transition:

        transform 1.5s cubic-bezier(.16, 1, .3, 1);

}



.reveal-image.visible img {

    transform: scale(1);

}







.gallery {

    padding:

        0

        var(--side)

        var(--section);

}



.gallery-grid {

    max-width: 1600px;

    margin: auto;



    display: grid;



    grid-template-columns:

        1.1fr

        .85fr

        .85fr;



    grid-template-rows:

        470px

        360px;



    gap: 12px;

}



.gallery-item {

    position: relative;

    overflow: hidden;

    cursor: pointer;

}



.gallery-item:first-child {

    grid-row: span 2;

}



.gallery-item img {

    height: 100%;

    object-fit: cover;



    transition:

        transform 1.1s cubic-bezier(.16, 1, .3, 1),

        filter .5s ease;

}



.gallery-item::after {

    content: "";



    position: absolute;

    inset: 0;



    background: rgba(0, 0, 0, 0);



    transition: background .5s ease;



    pointer-events: none;

}



.gallery-item:hover img {

    transform: scale(1.035);

}



.gallery-item:hover::after {

    background: rgba(0, 0, 0, .035);

}







.space {

    background: #fff;

}



.space-grid {

    display: grid;



    grid-template-columns:

        .85fr

        1.15fr;



    gap: clamp(60px, 10vw, 160px);



    align-items: center;

}



.space-copy h2 {

    margin: 24px 0 36px;

}



.space-image img {

    aspect-ratio: 1.25;

    object-fit: cover;

}







.plan-section {

    background: #f0eee8;

}



.plan-grid {

    display: grid;



    grid-template-columns:

        .7fr

        1.3fr;



    gap: clamp(50px, 8vw, 130px);



    align-items: center;

}



.plan-copy h2 {

    margin: 24px 0 36px;

}



.plan-image {

    padding: 40px;

    background: #f7f6f2;

}



.plan-image img {

    mix-blend-mode: multiply;

}





.details-grid {

    display: grid;



    grid-template-columns:

        1fr

        1fr;



    gap: 15vw;

}



.details-column {

    border-top: 1px solid var(--ink);

}



.detail {

    display: flex;

    justify-content: space-between;



    padding: 22px 0;



    border-bottom: 1px solid var(--line);

}



.detail span:first-child {

    color: #77736b;

}



.detail span:last-child {

    text-align: right;

}





.location {

    background: #fff;

}



.location-grid {

    display: grid;



    grid-template-columns:

        1fr

        .8fr;



    gap: 10vw;



    align-items: center;

}



.location-image {

    position: relative;

}



.location-image img {

    aspect-ratio: 1.12;

    object-fit: cover;

}



.location-copy h2 {

    margin: 25px 0 40px;

}



.distances {

    margin-top: 45px;

}



.distance {

    display: flex;

    justify-content: space-between;



    padding: 15px 0;



    border-bottom: 1px solid var(--line);



    font-size: 12px;

}



.distance strong {

    font-weight: 500;

}





.history-grid {

    display: grid;



    grid-template-columns:

        1fr

        1fr;



    gap: 12vw;



    align-items: center;

}



.history-image img {

    height: 700px;

    object-fit: cover;

}



.history-copy h2 {

    margin: 25px 0 40px;

}





.contact {

    padding:

        clamp(100px, 12vw, 180px)

        var(--side);



    background: #e8e2d9;

}



.contact-inner {

    max-width: 1500px;



    margin: auto;



    display: grid;



    grid-template-columns:

        1.2fr

        .8fr;



    gap: 100px;

}



.contact h2 {

    margin-bottom: 35px;



    font-size: clamp(58px, 7vw, 105px);

}



.contact-description {

    max-width: 520px;

}



.contact-details {

    align-self: end;

   padding-bottom: 20px;

}



.contact-row {

    padding: 20px 0;



    border-bottom:

        1px solid

        rgba(0, 0, 0, .2);



    display: flex;

    justify-content: space-between;



    gap: 30px;



    font-size: 16px;

}





.reveal {

    opacity: 0;



    transform: translateY(55px);



    transition:

        opacity 1.1s cubic-bezier(.16, 1, .3, 1),

        transform 1.1s cubic-bezier(.16, 1, .3, 1);

}



.reveal.visible {

    opacity: 1;

    transform: translateY(0);

}



.reveal-delay {

    transition-delay: .16s;

}





.lightbox {

    position: fixed;

    z-index: 3000;



    inset: 0;



    display: flex;

    justify-content: center;

    align-items: center;



    background: rgba(20, 19, 16, .94);



    opacity: 0;

    visibility: hidden;



    transition:

        opacity .4s ease,

        visibility .4s ease;

}



.lightbox.open {

    opacity: 1;

    visibility: visible;

}



.lightbox img {

    width: auto;



    max-width: 88vw;

    max-height: 86vh;



    object-fit: contain;

}



.lightbox-close {

    position: absolute;



    top: 30px;

    right: 40px;



    width: 50px;

    height: 50px;



    padding: 0;

    border: 0;



    background: transparent;

    color: white;



    font-size: 30px;

    font-weight: 200;



    cursor: pointer;

}





@media (max-width: 900px) {



    .hero {

        height: 100svh;

        min-height: 650px;

    }



    .hero-content {

        left: var(--side);

        right: var(--side);



        bottom: 115px;



        width: auto;

    }



    .hero-content h1 {

        font-size: clamp(48px, 10vw, 80px);

    }



    .hero-content .hero-description {

        margin-top: 25px;

    }



    .hero-button {

        margin-top: 25px;

    }



    .hero-bottom {

        bottom: 25px;

    }



    .intro,

    .space-grid,

    .plan-grid,

    .location-grid,

    .history-grid,

    .contact-inner {

        grid-template-columns: 1fr;

    }



    .gallery-grid {

        display: block;

    }



    .gallery-item {

        height: 420px;

        margin-bottom: 10px;

    }



    .history-image img {

        height: 520px;

    }



    .details-grid {

        grid-template-columns: 1fr;

        gap: 70px;

    }



    .contact-inner {

        gap: 70px;

    }

}





@media (max-width: 520px) {



    :root {

        --section: 90px;

    }



    .nav {

        height: 68px;

    }



    .brand {

        font-size: 9px;

        letter-spacing: .25em;

    }



    .lang {

        font-size: 8px;

    }



    .hero {

        min-height: 640px;

    }



    .hero-video {

        object-position: center center;

    }



    .hero-content {

        bottom: 105px;

    }



    .hero-content h1 {

        font-size: clamp(43px, 13vw, 62px);

        line-height: 1;

    }



    .hero-content .hero-description {

        max-width: 330px;



        margin-top: 22px;



        font-size: 12px;

        line-height: 1.65;

    }



    .hero-button {

        min-width: 215px;



        gap: 30px;



        padding: 15px 17px;



        font-size: 8px;

    }



    .hero-bottom > span:first-child {

        display: none;

    }



    .hero-bottom {

        justify-content: flex-end;

    }



    .gallery-item {

        height: 330px;

    }



    .plan-image {

        padding: 15px;

    }



    .contact-row {

        flex-direction: column;

        gap: 5px;

    }

}





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



    html {

        scroll-behavior: auto;

    }



    *,

    *::before,

    *::after {

        animation-duration: .01ms !important;

        animation-iteration-count: 1 !important;

        transition-duration: .01ms !important;

    }

}

.phone-link {

    color: inherit;

    text-decoration: none;

    font: inherit;

}



.phone-link:hover {

    opacity: 0.7;

}
.consent-panel[hidden] { display: none !important; }
.consent-panel {
  position: fixed; z-index: 5000; left: 24px; right: 24px; bottom: 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 32px;
  max-width: 1120px; margin: 0 auto; padding: 26px 30px;
  background: #f7f6f2; color: #171713; border: 1px solid rgba(23,23,19,.16);
  box-shadow: 0 16px 55px rgba(0,0,0,.18);
  font-family: "DM Sans", sans-serif;
}
.consent-panel__copy { max-width: 680px; }
.consent-panel h2 { font-family: "Italiana", Georgia, serif; font-size: 29px; line-height: 1.2; margin: 0 0 10px; }
.consent-panel p { font-size: 12px; line-height: 1.65; margin: 0 0 8px; color: #656159; }
.consent-panel__copy a { font-size: 11px; text-decoration: underline; text-underline-offset: 3px; }
.consent-panel__actions { display: flex; gap: 10px; flex-shrink: 0; }
.consent-button { border: 1px solid #171713; padding: 13px 17px; cursor: pointer; font: 500 11px "DM Sans",sans-serif; letter-spacing: .06em; }
.consent-button--outline { background: transparent; color: #171713; }
.consent-button--filled { background: #171713; color: #fff; }
.consent-button:focus-visible, .consent-settings:focus-visible { outline: 2px solid #9c7658; outline-offset: 3px; }
.consent-settings { position: fixed; z-index: 4999; bottom: 0; right: 12px; border: 0; padding: 5px 8px; background: rgba(247,246,242,.93); color: #555149; font: 10px "DM Sans",sans-serif; cursor: pointer; }
@media(max-width: 760px) {
 .consent-panel { left: 12px; right: 12px; bottom: 18px; padding: 20px; display: block; }
 .consent-panel h2 { font-size: 26px; }
 .consent-panel__actions { margin-top: 18px; }
 .consent-button { flex: 1; }
 .consent-settings { right: 0; }
}