:root {
  --cream: #fbf7ef;
  --paper: #fffdf9;
  --ink: #24201d;
  --plum: #2a071f;
  --coral: #e05a47;
  --sun: #f1c74f;
  --leaf: #529c76;
  --blue: #315acc;
  --line: #ddd4c7;
  --muted: #6f675f;
  --serif: "Iowan Old Style", Baskerville, "Times New Roman", serif;
  --sans: "Avenir Next", "Segoe UI", Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--cream); }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
img { width: 100%; height: auto; display: block; }
.skip-link { position: fixed; z-index: 200; top: 8px; left: 8px; padding: 12px 16px; color: #fff; background: var(--ink); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.status-bar { min-height: 34px; padding: 8px clamp(18px, 4vw, 64px); display: flex; justify-content: space-between; gap: 16px; color: #fff; background: var(--plum); font-size: 9px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; }
.status-bar span:last-child { color: #f2c8dc; }
.site-header { height: 86px; padding: 0 clamp(20px, 5vw, 76px); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(36, 32, 29, .11); background: color-mix(in srgb, var(--cream) 93%, transparent); backdrop-filter: blur(14px); }
.brand, .footer-brand { font-family: var(--serif); font-size: clamp(28px, 2.4vw, 39px); letter-spacing: -.045em; text-decoration: none; }
.desktop-nav { display: flex; gap: 42px; }
.desktop-nav a { padding: 10px 0; font-size: 10px; font-weight: 600; letter-spacing: .14em; text-decoration: none; text-transform: uppercase; }
.header-tools { justify-self: end; display: flex; align-items: center; gap: 24px; }
.language-switch { display: flex; align-items: center; gap: 9px; font-size: 9px; font-weight: 700; letter-spacing: .13em; }
.language-switch::before { content: ""; width: 1px; height: 16px; margin-right: 6px; background: var(--line); }
.language-switch a { color: var(--muted); text-decoration: none; }
.language-switch span { padding-bottom: 3px; border-bottom: 1px solid currentColor; }
.menu { position: relative; }
.menu summary { width: 38px; padding: 4px 0; display: none; cursor: pointer; list-style: none; }
.menu summary::-webkit-details-marker { display: none; }
.menu summary i { height: 1px; margin: 7px 0; display: block; background: currentColor; }
.menu nav { width: min(340px, 100vw); padding: 32px 24px; position: fixed; inset: 120px 0 auto auto; border-bottom: 1px solid var(--line); background: var(--cream); box-shadow: 0 18px 44px rgba(42, 7, 31, .12); }
.menu nav a { padding: 14px 0; display: block; border-bottom: 1px solid var(--line); font-family: var(--serif); font-size: 30px; text-decoration: none; }
.menu nav small { margin-top: 28px; display: block; color: var(--muted); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }

.hero { min-height: calc(100svh - 120px); padding: clamp(40px, 6vw, 96px) clamp(20px, 6vw, 96px); display: grid; grid-template-columns: minmax(320px, .78fr) minmax(420px, 1.22fr); align-items: center; gap: clamp(36px, 7vw, 112px); position: relative; overflow: hidden; }
.hero::before { content: ""; width: 370px; height: 370px; position: absolute; left: -170px; bottom: -230px; border: 82px solid var(--sun); border-radius: 50%; opacity: .62; }
.hero-copy { max-width: 630px; position: relative; z-index: 2; }
.eyebrow { margin: 0 0 25px; color: var(--coral); font-size: 9px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
h1, h2 { margin: 0; font-family: var(--serif); font-weight: 400; letter-spacing: -.052em; line-height: .91; }
h1 { font-size: clamp(68px, 7.4vw, 116px); }
h1 em { color: var(--coral); font-weight: 400; }
.hero-intro { max-width: 42ch; margin: 38px 0; color: var(--muted); font-family: var(--serif); font-size: clamp(18px, 1.6vw, 23px); line-height: 1.55; }
.text-link { padding: 8px 0; display: inline-flex; gap: 14px; align-items: center; border-bottom: 1px solid; font-size: 10px; font-weight: 700; letter-spacing: .15em; text-decoration: none; text-transform: uppercase; }
.hero-photo { margin: 0; min-height: 650px; position: relative; overflow: hidden; border-radius: 50% 50% 8px 8px; background: #111; box-shadow: 0 26px 70px rgba(42, 7, 31, .16); }
.hero-photo img { height: 100%; min-height: 650px; object-fit: cover; }
.hero-photo figcaption { position: absolute; right: 18px; bottom: 18px; padding: 8px 11px; color: #fff; background: rgba(17,17,17,.68); font-size: 8px; letter-spacing: .15em; text-transform: uppercase; backdrop-filter: blur(8px); }
.sun-note { width: 120px; height: 120px; position: absolute; right: 4vw; bottom: 3vw; z-index: 3; display: grid; place-content: center; border-radius: 50%; color: var(--plum); background: var(--sun); text-align: center; transform: rotate(8deg); }
.sun-note span { display: block; font-size: 8px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.sun-note strong { margin: -4px 0; display: block; font-family: var(--serif); font-size: 31px; font-style: italic; font-weight: 400; }

.collection { padding: clamp(90px, 11vw, 170px) clamp(20px, 6vw, 96px); background: var(--paper); }
.section-heading { margin-bottom: clamp(56px, 8vw, 110px); display: grid; grid-template-columns: 1fr .65fr; align-items: end; gap: 70px; }
.section-heading h2, .story-copy h2 { font-size: clamp(58px, 7vw, 105px); }
.section-heading > p { max-width: 40ch; margin: 0; color: var(--muted); font-family: var(--serif); font-size: 18px; line-height: 1.6; }
.jewel-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(12px, 2vw, 30px); align-items: start; }
.jewel-card { grid-column: span 4; margin: 0; }
.jewel-card--tall { grid-column: span 5; }
.jewel-card--wide { grid-column: span 5; margin-top: clamp(22px, 5vw, 78px); }
.jewel-card img { aspect-ratio: 4 / 5; object-fit: cover; background: #111; }
.jewel-card--wide img { aspect-ratio: 1 / 1; }
.jewel-card figcaption { padding: 14px 2px 4px; display: flex; gap: 14px; color: var(--muted); font-family: var(--serif); font-size: 15px; font-style: italic; }
.jewel-card figcaption span { color: var(--coral); font-family: var(--sans); font-size: 9px; font-style: normal; font-weight: 700; letter-spacing: .12em; }
.collection-actions { margin-top: clamp(56px, 8vw, 110px); display: flex; align-items: center; justify-content: space-between; gap: 32px; border-top: 1px solid var(--line); padding-top: clamp(28px, 4vw, 48px); }
.collection-button { min-height: 62px; padding: 18px 24px; display: inline-flex; align-items: center; justify-content: center; gap: 26px; color: #fff; background: var(--plum); font-size: 10px; font-weight: 700; letter-spacing: .15em; text-decoration: none; text-transform: uppercase; transition: transform .2s ease, background .2s ease; }
.collection-button:hover { background: #431033; transform: translateY(-2px); }
.collection-button span { color: var(--sun); font-size: 18px; }
.collection-actions p { max-width: 40ch; margin: 0; color: var(--muted); font-family: var(--serif); font-size: 17px; line-height: 1.55; }

.albums-preview { padding: clamp(90px, 11vw, 170px) clamp(20px, 6vw, 96px); background: var(--cream); }
.albums-preview__heading { margin-bottom: clamp(50px, 7vw, 90px); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .7fr); align-items: end; gap: clamp(36px, 7vw, 100px); }
.albums-preview__heading h2 { font-size: clamp(56px, 6.7vw, 100px); }
.albums-preview__heading > div:last-child > p { max-width: 39ch; margin: 0 0 28px; color: var(--muted); font-family: var(--serif); font-size: 18px; line-height: 1.6; }
.home-stories-motion { display: none; margin-top: 26px; align-items: center; flex-wrap: wrap; gap: 12px 18px; color: var(--muted); font-size: 10px; letter-spacing: .11em; text-transform: uppercase; }
.home-stories-motion button { min-height: 42px; padding: 10px 16px; border: 1px solid var(--plum); color: var(--plum); background: transparent; cursor: pointer; font: inherit; font-weight: 700; letter-spacing: inherit; text-transform: inherit; }
.home-stories-motion button:hover, .home-stories-motion button:focus-visible { color: #fff; background: var(--plum); }
.album-teasers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2.2vw, 32px); }
.album-teaser { min-width: 0; overflow: hidden; border: 1px solid var(--line); color: inherit; background: #fff; box-shadow: 0 20px 55px rgba(42, 7, 31, .07); text-decoration: none; }
.album-teaser__media { aspect-ratio: 4 / 5; display: block; overflow: hidden; position: relative; contain: layout paint; background: #130c11; }
.home-story__scene { position: absolute; inset: 0; overflow: hidden; opacity: 0; transition: opacity 1100ms ease-in-out; }
.home-story__scene.is-active { z-index: 2; opacity: 1; }
.home-story__backdrop, .home-story__jewel { position: absolute; display: block; }
.home-story__backdrop { inset: -7%; width: 114%; height: 114%; object-fit: cover; opacity: .34; filter: blur(18px) saturate(.88); transform: scale(1.06); }
.home-story__jewel { inset: 4%; width: 92%; height: 92%; object-fit: contain; transform: scale(.982); will-change: transform; }
.home-story .home-story__scene.is-active .home-story__jewel { animation: home-story-drift 7200ms linear both; animation-play-state: paused; }
.home-story[data-running="true"] .home-story__scene.is-active .home-story__jewel { animation-play-state: running; }
.home-story__scene[data-motion="drift-left"] { --move-x: -1.2%; --move-y: .4%; }
.home-story__scene[data-motion="drift-right"] { --move-x: 1.2%; --move-y: -.35%; }
.home-story__scene[data-motion="drift-up"] { --move-x: .35%; --move-y: -1.1%; }
@keyframes home-story-drift {
  from { transform: translate3d(0, 0, 0) scale(.982); }
  to { transform: translate3d(var(--move-x), var(--move-y), 0) scale(1.025); }
}
.album-teaser__body { min-height: 210px; padding: clamp(22px, 2.5vw, 34px); display: flex; flex-direction: column; }
.album-teaser__body small { color: var(--coral); font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.album-teaser__body strong { margin: 12px 0; font-family: var(--serif); font-size: clamp(28px, 2.5vw, 39px); font-weight: 400; line-height: 1.02; }
.album-teaser__body > span { color: var(--muted); font-family: var(--serif); font-size: 16px; line-height: 1.5; }
.album-teaser:hover .album-teaser__body strong, .album-teaser:focus-visible .album-teaser__body strong { color: var(--coral); }

.story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .8fr); color: #fff; background: var(--plum); }
.logo-panel { min-height: 660px; overflow: hidden; background: #170213; }
.logo-panel img { height: 100%; object-fit: cover; }
.story-copy { padding: clamp(72px, 9vw, 145px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.story-copy .eyebrow { color: var(--sun); }
.story-copy > p:not(.eyebrow) { max-width: 43ch; margin: 34px 0; color: #e2d4dc; font-family: var(--serif); font-size: 19px; line-height: 1.6; }
.coming-soon { color: #f0b9d2; font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.site-footer { padding: 64px clamp(20px, 6vw, 96px); display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; border-top: 7px solid var(--sun); color: var(--muted); background: var(--cream); }
.site-footer p { margin: 7px 0; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.footer-brand { color: var(--ink); }
:focus-visible { outline: 2px solid var(--coral); outline-offset: 4px; }
:where(h1, h2, h3)[tabindex="-1"]:focus { outline: none; }

@media (max-width: 940px) {
  .site-header { height: 76px; grid-template-columns: 1fr auto; }
  .desktop-nav { display: none; }
  .header-tools { gap: 15px; }
  .menu summary { display: block; }
  .hero { grid-template-columns: 1fr; }
  .hero-photo { min-height: 80vw; }
  .hero-photo img { min-height: 80vw; }
  .sun-note { bottom: 28px; }
  .section-heading { grid-template-columns: 1fr; gap: 34px; }
  .jewel-card, .jewel-card--tall, .jewel-card--wide { grid-column: span 6; margin-top: 0; }
  .story { grid-template-columns: 1fr; }
  .logo-panel { min-height: 90vw; }
  .collection-actions { align-items: flex-start; flex-direction: column; }
  .albums-preview__heading { grid-template-columns: 1fr; gap: 32px; }
  .album-teasers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .album-teaser:nth-child(3) { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(240px, .65fr); }
  .album-teaser:nth-child(3) .album-teaser__media { aspect-ratio: 16 / 8; }
}

@media (max-width: 560px) {
  .status-bar { justify-content: center; text-align: center; }
  .status-bar span:last-child { display: none; }
  .brand { font-size: 27px; }
  .hero { padding-top: 64px; }
  h1 { font-size: clamp(67px, 20vw, 86px); }
  .hero-photo, .hero-photo img { min-height: 116vw; }
  .sun-note { width: 98px; height: 98px; right: 7px; }
  .collection { padding-inline: 16px; }
  .section-heading { padding-inline: 8px; }
  .section-heading h2, .story-copy h2 { font-size: 57px; }
  .jewel-grid { gap: 10px; }
  .jewel-card figcaption { font-size: 13px; gap: 8px; }
  .collection-button { width: 100%; }
  .albums-preview { padding-inline: 16px; }
  .albums-preview__heading { padding-inline: 8px; }
  .albums-preview__heading h2 { font-size: 54px; }
  .album-teasers { grid-template-columns: 1fr; }
  .album-teaser:nth-child(3) { display: block; }
  .album-teaser__media, .album-teaser:nth-child(3) .album-teaser__media { aspect-ratio: 5 / 4; }
  .album-teaser__body { min-height: 0; padding: 22px; }
  .album-teaser__body strong { font-size: 31px; }
  .story-copy { padding: 78px 24px; }
  .site-footer { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
  .home-stories-motion { display: flex; }
  .home-story:not([data-motion-opt-in="true"]) .home-story__scene { transition: none; }
  .home-story:not([data-motion-opt-in="true"]) .home-story__scene.is-active .home-story__jewel { animation: none; }
}