:root {
  --lux-ground: #F8F1FB;
  --lux-ink: #22272F;
  --lux-olive: #75752F;
  --lux-rose: #E2C6C5;
  --lux-surface: #FBFAFC;
  --lux-display: 'Italiana', Georgia, serif;
  --lux-reading: 'Quattrocento Sans', 'Trebuchet MS', sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 32px; }
body { margin: 0; color: var(--lux-ink); background: var(--lux-ground); font: 18px/1.65 var(--lux-reading); }
img { max-width: 100%; }
button, input { font: inherit; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color 160ms ease, text-decoration-color 160ms ease, transform 160ms ease; }
a:hover { text-decoration-thickness: 2px; text-underline-offset: .26em; }
a:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--lux-ink); outline-offset: 6px; text-decoration-thickness: 2px; }
::selection { color: var(--lux-ink); background: var(--lux-rose); }
h1, h2, h3, p, figure { margin: 0; }
h1, h2, h3 { font-family: var(--lux-display); font-weight: 400; }
h1 { font-size: clamp(42px, 4.8vw, 72px); line-height: 1.06; text-wrap: balance; }
h2 { font-size: clamp(34px, 3.3vw, 48px); line-height: 1.12; margin-bottom: 26px; text-wrap: balance; }
p + p { margin-top: 24px; }
svg { vertical-align: middle; }
.lp-line-icon, .lp-line-icon svg { display: inline-block; width: 24px; height: 24px; vertical-align: middle; flex-shrink: 0; }
.lp-skip { position: absolute; z-index: 20; top: 12px; left: 20px; padding: 8px 14px; background: var(--lux-surface); transform: translateY(-180%); }
.lp-skip:focus { transform: none; }
.lp-inventory { height: 140px; position: relative; max-width: 1800px; margin: auto; padding: 0 36px; }
.lp-wordmark { position: absolute; bottom: 2px; left: 32px; font: 400 clamp(116px, 12.05vw, 180px)/.81 var(--lux-display); letter-spacing: -.055em; text-decoration: none; white-space: nowrap; }
.lp-wordmark:hover { color: var(--lux-olive); }
.lp-wordmark span + span::before { content: ' '; }
.lp-inventory-nav { position: absolute; z-index: 2; top: 9px; right: 44px; display: flex; flex-direction: column; font-size: 16px; line-height: 1.35; }
.lp-inventory-nav a { display: flex; align-items: center; gap: 9px; text-decoration: none; padding: 2px 0; }
.lp-inventory-nav a:hover { transform: translateX(-4px); }
.lp-inventory-nav a:hover, .lp-inventory-nav a[aria-current] { text-decoration: underline; text-decoration-color: var(--lux-olive); }
.lp-inventory-nav .lp-line-icon, .lp-inventory-nav svg { width: 15px; height: 15px; }
/* The beach stays a photograph. Only the reading plane is opaque. */
.lp-opening { isolation: isolate; position: relative; background: var(--lux-ground); }
.lp-opening-canvas { max-width: 1800px; min-height: 702px; position: relative; margin: auto; padding: 40px 0 60px; }
.lp-hero-backdrop { position: absolute; z-index: -2; inset: 0; }
.lp-hero-backdrop img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 53%; }
.lp-resting-plane { position: relative; width: min(47%, 680px); margin-left: 5.6%; padding: 34px 40px 36px; background: var(--lux-ground); box-shadow: 12px 14px 0 rgba(226, 198, 197, .85), 0 20px 50px rgba(34, 39, 47, .08); }
.lp-opening-title h1 { font-size: clamp(45px, 4.1vw, 62px); line-height: 1.03; letter-spacing: -.025em; }
.lp-greeting { margin-top: 20px; }
.lp-greeting > p:first-child { font-size: 18px; line-height: 1.42; max-width: 460px; }
.lp-prescription { margin-top: 23px; }
.lp-invitation { display: block; width: fit-content; max-width: 540px; font: italic 400 clamp(29px, 2.45vw, 36px)/1.13 var(--lux-display); text-decoration-color: var(--lux-olive); text-decoration-thickness: 1.5px; }
.lp-invitation:hover { color: #55551E; text-decoration-thickness: 2.5px; }
.lp-external { display: inline-block; margin-left: 4px; }
.lp-external .lp-line-icon, .lp-external svg { width: 25px; height: 25px; }
.lp-qualification { display: block; margin-top: 14px; font-size: 16px; line-height: 1.4; }
.lp-kite-main { position: absolute; right: 3.8%; bottom: -44px; width: 330px; height: 330px; z-index: 1; transform: rotate(3deg); box-shadow: 16px 18px 0 var(--lux-rose), 0 22px 38px rgba(34, 39, 47, .13); animation: lp-unfold 850ms ease-out; }
.lp-kite-main img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-detail-selvedge { position: absolute; top: 26px; left: 55.8%; width: 94px; height: 94px; object-fit: cover; transform: rotate(-5deg); box-shadow: -8px 8px 0 var(--lux-surface); }
.lp-detail-tail { position: absolute; top: 38px; right: 3.8%; width: 88px; height: 88px; object-fit: cover; }
.lp-tail-line { position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 390px; object-fit: fill; pointer-events: none; }
.lp-scene-note { position: absolute; bottom: 44px; right: 29%; padding: 10px 14px; background: var(--lux-surface); font-size: 16px; line-height: 1.3; transform: rotate(-3deg); }
/* Three text islands and one large, offset photograph, then the continuous essay. */
.lp-first-rooms { max-width: 1600px; margin: 170px auto 170px; padding: 0 64px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 32px; }
.lp-first-rooms section { position: relative; }
.lp-island-one { grid-column: 2 / 7; grid-row: 1; }
.lp-island-two { grid-column: 2 / 7; grid-row: 2; margin-top: 160px; }
.lp-island-three { grid-column: 8 / 13; grid-row: 3; margin-top: 112px; }
.lp-room-number { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; color: var(--lux-olive); font: 400 116px/.83 var(--lux-display); }
.lp-first-rooms .lp-room-number { position: absolute; left: -132px; top: -19px; font-size: 104px; }
.lp-room-number .lp-line-icon, .lp-room-number svg { width: 25px; height: 25px; }
.lp-sand-study { position: relative; grid-column: 8 / 13; grid-row: 1 / 3; margin-top: 145px; align-self: center; transform: translateX(12px) rotate(-2deg); }
.lp-sand-study img { display: block; width: 100%; height: auto; aspect-ratio: 30 / 34; object-fit: cover; box-shadow: 22px 24px 0 var(--lux-rose); }
.lp-sand-study figcaption { position: relative; max-width: 250px; margin: -34px 0 0 -40px; padding: 20px 24px; background: var(--lux-surface); box-shadow: 7px 8px 0 rgba(117, 117, 47, .16); font-size: 16px; line-height: 1.45; transform: rotate(2deg); }
.lp-continuous-essay { position: relative; padding: 106px max(64px, calc((100vw - 1400px)/2)) 115px; background: var(--lux-rose); }
.lp-continuous-essay h2 { max-width: 1030px; margin: 0 0 0 6%; font-size: clamp(52px, 6.3vw, 90px); line-height: 1.03; letter-spacing: -.025em; }
.lp-essay-mark { display: block; margin: -145px 0 52px 3%; width: 88px; padding: 18px; color: var(--lux-ink); background: var(--lux-surface); box-shadow: 10px 10px 0 var(--lux-olive); transform: rotate(-5deg); }
.lp-essay-mark .lp-line-icon, .lp-essay-mark svg { width: 52px; height: 52px; }
.lp-essay-prose { max-width: 680px; margin: 48px 7% 0 auto; }
.lp-essay-prose p + p { margin-top: 40px; font-size: 22px; line-height: 1.5; }
.lp-breadcrumb { max-width: 1550px; margin: 38px auto 0; padding: 0 48px; font-size: 16px; }
.lp-breadcrumb ol { margin: 0; padding: 0; list-style: none; display: flex; gap: 13px; flex-wrap: wrap; }
.lp-breadcrumb li + li::before { content: '/'; margin-right: 13px; }
.lp-inner-scene { position: relative; isolation: isolate; margin: 32px 0 115px; }
.lp-scene-photo { padding: 42px 0 56px; }
.lp-inner-opening { max-width: 1500px; margin: 60px auto 76px; padding: 0 48px; }
.lp-inner-opening h1 { max-width: 950px; margin-left: 19%; }
.lp-inner-lead { max-width: 610px; margin: 32px 6% 0 auto; font-size: 21px; line-height: 1.5; }
.lp-scene-photo .lp-inner-opening { position: relative; width: min(61%, 870px); margin: 0 0 0 7%; padding: 38px 44px 42px; background: var(--lux-ground); box-shadow: 13px 14px 0 var(--lux-rose); }
.lp-scene-photo h1 { margin: 0; font-size: clamp(42px, 4.2vw, 60px); }
.lp-scene-photo .lp-inner-lead { margin: 26px 0 0; max-width: 650px; font-size: 20px; }
.lp-photo-band { position: absolute; inset: 0; z-index: -1; }
.lp-photo-band img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-photo-band figcaption { position: absolute; bottom: -25px; right: 5%; max-width: 310px; padding: 17px 22px; background: var(--lux-surface); box-shadow: 8px 9px 0 var(--lux-rose); font-size: 16px; line-height: 1.4; transform: rotate(-2deg); }
.lp-reading-spaces { max-width: 1420px; margin: 0 auto 150px; padding: 0 64px; }
.lp-reading-island { position: relative; max-width: 660px; margin: 118px 0 0 14%; }
.lp-reading-island:first-child { margin-top: 0; }
.lp-reading-island:nth-child(2) { margin-left: auto; margin-right: 4%; }
.lp-reading-island:nth-child(3) { margin-left: 6%; }
.lp-reading-island:nth-child(4) { margin-left: 30%; }
.lp-reading-island:nth-child(5) { margin-left: auto; margin-right: 4%; }
.lp-reading-island .lp-room-number { position: absolute; left: -116px; top: -8px; font-size: 85px; }
.lp-compare-scroll { margin: 38px 0; max-width: 100%; overflow-x: auto; border-top: 3px solid var(--lux-olive); background: var(--lux-surface); box-shadow: 10px 12px 0 var(--lux-rose); }
.lp-compare-scroll table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.5; table-layout: fixed; }
.lp-compare-scroll th { text-align: left; font-weight: 700; padding: 20px 12px; background: var(--lux-rose); }
.lp-compare-scroll td { padding: 22px 12px; vertical-align: top; border-bottom: 1px solid var(--lux-rose); overflow-wrap: anywhere; }
.lp-reading-spaces.lp-sources .lp-reading-island { max-width: 780px; }
.lp-sources .lp-reading-island p + p { margin-top: 36px; }
.lp-sources .lp-reading-island p > a:first-child { font-weight: 700; }
.lp-bottom { padding: 80px 48px 28px; background: var(--lux-surface); }
.lp-bottom-layout { display: flex; justify-content: space-between; gap: 60px; max-width: 1400px; margin: auto; }
.lp-guide-note { max-width: 480px; }
.lp-guide-note p:first-child { font: 400 48px/1.08 var(--lux-display); margin-bottom: 26px; }
.lp-bottom-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 54px; align-content: start; font-size: 18px; }
.lp-bottom-nav a { display: block; text-decoration: none; }
.lp-bottom-nav a:hover { text-decoration: underline; transform: translateX(4px); }
.lp-copyright { max-width: 1400px; margin: 56px auto 0; font-size: 16px; }
.lp-missing { max-width: 800px; margin: 100px auto 150px; padding: 0 30px; }
.lp-missing p { margin-top: 32px; }
@keyframes lp-unfold { from { transform: translateY(12px) rotate(1deg); } to { transform: translateY(0) rotate(3deg); } }
@media (min-width: 1801px) {
  .lp-opening { background: url('coastal-room.webp') center 53%/cover; }
}
@media (min-width: 701px) and (max-width: 1100px) {
  .lp-wordmark { font-size: 11.8vw; }
  .lp-inventory { height: 125px; }
  .lp-inventory-nav { right: 24px; }
  .lp-resting-plane { width: 59%; margin-left: 4%; padding: 30px; }
  .lp-opening-title h1 { font-size: 43px; }
  .lp-opening-canvas { min-height: 760px; }
  .lp-kite-main { width: 240px; height: 240px; right: 4%; bottom: -34px; }
  .lp-detail-selvedge { left: 67%; width: 72px; height: 72px; }
  .lp-detail-tail { width: 58px; height: 58px; }
  .lp-scene-note { bottom: 240px; right: 4%; }
  .lp-first-rooms { padding: 0 44px; column-gap: 28px; }
  .lp-island-one, .lp-island-two { grid-column: 1 / 7; }
  .lp-island-three { grid-column: 7 / 13; }
  .lp-first-rooms .lp-room-number { position: static; margin-bottom: 28px; flex-direction: row; align-items: center; gap: 24px; font-size: 78px; }
  .lp-sand-study figcaption { margin-left: -12px; }
  .lp-reading-island:nth-child(n) { margin-left: 100px; margin-right: 0; }
  .lp-scene-photo .lp-inner-opening { width: 72%; margin-left: 4%; padding: 32px; }
  .lp-inner-opening h1 { margin-left: 12%; }
}
@media (max-width: 700px) {
  body { font-size: 18px; line-height: 1.6; }
  h1 { font-size: 36px; }
  h2 { font-size: 33px; margin-bottom: 24px; }
  .lp-inventory { height: 140px; padding: 0 22px; }
  .lp-wordmark { left: 22px; bottom: 10px; font-size: 65px; line-height: .83; letter-spacing: -.055em; }
  .lp-wordmark span { display: block; }
  .lp-wordmark span + span::before { content: none; }
  .lp-inventory-nav { top: 43px; right: 24px; font-size: 16px; line-height: 1.2; }
  .lp-inventory-nav a { padding: 2px 0; }
  .lp-inventory-nav .lp-line-icon, .lp-inventory-nav svg { width: 13px; height: 13px; }
  .lp-opening-canvas { min-height: 0; padding: 0; display: grid; grid-template-columns: 1fr 100px; column-gap: 24px; }
  .lp-resting-plane { grid-column: 1 / -1; position: relative; width: 100%; margin: 0; padding: 22px 24px 28px; background: var(--lux-ground); box-shadow: none; }
  .lp-opening-title h1 { font-size: 28px; line-height: 1.1; max-width: 350px; letter-spacing: 0; }
  .lp-greeting { margin-top: 14px; }
  .lp-greeting > p:first-child { font-size: 17px; line-height: 1.36; }
  .lp-prescription { margin-top: 17px; }
  .lp-invitation { font-size: 27px; line-height: 1.13; }
  .lp-external .lp-line-icon, .lp-external svg { width: 23px; height: 23px; }
  .lp-qualification { font-size: 16px; line-height: 1.32; margin-top: 12px; }
  .lp-hero-backdrop { position: relative; grid-column: 1 / -1; grid-row: 2; height: 228px; z-index: -1; }
  .lp-hero-backdrop img { object-position: 68% center; }
  .lp-kite-main { position: relative; grid-column: 2; grid-row: 2; width: 100px; height: 100px; right: auto; bottom: auto; margin: 24px 20px 0 -20px; box-shadow: 7px 8px 0 var(--lux-rose); animation: none; }
  .lp-detail-selvedge { position: relative; grid-column: 1; grid-row: 2; top: auto; left: auto; width: 36px; height: 36px; margin: 22px 0 0 24px; box-shadow: -4px 4px 0 var(--lux-surface); }
  .lp-detail-tail, .lp-tail-line { display: none; }
  .lp-scene-note { position: absolute; right: 22px; bottom: -17px; padding: 12px 16px; font-size: 16px; }
  .lp-scene-note br { display: none; }
  .lp-first-rooms { display: flex; flex-direction: column; padding: 0 24px; margin: 82px 0 100px; gap: 80px; }
  .lp-island-one { order: 0; }
  .lp-island-two { order: 1; margin-top: 0; }
  .lp-island-three { order: 2; margin-top: 0; }
  .lp-first-rooms .lp-room-number { position: static; margin-bottom: 24px; flex-direction: row; align-items: center; gap: 20px; font-size: 75px; }
  .lp-sand-study { order: 3; margin: 0 10px 18px 0; transform: rotate(-2deg); }
  .lp-sand-study img { aspect-ratio: 30 / 27; box-shadow: 12px 14px 0 var(--lux-rose); }
  .lp-sand-study figcaption { max-width: 240px; margin: -22px 0 0 6px; padding: 16px 20px; }
  .lp-continuous-essay { padding: 64px 24px 66px; }
  .lp-continuous-essay h2 { font-size: 45px; margin-left: 0; }
  .lp-essay-mark { margin: -94px 0 38px 4px; width: 66px; padding: 14px; box-shadow: 7px 8px 0 var(--lux-olive); }
  .lp-essay-mark .lp-line-icon, .lp-essay-mark svg { width: 38px; height: 38px; }
  .lp-essay-prose { margin: 30px 0 0; }
  .lp-essay-prose p + p { font-size: 20px; margin-top: 30px; }
  .lp-breadcrumb { margin-top: 25px; padding: 0 24px; }
  .lp-inner-scene { margin-top: 26px; margin-bottom: 70px; }
  .lp-scene-photo { padding: 0 0 164px; }
  .lp-inner-opening, .lp-scene-photo .lp-inner-opening { position: relative; width: calc(100% - 32px); margin: 0; padding: 24px 24px 28px; background: var(--lux-ground); box-shadow: 8px 10px 0 var(--lux-rose); }
  .lp-scene-plain .lp-inner-opening { box-shadow: none; width: 100%; padding-top: 12px; }
  .lp-inner-opening h1, .lp-scene-photo h1 { margin: 0; font-size: 36px; }
  .lp-inner-lead, .lp-scene-photo .lp-inner-lead { margin: 23px 0 0; font-size: 19px; }
  .lp-photo-band figcaption { max-width: 260px; right: 20px; bottom: -24px; padding: 13px 17px; }
  .lp-reading-spaces { padding: 0 24px; margin-bottom: 80px; }
  .lp-reading-island:nth-child(n) { margin: 76px 0 0; max-width: none; }
  .lp-reading-island:first-child { margin-top: 0; }
  .lp-reading-island .lp-room-number { position: static; margin-bottom: 24px; flex-direction: row; align-items: center; gap: 20px; font-size: 64px; }
  .lp-compare-scroll { box-shadow: 7px 8px 0 var(--lux-rose); }
  .lp-compare-scroll th, .lp-compare-scroll td { padding: 16px 7px; }
  .lp-compare-scroll table { font-size: 16px; }
  .lp-bottom { padding: 48px 24px 24px; }
  .lp-bottom-layout { flex-direction: column; gap: 40px; }
  .lp-guide-note p:first-child { font-size: 40px; }
  .lp-bottom-nav { gap: 12px 30px; }
  .lp-copyright { margin-top: 38px; }
  .lp-missing { margin: 60px 0 80px; padding: 0 24px; }
}
@media (max-width: 359px) {
  .lp-wordmark { left: 18px; font-size: 57px; }
  .lp-inventory-nav { right: 18px; }
  .lp-resting-plane { padding-left: 20px; padding-right: 20px; }
  .lp-invitation { font-size: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
