/* cucina */

/* ---------- JOURNEY ---------- */
.segline{
  font-family:var(--mono);
  font-size:clamp(9.5px,.9vw,11.5px);
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--bronze);
  margin-bottom:10px;
}
.grid{display:grid;grid-template-columns:1fr;gap:clamp(28px,4vw,60px) 40px}

@media (min-width:620px){
  .grid{grid-template-columns:1fr 1fr}
}

@media (min-width:1000px){
  .grid{grid-template-columns:1fr 1fr 1fr}
}

.d .nm{font-family:var(--serif);font-size:clamp(17px,1.8vw,20px);line-height:1.22;color:var(--ink);margin-top:16px}

@media (max-width:760px){
  main{margin-left:0;padding-top:52px}
}

@media (min-width:761px){
  .grid{
    display:grid!important;
    grid-template-columns:repeat(12,1fr)!important;
    column-gap:clamp(20px,2.4vw,40px);
    row-gap:clamp(46px,6vw,96px);
    align-items:end;
  }
  .grid .d:nth-child(1){grid-column:1/7}
  .grid .d:nth-child(2){grid-column:8/13;margin-right:calc(var(--gut)*-1)}
  .grid .d:nth-child(3){grid-column:2/8}
  .grid .d:nth-child(4){grid-column:9/13}
  .grid .d:nth-child(5){grid-column:1/6}
  .grid .d:nth-child(6){grid-column:7/13;margin-right:calc(var(--gut)*-1)}
}

/* hide section eyebrows */
.eyerow{display:none!important}
/* ---------- INTERLUDIO · OPERA HOTEL KYIV ---------- */
.kyiv{padding-top:0;padding-bottom:clamp(64px,9vw,120px);border-top:0;background:var(--paper)}
.kyiv .kf{margin:0}
.kyiv .kim{display:block;overflow:hidden}
.kyiv .kf img{width:100%;height:auto;display:block}
.kyiv .kcap{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--soft);
  margin-top:10px;
}
.kyiv .kf-wide{margin-left:calc(var(--gut)*-1);margin-right:calc(var(--gut)*-1)}
.kyiv .kf-wide .kcap{padding-left:var(--gut)}
.kyiv .krow{margin-top:clamp(40px,6vw,84px)}

@media (min-width:761px){
  .kyiv .krow{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(20px,2.4vw,34px);align-items:start}
  .kyiv .kf-a{grid-column:1/8}
  .kyiv .kf-b{grid-column:9/13;margin-right:calc(var(--gut)*-1);margin-top:clamp(70px,11vw,170px)}
}

@media (max-width:760px){
  .kyiv .kf-b{margin-top:clamp(28px,7vw,44px)}
}

/* dish gallery */
.galx{margin-top:clamp(56px,8vw,120px)}
.galx .gx{margin:0 0 clamp(20px,3vw,40px)}
.galx .gxi{display:block;overflow:hidden;background:#e9e4d7}
.galx .gx img{width:100%;height:auto;display:block}

@media (min-width:761px){
  .galx{
    display:grid;
    grid-template-columns:repeat(12,1fr);
    column-gap:clamp(20px,2.4vw,34px);
    row-gap:clamp(40px,6vw,90px);
    align-items:start;
  }
  .galx .gx{margin:0}
  .galx .gx:nth-child(1){grid-column:1/7}
  .galx .gx:nth-child(2){grid-column:8/13;margin-right:calc(var(--gut)*-1);margin-top:clamp(60px,9vw,150px)}
  .galx .gx:nth-child(3){grid-column:2/6;margin-top:clamp(20px,3vw,48px)}
  .galx .gx:nth-child(4){grid-column:7/13}
  .galx .gx:nth-child(5){grid-column:1/8}
  .galx .gx:nth-child(6){grid-column:9/13;margin-right:calc(var(--gut)*-1);margin-top:clamp(40px,6vw,110px)}
}

.kyiv .ilm{
  display:flex;
  align-items:center;
  gap:14px;
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--soft);
  margin-bottom:clamp(20px,2.6vw,34px);
}
.kyiv .ilm i{display:block;width:34px;height:1px;background:var(--bronze);flex:0 0 auto}
.kyiv .ilm b{font-weight:400;margin-left:auto;text-align:right}

@media (max-width:620px){
  .kyiv .ilm b{display:none}
}

.d .nm, .galx .nm{text-wrap:balance}

@media (min-width:1600px){
  main{margin-left:calc((100vw - 1560px) / 2 + var(--rail));margin-right:calc((100vw - 1560px) / 2)}
}

main{
  margin-left:0!important;
  margin-right:0!important;
  max-width:1560px!important;
  margin-inline:auto!important;
  padding-top:0!important;
}

@media print{
  .intro, .curve, .viewer{display:none!important}
  main{margin-left:0!important}
  html.js .rvf, html.js .rv{opacity:1!important;transform:none!important}
  .rvl .word, .rvl .char, .mlc b, .ml b{transform:none!important;opacity:1!important}
  section{break-inside:avoid;padding:18pt 0}
  .footer, .foot{background:none!important;color:#18160F!important}
}

/* explicit line breaks on desktop */
.footer .cinvite{max-width:none}

@media (max-width:900px){
  .footer .cinvite{max-width:38ch}
}

/* ---------- MY CUISINE ---------- */
.mycuis{padding:clamp(48px,7vw,96px) var(--gut) 0}
.mycuis .eyerow{margin-bottom:clamp(20px,2.6vw,34px)}
.mq{
  max-width:58ch;
  font-family:var(--serif);
  font-size:clamp(18px,1.8vw,25px);
  line-height:1.5;
  color:var(--ink);
  margin:0 0 16px;
}
.galx .gxcap{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(15px,1.35vw,19px);
  line-height:1.35;
  color:var(--ink);
  margin-top:12px;
  max-width:44ch;
}
/* le firme - signature takeover */
.fserv{position:relative;height:calc(100vh + 240vh);background:var(--paper);padding:0!important;margin:0}
.fserv.fserv--static{height:auto}
.fservvp{
  position:sticky;
  top:0;
  height:100vh;
  height:100lvh;
  display:grid;
  grid-template-columns:43fr 57fr;
  overflow:hidden;
}
.fserv--static .fservvp{position:static;height:100vh}
.fservtxt{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(20px,3vw,44px) clamp(20px,3vw,52px);
  padding-left:calc(var(--rail,66px) + clamp(16px,2.4vw,44px));
}
.fservey{position:absolute;top:clamp(76px,10vh,110px);left:calc(var(--rail,66px) + clamp(16px,2.4vw,44px));margin:0}
.fservghost{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.fservghost .fscn{
  position:absolute;
  right:clamp(6px,1.2vw,20px);
  bottom:-0.12em;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(160px,26vh,320px);
  line-height:.8;
  color:var(--line);
  opacity:0;
  transform:translateY(14%);
  transition:opacity .6s ease,transform .9s cubic-bezier(.16,1,.3,1);
}
.fservghost .fscn.live{opacity:1;transform:none}
.fservnames{position:relative;z-index:1;min-height:34vh;display:grid;align-items:center}
.fsnm{grid-area:1/1;opacity:0;pointer-events:none}
.fsnm.live{opacity:1}
.fsnm-t{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(30px,3.3vw,56px);
  line-height:1.05;
  letter-spacing:-.02em;
  color:var(--ink);
  margin:0;
  text-wrap:balance;
}
.fsnm-t em{font-style:italic;color:var(--olive)}
.fsnm-s{
  font-family:var(--mono);
  font-size:clamp(9.5px,.85vw,11.5px);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--soft);
  margin:clamp(12px,1.8vh,20px) 0 0;
}
.fsnm .lm{display:block;overflow:hidden;padding:.03em 0 .06em}
.fsnm .lm>span{display:block;transform:translateY(112%);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.fsnm.live .lm>span{transform:none}
.fsnm.live .lm:nth-child(2)>span{transition-delay:.07s}
.fsnm.live .lm:nth-child(3)>span{transition-delay:.14s}
.fsnm .fsnm-s{opacity:0;transform:translateY(12px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.fsnm.live .fsnm-s{opacity:1;transform:none;transition-delay:.2s}
.fservflo{
  position:absolute;
  bottom:clamp(58px,9vh,92px);
  left:calc(var(--rail,66px) + clamp(16px,2.4vw,44px));
  right:clamp(20px,3vw,52px);
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--soft);
  line-height:1.7;
  max-width:38ch;
}
.fservmeta{
  position:absolute;
  bottom:clamp(22px,4vh,44px);
  left:calc(var(--rail,66px) + clamp(16px,2.4vw,44px));
  display:flex;
  align-items:baseline;
  gap:10px;
  font-family:var(--mono);
  letter-spacing:.14em;
  color:var(--soft);
}
.fservmeta .fservn{font-size:clamp(13px,1.3vw,17px);color:var(--ink)}
.fservmeta .fservof{font-size:10.5px}
.fservmedia{position:relative;overflow:hidden}
.fservmedia .fsph{position:absolute;inset:0}
.fservmedia .fsph img{width:100%;height:100%;object-fit:cover;display:block}
html.js .fservmedia .fsph{clip-path:inset(0 0 100% 0)}
html.js .fservmedia .fsph[data-i="0"]{clip-path:inset(0)}
.fserv--static .fservmedia .fsph{display:none}
.fserv--static .fservmedia .fsph[data-i="0"]{display:block;clip-path:none}

@media (max-width:899px){
  .fservtxt, .fservey, .fservflo, .fservmeta{padding-left:clamp(20px,5vw,32px);left:auto}
  .fservey{left:clamp(20px,5vw,32px)}
  .fservflo{left:clamp(20px,5vw,32px);bottom:clamp(52px,8vh,80px)}
  .fservmeta{left:clamp(20px,5vw,32px)}
  .fservvp{grid-template-columns:1fr;grid-template-rows:52fr 48fr}
  .fservmedia{order:-1}
  .fservnames{min-height:0}
  .fservghost .fscn{font-size:clamp(110px,16vh,180px)}
  .fserv{height:calc(100vh + 200vh)}
}

@media (prefers-reduced-motion:reduce){
  .fsnm .lm>span, .fsnm .fsnm-s, .fservghost .fscn{transition:none}
}

.cucina-rest{padding-top:clamp(40px,6vw,80px)}
/* hover */
.grid .dw{display:block;overflow:hidden}
.grid .d img{transition:transform .9s cubic-bezier(.16,1,.3,1)}
.grid .d:hover img{transform:scale(1.035)}
.grid .d .nm{transition:color .35s}
.grid .d:hover .nm{color:var(--olive)}
.galx .gxi{display:block;overflow:hidden}
.galx .gx img{transition:transform .9s cubic-bezier(.16,1,.3,1)}
.galx .gx:hover img{transform:scale(1.035)}
.galx .gx:hover .gxcap{color:var(--olive)}
.galx .gxcap{transition:color .35s}

@media (prefers-reduced-motion:reduce){
  .grid .d img, .galx .gx img{transition:none}
  .grid .d:hover img, .galx .gx:hover img{transform:none}
}