
/* v7 — exact user logo + fully fluid home + animated Nearby cards */
.home-reference{--home-gutter:clamp(28px,4vw,88px)}
.home-reference .reference-shell,
.home-reference .home-header,
.home-reference .reference-booking,
.home-reference .reference-footer-inner{
  width:calc(100% - (var(--home-gutter) * 2))!important;
  max-width:none!important;
}

/* Exact vector trace of the user's attached logo; same asset everywhere. */
.site-logo{display:block;width:100%;height:auto;object-fit:contain}
.home-reference .home-brand{width:clamp(250px,18vw,340px)!important;min-width:clamp(250px,18vw,340px)!important;padding-top:10px!important}
.home-reference .home-brand>.site-logo{width:100%!important;max-height:100px!important}
.home-reference .reference-footer-brand{width:clamp(230px,17vw,320px)!important;min-width:clamp(230px,17vw,320px)!important}
.site-header .brand{width:clamp(220px,18vw,300px)!important;min-width:clamp(220px,18vw,300px)!important}
.footer .footer-brand{width:clamp(210px,17vw,280px)!important;min-width:clamp(210px,17vw,280px)!important}

/* Hero/content remains fluid rather than becoming a narrow centered island when zoomed out. */
@media(min-width:1001px){
  .home-reference .reference-hero-copy{width:calc(100% - (var(--home-gutter) * 2))!important}
  .home-reference .reference-room-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.3vw,24px)}
  .home-reference .reference-why{grid-template-columns:clamp(145px,11vw,190px) repeat(5,minmax(0,1fr))}
  .home-reference .reference-nearby-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.4vw,24px)}
}

/* Nearby: clean photos, no embedded/baked duplicate text, and a restrained living-photo animation. */
.home-reference .reference-place-card{
  position:relative;
  overflow:hidden;
  background:none!important;
  isolation:isolate;
  filter:none!important;
}
.home-reference .reference-place-photo{position:absolute;inset:0;z-index:0;overflow:hidden;display:block;background:#d7e6e5}
.home-reference .reference-place-photo img{
  width:100%;height:100%;display:block;object-fit:cover;object-position:center;
  transform:scale(1.025);
  animation:mkNearbyDrift 11s ease-in-out infinite alternate;
  will-change:transform;
}
.home-reference .place-aipetri .reference-place-photo img{animation-delay:-3.2s;object-position:center 54%}
.home-reference .place-beach .reference-place-photo img{animation-delay:-6.1s;object-position:center 50%}
.home-reference .reference-place-card:hover .reference-place-photo img{animation-play-state:paused;transform:scale(1.075)}
.home-reference .reference-place-card:before{
  content:'';position:absolute;z-index:1;inset:0;
  background:linear-gradient(180deg,rgba(2,32,33,0) 0%,rgba(2,32,33,.02) 48%,rgba(2,43,44,.40) 70%,rgba(2,43,44,.90) 100%)!important;
  pointer-events:none;
}
.home-reference .reference-place-copy{z-index:2!important}
.home-reference .reference-place-card i{z-index:2!important}
@keyframes mkNearbyDrift{
  0%{transform:scale(1.025) translate3d(-0.5%,0,0)}
  50%{transform:scale(1.055) translate3d(0.6%,-0.8%,0)}
  100%{transform:scale(1.075) translate3d(-0.2%,0.5%,0)}
}
@media(prefers-reduced-motion:reduce){
  .home-reference .reference-place-photo img{animation:none!important;transform:scale(1.02)!important}
}

/* At very wide CSS viewports created by browser zoom-out, keep using the screen instead of exposing huge side gutters. */
@media(min-width:1800px){
  .home-reference{--home-gutter:clamp(38px,2.5vw,96px)}
  .home-reference .reference-hero-copy h1{font-size:clamp(64px,3.3vw,92px)}
  .home-reference .reference-hero-copy p{font-size:clamp(18px,1vw,26px)}
  .home-reference .reference-room-card{height:clamp(280px,17vw,360px)}
  .home-reference .reference-room-photo{height:clamp(155px,9.5vw,210px)}
  .home-reference .reference-place-card{height:clamp(180px,10vw,240px)}
}


/* v8 fixes — exact user logo without overlap + HD nearby photos */
img.site-logo{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;object-position:left center}
.home-reference .home-brand{width:clamp(238px,16vw,300px)!important;min-width:clamp(238px,16vw,300px)!important;padding-top:12px!important}
.home-reference .home-brand>.site-logo{max-height:84px!important;width:100%!important}
.home-reference .reference-footer-brand{width:clamp(210px,14vw,260px)!important;min-width:clamp(210px,14vw,260px)!important;height:auto!important;align-items:center!important}
.home-reference .reference-footer-brand>.site-logo{width:100%!important;max-height:72px!important}
.site-header .brand{width:clamp(210px,16vw,280px)!important;min-width:clamp(210px,16vw,280px)!important}
.site-header .brand>.site-logo{max-height:78px!important}
.footer .footer-brand{width:clamp(200px,15vw,240px)!important;min-width:clamp(200px,15vw,240px)!important}
.footer .footer-brand>.site-logo{max-height:70px!important}
.home-reference .reference-place-card{background:none!important}
.home-reference .reference-place-photo{background:#d7e4e3!important}
.home-reference .reference-place-photo img{image-rendering:auto;transform:scale(1.02);animation:mkNearbyDriftHd 16s ease-in-out infinite alternate}
.home-reference .reference-place-card:hover .reference-place-photo img{transform:scale(1.045)}
.home-reference .reference-place-card:before{background:linear-gradient(180deg,rgba(2,32,33,0) 0%,rgba(2,32,33,.04) 46%,rgba(2,43,44,.32) 69%,rgba(2,43,44,.84) 100%)!important}
.home-reference .reference-place-copy{left:22px;right:74px;bottom:18px}
.home-reference .reference-place-copy b{font-size:19px}
.home-reference .reference-place-copy small{font-size:13px}
.home-reference .reference-place-card i{right:18px;bottom:16px}
.home-reference .place-swallow .reference-place-photo img{object-position:center 52%}
.home-reference .place-aipetri .reference-place-photo img{object-position:center 53%}
.home-reference .place-beach .reference-place-photo img{object-position:center 56%}
@keyframes mkNearbyDriftHd{0%{transform:scale(1.02) translate3d(-0.35%,0.15%,0)}50%{transform:scale(1.04) translate3d(0.45%,-0.45%,0)}100%{transform:scale(1.055) translate3d(-0.2%,0.3%,0)}}
@media(max-width:820px){.home-reference .reference-footer-brand>.site-logo{max-height:62px!important}.home-reference .reference-place-copy b{font-size:22px}.home-reference .reference-place-copy small{font-size:14px}}
@media(max-width:560px){.home-reference .home-brand{width:210px!important;min-width:210px!important}.home-reference .home-brand>.site-logo{max-height:70px!important}.home-reference .reference-footer-brand{width:200px!important;min-width:200px!important}.home-reference .reference-place-photo img{animation-duration:18s}}
