/* =========================================
   WELCOME
========================================= */

.welcome{
  min-height:700px;
  padding:100px 0 100px;
  position:relative;
  overflow:hidden;
  background:var(--cream);

  display:grid;
  grid-template-columns:1fr minmax(520px,720px) 1fr;
  align-items:center;
  gap:64px;
}

.welcome-copy{
  position:relative;
  z-index:2;
  width:100%;
  margin:0 auto;
  text-align:center;
}

.welcome h1{
  margin:0 0 30px;

  font-size:30px;
  line-height:1.08;
  font-weight:400;

  text-transform:none;
}

.welcome p{
  max-width:720px;
  margin:0 auto 18px;
  color:#111;
  font-size:15px;
  line-height:1.78;
  letter-spacing:.0px;
}

/* LINK */

.text-link,
.discover{
  position:relative;
  display:inline-flex;

  margin-top:22px;
  padding-bottom:5px;
  color:#4e4e4e;
  font-size:14px;
  font-weight:500;
  letter-spacing:.1px;
  text-transform:uppercase;
}

.text-link::after,
.discover::after{
  content:"";

  position:absolute;
  left:0;
  bottom:0;

  width:100%;
  height:1px;

  background:var(--red);

  transition:transform .38s ease;
}

.text-link:hover::after,
.discover:hover::after{
  transform:scaleX(1.18);
}

/* =========================================
   WELCOME IMAGES
========================================= */

.welcome-art{
  position:relative;
  z-index:1;
  pointer-events:none;
}

.welcome-art img{
  display:block;

  width:100%;
  height:100%;

  object-fit:cover;

  filter:none;
  opacity:1;

  transition:transform .65s cubic-bezier(.22,.72,.22,1);
}

.welcome-art img:hover{
  transform:scale(1.015);
}

/* LEFT IMAGE */

.welcome-art-left{
  justify-self:end;
  align-self:end;

  width:200px;
  height:250px;

  margin-bottom:-10px;
}

/* RIGHT IMAGE */

.welcome-art-right{
  justify-self:start;
  align-self:start;

  width:200px;
  height:250px;

  margin-top:8px;
}

/* =========================================
   VIDEO SECTION
========================================= */

.video-section{
  position:relative;
  min-height:500px;

  display:flex;
  align-items:center;

  color:#fff;
  overflow:hidden;
}

.video-section video{
  position:absolute;
  inset:0;

  width:100%;
  height:100%;

  object-fit:cover;

  z-index:0;
}

.video-section::before{
  content:"";

  position:absolute;
  inset:0;

  z-index:1;

  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.68),
      rgba(0,0,0,.38) 52%,
      rgba(0,0,0,.56)
    ),
    rgba(97,54,15,.30);
}

.split{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:1.03fr .97fr;

  gap:110px;
  align-items:center;

  padding:72px 0;
}

.eyebrow{
  display:block;
  margin-bottom:15px;

  font-size:10px;
  font-weight:800;

  letter-spacing:.28em;
  text-transform:uppercase;
}

.split h2{
  font-size:30px;
  line-height:1.38;

  text-transform:none;
}

.split p{
  font-size:14px;
  line-height:1.95;

  color:rgba(255,255,255,.9);
}

/* =========================================
   BRAND
========================================= */

.brand{
  padding:105px 0 88px;
  background:var(--cream);
}

.section-head{
  width:min(690px,86%);
  margin:0 auto 76px;

  text-align:center;
}

.section-head h2{
  font-size:30px;
  text-transform:none;

  margin-bottom:22px;
}

.section-head p{
  font-size:14px;
  line-height:1.9;

  letter-spacing:.012em;
}

/* =========================================
   TABS
========================================= */

.tabs{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:0;
  margin-bottom:28px;

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

.tab{
  position:relative;

  appearance:none;
  border:0;
  background:transparent;

  padding:0 0 12px;

  color:#050505;

  font-size:12px;
  line-height:1;
  font-weight:600;

  letter-spacing:.16em;
  text-transform:uppercase;

  transition:color .25s ease;
}

.tab::before{
  content:"";

  position:absolute;
  left:0;
  right:100%;
  bottom:-1px;

  height:1px;

  background:var(--red);

  transition:right .35s ease;
}

.tab.active,
.tab:hover{
  color:var(--red);
}

.tab.active::before,
.tab:hover::before{
  right:0;
}

/* =========================================
   HOTEL GRID
========================================= */

.hotel-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:32px 24px;
}

.hotel-card{
  opacity:1;
  transform:translateY(0);

  transition:
    opacity .35s ease,
    filter .35s ease,
    transform .35s ease;
}

.hotel-card.dim{
  opacity:.24;
  filter:grayscale(1);
}

.hotel-card:hover{
  opacity:1;
  filter:none;

  transform:translateY(-4px);
}

.hotel-img{
  height:168px;

  object-fit:cover;

  margin-bottom:12px;

  background:#d6d0c2;
}

.hotel-card h3{
  font-size:20px;
  margin-bottom:8px;
}

.hotel-card p{
  margin:0 0 14px;
  font-size:14px;
}

.discover{
  margin-top:0;
}

/* =========================================
   TABLET
========================================= */

@media(max-width:980px){

  .welcome{
    min-height:auto;
    padding:92px 36px 82px;

    display:grid;
    grid-template-columns:110px 1fr 110px;
    gap:22px;

    align-items:center;
  }

  .welcome h1{
    font-size:34px;
  }

  .welcome p{
    font-size:14px;
    line-height:1.9;
  }

  .welcome-art-left{
    width:110px;
    height:150px;

    margin-bottom:0;
  }

  .welcome-art-right{
    width:110px;
    height:150px;

    margin-top:0;
  }

  .split{
    grid-template-columns:1fr;

    gap:30px;
    padding:64px 0;

    text-align:center;
    justify-items:center;
  }

  .split h2{
    font-size:28px;
  }

  .split h2,
  .split p{
    max-width:680px;
    margin-inline:auto;
  }

  .hotel-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .tabs{
    display:none;
  }

  .hotel-card,
  .hotel-card.dim{
    opacity:1;
    filter:none;
  }

  .section-head,
  .welcome-copy{
    text-align:center;
  }
}

/* =========================================
   MOBILE
========================================= */

@media(max-width:560px){

  .welcome{
    padding:82px 28px 76px;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px 16px;

    align-items:start;
  }

  .welcome-copy{
    grid-column:1 / -1;
    order:1;

    text-align:center;
  }

  .welcome-art-left{
    grid-column:1;
    order:2;

    justify-self:start;

    width:112px;
    height:145px;

    margin:6px 0 0;
  }

  .welcome-art-right{
    grid-column:2;
    order:3;

    justify-self:end;

    width:112px;
    height:145px;

    margin:6px 0 0;
  }

  .welcome h1{
    margin-bottom:26px;

    font-size:30px;
    line-height:1.06;
  }

  .welcome p{
    max-width:100%;

    font-size:14px;
    line-height:1.9;

    text-align:center;
  }

  .text-link{
    justify-content:center;
  }

  .section-head h2{
    font-size:26px;
  }

  .brand{
    padding:74px 0 65px;
  }

  .section-head{
    margin-bottom:48px;
  }

  .hotel-grid{
    grid-template-columns:1fr;
  }

  .hotel-img{
    height:210px;
  }
}/* =========================================
   WELCOME
========================================= */

.welcome{
  min-height:700px;
  padding:100px 0 100px;
  position:relative;
  overflow:hidden;
  background:var(--cream);

  display:grid;
  grid-template-columns:1fr minmax(520px,720px) 1fr;
  align-items:center;
  gap:64px;
}

.welcome-copy{
  position:relative;
  z-index:2;
  width:100%;
  margin:0 auto;
  text-align:center;
}

.welcome h1{
  margin:0 0 30px;

  font-size:30px;
  line-height:1.08;
  font-weight:400;

  text-transform:none;
}

.welcome p{
  max-width:720px;
  margin:0 auto 18px;

  color:#4e4e4e;

  font-size:14px;
  line-height:1.78;
  letter-spacing:.01em;
}

/* LINK */

.text-link,
.discover{
  position:relative;
  display:inline-flex;
  margin-top:22px;
  padding-bottom:5px;
  color:#4e4e4e;
  font-size:14px;
  font-weight:600;
  letter-spacing:.1px;
  text-transform:capitalize;
}

.text-link::after,
.discover::after{
  content:"";

  position:absolute;
  left:0;
  bottom:0;

  width:100%;
  height:1px;

  background:var(--red);

  transition:transform .38s ease;
}

.text-link:hover::after,
.discover:hover::after{
  transform:scaleX(1.18);
}

/* =========================================
   WELCOME IMAGES
========================================= */

.welcome-art{
  position:relative;
  z-index:1;
  pointer-events:none;
}

.welcome-art img{
  display:block;

  width:100%;
  height:100%;

  object-fit:cover;

  filter:none;
  opacity:1;

  transition:transform .65s cubic-bezier(.22,.72,.22,1);
}

.welcome-art img:hover{
  transform:scale(1.015);
}

/* LEFT IMAGE */

.welcome-art-left{
  justify-self:end;
  align-self:end;

  width:200px;
  height:250px;

  margin-bottom:-10px;
}

/* RIGHT IMAGE */

.welcome-art-right{
  justify-self:start;
  align-self:start;

  width:200px;
  height:250px;

  margin-top:8px;
}

/* =========================================
   VIDEO SECTION
========================================= */

.video-section{
  position:relative;
  min-height:500px;

  display:flex;
  align-items:center;

  color:#fff;
  overflow:hidden;
}

.video-section video{
  position:absolute;
  inset:0;

  width:100%;
  height:100%;

  object-fit:cover;

  z-index:0;
}

.video-section::before{
  content:"";

  position:absolute;
  inset:0;

  z-index:1;

  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.68),
      rgba(0,0,0,.38) 52%,
      rgba(0,0,0,.56)
    ),
    rgba(97,54,15,.30);
}

.split{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:1.03fr .97fr;

  gap:110px;
  align-items:center;

  padding:72px 0;
}

.eyebrow{
  display:block;
  margin-bottom:15px;

  font-size:10px;
  font-weight:800;

  letter-spacing:.28em;
  text-transform:uppercase;
}

.split h2{
  font-size:30px;
  line-height:1.38;

  text-transform:none;
}

.split p{
  font-size:14px;
  line-height:1.95;

  color:rgba(255,255,255,.9);
}

/* =========================================
   BRAND
========================================= */

.brand{
  padding:105px 0 88px;
  background:var(--cream);
}

.section-head{
  width:min(690px,86%);
  margin:0 auto 76px;

  text-align:center;
}

.section-head h2{
  font-size:30px;
  text-transform:none;

  margin-bottom:22px;
}

.section-head p{
  font-size:14px;
  line-height:1.9;
  color:#4e4e4e;
  letter-spacing:.012em;
}

/* =========================================
   TABS
========================================= */

.tabs{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:0;
  margin-bottom:28px;

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

.tab{
  position:relative;

  appearance:none;
  border:0;
  background:transparent;

  padding:0 0 12px;

  color:#050505;

  font-size:12px;
  line-height:1;
  font-weight:600;

  letter-spacing:.16em;
  text-transform:uppercase;

  transition:color .25s ease;
}

.tab::before{
  content:"";

  position:absolute;
  left:0;
  right:100%;
  bottom:-1px;

  height:1px;

  background:var(--red);

  transition:right .35s ease;
}

.tab.active,
.tab:hover{
  color:var(--red);
}

.tab.active::before,
.tab:hover::before{
  right:0;
}

/* =========================================
   HOTEL GRID
========================================= */

.hotel-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:32px 24px;
}

.hotel-card{
  opacity:1;
  transform:translateY(0);

  transition:
    opacity .35s ease,
    filter .35s ease,
    transform .35s ease;
}

.hotel-card.dim{
  opacity:.24;
  filter:grayscale(1);
}

.hotel-card:hover{
  opacity:1;
  filter:none;

  transform:translateY(-4px);
}

.hotel-img{
  height:168px;

  object-fit:cover;

  margin-bottom:12px;

  background:#d6d0c2;
}

.hotel-card h3{
  font-size:20px;
  margin-bottom:8px;
}

.hotel-card p{
  margin:0 0 14px;
  font-size:14px;
}

.discover{
  margin-top:0;
}

/* =========================================
   TABLET
========================================= */

@media(max-width:980px){

  .welcome{
    min-height:auto;
    padding:92px 36px 82px;

    display:grid;
    grid-template-columns:110px 1fr 110px;
    gap:22px;

    align-items:center;
  }

  .welcome h1{
    font-size:34px;
  }

  .welcome p{
    font-size:14px;
    line-height:1.9;
  }

  .welcome-art-left{
    width:110px;
    height:150px;

    margin-bottom:0;
  }

  .welcome-art-right{
    width:110px;
    height:150px;

    margin-top:0;
  }

  .split{
    grid-template-columns:1fr;

    gap:30px;
    padding:64px 0;

    text-align:center;
    justify-items:center;
  }

  .split h2{
    font-size:28px;
  }

  .split h2,
  .split p{
    max-width:680px;
    margin-inline:auto;
  }

  .hotel-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .tabs{
    display:none;
  }

  .hotel-card,
  .hotel-card.dim{
    opacity:1;
    filter:none;
  }

  .section-head,
  .welcome-copy{
    text-align:center;
  }
}

/* =========================================
   MOBILE
========================================= */

@media(max-width:560px){

  .welcome{
    padding:82px 28px 76px;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px 16px;

    align-items:start;
  }

  .welcome-copy{
    grid-column:1 / -1;
    order:1;

    text-align:center;
  }

  .welcome-art-left{
    grid-column:1;
    order:2;

    justify-self:start;

    width:112px;
    height:145px;

    margin:6px 0 0;
  }

  .welcome-art-right{
    grid-column:2;
    order:3;

    justify-self:end;

    width:112px;
    height:145px;

    margin:6px 0 0;
  }

  .welcome h1{
    margin-bottom:26px;

    font-size:30px;
    line-height:1.06;
  }

  .welcome p{
    max-width:100%;

    font-size:14px;
    line-height:1.9;

    text-align:center;
  }

  .text-link{
    justify-content:center;
  }

  .section-head h2{
    font-size:26px;
  }

  .brand{
    padding:74px 0 65px;
  }

  .section-head{
    margin-bottom:48px;
  }

  .hotel-grid{
    grid-template-columns:1fr;
  }

  .hotel-img{
    height:210px;
  }
}



/* =========================================
   EXCLUSIVE OFFERS
   Layout refined to match reference image
========================================= */

.exclusive-offers-section{
  position:relative !important;
  overflow:hidden !important;
  padding:76px 0 150px !important;
  background:var(--cream) !important;
  color:#111 !important;
}

.exclusive-offers-section *{
  box-sizing:border-box !important;
}

.exclusive-offers-inner{
  width:min(1250px,74vw) !important;
  margin:0 auto !important;
}

.exclusive-offers-head{
  display:grid !important;
  grid-template-columns:minmax(260px,1fr) minmax(420px,520px) !important;
  align-items:start !important;
  gap:90px !important;
  margin:0 0 46px !important;
}

.exclusive-offers-head h2{
  margin:0 !important;
  font-size:30px !important;
  line-height:1.08 !important;
  font-weight:400 !important;
  letter-spacing:.005em !important;
  text-transform:none !important;
}

.exclusive-offers-head p{
  margin:0 !important;
  max-width:520px !important;
  color:#111 !important;
  font-size:14px !important;
  line-height:1.32 !important;
  letter-spacing:.018em !important;
}

.exclusive-offers-control{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:18px !important;
  margin:42px 0 0 !important;
}

.exclusive-offers-line-main{
  display:block !important;
  width:100% !important;
  height:1px !important;
  min-height:1px !important;
  background:var(--red) !important;
}

.exclusive-offers-arrows{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:18px !important;
  white-space:nowrap !important;
}

.exclusive-offers-arrows button{
  position:relative !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  width:31px !important;
  min-width:31px !important;
  height:18px !important;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  color:transparent !important;
  font-size:0 !important;
  line-height:0 !important;
  cursor:pointer !important;
  transition:opacity .28s ease, transform .28s ease !important;
}

.exclusive-offers-arrows button::before{
  content:"" !important;
  position:absolute !important;
  left:2px !important;
  right:2px !important;
  top:50% !important;
  height:1px !important;
  background:var(--red) !important;
  transform:translateY(-50%) !important;
}

.exclusive-offers-arrows button::after{
  content:"" !important;
  position:absolute !important;
  top:50% !important;
  width:7px !important;
  height:7px !important;
  border-top:1px solid var(--red) !important;
  border-right:1px solid var(--red) !important;
}

.exclusive-offers-prev::after{
  left:2px !important;
  transform:translateY(-50%) rotate(-135deg) !important;
}

.exclusive-offers-next::after{
  right:2px !important;
  transform:translateY(-50%) rotate(45deg) !important;
}

.exclusive-offers-arrows button:hover{
  opacity:.72 !important;
  transform:translateX(1px) !important;
}

.exclusive-offers-arrows button:disabled,
.exclusive-offers-arrows button.is-disabled{
  opacity:.28 !important;
  cursor:default !important;
  pointer-events:none !important;
  transform:none !important;
}

.exclusive-offers-arrows button:disabled::before,
.exclusive-offers-arrows button:disabled::after,
.exclusive-offers-arrows button.is-disabled::before,
.exclusive-offers-arrows button.is-disabled::after{
  opacity:.72 !important;
}

.exclusive-offers-view,
.exclusive-offer-link{
  position:relative !important;
  display:inline-flex !important;
  width:auto !important;
  padding:0 0 6px !important;
  color:#111 !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:600 !important;
  letter-spacing:.095em !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

.exclusive-offers-view{
  font-size:14px !important;
  letter-spacing:1px !important;
  padding-bottom:0 !important;
}

.exclusive-offers-view{
  transition:color .32s ease, opacity .32s ease, transform .32s ease !important;
}

.exclusive-offers-view:hover{
  color:rgba(139,3,4,.72) !important;
  opacity:.86 !important;
  transform:translateY(-1px) !important;
}

.exclusive-offers-view:focus-visible{
  outline:1px solid rgba(139,3,4,.45) !important;
  outline-offset:5px !important;
}

.exclusive-offer-link::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  bottom:0 !important;
  width:100% !important;
  height:1px !important;
  background:var(--red) !important;
  transition:transform .38s ease !important;
}

.exclusive-offer-link:hover::after{
  transform:scaleX(1.18) !important;
}

.exclusive-offers-viewport{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  position:relative !important;
  touch-action:pan-y !important;
  cursor:grab !important;
}

.exclusive-offers-track{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:stretch !important;
  gap:23px !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  transform:translate3d(0,0,0);
  transition:transform .72s cubic-bezier(.22,.72,.22,1) !important;
  will-change:transform !important;
}

.exclusive-offer-card{
  flex:0 0 calc((100% - 69px) / 4) !important;
  width:calc((100% - 69px) / 4) !important;
  min-width:0 !important;
  max-width:none !important;
  display:flex !important;
  flex-direction:column !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  float:none !important;
  clear:none !important;
  overflow:visible !important;
  transition:transform .45s ease !important;
}

.exclusive-offer-card:hover{
  transform:translateY(-4px) !important;
}

.exclusive-offer-image{
  display:block !important;
  width:100% !important;
  height:190px !important;
  min-height:190px !important;
  max-height:190px !important;
  margin:0 0 15px !important;
  overflow:hidden !important;
  background:#d6d0c2 !important;
  text-decoration:none !important;
}

.exclusive-offer-image img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:100% !important;
  min-height:100% !important;
  object-fit:cover !important;
  margin:0 !important;
  border:0 !important;
  transition:transform .65s cubic-bezier(.22,.72,.22,1) !important;
}

.exclusive-offer-card:hover .exclusive-offer-image img{
  transform:scale(1.035) !important;
}

.exclusive-offer-card h3{
  min-height:42px !important;
  margin:0 0 14px !important;
  color:#111 !important;
  font-size:20px !important;
  line-height:.96 !important;
  font-weight:400 !important;
  letter-spacing:-.01em !important;
  text-transform:none !important;
}

.exclusive-offer-card strong{
  display:block !important;
  min-height:18px !important;
  margin:0 0 16px !important;
  color:#111 !important;
  font-size:12px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
}

.exclusive-offer-card p{
  margin:0 0 20px !important;
  color:#111 !important;
  font-size:14px !important;
  line-height:1.55 !important;
  letter-spacing:.01em !important;
  flex:1 1 auto !important;
}

.exclusive-offer-card .exclusive-offer-link{
  align-self:flex-start !important;
  margin-top:auto !important;
}


@media(max-width:1320px){
  .exclusive-offers-inner{
    width:min(1120px,82vw) !important;
  }

  .exclusive-offer-image{
    height:180px !important;
    min-height:180px !important;
    max-height:180px !important;
  }
}

@media(max-width:980px){
  .exclusive-offers-section{
    padding:78px 0 86px !important;
  }

  .exclusive-offers-inner{
    width:min(760px,88vw) !important;
  }

  .exclusive-offers-head{
    grid-template-columns:1fr !important;
    gap:22px !important;
    margin-bottom:38px !important;
    text-align:center !important;
    justify-items:center !important;
  }

  .exclusive-offers-head p{
    max-width:680px !important;
    line-height:1.72 !important;
  }

  .exclusive-offers-control{
    margin:36px 0 0 !important;
  }

  .exclusive-offer-card{
    flex-basis:calc((100% - 23px) / 2) !important;
    width:calc((100% - 23px) / 2) !important;
  }

  .exclusive-offer-image{
    height:230px !important;
    min-height:230px !important;
    max-height:230px !important;
  }

  .exclusive-offer-card h3{
    min-height:auto !important;
    line-height:1.06 !important;
  }
}

@media(max-width:560px){
  .exclusive-offers-section{
    padding:68px 0 68px !important;
  }

  .exclusive-offers-inner{
    width:100% !important;
    padding:0 22px !important;
  }

  .exclusive-offers-head{
    margin-bottom:34px !important;
  }

  .exclusive-offers-head h2{
    font-size:28px !important;
  }

  .exclusive-offers-head p{
    font-size:14px !important;
  }

  .exclusive-offers-control{
    grid-template-columns:1fr !important;
    gap:18px !important;
    margin:34px 0 0 !important;
    justify-items:center !important;
  }

  .exclusive-offers-line-main{
    order:1 !important;
    width:100% !important;
  }

  .exclusive-offers-arrows{
    order:2 !important;
    justify-content:center !important;
  }

  .exclusive-offers-view{
    order:3 !important;
    font-size:13px !important;
  }

  .exclusive-offer-card{
    flex-basis:100% !important;
    width:100% !important;
  }

  .exclusive-offer-image{
    height:245px !important;
    min-height:245px !important;
    max-height:245px !important;
  }

  .exclusive-offer-card h3{
    margin-bottom:14px !important;
    font-size:21px !important;
  }
}

/* =========================================
   GLOBAL CONTENT WIDTH LOCK
   Keep all section content aligned perfectly
   Added only to standardize inner widths.
========================================= */

:root{
  --lhag-section-width: min(1250px, 74vw);
}

.video-section > .container.split,
.brand > .wide-container,
.exclusive-offers-inner{
  width:var(--lhag-section-width) !important;
  max-width:var(--lhag-section-width) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

.welcome{
  padding-left:calc((100vw - var(--lhag-section-width)) / 2) !important;
  padding-right:calc((100vw - var(--lhag-section-width)) / 2) !important;
  grid-template-columns:200px minmax(0,1fr) 200px !important;
  gap:64px !important;
}

.welcome-copy{
  max-width:720px !important;
}

.welcome p{
  max-width:720px !important;
}

@media(max-width:1320px){
  :root{
    --lhag-section-width: min(1120px, 82vw);
  }
}

@media(max-width:980px){
  :root{
    --lhag-section-width: min(760px, 88vw);
  }

  .video-section > .container.split,
  .brand > .wide-container,
  .exclusive-offers-inner{
    width:var(--lhag-section-width) !important;
    max-width:var(--lhag-section-width) !important;
  }

  .welcome{
    width:var(--lhag-section-width) !important;
    max-width:var(--lhag-section-width) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    grid-template-columns:110px minmax(0,1fr) 110px !important;
    gap:22px !important;
  }
}

@media(max-width:560px){
  :root{
    --lhag-section-width:100%;
  }

  .video-section > .container.split,
  .brand > .wide-container,
  .exclusive-offers-inner,
  .welcome{
    width:100% !important;
    max-width:100% !important;
    padding-left:22px !important;
    padding-right:22px !important;
  }

  .welcome{
    grid-template-columns:1fr 1fr !important;
    gap:24px 16px !important;
  }
}

/* =========================================
   LUXURY TYPOGRAPHY STANDARD
   Refined only: line-height, letter-spacing, reading color.
   Layout, carousel, spacing blocks and HTML remain untouched.
========================================= */

:root{
  --lhag-reading-color:#4e4e4e;
  --lhag-heading-tracking:.002em;
  --lhag-body-tracking:.004em;
  --lhag-link-tracking:.035em;
  --lhag-body-leading:1.76;
  --lhag-compact-leading:1.48;
}

/* Main body copy */
.welcome p,
.section-head p,
.hotel-card p,
.exclusive-offers-head p,
.exclusive-offer-card p{
  color:var(--lhag-reading-color) !important;
  line-height:var(--lhag-body-leading) !important;
  letter-spacing:var(--lhag-body-tracking) !important;
  font-weight:400 !important;
}

/* Keep video-section copy readable on dark video overlay */
.video-section .split p{
  color:rgba(255,255,255,.9) !important;
  line-height:1.86 !important;
  letter-spacing:.006em !important;
}

/* Luxury title rhythm */
.welcome h1,
.section-head h2,
.split h2,
.exclusive-offers-head h2{
  line-height:1.12 !important;
  letter-spacing:var(--lhag-heading-tracking) !important;
}

.hotel-card h3,
.exclusive-offer-card h3{
  line-height:1.14 !important;
  letter-spacing:0 !important;
}

/* Supporting labels / prices */
.eyebrow{
  line-height:1.2 !important;
  letter-spacing:.24em !important;
}

.exclusive-offer-card strong{
  color:var(--lhag-reading-color) !important;
  line-height:1.45 !important;
  letter-spacing:.032em !important;
  font-weight:700 !important;
}

/* Tabs: premium spacing, less aggressive than full corporate uppercase */
.tab{
  line-height:1.18 !important;
  letter-spacing:.115em !important;
}

/* Links: title case, refined tracking */
.text-link,
.discover,
.exclusive-offers-view,
.exclusive-offer-link{
  color:var(--lhag-reading-color) !important;
  line-height:1.22 !important;
  letter-spacing:var(--lhag-link-tracking) !important;
  text-transform:none !important;
}

.exclusive-offers-view{
  letter-spacing:.03em !important;
}

/* Mobile readability */
@media(max-width:560px){
  .welcome p,
  .section-head p,
  .hotel-card p,
  .exclusive-offers-head p,
  .exclusive-offer-card p{
    line-height:1.72 !important;
    letter-spacing:.003em !important;
  }

  .welcome h1,
  .section-head h2,
  .split h2,
  .exclusive-offers-head h2{
    line-height:1.13 !important;
  }
}

/* =========================================
   LUXURY COLOR STANDARD
   Updated only typography colors.
   No layout, carousel, spacing or HTML changes.
========================================= */

:root{
  --lhag-title-color:#2b2723;
  --lhag-card-title-color:#2f2a26;
  --lhag-reading-color:#4e4e4e;
  --lhag-muted-color:#68625c;
}

/* Main section titles - softer charcoal, less heavy than pure black */
.welcome h1,
.section-head h2,
.split h2,
.exclusive-offers-head h2{
  color:var(--lhag-title-color) !important;
}

/* Titles on dark video sections stay white for contrast */
.video-section .split h2{
  color:#fff8ee !important;
}

/* Card titles */
.hotel-card h3,
.exclusive-offer-card h3{
  color:var(--lhag-card-title-color) !important;
}

/* Main reading text */
.welcome p,
.section-head p,
.hotel-card p,
.exclusive-offers-head p,
.exclusive-offer-card p{
  color:var(--lhag-reading-color) !important;
}

/* Supporting offer price / detail text */
.exclusive-offer-card strong{
  color:var(--lhag-muted-color) !important;
}

/* Links */
.text-link,
.discover,
.exclusive-offers-view,
.exclusive-offer-link{
  color:var(--lhag-reading-color) !important;
}

.text-link:hover,
.discover:hover,
.exclusive-offers-view:hover,
.exclusive-offer-link:hover{
  color:var(--red) !important;
}

/* Tabs */
.tab{
  color:var(--lhag-card-title-color) !important;
}

.tab.active,
.tab:hover{
  color:var(--red) !important;
}


/* =========================================
   WELCOME SCROLL MOTION + MOBILE STAGGER
   Final scoped overrides only for Welcome section.
========================================= */

.welcome .welcome-art{
  --welcome-scroll-y:0px;
  transform:translate3d(0,var(--welcome-scroll-y),0);
  transition:transform .18s linear;
  will-change:transform;
}

.welcome .welcome-art img{
  transform:scale(1);
}

.welcome .welcome-art:hover img{
  transform:scale(1.015);
}

/* Desktop: opposite gentle rhythm */
.welcome-art-left{
  margin-bottom:-26px !important;
}

.welcome-art-right{
  margin-top:-18px !important;
}

@media(max-width:560px){
  .welcome{
    padding-top:72px !important;
    grid-template-columns:1fr 1fr !important;
    align-items:start !important;
  }

  /* Images stay above the Welcome text on mobile */
  .welcome-art-left{
    grid-column:1 !important;
    grid-row:1 !important;
    order:1 !important;
    justify-self:start !important;
    width:42vw !important;
    max-width:158px !important;
    height:205px !important;
    margin:0 !important;
  }

  .welcome-art-right{
    grid-column:2 !important;
    grid-row:1 !important;
    order:2 !important;
    justify-self:end !important;
    width:42vw !important;
    max-width:158px !important;
    height:205px !important;
    margin:38px 0 0 !important;
  }

  .welcome-copy{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    order:3 !important;
    margin-top:24px !important;
  }
}

@media(max-width:380px){
  .welcome-art-left,
  .welcome-art-right{
    height:178px !important;
  }

  .welcome-art-right{
    margin-top:30px !important;
  }
}


/* =========================================
   WELCOME IMAGE OVERLAP + STRONGER SCROLL MOTION
   Scoped override: lantern image overlaps hand image,
   and both move more visibly while scrolling.
========================================= */

.welcome .welcome-art{
  transition:transform .08s linear !important;
  will-change:transform !important;
}

.welcome .welcome-art-left{
  z-index:1 !important;
}

.welcome .welcome-art-right{
  z-index:3 !important;
}

/* Desktop / tablet: keep the elegant side layout, but make motion clearer */
@media(min-width:561px){
  .welcome .welcome-art-left{
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.15),0) !important;
  }

  .welcome .welcome-art-right{
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.35),0) !important;
  }
}

/* Mobile: both images sit above Welcome, staggered and overlapping */
@media(max-width:560px){
  .welcome{
    grid-template-columns:1fr !important;
    gap:0 !important;
    padding-top:64px !important;
  }

  .welcome-art-left,
  .welcome-art-right{
    grid-column:1 !important;
    grid-row:1 !important;
    order:1 !important;
    pointer-events:none !important;
  }

  .welcome-art-left{
    justify-self:start !important;
    width:58vw !important;
    max-width:210px !important;
    height:255px !important;
    margin:0 0 0 2vw !important;
    z-index:1 !important;
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.2),0) !important;
  }

  .welcome-art-right{
    justify-self:end !important;
    width:56vw !important;
    max-width:205px !important;
    height:245px !important;
    margin:58px 2vw 0 0 !important;
    z-index:4 !important;
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.55),0) !important;
  }

  .welcome-copy{
    grid-column:1 !important;
    grid-row:2 !important;
    order:2 !important;
    margin-top:56px !important;
    position:relative !important;
    z-index:5 !important;
  }
}

@media(max-width:380px){
  .welcome-art-left{
    width:60vw !important;
    max-width:188px !important;
    height:228px !important;
    margin-left:0 !important;
  }

  .welcome-art-right{
    width:58vw !important;
    max-width:184px !important;
    height:220px !important;
    margin-top:50px !important;
    margin-right:0 !important;
  }

  .welcome-copy{
    margin-top:46px !important;
  }
}

/* =========================================
   WELCOME MOBILE IMAGE BALANCE — V4
   Reduce overlap on mobile while keeping the lantern image
   subtly layered over the hand image and clearly moving on scroll.
========================================= */

@media(max-width:560px){
  .welcome{
    padding-top:66px !important;
  }

  .welcome-art-left{
    width:52vw !important;
    max-width:198px !important;
    height:238px !important;
    margin:0 0 0 1vw !important;
    z-index:1 !important;
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.15),0) !important;
  }

  .welcome-art-right{
    width:50vw !important;
    max-width:194px !important;
    height:226px !important;
    margin:42px 1vw 0 0 !important;
    z-index:4 !important;
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.45),0) !important;
  }

  .welcome-copy{
    margin-top:42px !important;
  }
}

@media(max-width:430px){
  .welcome{
    padding-top:62px !important;
  }

  .welcome-art-left{
    width:51vw !important;
    max-width:176px !important;
    height:216px !important;
    margin-left:0 !important;
  }

  .welcome-art-right{
    width:49vw !important;
    max-width:172px !important;
    height:204px !important;
    margin-top:38px !important;
    margin-right:0 !important;
  }

  .welcome-copy{
    margin-top:36px !important;
  }
}

@media(max-width:380px){
  .welcome-art-left{
    width:50vw !important;
    max-width:158px !important;
    height:198px !important;
  }

  .welcome-art-right{
    width:48vw !important;
    max-width:154px !important;
    height:188px !important;
    margin-top:34px !important;
  }

  .welcome-copy{
    margin-top:32px !important;
  }
}

/* =========================================
   WELCOME MOBILE IMAGE BALANCE — V5
   Equal image size, 1/3 horizontal overlap and subtle stagger.
   Keeps clear scroll movement without excessive covering.
========================================= */

@media(max-width:560px){
  .welcome{
    padding-top:64px !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
  }

  .welcome-art-left,
  .welcome-art-right{
    grid-column:1 !important;
    grid-row:1 !important;
    order:1 !important;
    width:60% !important;
    max-width:250px !important;
    height:auto !important;
    aspect-ratio:1 / 1.16 !important;
    pointer-events:none !important;
  }

  .welcome-art-left{
    justify-self:start !important;
    margin:0 !important;
    z-index:1 !important;
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.15),0) !important;
  }

  .welcome-art-right{
    justify-self:end !important;
    margin:19% 0 0 0 !important;
    z-index:3 !important;
    transform:translate3d(0,calc(var(--welcome-scroll-y) * 1.45),0) !important;
  }

  .welcome-copy{
    grid-column:1 !important;
    grid-row:2 !important;
    order:2 !important;
    margin-top:17% !important;
    position:relative !important;
    z-index:5 !important;
  }
}

@media(max-width:430px){
  .welcome-art-left,
  .welcome-art-right{
    width:60% !important;
    max-width:222px !important;
    aspect-ratio:1 / 1.15 !important;
  }

  .welcome-art-right{
    margin-top:18% !important;
  }

  .welcome-copy{
    margin-top:16% !important;
  }
}

@media(max-width:380px){
  .welcome-art-left,
  .welcome-art-right{
    width:60% !important;
    max-width:205px !important;
    aspect-ratio:1 / 1.14 !important;
  }

  .welcome-art-right{
    margin-top:17% !important;
  }

  .welcome-copy{
    margin-top:15% !important;
  }
}


/* =========================================
   WELCOME MOBILE FINAL — MATCH SCREENSHOT
   Scoped only to the Welcome/content opening block.
   Keeps desktop/tablet and all later sections untouched.
========================================= */

@media(max-width:560px){
  .welcome{
    min-height:auto !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:118px 52px 86px !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    column-gap:20px !important;
    row-gap:0 !important;
    align-items:start !important;
    background:var(--cream) !important;
    overflow:hidden !important;
  }

  .welcome .welcome-art{
    grid-row:1 !important;
    order:1 !important;
    width:100% !important;
    max-width:none !important;
    height:auto !important;
    aspect-ratio:1 / 1.06 !important;
    margin:0 !important;
    pointer-events:none !important;
    will-change:transform !important;
  }

  .welcome .welcome-art-left{
    grid-column:1 !important;
    justify-self:stretch !important;
    align-self:start !important;
    z-index:1 !important;
    transform:translate3d(0,calc(30px + (var(--welcome-scroll-y) * .45)),0) !important;
  }

  .welcome .welcome-art-right{
    grid-column:2 !important;
    justify-self:stretch !important;
    align-self:start !important;
    z-index:2 !important;
    transform:translate3d(0,calc(-2px + (var(--welcome-scroll-y) * .55)),0) !important;
  }

  .welcome .welcome-art img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    transform:none !important;
  }

  .welcome-copy{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    order:2 !important;
    width:100% !important;
    max-width:100% !important;
    margin:118px auto 0 !important;
    padding:0 !important;
    text-align:center !important;
    position:relative !important;
    z-index:5 !important;
  }

  .welcome h1{
    margin:0 0 38px !important;
    color:var(--lhag-title-color, #2b2723) !important;
    font-size:38px !important;
    line-height:1.08 !important;
    font-weight:400 !important;
    letter-spacing:.01em !important;
    text-transform:none !important;
  }

  .welcome p{
    max-width:100% !important;
    margin:0 auto 18px !important;
    color:var(--lhag-reading-color, #4e4e4e) !important;
    font-size:15px !important;
    line-height:1.72 !important;
    letter-spacing:.018em !important;
    font-weight:400 !important;
    text-align:center !important;
  }

  .welcome .text-link{
    justify-content:center !important;
    margin-top:20px !important;
  }
}

@media(max-width:430px){
  .welcome{
    padding:118px 52px 82px !important;
    column-gap:20px !important;
  }

  .welcome-copy{
    margin-top:114px !important;
  }

  .welcome h1{
    font-size:38px !important;
  }
}

@media(max-width:390px){
  .welcome{
    padding-left:38px !important;
    padding-right:38px !important;
    column-gap:18px !important;
  }

  .welcome-copy{
    margin-top:100px !important;
  }

  .welcome h1{
    font-size:34px !important;
  }
}
