/* ==========================================================================
   VANDER — Urbani Resort · static rebuild
   Design tokens extracted from the live site:
   cream #f4f2f1 · ink #353230 · brown #967850 · grey #86837e
  Typo: Le Bristol-inspired pairing — Boska display + Gill Sans text
   ========================================================================== */

:root{
  --cream:#f3e8e5;
  --dark:#282523;
  --brown:#9f4f2d;
  --grey:#86837e;
  --line:rgba(53,50,48,.16);
  --line-light:rgba(244,242,241,.22);
  --font-display:"Boska","Iowan Old Style",Baskerville,"Times New Roman",serif;
  --font-text:"Gill Sans","Gill Sans MT","Trebuchet MS",Arial,sans-serif;
  --pad:3.25%;
  --gap:1.5rem;
  --ease:cubic-bezier(.22,1,.36,1);
  --header-h:112px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--cream);
  color:var(--dark);
  font-family:var(--font-text);
  font-size:1rem;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
figure{margin:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--brown);color:var(--cream)}
.page-wrapper{overflow:clip}

/* ------------------------------------------------------------------ type */
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:400;
  text-transform:none;
  margin:0;
  line-height:1.08;
  letter-spacing:-.01em;
}
h1{font-size:clamp(2.6rem,7.4vw,7rem)}
h2{font-size:clamp(3rem,5.4vw,6.25rem)}
h3{font-size:clamp(1.6rem,3.6vw,4rem)}
p{margin:0;font-size:1.0625rem;line-height:1.45}
.text-italic{font-style:italic;text-transform:none}
.text-brown{color:var(--brown)}
.lede{font-size:clamp(1rem,1.35vw,1.4rem);max-width:38ch}
small,.micro{font-size:.8125rem;line-height:1.35}

.label{
  font-size:.8125rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--brown);
}
.num{
  font-size:.8125rem;
  letter-spacing:.08em;
  color:var(--brown);
}
.section-head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:1rem;
  padding:0 0 2.5rem;
}
.u-upper{text-transform:uppercase}
.align-right{text-align:right}
.align-center{text-align:center}

/* ---------------------------------------------------------------- layout */
.wrap{padding-left:var(--pad);padding-right:var(--pad)}
.section{
  padding-top:8rem;padding-bottom:8rem;position:relative;
  background:var(--cream);
  border-top:1px solid rgba(159,79,45,.18);
}
.section--tight{padding-top:5rem;padding-bottom:5rem}
.section--dark{background:var(--cream);color:var(--dark)}
.section--dark .label,.section--dark .num{color:var(--brown)}
.section h2{letter-spacing:-.035em}
.grid{display:grid;gap:var(--gap)}
.cols-2{grid-template-columns:1fr 1fr}
.cols-3{grid-template-columns:repeat(3,1fr)}
.cols-12{grid-template-columns:repeat(12,1fr)}
.mt-lg{margin-top:4rem}.mt-md{margin-top:2rem}.mt-sm{margin-top:1rem}

/* --------------------------------------------------------------- buttons */
.btn-circle{
  --stroke:var(--dark);
  display:inline-flex;align-items:center;justify-content:center;
  min-width:11rem;min-height:6.5rem;
  padding:1rem 2rem;
  text-transform:uppercase;font-size:.9375rem;letter-spacing:.02em;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120' preserveAspectRatio='none'%3E%3Cpath d='M100 6C52 6 10 26 7 58c-3 33 36 55 96 55s99-22 96-56C196 25 149 6 100 6z' fill='none' stroke='%23353230' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-size:100% 100%;background-position:center;
  transition:transform .5s var(--ease);
  text-align:center;
}
.btn-circle:hover{transform:rotate(-2deg) scale(1.03)}
.btn-circle--brown{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120' preserveAspectRatio='none'%3E%3Cpath d='M100 6C52 6 10 26 7 58c-3 33 36 55 96 55s99-22 96-56C196 25 149 6 100 6z' fill='none' stroke='%23a55f4d' stroke-width='1.6'/%3E%3C/svg%3E");color:var(--brown)}
.btn-circle--light{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120' preserveAspectRatio='none'%3E%3Cpath d='M100 6C52 6 10 26 7 58c-3 33 36 55 96 55s99-22 96-56C196 25 149 6 100 6z' fill='none' stroke='%23e1e5ea' stroke-width='1.6'/%3E%3C/svg%3E");color:var(--cream)}
.btn-circle--sm{min-width:8.5rem;min-height:5rem;padding:.75rem 1.25rem;font-size:.8125rem}

.btn-line{
  display:inline-flex;flex-direction:column;align-items:center;gap:.35rem;
  text-transform:uppercase;font-size:.9375rem;letter-spacing:.02em;
  padding:.6rem .4rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 8' preserveAspectRatio='none'%3E%3Cpath d='M2 5C42 1.5 96 1 198 3' fill='none' stroke='%23353230' stroke-width='1.4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:50% 100%;background-size:100% 6px;
  transition:transform .4s var(--ease);
}
.btn-line:hover{transform:translateY(2px)}
.btn-line--brown{color:var(--brown);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 8' preserveAspectRatio='none'%3E%3Cpath d='M2 5C42 1.5 96 1 198 3' fill='none' stroke='%23a55f4d' stroke-width='1.4'/%3E%3C/svg%3E")}
.btn-line--light{color:var(--cream);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 8' preserveAspectRatio='none'%3E%3Cpath d='M2 5C42 1.5 96 1 198 3' fill='none' stroke='%23e1e5ea' stroke-width='1.4'/%3E%3C/svg%3E")}
.btn-row{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center}
.btn-row .btn-circle{min-width:10rem;min-height:5.6rem}

/* ------------------------------------------------------------ announce bar */
.announce{
  position:fixed;top:0;left:0;right:0;z-index:120;
  background:var(--cream);color:var(--dark);
  font-size:.75rem;line-height:1;text-transform:none;
  padding:.55rem 0;
  border-bottom:1px solid rgba(159,79,45,.12);
}
.announce a,.announce span{display:block;text-align:center;opacity:.92;transition:opacity .3s}
.announce a:hover{opacity:1}
.announce b{font-weight:400;border-bottom:1px solid rgba(159,79,45,.35)}

/* ---------------------------------------------------------------- header */
.header{
  position:fixed;top:33px;left:0;right:0;z-index:110;
  padding:1.9rem var(--pad) 1.1rem;
  background:rgba(243,232,229,.96);
  border-bottom:1px solid rgba(159,79,45,.15);
  transition:background .45s var(--ease),padding .45s var(--ease),box-shadow .45s var(--ease),color .45s var(--ease);
}
.header.is-scrolled{
  background:rgba(243,232,229,.94);
  backdrop-filter:blur(10px);
  padding-top:.9rem;padding-bottom:.9rem;
  box-shadow:0 1px 0 var(--line);
}
.header__inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.logo{display:flex;flex-direction:column;line-height:1;gap:.3rem}
.logo__mark{font-family:var(--font-display);font-size:1.5rem;letter-spacing:.01em;text-transform:none}
.logo__sub{font-size:.5625rem;letter-spacing:.28em;text-transform:uppercase;color:var(--brown)}
.nav{display:flex;align-items:center;gap:1.75rem}
.nav__link{
  text-transform:uppercase;font-size:.8125rem;letter-spacing:.03em;
  position:relative;padding:.25rem 0;
}
.nav__link::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:left;
  transition:transform .45s var(--ease);
}
.nav__link:hover::after,.nav__link[aria-current="page"]::after{transform:scaleX(1)}
.nav__right{display:flex;align-items:center;gap:1.25rem}
.header .btn-circle--sm{
  min-width:9rem;min-height:3.75rem;
  border:1px solid var(--brown);border-radius:.55rem;
  background-image:none;color:var(--brown);
}
.lang{display:flex;align-items:center;gap:.35rem;font-size:.75rem;text-transform:uppercase;color:var(--grey);letter-spacing:.06em;white-space:nowrap}
.lang__option{padding:.25rem 0;color:inherit;transition:color .25s ease,opacity .25s ease;opacity:.52}
.lang__option:hover,.lang__option.is-active{color:var(--ink);opacity:1}
.lang--mobile{display:none}
.burger{display:none;flex-direction:column;gap:.35rem;padding:.5rem;margin-right:-.5rem}
.burger span{display:block;width:1.75rem;height:1px;background:currentColor;transition:transform .4s var(--ease),opacity .3s}
.burger.is-open span:first-child{transform:translateY(3px) rotate(45deg)}
.burger.is-open span:last-child{transform:translateY(-3px) rotate(-45deg)}

/* full screen menu */
.menu-overlay{
  position:fixed;inset:0;z-index:115;background:var(--dark);color:var(--cream);
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  gap:1rem;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s;
}
.menu-overlay.is-open{opacity:1;visibility:visible}
.menu-overlay a.menu-link{
  font-size:clamp(2rem,7vw,2.75rem);text-transform:uppercase;line-height:1.1;letter-spacing:-.01em;
  opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease),transform .5s var(--ease);
}
.menu-overlay.is-open a.menu-link{opacity:1;transform:none}
.menu-overlay a.menu-link:nth-child(1){transition-delay:.08s}
.menu-overlay a.menu-link:nth-child(2){transition-delay:.14s}
.menu-overlay a.menu-link:nth-child(3){transition-delay:.2s}
.menu-overlay a.menu-link:nth-child(4){transition-delay:.26s}
.menu-overlay a.menu-link:nth-child(5){transition-delay:.32s}
.menu-overlay .menu-foot{position:absolute;bottom:2.5rem;left:0;right:0;display:flex;justify-content:center;gap:1.5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;opacity:.75}

/* ------------------------------------------------------------------ hero */
.hero{
  min-height:165svh;
  text-align:center;position:relative;
  padding:0;
  overflow:visible;
  isolation:isolate;
  background:#eee7e8;
}
.hero__stage{
  position:sticky;top:0;
  height:100svh;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  padding:calc(var(--header-h) + 4rem) var(--pad) 10rem;
  overflow:hidden;
}
.hero__inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.75rem;width:100%}
.hero__city,.hero__canvas{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;max-width:none;
  object-fit:cover;object-position:center bottom;
  pointer-events:none;
}
.hero__canvas{z-index:1;opacity:0;transition:opacity .35s ease}
.hero__canvas.is-ready{opacity:1}
.hero__script{width:clamp(9rem,13vw,12rem);opacity:.9}
.hero h1{position:relative;z-index:5;line-height:1;text-transform:uppercase}
.hero h1 span{display:block}
.hero__lede{position:relative;z-index:5;max-width:34rem;overflow:hidden}
.hero__cta{position:relative;z-index:5;padding-top:.5rem}
.hero__cta .btn-circle{
  min-width:18rem;min-height:3.75rem;
  border-radius:999px;
  background:var(--brown);
  background-image:none;
  color:#fff;
}
.hero__float{
  position:absolute;width:6.5vw;min-width:64px;max-width:104px;
  aspect-ratio:3/4;object-fit:cover;z-index:1;
  box-shadow:0 18px 40px rgba(53,50,48,.14);
  animation:float 9s ease-in-out infinite;
}
.hero__float.is-1{top:-22%;left:-30%}
.hero__float.is-2{top:-18%;right:-30%;animation-delay:-2.5s}
.hero__float.is-3{bottom:-8%;left:-42%;animation-delay:-5s}
.hero__float.is-4{bottom:-16%;right:-38%;animation-delay:-7s}
@keyframes float{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-14px) rotate(1.2deg)}}

@media (min-width:1200px){
  .hero__float.is-1{left:-14rem}
  .hero__float.is-2{right:-14rem}
  .hero__float.is-3{left:-19rem}
  .hero__float.is-4{right:-17rem}
}

/* ----------------------------------------------------------- wake up / 01 */
.wake .head-top{display:grid;grid-template-columns:1fr auto;align-items:end;gap:2rem}
.media{
  position:relative;overflow:clip;background:#e7e3e0;
  border-radius:0;
  box-shadow:none;
}
.media img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.media:hover img{transform:scale(1.015)}
.media--portrait{aspect-ratio:6.5/8}
.media--portrait-tall{aspect-ratio:3/4}
.media--wide{aspect-ratio:16/10}
.media--square{aspect-ratio:1}
.wake__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.wake__copy{padding-top:clamp(1rem,6vw,6rem);display:flex;flex-direction:column;gap:1.75rem;max-width:34rem}
.rooms-editorial{
  display:grid;grid-template-columns:minmax(17rem,.72fr) minmax(0,2.28fr);
  gap:clamp(2.5rem,4vw,5rem);align-items:stretch;
}
.rooms-editorial__intro{
  min-height:clamp(32rem,42vw,42rem);display:flex;flex-direction:column;
  align-items:flex-start;gap:1.5rem;padding:.25rem 0;
}
.rooms-editorial__intro h2{font-size:clamp(3.5rem,5vw,5.5rem);line-height:.94;text-transform:none}
.rooms-editorial__intro p{max-width:28rem}
.rooms-editorial__intro p:first-of-type{margin-top:auto}
.rooms-editorial__rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;min-width:0}
.room-tile{position:relative;overflow:hidden;min-width:0;background:#ded8d3;aspect-ratio:.77}
.room-tile::after{
  content:"";position:absolute;inset:52% 0 0;
  background:linear-gradient(transparent,rgba(25,22,20,.66));pointer-events:none;
}
.room-tile img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.room-tile:hover img{transform:scale(1.015)}
.room-tile figcaption{
  position:absolute;z-index:2;left:1.5rem;right:1.5rem;bottom:1.35rem;
  display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;color:white;
}
.room-tile figcaption span{font-family:var(--font-display);font-size:clamp(1.7rem,2.4vw,2.8rem);line-height:1}
.room-tile figcaption small{text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid currentColor;padding-bottom:.25rem}
.amenities{list-style:none;margin:0;padding:0;display:grid;gap:.65rem}
.amenities li{display:flex;gap:.75rem;align-items:baseline;font-size:1rem}
.amenities li::before{content:"—";color:var(--brown)}
.h2-lines{display:flex;flex-direction:column}
.h2-lines .is-right{align-self:flex-end}
.badge{
  display:inline-flex;align-items:center;gap:.5rem;
  border:1px solid currentColor;border-radius:100px;padding:.35rem .85rem;
  font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--brown);
  align-self:flex-start;
}

/* ------------------------------------------------------- experience / 02 */
.exp__head{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:end}
.exp__head .badge{justify-self:start;width:max-content}
.exp__lines{display:flex;flex-direction:column}
.exp__lines .is-right{align-self:flex-end;text-align:right}
.exp__body{
  display:grid;grid-template-columns:minmax(0,1.42fr) minmax(18rem,.78fr);
  gap:clamp(3rem,7vw,8rem);align-items:start;margin-top:5rem;
}
.exp__main{aspect-ratio:1.34;margin-top:5rem}
.exp__main img{object-position:center 72%}
.exp__aside{display:flex;flex-direction:column;align-items:flex-start}
.exp__secondary{width:72%;aspect-ratio:.74;align-self:flex-start}
.exp__secondary img{object-position:52% center}
.section[id],.footer[id]{scroll-margin-top:150px}
.exp__copy{display:flex;flex-direction:column;gap:1.75rem;max-width:31rem;margin-top:4rem}
.section--dark .btn-circle--light{
  min-width:12rem;min-height:4rem;
  border:1px solid var(--brown);border-radius:.55rem;
  background-image:none;color:var(--brown);
}
.section--dark .btn-line--light{
  color:var(--dark);background-image:none;
  border-bottom:1px solid var(--brown);
}

/* ----------------------------------------------------------- events / 03 */
.events__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.events__copy{display:flex;flex-direction:column;gap:1.5rem;max-width:36rem}
.practical-banner{position:relative;min-height:clamp(32rem,38vw,43rem);margin-top:1.5rem}
.practical-banner__media{position:absolute;inset:0;overflow:hidden}
.practical-banner__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,17,15,.15),transparent 55%)}
.practical-banner__media img{width:100%;height:100%;object-fit:cover}
.practical-banner__card{
  position:absolute;z-index:2;top:50%;left:4.5%;transform:translateY(-50%);
  width:min(34rem,40%);background:#fff;padding:clamp(2.25rem,3.2vw,4rem);
  display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem;
}
.practical-banner__card h2{font-size:clamp(2.8rem,4vw,4.5rem);line-height:.98;text-transform:none}

.section .btn-circle:not(.btn-circle--light){
  background-image:none;
}
.section .btn-circle--sm{
  min-width:12rem;min-height:4rem;
  border:1px solid var(--brown);border-radius:.55rem;
  color:var(--brown);
}
.section .btn-line{
  background-image:none;
  border-bottom:1px solid var(--brown);
}

/* ------------------------------------------------------------ newsletter */
.newsletter{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.25rem}
.newsletter h2{max-width:20ch}
.field-row{
  display:flex;align-items:center;gap:1rem;flex-wrap:wrap;justify-content:center;
  border-bottom:1px solid var(--line);padding-bottom:.6rem;margin-top:1rem;min-width:min(30rem,90vw);
}
.field-row input{
  flex:1;min-width:12rem;border:0;background:transparent;color:inherit;
  font-size:1rem;padding:.55rem .25rem;outline:none;
}
.field-row input::placeholder{color:var(--grey)}
.form-note{font-size:.75rem;color:var(--grey);max-width:32rem}
.form-msg{font-size:.8125rem;color:var(--brown);min-height:1rem}

/* --------------------------------------------------------------- services */
.services{display:flex;flex-direction:column;gap:2.5rem}
.services__head{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}
.services__head .right{text-align:right}
.insta-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.625rem}
.insta-grid .media{aspect-ratio:1}
.places-rail{
  display:grid;grid-template-columns:repeat(4,minmax(21rem,1fr));gap:1rem;
  overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem;
}
.place-card{scroll-snap-align:start;min-width:0;border:1px solid var(--line);background:rgba(255,255,255,.42)}
.place-card img{width:100%;aspect-ratio:1.48;object-fit:cover}
.place-card figcaption{min-height:8.5rem;padding:1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.35rem}
.place-card figcaption span{font-size:1rem;text-transform:uppercase;letter-spacing:.06em}
.place-card figcaption small{font-size:.8125rem;color:var(--grey);text-transform:uppercase;letter-spacing:.05em}
.insta-note{display:flex;justify-content:center;color:var(--brown);font-size:.8125rem;text-transform:uppercase;letter-spacing:.04em}

/* ------------------------------------------------------------------ pages */
.page-hero{
  min-height:62svh;display:flex;flex-direction:column;justify-content:flex-end;
  padding:calc(var(--header-h) + 5rem) var(--pad) 3.5rem;gap:1.5rem;
}
.page-hero__meta{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.intro-block{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:end}
.article-list{display:grid;gap:0}
.article-row{
  display:grid;grid-template-columns:9rem 1fr auto;gap:1.5rem;align-items:baseline;
  padding:1.75rem 0;border-top:1px solid var(--line);
  transition:padding .4s var(--ease),color .4s;
}
.article-row:hover{padding-left:.75rem;color:var(--brown)}
.article-row h3{font-size:clamp(1.25rem,2.2vw,2rem)}
.article-row .date{font-size:.8125rem;color:var(--grey);text-transform:uppercase}

/* rooms list */
.room-block{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,6vw,6rem);align-items:center;padding:4.5rem 0;border-top:1px solid var(--line)}
.room-block:nth-child(even) .room-block__media{order:2}
.room-block__copy{display:flex;flex-direction:column;gap:1.25rem;max-width:34rem}
.room-meta{display:flex;gap:1.5rem;flex-wrap:wrap;font-size:.8125rem;color:var(--grey);text-transform:uppercase}
.spec-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.spec-list li{border:1px solid var(--line);border-radius:100px;padding:.3rem .8rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em}

/* menus (food & drink) */
.menu-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem)}
.menu-list{list-style:none;margin:0;padding:0}
.menu-list li{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:baseline;padding:1rem 0;border-bottom:1px solid var(--line)}
.menu-list .dish{display:flex;flex-direction:column;gap:.25rem}
.menu-list .dish small{color:var(--grey);font-size:.8125rem}
.menu-list .price{color:var(--brown);font-size:.9375rem;white-space:nowrap}
.table-form{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;align-items:end}
.input{display:flex;flex-direction:column;gap:.4rem}
.input label{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--grey)}
.input input,.input select,.input textarea{
  border:0;border-bottom:1px solid var(--line);background:transparent;color:inherit;
  padding:.55rem .15rem;font-size:1rem;font-family:inherit;outline:none;
}
.section--dark .input input,.section--dark .input select,.section--dark .input textarea{border-color:var(--line-light)}
.input input:focus,.input select:focus{border-color:var(--brown)}

/* ----------------------------------------------------------------- footer */
.footer{background:var(--dark);color:var(--cream);padding-top:4rem}
.footer__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.625rem}
.footer__grid .media{aspect-ratio:1}
.footer__body{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:2.5rem;padding:4.5rem 0 3rem}
.footer h4{font-size:.8125rem;letter-spacing:.06em;color:#c9a97b;margin-bottom:1.25rem}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;font-size:.9375rem}
.footer a{opacity:.9;transition:opacity .3s,color .3s}
.footer a:hover{opacity:1;color:#c9a97b}
.footer .logo__sub{color:#c9a97b}
.footer__bottom{
  display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
  border-top:1px solid var(--line-light);padding:1.75rem 0 2.25rem;
  font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;opacity:.8;
}
.footer__bottom .links{display:flex;gap:1.25rem;flex-wrap:wrap}

/* ----------------------------------------------------------------- modals */
.modal{
  position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  padding:2rem;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s;
}
.modal.is-open{opacity:1;visibility:visible}
.modal__bg{position:absolute;inset:0;background:rgba(31,29,28,.6);backdrop-filter:blur(3px)}
.modal__panel{
  position:relative;background:var(--cream);color:var(--dark);
  width:min(68rem,100%);max-height:88svh;overflow:auto;
  display:grid;grid-template-columns:1fr 1fr;
  transform:translateY(24px) scale(.98);transition:transform .5s var(--ease);
}
.modal.is-open .modal__panel{transform:none}
.modal__close{position:absolute;top:1rem;right:1.25rem;font-size:1.5rem;line-height:1;z-index:3;padding:.35rem}
.modal__aside{background:var(--dark);color:var(--cream);position:relative;overflow:hidden;padding:2.5rem;display:flex;flex-direction:column;justify-content:space-between;min-height:26rem}
.modal__aside img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.modal__aside-inner{position:relative;z-index:2;display:flex;flex-direction:column;gap:1rem}
.modal__marquee{display:flex;flex-direction:column;gap:.15rem;font-size:clamp(1.6rem,3.4vw,2.6rem);text-transform:uppercase;line-height:1.05}
.modal__marquee b{font-weight:400;color:#c9a97b}
.modal__form{padding:3rem 2.5rem}
.modal__form form{display:grid;gap:1.25rem}
.modal__form .split{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.modal__foot{display:flex;flex-direction:column;gap:.75rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.8125rem;text-transform:uppercase;letter-spacing:.04em}

/* ------------------------------------------------------------ animations */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.reveal-lines span{display:block;opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal-lines.is-in span{opacity:1;transform:none}
.reveal-lines.is-in span:nth-child(2){transition-delay:.12s}
.reveal-lines.is-in span:nth-child(3){transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal,.reveal-lines span{opacity:1;transform:none}
  .hero[data-frame-hero]{min-height:100svh}
  .hero__stage{position:relative}
  .hero__canvas{display:none}
}

/* --------------------------------------------------------------- marquee */
.marquee{overflow:hidden;white-space:nowrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1rem 0}
.marquee__track{display:inline-flex;gap:3rem;animation:marquee 28s linear infinite;text-transform:uppercase;font-size:.9375rem;letter-spacing:.06em}
.marquee__track span{color:var(--brown)}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ------------------------------------------------------------- responsive */
@media (max-width:1100px){
  .nav,.header .lang{display:none}
  .menu-overlay .lang--mobile{display:flex;position:absolute;top:2rem;left:var(--pad);font-size:.875rem;color:var(--cream)}
  .menu-overlay .lang__option:hover,.menu-overlay .lang__option.is-active{color:#fff}
  .burger{display:flex}
  .wake__grid,.events__grid,.intro-block,.room-block,.footer__body{grid-template-columns:1fr}
  .rooms-editorial{grid-template-columns:1fr}
  .rooms-editorial__intro{min-height:auto}
  .rooms-editorial__intro p:first-of-type{margin-top:1rem}
  .rooms-editorial__rail{overflow-x:auto;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(17rem,38vw);scroll-snap-type:x mandatory}
  .room-tile{scroll-snap-align:start}
  .exp__body{grid-template-columns:1.2fr .8fr;gap:2.5rem}
  .exp__head{grid-template-columns:1fr;gap:1.5rem}
  .exp__lines{align-items:flex-start;text-align:left}
  .exp__lines .is-right{align-self:flex-start;text-align:left}
  .room-block:nth-child(even) .room-block__media{order:0}
  .footer__body{gap:2rem}
  .modal__panel{grid-template-columns:1fr}
  .modal__aside{min-height:14rem}
  .table-form{grid-template-columns:1fr 1fr}
  .menu-cols{grid-template-columns:1fr}
}
@media (max-width:760px){
  :root{--header-h:96px}
  .hero[data-frame-hero]{min-height:145svh}
  .hero__stage{padding-bottom:8rem}
  .section{padding-top:5rem;padding-bottom:5rem}
  .insta-grid{grid-template-columns:repeat(3,1fr)}
  .footer__grid{grid-template-columns:repeat(3,1fr)}
  .rooms-editorial__rail{grid-auto-columns:82vw;margin-right:calc(var(--pad) * -1)}
  .exp__body{grid-template-columns:1fr;margin-top:3.5rem}
  .exp__main{margin-top:0;aspect-ratio:4/3}
  .exp__secondary{width:76%;aspect-ratio:3/4;margin-left:auto}
  .exp__copy{margin-top:2.5rem}
  .practical-banner{display:grid;min-height:46rem}
  .practical-banner__media,.practical-banner__card{grid-area:1/1}
  .practical-banner__media{position:relative;inset:auto;min-height:46rem}
  .practical-banner__card{position:relative;inset:auto;transform:none;width:auto;align-self:end;margin:1rem;padding:2rem}
  .places-rail{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:82vw;margin-right:calc(var(--pad) * -1)}
  .article-row{grid-template-columns:1fr;gap:.5rem}
  .table-form{grid-template-columns:1fr}
  .hero__float{width:78px}
  .hero__float.is-1{left:-1rem}
  .hero__float.is-2{right:-1rem}
  .hero__float.is-3{left:-1.5rem}
  .hero__float.is-4{right:-1.5rem}
  .modal{padding:.75rem}
  .modal__form{padding:2rem 1.5rem}
}