.skyeth-reserve-open{overflow:hidden}.skyeth-reserve{position:fixed;inset:0;z-index:100000;display:none;overflow-y:auto;color:#fff;background:#057fbd var(--skyeth-reserve-bg) center/cover fixed no-repeat;font-family:"Reddit Sans",Arial,sans-serif}.skyeth-reserve.is-open{display:block}.skyeth-reserve__shade{position:fixed;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(0,117,184,.88),rgba(24,192,205,.64))}.skyeth-reserve__frame{position:relative;width:min(88vw,156rem);min-height:calc(100vh - 8vw);margin:4vw auto;padding:clamp(4rem,6vw,8rem) clamp(3rem,5vw,7rem);border:2px solid #fff;border-radius:clamp(2rem,3vw,4.5rem)}.skyeth-reserve__close{position:absolute;z-index:5;top:2rem;right:2rem;width:3.5rem;height:3.5rem;padding:0;color:#fff;border:1.5px solid #fff;border-radius:50%;background:rgba(0,116,181,.35);font:300 2.2rem/1 Arial;cursor:pointer}.skyeth-reserve__header{text-align:center}.skyeth-reserve__logo{width:min(28rem,42vw);height:auto;margin:0 auto 2.5rem;object-fit:contain;filter:brightness(0) invert(1)}.skyeth-reserve__header h2{margin:0 0 clamp(4rem,7vw,8rem);color:#fff;font:400 clamp(5rem,9vw,12rem)/.92 Georgia,"Times New Roman",serif}.skyeth-reserve__panel[hidden]{display:none!important}.skyeth-reserve__cards{display:grid;gap:clamp(2rem,3vw,4rem)}.skyeth-reserve__service{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;width:100%;min-height:clamp(25rem,30vw,42rem);overflow:hidden;padding:clamp(2rem,4vw,6rem);text-align:left;color:#fff;border:2px solid #fff;border-radius:clamp(1.7rem,2vw,3rem);background:var(--card-image) 78% center/cover no-repeat;cursor:pointer}.skyeth-reserve__service::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#087fc4 0%,rgba(30,199,209,.92) 40%,rgba(25,190,204,.54) 61%,rgba(2,53,86,.05) 100%)}.skyeth-reserve__service-copy{display:grid;grid-template-columns:clamp(10rem,15vw,20rem) minmax(0,1fr);align-items:center;gap:1rem clamp(2rem,5vw,7rem);width:min(66%,70rem)}.skyeth-reserve__icon{grid-row:1/3;display:grid;place-items:center;width:clamp(10rem,15vw,20rem);aspect-ratio:1;border:3px solid #fff;border-radius:50%}.skyeth-reserve__icon svg{width:58%;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}.skyeth-reserve__service strong{font:400 clamp(4.5rem,8vw,10rem)/.9 Georgia,"Times New Roman",serif}.skyeth-reserve__service small{font-size:clamp(1.5rem,2.3vw,3rem);line-height:1.3}.skyeth-reserve__arrow{display:grid;place-items:center;width:clamp(7rem,10vw,13rem);aspect-ratio:1;border-radius:50%;background:linear-gradient(135deg,#0879bd,#28c6d2);font-size:clamp(4rem,7vw,8rem);font-weight:200;box-shadow:0 14px 35px rgba(0,59,101,.25)}.skyeth-reserve__panel-heading{position:relative;display:flex;align-items:flex-start;justify-content:center;margin-bottom:clamp(4rem,7vw,8rem)}.skyeth-reserve__panel-heading h3{margin:0;text-align:center;font:400 clamp(5rem,9vw,12rem)/.95 Georgia,serif}.skyeth-reserve__back{position:absolute;left:0;top:0;display:flex;align-items:center;gap:1rem;padding:1.1rem 2.5rem;color:#0781bd;border:0;border-radius:999px;background:#fff;font-size:clamp(1.2rem,2vw,2.3rem);font-weight:600;text-transform:uppercase;cursor:pointer}.skyeth-reserve__hotels{display:grid;gap:clamp(2rem,3vw,4rem)}.skyeth-reserve__hotel{position:relative;isolation:isolate;display:grid;grid-template-columns:25% 40% 35%;align-items:center;min-height:clamp(24rem,30vw,39rem);overflow:hidden;padding:clamp(2rem,4vw,5rem);color:#fff;text-decoration:none;border:2px solid #fff;border-radius:clamp(1.7rem,2vw,3rem);background:var(--hotel-image) right center/72% 100% no-repeat}.skyeth-reserve__hotel::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#087fc4 0%,rgba(31,199,209,.95) 39%,rgba(31,193,205,.53) 65%,rgba(3,48,77,.06) 100%)}.skyeth-reserve__hotel:hover{color:#fff}.skyeth-reserve__hotel-brand{display:grid;place-items:center;width:88%;height:80%}.skyeth-reserve__hotel-brand img{width:100%;height:100%;object-fit:contain;filter:grayscale(1) brightness(0) invert(1)}.skyeth-reserve__hotel-brand>strong{font:400 clamp(3rem,6vw,8rem)/1 Georgia,serif;text-transform:uppercase}.skyeth-reserve__hotel-copy{align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:.5rem}.skyeth-reserve__hotel-copy>strong{font:400 clamp(3.6rem,6vw,7rem)/1 Georgia,serif;text-transform:uppercase}.skyeth-reserve__hotel-copy em{font-size:clamp(1.8rem,3vw,3.6rem);font-style:normal;font-weight:600;text-transform:uppercase}.skyeth-reserve__hotel-copy small{margin-top:auto;padding-top:2rem;font-size:clamp(1.5rem,2.2vw,2.8rem);line-height:1.25}.skyeth-reserve__hotel>b{align-self:end;justify-self:end;display:flex;align-items:center;gap:1.5rem;padding:1.1rem 2rem;border-radius:999px;background:linear-gradient(90deg,#087bc2,#27c6d1);font-size:clamp(1.6rem,2.5vw,3.2rem);font-weight:600;text-transform:uppercase;white-space:nowrap}.skyeth-reserve__hotel>b i{font-size:1.5em;font-style:normal;font-weight:200}.skyeth-reserve__contact{min-height:35rem;display:grid;place-items:center;align-content:center;gap:3rem}.skyeth-reserve__contact .skyeth-reserve__back{position:static;justify-self:start}.skyeth-reserve__contact h3{margin:0;text-align:center;font:400 clamp(4rem,8vw,9rem)/1 Georgia,serif}.skyeth-reserve__contact a{color:#fff;font:500 clamp(2.5rem,5vw,5rem)/1 Georgia,serif;text-decoration:none;border-bottom:1px solid currentColor}.skyeth-reserve__tagline{margin:clamp(4rem,7vw,8rem) 0 0;text-align:center;font:400 clamp(2.5rem,4vw,5rem)/1.15 Georgia,serif}.skyeth-reserve button:focus-visible,.skyeth-reserve a:focus-visible{outline:4px solid #fff;outline-offset:5px}
@media(max-width:900px){.skyeth-reserve__frame{width:calc(100% - 1rem);min-height:calc(100vh - 1rem);margin:.5rem auto;padding:4.5rem 1rem 2rem;border-radius:1.8rem}.skyeth-reserve__close{top:.8rem;right:.8rem}.skyeth-reserve__logo{width:15rem;margin-bottom:1rem}.skyeth-reserve__header h2{margin-bottom:2.5rem;font-size:clamp(3rem,14vw,5.5rem)}.skyeth-reserve__cards,.skyeth-reserve__hotels{gap:1rem}.skyeth-reserve__service{min-height:14rem;padding:1.25rem;background-position:75% center}.skyeth-reserve__service-copy{grid-template-columns:5.5rem 1fr;gap:.35rem 1rem;width:82%}.skyeth-reserve__icon{width:5.5rem;border-width:2px}.skyeth-reserve__service strong{font-size:3rem}.skyeth-reserve__service small{font-size:.95rem}.skyeth-reserve__arrow{width:4.5rem;font-size:2.6rem}.skyeth-reserve__panel-heading{display:grid;gap:1.25rem;margin-bottom:2rem}.skyeth-reserve__panel-heading h3{font-size:3.4rem}.skyeth-reserve__back{position:static;justify-self:start;padding:.7rem 1.3rem;font-size:1rem}.skyeth-reserve__hotel{grid-template-columns:7rem 1fr;grid-template-rows:auto auto;min-height:14rem;padding:1rem;background-size:100% 100%}.skyeth-reserve__hotel::before{background:linear-gradient(90deg,rgba(3,126,193,.97),rgba(27,194,206,.79),rgba(0,61,99,.18))}.skyeth-reserve__hotel-brand{grid-row:1/3;width:6rem;height:7rem}.skyeth-reserve__hotel-brand>strong{font-size:1.5rem}.skyeth-reserve__hotel-copy{align-self:center}.skyeth-reserve__hotel-copy>strong{font-size:1.7rem}.skyeth-reserve__hotel-copy em{font-size:1rem}.skyeth-reserve__hotel-copy small{margin:0;padding:.5rem 0;font-size:.85rem}.skyeth-reserve__hotel>b{grid-column:2;padding:.55rem 1rem;font-size:.9rem}.skyeth-reserve__tagline{margin-top:2rem;font-size:2rem}}
@media(prefers-reduced-motion:reduce){.skyeth-reserve *,.skyeth-reserve *::before{scroll-behavior:auto!important;transition:none!important}}
.skyeth-reserve__icon svg{width:66%;stroke-width:1.25;vector-effect:non-scaling-stroke}
.skyeth-reserve__icon svg.skyeth-reserve__icon-dish{width:70%}
.skyeth-reserve__icon svg.skyeth-reserve__icon-lotus{width:69%}
.skyeth-reserve__icon{border:0}
.skyeth-reserve__icon img{display:block;width:100%;height:100%;object-fit:contain}
.skyeth-reserve__logo{width:min(23rem,38vw);filter:none}.skyeth-reserve__header h2{font-size:clamp(4.5rem,6.7vw,10rem);line-height:.95;white-space:nowrap}.skyeth-reserve__service-copy{grid-template-columns:clamp(9rem,13vw,18rem) minmax(20rem,1fr);gap:1rem clamp(2rem,4vw,6rem);width:78%}.skyeth-reserve__icon{width:clamp(9rem,13vw,18rem)}
@media(max-width:900px){.skyeth-reserve__header h2{white-space:normal}.skyeth-reserve__service-copy{grid-template-columns:5.5rem 1fr;gap:.35rem 1rem;width:82%}.skyeth-reserve__icon{width:5.5rem}}
.skyeth-reserve__service{background-color:#159fc8;background-position:right center;background-size:62% 100%;background-repeat:no-repeat}.skyeth-reserve__service::before{background:linear-gradient(90deg,#087fc4 0%,rgba(30,199,209,.98) 41%,rgba(27,196,208,.70) 56%,rgba(21,181,201,.12) 72%,transparent 100%)}.skyeth-reserve__close{display:none}
@media(max-width:900px){.skyeth-reserve__close{display:block}.skyeth-reserve__service{background-size:78% 100%}}
.skyeth-reserve__panel-heading{padding-top:clamp(6rem,8vw,10rem)}.skyeth-reserve__panel-heading .skyeth-reserve__back{top:0}
@media(max-width:900px){.skyeth-reserve__panel-heading{padding-top:0}}
.skyeth-reserve[data-current-panel="stay"] .skyeth-reserve__header h2,.skyeth-reserve[data-current-panel="contact"] .skyeth-reserve__header h2{display:none}.skyeth-reserve[data-current-panel="stay"] .skyeth-reserve__panel-heading{padding-top:clamp(2rem,3vw,4rem)}
@media(min-width:901px) and (max-width:1200px){.skyeth-reserve__frame{padding:4rem 3rem}.skyeth-reserve__logo{width:18rem}.skyeth-reserve__header h2{font-size:4.8rem}.skyeth-reserve__service{min-height:24rem;padding:2.5rem}.skyeth-reserve__service-copy{grid-template-columns:10rem minmax(17rem,1fr);gap:1rem 2.5rem;width:78%}.skyeth-reserve__icon{width:10rem}.skyeth-reserve__service strong{font-size:4.5rem}.skyeth-reserve__service small{font-size:1.45rem}.skyeth-reserve__arrow{width:7rem;font-size:4rem}.skyeth-reserve__panel-heading h3{font-size:5.3rem}.skyeth-reserve__back{font-size:1.1rem;padding:.9rem 1.7rem}.skyeth-reserve__hotel{grid-template-columns:23% 44% 33%;min-height:24rem;padding:2rem}.skyeth-reserve__hotel-brand{width:90%;height:70%}.skyeth-reserve__hotel-brand>strong{font-size:3.1rem}.skyeth-reserve__hotel-copy>strong{font-size:3rem}.skyeth-reserve__hotel-copy em{font-size:1.55rem}.skyeth-reserve__hotel-copy small{font-size:1.25rem}.skyeth-reserve__hotel>b{gap:.75rem;padding:.8rem 1.2rem;font-size:1.35rem}.skyeth-reserve__tagline{font-size:2.5rem}}
@media(min-width:901px){.skyeth-reserve[data-current-panel="stay"] .skyeth-reserve__panel-heading{padding-top:8rem}}

/* Preserve the reference composition on compact desktop/tablet previews. */
@media(min-width:901px) and (max-width:1200px){
  .skyeth-reserve__frame{padding:3.5rem 2.75rem}
  .skyeth-reserve__logo{width:11rem;margin-bottom:2rem}
  .skyeth-reserve[data-current-panel="stay"] .skyeth-reserve__panel-heading{padding-top:4.25rem;margin-bottom:3rem}
  .skyeth-reserve__panel-heading h3{font-size:3.4rem;line-height:.95;white-space:nowrap}
  .skyeth-reserve__back{gap:.7rem;padding:.75rem 1.5rem;font-size:1rem}
  .skyeth-reserve__hotel{grid-template-columns:22% 43% 35%;min-height:18.5rem;padding:1.7rem 1.9rem}
  .skyeth-reserve__hotel-brand{width:92%;height:78%}
  .skyeth-reserve__hotel-brand img{max-width:10.5rem;max-height:8.5rem}
  .skyeth-reserve__hotel-copy{gap:.25rem}
  .skyeth-reserve__hotel-copy>strong{font-size:2.35rem;line-height:1}
  .skyeth-reserve__hotel-copy em{font-size:1.25rem;line-height:1.1}
  .skyeth-reserve__hotel-copy small{padding-top:1.2rem;font-size:1rem;line-height:1.25}
  .skyeth-reserve__hotel>b{gap:.65rem;padding:.7rem 1.15rem;font-size:1.1rem}
  .skyeth-reserve__hotel>b i{font-size:1.35em}
  .skyeth-reserve__tagline{margin-top:3rem;font-size:2rem}
}


@font-face{
  font-family:"UTM Americana";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../../../themes/canhcamtheme/fonts/UTM Americana.ttf") format("truetype");
}

/* Pixel-matched 910 px composition derived from the 2835 px reference. */
@media(min-width:901px) and (max-width:1200px){
  .skyeth-reserve__frame{width:87.6%;margin:6.2vw auto;padding:2.4rem 2.4rem 3.5rem}
  .skyeth-reserve__logo{width:10rem;margin-bottom:2rem}
  .skyeth-reserve[data-current-panel="stay"] .skyeth-reserve__panel-heading{padding-top:0;margin-bottom:4.5rem}
  .skyeth-reserve__panel-heading h3{font-family:"UTM Americana",Georgia,serif;font-size:3.1rem;line-height:.95;white-space:nowrap}
  .skyeth-reserve__panel-heading .skyeth-reserve__back{top:-5.6rem;gap:.75rem;padding:.75rem 1.5rem;font-size:1rem}
  .skyeth-reserve__hotel{grid-template-columns:24% 41% 35%;min-height:14.25rem;padding:1.55rem 1.9rem}
  .skyeth-reserve__hotel-brand{width:94%;height:88%}
  .skyeth-reserve__hotel-brand img{max-width:11.5rem;max-height:9rem}
  .skyeth-reserve__hotel:nth-child(1) .skyeth-reserve__hotel-brand img{transform:scale(2.15)}
  .skyeth-reserve__hotel:nth-child(2) .skyeth-reserve__hotel-brand img{max-width:8rem}
  .skyeth-reserve__hotel-copy{gap:.2rem}
  .skyeth-reserve__hotel-copy>strong{font-family:"UTM Americana",Georgia,serif;font-size:1.58rem;line-height:1}
  .skyeth-reserve__hotel-copy em{font-size:1rem;line-height:1.1}
  .skyeth-reserve__hotel-copy small{padding-top:1rem;font-size:.95rem;line-height:1.25}
  .skyeth-reserve__hotel>b{gap:.65rem;padding:.65rem 1.1rem;font-size:1.1rem}
  .skyeth-reserve__hotels{gap:.9rem}
}

/* Desktop proportions measured against the supplied 2834 px reference. */
@media(min-width:1201px){
  .skyeth-reserve__frame{padding:4.5rem 4rem}
  .skyeth-reserve__logo{width:16rem;margin-bottom:2.25rem}
  .skyeth-reserve[data-current-panel="stay"] .skyeth-reserve__panel-heading{padding-top:0;margin-bottom:7rem}
  .skyeth-reserve__panel-heading h3{font-size:clamp(4.2rem,5.7vw,7rem);line-height:.95;white-space:nowrap}
  .skyeth-reserve__panel-heading .skyeth-reserve__back{top:-8.75rem;gap:1rem;padding:.9rem 2rem;font-size:1.25rem}
  .skyeth-reserve__hotel{grid-template-columns:24% 41% 35%;min-height:20rem;padding:2rem 2.5rem}
  .skyeth-reserve__hotel-brand{width:92%;height:82%}
  .skyeth-reserve__hotel-brand img{max-width:12rem;max-height:10rem}
  .skyeth-reserve__hotel:nth-child(1) .skyeth-reserve__hotel-brand img{transform:scale(2.15)}
  .skyeth-reserve__hotel-copy{gap:.35rem}
  .skyeth-reserve__hotel-copy>strong{font-size:2.55rem;line-height:1}
  .skyeth-reserve__hotel-copy em{font-size:1.5rem;line-height:1.1}
  .skyeth-reserve__hotel-copy small{padding-top:1.5rem;font-size:1.2rem;line-height:1.25}
  .skyeth-reserve__hotel>b{gap:.9rem;padding:.8rem 1.45rem;font-size:1.4rem}
  .skyeth-reserve__tagline{margin-top:4rem;font-size:2.6rem}
}

/* Roma uses the complete transparent lockup taken from the supplied reference. */
.skyeth-reserve__hotel:nth-child(2) .skyeth-reserve__hotel-brand img{
  display:block;
  width:auto;
  height:auto;
  max-width:7.7rem;
  max-height:6.3rem;
  object-fit:contain;
  filter:none;
  transform:none;
}
/* Divider between the hotel location and its description in the supplied layout. */
.skyeth-reserve__hotel-copy small::before{
  content:"";
  display:block;
  width:4.6rem;
  height:1px;
  margin:0 0 2rem;
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.48) 18%,#fff 50%,rgba(255,255,255,.48) 82%,transparent 100%);
  filter:drop-shadow(0 0 3px rgba(255,255,255,.6));
  transform-origin:left center;
  animation:skyeth-divider-reveal .7s cubic-bezier(.22,.75,.28,1) both;
}
@keyframes skyeth-divider-reveal{
  from{opacity:0;transform:scaleX(0)}
  to{opacity:1;transform:scaleX(1)}
}
@media(prefers-reduced-motion:reduce){
  .skyeth-reserve__hotel-copy small::before{animation:none}
}

/* Button proportions measured from the supplied 2835 px reference artwork. */
@media(min-width:901px) and (max-width:1200px){
  .skyeth-reserve__arrow{width:4.25rem}
}
@media(min-width:1201px){
  .skyeth-reserve__arrow{width:clamp(5rem,6.25vw,10rem)}
}
@media(min-width:901px){
  .skyeth-reserve__hotel>b{
    position:relative;
    right:.5vw;
    width:19.35vw;
    height:3.65vw;
    margin-right:1.78vw;
    margin-bottom:2.05vw;
    padding:0;
    justify-content:center;
    gap:1vw;
  }
  .skyeth-reserve__panel-heading .skyeth-reserve__back{
    width:14.45vw;
    height:3.7vw;
    margin-top:1.35vw;
    padding:0;
    justify-content:center;
  }
}
.skyeth-reserve__hotel:nth-child(2) .skyeth-reserve__hotel-copy small::before{animation-delay:.08s}
.skyeth-reserve__hotel:nth-child(3) .skyeth-reserve__hotel-copy small::before{animation-delay:.16s}

/* Geometrically centred service arrows and consistent interactions. */
.skyeth-reserve__arrow{
  align-self:end;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  transition:transform .35s ease,box-shadow .35s ease,filter .35s ease;
}
.skyeth-reserve__arrow i{
  position:relative;
  display:block;
  width:48%;
  height:2px;
  background:#fff;
  border-radius:999px;
  transition:transform .35s cubic-bezier(.22,.75,.28,1);
}
.skyeth-reserve__arrow i::after{
  content:"";
  position:absolute;
  top:50%;
  right:0;
  width:34%;
  aspect-ratio:1;
  border-top:2px solid #fff;
  border-right:2px solid #fff;
  transform:translateY(-50%) rotate(45deg);
  transform-origin:center;
}
.skyeth-reserve__service,.skyeth-reserve__service::before,
.skyeth-reserve__hotel,.skyeth-reserve__hotel>b,.skyeth-reserve__hotel>b i,
.skyeth-reserve__back,.skyeth-reserve__close{
  transition:transform .35s ease,box-shadow .35s ease,filter .35s ease,opacity .35s ease,background .35s ease,border-color .35s ease;
}
.skyeth-reserve__logo-link{display:inline-block;line-height:0;transform-origin:center;transition:transform .3s ease,filter .3s ease}
@media(hover:hover){
  .skyeth-reserve__logo-link:hover{transform:scale(1.1);filter:drop-shadow(0 10px 18px rgba(0,54,91,.24))}
  .skyeth-reserve__service:hover{border-color:rgba(255,255,255,.95);box-shadow:0 18px 45px rgba(0,68,108,.28)}
  .skyeth-reserve__service:hover::before{opacity:.9}
  .skyeth-reserve__service:hover .skyeth-reserve__arrow{transform:scale(1.06);box-shadow:0 18px 42px rgba(0,59,101,.38);filter:brightness(1.08)}
  .skyeth-reserve__service:hover .skyeth-reserve__arrow i{transform:translateX(9%)}
  .skyeth-reserve__hotel:hover{border-color:rgba(255,255,255,.95);box-shadow:0 16px 38px rgba(0,62,99,.25)}
  .skyeth-reserve__hotel:hover>b{transform:translateX(4%);box-shadow:0 10px 26px rgba(0,61,100,.3);filter:brightness(1.08)}
  .skyeth-reserve__hotel:hover>b i{transform:translateX(18%)}
  .skyeth-reserve__back:hover{transform:translateX(-4px);box-shadow:0 9px 24px rgba(0,61,100,.25)}
  .skyeth-reserve__close:hover{transform:rotate(90deg) scale(1.06);background:rgba(0,116,181,.65)}
}
@media(prefers-reduced-motion:reduce){
  .skyeth-reserve__logo-link,.skyeth-reserve__arrow,.skyeth-reserve__arrow i,.skyeth-reserve__service,.skyeth-reserve__service::before,
  .skyeth-reserve__hotel,.skyeth-reserve__hotel>b,.skyeth-reserve__hotel>b i,.skyeth-reserve__back,.skyeth-reserve__close{transition:none!important}
}
.skyeth-reserve__hotel-copy small{
  margin-top:2.75rem;
  padding-top:0;
}
@media(max-width:900px){
  .skyeth-reserve__hotel-copy small{margin-top:.65rem;padding-top:0}
  .skyeth-reserve__hotel-copy small::before{width:2.75rem;margin-bottom:.55rem}
}
@media(min-width:1201px){
  .skyeth-reserve__hotel-copy small{margin-top:3rem;padding-top:0}
  .skyeth-reserve__hotel-copy small::before{width:6rem;margin-bottom:2.25rem}
}
@media(max-width:900px){
  .skyeth-reserve__hotel:nth-child(2) .skyeth-reserve__hotel-brand img{max-width:5.8rem;max-height:5.5rem}
}
@media(min-width:901px) and (max-width:1200px){
  .skyeth-reserve__hotel:nth-child(2) .skyeth-reserve__hotel-brand img{max-width:7.7rem;max-height:6.3rem}
}
@media(min-width:1201px){
  .skyeth-reserve__hotel:nth-child(2) .skyeth-reserve__hotel-brand img{max-width:10rem;max-height:8rem}
}
/* Keep the header booking label on one line at desktop and tablet widths. */
.header .header-btn-booking .btn.btn-booking {
  width: max-content;
  min-width: 8rem;
  padding-right: 1.35rem;
  padding-left: 1.35rem;
  white-space: nowrap;
}

/* Match the supplied artwork: the undistorted 16:9 photo sits at the right edge,
   exactly as tall as the card; the left side remains the cyan information field. */
.skyeth-reserve__service,
.skyeth-reserve__hotel {
  aspect-ratio: 3.16 / 1;
  min-height: 0;
  background-size: auto 100%;
  background-position: right center;
  background-repeat: no-repeat;
}

/* The colour wash must sit above the photo. A negative stacking level placed
   it behind the element background and exposed a hard vertical photo edge. */
.skyeth-reserve__service::before,
.skyeth-reserve__hotel::before {
  z-index: 0;
  pointer-events: none;
}
.skyeth-reserve__service-copy,
.skyeth-reserve__arrow,
.skyeth-reserve__hotel-brand,
.skyeth-reserve__hotel-copy,
.skyeth-reserve__hotel > b {
  position: relative;
  z-index: 1;
}

/* Keep the undistorted photo, but carry the opaque cyan wash beyond the
   photo's left edge (about 44% of the card) before fading it gradually. */
.skyeth-reserve__service::before,
.skyeth-reserve__hotel::before {
  background: linear-gradient(
    90deg,
    #087fc4 0%,
    #1ec7d1 42%,
    rgba(29, 197, 208, .96) 50%,
    rgba(24, 190, 204, .76) 61%,
    rgba(16, 156, 190, .38) 76%,
    rgba(3, 48, 77, .08) 100%
  );
}

/* Service artwork must fill the whole card so its left edge cannot create a
   vertical seam. The existing colour wash above remains unchanged. */
.skyeth-reserve__service {
  background-size: cover;
  background-position: center;
}

/* Spa artwork is a 16:9 source. Show its full height at the right edge so the
   swan towel, rolled towels and flowers match the supplied composition. */
.skyeth-reserve__service:nth-child(3) {
  background-size: auto 100%;
  background-position: right center;
}

/* Refine CTA scale without changing alignment, colour or hover behaviour. */
@media(max-width:900px) {
  .skyeth-reserve__arrow {
    width:3.75rem;
    font-size:2.15rem;
  }
  .skyeth-reserve__hotel > b {
    gap:.45rem;
    padding:.45rem .8rem;
    font-size:.78rem;
  }
}
@media(min-width:901px) and (max-width:1200px) {
  .skyeth-reserve__arrow { width:3.5rem; }
  .skyeth-reserve__hotel > b {
    width:16.25vw;
    height:3.1vw;
    gap:.55rem;
    font-size:.95rem;
  }
}
@media(min-width:1201px) {
  .skyeth-reserve__arrow { width:clamp(4.2rem,5vw,8rem); }
  .skyeth-reserve__hotel > b {
    width:16.25vw;
    height:3.1vw;
    gap:.75vw;
    font-size:clamp(1.05rem,1.18vw,1.9rem);
  }
}

/* The supplied Spa source is horizontally opposite to the approved mock-up.
   Mirror only the photo layer: swan first, rolled towels and flowers to its
   right. Text, icon, CTA and the cyan wash keep their original direction. */
.skyeth-reserve__service:nth-child(3) {
  background-image: none !important;
}
.skyeth-reserve__service:nth-child(3)::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background: var(--card-image) center center / cover no-repeat;
  transform: scaleX(-1);
}
.skyeth-reserve__service:nth-child(3)::before {
  z-index: 1;
}
.skyeth-reserve__service:nth-child(3) .skyeth-reserve__service-copy,
.skyeth-reserve__service:nth-child(3) .skyeth-reserve__arrow {
  z-index: 2;
}

/* Spa uses a pre-flipped full-width asset so the swan/towels stay in the
   reference positions without a second layered image or a vertical seam. */
.skyeth-reserve__service:nth-child(3) {
  background-image: var(--card-image) !important;
  background-size: 100% auto !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}
.skyeth-reserve__service:nth-child(3)::after {
  content: none !important;
}
/* Match the lighter outer veil in the approved Web_Skyeth reference. */
.skyeth-reserve__shade{background:linear-gradient(135deg,rgba(0,117,184,.60),rgba(24,192,205,.36))}

/* Final mobile layout: preserve the approved wide-card proportions while
   scaling every child element together. Desktop rules remain untouched. */
@media (max-width:900px){
  .skyeth-reserve{overflow-x:hidden;background-attachment:scroll}
  .skyeth-reserve__frame{
    box-sizing:border-box;
    width:calc(100% - 16px);
    min-height:calc(100svh - 16px);
    margin:8px auto;
    padding:3.4rem 1rem 1.25rem;
    border-width:1px;
    border-radius:1.4rem;
  }
  .skyeth-reserve__close{top:.75rem;right:.75rem;width:2.65rem;height:2.65rem;font-size:1.8rem;border-width:1px}
  .skyeth-reserve__logo{width:min(9.25rem,42vw);margin:0 auto .8rem}
  .skyeth-reserve__header h2{font-size:clamp(2.65rem,12vw,4rem);line-height:.92;margin:0 0 1.8rem}
  .skyeth-reserve__cards,.skyeth-reserve__hotels{gap:.75rem}
  .skyeth-reserve__service{
    box-sizing:border-box;
    width:100%;
    aspect-ratio:3.16/1;
    min-height:0;
    padding:.5rem .65rem;
    border-width:1px;
    border-radius:1rem;
    background-size:cover!important;
    background-position:center center!important;
  }
  .skyeth-reserve__service:nth-child(3){background-size:cover!important;background-position:center center!important}
  .skyeth-reserve__service-copy{
    width:calc(100% - 2.8rem);
    grid-template-columns:3.35rem minmax(0,1fr);
    grid-template-rows:auto auto;
    column-gap:.7rem;
    row-gap:.1rem;
  }
  .skyeth-reserve__icon{width:3.35rem;align-self:center}
  .skyeth-reserve__service strong{font-size:clamp(1.75rem,8.5vw,2.35rem);line-height:.88}
  .skyeth-reserve__service small{font-size:clamp(.62rem,2.65vw,.78rem);line-height:1.18;max-width:12rem}
  .skyeth-reserve__arrow{right:.65rem;bottom:.65rem;width:2.8rem;min-width:2.8rem;height:2.8rem;font-size:1.55rem}
  .skyeth-reserve__tagline{font-size:clamp(1.1rem,5vw,1.45rem);line-height:1.05;margin:1.3rem 0 0}
  .skyeth-reserve__panel-heading{margin-bottom:1.2rem}
  .skyeth-reserve__panel-heading h3{font-size:clamp(2.35rem,11vw,3.5rem);line-height:.95}
  .skyeth-reserve__back{top:.75rem;left:.75rem;min-height:2.65rem;padding:.35rem .8rem;font-size:.9rem}
  .skyeth-reserve__hotel{
    box-sizing:border-box;
    width:100%;
    aspect-ratio:3.16/1;
    min-height:0;
    padding:.5rem .65rem;
    border-width:1px;
    border-radius:1rem;
    grid-template-columns:4.25rem minmax(0,1fr);
    grid-template-rows:1fr;
    gap:.15rem .65rem;
    background-size:cover!important;
    background-position:center center!important;
  }
  .skyeth-reserve__hotel-brand{grid-column:1;grid-row:1;width:4.05rem;height:5.2rem;align-self:center}
  .skyeth-reserve__hotel:nth-child(1) .skyeth-reserve__hotel-brand img{transform:none}
  .skyeth-reserve__hotel-copy{grid-column:2;grid-row:1;align-self:stretch;justify-content:center;min-width:0;padding-right:6.8rem}
  .skyeth-reserve__hotel-copy strong{font-size:clamp(1rem,4.3vw,1.35rem);line-height:.95}
  .skyeth-reserve__hotel-copy em{font-size:clamp(.62rem,2.6vw,.78rem);line-height:1.05;margin-top:.15rem}
  .skyeth-reserve__hotel-copy small{font-size:clamp(.58rem,2.35vw,.72rem);line-height:1.12;margin-top:.35rem;max-width:9.25rem}
  .skyeth-reserve__hotel>b{position:absolute;right:.65rem;bottom:.55rem;min-width:0;width:auto;height:auto;padding:.32rem .65rem;font-size:clamp(.66rem,2.8vw,.82rem);line-height:1.1}
}

@media (max-width:420px){
  .skyeth-reserve__frame{padding-left:.7rem;padding-right:.7rem}
  .skyeth-reserve__service-copy{grid-template-columns:3.15rem minmax(0,1fr);column-gap:.55rem}
  .skyeth-reserve__icon{width:3.15rem}
}

/* Back stays at the reference desktop position, then follows the hotel list
   and is centered at the bottom on phone layouts. */
.skyeth-reserve__panel[data-reserve-panel="stay"]{position:relative}
.skyeth-reserve__back--stay{position:absolute;top:0;left:0}
@media (max-width:900px){
  .skyeth-reserve__back--stay{
    position:static;
    display:flex;
    width:max-content;
    min-width:8.5rem;
    margin:1.35rem auto 0;
    justify-content:center;
    justify-self:center;
  }
}

/* Phone navigation: keep Back after the panel content. The display:contents
   fallback also fixes cached HTML where Back still sits inside a heading/contact wrapper. */
@media (max-width:900px){
  .skyeth-reserve__panel[data-reserve-panel="stay"].is-active,
  .skyeth-reserve__panel[data-reserve-panel="contact"].is-active{
    display:flex;
    flex-direction:column;
  }
  .skyeth-reserve__panel[data-reserve-panel="stay"] .skyeth-reserve__panel-heading{
    display:contents;
  }
  .skyeth-reserve__panel[data-reserve-panel="stay"] .skyeth-reserve__panel-heading h3{
    order:0;
    margin:0 0 1.2rem;
  }
  .skyeth-reserve__panel[data-reserve-panel="stay"] .skyeth-reserve__hotels{
    order:1;
  }
  .skyeth-reserve__panel[data-reserve-panel="contact"] .skyeth-reserve__contact{
    display:contents;
  }
  .skyeth-reserve__panel[data-reserve-panel="contact"] .skyeth-reserve__contact h3{
    order:0;
    margin:0;
  }
  .skyeth-reserve__panel[data-reserve-panel="contact"] .skyeth-reserve__contact a{
    order:1;
    align-self:center;
    margin-top:3rem;
  }
  .skyeth-reserve__panel:is([data-reserve-panel="stay"],[data-reserve-panel="contact"]) .skyeth-reserve__back{
    position:static!important;
    order:3;
    display:flex;
    align-self:center;
    justify-self:center;
    justify-content:center;
    width:max-content;
    min-width:8.5rem;
    margin:1.35rem auto 0!important;
  }
}

/* Normalize the three hotel lockups on phones. Legacy per-hotel rules used
   intrinsic image dimensions, which allowed the square Roma asset to overflow
   its grid column and cover the hotel copy. */
@media (max-width:900px){
  .skyeth-reserve__hotel-brand{
    box-sizing:border-box;
    width:4.05rem!important;
    height:5.2rem!important;
    min-width:0;
    overflow:hidden;
  }
  .skyeth-reserve__hotel .skyeth-reserve__hotel-brand img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    transform:none!important;
    transform-origin:center!important;
  }
  .skyeth-reserve__hotel:nth-child(1) .skyeth-reserve__hotel-brand img{width:86%!important;height:86%!important}
  .skyeth-reserve__hotel:nth-child(2) .skyeth-reserve__hotel-brand img{width:88%!important;height:88%!important}
  .skyeth-reserve__hotel:nth-child(3) .skyeth-reserve__hotel-brand img{width:92%!important;height:92%!important}

  /* Roma's source is a square lockup. Keep it inside the same visual slot as
     Venice and Sakurakyo, regardless of legacy nth-child rules or intrinsic size. */
  .skyeth-reserve__hotel--roma .skyeth-reserve__hotel-brand--roma{
    contain:layout paint;
    display:grid!important;
    place-items:center!important;
    width:4.05rem!important;
    height:5.2rem!important;
    min-width:4.05rem!important;
    max-width:4.05rem!important;
    min-height:5.2rem!important;
    max-height:5.2rem!important;
    overflow:hidden!important;
  }
  .skyeth-reserve__hotel--roma .skyeth-reserve__hotel-brand--roma img{
    position:static!important;
    inset:auto!important;
    display:block!important;
    box-sizing:border-box!important;
    width:3.56rem!important;
    height:4.58rem!important;
    min-width:0!important;
    min-height:0!important;
    max-width:3.56rem!important;
    max-height:4.58rem!important;
    margin:auto!important;
    object-fit:contain!important;
    transform:none!important;
  }
}

/* 1.0.65: balance the visible artwork of all three hotel lockups.
   Venice has a large transparent canvas, while Roma's sharp asset is tightly
   cropped. Keep these final so legacy sizing cannot override them. */
@media (min-width:1201px){
  #skyeth-reserve .skyeth-reserve__hotel--roma .skyeth-reserve__hotel-brand--roma img{
    width:13rem!important;
    height:auto!important;
    max-width:13rem!important;
    max-height:10.75rem!important;
  }
}
@media (min-width:901px) and (max-width:1200px){
  #skyeth-reserve .skyeth-reserve__hotel--roma .skyeth-reserve__hotel-brand--roma img{
    width:10rem!important;
    height:auto!important;
    max-width:10rem!important;
    max-height:8.25rem!important;
  }
}
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    transform:scale(2.15)!important;
    transform-origin:center!important;
  }
}

/* 1.0.87: present the approved selector as a centred desktop modal over the
   current page, matching the supplied overlay behaviour without changing the
   selector's content or internal composition. */
@media (min-width:901px){
  #skyeth-reserve.skyeth-reserve{
    background:transparent;
    overflow:hidden;
  }

  #skyeth-reserve .skyeth-reserve__shade{
    pointer-events:auto;
    background:rgba(8,15,27,.78);
  }

  #skyeth-reserve .skyeth-reserve__frame{
    box-sizing:border-box;
    width:min(68vw,1100px);
    max-height:88vh;
    margin:6vh auto;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#057fbd var(--skyeth-reserve-bg) center/cover no-repeat;
    box-shadow:0 28px 80px rgba(0,0,0,.42);
  }
}

/* 1.0.66: desktop navigation follows the panel content, matching mobile. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__panel:is([data-reserve-panel="stay"],[data-reserve-panel="contact"]) .skyeth-reserve__back{
    position:static!important;
    display:flex;
    align-self:center;
    justify-self:center;
    justify-content:center;
    width:max-content;
    min-width:8.5rem;
    margin:1.35rem auto 0!important;
  }
}

/* 1.0.69: reduce and rebalance the complete desktop selector while preserving
   its content, visual hierarchy and mobile composition. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__frame{
    width:min(68vw,110rem);
    min-height:auto;
    margin:6vh auto;
    padding:clamp(2.6rem,3.4vw,4.25rem) clamp(2.2rem,3vw,4rem);
  }

  #skyeth-reserve .skyeth-reserve__logo{
    width:clamp(12rem,15vw,18rem);
    margin-bottom:clamp(1.25rem,1.6vw,2rem);
  }

  #skyeth-reserve .skyeth-reserve__header h2{
    margin-bottom:clamp(2.4rem,3.5vw,4.4rem);
    font-size:clamp(3.2rem,4vw,6.25rem);
  }

  #skyeth-reserve .skyeth-reserve__cards{
    gap:clamp(1.4rem,2vw,2.5rem);
  }

  #skyeth-reserve .skyeth-reserve__service{
    aspect-ratio:3.7/1;
    min-height:0;
    padding:clamp(1.5rem,2.5vw,3.2rem);
  }

  #skyeth-reserve .skyeth-reserve__service-copy{
    grid-template-columns:clamp(6.5rem,8vw,10.5rem) minmax(16rem,1fr);
    gap:.65rem clamp(1.5rem,2.5vw,3.4rem);
    width:72%;
  }

  #skyeth-reserve .skyeth-reserve__icon{
    width:clamp(6.5rem,8vw,10.5rem);
  }

  #skyeth-reserve .skyeth-reserve__service strong{
    font-size:clamp(3rem,4.25vw,6rem);
  }

  #skyeth-reserve .skyeth-reserve__service small{
    font-size:clamp(1.1rem,1.45vw,1.9rem);
  }

  #skyeth-reserve .skyeth-reserve__arrow{
    width:clamp(3.4rem,4vw,5.6rem);
  }

  #skyeth-reserve .skyeth-reserve__tagline{
    margin-top:clamp(2.2rem,2.8vw,3.5rem);
    font-size:clamp(1.8rem,2.5vw,3.2rem);
  }
}

/* 1.0.70: enlarge the Skyeth Group logo and reduce desktop Back controls only. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__logo{
    width:clamp(14rem,18vw,22rem);
  }

  #skyeth-reserve .skyeth-reserve__panel:is([data-reserve-panel="stay"],[data-reserve-panel="contact"]) .skyeth-reserve__back{
    min-width:6.5rem;
    gap:.5rem;
    padding:.55rem 1.1rem;
    font-size:clamp(.85rem,1vw,1.2rem);
  }

  #skyeth-reserve .skyeth-reserve__hotel--roma .skyeth-reserve__hotel-brand--roma img{
    width:12rem!important;
    height:auto!important;
    max-width:12rem!important;
    max-height:10rem!important;
  }
}

/* 1.0.71: reduce desktop hotel BOOK NOW CTAs, including their inner arrows. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__hotel>b{
    width:12vw;
    height:2.35vw;
    gap:.5vw;
    font-size:clamp(.9rem,.88vw,1.4rem);
  }
}

/* 1.0.72: enlarge only the visible Venice lockup on desktop. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    transform:scale(2.5)!important;
    transform-origin:center!important;
  }
}

/* 1.0.74: place BOOK in the existing mobile utility stack above the untouched
   pencil and back-to-top controls. */
.skyeth-mobile-book{display:none}
@media (max-width:900px){
  .skyeth-mobile-book{
    position:static;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:2.5rem;
    height:2.5rem;
    box-sizing:border-box;
    padding:0;
    color:#fff!important;
    border:1.5px solid rgba(255,255,255,.9);
    border-radius:50%;
    background:linear-gradient(145deg,#0781bd,#2bc6d0);
    box-shadow:0 .4rem 1rem rgba(0,66,105,.28);
    font:700 .55rem/1 "Reddit Sans",Arial,sans-serif;
    letter-spacing:.06em;
    text-decoration:none!important;
  }
}

/* 1.0.76: enlarge the logo, separate the two-line hotel heading, and compact Back on mobile. */
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__logo{
    width:min(13rem,56vw);
    margin:-1.1rem auto .6rem;
  }

  #skyeth-reserve .skyeth-reserve__panel-heading h3{
    line-height:1.08;
  }

  #skyeth-reserve .skyeth-reserve__panel:is([data-reserve-panel="stay"],[data-reserve-panel="contact"]) .skyeth-reserve__back{
    min-width:7.25rem;
    min-height:2.25rem;
    gap:.45rem;
    padding:.28rem .65rem;
    font-size:.78rem;
  }
}

/* 1.0.80: keep mobile hotel lockups sharp without transform rasterization.
   The Venice source has a large transparent canvas, so its CSS box alone is
   not comparable with the tightly cropped Roma and Sakurakyo files. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    transform:scale(3.1)!important;
    transform-origin:center!important;
  }
}
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    width:245%!important;
    height:245%!important;
    max-width:none!important;
    max-height:none!important;
    transform:none!important;
    filter:none!important;
    image-rendering:auto;
  }
  #skyeth-reserve#skyeth-reserve .skyeth-reserve__hotel--roma .skyeth-reserve__hotel-brand--roma img{
    width:4.05rem!important;
    height:5.2rem!important;
    min-width:4.05rem!important;
    min-height:5.2rem!important;
    max-width:4.05rem!important;
    max-height:5.2rem!important;
    transform:none!important;
    filter:none!important;
    image-rendering:auto;
  }
  #skyeth-reserve .skyeth-reserve__hotel--sakurakyo .skyeth-reserve__hotel-brand--sakurakyo img{
    width:86%!important;
    height:86%!important;
    transform:none!important;
    filter:none!important;
    image-rendering:auto;
  }

  #skyeth-reserve[data-current-panel="contact"] .skyeth-reserve__panel[data-reserve-panel="contact"]{
    margin-top:clamp(8rem,17vh,9rem);
  }
}

/* 1.0.81: size the padded Venice source on an explicit square canvas.
   This preserves native pixels and lets the brand slot crop only transparent padding. */
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    width:10.55rem!important;
    height:10.55rem!important;
    min-width:10.55rem!important;
    min-height:10.55rem!important;
    max-width:10.55rem!important;
    max-height:10.55rem!important;
    flex:none!important;
    transform:none!important;
    filter:none!important;
  }
}

/* 1.0.82: center the padded Venice canvas and keep its visible mark inside the brand slot. */
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    width:9.6rem!important;
    height:9.6rem!important;
    min-width:9.6rem!important;
    min-height:9.6rem!important;
    max-width:9.6rem!important;
    max-height:9.6rem!important;
    place-self:center!important;
  }
}

/* 1.0.83: compensate for the asymmetric transparent padding in Logo-Venice.png. */
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    margin-left:-3.05rem!important;
  }
}

/* 1.0.84: vertically align the visible Venice artwork inside the fixed brand slot. */
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    margin-top:-1.08rem!important;
  }
}

/* 1.0.85: restore the white Venice lockup used by the other mobile hotel brands. */
@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__hotel--venice .skyeth-reserve__hotel-brand--venice img{
    filter:brightness(0) invert(1)!important;
  }
}

/* 1.0.88: scale the complete desktop modal as one unit so its approved content
   fits in a single viewport without an internal scrollbar. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__frame{
    max-height:none;
    margin:4vh auto 0;
    overflow:visible;
    transform:scale(.52);
    transform-origin:top center;
  }
}
@media (min-width:2200px){
  #skyeth-reserve .skyeth-reserve__frame{transform:scale(.42)}
}

/* 1.0.90: keep the main desktop modal as tall as Choose your hotel across
   desktop aspect ratios, without changing its width or internal scale. */
@media (min-width:901px){
  #skyeth-reserve[data-current-panel="main"] .skyeth-reserve__frame{
    min-height:100.5vw;
    padding-bottom:clamp(2.6rem,3.4vw,4.25rem);
  }
}

/* 1.0.91: match the desktop service-card height and spacing to the approved
   hotel cards, and return Back to the top of the hotel panel. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__cards{
    gap:clamp(2rem,3vw,4rem);
  }

  #skyeth-reserve .skyeth-reserve__service{
    aspect-ratio:3.16/1;
  }

  #skyeth-reserve .skyeth-reserve__panel[data-reserve-panel="stay"] .skyeth-reserve__back--stay{
    position:absolute!important;
    top:0!important;
    left:0!important;
    z-index:3;
    margin:0!important;
  }
}

/* 1.0.97: scale the complete desktop composition continuously with the
   viewport. Every outer and inner frame keeps the same approved proportion. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__frame{
    transform:scale(var(--skyeth-reserve-scale,.52));
  }
}
@media (min-width:2200px){
  #skyeth-reserve .skyeth-reserve__frame{
    transform:scale(var(--skyeth-reserve-scale,.42));
  }
}

/* 1.0.98: keep every desktop Back control identical and responsive. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__panel:is([data-reserve-panel="stay"],[data-reserve-panel="contact"]) .skyeth-reserve__back{
    position:static!important;
    display:flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    min-width:11rem;
    min-height:4.5rem;
    margin:1.25rem auto 0!important;
    padding:.75rem 1.65rem;
    font-size:1.3rem;
  }
}

/* 1.0.100: expose the shared close control on every desktop panel. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__close{
    display:grid;
    place-items:center;
    top:2rem;
    right:2rem;
    width:4.5rem;
    height:4.5rem;
    padding:0;
    font-size:2.8rem;
    line-height:1;
  }
}

/* 1.0.101: match the main title to Choose your hotel while preserving the
   aligned position of the two card groups below. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__header h2{
    margin-bottom:clamp(.5rem,.515vw,.85rem);
    font-size:clamp(4.2rem,5.7vw,7rem);
    line-height:.95;
  }
}

/* 1.0.92: align the complete desktop service-card group with the hotel-card
   group, and keep the larger Back control below the hotel list. */
@media (min-width:901px){
  #skyeth-reserve[data-current-panel="main"] .skyeth-reserve__cards{
    margin-top:7.04vw;
  }

  #skyeth-reserve .skyeth-reserve__panel[data-reserve-panel="stay"] .skyeth-reserve__back--stay{
    position:static!important;
    display:flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    min-width:9rem;
    min-height:3.75rem;
    margin:2rem auto 0!important;
    padding:.65rem 1.4rem;
    font-size:1.1rem;
  }
}
@media (min-width:2200px){
  #skyeth-reserve[data-current-panel="main"] .skyeth-reserve__cards{
    margin-top:7.04vw;
  }
}

/* 1.0.96: enlarge only the desktop hotel BOOK NOW and bottom Back controls. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__hotel>b{
    width:14vw;
    height:3vw;
    gap:.65vw;
    font-size:clamp(1.05rem,1.05vw,1.65rem);
  }

  #skyeth-reserve .skyeth-reserve__panel[data-reserve-panel="stay"] .skyeth-reserve__back--stay{
    min-width:11rem;
    min-height:4.5rem;
    margin:1.25rem auto 0!important;
    padding:.75rem 1.65rem;
    font-size:1.3rem;
  }
}

/* 1.0.105: match the contact panel content and circular return control to
   the approved Web_Skyeth PDF while preserving other panels. */
#skyeth-reserve .skyeth-reserve__tagline-contact{display:none}
#skyeth-reserve[data-current-panel="contact"] .skyeth-reserve__tagline-default{display:none}
#skyeth-reserve[data-current-panel="contact"] .skyeth-reserve__tagline-contact{display:inline}
#skyeth-reserve .skyeth-reserve__panel[data-reserve-panel="contact"] .skyeth-reserve__back--contact{
  display:grid;
  place-items:center;
  width:clamp(4.5rem,7vw,6.5rem);
  min-width:clamp(4.5rem,7vw,6.5rem);
  height:clamp(4.5rem,7vw,6.5rem);
  min-height:clamp(4.5rem,7vw,6.5rem);
  padding:0;
  border-radius:50%;
  font-size:0;
}
#skyeth-reserve .skyeth-reserve__panel[data-reserve-panel="contact"] .skyeth-reserve__back--contact span{
  display:block;
  color:#0781bd;
  font:300 clamp(2.4rem,4vw,3.8rem)/1 Arial,sans-serif;
  transform:translateY(-.04em);
}

/* 1.0.106: use the approved Americana display face consistently across
   every popup panel and breakpoint. Supporting copy remains Reddit Sans. */
#skyeth-reserve .skyeth-reserve__header h2,
#skyeth-reserve .skyeth-reserve__service strong,
#skyeth-reserve .skyeth-reserve__panel-heading h3,
#skyeth-reserve .skyeth-reserve__hotel-brand>strong,
#skyeth-reserve .skyeth-reserve__hotel-copy>strong,
#skyeth-reserve .skyeth-reserve__contact h3,
#skyeth-reserve .skyeth-reserve__contact a,
#skyeth-reserve .skyeth-reserve__tagline{
  font-family:"UTM Americana",Georgia,"Times New Roman",serif;
}

@font-face{
  font-family:"SVN Gilroy PDF";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("SVN-GilroySemiBold.woff2") format("woff2");
}

@font-face{
  font-family:"Plantagenet Cherokee PDF";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("Plantagenet-Cherokee.ttf") format("truetype");
}

@font-face{
  font-family:"Myriad Pro PDF";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("MYRIADPRO-REGULAR.OTF") format("opentype");
}

/* 1.0.108: complete font files supplied for the roles embedded in
   Web_Skyeth.pdf. Myriad also supplies Vietnamese glyphs absent from
   Plantagenet Cherokee, matching the PDF's own fallback behavior. */
#skyeth-reserve .skyeth-reserve__header h2,
#skyeth-reserve .skyeth-reserve__service strong,
#skyeth-reserve .skyeth-reserve__panel-heading h3,
#skyeth-reserve .skyeth-reserve__hotel-brand>strong,
#skyeth-reserve .skyeth-reserve__hotel-copy>strong,
#skyeth-reserve .skyeth-reserve__contact h3,
#skyeth-reserve .skyeth-reserve__tagline{
  font-family:"Plantagenet Cherokee PDF","Myriad Pro PDF","UTM Americana",Georgia,"Times New Roman",serif;
}

#skyeth-reserve .skyeth-reserve__service small,
#skyeth-reserve .skyeth-reserve__hotel-copy small{
  font-family:"Myriad Pro PDF",Arial,sans-serif;
  font-weight:400;
}

#skyeth-reserve .skyeth-reserve__hotel-copy em,
#skyeth-reserve .skyeth-reserve__hotel>b,
#skyeth-reserve .skyeth-reserve__back,
#skyeth-reserve .skyeth-reserve__contact a{
  font-family:"SVN Gilroy PDF",Arial,sans-serif;
  font-weight:600;
}

/* 1.0.109: enlarge only the text called out inside the service and hotel
   sections. Card dimensions, imagery and established alignment stay intact. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__service strong{
    font-size:clamp(3.5rem,4.9vw,6.9rem);
  }

  #skyeth-reserve .skyeth-reserve__service small{
    font-size:clamp(1.3rem,1.7vw,2.2rem);
  }

  #skyeth-reserve .skyeth-reserve__hotel-copy>strong{
    font-size:clamp(1.9rem,3vw,3rem);
  }

  #skyeth-reserve .skyeth-reserve__hotel-copy em{
    font-size:clamp(1.15rem,1.7vw,1.8rem);
  }

  #skyeth-reserve .skyeth-reserve__hotel-copy small{
    font-size:clamp(1.05rem,1.4vw,1.45rem);
  }

  #skyeth-reserve .skyeth-reserve__hotel>b{
    font-size:clamp(1.2rem,1.2vw,1.9rem);
  }

  #skyeth-reserve .skyeth-reserve__panel[data-reserve-panel="stay"] .skyeth-reserve__back--stay{
    font-size:1.5rem;
  }

  #skyeth-reserve .skyeth-reserve__tagline{
    font-size:clamp(2.1rem,2.9vw,3.7rem);
  }
}

/* 1.0.110: slightly enlarge only the highlighted description copy. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__service small{
    font-size:clamp(1.5rem,1.95vw,2.5rem);
  }

  #skyeth-reserve .skyeth-reserve__hotel-copy small{
    font-size:clamp(1.2rem,1.6vw,1.65rem);
  }
}

/* 1.0.114: enlarge only the hotel descriptions highlighted in the
   reference. Hotel names, locations and controls remain unchanged. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__hotel-copy small{
    font-size:clamp(1.35rem,1.75vw,1.8rem);
  }
}

/* 1.0.115: one small additional increase for hotel descriptions only. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__hotel-copy small{
    font-size:clamp(1.45rem,1.85vw,1.9rem);
  }
}

/* 1.0.116: add breathing room between service titles and descriptions;
   loosen wrapped description lines on phone screens. */
@media (min-width:901px){
  #skyeth-reserve .skyeth-reserve__service-copy{
    row-gap:1.4rem;
  }
}

@media (max-width:900px){
  #skyeth-reserve .skyeth-reserve__service-copy{
    row-gap:.45rem;
  }

  #skyeth-reserve .skyeth-reserve__service small{
    line-height:1.28;
  }
}