/* Shared Web Forms design: desktop, mobile and component rules in original cascade order. */
/* page.desktop.base.css — retained site styles */
:root {--primary-color: #151a1e;
    
    --secondary-color: #e9e0d2;
    --header-font: Argesta;
    --content-font: Poppins, sans-serif;
    --transition: 0.2s ease-in-out all;
    --default-border: 1px solid rgba(255,255,255,0.3);
    --line-soft: rgba(232, 222, 207, .63);
    --brass: #b89a65;}
* {box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    font-weight: initial;
    padding: 0;
    margin: 0;}
html,
body {font-size: 16px;
    overflow-x: hidden;}
html,
body {scrollbar-width: thin; scrollbar-color: rgba(184, 154, 101, .4) #0b0d0d;}
html::-webkit-scrollbar,
body::-webkit-scrollbar {width: 8px;}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {background: #0b0d0d;}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {border: 2px solid #0b0d0d;
    border-radius: 8px;
    background: rgba(184, 154, 101, .5);}
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {background: rgba(184, 154, 101, .76);}
#pageNavigation {scrollbar-width: thin; scrollbar-color: rgba(184, 154, 101, .35) transparent;}
#pageNavigation::-webkit-scrollbar {width: 5px;}
#pageNavigation::-webkit-scrollbar-track {background: transparent;}
#pageNavigation::-webkit-scrollbar-thumb {border-radius: 5px; background: rgba(184, 154, 101, .4);}
body {margin: 0;
    padding: 0;
    font-family: var(--content-font);
    min-height: 100dvh;
    line-height: 1.5;
    background: #151a1e;}
#pageNavigation {position: fixed;
    z-index: 3;
    top: 0;
    bottom: 0;
    right: 0;
    width: 25vw;
    display: flex;
    align-items: center;
    padding-left: 4vw;
    opacity: 0;
    transform: translateY(-8px);
    filter: blur(10px);
    transition: opacity 1.4s ease, transform 1.4s cubic-bezier(.19, .8, .25, 1), filter 1.6s ease;}
#pageNavigation.is-visible {opacity: 1;
        transform: translateY(0);
        filter: blur(0);}
.hero {position: fixed;
    z-index: -1;
    display: block;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;}
.heroImage {display: block;
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 100%;
    opacity: 0;
    transform: scale(1.08);
    filter: blur(20px);
    transition: opacity 2.4s ease, transform 8s cubic-bezier(.19,.8,.25,1), filter 3.2s ease;}
.heroImage.is-visible {opacity: 1;
        transform: scale(1.00);
        filter: blur(0);}
.nextChapter {width: min(100%, 980px);
    position: relative;
    margin-top: clamp(8px, 2vw, 28px);
    border-top: 1px solid rgba(232, 222, 207, .32);}
.nextChapter::before {content: "";
    position: absolute;
    top: -1px;
    left: 0;
    width: clamp(48px, 5vw, 84px);
    height: 1px;
    background: var(--brass);
    pointer-events: none;}
.nextChapter a {display: block;
    padding: clamp(34px, 3.5vw, 58px) 0 clamp(38px, 4vw, 66px);
    color: var(--secondary-color);
    font-family: var(--header-font);
    font-size: clamp(1.7rem, 2.1vw, 2.6rem);
    line-height: 1.08;
    text-decoration: none;
    transition: color .45s ease;}
.nextChapter a:hover,
.nextChapter a:focus-visible {color: #fff;}
.nextChapter a:focus-visible {outline: 1px solid var(--brass); outline-offset: 9px;}
.chapter-title {display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(14px, 1.5vw, 22px);
    transition: transform .65s cubic-bezier(.19,.8,.25,1);}
.nextChapter a:hover .chapter-title,
.nextChapter a:focus-visible .chapter-title {transform: translateX(8px);}
.chapter-preview {display: block;
    max-width: 36rem;
    margin-top: clamp(18px, 1.8vw, 26px);
    color: rgba(233, 224, 210, .72);
    font: 300 clamp(.85rem, .84vw, .98rem)/1.7 var(--content-font);
    letter-spacing: .015em;
    transition: color .45s ease;}
.nextChapter a:hover .chapter-preview,
.nextChapter a:focus-visible .chapter-preview {color: rgba(233, 224, 210, .9);}
.reservation {position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: 18px 0 16px 0;
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    color: rgba(255,255,255,0.72);
    background: transparent;
    border: none;
    overflow: hidden;
    transition: color 0.45s ease, opacity 0.45s ease, letter-spacing 0.45s ease;
    opacity: 0.88;
    cursor: pointer;
    margin-top: 5vh;}
.reservation::after {content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 1px;
        background: linear-gradient( 90deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.18) 20%, rgba(255,255,255,0.55) 50%, rgba(255,255,255,0.18) 80%, rgba(255,255,255,0.02) 100% );
        opacity: 0.45;
        transform: scaleX(0.92);
        transition: opacity 0.5s ease, transform 0.5s ease, filter 0.5s ease;}
.reservation::before {content: "";
        position: absolute;
        bottom: -1px;
        left: -35%;
        width: 30%;
        height: 3px;
        background: radial-gradient( ellipse at center, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.35) 45%, rgba(255,255,255,0) 100% );
        filter: blur(4px);
        opacity: 0;
        transition: left 1.2s cubic-bezier(.19,.8,.25,1), opacity 0.6s ease;}
.reservation:hover {color: rgba(255,255,255,0.96);
        letter-spacing: 0.34em;
        opacity: 1;}
.reservation:hover::after {opacity: 0.75;
            transform: scaleX(1);
            filter: blur(0.2px);}
.reservation:hover::before {left: 105%;
            opacity: 1;}
.heroContent {position: fixed;
    bottom: 10vh;
    left: 15vw;
    right: 30vw;}
#content {position: relative;
    z-index: 2;
    display: flex;
    margin-top: 100dvh;
    padding: 20vw 50vh;
    padding-left: 18vw;
    padding-right: 47vw;
    gap: 5vh;
    flex-direction: column;}
@media (min-width: 1181px) {
#content {padding-bottom: clamp(96px, 10vw, 165px);}
}
#content::before {content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        backdrop-filter: blur(10px) saturate(80%);
        -webkit-backdrop-filter: blur(10px) saturate(80%);
        mask-image: linear-gradient( to bottom, transparent 0, rgba(0,0,0,0.15) 4vh, rgba(0,0,0,0.45) 10vh, rgba(0,0,0,0.75) 18vh, black 25vh, black 100% );
        -webkit-mask-image: linear-gradient( to bottom, transparent 0, rgba(0,0,0,0.15) 4vh, rgba(0,0,0,0.45) 10vh, rgba(0,0,0,0.75) 18vh, black 25vh, black 100% );
        background: rgba(0, 0, 0, 0.45);}
#content p {color: var(--secondary-color);
        font-size: 1rem;
        line-height: 1.85;
        margin-top: 5vh;}
#content h2 {max-width: 840px;
        color: var(--secondary-color);
        font-family: var(--header-font);
        font-size: clamp(2.35rem, 3.7vw, 4.5rem);
        font-weight: 400;
        letter-spacing: -.025em;
        line-height: .98;}
.sectionImage {width: 90vw;
    height: 62vh;
    margin-left: -23vw;
    margin-right: -50vw;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    overflow: hidden;
    mask-image: linear-gradient(90deg, transparent 0%, black 14%, black 86%, transparent 100%), linear-gradient(180deg, transparent 0%, black 18%, black 82%, transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 14%, black 86%, transparent 100%), linear-gradient(180deg, transparent 0%, black 18%, black 82%, transparent 100%);
    mask-composite: intersect;
    -webkit-mask-composite: source-in;
    transform: scale(1.04) translateY(40px);
    filter: blur(18px);
    transition: opacity 2s ease, transform 3.5s cubic-bezier(.19,.8,.25,1), filter 3.5s ease;}
.sectionImage.is-visible {opacity: 1;
        transform: scale(1) translateY(0);
        filter: blur(0);}
.sectionImage::after {content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at center, transparent 0%, rgba(0,0,0,0.52) 85%), rgba(8, 14, 18, 0.16);
        pointer-events: none;}
.sectionCaption {position: absolute;
    z-index: 2;
    isolation: isolate;
    left: 23vw;
    max-width: 15vw;
    bottom: 15vh;
    color: rgba(250, 245, 237, 0.94);
    font-size: 0.72rem;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(10px);
    filter: blur(8px);
    transition: opacity 2.2s ease, transform 2.8s cubic-bezier(.19, .8, .25, 1), filter 2.8s ease;
    text-shadow: 0 1px 14px rgba(0, 0, 0, .7);}
.sectionCaption::before {content: "";
    position: absolute;
    z-index: -1;
    inset: -38px -52px;
    background: radial-gradient(ellipse at 45% 50%, rgba(7, 10, 11, .77) 0%, rgba(7, 10, 11, .58) 48%, transparent 82%);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    -webkit-mask-image: radial-gradient(ellipse at 45% 50%, #000 0%, #000 40%, transparent 83%);
    mask-image: radial-gradient(ellipse at 45% 50%, #000 0%, #000 40%, transparent 83%);
    pointer-events: none;}
.sectionImage.is-visible .sectionCaption {opacity: 1;
    transform: translateY(0);
    filter: blur(0);
    transition-delay: 0.8s;}
.quietNote {position: relative;}
.heroContent h1,
.statementHeader {font-family: var(--header-font);
    color: var(--secondary-color);
    max-width: 35vw;
    
    font-size: clamp(3.4rem, 5.5vw, 6.6rem);
    font-weight: 400;
    letter-spacing: -.035em;
    line-height: .92;
    text-wrap: balance;}
.tastingOptions {margin: 28px 0 44px;
    color: var(--secondary-color);}
.tastingOptionsList {margin-top: 26px;}
.tastingOption {display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: 22px 0;}
.tastingOption + .tastingOption {border-top: 1px solid rgba(232,222,207,.18);}
.tastingOption h3 {margin: 0;
    color: var(--secondary-color);
    font: 400 clamp(1.7rem, 2.5vw, 2.3rem)/1.12 var(--header-font);
    letter-spacing: -.02em;}
#content .tastingOption .tastingMoments {margin: 9px 0 0;
    color: rgba(233,224,210,.7);
    font: 300 .76rem/1.5 var(--content-font);
    letter-spacing: .07em;}
#content .tastingOption .tastingPrice {margin: 0;
    color: var(--secondary-color);
    font: 400 clamp(1.7rem, 2.5vw, 2.3rem)/1.12 var(--header-font);
    text-align: right;
    white-space: nowrap;}
.tastingPrice span {display: block;
    margin-top: 9px;
    color: rgba(233,224,210,.7);
    font: 300 .68rem/1.5 var(--content-font);
    letter-spacing: .04em;}
#content .tastingOptions .tastingPriceNote {margin: 14px 0 0;
    color: rgba(233,224,210,.7);
    font: 300 .76rem/1.6 var(--content-font);}
.menuExperienceSummary {display: flex;
    flex-direction: column;
    gap: 7px;
    color: var(--secondary-color);
    font: 300 .82rem/1.65 var(--content-font);
    letter-spacing: .01em;}
.menuExperienceSummary small {margin-top: 3px;
    color: rgba(233,224,210,.7);
    font-size: .7rem;}
@media (max-width: 600px) {
.tastingOptions {margin: 12px 0 28px;}
.tastingOption {gap: 16px; padding: 20px 0;}
}
.hero::after {position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(11, 13, 12, .98) 0%, rgba(11, 13, 12, .84) 28%, rgba(11, 13, 12, .26) 64%, rgba(11, 13, 12, .16) 100%), linear-gradient(0deg, rgba(11, 13, 12, .88) 0%, transparent 42%, rgba(11, 13, 12, .22) 100%);
    content: "";}
.sectionImage.teamImage.is-visible {filter: brightness(1.27) contrast(1.06) saturate(1.06);}
.sectionImage.teamImage::after {background: radial-gradient(circle at center, transparent 8%, rgba(0,0,0,.26) 100%), rgba(31,19,10,.045);}
.statementHeader {font-size: 3.5rem;
    display: block;
    line-height: initial;
    color: var(--line-soft);
    margin-top: 5vh;}
.languageSwitch {position: absolute;
    right: 3vw;
    bottom: 5vh;
    display: flex;
    gap: 12px;
    color: var(--secondary-color);
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .16em;}
.languageSwitch span {color: var(--brass);}
.languageSwitch a {color: var(--secondary-color); opacity: .7; text-decoration: none;}
.languageSwitch a:hover {opacity: 1;}
#pageNavigation .installAppButton {display: inline-flex;
    align-items: center;
    gap: 10px;
    align-self: flex-start;
    margin-top: 24px;
    padding: 13px 0 0;
    border: 0;
    border-top: 1px solid rgba(232, 222, 207, .25);
    background: transparent;
    color: var(--line-soft);
    font-family: var(--content-font);
    font-size: .72rem;
    letter-spacing: .13em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s ease;}
#pageNavigation .installAppButton[hidden] {display: none;}
#pageNavigation .installAppButton:hover,
#pageNavigation .installAppButton:focus-visible {color: #fff;}
.installAppMark {color: var(--brass); font-size: 1rem; line-height: 1;}
.installAppDialog {width: min(420px, calc(100vw - 40px));
    margin: auto;
    padding: 35px;
    border: 1px solid rgba(232, 222, 207, .25);
    background: #101313;
    color: var(--secondary-color);
    box-shadow: 0 30px 100px rgba(0,0,0,.6);}
.installAppDialog::backdrop {background: rgba(0,0,0,.72); backdrop-filter: blur(8px);}
.installAppDialog h2 {font-family: var(--header-font); font-size: 2.2rem; font-weight: 400; line-height: 1.08;}
.installAppDialog p {margin: 20px 0 28px; color: var(--line-soft); font: 1rem/1.55 var(--content-font);}
.installAppDialog button {padding: 12px 0; border: 0; border-bottom: 1px solid var(--brass); background: none; color: var(--secondary-color); font: .75rem var(--content-font); letter-spacing: .16em; text-transform: uppercase; cursor: pointer;}
@media (min-width: 1181px) {
#pageNavigation nav {width: min(100%, 300px);}
#pageNavigation nav::before {content: "Discover the evening";
        display: block;
        margin: 4px 0 7px;
        padding-bottom: 9px;
        color: var(--brass);
        font-size: .65rem;
        font-weight: 600;
        letter-spacing: .17em;
        border-bottom: 1px solid rgba(232, 222, 207, .25);}
html[lang="sl"] #pageNavigation nav::before {content: "Odkrijte večer";}
#pageNavigation nav .reservation {order: -1;
        display: flex;
        width: 100%;
        min-height: 68px;
        margin: 0 0 28px;
        padding: 0 20px;
        border: 1px solid rgba(184, 154, 101, .7);
        background: linear-gradient(105deg, rgba(184, 154, 101, .23), rgba(184, 154, 101, .07));
        color: #f2e8d8;
        opacity: 1;
        font-family: var(--content-font);
        font-size: .86rem;
        font-weight: 600;
        letter-spacing: .12em;
        box-shadow: 0 12px 36px rgba(0, 0, 0, .2);
        transition: color .25s, background .25s, border-color .25s;}
#pageNavigation nav .reservation::before,
#pageNavigation nav .reservation::after {display: none;}
#pageNavigation nav .reservation:hover,
#pageNavigation nav .reservation:focus-within {color: #0b0d0d;
        background: #b89a65;
        border-color: #b89a65;
        letter-spacing: .12em;}
#pageNavigation nav .reservation-title {display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 0; border: 0; background: none; color: inherit; font: inherit; letter-spacing: inherit; text-align: left; cursor: pointer;}
#pageNavigation nav .reservation-title:focus-visible {outline: 2px solid var(--brass); outline-offset: 4px;}
#pageNavigation nav .reservation-title::after {content: "↗"; float: right; font-size: 1.05rem; line-height: 1;}
#pageNavigation nav a {padding: 9px 0 11px;
        border-bottom: 1px solid rgba(232, 222, 207, .12);
        line-height: 1.22;
        text-shadow: 0 1px 14px rgba(0, 0, 0, .6);
        transition: color .25s, border-color .25s, transform .25s;}
#pageNavigation nav a:hover {color: #f2e8d8;
        border-bottom-color: rgba(184, 154, 101, .75);
        letter-spacing: 1px;
        transform: translateX(3px);}
}
.reservation-intro {display: none;}
@media (min-width: 1181px) {
#pageNavigation nav::before {content: "Explore"; margin: 0 0 8px; padding: 0; border: 0;}
html[lang="sl"] #pageNavigation nav::before {content: "Odkrijte";}
#pageNavigation nav .reservation {flex-direction: column;
        align-items: flex-start;
        min-height: 0;
        margin-bottom: clamp(42px, 5vh, 64px);
        padding: 0 0 20px;
        border: 0;
        border-bottom: 1px solid rgba(184, 154, 101, .72);
        background: none;
        color: #e9e0d2;
        box-shadow: none;
        overflow: visible;
        letter-spacing: normal;
        transition: color .25s, border-color .25s;}
#pageNavigation nav .reservation:hover,
#pageNavigation nav .reservation:focus-within {color: #fff;
        background: none;
        border-color: rgba(232, 222, 207, .8);
        letter-spacing: normal;}
#pageNavigation nav .reservation-intro {display: block;
        margin-bottom: 8px;
        color: var(--brass);
        font: 600 .62rem var(--content-font);
        letter-spacing: .16em;
        text-transform: uppercase;}
#pageNavigation nav button.reservation-title {display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        padding: 0;
        color: inherit;
        font: 400 clamp(1.45rem, 1.55vw, 1.9rem)/1.1 var(--header-font);
        letter-spacing: -.025em;
        text-align: left;
        text-transform: none;}
#pageNavigation nav .reservation-powered {display: block;
        margin-top: 10px;
        color: rgba(232, 222, 207, .58);
        font: 300 .62rem/1.3 var(--content-font);
        letter-spacing: .04em;}
#pageNavigation nav .reservation-title::after {content: none;}
#pageNavigation nav .reservation-title:focus-visible {outline: 1px solid var(--brass); outline-offset: 7px;}
#pageNavigation nav > a {padding: 6px 0 7px;
        border-bottom: 0;
        font-size: .78rem;
        line-height: 1.28;
        letter-spacing: .08em;}
#pageNavigation nav > a:hover {letter-spacing: .08em;}
#pageNavigation nav a[href$="/gift-certificate"],
#pageNavigation nav a[href$="/darilni-bon"] {margin-top: 14px; padding-top: 20px; border-top: 1px solid rgba(232, 222, 207, .2);}
}
@media (min-width: 1181px) {
#pageNavigation {align-items: flex-start;
        overflow-y: auto;
        padding-top: clamp(136px, 14vh, 185px);
        padding-bottom: 80px;
        scrollbar-width: thin;}
#pageNavigation nav {min-height: calc(100dvh - clamp(136px, 14vh, 185px) - 80px);}
#pageNavigation .languageSwitch {top: clamp(65px, 7vh, 90px);
        left: 4vw;
        right: auto;
        bottom: auto;}
}
#pageNavigation nav .menuDetails {width: 100%;
    order: 6;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid rgba(232, 222, 207, .2);
    color: rgba(232, 222, 207, .68);
    font: 400 .76rem/1.42 var(--content-font);
    letter-spacing: .015em;
    text-transform: none;}
#pageNavigation nav .menuRecognitions {font-size: clamp(.64rem, .62vw, .76rem); line-height: 1.5;}
#pageNavigation nav .menuRecognitions h2 {margin: 0 0 7px;
    color: var(--brass);
    font: 600 .68rem/1.3 var(--content-font);
    letter-spacing: .15em;
    text-transform: uppercase;}
#pageNavigation nav .menuRecognitions ul {padding: 0; margin: 0; list-style: none;}
#pageNavigation nav .menuRecognitions li {margin: 0 0 5px; white-space: nowrap;}
#pageNavigation nav .menuRecognitions li span {color: rgba(232, 222, 207, .55);}
@media (min-width: 1181px) {
#pageNavigation nav .menuDetails {margin-top: auto;}
}
#content .statementHeader {max-width: 35vw;
    font-size: 3.5rem;
    line-height: initial;
    color: var(--line-soft);}
body[data-type="experience"] .heroContent h1 {margin-bottom: clamp(18px, 2vw, 30px);}
body[data-type="experience"] #content .sectionEyebrow {margin-bottom: 14px;}
body[data-type="experience"] #content h2:not(.statementHeader) {margin-bottom: 18px;}
body[data-type="experience"] #content .menuMovement h3 {margin-bottom: 18px;}
.heroContent h2 {color: var(--secondary-color);
    max-width: 30vw;
    font-size: 1rem;
    letter-spacing: 1px;
    opacity: 0;
    transform: translateY(12px);
    filter: blur(12px);
    transition: opacity 2.2s ease, transform 2.2s cubic-bezier(.19,.8,.25,1), filter 2.8s ease;}
.heroContent h2.is-visible {opacity: 1;
        transform: translateY(0);
        filter: blur(0);}
.word-fade .word {display: inline-block;
    opacity: 0;
    transform: translateY(14px);
    filter: blur(10px);
    transition: opacity var(--duration) ease, transform var(--duration) ease, filter var(--duration) ease;
    transition-delay: var(--delay);}
.word-fade.is-visible .word {opacity: 1;
    transform: translateY(0);
    filter: blur(0);}
.reservation-title {text-transform: uppercase;}
#pageNavigation nav button.reservation-title {width: 100%; border: 0; background: none; cursor: pointer;}
nav {text-transform: uppercase;
    display: flex;
    flex-direction: column;}
nav a {letter-spacing: 1px;
        padding: 8px 0;
        transition: var(--transition);}
nav a:hover:not(.link-header:hover) {letter-spacing: 5px;
            color: #ffffff;}
a {text-decoration: none;
    color: var(--secondary-color);}
h1 {margin-bottom: 32px;}
#logo {display: block;
    position: fixed;
    width: clamp(112px, 7.2vw, 142px);
    aspect-ratio: 1567 / 1004;
    top: 12vh;
    left: 7vw;
    opacity: 0;
    transform: translateY(-8px);
    filter: blur(10px);
    transition: opacity 1.4s ease, transform 1.4s cubic-bezier(.19, .8, .25, 1), filter 1.6s ease;
    z-index: 3;}
#logo.is-visible {opacity: 0.76;
        transform: translateY(0);
        filter: blur(0);}
#logo svg polygon {fill: #e9e0d2;}
#logo svg {display: block; width: 100%; height: auto;}
#logo.is-away {opacity: 0;
        pointer-events: none;}
.imageEssay {position: relative;
    display: flex;
    width: 90vw;
    min-height: 100vh;
    margin-left: -18vw;
    padding: clamp(120px, 16vh, 180px) 18vw;
    align-items: flex-end;
    
    overflow: hidden;}
@media (min-width: 1181px) {
.imageEssay.fullBleed {width: 100vw;}
}
.imageFrame {position: absolute;
    z-index: 0;
    inset: 0;
    min-height: 100%;
    background-position: center;
    background-size: cover;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%);}
.imageFrame::after {position: absolute;
        inset: 0;
        background: linear-gradient(270deg, rgba(11, 13, 12, .92) 0%, rgba(11, 13, 12, .64) 32%, transparent 72%), linear-gradient(180deg, rgba(11, 13, 12, .46) 0%, transparent 22%, transparent 68%, rgba(11, 13, 12, .58) 100%);
        content: "";}
.imageEssayCopy {position: relative;
    z-index: 2;
    display: flex;
    width: min(43vw, 620px);
    flex-direction: column;
    gap: 26px;}
.imageEssayCopy p {margin-top: initial !important;}
.imageEssay.reverse {justify-content: flex-start;}
.imageEssay.reverse .imageFrame::after {background: linear-gradient(90deg, rgba(11, 13, 12, .92) 0%, rgba(11, 13, 12, .64) 32%, transparent 72%), linear-gradient(180deg, rgba(11, 13, 12, .46) 0%, transparent 22%, transparent 68%, rgba(11, 13, 12, .58) 100%);}
@media (min-width: 1181px) {
.imageEssay.reverse.fullBleed .imageFrame::after {background: linear-gradient(270deg, rgba(11, 13, 12, .72), transparent 29%),
                    linear-gradient(90deg, rgba(11, 13, 12, .92), rgba(11, 13, 12, .57) 32%, transparent 72%),
                    linear-gradient(180deg, rgba(11, 13, 12, .46), transparent 22%, transparent 68%, rgba(11, 13, 12, .58));}
}
.eyebrow,
.sectionEyebrow,
.footerEyebrow,
.footerHeading {display: block;
    color: var(--brass);
    font-size: .75rem;
    letter-spacing: .25em;
    text-transform: uppercase;
    font-weight: 600;}
.storyGrid {display: flex;
    width: 90vw;
    margin-left: -18vw;
    flex-direction: column;
    gap: 0;
    background: transparent;}
.storyCard {position: relative;
    isolation: isolate;
    display: flex;
    min-height: 92vh;
    padding: clamp(110px, 16vh, 180px) 56% clamp(110px, 16vh, 180px) 18vw;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    background: var(--night);}
.storyCard:nth-child(even) {padding-right: 15vw;
        padding-left: 25%;}
.storyCard::before {position: absolute;
        z-index: -2;
        inset: 0;
        background: var(--story-image) center / cover no-repeat;
        content: "";
        filter: saturate(.78);
        transition: filter .8s ease, transform 1.3s var(--ease-soft);
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
        mask-image: linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%);}
.storyCard::after {position: absolute;
        z-index: -1;
        inset: 0;
        background: linear-gradient(90deg, rgba(11, 13, 12, .94) 0%, rgba(11, 13, 12, .58) 38%, transparent 72%), linear-gradient(180deg, rgba(11, 13, 12, .58) 0%, transparent 24%, transparent 68%, rgba(11, 13, 12, .72) 100%);
        content: "";}
.storyCard h3 {position: relative;
        z-index: 2;
        max-width: 540px;
        margin: 38px 0 18px;
        font-family: var(--header-font);
        font-size: clamp(3rem, 4.4vw, 5.4rem);
        letter-spacing: -.025em;
        line-height: .95;}
.storyCard p {position: relative;
        z-index: 2;
        max-width: 500px;
        color: var(--vellum-soft);
        font-size: .98rem;}
.storyLink {position: relative;
    z-index: 2;
    display: inline-block;
    margin-top: 27px;
    color: var(--brass);
    font-size: .68rem;
    letter-spacing: .16em;
    text-transform: uppercase;}
.storyNumber {position: relative;
    z-index: 2;
    color: var(--brass);
    font-size: .72rem;
    letter-spacing: .2em;}
.recognition {width: min(100%, 1080px);
    padding: 35vh 0;
    background: radial-gradient(circle at 85% 10%, rgba(142, 51, 75, .12), transparent 35%), var(--charcoal);}
.imageEssayCopy p,
.quietNote p,
.recognition p {color: var(--vellum-soft);
        font-size: .98rem;
        line-height: 1.85;}
#reservations {position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: stretch;
    justify-content: center;
    opacity: 0;
    z-index: 100;
    pointer-events: none;
    transition: opacity .5s cubic-bezier(.22, 1, .36, 1), visibility .5s;
    backdrop-filter: blur(30px);
    padding: 0;
    padding-left: 5vw;
    padding-right: 5vw;
    visibility: hidden;}
#reservations.inveeta-modal-open {opacity: 1;
        pointer-events: all;
        visibility: visible;
        transition: opacity 1.1s cubic-bezier(.22, 1, .36, 1), visibility 0s;}
#reservations > [data-app="inveeta"] {opacity: 0;
    transform: translate3d(0, 28px, 0) scale(.985);
    filter: blur(5px);
    transition: opacity .65s cubic-bezier(.22, 1, .36, 1),
                transform .8s cubic-bezier(.22, 1, .36, 1),
                filter .8s cubic-bezier(.22, 1, .36, 1);}
#reservations.inveeta-modal-open > [data-app="inveeta"] {opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
    transition: opacity 1.2s cubic-bezier(.22, 1, .36, 1) .1s,
                transform 1.4s cubic-bezier(.22, 1, .36, 1) .1s,
                filter 1.4s cubic-bezier(.22, 1, .36, 1) .1s;}
#reservations #closeButton {opacity: 0;
    transform: translateY(-8px);
    transition: opacity .45s ease .15s, transform .55s cubic-bezier(.22, 1, .36, 1) .15s;}
#reservations.inveeta-modal-open #closeButton {opacity: 1;
    transform: translateY(0);
    transition: opacity .7s ease .45s, transform .85s cubic-bezier(.22, 1, .36, 1) .45s;}
#closeButton {position: fixed;
    color: #ffffff;
    padding: 1rem;
    top: 0;
    right: 35vw;}
.oxSectionContent ox-p {font-size: 1.5rem;}
.statementText {position: relative;
    z-index: 2;
    margin-top: 14vh;}
.statementText h2 {max-width: 520px;}
.statementText p {max-width: 640px;}
#footer {--vellum: #e9e0d2;
    --vellum-soft: rgba(233, 224, 210, .78);
    --edge: 15vw;
    --footer-width: 920px;
    position: relative;
    z-index: 2;
    color: var(--vellum-soft);
    background: linear-gradient(110deg, rgba(11, 13, 13, .89), rgba(11, 13, 13, .77));
    -webkit-backdrop-filter: blur(32px) brightness(.45);
    backdrop-filter: blur(32px) brightness(.45);}
#footer::before {position: absolute;
    inset: -88px 0 auto;
    height: 88px;
    background: linear-gradient(to bottom, transparent, rgba(11, 13, 13, .86));
    content: "";
    pointer-events: none;}
.footerInvitation {position: relative;
    display: flex;
    min-height: 215px;
    padding: 38px var(--edge) 30px;
    align-items: center;
    overflow: hidden;}
.footerInvitationContent {position: relative;
    z-index: 2;
    width: 100%;
    max-width: min(600px, 53vw);}
.footerInvitation h2 {margin-top: 12px;
    color: var(--vellum);
    font-family: var(--header-font);
    font-size: clamp(2.25rem, 2.8vw, 3.15rem);
    font-weight: 400;
    letter-spacing: -.035em;
    line-height: .98;}
.footerReservation {display: inline-flex;
    align-items: center;
    min-height: 36px;
    margin-top: 13px;
    padding: 0 0 5px;
    border: 0;
    border-bottom: 1px solid var(--brass);
    background: transparent;
    color: var(--vellum);
    font: 400 clamp(1.15rem, 1.35vw, 1.45rem)/1.1 var(--header-font);
    cursor: pointer;
    transition: color .25s, border-color .25s;}
.footerReservation:hover,
.footerReservation:focus-visible {color: #fff;
    border-color: #fff;}
.footerClosing {position: relative;
    display: grid;
    width: min(calc(100% - 2 * var(--edge)), var(--footer-width));
    margin: 0 0 0 var(--edge);
    padding: 33px 0 30px;
    align-items: start;
    grid-template-columns: 110px minmax(220px, 1fr) minmax(160px, .65fr);
    gap: clamp(24px, 3vw, 48px);}
.footerIdentity {display: inline-flex;
    align-items: flex-start;
    gap: 22px;
    color: var(--vellum);
    text-decoration: none;}
.footerMark {display: block; flex: none; width: 82px; opacity: .86;}
.footerMark img {display: block; width: 100%; height: auto;}
.footerVisit {gap: 12px;
    color: var(--vellum-soft);
    font: 300 .8rem/1.7 var(--content-font);}
.footerVisit p {margin: 0;}
.footerVisit a {color: var(--vellum); text-decoration: none; transition: color .25s;}
.footerVisit a:hover {color: var(--brass);}
.footerVisit {display: flex;
    flex-direction: column;}
.footerBottom {position: relative;
    display: flex;
    width: calc(100% - 2 * var(--edge));
    margin: 0 0 0 var(--edge);
    padding: 16px 0 19px;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    color: rgba(233, 224, 210, .48);
    font: 300 .66rem/1.5 var(--content-font);
    letter-spacing: .12em;
    text-transform: uppercase;}
.footerBackToTop {display: inline-flex;
    margin-left: auto;
    align-items: center;
    gap: 9px;
    color: var(--vellum);
    text-decoration: none;
    white-space: nowrap;
    transition: color .25s;}
.footerBackToTop:hover,
.footerBackToTop:focus-visible {color: var(--brass);}
.footerBackToTop span {font-size: 1rem; line-height: 1;}
.quoteBlock {position: relative;
    max-width: 1020px;
    padding: clamp(90px, 12vw, 170px) 0 clamp(75px, 10vw, 135px) clamp(40px, 8vw, 116px);
    margin-left: -6vw;}
.quoteBlock.teamQuote {margin-left: 0;
    padding: clamp(65px, 7vw, 110px) 0 clamp(70px, 8vw, 115px);}
.quoteBlock.teamQuote::before {content: none;}
.quoteBlock::before {position: absolute;
        top: 58px;
        left: 0;
        color: rgba(184, 154, 101, .55);
        font-family: var(--header-font);
        font-size: 9rem;
        line-height: 1;
        content: "“";}
.quoteBlock blockquote {color: var(--line-soft);
        font-family: var(--header-font);
        font-size: clamp(3rem, 4.8vw, 5.9rem);
        letter-spacing: -.025em;
        line-height: .98;}
.quoteBlock cite {display: block;
        margin-top: 28px;
        color: var(--line-soft);
        font-style: normal;
        font-size: .72rem;
        letter-spacing: .15em;
        text-transform: uppercase;}
.heroContent .eyebrow {margin-bottom: 10vh;
    --eyebrow-spacing: .25em;
    letter-spacing: calc(var(--eyebrow-spacing) + .055em);
    opacity: 0;
    transform: translate3d(0, 7px, 0);
    filter: blur(3px);
    clip-path: inset(0 100% 0 0);
    transition: clip-path 3.1s cubic-bezier(.19, 1, .22, 1),
                opacity 2.4s cubic-bezier(.22, 1, .36, 1),
                transform 2.8s cubic-bezier(.19, 1, .22, 1),
                filter 2.6s cubic-bezier(.22, 1, .36, 1),
                letter-spacing 3s cubic-bezier(.19, 1, .22, 1);}
.heroContent .eyebrow.is-visible {letter-spacing: var(--eyebrow-spacing);
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
    clip-path: inset(0 0 0 0);}
@media (prefers-reduced-motion: reduce) {
.heroContent .eyebrow {letter-spacing: var(--eyebrow-spacing);
        opacity: 1;
        transform: none;
        filter: none;
        clip-path: none;
        transition: none;}
}
.menuSequence {width: min(100%, 1180px);}
.menuMovement {position: relative;
    display: flex;
    padding: clamp(42px, 6vw, 78px) 0;
    grid-template-columns: minmax(90px, .22fr) minmax(220px, .68fr) minmax(280px, 1fr);
    flex-direction: column;}
.menuMovement p {color: var(--line-soft);
        line-height: 1.84;}
.movementDishes {display: flex;
    margin-top: 18px;
    flex-wrap: wrap;
    gap: 8px 14px;
    color: var(--line-soft);
    font-size: .78rem;
    letter-spacing: .08em;
    text-transform: uppercase;}
.menuMovement h3 {font-family: var(--header-font);
    font-size: clamp(2rem, 3vw, 3.7rem);
    letter-spacing: -.02em;
    line-height: 1;
    color: var(--line-soft);}
#giftCertificateApp {width: min(100%, 1040px);
    color: var(--vellum);}
#giftCertificateApp .inveeta-box {overflow: hidden;
        border: 1px solid var(--line);
        color: var(--vellum);
        background: rgba(18, 20, 17, .96);}
#giftCertificateApp .inveeta-progress {display: grid;
        padding: 17px;
        gap: 1px;
        grid-template-columns: repeat(4, 1fr);
        background: #0d0f0d;}
#giftCertificateApp .inveeta-progress-item {display: flex;
        min-height: 68px;
        padding: 12px;
        flex-direction: column;
        justify-content: space-between;
        color: rgba(232, 222, 207, .36);
        background: var(--charcoal);}
#giftCertificateApp .inveeta-progress-number,
#giftCertificateApp .gc-kicker,
#giftCertificateApp .gc-section-title {color: var(--brass);
        font-size: .68rem;
        letter-spacing: .15em;
        text-transform: uppercase;}
/* page.responsive.css — retained site styles */
.mobileMenuToggle {display: none;}
.mobileReservationButton {display: none;}
@media (max-width: 1180px) {
#pageNavigation .installAppButton:not([hidden]) {display: inline-flex;
        min-height: 44px;
        font-size: .65rem;
        line-height: 1.65;}
}
@media (max-width: 1180px) {
html {scroll-padding-top: 72px;}
html,
body {width: 100%; overflow-x: clip;}
body {min-width: 0;}
#logo {top: max(16px, env(safe-area-inset-top)); left: max(18px, env(safe-area-inset-left)); width: 100px; min-width: 0; height: auto; z-index: 21;}
#logo svg {width: 100%; height: auto;}
.mobileMenuToggle {display: flex; position: fixed; z-index: 23; right: max(16px, env(safe-area-inset-right));
        top: max(17px, env(safe-area-inset-top)); width: 48px; height: 48px;
        border: none; 
        background: none;
        align-items: center; justify-content: center; flex-direction: column; gap: 5px; cursor: pointer;}
.mobileMenuToggle span {width: 19px; height: 1px; background: #fff; transition: transform .25s, opacity .25s;}
.mobileMenuOpen .mobileMenuToggle span:first-child {transform: translateY(6px) rotate(45deg);}
.mobileMenuOpen .mobileMenuToggle span:nth-child(2) {opacity: 0;}
.mobileMenuOpen .mobileMenuToggle span:last-child {transform: translateY(-6px) rotate(-45deg);}
#pageNavigation {position: fixed; inset: 0; width: 100%; height: 100dvh; z-index: 22;
        display: block; padding: calc(90px + env(safe-area-inset-top)) 24px 36px;
        overflow-y: auto; overscroll-behavior: contain; background: rgba(18,23,27,.97);
        opacity: 0; visibility: hidden; pointer-events: none; transform: none; filter: none;
        transition: opacity .25s, visibility .25s;}
.mobileMenuOpen #pageNavigation,
.mobileMenuOpen #navigation {opacity: 1; visibility: visible; pointer-events: auto; transform: none; filter: none;}
.mobileMenuOpen {overflow: hidden;}
#pageNavigation nav {max-width: 460px; margin: 0 auto; padding-bottom: 40px;}
#pageNavigation nav a {padding: 10px 0; font-size: 1rem; line-height: 1.3;}
#pageNavigation .reservation {margin: 0 0 12px; padding: 10px 0;}
.hero,
.heroImage {width: 100%;}
.heroImage {background-position: center;}
.heroContent {position: fixed; z-index: 1; left: 7vw; right: 7vw; bottom: max(9dvh, 36px); width: auto; transform: none;}
.heroContent h1 {max-width: 100%; font-size: clamp(2.25rem, 8vw, 4rem); line-height: 1.06; margin-bottom: 22px; overflow-wrap: break-word;}
.heroContent h2 {max-width: 100%; font-size: clamp(.9rem, 2.5vw, 1rem); letter-spacing: .03em; line-height: 1.5;}
#content {width: 100%; min-width: 0; margin-top: 100dvh; padding: 72px 7vw 100px; gap: 30px;}
#content p {font-size: .96rem; letter-spacing: .012em; line-height: 1.7;}
#content h2 {max-width: 100%; font-size: 1.25rem; letter-spacing: .14em; overflow-wrap: anywhere;}
.sectionImage {width: 100vw; max-width: none; height: 65dvh !important; min-height: 340px; margin-left: -7vw; margin-right: -7vw;}
.sectionCaption {left: 8vw; right: 8vw; bottom: 6dvh; font-size: .68rem; letter-spacing: .16em; overflow-wrap: anywhere;}
.statementText {margin-top: 65px;}
#reservations {padding: 0; overflow-y: auto;}
#reservations > [data-app="inveeta"] {transform: translate3d(0, 18px, 0) scale(.99);}
#reservations.inveeta-modal-open > [data-app="inveeta"] {transform: translate3d(0, 0, 0) scale(1);}
#closeButton {right: 8px; top: max(8px, env(safe-area-inset-top)); z-index: 101; cursor: pointer;}
}
@media (prefers-reduced-motion: reduce) {
#reservations,
#reservations > [data-app="inveeta"],
#reservations #closeButton {transition: none !important;
        filter: none;
        transform: none;}
}
@media (max-width: 480px) {
.heroContent h1 {font-size: clamp(2.15rem, 9.3vw, 3.2rem);}
.heroContent h2 {font-size: .97rem;}
#content {padding-top: 58px;}
}
@media (max-height: 680px) and (max-width: 1180px) {
.heroContent {bottom: 25px;}
.heroContent h1 {font-size: clamp(1.8rem, 7vw, 3rem); margin-bottom: 12px;}
.heroContent h2 {font-size: .9rem;}
}
@media (max-width: 1180px) {
:root {--page-edge: clamp(24px, 5vw, 68px);}
#logo {left: var(--page-edge);}
.mobileMenuToggle {right: var(--page-edge);}
#pageNavigation nav {width: min(100%, 520px);}
#pageNavigation nav a {display: block;}
.heroContent {left: var(--page-edge); right: var(--page-edge); max-width: 740px;}
.heroContent h1 {max-width: 100%;}
.heroContent h2 {max-width: 680px;}
#content {padding: 88px var(--page-edge) 108px;}
#content > .quietNote {max-width: 720px;}
#content p {margin-top: 0;}
#content h2 {font-size: clamp(1.85rem, 4vw, 3rem); letter-spacing: -.025em; line-height: 1.1;}
#content .statementHeader {max-width: 720px; font-size: clamp(2.25rem, 5vw, 3.8rem); letter-spacing: -.025em; line-height: 1.05;}
.sectionImage {width: 100vw; margin-left: calc(-1 * var(--page-edge)); margin-right: calc(-1 * var(--page-edge));}
.sectionCaption {left: var(--page-edge); right: var(--page-edge); max-width: 610px; bottom: 8%; letter-spacing: .1em; line-height: 1.5;}
.imageEssay,
.storyGrid {width: 100vw; margin-left: calc(-1 * var(--page-edge));}
.imageEssay {min-height: 640px; padding: 110px var(--page-edge);}
.imageEssayCopy {width: min(100%, 620px); gap: 20px;}
.imageFrame::after,
.imageEssay.reverse .imageFrame::after {background: linear-gradient(90deg, rgba(11,13,12,.91), rgba(11,13,12,.55) 65%, rgba(11,13,12,.28)), linear-gradient(0deg, rgba(11,13,12,.7), transparent 55%);}
.storyCard,
.storyCard:nth-child(even) {min-height: 650px; padding: 110px var(--page-edge);}
.storyCard::after {background: linear-gradient(90deg, rgba(11,13,12,.92), rgba(11,13,12,.5) 72%, rgba(11,13,12,.25)), linear-gradient(0deg, rgba(11,13,12,.7), transparent 70%);}
.storyCard h3 {max-width: 650px; font-size: clamp(2.3rem, 5vw, 4rem);}
.storyCard p {max-width: 580px;}
.quoteBlock {margin-left: 0; padding: 95px 0 85px 44px;}
.quoteBlock blockquote {font-size: clamp(2.4rem, 5vw, 4.6rem);}
.quoteBlock::before {top: 42px; font-size: 7rem;}
.footerInvitation {min-height: 205px; padding: 38px var(--page-edge) 30px;}
.footerInvitationContent {max-width: 560px;}
.footerInvitation h2 {font-size: clamp(2.2rem, 4.2vw, 3rem);}
.footerClosing {padding: 32px 0 28px; grid-template-columns: 110px minmax(0, 1fr); gap: 24px;}
.footerBottom {margin: 0 0 0 var(--page-edge);}
.menuMovement {padding: 38px 0; border-top: 1px solid var(--line-soft); gap: 16px;}
.menuMovement h3 {font-size: clamp(2rem, 4vw, 3.2rem);}
.menuMovement p {margin-top: 0;}
.movementDishes {gap: 8px 12px;}
.statementText {margin-top: 50px;}
.heroContent .eyebrow {margin-bottom: 28px;}
#giftCertificateApp,
#giftCertificateApp .inveeta-box {max-width: 100%; min-width: 0;}
}
@media (max-width: 600px) {
:root {--page-edge: 7vw;}
#logo {top: max(18px, env(safe-area-inset-top)); width: 88px; min-width: 0; height: auto;}
.heroContent {bottom: max(7dvh, 25px);}
.heroContent h1 {font-size: clamp(2.2rem, 10vw, 3.5rem);}
.heroContent h2 {font-size: 1rem; line-height: 1.4;}
#content {padding-top: 72px; padding-bottom: 85px; gap: 28px;}
#content h2 {font-size: clamp(1.8rem, 8vw, 2.55rem);}
#content .statementHeader {font-size: clamp(2.1rem, 9vw, 3.2rem);}
#content p {line-height: 1.65;}
.sectionImage {height: min(72dvh, 640px) !important; min-height: 380px;}
.sectionCaption {bottom: 8%; font-size: .72rem;}
.imageEssay {min-height: 560px; padding: 95px var(--page-edge) 75px; align-items: flex-end;}
.storyCard,
.storyCard:nth-child(even) {min-height: 560px; padding: 90px var(--page-edge) 70px;}
.storyCard h3 {margin-top: 22px; font-size: clamp(2.3rem, 9vw, 3.4rem);}
.quoteBlock {padding: 80px 0 65px 28px;}
.quoteBlock::before {top: 34px; font-size: 5.5rem;}
.footerInvitation {min-height: 190px; padding: 34px var(--page-edge) 28px;}
.footerInvitation h2 {font-size: clamp(2.1rem, 8vw, 2.7rem);}
.footerClosing {grid-template-columns: 1fr; padding: 30px 0 28px; gap: 22px;}
.footerMark {width: 68px;}
.footerBottom {flex-wrap: wrap; gap: 12px 20px; font-size: .68rem;}
.footerBackToTop {margin-left: auto;}
#giftCertificateApp .inveeta-progress {padding: 8px; gap: 4px;}
#giftCertificateApp .inveeta-progress-item {min-height: 58px; padding: 8px 5px; font-size: .64rem; overflow-wrap: anywhere;}
}
@media (max-width: 1180px) {
#content .statementHeader {display: block; width: 100%; max-width: none; overflow-wrap: normal; word-break: normal;}
.sectionImage {position: relative;
        background-image: none !important;
        background-color: transparent;
        -webkit-mask-image: none;
        mask-image: none;}
.sectionImage::before {content: "";
        position: absolute;
        z-index: 0;
        inset: 0;
        background-image: var(--section-image);
        background-position: var(--section-position, center);
        background-size: cover;
        background-repeat: no-repeat;
        -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);
        mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);
        pointer-events: none;}
.sectionImage::after {display: none;}
.sectionImage.teamImage.is-visible {filter: none;}
.sectionImage.teamImage::before {filter: brightness(1.22) contrast(1.06) saturate(1.05);}
.sectionImage .sectionCaption {box-sizing: border-box;
        left: var(--page-edge);
        right: auto;
        width: calc(100% - 2 * var(--page-edge));
        max-width: 610px;
        overflow-wrap: normal;
        word-break: normal;}
}
@media (max-width: 600px) {
#content .statementHeader {font-size: clamp(2rem, 7.5vw, 2.65rem); line-height: 1.12;}
.sectionImage .sectionCaption {max-width: none;
        bottom: 5%;
        font-size: .73rem;
        letter-spacing: .08em;
        line-height: 1.5;
        text-shadow: 0 1px 12px rgba(0,0,0,.9);}
}
@media (max-width: 600px) {
#logo {z-index: 23;}
.hero {height: 100dvh;}
.heroImage {background-position: center center;}
.heroContent {left: 8vw;
        right: 8vw;
        bottom: max(8dvh, 50px);
        max-width: none;}
.heroContent .eyebrow {margin-bottom: 21px;
        font-size: .67rem;
        --eyebrow-spacing: .19em;}
.heroContent h1 {max-width: 100%;
        margin: 0 0 18px;
        font-size: clamp(3rem, 12vw, 4.35rem);
        line-height: .98;
        letter-spacing: -.04em;
        overflow-wrap: normal;
        text-wrap: balance;}
.heroContent h2 {max-width: 360px;
        font-size: .92rem;
        line-height: 1.52;
        letter-spacing: .012em;}
#content {padding: 85px 8vw 105px;
        gap: 32px;}
#content .statementHeader {font-size: clamp(2.4rem, 10.2vw, 3.4rem);
        line-height: 1.04;
        letter-spacing: -.035em;
        text-wrap: balance;}
.sectionImage {width: 100vw;
        height: auto !important;
        min-height: 0;
        margin-left: -8vw;
        margin-right: -8vw;
        padding: min(68dvh, 610px) 8vw 42px;
        -webkit-mask-image: none;
        mask-image: none;}
.sectionImage::before {top: 0;
        bottom: auto;
        height: min(68dvh, 610px);
        background-size: auto 100%;
        background-position: var(--section-position, center top);}
.sectionImage .sectionCaption {position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        width: 100%;
        max-width: 38rem;
        padding-top: 25px;
        color: rgba(232,222,207,.78);
        font-size: .72rem;
        line-height: 1.65;
        letter-spacing: .12em;
        text-transform: uppercase;
        text-shadow: none;}
.sectionImage .sectionCaption::before {content: none;}
.sectionImage .sectionCaption span {color: rgba(232,222,207,.92);
        font-size: 0.85rem;
        line-height: 1.6;
        letter-spacing: 0.35em;}
.sectionImage.teamImage .sectionCaption {font-size: .65rem;}
.sectionImage.teamImage .sectionCaption span {font-size: .7rem;
        line-height: 1.7;
        letter-spacing: .16em;}
.imageEssay {display: block;
        min-height: 0;
        margin-left: -8vw;
        margin-right: -8vw;
        padding: 0 8vw 42px;}
.imageEssay .imageFrame {position: relative;
        inset: auto;
        width: 100vw;
        height: min(68dvh, 610px);
        min-height: 0;
        margin-left: -8vw;
        -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);
        mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);}
.imageEssay .imageFrame::after {display: none;}
.imageEssay .imageEssayCopy {width: 100%;
        padding-top: 25px;}
.storyGrid {margin-left: -8vw;
        margin-right: -8vw;}
.storyCard,
.storyCard:nth-child(even) {min-height: 0;
        padding: 0 8vw 42px;
        justify-content: flex-start;
        background: transparent;}
.storyCard::before {position: relative;
        z-index: 0;
        inset: auto;
        display: block;
        flex-shrink: 0;
        width: 100vw;
        height: min(68dvh, 610px);
        margin: 0 0 25px -8vw;
        -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);
        mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);}
.storyCard::after {content: none;}
.imageEssayCopy h2,
.quietNote h2,
.footerInvitation h2 {line-height: 1.03;
        letter-spacing: -.03em;}
}
@media (max-width: 1180px) {
#pageNavigation {z-index: 22;
        display: grid;
        grid-template-columns: minmax(0, 520px);
        align-content: start;
        padding: calc(clamp(170px, 22dvh, 210px) + env(safe-area-inset-top)) var(--page-edge)
                 calc(115px + env(safe-area-inset-bottom));
        background:
            linear-gradient(90deg, rgba(10,12,12,.97), rgba(10,12,12,.88)),
            url("/library/images/experience-atmospheric-015.webp") center / cover no-repeat,
            #0b0d0d;
        color: #e9e0d2;}
.mobileMenuOpen #logo {z-index: 24;
        opacity: .72 !important;
        pointer-events: auto;}
.mobileMenuOpen #logo svg path,
.mobileMenuOpen #logo svg polygon {fill: #e9e0d2;}
.mobileMenuOpen #logo svg line {stroke: #e9e0d2;}
.mobileMenuToggle {z-index: 25;}
.mobileMenuOpen .mobileMenuToggle {background: none;}
#pageNavigation nav {grid-area: 1 / 1;
        flex-shrink: 0;
        width: min(100%, 520px);
        max-width: 520px;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;}
#pageNavigation nav::before {content: "Explore";
        display: block;
        margin: 0 0 14px;
        padding: 0 100px 0 0;
        border: 0;
        color: var(--brass, #b89a65);
        font: 600 .65rem/1.4 var(--content-font, Poppins, sans-serif);
        letter-spacing: .17em;
        text-transform: uppercase;}
html[lang="sl"] #pageNavigation nav::before {content: "Odkrijte";}
#pageNavigation nav a {display: block;
        width: 100%;
        padding: 9px 0;
        border: 0;
        color: #e9e0d2;
        font: 300 clamp(.8rem, 1.6vw, .9rem)/1.4 var(--content-font, Poppins, sans-serif);
        letter-spacing: .08em;
        text-transform: uppercase;
        text-decoration: none;
        opacity: 1;
        filter: none;
        transition: color .3s ease;}
#pageNavigation nav a::before {content: none;}
#pageNavigation nav a:hover {padding-left: 0;
        color: #fff;
        letter-spacing: .08em;}
#pageNavigation nav a:focus-visible {outline: 1px solid var(--brass, #b89a65);
        outline-offset: 4px;}
#pageNavigation nav a.is-current {color: #b89a65;}
#pageNavigation nav a[href$="/gift-certificate"],
#pageNavigation nav a[href$="/darilni-bon"] {margin-top: 14px;
        padding-top: 20px;
        border-top: 1px solid rgba(232,222,207,.16);}
#pageNavigation nav .menuDetails {margin-top: 30px;
        padding-top: 22px;
        border-top-color: rgba(232,222,207,.16);}
#pageNavigation nav .menuRecognitions {font-size: .65rem; line-height: 1.65;}
#pageNavigation nav .menuRecognitions h2 {font-size: .62rem; margin-bottom: 10px;}
#pageNavigation nav .menuRecognitions li {margin-bottom: 5px; white-space: normal;}
#pageNavigation .languageSwitch {position: static;
        grid-area: 1 / 1;
        justify-self: end;
        align-self: start;
        z-index: 1;
        flex-shrink: 0;
        width: auto;
        margin: 0;
        padding: 0;
        gap: 20px;
        font-size: .65rem;
        line-height: 1.4;}
}
@media (max-width: 600px) {
body[data-type="experience"] #header {position: static;}
body[data-type="experience"] #header .hero {position: fixed;
        inset: 0 auto auto 0;
        z-index: 0;
        width: 100%;
        height: 60dvh;
        overflow: hidden;
        pointer-events: none;}
body[data-type="experience"] #header .heroImage {position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        background-position: center;}
body[data-type="experience"] #header .hero::after {z-index: 1;
        background: linear-gradient(to bottom, transparent 35%, rgba(21,26,30,.3) 65%, #151a1e 100%);
        pointer-events: none;}
body[data-type="experience"] #header .heroContent {position: fixed;
        top: auto;
        bottom: max(6dvh, 36px);
        left: 8vw;
        right: 8vw;
        z-index: 1;
        width: auto;
        max-width: none;
        padding: 0;
        background: transparent;
        pointer-events: none;}
body[data-type="experience"] #header .heroContent [data-inveeta-open] {pointer-events: auto;}
body[data-type="experience"] #content {margin-top: 100dvh;
        padding-top: 45px;}
#content h2 {font-size: clamp(1.55rem, 6.2vw, 2rem);
        line-height: 1.13;}
#content .statementHeader {font-size: clamp(1.9rem, 7.7vw, 2.55rem);
        line-height: 1.1;}
.menuMovement h3,
.storyCard h3 {font-size: clamp(1.75rem, 7vw, 2.35rem);
        line-height: 1.06;}
.quoteBlock blockquote {font-size: clamp(1.9rem, 7.5vw, 2.6rem);}
.footerInvitation h2 {font-size: clamp(2.1rem, 8vw, 2.7rem);}
}
@media (max-width: 600px) and (max-height: 680px) {
body[data-type="experience"] #header .heroContent {bottom: 18px;}
body[data-type="experience"] #header .heroContent h2 {font-size: .9rem; line-height: 1.35;}
body[data-type="experience"] #header .heroContent .eyebrow {margin-bottom: 12px;}
}
@media (max-width: 1180px) {
#footer {--edge: var(--page-edge);}
.footerReservation {display: inline-flex;
        align-items: center;
        min-height: 36px;
        margin-top: 16px;
        padding: 0 0 5px;
        color: var(--vellum);
        background: transparent;
        border: 0;
        border-bottom: 1px solid var(--brass);
        font: 400 1.25rem/1.1 var(--header-font);
        letter-spacing: -.02em;
        text-transform: none;}
}
@media (max-width: 1180px) {
#logo {top: max(42px, calc(env(safe-area-inset-top) + 26px));}
.mobileMenuToggle {top: max(42px, calc(env(safe-area-inset-top) + 26px));}
body[data-type="experience"] #pageNavigation nav .reservation {display: none;}
body[data-type="experience"] #layout::after {position: fixed;
        z-index: 89;
        right: 0;
        bottom: 0;
        left: 0;
        height: calc(150px + env(safe-area-inset-bottom));
        background: linear-gradient(to bottom, transparent 0%, rgba(29, 32, 33, .36) 18%, rgba(29, 32, 33, .82) 46%, rgba(29, 32, 33, .9) 100%);
        content: "";
        pointer-events: none;}
.mobileReservationButton {position: fixed;
        z-index: 90;
        bottom: calc(env(safe-area-inset-bottom) + 20px);
        left: 50%;
        display: inline-flex;
        width: auto;
        min-height: 44px;
        padding: 8px 24px;
        align-items: center;
        border: 0;
        border-bottom: 1px solid rgba(184, 154, 101, .52);
        background: transparent;
        color: #e9e0d2;
        font: 300 .76rem/1.4 var(--content-font);
        letter-spacing: .18em;
        text-align: center;
        text-shadow: 0 2px 14px rgba(0, 0, 0, .8);
        text-transform: uppercase;
        transform: translateX(-50%);
        white-space: nowrap;
        cursor: pointer;
        transition: color .25s ease, border-color .25s ease;}
.mobileReservationButton:hover {color: #fff; border-bottom-color: #e9e0d2;}
.mobileReservationButton:focus-visible {outline: 2px solid #e9e0d2;
        outline-offset: 3px;}
.heroContent {bottom: max(13dvh, calc(env(safe-area-inset-bottom) + 108px));}
#content {padding-bottom: calc(115px + env(safe-area-inset-bottom));}
#footer .footerBottom {padding-bottom: calc(105px + env(safe-area-inset-bottom));}
#pageNavigation {padding-bottom: calc(115px + env(safe-area-inset-bottom));}
}
@media (max-width: 600px) {
body[data-type="experience"] #header .heroContent {bottom: calc(env(safe-area-inset-bottom) + 112px);}
.mobileReservationButton {min-height: 44px;}
}
@media (min-width: 1181px) {
#pageNavigation nav > a.is-current {position: relative;}
#pageNavigation nav > a.is-current::before {content: "";
        position: absolute;
        inset-inline-start: -13px;
        top: 50%;
        transform: translateY(-50%);
        width: 4px;
        height: 4px;
        border-radius: 50%;
        background: var(--brass, #b89a65);
        pointer-events: none;}
#pageNavigation nav > a.is-current[href$="/gift-certificate"]::before,
#pageNavigation nav > a.is-current[href$="/darilni-bon"]::before {top: calc(50% + 6.5px);}
}
/* page.quick-information.css — retained site styles */
.quickInformation[hidden],
.quickInformationToggle[hidden] {display: none !important;}
.quickInformationToggle {position: fixed; z-index: 91; left: 7vw; top: calc(12vh + 120px);
    min-height: 44px; padding: 8px 4px; border: 0;
    border-radius: 0; background: transparent; color: rgba(233,224,210,.85);
    font: 300 .66rem/1.4 Poppins,sans-serif; letter-spacing: .09em;
    cursor: pointer; text-shadow: 0 1px 10px rgba(0,0,0,.7);}
.quickInformationToggle::after {content: ""; position: absolute; width: 24px; height: 1px; left: 50%; bottom: 3px; transform: translateX(-50%); background: rgba(233,224,210,.32);}
.quickInformationToggle:hover {color: #e9e0d2;}
.quickInformationToggle:focus-visible,
.quickInformation a:focus-visible,
.quickInformation button:focus-visible {outline: 2px solid #b89a65; outline-offset: 5px;}
.quickInformationMode #header,
.quickInformationMode #content,
.quickInformationMode #footer,
.quickInformationMode #pageNavigation,
.quickInformationMode #navigation,
.quickInformationMode .mobileMenuToggle,
.quickInformationMode .mobileReservationButton,
.quickInformationMode #layout::after {display: none !important;}
html.quickInformationMode {scroll-behavior: auto !important;}
.quickInformationMode body {background: #151a1e; overflow: auto;}
.quickInformationMode #layout {min-height: 100dvh; background: transparent;}
.quickInformationMode #logo {opacity: .76; transform: none; filter: none; pointer-events: auto;}
.quickInformation {--quick-section-space: clamp(88px, 8vw, 140px);
    position: relative; width: auto; max-width: 720px; margin: 0 7vw 0 23vw;
    padding: clamp(200px,24vh,300px) 0 120px; color: #e9e0d2;
    font: 300 14px/1.8 Poppins,sans-serif; text-align: left;}
.quickInformation h1,
.quickInformation h2,
.quickInformation p,
.quickInformation dl {margin: 0; padding: 0;}
.quickInformation h1 {font: 300 clamp(26px,3vw,38px)/1.25 Poppins,sans-serif; letter-spacing: -.025em; margin: 12px 0 8px;}
.quickInformation h2 {font: 300 20px/1.4 Poppins,sans-serif; letter-spacing: -.015em; margin-bottom: 8px;}
.quickInformation p,
.quickInformation address {color: #b8b7b1; font: inherit;}
.quickInformation a {color: #e9e0d2; text-decoration: underline; text-decoration-color: rgba(184,154,101,.6); text-underline-offset: 5px;}
.quickInformationHeader {position: relative; padding-right: 85px;}
.quickInformation .quickInformationKicker {color: #b89a65; font-size: 10px; letter-spacing: .17em; text-transform: uppercase;}
.quickInformationLanguages {position: absolute; right: 0; top: 0; display: flex; gap: 18px; font-size: 11px;}
.quickInformationLanguages span {color: #b89a65;}
.quickInformation > section,
.quickInformationDetails {padding-top: var(--quick-section-space);}
.quickInformationPrices {margin-top: 18px !important; max-width: 560px;}
.quickInformationPrices > div {display: flex; justify-content: space-between; gap: 24px; padding: 18px 0; border-bottom: 1px solid rgba(233,224,210,.12);}
.quickInformationPrices dt,
.quickInformationPrices dd {font-size: 20px; line-height: 1.5; margin: 0;}
.quickInformationPrices dd {text-align: right; white-space: nowrap;}
.quickInformationPrices span {display: block; font-size: 12px; color: #b8b7b1;}
.quickInformation .quickInformationNote {margin: 12px 0 8px; font-size: 12px;}
.quickInformationMenu {font-size: 12px;}
.quickInformationDetails {display: grid; grid-template-columns: 1fr; gap: var(--quick-section-space);}
.quickInformationDetails p + p {margin-top: 8px;}
.quickInformationDetails address {margin-bottom: 8px;}
.quickInformationHours {list-style: none; padding: 0; margin: 12px 0 16px; max-width: 320px;}
.quickInformationHours li {display: flex; justify-content: space-between; gap: 18px; padding: 6px 0; color: #b8b7b1;}
.quickInformationHours li > span:last-child {white-space: nowrap; font-variant-numeric: tabular-nums;}
.quickInformationDetails .quickInformationGroup {margin-top: 24px;}
.quickInformationInquiry {display: inline-block; margin-top: 8px;}
.quickInformationContact {display: flex; flex-direction: column; align-items: flex-start; gap: 12px; font-size: 12px;}
@media (min-width: 1181px) {
.quickInformationToggle {left: calc(79vw + 88px); top: calc(clamp(65px, 7vh, 90px) - 14px);}
.quickInformationMode .quickInformationLanguages {position: fixed; z-index: 91; left: 79vw; right: auto; top: clamp(65px, 7vh, 90px); gap: 12px; font-size: .7rem; line-height: 1.5; letter-spacing: .16em;}
}
@media (max-width: 1180px) {
.quickInformationToggle {left: auto; right: calc(var(--page-edge,24px) + 60px); top: max(44px,calc(env(safe-area-inset-top) + 28px)); min-height: 44px; padding: 8px 4px; font-size: .61rem; letter-spacing: .05em;}
.quickInformation {margin: 0; max-width: none; padding: max(200px,calc(env(safe-area-inset-top) + 170px)) var(--page-edge,24px) max(80px,calc(env(safe-area-inset-bottom) + 48px));}
}
@media (max-width: 600px) {
.quickInformation {font-size: 13px;}
.quickInformationDetails {grid-template-columns: 1fr; gap: var(--quick-section-space);}
.quickInformation h2 {font-size: 18px;}
.quickInformationPrices dt,
.quickInformationPrices dd {font-size: 18px;}
}
.displayControls {position: fixed; z-index: 91; left: 79vw; top: clamp(65px, 7vh, 90px);
    display: flex; align-items: center; gap: 36px; width: max-content;
    font: 400 .7rem/1.5 var(--content-font, Poppins, sans-serif);
    letter-spacing: .16em; text-transform: uppercase;}
.displayControls .languageSwitch {position: static; display: flex; gap: 12px; margin: 0; padding: 0;
    width: auto; font: inherit; letter-spacing: inherit; line-height: inherit;}
.displayControls .quickInformationToggle {position: relative; inset: auto; min-height: 0; margin: 0; padding: 0;
    font: inherit; letter-spacing: inherit; text-transform: inherit;
    white-space: nowrap; color: var(--secondary-color, #e9e0d2); opacity: .7;}
.displayControls .quickInformationToggle:hover {opacity: 1;}
.displayControls .quickInformationToggle::before {content: ""; position: absolute; left: -18px; top: -5px; bottom: -5px;
    width: 1px; background: rgba(233,224,210,.28); pointer-events: none;}
.displayControls .quickInformationToggle::after {content: ""; position: absolute; inset: -13px -8px; width: auto; height: auto;
    transform: none; background: transparent;}
@media (min-width: 1181px) {
.quickInformationMode .quickInformationLanguages {display: none;}
}
@media (max-width: 1180px) {
#pageNavigation .displayControls {position: static; grid-area: 1 / 1; justify-self: end; align-self: start;
        gap: 28px; font-size: .65rem; line-height: 1.4;}
#pageNavigation .displayControls .languageSwitch {position: static; gap: 14px; font: inherit; letter-spacing: inherit;}
#pageNavigation .displayControls .quickInformationToggle::before {left: -14px;}
.quickInformationToggle {font-size: .65rem; letter-spacing: .16em; text-transform: uppercase;}
}
.displayControls {left: min(79vw, calc(100vw - 300px));}
.displayControls .languageSwitch {gap: 28px;}
.displayControls .languageSwitch > :last-child {position: relative;}
.displayControls .languageSwitch > :last-child::before {content: ""; position: absolute; left: -14px; top: -5px; bottom: -5px;
    width: 1px; background: rgba(233,224,210,.28); pointer-events: none;}
@media (max-width: 1180px) {
#pageNavigation .displayControls .languageSwitch {gap: 20px;}
#pageNavigation .displayControls .languageSwitch > :last-child::before {left: -10px;}
}
.quickInformationLanguages {gap: 24px;}
.quickInformationLanguages > :last-child {position: relative;}
.quickInformationLanguages > :last-child::before {content: ""; position: absolute; left: -12px; top: -5px; bottom: -5px;
    width: 1px; background: rgba(233,224,210,.28); pointer-events: none;}
.quickInformationReservation {width: min(100%, 300px); padding: 0 0 24px;
    border-bottom: 1px solid rgba(184,154,101,.65); color: var(--secondary-color, #e9e0d2);}
.quickInformationReservation .reservation-intro {display: block; margin-bottom: 8px; color: var(--brass, #b89a65);
    font: 600 .62rem var(--content-font, Poppins, sans-serif);
    letter-spacing: .16em; text-transform: uppercase;}
.quickInformationReservation button.reservation-title {display: block; width: 100%; padding: 0; border: 0; border-radius: 0;
    background: none; color: inherit;
    font: 400 clamp(1.45rem, 1.55vw, 1.9rem)/1.1 var(--header-font, Argesta, serif);
    letter-spacing: -.025em; text-transform: none; text-align: left; cursor: pointer;}
.quickInformationReservation .reservation-powered {display: block; margin-top: 10px; color: rgba(232,222,207,.58);
    font: 300 .62rem/1.3 var(--content-font, Poppins, sans-serif); letter-spacing: .04em;}
.quickInformationBooking .quickInformationContact {margin-top: 28px;}
/* page.content.css — retained site styles */
:root {--cv-background:#111719;--cv-ink:#e9e0d2;--cv-brass:#b49c6b}
.cv-video-cover.cv-video-portrait {box-sizing:border-box;width:var(--cv-video-width,100%);max-width:none;height:90vh;height:90svh;margin-top:0;margin-bottom:0;overflow:visible}
.cv-video-cover.cv-video-portrait>video {box-sizing:border-box;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;min-height:0!important;object-fit:cover!important;object-position:center;background:transparent!important;mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(180deg,transparent,#000 18%,#000 82%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(180deg,transparent,#000 18%,#000 82%,transparent);mask-composite:intersect;-webkit-mask-composite:source-in}
.cv-video-cover.cv-video-portrait.is-active>video {pointer-events:auto;object-fit:contain!important}
.cv-video-trigger.cv-video-inline-trigger {position:relative;inset:auto;display:inline-flex;align-items:center;justify-content:flex-start;width:auto;height:auto;min-height:44px;margin:14px 0 18px;padding:9px 0;gap:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--cv-brass,#b49c6b);text-shadow:none;font:300 10px/1.7 var(--content-font,"Poppins",sans-serif);letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.cv-video-inline-trigger .cv-video-watch {font:inherit;letter-spacing:inherit;border-bottom:1px solid #b49c6b60;padding-bottom:6px;transition:border-color .5s,color .5s}
.cv-video-inline-trigger:hover .cv-video-watch {border-color:#b49c6b;color:#e9e0d2}
.cv-video-figure {overflow:visible!important}
.cv-video-figure>figcaption,
.cv-video-caption {position:relative;inset:auto;max-width:38rem;margin:0 0 30px;padding:0;color:rgba(232,222,207,.78);font:300 .72rem/1.7 var(--content-font,"Poppins",sans-serif);letter-spacing:.16em;text-transform:uppercase;text-shadow:none}
#content .cv-video-figure>figcaption p,
#content .cv-video-caption p {font:inherit;letter-spacing:inherit;line-height:inherit;margin:0 0 12px}
@media (max-width:1180px) {
.cv-video-cover.cv-video-portrait {height:min(68svh,610px)}
.cv-video-cover.cv-video-portrait>video {mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 74%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 74%,transparent)}
.cv-video-figure>figcaption,
.cv-video-caption {font-size:.65rem;line-height:1.7;letter-spacing:.16em}
.cv-video-trigger.cv-video-inline-trigger {margin-top:12px;font-size:9px}
}
@media (prefers-reduced-motion:reduce) {
.cv-video-inline-trigger .cv-video-watch {transition:none}
}
.cv-video-caption {opacity:1!important;transform:none!important;filter:none!important}
.cv-video-caption::before {content:none!important}
.cv-video-controls[hidden] {display:none!important}
.cv-video-controls {max-width:640px;margin:0 0 28px;color:#b8b4a9;font:300 10px/1.7 var(--content-font,"Poppins",sans-serif)}
.cv-video-control-details {display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.cv-video-control {border:0;background:transparent;color:inherit;min-height:44px;padding:6px 0;font:inherit;cursor:pointer}
.cv-video-controls input[type=range] {accent-color:#b49c6b;cursor:pointer}
.cv-video-seek {display:block;width:100%;height:28px;margin:0}
.cv-video-volume {width:70px;height:28px;margin:0}
.cv-video-time {margin-right:auto;font-variant-numeric:tabular-nums}
.cv-video-controls :focus-visible {outline:1px solid #b49c6b;outline-offset:4px}
.cv-video-portrait>video:fullscreen {object-fit:contain!important;mask-image:none!important;-webkit-mask-image:none!important;background:#080b0c!important}
.cv-video-portrait>video:-webkit-full-screen {object-fit:contain!important;-webkit-mask-image:none!important;background:#080b0c!important}
@media (max-width:700px) {
.cv-video-volume {display:none}
.cv-video-control-details {gap:16px}
}
/* page.components.css — retained site styles */
:root {--section-space: clamp(32px, 5vh, 64px);
    --section-copy-gap: 24px;
    --section-title-size: clamp(2.35rem, 3.7vw, 4.5rem);
    --section-text-size: 1rem;
    --section-text-leading: 1.85;
    --section-muted: rgba(233, 224, 210, .72);
    --section-rule: rgba(232, 222, 207, .22);}
#content {gap: var(--section-space);}
.miza-section {min-width: 0;}
#content .miza-section :is(h2, h3) {font-family: var(--header-font);
    font-weight: 400;
    text-wrap: balance;}
#content .miza-section h2 {max-width: 840px;
    margin: 0;
    color: var(--secondary-color);
    font-size: var(--section-title-size);
    line-height: 1.08;
    letter-spacing: -.025em;}
#content .miza-section p {margin: 0;
    color: var(--secondary-color);
    font-size: var(--section-text-size);
    line-height: var(--section-text-leading);
    letter-spacing: .012em;}
#content .miza-section p + p {margin-top: var(--section-copy-gap);}
#content .miza-section .sectionEyebrow {margin: 0;
    color: var(--brass);
    font: 600 .75rem/1.5 var(--content-font);
    letter-spacing: .25em;
    text-transform: uppercase;}
.miza-hero .heroContent h1 {margin-bottom: clamp(18px, 2vw, 30px);}
@media (min-width: 1181px) {
.miza-hero .heroContent h1 {max-width: 40vw;
        font-size: clamp(3.25rem, 4.2vw, 5.1rem);
        line-height: .98;}
}
.miza-hero .heroContent h2 {line-height: 1.6;}
#content .miza-text {display: flex; flex-direction: column; gap: var(--section-copy-gap);}
#content .miza-text p + p {margin-top: 0;}
#content .miza-text .statementHeader,
#content .miza-text--intro > h2 {max-width: 100%;
    color: var(--line-soft);
    font-size: clamp(2.5rem, 4vw, 3.5rem);
    line-height: 1.12;}
#content .miza-text--statement {padding: clamp(36px, 5vh, 72px) 0;}
#content .miza-text .statementText {display: flex; flex-direction: column; gap: var(--section-copy-gap);
    width: 100%; margin: 0; padding: clamp(72px, 12vh, 160px) 0 0;}
.miza-image .sectionCaption {font: 400 .72rem/1.7 var(--content-font); letter-spacing: .16em;}
.miza-image .sectionCaption span {font-size: inherit; letter-spacing: inherit;}
#content .miza-image-text .imageEssayCopy {gap: var(--section-copy-gap);}
#content .miza-image-text .imageEssayCopy p {margin: 0 !important;}
#content .miza-image-text .menuExperienceSummary {margin: 0;}
#content .miza-sequence .menuMovement {display: grid; grid-template-columns: minmax(0, 1fr);
    gap: 18px; padding: 38px 0; border-top: 1px solid var(--section-rule);}
#content .miza-sequence .menuMovement h3 {margin: 0; color: var(--secondary-color);
    font-size: clamp(2rem, 3vw, 3.2rem); line-height: 1.12; letter-spacing: -.025em;}
#content .miza-sequence .menuMovement p {margin-top: 0;}
#content .miza-sequence .menuMovement p + p {margin-top: var(--section-copy-gap);}
#content .miza-sequence .movementDishes {display: flex; flex-wrap: wrap; gap: 8px 18px;
    color: var(--section-muted); font-size: .76rem; line-height: 1.7;}
#content .miza-pricing {margin: 0;}
#content .miza-pricing > h2 {margin-top: 14px;}
#content .miza-pricing .tastingOption h3 {font-size: clamp(1.7rem, 2.5vw, 2.3rem);}
#content .miza-pricing .tastingMoments {margin-top: 9px; color: var(--section-muted); font-size: .76rem; line-height: 1.5;}
#content .miza-pricing .tastingPrice {font: 400 clamp(1.7rem, 2.5vw, 2.3rem)/1.12 var(--header-font);
    letter-spacing: -.02em;}
#content .miza-pricing .tastingPrice span {color: var(--section-muted);}
#content .miza-pricing .tastingPriceNote {margin-top: 14px; color: var(--section-muted); font-size: .76rem;}
#content .miza-cards .storyCard h3 {margin: 0; line-height: 1.08;}
#content .miza-cards .storyCard p {margin-top: 24px;}
#content .miza-quote {margin-left: 0; padding: clamp(48px, 7vw, 100px) 0;}
#content .miza-quote blockquote {margin: 0;}
#content .miza-callout {display: flex; flex-direction: column; gap: var(--section-copy-gap);}
#content .miza-callout :is(h2, p, .sectionEyebrow) {margin: 0;}
#content .miza-action {display: inline-flex; align-items: center; align-self: flex-start;
    width: fit-content; max-width: 100%; min-height: 44px;
    margin: 0; padding: 8px 0;
    border: 0; border-bottom: 1px solid rgba(184,154,101,.6);
    border-radius: 0; background: transparent; box-shadow: none;
    color: var(--brass); font: 400 .78rem/1.65 var(--content-font);
    letter-spacing: .08em; text-decoration: none; cursor: pointer;
    transition: color .2s, border-color .2s;}
#content .miza-sequence .miza-action {margin-top: 12px; margin-right: 18px;}
#content .miza-action:hover {color: var(--secondary-color); border-color: currentColor;}
#content .miza-action:focus-visible {outline: 1px solid var(--brass); outline-offset: 5px;}
#content .miza-recognition h2 {margin-bottom: var(--section-copy-gap);}
.miza-next .miza-next-label {display: block; margin-bottom: 14px; color: var(--brass);
    font: 600 .7rem/1.5 var(--content-font); letter-spacing: .2em; text-transform: uppercase;}
#content .miza-gift {width: 100%;}
#content .miza-gift #giftCertificateApp p {font-size: inherit; line-height: inherit;}
@media (max-width: 1180px) {
:root {--section-space: 36px;
        --section-copy-gap: 24px;
        --section-title-size: clamp(2rem, 5vw, 3.2rem);
        --section-text-size: .96rem;
        --section-text-leading: 1.75;}
#content .miza-text .statementHeader,
#content .miza-text--intro > h2 {font-size: clamp(2.1rem, 7vw, 3.2rem);}
#content .miza-text--statement {padding: 28px 0;}
.miza-image .sectionCaption {font-size: .68rem; line-height: 1.7;}
#content .miza-sequence .menuMovement {padding: 30px 0;}
}
@media (max-width: 600px) {
:root {--section-space: 32px; --section-title-size: clamp(1.8rem, 7vw, 2.4rem);}
#content .miza-text .statementHeader,
#content .miza-text--intro > h2 {font-size: clamp(2rem, 7.5vw, 2.65rem);}
#content .miza-sequence .menuMovement h3 {font-size: clamp(1.75rem, 6vw, 2.2rem);}
#content .miza-action {font-size: .75rem;}
}
@media (prefers-reduced-motion: reduce) {
#content .miza-action {transition: none;}
}

/* Blended image with its heading overlaid; body copy follows below. */
#content .miza-image-text.imageEssay {display: block; min-height: 0; padding: 0;}
#content .miza-image-text .imageEssayVisual {position: relative; min-height: 82vh;
    display: flex; align-items: flex-end; padding: clamp(100px, 15vh, 180px) 18vw;}
#content .miza-image-text .imageEssayVisual .imageFrame {position: absolute; inset: 0;
    width: auto; height: auto; min-height: 100%; margin: 0;
    background-size: cover; background-position: center;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 78%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 78%, transparent 100%);}
#content .miza-image-text .imageEssayHeading {position: relative; z-index: 2;
    display: flex; flex-direction: column; gap: var(--section-copy-gap); width: min(43vw, 620px);}
#content .miza-image-text .imageEssayCopy {width: min(43vw, 620px); margin-left: 18vw;
    padding: 24px 0 clamp(64px, 8vh, 110px);}
@media (max-width: 1180px) {
#content .miza-image-text .imageEssayVisual {min-height: 70vh; padding: 100px var(--page-edge) 80px;}
#content .miza-image-text .imageEssayHeading {width: min(100%, 680px);}
#content .miza-image-text .imageEssayCopy {width: auto; max-width: 680px;
    margin: 0 var(--page-edge); padding-top: 24px;}
}
@media (max-width: 600px) {
#content .miza-image-text .imageEssayVisual {min-height: 62vh; padding: 90px 8vw 64px;}
#content .miza-image-text .imageEssayCopy {margin: 0 8vw;}
}

/* Longer pauses before invitations, the next chapter and the closing footer. */
:root {--closing-section-pause: clamp(88px, 14vh, 180px);}
#content .quietNote {padding-top: var(--closing-section-pause);}
#content .nextChapter {margin-top: var(--closing-section-pause);}
#content .nextChapter > a {padding-top: clamp(56px, 8vh, 112px);}
#footer {padding-top: var(--closing-section-pause);}
@media (max-width: 600px) {
:root {--closing-section-pause: clamp(64px, 10vh, 96px);}
#content .nextChapter > a {padding-top: 48px;}
}

/* Keep footer links clear of the fixed desktop navigation. */
@media (min-width: 1181px) {
#footer .footerBottom {width: min(var(--footer-width), calc(70vw - var(--edge)));}
}
#footer .footerBackToTop {min-height: 44px; padding: 10px 0;}

/* Recognition links keep the quiet navigation typography. */
#pageNavigation nav .menuRecognitions li > a {display: inline; padding: 0; margin: 0;
    border: 0; font: inherit; color: inherit; letter-spacing: inherit; text-transform: none;
    text-decoration: none;}
#pageNavigation nav .menuRecognitions li > a:hover,
#pageNavigation nav .menuRecognitions li > a:focus-visible {color: var(--brass); letter-spacing: inherit; padding: 0;}

/* Compact current-menu trigger and price dialog. */
#pageNavigation nav .menuPricesTrigger {display: block; width: 100%; margin: 0 0 20px;
    padding: 0 0 18px; border: 0; border-bottom: 1px solid rgba(232,222,207,.2);
    background: none; color: #e9e0d2; text-align: left; cursor: pointer;}
.menuPricesEyebrow {display: block; margin: 0 0 7px; color: var(--brass);
    font: 600 .68rem/1.3 var(--content-font); letter-spacing: .15em; text-transform: uppercase;}
#pageNavigation nav .menuPricesTitle {display: flex; justify-content: space-between; align-items: baseline;
    gap: 12px; font: 400 clamp(1.2rem,1.3vw,1.5rem)/1.15 var(--header-font); letter-spacing: -.025em;}
#pageNavigation nav .menuPricesTitle > span {color: var(--brass); font-size: 1rem;}
.menuPricesTrigger:focus-visible, .currentMenuClose:focus-visible {outline: 1px solid var(--brass); outline-offset: 5px;}
.currentMenuDialog {position: fixed; inset: 0; width: min(680px,calc(100vw - 40px));
    max-height: calc(100dvh - 40px); overflow-y: auto; margin: auto; padding: 48px 36px 36px;
    border: 0; background: transparent; color: #e9e0d2;
    box-shadow: none; outline: none;}
.currentMenuDialog::backdrop {background: rgba(5,8,8,.76); backdrop-filter: blur(14px);}
.currentMenuDialog h2 {margin: 0 0 30px; font: 400 clamp(2.8rem,5vw,4.5rem)/1.04 var(--header-font); letter-spacing: -.025em;}
.currentMenuStory {margin: -8px 0 28px; color: var(--line-soft);
    font: 400 .9rem/1.75 var(--content-font);}
.currentMenuStory p {margin: 0 0 16px;}
.currentMenuStory p:last-child {margin-bottom: 0;}
.currentMenuClose {position: absolute; top: 8px; right: 10px; width: 44px; height: 44px;
    padding: 0; border: 0; background: none; color: #e9e0d2; font: 300 1.8rem/1 var(--content-font); cursor: pointer;}
.currentMenuOptions {margin: 0; font: 400 1rem/1.5 var(--content-font);}
.currentMenuOptions > div {display: flex; justify-content: space-between; gap: 20px;
    padding: 16px 0; border: 0;}
.currentMenuOptions dt {color: var(--brass);}
.currentMenuOptions dd {margin: 0; text-align: right;}
.currentMenuOptions dd span {display: block; color: var(--line-soft); font-size: .78rem;}
.currentMenuNote {margin: 24px 0 0; color: var(--line-soft); font: 400 .78rem/1.5 var(--content-font);}
@media (min-width: 1181px) and (max-height: 950px) {
    #pageNavigation {padding-top: 110px; padding-bottom: 24px;}
    #pageNavigation nav {min-height: calc(100dvh - 134px);}
    #pageNavigation .languageSwitch {top: 48px;}
    #pageNavigation nav .reservation {margin-bottom: 24px; padding-bottom: 16px;}
    #pageNavigation nav > a {padding-top: 5px; padding-bottom: 5px;}
    #pageNavigation nav a[href$="/gift-certificate"], #pageNavigation nav a[href$="/darilni-bon"] {margin-top: 10px; padding-top: 14px;}
    #pageNavigation nav .menuDetails {padding-top: 16px; margin-top: auto;}
    #pageNavigation nav .menuPricesTrigger {padding-bottom: 14px; margin-bottom: 14px;}
}
@media (min-width: 1181px) and (max-height: 800px) {
    #pageNavigation {padding-top: 84px; padding-bottom: 20px;}
    #pageNavigation nav {min-height: calc(100dvh - 104px);}
    #pageNavigation .languageSwitch {top: 32px;}
    #pageNavigation nav .reservation {margin-bottom: 16px; padding-bottom: 12px;}
    #pageNavigation nav .reservation-intro {margin-bottom: 5px;}
    #pageNavigation nav .reservation-powered {margin-top: 5px;}
    #pageNavigation nav > a {padding-top: 4px; padding-bottom: 4px;}
    #pageNavigation nav a[href$="/gift-certificate"], #pageNavigation nav a[href$="/darilni-bon"] {margin-top: 7px; padding-top: 11px;}
    #pageNavigation nav .menuDetails {padding-top: 12px;}
    #pageNavigation nav .menuPricesTrigger {padding-bottom: 12px; margin-bottom: 12px;}
    #pageNavigation nav .menuRecognitions li {margin-bottom: 3px;}
}

/* A cinematic reveal without a visible modal panel. */
.currentMenuDialog[open] {animation: menuAtmosphereIn .65s ease both;}
.currentMenuDialog[open]::backdrop {animation: menuAtmosphereIn .65s ease both;}
.currentMenuDialog[open] .menuPricesEyebrow,
.currentMenuDialog[open] h2,
.currentMenuDialog[open] .currentMenuStory p,
.currentMenuDialog[open] .currentMenuOptions > div,
.currentMenuDialog[open] .currentMenuNote {animation: menuTextIn 1s cubic-bezier(.16,1,.3,1) both;}
.currentMenuDialog[open] .menuPricesEyebrow {animation-delay: .12s;}
.currentMenuDialog[open] h2 {animation-delay: .22s;}
.currentMenuDialog[open] .currentMenuStory p:first-child {animation-delay: .36s;}
.currentMenuDialog[open] .currentMenuStory p:nth-child(2) {animation-delay: .47s;}
.currentMenuDialog[open] .currentMenuOptions > div:first-child {animation-delay: .58s;}
.currentMenuDialog[open] .currentMenuOptions > div:nth-child(2) {animation-delay: .68s;}
.currentMenuDialog[open] .currentMenuNote {animation-delay: .78s;}
.currentMenuDialog[open].is-closing,
.currentMenuDialog[open].is-closing::backdrop {animation: menuAtmosphereOut .28s ease both;}
@keyframes menuAtmosphereIn {from {opacity: 0;} to {opacity: 1;}}
@keyframes menuAtmosphereOut {from {opacity: 1;} to {opacity: 0;}}
@keyframes menuTextIn {
    from {opacity: 0; transform: translateY(22px); filter: blur(7px);}
    to {opacity: 1; transform: translateY(0); filter: blur(0);}
}
@media (max-width: 600px) {
    .currentMenuDialog {padding: 52px 12px 28px;}
    .currentMenuStory {font-size: .9rem; line-height: 1.7;}
}
@media (prefers-reduced-motion: reduce) {
    .currentMenuDialog[open], .currentMenuDialog[open]::backdrop,
    .currentMenuDialog[open] .menuPricesEyebrow, .currentMenuDialog[open] h2,
    .currentMenuDialog[open] .currentMenuStory p, .currentMenuDialog[open] .currentMenuOptions > div,
    .currentMenuDialog[open] .currentMenuNote {animation: none;}
}