/* Luxury Guest Frontend v1.2: refinement layer over fv11.css (no redesign). Typography/spacing, card proportions,
   hero crop + overlay contrast, search bar, detail gallery, responsive reservation card, visible focus, 44px targets. */
:root{--fv12-ring:0 0 0 3px #fff,0 0 0 5px #b8893f}
body{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
.hero.lux{min-height:680px}
.hero.lux h1{font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.08;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.hero.lux .lede,.hero.lux p{max-width:600px;line-height:1.55;text-shadow:0 1px 10px rgba(0,0,0,.55)}
.hero .searchbar{gap:6px;padding:10px;border-radius:16px}
.hero .searchbar input,.hero .searchbar select,.hero .searchbar button{min-height:48px}
main.fv1-home .featured{padding-top:96px}
.featured h2,.pageh{letter-spacing:-.01em}
.fgrid{gap:26px}
.card .b{padding:16px 18px 18px}.card h3{font-size:1.18rem;line-height:1.3}
.card .ph img{aspect-ratio:3/2}
.gallery{display:grid;gap:12px}
.gallery #main-photo{aspect-ratio:3/2;max-height:600px;box-shadow:0 12px 32px rgba(10,13,20,.14)}
.thumbs{gap:10px}
.thumbs button{min-height:44px;min-width:44px;transition:border-color .15s}
.thumbs button[aria-pressed=true]{border-color:#b8893f}
.thumbs img{aspect-ratio:3/2}
.book{border-radius:14px;box-shadow:0 10px 30px rgba(10,13,20,.10)}
.book button,#reserve,#conf,#canc{min-height:44px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #b8893f;outline-offset:2px;box-shadow:var(--fv12-ring);border-radius:6px}
@media (max-width:1000px){.book{position:static;margin-top:8px}}
@media (max-width:760px){.hero.lux{min-height:0}.hero-in{padding-top:72px}.hero .searchbar{top:24px}main.fv1-home .featured{padding-top:64px}.thumbs{grid-template-columns:repeat(4,minmax(44px,1fr));gap:6px}.gallery{grid-template-columns:1fr}.card .ph img{aspect-ratio:4/3}}
.card button.fav,#navtoggle,.top .role select,#who{min-height:44px;min-width:44px}
/* v1.2 overlay contrast (measured on sampled pixels in r001: eyebrow 3.5:1, tablet lede 4.1:1 at p95) — stronger left/bottom scrim, same photo + crop */
.hero.lux{background:linear-gradient(90deg,rgba(6,9,16,.92) 0%,rgba(8,13,26,.8) 42%,rgba(10,16,32,.38) 72%,rgba(0,0,0,.08) 100%),linear-gradient(0deg,rgba(6,9,16,.74) 0%,rgba(6,9,16,0) 45%),
  image-set(url(/img/gen/hero-1280.webp) type("image/webp"),url(/img/gen/hero-1024.jpg) type("image/jpeg")) center 60%/cover no-repeat,url(/art/hero-coast.svg) center/cover no-repeat,#0a0d14}
.hero.lux .eyebrow{color:#f3dfb6;text-shadow:0 1px 8px rgba(0,0,0,.6)}
@media (max-width:1000px){.hero.lux{background:linear-gradient(90deg,rgba(6,9,16,.9) 0%,rgba(8,13,26,.82) 60%,rgba(10,16,32,.55) 100%),linear-gradient(0deg,rgba(6,9,16,.7) 0%,rgba(6,9,16,0) 45%),image-set(url(/img/gen/hero-1280.webp) type("image/webp"),url(/img/gen/hero-1024.jpg) type("image/jpeg")) center 60%/cover no-repeat,url(/art/hero-coast.svg) center/cover no-repeat,#0a0d14}}
@media (max-width:760px){.hero.lux{background:linear-gradient(0deg,rgba(6,9,16,.92) 0%,rgba(6,9,16,.72) 60%,rgba(6,9,16,.6) 100%),image-set(url(/img/gen/hero-640.webp) type("image/webp"),url(/img/gen/hero-1024.jpg) type("image/jpeg")) 70% center/cover no-repeat,url(/art/hero-coast.svg) center/cover no-repeat,#0a0d14}}
/* v1.2 CLS (r002: footer + demo-user label shifted 0.21 at 1440 when async content/options arrived) — reserve space */
main{min-height:calc(100vh - 64px)}
@media (min-width:1181px){.top .role select{width:170px}}
img[data-gen]{height:auto} /* width/height attrs reserve 4:3 space; CSS aspect-ratio decides the crop */