:root {
  color-scheme: light;
  --ink: #241a29;
  --muted: #706575;
  --purple: #712c91;
  --purple-dark: #45155e;
  --gold: #c97f0d;
  --line: #e1d8e5;
  --paper: #fdfbfd;
  --white: #fff;
  --shadow: 0 24px 70px rgba(67, 32, 82, .11);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #f4eff6; }
body {
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 92% 7%, rgba(243, 174, 43, .17), transparent 23rem),
    radial-gradient(circle at 4% 4%, rgba(161, 66, 205, .14), transparent 28rem),
    linear-gradient(180deg, #fdfbfd 0%, #f4eff7 63%, #fbf9fc 100%);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.6;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
.skip { position: absolute; top: -60px; left: 18px; z-index: 20; padding: 10px 14px; border-radius: 8px; color: white; background: var(--purple-dark); }
.skip:focus { top: 12px; }
.shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 104px; border-bottom: 1px solid var(--line); }
.identity { display: inline-flex; align-items: center; gap: 13px; text-decoration: none; }
.identity img { width: 58px; height: 58px; object-fit: contain; }
.identity-text { display: grid; gap: 3px; }
.name { color: var(--purple); font-family: "Cormorant Garamond", Georgia, serif; font-size: 2.55rem; font-style: italic; font-weight: 700; line-height: .78; }
.tagline { font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
nav { display: flex; align-items: center; gap: 24px; }
nav a { color: #534959; font-size: .92rem; font-weight: 600; text-decoration: none; }
nav a:hover, nav a:focus-visible { color: var(--purple); }
.shop-link { padding: 10px 16px; border: 1px solid var(--purple-dark); border-radius: 999px; color: var(--purple-dark); }
.mobile-menu { display:none; position:relative; z-index:10; }
.mobile-menu summary { display:grid; gap:5px; width:48px; height:48px; padding:13px 10px; border:1px solid var(--line); border-radius:50%; background:rgba(255,255,255,.88); cursor:pointer; list-style:none; }
.mobile-menu summary::-webkit-details-marker { display:none; }
.mobile-menu summary span { display:block; width:26px; height:3px; border-radius:3px; background:var(--purple-dark); }
.mobile-menu[open] summary { background:white; }
.mobile-links { position:absolute; top:58px; right:0; display:grid; min-width:230px; padding:10px; border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.98); box-shadow:var(--shadow); }
.mobile-links a { padding:11px 13px; border-radius:10px; color:var(--purple-dark); font-weight:700; text-decoration:none; }
.mobile-links a:hover,.mobile-links a:focus-visible { background:#f5edf8; }
.hero { display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(330px, .87fr); gap: clamp(38px, 6vw, 88px); align-items: center; min-height: 690px; padding: clamp(64px, 8vw, 106px) 0 80px; }
.eyebrow, .kicker { margin: 0 0 18px; color: var(--gold); font-size: .82rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
h1, h2, h3, p { text-wrap: pretty; }
h1, h2 { margin: 0; color: var(--purple-dark); font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-weight: 700; letter-spacing: -.05em; line-height: .8; }
h1 { max-width: 760px; font-size: clamp(4.2rem, 8.3vw, 7.55rem); }
h2 { font-size: clamp(3rem, 5.6vw, 5.25rem); }
.lead { max-width: 680px; margin: 30px 0 0; color: var(--muted); font-size: clamp(1.08rem, 1.55vw, 1.27rem); line-height: 1.68; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; margin-top: 34px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 14px 24px; border: 2px solid var(--purple-dark); border-radius: 999px; color: white; background: var(--purple-dark); box-shadow: 0 13px 30px rgba(69, 23, 95, .18); font-weight: 700; text-decoration: none; transition: transform 160ms ease, background 160ms ease; }
.button:hover, .button:focus-visible { transform: translateY(-2px); background: var(--purple); }
.button:focus-visible, a:focus-visible { outline: 4px solid #efb23d; outline-offset: 4px; }
.quiet-link { color: var(--purple-dark); font-weight: 700; text-underline-offset: 5px; }
.mark-stage { position: relative; isolation: isolate; display: grid; place-items: center; min-height: 460px; }
.mark-stage::before { position: absolute; z-index: -1; width: 94%; aspect-ratio: 1; border: 1px solid rgba(100, 63, 119, .1); border-radius: 50%; background: rgba(255,255,255,.8); box-shadow: var(--shadow); content: ""; }
.mark-stage img { width: min(100%, 455px); filter: drop-shadow(0 23px 26px rgba(72,29,88,.17)); transform: rotate(-4deg); }
.mark-note { position: absolute; right: -8px; bottom: 22px; max-width: 215px; padding: 15px 17px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.94); box-shadow: 0 14px 38px rgba(69,38,84,.11); color: #5b4d61; font-size: .88rem; font-weight: 600; line-height: 1.45; }
.home-choices { padding: 38px 0 76px; border-top: 1px solid var(--line); }
.home-choices h2 { font-size: clamp(2.8rem,5vw,4.6rem); }
.choice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:34px; }
.choice-card { min-height:245px; padding:34px; border:1px solid var(--line); border-radius:24px; background:rgba(255,255,255,.86); box-shadow:0 16px 45px rgba(69,38,84,.07); text-decoration:none; transition:transform 160ms ease,box-shadow 160ms ease; }
.choice-card:hover,.choice-card:focus-visible { transform:translateY(-4px); box-shadow:0 22px 52px rgba(69,38,84,.13); }
.choice-card h3 { margin:25px 0 10px; color:var(--purple-dark); font-family:"Cormorant Garamond",Georgia,serif; font-size:2.15rem; font-style:italic; line-height:1; }
.choice-card p { max-width:430px; margin:0; color:var(--muted); }
.choice-story { background:linear-gradient(140deg,rgba(255,255,255,.9),rgba(247,236,251,.9)); }
.collector-note { max-width:850px; margin:0 auto; padding:42px 52px; border:1px solid var(--line); border-radius:24px; background:rgba(255,255,255,.7); text-align:center; }
.collector-note>p:not(.kicker):not(.signed) { margin:0; color:var(--muted); font-size:1.08rem; }
.page-intro { max-width:820px; padding:82px 0 46px; }
.page-intro h1 { font-size:clamp(4.2rem,8vw,7rem); }
.page-grid { margin-top:0; padding-bottom:76px; }
.story-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:17px; padding:0 0 88px; }
.story-card { min-height:270px; padding:30px; border:1px solid var(--line); border-radius:22px; background:rgba(255,255,255,.84); box-shadow:0 16px 45px rgba(69,38,84,.06); text-decoration:none; transition:transform 160ms ease,box-shadow 160ms ease; }
.story-card:hover,.story-card:focus-visible { transform:translateY(-4px); box-shadow:0 22px 52px rgba(69,38,84,.12); }
.story-card span { color:var(--gold); font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.story-card h3 { margin:28px 0 12px; color:var(--purple-dark); font-family:"Cormorant Garamond",Georgia,serif; font-size:2rem; font-style:italic; line-height:1; }
.story-card p { margin:0; color:var(--muted); }
.about-layout { display:grid; grid-template-columns:minmax(0,.95fr) minmax(390px,1.05fr); gap:clamp(36px,6vw,82px); align-items:center; padding:0 0 88px; }
.about-image,.about-image img { min-height:410px; }
.collector-note .quiet-link { display:inline-block; margin-top:14px; }
.section { padding: clamp(74px, 9vw, 120px) 0; }
.section-heading { max-width: 740px; }
.section-intro { max-width: 650px; margin: 22px 0 0; color: var(--muted); font-size: 1.08rem; }
.category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 42px; }
.category { position: relative; overflow: hidden; min-height: 235px; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.84); box-shadow: 0 16px 45px rgba(69,38,84,.06); text-decoration: none; transition: transform 160ms ease, box-shadow 160ms ease; }
.category:hover, .category:focus-visible { transform: translateY(-4px); box-shadow: 0 22px 52px rgba(69,38,84,.12); }
.category::before { position: absolute; top: 0; right: 0; left: 0; height: 5px; background: var(--accent, var(--purple)); content: ""; }
.category:nth-child(2) { --accent: #db7c15; }
.category:nth-child(3) { --accent: #20a4b7; }
.category:nth-child(4) { --accent: #4d9e4a; }
.category:nth-child(5) { --accent: #376dcc; }
.category:nth-child(6) { --accent: #c13d8d; }
.number { color: var(--accent, var(--purple)); font-size: .77rem; font-weight: 700; letter-spacing: .15em; }
.category h3 { margin: 24px 0 8px; color: var(--purple-dark); font-size: 1.22rem; line-height: 1.25; }
.category p { margin: 0; color: var(--muted); font-size: .95rem; line-height: 1.55; }
.card-link { display: inline-block; margin-top: 18px; color: var(--purple-dark); font-size: .9rem; font-weight: 700; }
.category-wide { grid-column: 1 / -1; min-height: 0; display: grid; grid-template-columns: 110px 1fr auto; gap: 24px; align-items: center; }
.category-wide h3, .category-wide .card-link { margin: 0; }
.theme-band { margin-top: 36px; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.62); }
.theme-band h3 { margin: 0 0 18px; color: var(--purple-dark); font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; }
.theme-links { display: flex; flex-wrap: wrap; gap: 10px; }
.theme-links a { padding: 9px 13px; border: 1px solid #d8c7e2; border-radius: 999px; color: #56266e; background: #faf6fc; font-size: .9rem; font-weight: 600; text-decoration: none; }
.theme-links a:hover, .theme-links a:focus-visible { color: white; background: var(--purple); }
.story-wrap { display: grid; grid-template-columns: minmax(0,.88fr) minmax(420px,1.12fr); gap: clamp(36px,6vw,82px); align-items: center; }
.heritage-card { position: relative; overflow: hidden; min-height: 500px; border-radius: 30px; background: #0c0a14; box-shadow: var(--shadow); }
.heritage-card img { width: 100%; height: 100%; min-height: 500px; object-fit: cover; object-position: 52% center; }
.heritage-label { position: absolute; right: 24px; bottom: 24px; left: 24px; padding: 19px 22px; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; color: white; background: rgba(17,10,25,.78); backdrop-filter: blur(12px); font-size: .95rem; }
.story-copy p { color: var(--muted); font-size: 1.06rem; }
.story-copy .first { margin-top: 28px; }
.signature-line { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); color: var(--purple-dark) !important; font-weight: 700; }
.shop-panel { position: relative; overflow: hidden; display: grid; grid-template-columns: 1fr auto; gap: 35px; align-items: center; padding: clamp(36px,6vw,70px); border-radius: 30px; color: white; background: linear-gradient(125deg,#38104e 0%,#672386 58%,#9234ad 100%); box-shadow: 0 30px 70px rgba(69,23,95,.22); }
.shop-panel::after { position: absolute; right: -80px; bottom: -180px; width: 420px; height: 420px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; box-shadow: 0 0 0 42px rgba(255,255,255,.03),0 0 0 84px rgba(255,255,255,.025); content: ""; }
.shop-panel h2 { position: relative; z-index: 1; max-width: 700px; color: white; }
.shop-panel p { position: relative; z-index: 1; max-width: 650px; margin: 18px 0 0; color: rgba(255,255,255,.82); font-size: 1.05rem; }
.shop-panel .button { position: relative; z-index: 1; border-color: white; color: var(--purple-dark); background: white; box-shadow: none; white-space: nowrap; }
.shop-panel .button:hover, .shop-panel .button:focus-visible { color: white; background: transparent; }
.department-hero { display: grid; grid-template-columns: 1fr 340px; gap: clamp(35px,7vw,100px); align-items: center; min-height: 520px; padding: 75px 0; }
.breadcrumb { margin: 0 0 25px; color: var(--muted); font-size: .88rem; }
.breadcrumb a { color: var(--purple); font-weight: 700; text-underline-offset: 4px; }
.department-hero h1 { font-size: clamp(4rem,8vw,7rem); }
.department-art { position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.82); box-shadow: var(--shadow); }
.department-art img { width: 72%; filter: drop-shadow(0 18px 24px rgba(72,29,88,.15)); }
.department-art .product-photo { max-height: 76%; object-fit: contain; border-radius: 18px; }
.department-art::after { position: absolute; inset: 18px; border: 2px dotted var(--accent,#712c91); border-radius: 50%; opacity: .35; content: ""; }
.details { display: grid; grid-template-columns: .8fr 1.2fr; gap: 50px; align-items: start; padding: 70px 0 110px; border-top: 1px solid var(--line); }
.details h2 { font-size: clamp(2.8rem,4.8vw,4.6rem); }
.detail-copy { color: var(--muted); font-size: 1.05rem; }
.tags { display: flex; flex-wrap: wrap; gap: 10px; margin: 25px 0 30px; }
.tags span { padding: 8px 12px; border: 1px solid #d8c7e2; border-radius: 999px; color: #56266e; background: #faf6fc; font-size: .88rem; font-weight: 600; }
.signed { margin-top: 22px; color: var(--purple-dark) !important; font-family: "Cormorant Garamond", Georgia, serif; font-size: 1.65rem !important; font-style: italic; font-weight: 700; }
footer { display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: end; margin-top: 64px; padding: 30px 0 38px; border-top: 1px solid var(--line); color: #776d7c; font-size: .9rem; }
footer strong { color: var(--purple); }
.footer-links { display: flex; gap: 20px; }
.footer-links a { text-underline-offset: 4px; }
@media (max-width:900px) {
  .topbar>nav { display:none; }
  .mobile-menu { display:block; }
  .hero { grid-template-columns:1fr; min-height:auto; gap:0; padding:62px 0 72px; }
  .hero-copy { grid-row:1; text-align:center; }
  .mark-stage { display:none; }
  .mark-note { display:none; }
  .lead { margin-right:auto; margin-left:auto; }
  .actions { justify-content:center; }
  .category-grid { grid-template-columns:repeat(2,1fr); }
  .story-grid { grid-template-columns:repeat(2,1fr); }
  .about-layout { grid-template-columns:1fr; }
  .story-wrap { grid-template-columns:1fr; }
  .heritage-card,.heritage-card img { min-height:400px; }
  .shop-panel { grid-template-columns:1fr; }
  .shop-panel .button { justify-self:start; }
  .department-hero { grid-template-columns:1fr 280px; }
  .details { grid-template-columns:1fr; }
}
@media (max-width:580px) {
  .shell { width:min(100% - 28px,1180px); }
  .topbar { min-height:88px; }
  .identity img { width:48px; height:48px; }
  .name { font-size:2rem; }
  .tagline { font-size:.62rem; }
  .shop-link { padding:8px 12px; font-size:.8rem; }
  .hero { padding:46px 0 64px; }
  h1 { font-size:clamp(3.9rem,20vw,5.8rem); }
  .category-grid { grid-template-columns:1fr; }
  .choice-grid,.story-grid { grid-template-columns:1fr; }
  .choice-card,.story-card { min-height:0; }
  .collector-note { padding:32px 24px; }
  .about-image,.about-image img { min-height:300px; }
  .category { min-height:0; }
  .category-wide { grid-template-columns:1fr; gap:10px; }
  .heritage-card,.heritage-card img { min-height:320px; }
  .heritage-label { right:15px; bottom:15px; left:15px; }
  .shop-panel { padding:34px 25px; border-radius:24px; }
  .department-hero { grid-template-columns:1fr; padding:50px 0 65px; text-align:center; }
  .department-art { width:min(74vw,300px); margin:0 auto; grid-row:1; }
  .department-copy { grid-row:2; }
  .department-copy .lead { margin-right:auto; margin-left:auto; }
  .department-copy .actions { justify-content:center; }
  footer { grid-template-columns:1fr; align-items:start; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button,.category { transition:none; } }