/* FDevia's Balloon Decor — LuxWeb preview, v2. Her real setups lead: a full-bleed slideshow of her photos, then one immersive
   scene per setup, framed in the shape of that setup; the quote tools sit at the bottom. Palette from her sequin walls, chrome
   gold and blush garlands; serif wordmark after her own logo; gold hairlines instead of cards. */
:root {
  --plum: #2a1240; --plum-2: #1c0b2c; --plum-3: #3a1a55;
  --fuchsia: #d13a80; --fuchsia-d: #a3245f;
  --gold: #d9b45d; --gold-l: #f0d79a; --gold-d: #9c7a2a;
  --frost: #fdf8fa; --frost-2: #f7edf2; --cream: #f7f0e6; --lilac-bg: #efe7f8; --pink-bg: #fbe4ec;
  --ink: #241433; --mute: #6a5c78; --line: rgba(42, 18, 64, .14);
  --serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --hdr: 64px;
  --spring: cubic-bezier(.34, 1.56, .64, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--hdr) + 10px); scroll-behavior: smooth; }
body { margin: 0; background: var(--frost); color: var(--ink); font: 400 1rem/1.6 var(--sans); overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
figure { margin: 0; }
[hidden] { display: none !important; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.08; margin: 0 0 .45em; letter-spacing: -.005em; }
h1 em, h2 em, h3 em { font-style: italic; }
h2 { font-size: clamp(1.9rem, 4.4vw, 2.9rem); max-width: 16ch; }
h2 em { color: var(--fuchsia); }
.h2--s { font-size: clamp(1.6rem, 3.4vw, 2.2rem); }
h3 { font-size: 1.3rem; }
p { margin: 0 0 1em; }
.wrap { width: min(1120px, 100% - 40px); margin-inline: auto; }
.eyebrow { font: 500 .7rem/1.3 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--fuchsia); margin: 0 0 1.1em; display: flex; align-items: center; gap: 12px; }
.eyebrow::before { content: ''; width: 28px; height: 1px; background: currentColor; opacity: .7; }
.eyebrow--gold { color: var(--gold); }
.eyebrow--light { color: var(--gold-l); }
.lede { font-size: 1.02rem; max-width: 58ch; color: var(--mute); }
.small { font-size: .84rem; color: var(--mute); }
.nowrap { white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: #fff; padding: .6em 1em; z-index: 100; border-radius: 8px; }
.skip:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
section { padding: 64px 0; }
@media (min-width: 900px) { section { padding: 88px 0; } }

/* ready mode / owner view */
.todo { display: inline-block; font: 600 .64rem/1.35 var(--sans); letter-spacing: .02em; text-transform: uppercase; color: #8a4b00; background: #fff1cf; border: 1px dashed #d08a10; border-radius: 6px; padding: .2em .5em; margin: .15em 0; vertical-align: middle; white-space: normal; }
html.ready .todo, html.ready .edit-only { display: none !important; }
.edit-bar { position: sticky; top: 0; z-index: 60; background: #fff1cf; color: #6b3d00; font: 600 .8rem/1.4 var(--sans); padding: .55em 16px; text-align: center; border-bottom: 1px dashed #d08a10; }
html:not(.ready) .edit-bar + .hdr { top: 36px; }

/* buttons, links, chips */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; min-height: 48px; padding: .75em 1.5em; border-radius: 999px; font: 500 .92rem/1.2 var(--sans); letter-spacing: .01em; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: transform .2s, box-shadow .2s, background .2s, border-color .2s; }
.btn--gold { background: linear-gradient(135deg, #f1dca0, var(--gold) 55%, #b9923f); color: #241433; box-shadow: 0 10px 26px -12px rgba(217, 180, 93, .9), inset 0 1px 0 rgba(255, 255, 255, .5); }
.btn--gold:hover { transform: translateY(-1px); }
.btn--ghost { border-color: rgba(255, 255, 255, .55); color: #fff; background: rgba(28, 11, 44, .25); backdrop-filter: blur(6px); }
.btn--ghost:hover { background: rgba(255, 255, 255, .12); }
.lnk { display: inline-block; font: 500 .9rem/1.3 var(--sans); letter-spacing: .02em; color: var(--fuchsia); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.lnk:hover { color: var(--fuchsia-d); }
.lnk--light { color: var(--gold-l); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips button { min-height: 42px; padding: .5em 1em; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: inherit; font: 500 .86rem/1.2 var(--sans); cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.chips button:hover { border-color: var(--fuchsia); }
.chips button[aria-pressed="true"] { background: var(--plum); color: #fff; border-color: var(--plum); }

/* ---------- header ---------- */
.hdr { position: sticky; top: 0; z-index: 50; height: var(--hdr); display: flex; align-items: center; gap: 16px; padding: 0 20px; background: linear-gradient(rgba(28, 11, 44, .9), rgba(28, 11, 44, .75)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: #fff; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.brand { display: inline-flex; flex-direction: column; text-decoration: none; line-height: 1; margin: 0; }
.brand__name { font: 500 1.25rem/1 var(--serif); letter-spacing: .16em; display: inline-flex; align-items: baseline; }
.brand__apos { display: inline-block; width: 11px; height: 14px; margin: 0 1px 0 2px; position: relative; top: -7px; }
.brand__apos img { width: 11px; height: 13px; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .4)); }
.brand__sub { font: 500 .54rem/1 var(--sans); letter-spacing: .26em; text-transform: uppercase; color: var(--gold-l); margin-top: 6px; }
.hdr__nav { display: none; gap: 26px; margin-left: auto; font: 500 .84rem/1 var(--sans); letter-spacing: .02em; }
.hdr__nav a { text-decoration: none; opacity: .85; }
.hdr__nav a:hover { opacity: 1; color: var(--gold-l); }
.hdr__cta { display: none; min-height: 40px; padding: .5em 1.1em; font-size: .82rem; }
@media (min-width: 900px) { .hdr { padding: 0 32px; } .hdr__nav { display: flex; } .hdr__cta { display: inline-flex; } }

/* ---------- hero: her setups, full bleed ---------- */
.hero { position: relative; height: 100svh; min-height: 560px; margin-top: calc(-1 * var(--hdr)); padding: 0; background: var(--plum-2); color: #fff; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; }
.hero__slides { position: absolute; inset: 0; }
.hero__slides picture { position: absolute; inset: 0; }
.slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.4s ease; }
.slide.on { opacity: 1; }
html.js:not(.still) .hero.dim .slide.on { filter: brightness(.15) saturate(.6); }
.slide.on { filter: brightness(1) saturate(1); transition: opacity 1.4s ease, filter 1.3s ease .15s; }
.hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(28, 11, 44, .45) 0, rgba(28, 11, 44, 0) 30%, rgba(28, 11, 44, 0) 45%, rgba(28, 11, 44, .9) 100%); pointer-events: none; }
.hero__frame { position: absolute; inset: calc(var(--hdr) + 12px) 14px 14px; border: 1px solid rgba(240, 215, 154, .42); pointer-events: none; }
.hero__copy { position: relative; z-index: 2; padding: 0 30px 0; max-width: 620px; }
.hero__copy h1 { font-size: clamp(2.3rem, 7.6vw, 4rem); margin-bottom: .35em; text-shadow: 0 2px 24px rgba(0, 0, 0, .35); }
.hero__copy h1 em { color: var(--gold-l); }
.hero__sub { font-size: clamp(.95rem, 2.4vw, 1.08rem); color: rgba(255, 255, 255, .88); max-width: 46ch; margin-bottom: 1.3em; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 10px; }
.hero__bar { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 22px 30px calc(22px + 72px); }
.hero__cap { margin: 0; font: 500 .68rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .75); }
.hero__dots { display: flex; gap: 6px; align-items: center; }
.hero__dots button { width: 22px; height: 22px; padding: 0; border: 0; background: none; cursor: pointer; position: relative; }
.hero__dots button::after { content: ''; position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; margin: -3px; border-radius: 50%; background: rgba(255, 255, 255, .45); transition: transform .3s, background .3s; }
.hero__dots button[aria-pressed="true"]::after { background: var(--gold-l); transform: scale(1.5); }
.hero__pause { color: rgba(255, 255, 255, .8); font-size: .6rem; margin-left: 4px; }
@media (min-width: 900px) {
  .hero { min-height: 640px; }
  .hero__copy { padding: 0 64px; max-width: 760px; }
  .hero__bar { padding: 26px 64px 30px; }
  .hero__frame { inset: calc(var(--hdr) + 18px) 22px 22px; }
}
html:not(.js) .slide.on { opacity: 1; }

/* ---------- scenes: one per setup ---------- */
.scenes { padding: 0; }
.scene { padding: 56px 0; display: grid; gap: 26px; align-items: center; }
.scene--gold { background: linear-gradient(180deg, #2d1a0e, #3b2611); color: #fff; }
.scene--lilac { background: var(--lilac-bg); }
.scene--pink { background: var(--pink-bg); }
.scene--purple { background: linear-gradient(180deg, #221038, #2f1550); color: #fff; }
.scene--cream { background: var(--cream); }
.scene--plum { background: var(--plum-2); color: #fff; }
.scene__ph { width: min(100% - 40px, 560px); margin-inline: auto; overflow: hidden; box-shadow: 0 40px 70px -36px rgba(0, 0, 0, .6); }
.scene__ph img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 5; }
.scene__ph--arch { border-radius: 50% 50% 18px 18px / 36% 36% 18px 18px; }
.scene__ph--round { border-radius: 22px; }
.scene__ph--tall { border-radius: 18px; }
.scene__ph--tall img { aspect-ratio: 3 / 4; }
.scene__copy { width: min(100% - 40px, 560px); margin-inline: auto; }
.scene__no { font: 500 .68rem/1.3 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--fuchsia); margin: 0 0 1em; display: flex; align-items: center; gap: 12px; }
.scene__no::before { content: ''; width: 28px; height: 1px; background: currentColor; }
.scene--gold .scene__no, .scene--purple .scene__no, .scene--plum .scene__no { color: var(--gold-l); }
.scene--gold h2 em, .scene--purple h2 em, .scene--plum h2 em { color: var(--gold-l); }
.scene__copy p { color: var(--mute); max-width: 44ch; }
.scene--gold .scene__copy p, .scene--purple .scene__copy p, .scene--plum .scene__copy p { color: rgba(255, 255, 255, .78); }
.scene--gold .lnk, .scene--purple .lnk, .scene--plum .lnk { color: var(--gold-l); }
@media (min-width: 900px) {
  .scene { padding: 72px 0; grid-template-columns: 1fr 1fr; gap: 56px; width: min(1120px, 100% - 64px); margin-inline: auto; }
  .scene:nth-child(even) .scene__ph { order: 2; }
  .scene__ph { width: min(100%, 520px); }
  .scene__ph img { aspect-ratio: 4 / 5; max-height: 72vh; }
  .scene__copy { width: auto; max-width: 440px; }
  .scenes .scene { width: 100%; }
  .scene > * { padding-inline: 0; }
  .scene { padding-inline: calc((100% - 1120px) / 2); }
  @media (max-width: 1184px) { .scene { padding-inline: 32px; } }
}

/* ---------- gallery grid ---------- */
.gal { background: var(--frost); }
.gal__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 6px; }
.tile { border: 0; padding: 0; background: var(--frost-2); cursor: pointer; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 10px; }
.tile:first-child { border-radius: 50% 50% 10px 10px / 30% 30% 10px 10px; }
.tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.tile:hover img { transform: scale(1.04); }
.gal__more { margin-top: 20px; }
@media (min-width: 720px) { .gal__grid { grid-template-columns: repeat(5, 1fr); gap: 12px; } }

/* ---------- reviews ---------- */
.rev { background: var(--plum-2); color: #fff; }
.rev h2 em { color: var(--gold-l); }
.rev__badge { display: inline-flex; align-items: center; gap: 10px; font: 500 .84rem/1.3 var(--sans); letter-spacing: .04em; color: rgba(255, 255, 255, .85); border: 1px solid rgba(240, 215, 154, .4); border-radius: 999px; padding: .5em 1.1em; margin-bottom: 28px; }
.stars { color: var(--gold); letter-spacing: .1em; }
.rev__list { display: grid; gap: 0; border-top: 1px solid rgba(255, 255, 255, .14); margin-bottom: 26px; }
.rev__list blockquote { margin: 0; padding: 22px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.rev__list p { font: 400 1.15rem/1.5 var(--serif); margin: 0 0 10px; max-width: 60ch; }
.rev__list footer { font: 500 .72rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-l); }
.rev__list footer .small { color: rgba(255, 255, 255, .55); text-transform: none; letter-spacing: 0; }
@media (min-width: 900px) { .rev__list { grid-template-columns: 1fr 1fr; column-gap: 56px; } }

/* ---------- what she makes ---------- */
.work { background: var(--frost-2); }
.work__grid { display: grid; gap: 24px; }
.work__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.work__list li { display: grid; grid-template-columns: 1fr; padding: 14px 0; border-bottom: 1px solid var(--line); }
.work__list strong { font: 500 1.1rem/1.3 var(--serif); }
.work__list span { font-size: .9rem; color: var(--mute); }
@media (min-width: 900px) { .work__grid { grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: start; } .work__list li { grid-template-columns: 1fr 1.3fr; gap: 16px; align-items: baseline; } }

/* ---------- your look: builder + quote ---------- */
.build { background: linear-gradient(180deg, var(--plum-3), var(--plum) 35%, var(--plum-2)); color: #fff; }
.build h2 em { color: var(--gold-l); }
.build .lede { color: rgba(255, 255, 255, .78); }
.build .chips button { border-color: rgba(255, 255, 255, .28); color: #fff; }
.build .chips button[aria-pressed="true"] { background: var(--gold-l); color: var(--plum); border-color: var(--gold-l); }
.strip { position: relative; height: 210px; margin: 22px 0 10px; overflow: hidden; }
.strip::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 60% at 50% 70%, rgba(255, 220, 170, .12), transparent 70%); }
.strip__g { position: absolute; inset: 0; }
.strip__g img { position: absolute; width: var(--s); height: auto; left: var(--x); top: var(--y); transform: translate(-50%, -50%) scale(1); filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .4)); transition: left .7s cubic-bezier(.2, .8, .2, 1), top .7s cubic-bezier(.2, .8, .2, 1); }
.strip__g img.pop { animation: pop .5s var(--spring); }
@keyframes pop { 0% { transform: translate(-50%, -50%) scale(.55); } 100% { transform: translate(-50%, -50%) scale(1); } }
.strip__empty { position: absolute; inset: 0; display: grid; place-items: center; font: 400 1.15rem/1.4 var(--serif); font-style: italic; color: rgba(255, 255, 255, .6); text-align: center; padding: 0 20px; }
.build__grid { display: grid; gap: 18px; }
.tray { display: flex; gap: 6px; overflow-x: auto; padding: 4px 2px 10px; scrollbar-width: none; }
.tray::-webkit-scrollbar { display: none; }
.tray button { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 6px; width: 72px; padding: 8px 4px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .04); color: rgba(255, 255, 255, .9); font: 500 .64rem/1.15 var(--sans); cursor: pointer; position: relative; transition: border-color .2s, background .2s; }
.tray button img { width: 40px; height: 40px; object-fit: contain; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .4)); }
.tray button[aria-pressed="true"] { border-color: var(--gold-l); background: rgba(240, 215, 154, .14); }
.tray button[aria-pressed="true"]::after { content: attr(data-n); position: absolute; top: 4px; right: 4px; width: 18px; height: 18px; border-radius: 50%; background: var(--gold-l); color: var(--plum); font: 600 .62rem/18px var(--sans); text-align: center; }
.tray button[disabled] { opacity: .4; cursor: not-allowed; }
.look { font: 400 1.2rem/1.4 var(--serif); font-style: italic; color: rgba(255, 255, 255, .85); margin: 4px 0 0; }
.look strong { font-weight: 500; color: var(--gold-l); }
.build .edit-only { margin: 0; }
@media (min-width: 900px) { .strip { height: 260px; } .tray { flex-wrap: wrap; overflow: visible; } }

.form { margin-top: 32px; background: #fff; color: var(--ink); border-radius: 18px; padding: 26px 20px 22px; }
.form__h { font-size: 1.7rem; margin-bottom: .25em; }
.form__p { color: var(--mute); font-size: .92rem; }
.f { margin-bottom: 14px; }
.f--2 { display: grid; gap: 12px; }
.f label, .f__l { display: block; font: 500 .78rem/1.3 var(--sans); letter-spacing: .02em; color: var(--ink); margin-bottom: 6px; }
.f label b { color: var(--fuchsia); font-weight: 500; }
.f input, .f select, .f textarea { display: block; width: 100%; min-height: 48px; margin-top: 6px; padding: .6em .85em; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); font: 400 1rem/1.4 var(--sans); }
.f textarea { resize: vertical; }
.f input:focus, .f select:focus, .f textarea:focus { outline: 2px solid var(--gold); outline-offset: 1px; border-color: var(--fuchsia); }
.f [aria-invalid="true"] { border-color: #c01f50; }
.f__e, .err { color: #a3123f; font: 500 .84rem/1.3 var(--sans); margin: -6px 0 12px; }
.err { background: #fff0f5; border: 1px solid #f3b7cb; border-radius: 10px; padding: .7em 1em; margin: 0 0 14px; }
.f__hint { font-size: .82rem; color: var(--mute); margin: 6px 0 0; }
.chips--form button { min-height: 40px; font-size: .82rem; }
.hp { position: absolute; left: -9999px; }
.form__send { width: 100%; font-size: 1rem; min-height: 54px; }
.form__fine { font-size: .8rem; color: var(--mute); text-align: center; margin: 12px 0 0; }
.done { margin-top: 32px; background: #fff; color: var(--ink); border-radius: 18px; padding: 30px 20px; text-align: center; }
.done h3 { font-size: 1.8rem; }
@media (min-width: 720px) { .form { padding: 34px 34px 28px; } .f--2 { grid-template-columns: 1fr 1fr; } .form__send { width: auto; min-width: 280px; } }

/* ---------- how · area ---------- */
.how { background: var(--frost); }
.how__grid { display: grid; gap: 48px; }
.steps { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.steps li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); font-size: .94rem; color: var(--mute); }
.steps li span { font: 400 1.4rem/1 var(--serif); color: var(--gold-d); }
.steps li strong { display: block; color: var(--ink); font-weight: 500; margin-bottom: 2px; }
.towns { list-style: none; margin: 8px 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.towns li { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: .4em 1em; border-radius: 999px; border: 1px solid var(--line); font: 500 .86rem/1.2 var(--sans); }
@media (min-width: 900px) { .how__grid { grid-template-columns: 1.1fr 1fr; gap: 80px; } }

/* ---------- faq ---------- */
.faq { background: var(--frost-2); }
.faq__list { border-top: 1px solid var(--line); margin-top: 6px; max-width: 760px; }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 56px; padding: 14px 0; font: 400 1.1rem/1.3 var(--serif); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; color: var(--gold-d); font: 400 1.4rem/1 var(--serif); transition: transform .25s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin: 0 0 18px; color: var(--mute); max-width: 60ch; }

/* ---------- footer ---------- */
.ftr { background: var(--plum-2); color: #fff; padding: 56px 0 100px; border-top: 1px solid rgba(240, 215, 154, .25); }
.ftr__grid { display: grid; gap: 28px; }
.brand--ftr { margin-bottom: 10px; }
.brand--ftr .brand__name { font-size: 1.5rem; }
.ftr__tag { font: 400 1.3rem/1.2 var(--serif); font-style: italic; color: var(--gold-l); margin: 8px 0 0; }
.ftr__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font: 500 .9rem/1.4 var(--sans); }
.ftr__links a { text-decoration: none; opacity: .9; }
.ftr__links a:hover { color: var(--gold-l); opacity: 1; }
.ftr__fine { font-size: .76rem; color: rgba(255, 255, 255, .55); margin: 32px auto 0; }
.ftr__fine a { color: inherit; }
@media (min-width: 720px) { .ftr__grid { grid-template-columns: 1.2fr 1fr; } .ftr { padding-bottom: 48px; } }

/* ---------- dock (phones) ---------- */
.dock { display: none; }
@media (max-width: 899px) {
  .dock { position: fixed; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 55; display: grid; grid-template-columns: 1fr 1fr .8fr 1.9fr; gap: 4px; padding: 5px; border-radius: 999px; background: rgba(28, 11, 44, .94); backdrop-filter: blur(10px); box-shadow: 0 12px 30px rgba(0, 0, 0, .4); border: 1px solid rgba(240, 215, 154, .25); transition: transform .3s, opacity .3s; }
  .dock a { min-height: 44px; display: grid; place-items: center; border-radius: 999px; color: #fff; text-decoration: none; font: 500 .84rem/1 var(--sans); }
  .dock__go { background: linear-gradient(135deg, #f1dca0, var(--gold) 55%, #b9923f); color: var(--plum) !important; }
  .dock.away { transform: translateY(120%); opacity: 0; }
}

/* ---------- lightbox ---------- */
.lb { border: 0; padding: 0; background: rgba(20, 8, 32, .97); color: #fff; width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; }
.lb::backdrop { background: rgba(20, 8, 32, .8); }
.lb figure { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 64px 16px 92px; }
.lb img { max-width: 100%; max-height: calc(100vh - 200px); object-fit: contain; border-radius: 12px; }
.lb figcaption { font: 500 .72rem/1.4 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .8); text-align: center; }
.lb__x, .lb__nav { position: absolute; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .08); color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.lb__x { top: 14px; right: 14px; }
.lb__nav { top: 50%; transform: translateY(-50%); }
.lb__prev { left: 10px; } .lb__next { right: 10px; }
.lb__want { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); white-space: nowrap; }

/* ---------- reveals ---------- */
.rv { opacity: 0; transform: translateY(16px); transition: opacity .7s ease, transform .7s ease; }
.rv.in { opacity: 1; transform: none; }
html.still .rv { opacity: 1; transform: none; transition: none; }
html.still * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
