/* Home — the evening: hero, decibels, window, suites, dusk-to-night, numbers, voices, retreat, FAQ, book */

/* ---------- Hero ---------- */
.hero { position: relative; height: 100svh; min-height: 600px; overflow: hidden; color: var(--star); background: var(--hero-ground); isolation: isolate; }
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__media > * { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__media .m-night { opacity: 0; }
.hero__media > * { transition: opacity 600ms var(--ease-in-out); }
html[data-time="night"] .hero__media .m-day { opacity: 0; }
html[data-time="night"] .hero__media .m-night { opacity: 1; }
.hero__media .m-mobile { display: none; }
.hero__scrim { position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(22, 14, 9, 0.66) 0%, rgba(22, 14, 9, 0.18) 42%, rgba(22, 14, 9, 0) 60%), linear-gradient(to bottom, rgba(22, 14, 9, 0.42) 0%, rgba(22, 14, 9, 0) 22%); }
html[data-time="night"] .hero__scrim { background: linear-gradient(to top, rgba(6, 9, 18, 0.74) 0%, rgba(6, 9, 18, 0.2) 48%, rgba(6, 9, 18, 0) 64%), linear-gradient(to bottom, rgba(6, 9, 18, 0.5) 0%, rgba(6, 9, 18, 0) 24%); }
.hero__word { position: absolute; inset-inline: 0; inset-block-end: -0.17em; z-index: 0; text-align: center; font-family: var(--serif); font-weight: 300; font-size: var(--fs-word); line-height: 0.8; letter-spacing: 0; color: var(--sand); mix-blend-mode: soft-light; pointer-events: none; user-select: none; }
.hero__word span { display: inline-block; }
.hero__copy { position: absolute; z-index: 1; inset-inline-start: var(--gutter); inset-block-end: clamp(140px, 27vh, 280px); max-width: 640px; display: grid; gap: var(--s6); }
.hero h1 { font-size: clamp(2.75rem, 1.4rem + 4.4vw, 5.75rem); line-height: 0.98; letter-spacing: -0.015em; }
.hero__sub { font-size: var(--fs-lg); line-height: 1.5; max-width: 34ch; color: rgba(243, 233, 216, 0.94); }
.hero__aside { position: absolute; z-index: 1; inset-inline-end: var(--gutter); inset-block-end: clamp(140px, 27vh, 280px); display: grid; gap: 6px; text-align: end; font-size: var(--fs-sm); color: rgba(243, 233, 216, 0.9); }
.hero__aside strong { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; color: var(--star); }
.hero__cue { position: absolute; z-index: 1; inset-block-end: 28px; inset-inline-start: 50%; translate: -50% 0; font-size: var(--fs-xs); letter-spacing: 0.06em; display: grid; justify-items: center; gap: 10px; color: rgba(243, 233, 216, 0.85); }
.hero__cue i { width: 1px; height: 40px; background: linear-gradient(to bottom, rgba(243, 233, 216, 0.9), transparent); }
@media (prefers-reduced-motion: no-preference) { .hero__cue i { animation: cue 2.4s var(--ease-in-out) infinite; transform-origin: top; } }
@keyframes cue { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }
@media (max-width: 860px) {
  .hero__media .m-desk { display: none; }
  .hero__media .m-mobile { display: block; }
  html[data-time="night"] .hero__media .m-mobile { opacity: 0; }
  .hero__word { font-size: 64vw; inset-block-end: -0.12em; }
  .hero__copy { inset-inline: var(--gutter); inset-block-end: 17vh; gap: var(--s4); }
  .hero__sub { font-size: 1rem; max-width: 30ch; }
  .hero__aside { display: none; }
  .hero__cue { display: none; }
}

/* ---------- Decibels ---------- */
.db { position: relative; height: 420vh; background: var(--bg); color: var(--fg); }
.db__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; display: grid; }
.db__reveal { position: absolute; inset: 0; background: url("../assets/img/terrace-2000.webp") center 60% / cover no-repeat; -webkit-mask-image: radial-gradient(circle var(--r, 0px) at var(--x, 62%) var(--y, 58%), #000 25%, transparent 100%); mask-image: radial-gradient(circle var(--r, 0px) at var(--x, 62%) var(--y, 58%), #000 25%, transparent 100%); }
.db__reveal::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to left, rgba(27, 21, 18, 0.82) 0%, rgba(27, 21, 18, 0.25) 55%, rgba(27, 21, 18, 0) 100%); }
[dir="ltr"] .db__reveal::after { background: linear-gradient(to right, rgba(27, 21, 18, 0.82) 0%, rgba(27, 21, 18, 0.25) 55%, rgba(27, 21, 18, 0) 100%); }
.db__meter { position: relative; z-index: 2; align-self: center; padding-inline: var(--gutter); max-width: 760px; }
.db__intro { font-size: var(--fs-lg); color: var(--fg-2); max-width: 30ch; margin-bottom: var(--s6); }
.db__num { display: flex; align-items: baseline; gap: 0.12em; direction: ltr; justify-content: flex-end; font-family: var(--serif); font-weight: 300; font-size: clamp(8rem, 3rem + 15vw, 19rem); line-height: 0.82; letter-spacing: -0.03em; }
[dir="ltr"] .db__num { justify-content: flex-start; }
.db__num small { font-family: var(--sans); font-size: 0.14em; letter-spacing: 0.08em; font-weight: 600; color: var(--accent); }
.db__where { position: relative; height: 6.5em; margin-top: var(--s6); }
.db__where p { position: absolute; inset: 0; visibility: hidden; font-size: var(--fs-lg); line-height: 1.45; max-width: 32ch; }
html:not(.js) .db__where { height: auto; display: grid; gap: var(--s3); }
html:not(.js) .db__where p { position: static; visibility: visible; }
.db__where b { display: block; font-weight: 600; color: var(--fg); }
.db__where span { color: var(--fg-2); }
.db__bars { position: absolute; z-index: 2; inset-inline-end: var(--gutter); top: 50%; translate: 0 -50%; height: 34vh; display: flex; align-items: center; gap: 6px; }
.db__bars i { display: block; width: 3px; height: 50%; border-radius: 2px; background: var(--star); opacity: 0.7; transform-origin: center; }
.db__close { position: absolute; z-index: 2; inset-inline: var(--gutter); inset-block-end: 6vh; display: flex; justify-content: space-between; align-items: end; gap: var(--s6); font-size: var(--fs-sm); color: var(--fg-2); }
.db__close strong { font-family: var(--serif); font-weight: 400; font-size: clamp(22px, 2vw, 30px); color: var(--fg); max-width: 26ch; display: block; line-height: 1.25; }
@media (max-width: 860px) {
  .db__meter { align-self: start; padding-top: 16vh; }
  .db__num { justify-content: flex-start; font-size: 36vw; }
  [dir="rtl"] .db__num { justify-content: flex-end; }
  .db__bars { top: auto; translate: 0 0; inset-block-end: calc(120px + 12vh); inset-inline: var(--gutter); height: 8vh; justify-content: space-between; }
  .db__close { flex-direction: column; align-items: start; inset-block-end: 104px; }
  .db__close > span { display: none; }
}

/* ---------- Window opening ---------- */
.win { position: relative; height: 210vh; background: var(--sand); color: var(--ink); }
.win__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; display: grid; place-items: center; }
.win__wall { position: absolute; inset: 0; background: var(--sand) url("../assets/img/detail-1400.webp") center / cover; }
.win__wall::after { content: ""; position: absolute; inset: 0; background: color-mix(in srgb, var(--sand) 86%, transparent); }
.win__title { position: absolute; z-index: 2; inset-inline: 0; top: 50%; translate: 0 -50%; display: flex; justify-content: center; gap: calc(min(24vw, 320px) + 7vw); font-family: var(--serif); font-weight: 300; font-size: clamp(2.5rem, 0.5rem + 5vw, 6rem); line-height: 1; letter-spacing: -0.015em; pointer-events: none; white-space: nowrap; }
.win__title span { display: inline-block; }
.win { --ww: min(24vw, 320px); }
/* the media is always full-viewport; the window is a clip (GPU), not a resized box */
.win__frame { position: absolute; inset: 0; z-index: 1; overflow: hidden; clip-path: inset(calc(50% - var(--ww) * 2 / 3) calc(50% - var(--ww) / 2)); }
.win__line { position: absolute; z-index: 1; top: 50%; left: 50%; width: var(--ww); aspect-ratio: 3 / 4; translate: -50% -50%; outline: 1px solid rgba(35, 28, 23, 0.4); outline-offset: 14px; pointer-events: none; }
.win__frame video, .win__frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.win__over { position: absolute; inset: 0; z-index: 3; display: grid; align-content: end; padding: var(--gutter); padding-bottom: 12vh; color: var(--star); opacity: 0; visibility: hidden; pointer-events: none; background: linear-gradient(to top, rgba(13, 10, 8, 0.6), rgba(13, 10, 8, 0) 55%); }
.win__over h2 { font-size: var(--fs-h1); line-height: 1; max-width: 14ch; }
.win__over p { margin-top: var(--s4); font-size: var(--fs-lg); max-width: 40ch; color: rgba(243, 233, 216, 0.92); }
.win__hint { position: absolute; z-index: 2; inset-block-end: 7vh; inset-inline: 0; text-align: center; font-size: var(--fs-sm); color: var(--ink-2); }
@media (max-width: 860px) {
  .win { --ww: 54vw; }
  .win__title { flex-direction: column; align-items: center; gap: 0; top: 16vh; translate: 0 0; font-size: 12vw; }
}

/* ---------- Suites ---------- */
.suites { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: var(--sand); color: var(--ink); }
.suites__pin { position: sticky; top: 0; height: 100svh; padding: 100px var(--gutter) 40px; display: grid; }
.suites__win { position: relative; overflow: hidden; outline: 1px solid rgba(35, 28, 23, 0.3); outline-offset: 14px; background: var(--stone); }
.suites__win img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity 1s var(--ease-out), transform 1.6s var(--ease-out); }
.suites__win img.is-on { opacity: 1; transform: none; }
.suites__count { position: absolute; inset-block-end: 18px; inset-inline-start: 20px; z-index: 2; font-size: var(--fs-xs); color: var(--star); background: rgba(13, 10, 8, 0.45); padding: 6px 12px; border-radius: var(--pill); backdrop-filter: blur(6px); }
.suites__list { padding: 18vh var(--gutter) 16vh calc(var(--gutter) * 0.6); }
.suites__head { margin-bottom: 12vh; display: grid; gap: var(--s6); }
.suites__head h2 { font-size: var(--fs-h2); line-height: 1; }
.suite { min-height: 82vh; display: flex; flex-direction: column; justify-content: center; gap: var(--s5); border-top: 1px solid var(--line); padding-block: var(--s16); }
.suite__units { font-weight: 600; color: var(--ink); }
.suite h3 { font-size: clamp(2.5rem, 1.6rem + 3vw, 4.75rem); line-height: 1; }
.suite p { max-width: 40ch; color: var(--ink-2); font-size: var(--fs-lg); line-height: 1.6; }
.suite ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.suite li { font-size: var(--fs-xs); padding: 6px 12px; border: 1px solid var(--line); border-radius: var(--pill); }
.suite__img { display: none; aspect-ratio: 4 / 3; overflow: hidden; }
.suite__img img { width: 100%; height: 100%; object-fit: cover; }
.suite .btn-row { margin-top: var(--s2); align-items: center; gap: var(--s6); }
@media (max-width: 860px) {
  .suites { grid-template-columns: minmax(0, 1fr); }
  .suites__pin { display: none; }
  .suites__list { padding: var(--s24) var(--gutter); }
  .suites__head { margin-bottom: var(--s12); }
  .suite { min-height: 0; padding-block: var(--s12); }
  .suite__img { display: block; margin-bottom: var(--s2); }
}

/* ---------- Dusk to night ---------- */
.dusk { position: relative; height: 560vh; background: var(--night); }
.dusk__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; color: var(--star); }
.dusk__sky { position: absolute; inset: 0; background: linear-gradient(to bottom, #415178 0%, #9a7b86 34%, #d9926a 58%, #f0c18c 70%); }
.dusk__sky--night { background: linear-gradient(to bottom, #04060d 0%, #0b1020 50%, #1a2340 74%); opacity: 0; }
.dusk__stars { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; }
.dusk__sun { position: absolute; inset-inline-start: 50%; top: 40%; width: clamp(120px, 16vw, 240px); aspect-ratio: 1; margin-inline-start: calc(clamp(120px, 16vw, 240px) / -2); border-radius: 50%; background: radial-gradient(circle, #fff1d6 0%, #ffd29a 30%, #f5a462 54%, rgba(245, 164, 98, 0) 71%); }
[dir="rtl"] .dusk__sun { margin-inline-start: 0; margin-inline-end: calc(clamp(120px, 16vw, 240px) / -2); inset-inline-start: auto; inset-inline-end: 50%; }
.dusk__rim { position: absolute; inset-inline: 0; inset-block-end: 0; height: 40%; }
.dusk__rim svg { width: 100%; height: 100%; }
.dusk__copy { position: absolute; z-index: 3; inset-inline-start: var(--gutter); top: 50%; translate: 0 -55%; width: min(560px, 44vw); }
.dusk__label { font-size: var(--fs-sm); color: rgba(243, 233, 216, 0.9); margin-bottom: var(--s3); }
.dusk__time { font-family: var(--serif); font-weight: 300; font-size: clamp(6rem, 2rem + 10vw, 12rem); line-height: 0.86; letter-spacing: -0.02em; direction: ltr; text-align: end; }
[dir="ltr"] .dusk__time { text-align: start; }
.dusk__beats { position: relative; height: 11em; margin-top: var(--s8); }
.dusk__beat { position: absolute; inset: 0; opacity: 0; visibility: hidden; }
html:not(.js) .dusk__beats { height: auto; display: grid; gap: var(--s6); }
html:not(.js) .dusk__beat { position: static; opacity: 1; visibility: visible; }
.dusk__beat h3 { font-size: clamp(28px, 2.6vw, 42px); line-height: 1.1; margin-bottom: var(--s3); }
.dusk__beat p { font-size: var(--fs-lg); line-height: 1.55; color: rgba(243, 233, 216, 0.92); max-width: 36ch; }
.dusk__photos { position: absolute; z-index: 2; inset-inline-end: var(--gutter); top: 50%; translate: 0 -54%; width: min(30vw, 420px); aspect-ratio: 4 / 5; }
.dusk__photos figure { position: absolute; inset: 0; overflow: hidden; opacity: 0; clip-path: inset(100% 0 0 0); outline: 1px solid rgba(243, 233, 216, 0.35); outline-offset: 12px; }
.dusk__photos img { width: 100%; height: 100%; object-fit: cover; }
.dusk__photos figcaption { position: absolute; inset-block-end: 0; inset-inline: 0; padding: 14px 16px; font-size: var(--fs-xs); background: linear-gradient(to top, rgba(8, 8, 12, 0.7), transparent); }
.dusk__ticks { position: absolute; z-index: 3; inset-inline: var(--gutter); inset-block-end: 4vh; display: flex; justify-content: space-between; font-size: var(--fs-xs); direction: ltr; }
.dusk__ticks span { opacity: 0.45; transition: opacity 400ms var(--ease-out); }
.dusk__ticks span.is-on { opacity: 1; }
.dusk__bar { position: absolute; z-index: 3; inset-inline: var(--gutter); inset-block-end: calc(4vh + 26px); height: 1px; background: rgba(243, 233, 216, 0.25); }
.dusk__bar i { position: absolute; inset-block: 0; left: 0; width: 100%; background: var(--star); transform-origin: left; transform: scaleX(0); }
@media (max-width: 860px) {
  .dusk__copy { top: 12vh; translate: 0 0; width: auto; inset-inline: var(--gutter); }
  .dusk__time { text-align: start; font-size: 26vw; }
  [dir="rtl"] .dusk__time { text-align: end; }
  .dusk__beats { height: 12em; margin-top: var(--s4); }
  .dusk__photos { display: none; }
  .dusk__sun { top: 52%; }
}

/* ---------- Numbers ---------- */
.nums { background: var(--night); color: var(--star); padding-block: var(--section); }
.nums__head { margin-bottom: clamp(64px, 10vh, 120px); display: grid; gap: var(--s6); max-width: 760px; }
.nums__head h2 { font-size: var(--fs-h2); line-height: 1.02; }
.nums__row { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--s10); align-items: end; padding-block: clamp(28px, 5vh, 56px); border-top: 1px solid rgba(243, 233, 216, 0.14); }
.nums__row:nth-child(even) .nums__fig { order: 2; text-align: end; }
.nums__fig { font-family: var(--serif); font-weight: 300; font-size: clamp(5rem, 2rem + 9vw, 12rem); line-height: 0.82; letter-spacing: -0.03em; direction: ltr; text-align: start; }
[dir="rtl"] .nums__fig { text-align: end; }
[dir="rtl"] .nums__row:nth-child(even) .nums__fig { text-align: start; }
.nums__fig small { font-family: var(--sans); font-size: 0.16em; font-weight: 600; letter-spacing: 0.04em; color: var(--glow); margin-inline: 0.2em; }
.nums__txt h3 { font-size: clamp(24px, 2vw, 32px); line-height: 1.2; margin-bottom: var(--s2); }
.nums__txt p { color: var(--star-2); max-width: 40ch; }
@media (max-width: 860px) {
  .nums__row { grid-template-columns: minmax(0, 1fr); gap: var(--s4); }
  .nums__row:nth-child(even) .nums__fig { order: 0; }
  .nums__fig, [dir="rtl"] .nums__fig, [dir="rtl"] .nums__row:nth-child(even) .nums__fig { text-align: start; font-size: 26vw; }
  [dir="rtl"] .nums__fig, [dir="rtl"] .nums__row:nth-child(even) .nums__fig { text-align: right; }
}

/* ---------- Voices ---------- */
.voices { background: var(--night); color: var(--star); padding-block: var(--section); border-top: 1px solid rgba(243, 233, 216, 0.08); }
.voices__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 112px); align-items: center; }
.voices__img { aspect-ratio: 4 / 5; }
.voices__q { position: relative; min-height: 22em; }
.voice { position: absolute; inset: 0; display: grid; align-content: center; gap: var(--s8); opacity: 0; filter: blur(2px); visibility: hidden; transition: opacity 700ms var(--ease-out), filter 700ms var(--ease-out), visibility 0s linear 700ms; }
.voice.is-on { opacity: 1; filter: none; visibility: visible; transition: opacity 700ms var(--ease-out), filter 700ms var(--ease-out), visibility 0s; }
.voice blockquote p { font-family: var(--serif); font-weight: 300; font-size: clamp(22px, 1rem + 1.2vw, 36px); line-height: 1.22; }
.voice figcaption { font-size: var(--fs-sm); color: var(--star-2); }
.voice figcaption strong { color: var(--star); font-weight: 600; }
.voices__nav { display: flex; align-items: center; gap: var(--s4); margin-top: var(--s8); }
.voices__nav button { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(243, 233, 216, 0.4); display: grid; place-items: center; transition: background-color var(--dur-ui) var(--ease-out), transform var(--dur-press) var(--ease-out); }
.voices__nav button:active { transform: scale(0.95); }
.voices__nav svg { width: 18px; height: 18px; }
[dir="rtl"] [data-voice-prev] svg, [dir="ltr"] [data-voice-next] svg { transform: scaleX(-1); }
@media (hover: hover) and (pointer: fine) { .voices__nav button:hover { background: rgba(243, 233, 216, 0.1); } }
.voices__count { font-size: var(--fs-sm); color: var(--star-2); direction: ltr; }
.voices__note { margin-top: var(--s4); font-size: var(--fs-xs); color: var(--star-2); }
@media (max-width: 860px) { .voices__grid { grid-template-columns: minmax(0, 1fr); } .voices__img { aspect-ratio: 16 / 11; } .voices__q { min-height: 26em; } }

/* ---------- Retreat teaser ---------- */
.retreat { position: relative; min-height: 110svh; display: grid; align-items: end; color: var(--star); overflow: hidden; isolation: isolate; }
.retreat__media { position: absolute; inset: -10% 0; z-index: -1; }
.retreat__media img { width: 100%; height: 100%; object-fit: cover; }
.retreat__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(8, 10, 18, 0.86) 0%, rgba(8, 10, 18, 0.28) 55%, rgba(8, 10, 18, 0.4) 100%); }
.retreat__in { padding-block: var(--section); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--s10); align-items: end; }
.retreat h2 { font-size: var(--fs-display); line-height: 0.9; letter-spacing: -0.02em; }
.retreat__side { display: grid; gap: var(--s6); }
.retreat__side p { color: rgba(243, 233, 216, 0.92); }
@media (max-width: 860px) { .retreat__in { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Book ---------- */
.book { background: var(--night-2); color: var(--star); }
.book__in { display: grid; gap: var(--s10); }
.book h2 { font-size: var(--fs-h1); line-height: 1; max-width: 14ch; }
.book__alt { display: flex; flex-wrap: wrap; gap: var(--s4) var(--s10); align-items: center; color: var(--star-2); font-size: var(--fs-sm); }
.book__alt a { color: var(--star); }

/* ---------- Reduced motion: scenes collapse to static panels ---------- */
@media (prefers-reduced-motion: reduce) {
  .db, .win, .dusk { height: auto; }
  .db__stage, .win__stage, .dusk__stage { position: relative; min-height: 100svh; height: auto; }
  .db__reveal { -webkit-mask-image: none; mask-image: none; opacity: 0.55; }
  .db__where { height: auto; display: grid; gap: var(--s3); }
  .db__where p { position: static; visibility: visible; }
  .db__where p:not(:last-child) { display: none; }
  .win__frame { clip-path: none; }
  .win__line { display: none; }
  .win__title { display: none; }
  .win__over { opacity: 1; visibility: visible; }
  .win__hint { display: none; }
  .dusk__sky--night, .dusk__stars { opacity: 1; }
  .dusk__sun { display: none; }
  .dusk__beats { height: auto; display: grid; gap: var(--s8); }
  .dusk__beat { position: static; opacity: 1; visibility: visible; }
  .dusk__copy { position: relative; top: auto; translate: none; padding-block: 120px 160px; width: auto; max-width: 640px; }
  .dusk__photos, .dusk__ticks, .dusk__bar { display: none; }
}

/* ---------- Critique fixes: availability note, dusk booking strip, reassurance ---------- */
.cta-note { font-size: var(--fs-sm); color: rgba(243, 233, 216, 0.92); }
.dusk__book { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 8px; align-items: end; margin-top: var(--s6); padding: 10px; border-radius: 6px; background: rgba(8, 11, 22, 0.55); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); max-width: 560px; } /* taste-skill-ignore: one glass surface over the night sky, it carries the form */
.dusk__book label { display: grid; gap: 2px; font-size: var(--fs-xs); color: var(--star-2); padding: 6px 10px; }
.dusk__book input { border: 0; background: transparent; color: var(--star); font-size: 1rem; min-height: 32px; color-scheme: dark; }
.dusk__book .btn { --b-bg: var(--glow); --b-fg: var(--ink); min-height: 52px; }
.dusk__book .quick__sum { grid-column: 1 / -1; padding: 2px 10px 4px; }
div.dusk__book { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s4); background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; padding: 0; }
.js .dusk__book { opacity: 0; visibility: hidden; }
.quick__sum { grid-column: 1 / -1; font-size: var(--fs-sm); color: var(--fg-2); }
.quick .quick__sum { background: var(--surface); padding: 12px 18px; }
.quick__sum.is-warn { color: var(--glow); font-weight: 600; }
.assure { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s3) var(--s8); font-size: var(--fs-base); color: var(--star); }
.assure li { display: inline-flex; align-items: center; gap: 10px; }
.assure svg { width: 18px; height: 18px; color: var(--glow); flex: none; }
.voice blockquote p { line-height: 1.32; }
.db__close strong { line-height: 1.35; }
@media (max-width: 860px) { .dusk__book { grid-template-columns: 1fr 1fr; } .dusk__book .btn { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: reduce) { .js .dusk__book { opacity: 1; visibility: visible; } }
.dusk__book .quick__sum { color: var(--star-2); }
.dusk__book .quick__sum.is-warn { color: var(--glow); }
.book .quick { background: var(--line); }
.book .quick label, .book .quick .quick__sum { background: color-mix(in srgb, var(--night-2) 70%, var(--night)); }

/* ---------- Bolder: the numbers become a peak (system's own giant serif numerals) ---------- */
.nums { padding-block: clamp(120px, 18vh, 220px); overflow: clip; }
.nums__row { padding-block: clamp(40px, 9vh, 112px); align-items: center; }
.nums__fig { font-size: clamp(6.5rem, 1.5rem + 15vw, 18rem); line-height: 0.78; }
.nums__fig small { font-size: 0.12em; }
.nums__txt h3 { font-size: clamp(26px, 2.4vw, 40px); }
@media (max-width: 860px) { .nums__fig, [dir="rtl"] .nums__fig, [dir="rtl"] .nums__row:nth-child(even) .nums__fig { font-size: 34vw; } }
.dusk__skynote { position: absolute; z-index: 3; inset-inline-end: var(--gutter); inset-block-end: calc(4vh + 44px); max-width: 46ch; font-size: var(--fs-xs); color: rgba(243, 233, 216, 0.9); text-align: end; }
.js .dusk__skynote { opacity: 0; }
@media (max-width: 860px) { .dusk__skynote { inset-inline-start: var(--gutter); text-align: start; inset-block-end: calc(4vh + 40px); } }
@media (prefers-reduced-motion: reduce) { .js .dusk__skynote { opacity: 1; } .dusk__skynote { position: static; padding-inline: var(--gutter); padding-bottom: var(--s10); text-align: start; } }
/* a night scrim behind the text column so the drawn sky never crosses the words */
.dusk__copy::before { content: ""; position: absolute; z-index: -1; inset: -18vh -12vw -14vh -10vw; background: radial-gradient(closest-side, rgba(5, 7, 14, 0.82), rgba(5, 7, 14, 0.55) 55%, rgba(5, 7, 14, 0) 100%); pointer-events: none; opacity: var(--scrim, 0); }

.book__alt a { display: inline-flex; align-items: center; min-height: 44px; }