
    :root {
      color-scheme: light dark;
      --paper: #f7f3ea;
      --paper-2: #eee7da;
      --ink: #14283a;
      --muted: #52616d;
      --navy: #102b43;
      --navy-2: #0b2237;
      --cream: #fffaf0;
      --coral: #d36a50;
      --coral-deep: #a94936;
      --teal: #167f83;
      --gold: #b58a3c;
      --line: rgba(20, 40, 58, .18);
      --line-on-dark: rgba(255, 250, 240, .23);
      --shadow: 0 22px 60px rgba(13, 35, 54, .14);
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --paper: #101a22;
        --paper-2: #17252f;
        --ink: #f6f0e4;
        --muted: #bec8cc;
        --navy: #091b2a;
        --navy-2: #06131f;
        --cream: #fff8ea;
        --coral: #ef8469;
        --coral-deep: #ff9d85;
        --teal: #45b7b7;
        --gold: #d9b669;
        --line: rgba(246, 240, 228, .18);
        --line-on-dark: rgba(255, 250, 240, .22);
        --shadow: 0 22px 60px rgba(0, 0, 0, .32);
      }
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: var(--paper);
      color: var(--ink);
      font-family: "Manrope", sans-serif;
      font-size: 16px;
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
    }
    img { display: block; max-width: 100%; }
    a { color: inherit; }
    button { font: inherit; }
    .skip-link {
      position: absolute;
      top: -60px;
      left: 16px;
      z-index: 100;
      padding: 10px 14px;
      background: var(--cream);
      color: #102b43;
    }
    .skip-link:focus { top: 12px; }
    .topbar {
      position: absolute;
      inset: 0 0 auto 0;
      z-index: 10;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      max-width: 1240px;
      margin: 0 auto;
      padding: 26px 32px;
      color: var(--cream);
    }
    .nav-toggle {
      display: none;
      width: 44px;
      height: 44px;
      border: 1px solid var(--line-on-dark);
      border-radius: 50%;
      color: inherit;
      background: rgba(6, 19, 31, .28);
      cursor: pointer;
    }
    .nav-toggle svg { width: 20px; vertical-align: middle; }
    .nav-links {
      display: flex;
      align-items: center;
      gap: 30px;
    }
    .nav-links a {
      text-decoration: none;
      font-size: .82rem;
      font-weight: 700;
      letter-spacing: .045em;
    }
    .nav-links a:hover, .nav-links a:focus-visible { color: #f3c970; }
    .nav-status {
      padding: 9px 14px;
      border: 1px solid var(--line-on-dark);
      border-radius: 999px;
      color: #fff8ea;
    }
    .site-brand {
      display: flex;
      align-items: center;
      gap: 9px;
      flex: 0 0 auto;
      width: 205px;
      padding: 8px 11px 8px 9px;
      color: var(--cream);
      background: var(--plum, #2b1233);
      border: 1px solid rgba(201, 154, 61, .62);
      border-radius: 14px 4px 14px 4px;
      box-shadow: 3px 3px 0 rgba(201, 154, 61, .2);
      text-decoration: none;
    }
    .site-brand:hover, .site-brand:focus-visible {
      border-color: var(--gold-bright, #efd68e);
      background: #35143f;
    }
    .site-brand .nav-brand-star {
      flex-basis: 29px;
      width: 29px;
      height: 29px;
    }
    .site-brand .nav-brand-copy strong { font-size: .8rem; }
    .site-brand .nav-brand-copy span { margin-top: 3px; font-size: .54rem; }
    .nav-brand-banner {
      display: flex;
      align-items: center;
      gap: 11px;
      min-width: 232px;
      padding: 10px 14px 10px 11px;
      color: var(--cream);
      background: var(--plum, #2b1233);
      border: 1px solid rgba(201, 154, 61, .55);
      border-radius: 17px 5px 17px 5px;
      box-shadow: 4px 4px 0 rgba(201, 154, 61, .18);
    }
    .nav-brand-star {
      position: relative;
      display: block;
      flex: 0 0 36px;
      width: 36px;
      height: 36px;
    }
    .nav-brand-star::before,
    .nav-brand-star::after {
      content: "";
      position: absolute;
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .nav-brand-star::before {
      inset: -2px;
      background: var(--gold);
      transform: rotate(45deg);
    }
    .nav-brand-star::after {
      inset: 5px;
      background: var(--coral-deep);
    }
    .nav-brand-copy { display: grid; line-height: 1; }
    .nav-brand-copy strong {
      font-family: "DM Serif Display", serif;
      font-size: .94rem;
      font-weight: 400;
      letter-spacing: .015em;
    }
    .nav-brand-copy span {
      margin-top: 4px;
      color: var(--gold-bright, #efd68e);
      font-size: .64rem;
      font-weight: 800;
      letter-spacing: .105em;
      text-transform: uppercase;
    }
    .hero {
      position: relative;
      min-height: min(800px, 92vh);
      display: grid;
      align-items: center;
      overflow: hidden;
      background: var(--navy-2);
      color: var(--cream);
    }
    .hero::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, rgba(5, 18, 29, .96) 0%, rgba(5, 18, 29, .78) 39%, rgba(5, 18, 29, .12) 74%, rgba(5, 18, 29, .06) 100%);
    }
    .hero-image {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }
    .hero-inner {
      position: relative;
      z-index: 1;
      width: min(1180px, calc(100% - 64px));
      margin: 0 auto;
      padding: 145px 0 110px;
    }
    .hero-copy { max-width: 590px; }
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 11px;
      margin: 0 0 26px;
      color: #f4cb78;
      font-size: .76rem;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
    }
    .eyebrow::before {
      content: "";
      width: 36px;
      height: 1px;
      background: currentColor;
    }
    h1, h2, h3 {
      margin: 0;
      font-family: "Libre Baskerville", serif;
      line-height: 1.12;
      text-wrap: balance;
    }
    h1 {
      max-width: 560px;
      font-size: clamp(3.45rem, 7.3vw, 6.75rem);
      font-weight: 400;
      letter-spacing: -.052em;
    }
    .hero-lede {
      max-width: 510px;
      margin: 30px 0 0;
      color: rgba(255, 250, 240, .84);
      font-family: "Libre Baskerville", serif;
      font-size: clamp(1.02rem, 1.7vw, 1.28rem);
      line-height: 1.7;
    }
    .hero-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 14px 25px;
      margin-top: 42px;
      color: rgba(255, 250, 240, .76);
      font-size: .77rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .hero-meta span { display: flex; align-items: center; gap: 9px; }
    .hero-meta i {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--coral);
    }
    .section { padding: 110px 32px; }
    .section-inner { width: min(1120px, 100%); margin: 0 auto; }
    .section-heading {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 440px);
      gap: 50px;
      align-items: end;
      padding-bottom: 36px;
      border-bottom: 1px solid var(--line);
    }
    .section-label {
      margin: 0 0 14px;
      color: var(--coral-deep);
      font-size: .78rem;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    h2 {
      font-size: clamp(2.25rem, 5vw, 4.4rem);
      font-weight: 400;
      letter-spacing: -.045em;
    }
    .section-heading > p {
      margin: 0;
      color: var(--muted);
      font-size: 1rem;
    }
    .collection-stage {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(250px, 360px);
      gap: 70px;
      align-items: center;
      min-height: 380px;
      padding: 70px 0 10px;
    }
    .collection-message h3 {
      max-width: 620px;
      font-size: clamp(2rem, 4vw, 3.55rem);
      font-weight: 400;
      letter-spacing: -.035em;
    }
    .collection-message p {
      max-width: 610px;
      margin: 24px 0 0;
      color: var(--muted);
    }
    .collection-note {
      position: relative;
      padding: 38px 34px;
      background: var(--navy);
      color: var(--cream);
      box-shadow: var(--shadow);
    }
    .collection-note::before {
      content: "";
      position: absolute;
      width: 46px;
      height: 46px;
      top: -14px;
      right: 24px;
      border-radius: 50%;
      background: var(--coral);
      box-shadow: -23px 25px 0 -10px var(--gold), -46px 7px 0 -13px var(--teal);
    }
    .collection-note strong {
      display: block;
      margin-bottom: 14px;
      font-family: "Libre Baskerville", serif;
      font-size: 1.2rem;
    }
    .collection-note p { margin: 0; color: rgba(255, 250, 240, .73); font-size: .9rem; }
    .shop-link {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      margin-top: 22px;
      color: #fff8ea;
      font-size: .82rem;
      font-weight: 700;
      text-decoration-thickness: 1px;
      text-underline-offset: 5px;
    }
    .shop-link svg { width: 15px; height: 15px; }
    .story {
      position: relative;
      overflow: hidden;
      background: var(--navy);
      color: var(--cream);
    }
    .story::before {
      content: "";
      position: absolute;
      width: 460px;
      height: 460px;
      right: -210px;
      top: -240px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 50%;
      box-shadow: 0 0 0 76px rgba(255,255,255,.035), 0 0 0 152px rgba(255,255,255,.022);
    }
    .story-grid {
      position: relative;
      display: grid;
      grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr);
      gap: 90px;
      align-items: start;
    }
    .story h2 { color: var(--cream); }
    .story-copy {
      padding-top: 66px;
      border-top: 1px solid var(--line-on-dark);
    }
    .story-copy .lead {
      margin: 0;
      font-family: "Libre Baskerville", serif;
      font-size: clamp(1.35rem, 2.6vw, 2rem);
      line-height: 1.55;
    }
    .story-copy p:not(.lead) {
      max-width: 650px;
      margin: 28px 0 0;
      color: rgba(255, 250, 240, .69);
    }
    .principles {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1px;
      margin-top: 72px;
      background: var(--line-on-dark);
      border: 1px solid var(--line-on-dark);
    }
    .principle {
      min-height: 205px;
      padding: 30px;
      background: var(--navy);
    }
    .principle .number {
      color: #f4cb78;
      font-family: "Libre Baskerville", serif;
      font-style: italic;
    }
    .principle h3 { margin-top: 44px; font-size: 1.08rem; }
    .principle p { margin: 10px 0 0; color: rgba(255, 250, 240, .65); font-size: .88rem; }
    .details-grid {
      display: grid;
      grid-template-columns: .78fr 1.22fr;
      gap: 92px;
      align-items: start;
    }
    .details-intro { position: sticky; top: 35px; }
    .details-intro p { margin: 24px 0 0; color: var(--muted); }
    .detail-list { border-top: 1px solid var(--line); }
    .detail {
      display: grid;
      grid-template-columns: 46px 1fr;
      gap: 22px;
      padding: 30px 0;
      border-bottom: 1px solid var(--line);
    }
    .detail svg { width: 34px; height: 34px; stroke: var(--teal); }
    .detail h3 { font-size: 1.08rem; }
    .detail p { margin: 8px 0 0; color: var(--muted); font-size: .92rem; }
    .care {
      padding-top: 78px;
      padding-bottom: 78px;
      background: var(--paper-2);
    }
    .care-inner {
      display: grid;
      grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
      gap: 80px;
      align-items: start;
    }
    .care h2 { font-size: clamp(2rem, 4vw, 3.25rem); }
    .care-list {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 28px 38px;
      margin: 0;
      padding: 0;
      list-style: none;
      counter-reset: care;
    }
    .care-list li {
      counter-increment: care;
      padding-top: 17px;
      border-top: 2px solid var(--coral);
      color: var(--muted);
      font-size: .9rem;
    }
    .care-list li::before {
      content: "0" counter(care);
      display: block;
      margin-bottom: 8px;
      color: var(--ink);
      font-family: "Libre Baskerville", serif;
      font-size: 1.05rem;
    }
    .care-guide {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;
    }
    .care-card {
      position: relative;
      min-width: 0;
      padding: 24px 22px 24px 54px;
      background: color-mix(in srgb, var(--paper) 76%, transparent);
      border-top: 2px solid var(--coral-deep);
    }
    .care-card::before {
      content: attr(data-number);
      position: absolute;
      left: 0;
      top: 23px;
      color: var(--coral-deep);
      font-family: "DM Serif Display", serif;
      font-size: 1.12rem;
      line-height: 1;
    }
    .care-card h3 { color: var(--ink); font-size: 1.12rem; }
    .care-card p { margin: 8px 0 0; color: var(--muted); font-size: .88rem; line-height: 1.55; }
    .care-card-wide {
      grid-column: 1 / -1;
      padding: 23px 24px;
      color: var(--cream);
      background: var(--navy);
      border: 1px solid rgba(201,154,61,.4);
      border-radius: 18px 5px 18px 5px;
    }
    .care-card-wide::before { display: none; }
    .care-card-wide h3 { color: var(--gold-bright); }
    .care-card-wide p { color: rgba(255,246,232,.76); }
    .closing {
      padding: 100px 32px;
      text-align: center;
    }
    .closing p {
      max-width: 740px;
      margin: 0 auto;
      font-family: "Libre Baskerville", serif;
      font-size: clamp(1.5rem, 3vw, 2.5rem);
      line-height: 1.48;
    }
    .closing small {
      display: block;
      margin-top: 24px;
      color: var(--muted);
      font-size: .8rem;
      letter-spacing: .055em;
    }
    footer {
      padding: 30px 32px;
      border-top: 1px solid var(--line);
      color: var(--muted);
    }
    .footer-inner {
      width: min(1120px, 100%);
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      gap: 20px;
      font-size: .76rem;
    }
    .footer-inner a { text-underline-offset: 3px; }
    :focus-visible { outline: 3px solid var(--coral); outline-offset: 4px; }
    @media (max-width: 760px) {
      .topbar { padding: 18px 20px; }
      .nav-toggle { display: inline-grid; place-items: center; }
      .nav-links {
        display: none;
        position: absolute;
        top: 72px;
        left: 20px;
        right: 20px;
        align-items: stretch;
        flex-direction: column;
        gap: 0;
        padding: 8px 18px;
        border: 1px solid var(--line-on-dark);
        background: #0a2133;
        box-shadow: var(--shadow);
      }
      .nav-links.open { display: flex; }
      .nav-links a { padding: 14px 0; border-bottom: 1px solid var(--line-on-dark); }
      .nav-links a:last-child { border: 0; }
      .nav-status { border: 0; border-radius: 0; }
      .hero { min-height: 750px; align-items: end; }
      .hero::after { background: linear-gradient(180deg, rgba(5, 18, 29, .15) 0%, rgba(5, 18, 29, .78) 52%, rgba(5, 18, 29, .98) 100%); }
      .hero-image { object-position: 66% center; }
      .hero-inner { width: calc(100% - 40px); padding: 210px 0 64px; }
      h1 { font-size: clamp(3.1rem, 15vw, 4.7rem); }
      .hero-lede { font-size: 1rem; }
      .hero-meta { gap: 10px 18px; }
      .section { padding: 78px 20px; }
      .section-heading, .collection-stage, .story-grid, .details-grid, .care-inner {
        grid-template-columns: 1fr;
      }
      .section-heading { gap: 24px; }
      .collection-stage { gap: 46px; padding-top: 52px; }
      .story-grid { gap: 48px; }
      .story-copy { padding-top: 34px; }
      .principles { grid-template-columns: 1fr; }
      .principle { min-height: 0; }
      .principle h3 { margin-top: 30px; }
      .details-grid { gap: 46px; }
      .details-intro { position: static; }
      .care-inner { gap: 42px; }
      .care-list, .care-guide { grid-template-columns: 1fr; }
      .care-card-wide { grid-column: auto; }
      .closing { padding: 78px 20px; }
      .footer-inner { flex-direction: column; }
    }
    [hidden] { display: none !important; }
    body:not(.route-home) .topbar {
      position: sticky;
      top: 0;
      width: 100%;
      max-width: none;
      padding: 14px 32px;
      background: var(--plum);
      border-bottom: 1px solid var(--line-on-dark);
      box-shadow: 0 10px 28px rgba(31, 10, 37, .18);
    }
    body:not(.route-home) .nav-links a[aria-current="page"] {
      color: var(--gold-bright);
      background: rgba(255,255,255,.09);
    }
    body:not(.route-home) main { min-height: calc(100vh - 130px); }
    @media (max-width: 760px) {
      body:not(.route-home) .topbar { min-height: 68px; padding: 12px 18px; }
      body:not(.route-home) .nav-links { position: fixed; }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
    }
  

    /* Storybook treasure-map restyle */
    :root {
      --paper: #fff9ef;
      --paper-2: #f8e8ef;
      --ink: #35173c;
      --muted: #6d536f;
      --navy: #3b1746;
      --navy-2: #211029;
      --cream: #fff9ef;
      --coral: #d9699e;
      --coral-deep: #7b2e78;
      --teal: #8a4a9c;
      --gold: #c99a3d;
      --gold-bright: #efd68e;
      --lavender: #c892d0;
      --pink: #f0b9d2;
      --plum: #2b1233;
      --line: rgba(73, 31, 78, .19);
      --line-on-dark: rgba(255, 234, 197, .26);
      --shadow: 0 22px 50px rgba(65, 25, 70, .18);
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --paper: #1b1120;
        --paper-2: #28162c;
        --ink: #fff2e5;
        --muted: #d8c3d9;
        --navy: #32143c;
        --navy-2: #160b1b;
        --cream: #fff6e8;
        --coral: #ed83b4;
        --coral-deep: #e59acf;
        --teal: #c58bce;
        --gold: #dfb75f;
        --gold-bright: #f4dda0;
        --lavender: #bd79c8;
        --pink: #d589ad;
        --plum: #160b1b;
        --line: rgba(255, 230, 238, .19);
        --line-on-dark: rgba(255, 234, 197, .25);
        --shadow: 0 22px 56px rgba(0, 0, 0, .35);
      }
    }
    body {
      font-family: "Nunito Sans", sans-serif;
      background-color: var(--paper);
      background-image:
        radial-gradient(circle at 18px 18px, rgba(201,154,61,.09) 1px, transparent 1.5px),
        radial-gradient(circle at 58px 54px, rgba(123,46,120,.055) 1px, transparent 1.5px);
      background-size: 76px 76px;
    }
    h1, h2, h3 { font-family: "DM Serif Display", serif; }
    .topbar {
      max-width: 1260px;
      padding-top: 24px;
      color: var(--cream);
    }
    .nav-links { gap: 12px; }
    .nav-links a {
      padding: 8px 12px;
      font-size: .78rem;
      letter-spacing: .035em;
      border-radius: 999px;
    }
    .nav-links a:hover, .nav-links a:focus-visible {
      color: var(--gold-bright);
      background: rgba(255,255,255,.07);
    }
    .nav-status {
      padding: 9px 16px !important;
      border-color: rgba(239,214,142,.55);
      background: rgba(43,18,51,.52);
      box-shadow: inset 0 0 0 1px rgba(239,214,142,.12);
    }
    .hero {
      min-height: min(820px, 94vh);
      isolation: isolate;
      background: var(--navy-2);
    }
    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background:
        radial-gradient(circle at 84% 22%, rgba(239,214,142,.2) 0 2px, transparent 3px),
        radial-gradient(circle at 91% 36%, rgba(240,185,210,.3) 0 2px, transparent 3px),
        radial-gradient(circle at 73% 68%, rgba(239,214,142,.22) 0 1.5px, transparent 2.5px),
        radial-gradient(circle at 54% 15%, rgba(255,255,255,.2) 0 1px, transparent 2px);
      background-size: 130px 130px, 170px 170px, 110px 110px, 90px 90px;
    }
    .hero::after {
      z-index: 0;
      background: linear-gradient(90deg, rgba(27,8,35,.98) 0%, rgba(50,15,57,.9) 43%, rgba(54,18,63,.48) 72%, rgba(28,9,34,.58) 100%);
    }
    .hero-image {
      opacity: .54;
      filter: saturate(.82) sepia(.12) hue-rotate(236deg);
    }
    .hero-inner { width: min(1160px, calc(100% - 64px)); z-index: 2; }
    .hero-copy { max-width: 650px; }
    .eyebrow {
      margin-bottom: 22px;
      color: var(--gold-bright);
      letter-spacing: .12em;
    }
    .eyebrow::before {
      width: 15px;
      height: 15px;
      background: currentColor;
      clip-path: polygon(50% 0, 61% 38%, 100% 50%, 61% 62%, 50% 100%, 39% 62%, 0 50%, 39% 38%);
    }
    h1 {
      max-width: 640px;
      font-size: clamp(3.35rem, 7vw, 6.55rem);
      letter-spacing: -.035em;
      color: #fff7ed;
      text-shadow: 0 4px 0 rgba(78,26,80,.4);
    }
    .hero-lede {
      color: rgba(255,246,232,.87);
      font-family: "Nunito Sans", sans-serif;
      font-size: clamp(1.03rem, 1.7vw, 1.25rem);
      line-height: 1.65;
    }
    .hero-meta { color: rgba(255,246,232,.82); }
    .hero-meta i {
      width: 10px;
      height: 10px;
      border-radius: 0;
      background: var(--pink);
      transform: rotate(45deg);
      box-shadow: 0 0 0 2px rgba(239,214,142,.25);
    }
    .one-of-one-mark {
      display: inline-flex;
      align-items: center;
      gap: 11px;
      width: fit-content;
      padding: 10px 15px 10px 11px;
      border: 1px solid rgba(123,46,120,.32);
      border-radius: 17px 5px 17px 5px;
      background: rgba(240,185,210,.32);
      color: var(--plum);
      box-shadow: 5px 5px 0 rgba(201,154,61,.15);
    }
    .one-of-one-mark .mark-spark {
      position: relative;
      isolation: isolate;
      display: grid;
      place-items: center;
      flex: 0 0 33px;
      width: 33px;
      height: 33px;
      color: var(--gold-bright);
    }
    .one-of-one-mark .mark-spark::before,
    .one-of-one-mark .mark-spark::after {
      content: "";
      position: absolute;
      pointer-events: none;
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .one-of-one-mark .mark-spark::before {
      z-index: 0;
      inset: -4px;
      background: var(--gold);
      transform: translate(-2px, 2px);
    }
    .one-of-one-mark .mark-spark::after {
      z-index: 1;
      inset: 0;
      background: var(--coral-deep);
    }
    .one-of-one-mark .mark-spark svg { position: relative; z-index: 2; width: 17px; height: 17px; }
    .one-of-one-mark strong,
    .one-of-one-mark small { display: block; }
    .one-of-one-mark strong {
      font-size: .78rem;
      letter-spacing: .08em;
      line-height: 1.1;
      text-transform: uppercase;
    }
    .one-of-one-mark small {
      margin-top: 3px;
      color: rgba(43,18,51,.72);
      font-size: .73rem;
      line-height: 1.25;
    }
    .hero .one-of-one-mark {
      margin-top: 28px;
      border-color: rgba(239,214,142,.46);
      background: rgba(43,18,51,.68);
      color: #fff7ed;
      box-shadow: 5px 5px 0 rgba(201,154,61,.18);
    }
    .hero .one-of-one-mark small { color: rgba(255,246,232,.75); }
    .hero-sigil {
      position: absolute;
      z-index: 1;
      top: 50%;
      right: clamp(28px, 7vw, 110px);
      width: clamp(250px, 31vw, 440px);
      aspect-ratio: 1;
      transform: translateY(-45%);
      color: var(--gold-bright);
      opacity: .72;
      filter: drop-shadow(0 18px 28px rgba(20,4,24,.35));
      pointer-events: none;
    }
    .hero-sigil svg { width: 100%; height: 100%; overflow: visible; }
    .site-announcement {
      position: relative;
      z-index: 6;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 20px;
      width: min(1120px, calc(100% - 64px));
      margin: 22px auto 0;
      padding: 16px 22px;
      overflow: hidden;
      color: var(--cream);
      background: var(--plum);
      border: 1px solid rgba(239,214,142,.58);
      border-radius: 22px 7px 22px 7px;
      box-shadow: 7px 7px 0 rgba(201,154,61,.2), 0 15px 34px rgba(31,10,37,.2);
    }
    .site-announcement::after {
      content: "";
      position: absolute;
      right: 18px;
      top: -25px;
      width: 62px;
      height: 62px;
      border: 1px solid rgba(239,214,142,.24);
      transform: rotate(45deg);
      pointer-events: none;
    }
    .announcement-label {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      margin: 0;
      padding-right: 20px;
      color: var(--gold-bright);
      border-right: 1px solid rgba(239,214,142,.32);
      font-size: .7rem;
      font-weight: 800;
      letter-spacing: .12em;
      line-height: 1.2;
      text-transform: uppercase;
    }
    .announcement-label::before {
      content: "";
      width: 18px;
      height: 18px;
      flex: 0 0 18px;
      background: var(--gold);
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .announcement-message {
      position: relative;
      z-index: 1;
      margin: 0;
      color: rgba(255,246,232,.9);
      font-family: "DM Serif Display", serif;
      font-size: clamp(1.03rem, 1.8vw, 1.28rem);
      line-height: 1.35;
    }
    body.route-home .site-announcement {
      position: absolute;
      top: 92px;
      left: 50%;
      margin: 0;
      transform: translateX(-50%);
    }
    body.route-home .hero-inner { padding-top: 205px; }
    .section { position: relative; }
    .section-heading {
      grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
      border-bottom-color: var(--line);
    }
    .section-heading::before,
    .section-heading::after {
      content: "";
      position: absolute;
      pointer-events: none;
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .section-heading::before {
      right: -2px;
      bottom: -11px;
      width: 21px;
      height: 21px;
      background: var(--gold);
    }
    .section-heading::after {
      right: 2px;
      bottom: -7px;
      width: 13px;
      height: 13px;
      background: var(--coral-deep);
    }
    .section-heading { position: relative; }
    .section-label {
      color: var(--coral-deep);
      letter-spacing: .13em;
    }
    h2 { color: var(--ink); letter-spacing: -.03em; }
    .collection-stage { gap: 72px; }
    .collection-banner {
      display: grid;
      grid-template-columns: minmax(280px, .82fr) minmax(0, 1.18fr);
      min-height: 480px;
      margin: 54px 0 52px;
      overflow: hidden;
      color: var(--cream);
      background: var(--navy);
      border: 1px solid rgba(201,154,61,.38);
      clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));
      box-shadow: var(--shadow);
    }
    .collection-banner-image {
      position: relative;
      min-height: 480px;
      overflow: hidden;
      background: var(--plum);
    }
    .collection-banner-image img {
      width: 100%;
      height: 100%;
      min-height: 480px;
      object-fit: cover;
      object-position: center 52%;
    }
    .collection-banner-image::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, transparent 70%, rgba(59,23,70,.54));
      pointer-events: none;
    }
    .collection-banner-copy {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 54px clamp(34px, 5vw, 70px);
      background-image:
        radial-gradient(circle at 76% 18%, rgba(239,214,142,.22) 0 2px, transparent 3px),
        linear-gradient(45deg, transparent 48%, rgba(239,214,142,.045) 49%, rgba(239,214,142,.045) 51%, transparent 52%);
      background-size: 88px 88px, 64px 64px;
    }
    .collection-banner-copy::before {
      content: "";
      width: 52px;
      height: 52px;
      margin-bottom: 26px;
      background: var(--pink);
      clip-path: polygon(50% 0, 58% 37%, 85% 15%, 63% 42%, 100% 50%, 63% 58%, 85% 85%, 58% 63%, 50% 100%, 42% 63%, 15% 85%, 37% 58%, 0 50%, 37% 42%, 15% 15%, 42% 37%);
    }
    .collection-banner-copy h3 {
      max-width: 470px;
      color: var(--cream);
      font-size: clamp(2rem, 3.7vw, 3.35rem);
      font-weight: 400;
      letter-spacing: -.025em;
    }
    .collection-banner-copy > p {
      max-width: 480px;
      margin: 20px 0 0;
      color: rgba(255,246,232,.76);
    }
    .collection-banner-copy .one-of-one-mark {
      margin-top: 28px;
      border-color: rgba(239,214,142,.42);
      background: rgba(255,249,239,.08);
      color: var(--cream);
      box-shadow: 5px 5px 0 rgba(201,154,61,.16);
    }
    .collection-banner-copy .one-of-one-mark small { color: rgba(255,246,232,.72); }
    .spotlight-page {
      padding-top: 92px;
      background:
        radial-gradient(circle at 92% 14%, rgba(201,154,61,.15) 0 2px, transparent 3px) 0 0 / 96px 96px,
        var(--paper);
    }
    .spotlight-page .section-heading {
      grid-template-columns: minmax(max-content, 1fr) minmax(280px, 420px);
      align-items: start;
    }
    .spotlight-page .section-heading h2 {
      white-space: nowrap;
      font-size: clamp(2.25rem, 4.6vw, 4.2rem);
    }
    .spotlight-page .section-heading > p {
      padding-top: .4em;
      font-family: "Mali", "Nunito Sans", sans-serif;
      font-size: 1.08rem;
      font-weight: 600;
      line-height: 1.6;
    }
    .spotlight-feature {
      display: grid;
      grid-template-columns: minmax(320px, .95fr) minmax(0, 1.05fr);
      gap: clamp(44px, 7vw, 92px);
      align-items: center;
      margin-top: 54px;
    }
    .spotlight-photo {
      position: relative;
      min-height: 620px;
      overflow: hidden;
      background: var(--paper-2);
      border: 1px solid rgba(123,46,120,.26);
      clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px));
      box-shadow: 14px 14px 0 rgba(201,154,61,.17), var(--shadow);
    }
    .spotlight-photo img { width: 100%; height: 100%; min-height: 620px; object-fit: cover; }
    .spotlight-photo .product-badge { top: 20px; left: 20px; }
    .spotlight-copy { position: relative; }
    .spotlight-copy::before {
      content: "";
      display: block;
      width: 62px;
      height: 62px;
      margin-bottom: 26px;
      background: var(--pink);
      clip-path: polygon(50% 0, 58% 37%, 85% 15%, 63% 42%, 100% 50%, 63% 58%, 85% 85%, 58% 63%, 50% 100%, 42% 63%, 15% 85%, 37% 58%, 0 50%, 37% 42%, 15% 15%, 42% 37%);
    }
    .spotlight-copy h3 { color: var(--ink); font-size: clamp(2.4rem, 5vw, 4.5rem); }
    .spotlight-materials {
      margin: 17px 0 0;
      color: var(--coral-deep);
      font-size: .76rem;
      font-weight: 800;
      letter-spacing: .1em;
      text-transform: uppercase;
    }
    .spotlight-story {
      max-width: 620px;
      margin: 28px 0 0;
      padding-top: 27px;
      color: var(--muted);
      border-top: 1px solid var(--line);
      font-size: 1.03rem;
      line-height: 1.75;
    }
    .spotlight-action {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      margin-top: 30px;
      padding: 13px 19px;
      color: var(--cream);
      background: var(--coral-deep);
      border-radius: 16px 4px 16px 4px;
      font-size: .84rem;
      font-weight: 800;
      text-decoration: none;
      box-shadow: 5px 5px 0 rgba(201,154,61,.23);
    }
    .spotlight-action:hover, .spotlight-action:focus-visible { background: var(--plum); }
    .spotlight-action svg { width: 16px; height: 16px; }
    .category-bar {
      margin: 0 0 38px;
      padding: 22px 24px;
      background: var(--paper-2);
      border: 1px solid rgba(123,46,120,.22);
      clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
    }
    .gallery-status {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      margin: 17px 0 0;
      color: var(--muted);
      font-size: .79rem;
    }
    .gallery-status strong { color: var(--ink); }
    .product-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 34px 20px;
    }
    .product-card[hidden] { display: none; }
    .gallery-empty {
      display: none;
      position: relative;
      margin: 0;
      padding: 72px 28px 46px;
      color: var(--muted);
      text-align: center;
      border: 1px dashed var(--line);
      background: var(--paper-2);
    }
    .gallery-empty::before,
    .gallery-empty::after {
      content: "";
      position: absolute;
      left: 50%;
      pointer-events: none;
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .gallery-empty::before {
      top: 20px;
      width: 38px;
      height: 38px;
      background: var(--gold);
      transform: translateX(calc(-50% - 3px));
    }
    .gallery-empty::after {
      top: 25px;
      width: 28px;
      height: 28px;
      background: var(--coral-deep);
      transform: translateX(calc(-50% + 2px));
    }
    .gallery-empty.visible { display: block; }
    .pagination {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 8px;
      margin-top: 62px;
    }
    .pagination[hidden] { display: none; }
    .page-button {
      min-width: 42px;
      min-height: 42px;
      padding: 8px 11px;
      color: var(--ink);
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 12px 4px 12px 4px;
      font-size: .8rem;
      font-weight: 800;
      cursor: pointer;
    }
    .page-button:hover:not(:disabled), .page-button:focus-visible { border-color: var(--coral-deep); }
    .page-button[aria-current="page"] { color: var(--cream); background: var(--coral-deep); border-color: var(--coral-deep); }
    .page-button:disabled { opacity: .42; cursor: default; }
    .product-card {
      position: relative;
      min-width: 0;
      background: var(--paper);
    }
    .product-card:nth-child(even) { transform: translateY(20px); }
    .product-photo {
      position: relative;
      aspect-ratio: 3 / 4;
      overflow: hidden;
      background: var(--paper-2);
      border: 1px solid rgba(123,46,120,.22);
      clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
    }
    .product-photo::after {
      content: "";
      position: absolute;
      inset: 0;
      border: 1px solid rgba(239,214,142,.2);
      pointer-events: none;
    }
    .product-photo img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform .35s ease;
    }
    .product-card:hover .product-photo img { transform: scale(1.025); }
    .product-badge {
      position: absolute;
      z-index: 1;
      top: 12px;
      left: 12px;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 7px 10px 7px 30px;
      color: #2b1233;
      background: rgba(255,249,239,.94);
      border: 1px solid rgba(201,154,61,.58);
      border-radius: 12px 3px 12px 3px;
      box-shadow: 3px 3px 0 rgba(43,18,51,.18);
      font-size: .68rem;
      font-weight: 800;
      letter-spacing: .07em;
      line-height: 1;
      text-transform: uppercase;
    }
    .product-badge::before,
    .product-badge::after {
      content: "";
      position: absolute;
      top: 50%;
      pointer-events: none;
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .product-badge::before {
      z-index: 0;
      left: 8px;
      width: 15px;
      height: 15px;
      background: var(--gold);
      transform: translate(-2px, -43%);
    }
    .product-badge::after {
      z-index: 1;
      left: 10px;
      width: 11px;
      height: 11px;
      background: var(--coral-deep);
      transform: translateY(-50%);
    }
    .product-copy { padding: 18px 4px 0; }
    .product-type {
      margin: 0 0 7px;
      color: var(--coral-deep);
      font-size: .7rem;
      font-weight: 800;
      letter-spacing: .11em;
      text-transform: uppercase;
    }
    .product-copy h3 {
      color: var(--ink);
      font-size: 1.42rem;
      line-height: 1.15;
    }
    .product-copy p:not(.product-type) {
      margin: 10px 0 0;
      color: var(--muted);
      font-size: .86rem;
      line-height: 1.5;
    }
    .product-copy a {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      margin-top: 14px;
      color: var(--coral-deep);
      font-size: .78rem;
      font-weight: 800;
      text-underline-offset: 4px;
    }
    .product-copy a svg { width: 14px; height: 14px; }
    .collection-message .one-of-one-mark { margin-bottom: 26px; }
    .collection-message h3 { color: var(--ink); }
    .collection-note {
      overflow: hidden;
      padding: 104px 34px 36px;
      color: var(--plum);
      background: var(--pink);
      border: 1px solid rgba(84,31,86,.27);
      border-radius: 26px 6px 26px 6px;
      box-shadow: 12px 12px 0 rgba(201,154,61,.2), var(--shadow);
    }
    .collection-note::before {
      width: 84px;
      height: 84px;
      top: -28px;
      right: -18px;
      border-radius: 50%;
      background: var(--coral-deep);
      box-shadow: -64px 18px 0 -29px var(--gold), -24px 72px 0 -35px var(--lavender);
    }
    .collection-note::after {
      content: "";
      position: absolute;
      left: 34px;
      top: 34px;
      width: 45px;
      height: 45px;
      background: var(--coral-deep);
      clip-path: polygon(50% 0, 58% 37%, 85% 15%, 63% 42%, 100% 50%, 63% 58%, 85% 85%, 58% 63%, 50% 100%, 42% 63%, 15% 85%, 37% 58%, 0 50%, 37% 42%, 15% 15%, 42% 37%);
      filter: drop-shadow(0 0 0 var(--gold));
    }
    .collection-note strong { font-size: 1.36rem; }
    .collection-note p { color: rgba(43,18,51,.75); }
    .shop-link {
      color: var(--plum);
      text-decoration-color: var(--coral-deep);
      font-weight: 800;
    }
    .story {
      background-color: var(--navy);
      background-image:
        linear-gradient(45deg, transparent 48%, rgba(239,214,142,.06) 49%, rgba(239,214,142,.06) 51%, transparent 52%),
        linear-gradient(-45deg, transparent 48%, rgba(239,214,142,.045) 49%, rgba(239,214,142,.045) 51%, transparent 52%);
      background-size: 72px 72px;
    }
    .story::before {
      width: 510px;
      height: 510px;
      top: -286px;
      border-color: rgba(239,214,142,.18);
      box-shadow: 0 0 0 68px rgba(239,214,142,.045), 0 0 0 136px rgba(240,185,210,.025);
    }
    .story h2 { color: var(--cream); }
    .story .section-label { color: var(--pink); }
    .story-copy .lead { color: #fff7ed; }
    .story-copy p:not(.lead) { color: rgba(255,246,232,.75); }
    .principles {
      gap: 12px;
      background: transparent;
      border: 0;
    }
    .principle {
      position: relative;
      overflow: hidden;
      min-height: 220px;
      padding: 31px;
      background: rgba(255,249,239,.07);
      border: 1px solid rgba(239,214,142,.24);
      clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
    }
    .principle::after {
      content: "";
      position: absolute;
      right: 22px;
      top: 22px;
      width: 18px;
      height: 18px;
      border: 1px solid var(--pink);
      transform: rotate(45deg);
    }
    .principle .number { color: var(--gold-bright); }
    .principle h3 { color: var(--cream); font-size: 1.2rem; }
    .principle p { color: rgba(255,246,232,.71); }
    .details-intro::before {
      content: "";
      display: block;
      width: 58px;
      height: 58px;
      margin-bottom: 24px;
      background: var(--pink);
      clip-path: polygon(50% 0, 58% 37%, 85% 15%, 63% 42%, 100% 50%, 63% 58%, 85% 85%, 58% 63%, 50% 100%, 42% 63%, 15% 85%, 37% 58%, 0 50%, 37% 42%, 15% 15%, 42% 37%);
      box-shadow: inset 0 0 0 12px var(--lavender);
    }
    .detail { grid-template-columns: 54px 1fr; padding: 28px 0; }
    .detail svg {
      width: 40px;
      height: 40px;
      padding: 8px;
      stroke: var(--coral-deep);
      border: 1px solid rgba(201,154,61,.55);
      transform: rotate(45deg);
    }
    .detail svg * { transform-origin: 24px 24px; transform: rotate(-45deg); }
    .detail h3 { color: var(--ink); font-size: 1.15rem; }
    .care {
      background-color: var(--paper-2);
      background-image:
        radial-gradient(circle at 12% 34%, rgba(201,154,61,.14) 0 2px, transparent 2.5px),
        radial-gradient(circle at 88% 66%, rgba(123,46,120,.1) 0 2px, transparent 2.5px);
      background-size: 100px 100px, 126px 126px;
      border-top: 1px solid rgba(201,154,61,.2);
      border-bottom: 1px solid rgba(201,154,61,.2);
    }
    .care-list li { border-top-color: var(--coral-deep); }
    .care-list li::before { color: var(--coral-deep); }
    .closing {
      position: relative;
      overflow: hidden;
    }
    .closing::before, .closing::after {
      content: "";
      position: absolute;
      top: 50%;
      width: 120px;
      height: 120px;
      border: 1px solid rgba(201,154,61,.34);
      transform: translateY(-50%) rotate(45deg);
    }
    .closing::before { left: -80px; }
    .closing::after { right: -80px; }
    .closing p { color: var(--ink); }
    .closing small { color: var(--coral-deep); font-weight: 800; }
    .social-follow {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 32px;
      align-items: center;
      margin-top: 76px;
      padding: 34px 38px;
      overflow: hidden;
      color: var(--cream);
      background: var(--navy);
      border: 1px solid rgba(201,154,61,.42);
      clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
      box-shadow: 9px 9px 0 rgba(201,154,61,.16);
    }
    .social-follow::after {
      content: "";
      position: absolute;
      right: 25%;
      top: -24px;
      width: 58px;
      height: 58px;
      border: 1px solid rgba(239,214,142,.26);
      transform: rotate(45deg);
    }
    .social-follow-copy { position: relative; z-index: 1; }
    .social-follow-copy strong {
      display: block;
      color: var(--gold-bright);
      font-family: "DM Serif Display", serif;
      font-size: 1.55rem;
      font-weight: 400;
    }
    .social-follow-copy p {
      max-width: 690px;
      margin: 7px 0 0;
      color: rgba(255,246,232,.74);
      font-size: .91rem;
    }
    .instagram-link {
      position: relative;
      z-index: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      min-height: 46px;
      padding: 11px 17px;
      color: var(--plum);
      background: var(--pink);
      border: 1px solid rgba(239,214,142,.52);
      border-radius: 16px 4px 16px 4px;
      font-size: .82rem;
      font-weight: 800;
      text-decoration: none;
      white-space: nowrap;
      box-shadow: 4px 4px 0 rgba(201,154,61,.24);
    }
    .instagram-link:hover, .instagram-link:focus-visible { background: var(--gold-bright); }
    .instagram-link svg { width: 19px; height: 19px; }
    footer {
      background: var(--plum);
      border-top-color: rgba(239,214,142,.25);
      color: rgba(255,246,232,.74);
    }
    footer a { color: var(--gold-bright); }
    .footer-links { display: flex; flex-wrap: wrap; gap: 10px 20px; }
    :focus-visible { outline-color: var(--gold-bright); }
    @media (prefers-color-scheme: dark) {
      .collection-note { color: #2b1233; background: #d89ab9; }
      .collection-note p { color: rgba(43,18,51,.78); }
      .shop-link { color: #2b1233; }
      .collection-message .one-of-one-mark { color: #2b1233; background: #d89ab9; }
      .collection-message .one-of-one-mark small { color: rgba(43,18,51,.78); }
    }
    @media (max-width: 1180px) and (min-width: 981px) {
      .nav-links .nav-brand-banner { display: none; }
    }
    @media (max-width: 980px) and (min-width: 761px) {
      .topbar { padding: 18px 24px; }
      .nav-toggle {
        display: inline-grid;
        place-items: center;
        order: 3;
        border-color: rgba(239,214,142,.58);
        color: var(--gold-bright);
        background: rgba(43,18,51,.78);
      }
      .nav-links {
        display: none;
        position: absolute;
        top: 76px;
        left: 24px;
        right: 24px;
        align-items: stretch;
        flex-direction: column;
        gap: 0;
        padding: 8px 14px;
        background: #2b1233;
        border: 1px solid rgba(239,214,142,.38);
        border-radius: 18px 5px 18px 5px;
        box-shadow: var(--shadow);
      }
      .nav-links.open { display: flex; }
      .nav-links a { padding: 14px 0; border-bottom: 1px solid rgba(239,214,142,.2); }
      .nav-links a:last-child { border: 0; }
      .nav-status { border-radius: 0; }
      .nav-brand-banner {
        width: 100%;
        min-width: 0;
        margin: 3px 0 8px;
        padding: 12px 13px;
      }
      body:not(.route-home) .nav-links { position: fixed; top: 76px; }
      .hero-sigil { right: -70px; opacity: .43; }
      .principles { grid-template-columns: repeat(2, 1fr); }
      .collection-banner { grid-template-columns: minmax(250px, .9fr) minmax(0, 1.1fr); }
      .spotlight-feature { grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr); gap: 46px; }
      .spotlight-photo, .spotlight-photo img { min-height: 500px; }
      .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 38px 18px; }
      .product-copy h3 { font-size: 1.22rem; }
    }
    @media (max-width: 760px) {
      .topbar { padding: 12px 14px; }
      .site-brand {
        width: min(205px, calc(100vw - 86px));
        min-height: 44px;
        padding: 7px 9px 7px 8px;
      }
      .site-brand .nav-brand-copy strong { font-size: clamp(.69rem, 3.3vw, .8rem); }
      .site-brand .nav-brand-copy span { font-size: .5rem; }
      .nav-toggle {
        display: inline-grid;
        border-color: rgba(239,214,142,.58);
        color: var(--gold-bright);
        background: rgba(43,18,51,.78);
      }
      .nav-links {
        top: 68px;
        left: 18px;
        right: 18px;
        padding: 8px 14px;
        background: #2b1233;
        border-color: rgba(239,214,142,.38);
        border-radius: 18px 5px 18px 5px;
      }
      .nav-links a { border-bottom-color: rgba(239,214,142,.2); }
      .nav-brand-banner {
        width: 100%;
        min-width: 0;
        margin: 3px 0 8px;
        padding: 12px 13px;
        box-shadow: 3px 3px 0 rgba(201,154,61,.18);
      }
      .nav-brand-star { flex-basis: 40px; width: 40px; height: 40px; }
      .nav-brand-copy strong { font-size: 1rem; }
      .site-announcement {
        grid-template-columns: 1fr;
        gap: 7px;
        width: calc(100% - 36px);
        margin-top: 16px;
        padding: 15px 17px 16px;
        border-radius: 18px 5px 18px 5px;
      }
      .announcement-label {
        gap: 7px;
        padding: 0;
        border-right: 0;
        font-size: .64rem;
      }
      .announcement-label::before { width: 14px; height: 14px; flex-basis: 14px; }
      .announcement-message { font-size: 1rem; }
      body.route-home .site-announcement { top: 78px; }
      body.route-home .hero-inner { padding-top: 245px; }
      .hero { min-height: 760px; }
      .hero::after { background: linear-gradient(180deg, rgba(38,11,45,.48) 0%, rgba(43,13,51,.76) 48%, rgba(27,8,35,.98) 100%); }
      .hero-image { object-position: 64% center; opacity: .48; }
      .hero-sigil {
        top: 22%;
        right: -58px;
        width: 260px;
        transform: none;
        opacity: .42;
      }
      .hero-inner { width: calc(100% - 40px); padding-top: 225px; }
      h1 { font-size: clamp(3rem, 15.5vw, 4.6rem); }
      .section { padding: 76px 20px; }
      .collection-stage { gap: 42px; }
      .collection-banner {
        grid-template-columns: 1fr;
        min-height: 0;
        margin: 42px 0 44px;
      }
      .collection-banner-image { min-height: 0; aspect-ratio: 3 / 4; }
      .collection-banner-image img { min-height: 0; object-position: center; }
      .collection-banner-image::after { background: linear-gradient(180deg, transparent 76%, rgba(59,23,70,.48)); }
      .collection-banner-copy { padding: 38px 28px 42px; }
      .collection-banner-copy h3 { font-size: 2.15rem; }
      .spotlight-page { padding-top: 70px; }
      .spotlight-page .section-heading {
        grid-template-columns: 1fr;
        gap: 18px;
      }
      .spotlight-page .section-heading h2 { font-size: clamp(2.1rem, 11vw, 3.1rem); }
      .spotlight-page .section-heading > p { padding-top: 0; }
      .spotlight-feature { grid-template-columns: 1fr; gap: 46px; margin-top: 40px; }
      .spotlight-photo, .spotlight-photo img { min-height: 0; }
      .spotlight-photo { aspect-ratio: 4 / 5; }
      .spotlight-copy::before { width: 50px; height: 50px; margin-bottom: 20px; }
      .category-bar { padding: 18px; }
      .gallery-status { display: grid; gap: 4px; }
      .product-grid { grid-template-columns: 1fr; gap: 42px; }
      .product-card:nth-child(even) { transform: none; }
      .product-photo { aspect-ratio: 4 / 5; }
      .product-copy h3 { font-size: 1.55rem; }
      .social-follow {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-top: 58px;
        padding: 30px 26px 32px;
      }
      .instagram-link { width: 100%; white-space: normal; }
      .collection-note { padding: 98px 28px 32px; }
      .principles { gap: 10px; }
      .principle { min-height: 0; }
      .details-intro::before { width: 48px; height: 48px; }
      .detail { grid-template-columns: 48px 1fr; gap: 16px; }
      .care-list { gap: 22px; }
      .closing::before, .closing::after { width: 82px; height: 82px; }
      .footer-inner { gap: 10px; }
    }
  

    /* Album-grid storefront */
    .route-store #store {
      padding-top: 72px;
      padding-bottom: 92px;
    }
    .route-store #store .section-heading { margin-bottom: 46px; }
    .category-bar {
      margin: 0 0 44px;
      padding: 0;
      background: transparent;
      border: 0;
      clip-path: none;
    }
    .category-bar-heading {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 28px;
      margin-bottom: 18px;
    }
    .category-bar-heading .section-label { margin: 0; }
    .category-bar-heading .gallery-status {
      flex: 1;
      justify-content: flex-end;
      margin: 0;
      text-align: right;
    }
    .category-filter {
      position: relative;
      width: min(360px, 100%);
    }
    .filter-toggle {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
      width: 100%;
      min-height: 52px;
      padding: 13px 17px;
      color: #fff9ef;
      background: var(--plum);
      border: 1px solid rgba(123,46,120,.34);
      border-radius: 16px 5px 16px 5px;
      box-shadow: 0 10px 24px rgba(50,18,57,.14);
      cursor: pointer;
    }
    .filter-toggle:hover,
    .filter-toggle:focus-visible { border-color: var(--gold-bright); }
    .filter-toggle svg {
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
      transition: transform .2s ease;
    }
    .filter-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
    .filter-menu {
      position: absolute;
      z-index: 8;
      top: calc(100% + 8px);
      left: 0;
      width: 100%;
      margin: 0;
      padding: 7px;
      list-style: none;
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 10px 3px 14px 5px;
      box-shadow: 0 18px 38px rgba(50,18,57,.2);
    }
    .filter-menu[hidden] { display: none; }
    .filter-option {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      width: 100%;
      padding: 10px 11px;
      color: var(--ink);
      text-align: left;
      background: transparent;
      border: 0;
      border-radius: 7px 2px 7px 2px;
      cursor: pointer;
    }
    .filter-option:hover,
    .filter-option:focus-visible { background: var(--paper-2); }
    .filter-option[aria-checked="true"] {
      color: var(--coral-deep);
      font-weight: 800;
    }
    .filter-option[aria-checked="true"]::after {
      content: "✓";
      color: var(--gold);
      font-weight: 800;
    }
    .product-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 18px;
    }
    .product-card {
      position: relative;
      isolation: isolate;
      aspect-ratio: 1;
      overflow: hidden;
      background: var(--plum);
      border: 1px solid rgba(123,46,120,.24);
      border-radius: 27px;
      box-shadow: 0 12px 30px rgba(50,18,57,.15);
    }
    .product-card:nth-child(even) { transform: none; }
    .product-card::after { display: none; }
    .product-card:hover,
    .product-card:focus-within { border-color: var(--gold); }
    .product-photo {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      aspect-ratio: auto;
      border: 0;
      border-radius: inherit;
      clip-path: none;
    }
    .product-photo::after { display: none; }
    .product-photo img { object-position: center; }
    .product-badge {
      top: 11px;
      left: 11px;
      padding: 6px 8px 6px 27px;
      border-radius: 999px;
      box-shadow: 0 3px 10px rgba(20,7,25,.22);
      font-size: .57rem;
      letter-spacing: .045em;
    }
    .product-badge::before { width: 8px; height: 8px; flex-basis: 8px; }
    .product-copy {
      position: absolute;
      z-index: 2;
      inset: 0;
      padding: 0;
      color: transparent;
      pointer-events: none;
    }
    .product-copy .product-type,
    .product-copy h3,
    .product-copy p:not(.product-type) { display: none; }
    .product-copy a,
    .product-detail-trigger {
      position: absolute;
      inset: 0;
      display: block;
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
      overflow: hidden;
      color: transparent;
      background: transparent;
      border: 0;
      text-decoration: none;
      cursor: pointer;
      pointer-events: auto;
    }
    .product-copy a::after { display: none; }
    .product-copy a svg { display: none; }
    .route-store .product-detail-trigger {
      margin: 0;
      color: transparent;
      text-decoration: none;
    }
    .gallery-empty {
      border-radius: 24px;
      border-style: solid;
    }
    @media (max-width: 980px) {
      .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    }
    @media (max-width: 760px) {
      .route-store #store { padding: 52px 12px 72px; }
      .route-store #store .section-heading {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
        margin-bottom: 34px;
        padding: 0 8px 26px;
      }
      .route-store #store .section-heading h2 {
        max-width: 100%;
        font-size: clamp(2.25rem, 12vw, 3.5rem);
        line-height: 1.08;
        hyphens: none;
        overflow-wrap: normal;
        word-break: normal;
      }
      .route-store #store .section-heading h2 .no-break { white-space: nowrap; }
      .route-store #store .section-heading > p { position: static; }
      .category-bar { margin-bottom: 30px; }
      .category-bar-heading {
        display: grid;
        gap: 7px;
        margin: 0 8px 14px;
      }
      .category-bar-heading .gallery-status {
        display: grid;
        justify-content: start;
        gap: 2px;
        text-align: left;
      }
      .category-filter { width: 100%; }
      .product-grid { gap: 10px; }
      .product-card { border-radius: 20px; }
      .product-badge {
        top: 7px;
        left: 7px;
        gap: 4px;
        padding: 4px 5px 4px 20px;
        font-size: .46rem;
      }
      .product-badge::before {
        display: block;
        left: 5px;
        width: 11px;
        height: 11px;
      }
      .product-badge::after {
        left: 6px;
        width: 8px;
        height: 8px;
      }
      .product-copy { padding: 28px 8px 9px; }
      .product-copy .product-type { font-size: .49rem; }
      .product-copy h3 { font-size: clamp(.76rem, 3.6vw, 1rem); }
      .product-copy a { margin-top: 5px; font-size: .55rem; }
      .product-copy a svg { display: none; }
      .pagination { margin-top: 38px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .filter-toggle svg,
      .product-photo img,
      .spotlight-gallery,
      .product-dialog-gallery { transition: none; }
    }

    /* Playful, paged spotlight albums */
    .spotlight-gallery-section {
      margin: 70px 0 82px;
      padding-top: 34px;
      border-top: 1px solid var(--line);
    }
    .spotlight-gallery-heading {
      display: flex;
      justify-content: space-between;
      align-items: end;
      gap: 36px;
      margin-bottom: 30px;
    }
    .spotlight-gallery-heading h3 { color: var(--ink); font-size: clamp(2rem, 4vw, 3.25rem); }
    .spotlight-gallery-heading p:last-child { max-width: 430px; margin: 0; color: var(--muted); }
    .spotlight-albums { display: grid; gap: 34px; }
    .spotlight-album {
      --album-gap: 15px;
      --album-columns: 3;
      position: relative;
      padding: 22px 22px 25px;
      overflow: hidden;
      background: var(--paper-2);
      border: 1px solid rgba(123,46,120,.22);
      border-radius: 30px 8px 30px 8px;
      box-shadow: 9px 9px 0 rgba(201,154,61,.14);
    }
    .spotlight-album:nth-child(even) { border-radius: 8px 30px 8px 30px; }
    .spotlight-album::before {
      content: "";
      position: absolute;
      right: 25px;
      top: 25px;
      width: 24px;
      height: 24px;
      background: var(--gold);
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .spotlight-album-header {
      position: relative;
      z-index: 1;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 18px;
      margin-bottom: 18px;
      padding-right: 46px;
    }
    .spotlight-album-title { margin: 0; color: var(--ink); font-family: "DM Serif Display", serif; font-size: 1.3rem; font-weight: 400; }
    .spotlight-album-count { margin: 0; color: var(--muted); font-size: .76rem; font-weight: 700; }
    .spotlight-carousel-viewport { overflow: hidden; }
    .spotlight-gallery {
      display: flex;
      gap: var(--album-gap);
      transform: translateX(calc(var(--album-page, 0) * (-100% - var(--album-gap))));
      transition: transform .45s cubic-bezier(.22,.74,.25,1);
      will-change: transform;
    }
    .spotlight-gallery figure {
      position: relative;
      flex: 0 0 calc((100% - (var(--album-gap) * (var(--album-columns) - 1))) / var(--album-columns));
      min-width: 0;
      margin: 0;
      aspect-ratio: 4 / 5;
      overflow: hidden;
      background: var(--paper);
      border: 7px solid var(--paper);
      border-bottom-width: 28px;
      border-radius: 9px 4px 10px 5px;
      box-shadow: 0 8px 20px rgba(65,25,70,.16);
    }
    .spotlight-gallery figure:nth-child(3n + 1) { transform: rotate(-.7deg); }
    .spotlight-gallery figure:nth-child(3n + 2) { transform: rotate(.55deg); }
    .spotlight-gallery img { width: 100%; height: 100%; object-fit: cover; }
    .spotlight-product-trigger {
      position: relative;
      display: block;
      width: 100%;
      height: 100%;
      padding: 0;
      color: inherit;
      background: transparent;
      border: 0;
      cursor: pointer;
    }
    .spotlight-product-trigger:focus-visible { outline: 3px solid var(--coral-deep); outline-offset: -3px; }
    .spotlight-product-trigger .spotlight-product-id {
      position: absolute;
      inset: auto 7px 7px auto;
      padding: 3px 7px;
      color: #102b43;
      background: rgba(255, 250, 240, .92);
      border-radius: 999px;
      font-size: .68rem;
      font-weight: 800;
      letter-spacing: .08em;
      text-align: center;
    }
    .spotlight-closeup {
      position: absolute;
      z-index: 2;
      right: 7px;
      bottom: 8px;
      width: 36%;
      aspect-ratio: 1;
      overflow: hidden;
      background: var(--paper);
      border: 4px solid var(--gold-bright);
      border-radius: 50%;
      box-shadow: 0 7px 16px rgba(43,18,51,.34), 0 0 0 3px rgba(255,249,239,.78);
      pointer-events: none;
    }
    .spotlight-closeup.left { right: auto; left: 7px; }
    .spotlight-closeup img { transform: scale(2.15); transform-origin: 50% 45%; }
    .spotlight-closeup.focus-high img { transform-origin: 50% 28%; }
    .spotlight-closeup.focus-low img { transform-origin: 50% 68%; }
    .spotlight-closeup::after {
      content: "";
      position: absolute;
      inset: 0;
      border: 1px solid rgba(123,46,120,.28);
      border-radius: inherit;
    }
    .spotlight-album-controls {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-top: 20px;
    }
    .spotlight-album-progress { color: var(--muted); font-size: .76rem; font-weight: 800; }
    .spotlight-album-buttons { display: flex; gap: 8px; }
    .spotlight-album-button {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      padding: 0;
      color: var(--cream);
      background: var(--plum);
      border: 1px solid rgba(201,154,61,.55);
      border-radius: 50%;
      cursor: pointer;
    }
    .spotlight-album-button:hover:not(:disabled), .spotlight-album-button:focus-visible { background: var(--coral-deep); }
    .spotlight-album-button:disabled { opacity: .34; cursor: default; }
    .spotlight-album-button svg { width: 18px; height: 18px; }
    .product-detail-trigger {
      position: static;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      margin-top: 8px;
      padding: 0;
      color: var(--gold-bright);
      background: transparent;
      border: 0;
      font-size: .67rem;
      font-weight: 800;
      text-decoration: underline;
      text-underline-offset: 4px;
      cursor: pointer;
      pointer-events: auto;
    }
    .product-detail-trigger::after { content: ""; position: absolute; inset: 0; }
    .product-dialog[hidden] { display: none; }
    .product-dialog {
      position: fixed;
      z-index: 40;
      inset: 0;
      display: grid;
      place-items: center;
      padding: 28px;
      background: rgba(20,7,25,.82);
      overflow: auto;
    }
    .product-dialog-panel {
      position: relative;
      width: min(1050px, 100%);
      max-height: calc(100vh - 56px);
      overflow: auto;
      padding: clamp(24px, 4vw, 48px);
      color: var(--ink);
      background: var(--paper);
      border: 1px solid rgba(239,214,142,.5);
      border-radius: 30px 8px 30px 8px;
      box-shadow: 0 28px 80px rgba(0,0,0,.42);
    }
    .product-dialog-close {
      position: sticky;
      z-index: 2;
      top: 0;
      float: right;
      width: 44px;
      height: 44px;
      margin: -10px -10px 6px 18px;
      color: var(--cream);
      background: var(--plum);
      border: 1px solid rgba(239,214,142,.55);
      border-radius: 50%;
      font-size: 1.45rem;
      line-height: 1;
      cursor: pointer;
    }
    .product-dialog-id { margin: 0 0 7px; color: var(--coral-deep); font-size: .72rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
    .product-dialog h2 { max-width: 760px; font-size: clamp(2.15rem, 5vw, 4rem); }
    .product-dialog-blurb { max-width: 760px; margin: 14px 0 0; color: var(--muted); font-size: 1.03rem; }
    .product-dialog-media {
      position: relative;
      max-width: 680px;
      margin: 30px auto 0;
      overflow: hidden;
      background: var(--plum);
      border-radius: 22px 7px 22px 7px;
    }
    .product-dialog-gallery {
      display: flex;
      margin: 0;
      transform: translateX(calc(var(--product-photo, 0) * -100%));
      transition: transform .4s cubic-bezier(.22,.74,.25,1);
      touch-action: pan-y;
    }
    .product-dialog-gallery img {
      flex: 0 0 100%;
      width: 100%;
      height: min(62vh, 700px);
      object-fit: contain;
      background: var(--plum);
    }
    .product-dialog-nav {
      position: absolute;
      top: 50%;
      display: grid;
      place-items: center;
      width: 44px;
      height: 44px;
      padding: 0;
      color: #fff9ef;
      background: rgba(43,18,51,.8);
      border: 1px solid rgba(239,214,142,.56);
      border-radius: 50%;
      transform: translateY(-50%);
      cursor: pointer;
    }
    .product-dialog-nav:hover:not(:disabled), .product-dialog-nav:focus-visible { background: var(--coral-deep); }
    .product-dialog-nav:disabled { opacity: .25; cursor: default; }
    .product-dialog-nav svg { width: 19px; height: 19px; }
    .product-dialog-previous { left: 12px; }
    .product-dialog-next { right: 12px; }
    .product-dialog-progress { margin: 10px 0 0; color: var(--muted); font-size: .76rem; font-weight: 800; text-align: center; }
    .product-dialog-caption { max-width: 820px; margin: 24px 0 0; padding-top: 22px; border-top: 1px solid var(--line); color: var(--muted); white-space: pre-line; }
    .product-dialog-caption strong { color: var(--ink); }
    .product-dialog-etsy {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      margin-top: 22px;
      padding: 13px 18px;
      color: var(--cream);
      background: var(--coral-deep);
      border-radius: 16px 4px 16px 4px;
      font-size: .84rem;
      font-weight: 800;
      text-decoration: none;
      box-shadow: 5px 5px 0 rgba(201,154,61,.22);
    }
    .product-dialog-shop-links {
      display: grid;
      justify-items: start;
      gap: 10px;
      margin-top: 22px;
    }
    .product-dialog-shop-links .product-dialog-etsy { margin-top: 0; }
    .product-dialog-etsy:hover, .product-dialog-etsy:focus-visible { background: var(--plum); }
    .product-dialog-etsy svg { width: 16px; height: 16px; }
    body.dialog-open { overflow: hidden; }

    /* Contact page */
    .contact-page {
      min-height: calc(100vh - 70px);
      padding-top: 100px;
      background:
        radial-gradient(circle at 88% 20%, rgba(201,154,61,.15) 0 2px, transparent 3px) 0 0 / 98px 98px,
        var(--paper);
    }
    .contact-intro {
      display: grid;
      grid-template-columns: minmax(0, .82fr) minmax(340px, 1.18fr);
      gap: clamp(48px, 8vw, 100px);
      align-items: start;
    }
    .contact-intro h2 { max-width: 560px; }
    .contact-copy {
      padding-top: 19px;
      border-top: 1px solid var(--line);
    }
    .contact-lede {
      margin: 0;
      color: var(--ink);
      font-family: "DM Serif Display", serif;
      font-size: clamp(1.35rem, 2.4vw, 1.95rem);
      line-height: 1.42;
    }
    .contact-copy > p:not(.contact-lede) {
      max-width: 610px;
      margin: 20px 0 0;
      color: var(--muted);
    }
    .contact-options {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      margin-top: 58px;
    }
    .contact-option {
      position: relative;
      min-height: 220px;
      padding: 31px 29px;
      background: var(--paper-2);
      border: 1px solid var(--line);
      clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
    }
    .contact-option::after {
      content: "";
      position: absolute;
      top: 27px;
      right: 27px;
      width: 17px;
      height: 17px;
      background: var(--gold);
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
    .contact-option .number {
      color: var(--coral-deep);
      font-family: "DM Serif Display", serif;
      font-style: italic;
    }
    .contact-option h3 { margin-top: 38px; color: var(--ink); font-size: 1.3rem; }
    .contact-option p { margin: 10px 0 0; color: var(--muted); font-size: .9rem; }
    .contact-invitation {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 34px;
      align-items: center;
      margin-top: 48px;
      padding: 34px 38px;
      color: var(--cream);
      background: var(--navy);
      border: 1px solid rgba(201,154,61,.42);
      border-radius: 25px 6px 25px 6px;
      box-shadow: 9px 9px 0 rgba(201,154,61,.16);
    }
    .contact-invitation strong {
      display: block;
      color: var(--gold-bright);
      font-family: "DM Serif Display", serif;
      font-size: 1.55rem;
      font-weight: 400;
    }
    .contact-invitation p {
      max-width: 670px;
      margin: 6px 0 0;
      color: rgba(255,246,232,.73);
      font-size: .9rem;
    }
    .contact-action {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      min-height: 48px;
      padding: 12px 18px;
      color: var(--plum);
      background: var(--pink);
      border: 1px solid rgba(239,214,142,.55);
      border-radius: 16px 4px 16px 4px;
      font-size: .83rem;
      font-weight: 800;
      text-decoration: none;
      white-space: nowrap;
      box-shadow: 4px 4px 0 rgba(201,154,61,.24);
    }
    .contact-action:hover, .contact-action:focus-visible { background: var(--gold-bright); }
    .contact-action svg { width: 19px; height: 19px; }
    .route-contact footer a[href*="instagram.com"] { display: none; }

    .custom-work-promo {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 36px;
      align-items: center;
      width: min(1120px, calc(100% - 64px));
      margin: 54px auto;
      padding: 38px 42px;
      overflow: hidden;
      color: var(--cream);
      background: var(--navy);
      border: 1px solid rgba(201,154,61,.46);
      clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
      box-shadow: 10px 10px 0 rgba(201,154,61,.16);
    }
    .custom-work-promo::before {
      content: "";
      position: absolute;
      right: 28%;
      top: -35px;
      width: 76px;
      height: 76px;
      border: 1px solid rgba(239,214,142,.3);
      transform: rotate(45deg);
    }
    .custom-work-promo .section-label { margin-bottom: 8px; color: var(--pink); }
    .custom-work-promo h2,
    .custom-work-promo h3 {
      max-width: 760px;
      color: var(--cream);
      font-size: clamp(2rem, 4vw, 3.3rem);
      line-height: 1.08;
    }
    .custom-work-promo p:not(.section-label) {
      max-width: 680px;
      margin: 13px 0 0;
      color: rgba(255,246,232,.74);
    }
    .custom-work-promo .contact-action { position: relative; z-index: 1; }
    .spotlight-page .custom-work-promo {
      width: 100%;
      margin: 52px 0 66px;
    }

    .contact-form-wrap {
      display: grid;
      grid-template-columns: minmax(0, .72fr) minmax(360px, 1.28fr);
      gap: clamp(38px, 7vw, 84px);
      align-items: start;
      margin-top: 58px;
      padding: 42px;
      background: var(--paper-2);
      border: 1px solid var(--line);
      border-radius: 28px 7px 28px 7px;
      box-shadow: 9px 9px 0 rgba(201,154,61,.13);
    }
    .contact-form-intro h3 {
      color: var(--ink);
      font-size: clamp(2rem, 3.5vw, 3rem);
    }
    .contact-form-intro p:not(.section-label) {
      margin: 16px 0 0;
      color: var(--muted);
    }
    .contact-form {
      display: grid;
      gap: 19px;
    }
    .contact-field { display: grid; gap: 8px; }
    .contact-field label {
      color: var(--ink);
      font-size: .78rem;
      font-weight: 800;
      letter-spacing: .055em;
    }
    .contact-field input,
    .contact-field textarea {
      width: 100%;
      padding: 13px 14px;
      color: var(--ink);
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 12px 4px 12px 4px;
      font: inherit;
    }
    .contact-field textarea { min-height: 170px; resize: vertical; }
    .contact-field input::placeholder,
    .contact-field textarea::placeholder { color: color-mix(in srgb, var(--muted) 74%, transparent); }
    .contact-field input:focus,
    .contact-field textarea:focus { border-color: var(--coral-deep); outline: 3px solid color-mix(in srgb, var(--gold) 35%, transparent); outline-offset: 2px; }
    .contact-submit {
      justify-self: start;
      min-height: 49px;
      padding: 12px 19px;
      color: var(--cream);
      background: var(--coral-deep);
      border: 1px solid rgba(201,154,61,.5);
      border-radius: 16px 4px 16px 4px;
      box-shadow: 4px 4px 0 rgba(201,154,61,.22);
      font-weight: 800;
      cursor: pointer;
    }
    .contact-submit:hover, .contact-submit:focus-visible { background: var(--plum); }
    .contact-form-note {
      margin: -5px 0 0;
      color: var(--muted);
      font-size: .78rem;
    }

    /* A richer maker story: lab curiosity meets the treasure hunt */
    .route-story .story { min-height: calc(100vh - 70px); }
    .route-story .story-grid {
      grid-template-columns: minmax(270px, .72fr) minmax(0, 1.28fr);
      gap: clamp(52px, 8vw, 104px);
    }
    .story-title-note {
      max-width: 300px;
      margin: 24px 0 0;
      color: rgba(255,246,232,.66);
      font-size: .88rem;
      line-height: 1.65;
    }
    .story-copy .story-detail {
      max-width: 680px;
      margin-top: 20px;
    }
    .story-copy .story-detail strong { color: var(--gold-bright); }
    .story-bridge {
      position: relative;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1px;
      margin-top: 58px;
      overflow: hidden;
      color: var(--cream);
      background: rgba(239,214,142,.25);
      border: 1px solid rgba(239,214,142,.28);
      clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
    }
    .story-bridge-panel {
      position: relative;
      min-height: 190px;
      padding: 33px clamp(28px, 4vw, 48px);
      background: rgba(255,249,239,.065);
    }
    .story-bridge-panel:last-child { background: rgba(240,185,210,.11); }
    .story-bridge-label {
      display: block;
      margin-bottom: 12px;
      color: var(--pink);
      font-size: .7rem;
      font-weight: 800;
      letter-spacing: .13em;
      text-transform: uppercase;
    }
    .story-bridge strong {
      display: block;
      max-width: 420px;
      color: #fff7ed;
      font-family: "DM Serif Display", serif;
      font-size: clamp(1.45rem, 2.5vw, 2.05rem);
      font-weight: 400;
      line-height: 1.18;
    }
    .story-bridge p {
      max-width: 450px;
      margin: 13px 0 0;
      color: rgba(255,246,232,.69);
      font-size: .88rem;
      line-height: 1.6;
    }
    .story-bridge-spark {
      position: absolute;
      z-index: 2;
      top: 50%;
      left: 50%;
      width: 46px;
      height: 46px;
      background: var(--gold);
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
      transform: translate(-50%, -50%);
      pointer-events: none;
    }
    .story-journey-heading {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 28px;
      margin: 72px 0 23px;
    }
    .story-journey-heading h3 {
      color: var(--cream);
      font-size: clamp(1.8rem, 3.2vw, 2.75rem);
      font-weight: 400;
    }
    .story-journey-heading p {
      max-width: 430px;
      margin: 0;
      color: rgba(255,246,232,.64);
      font-size: .88rem;
    }
    .route-story .principles { margin-top: 0; }
    .route-story .principle h3 { margin-top: 35px; }
    .route-story .principle p { line-height: 1.55; }
    .journey-place {
      display: block;
      margin-bottom: 7px;
      color: var(--pink);
      font-size: .66rem;
      font-weight: 800;
      letter-spacing: .11em;
      text-transform: uppercase;
    }
    @media (max-width: 760px) {
      .contact-page { padding-top: 76px; }
      .contact-intro, .contact-invitation, .contact-form-wrap, .custom-work-promo { grid-template-columns: 1fr; }
      .contact-intro { gap: 34px; }
      .contact-options { grid-template-columns: 1fr; gap: 11px; margin-top: 42px; }
      .contact-option { min-height: 0; }
      .contact-invitation { gap: 22px; padding: 29px 25px 31px; }
      .contact-action { width: 100%; white-space: normal; }
      .custom-work-promo {
        width: calc(100% - 40px);
        gap: 25px;
        margin: 38px auto;
        padding: 31px 26px 34px;
      }
      .spotlight-page .custom-work-promo { width: 100%; margin: 42px 0 52px; }
      .custom-work-promo .contact-action { justify-self: stretch; }
      .contact-form-wrap { gap: 30px; margin-top: 42px; padding: 30px 24px 33px; }
      .contact-submit { width: 100%; }
      .contact-field textarea { min-height: 150px; }
      .route-story .story-grid { grid-template-columns: 1fr; gap: 42px; }
      .story-title-note { max-width: 100%; }
      .story-copy { padding-top: 30px; }
      .story-copy .story-detail { margin-top: 18px; }
      .story-bridge { grid-template-columns: 1fr; margin-top: 46px; }
      .story-bridge-panel { min-height: 0; padding: 31px 25px; }
      .story-bridge-panel:first-of-type { padding-bottom: 42px; }
      .story-bridge-panel:last-child { padding-top: 42px; }
      .story-bridge-spark { top: 50%; left: 28px; width: 38px; height: 38px; }
      .story-journey-heading { display: grid; gap: 10px; margin-top: 56px; }
      .route-story .principle h3 { margin-top: 28px; }
      .spotlight-gallery-heading { display: grid; gap: 12px; }
      .spotlight-album { --album-columns: 1; --album-gap: 12px; padding: 16px 16px 19px; border-radius: 22px 6px 22px 6px; }
      .spotlight-album:nth-child(even) { border-radius: 6px 22px 6px 22px; }
      .spotlight-album-header { align-items: end; padding-right: 38px; }
      .spotlight-gallery figure { border-width: 6px; border-bottom-width: 25px; }
      .spotlight-gallery figure:nth-child(n) { transform: none; }
      .spotlight-album-controls { margin-top: 15px; }
      .product-dialog { place-items: start center; padding: 10px; }
      .product-dialog-panel { max-height: calc(100vh - 20px); padding: 22px 16px 28px; border-radius: 20px 5px 20px 5px; }
      .product-dialog-close { margin-right: 0; }
      .product-dialog-media { margin-top: 22px; border-radius: 16px 5px 16px 5px; }
      .product-dialog-gallery img { height: min(58vh, 540px); }
      .product-dialog-nav { width: 40px; height: 40px; }
      .product-dialog-caption { margin-top: 20px; }
      .product-dialog-etsy { width: 100%; justify-content: center; }
      .product-detail-trigger { margin-top: 5px; font-size: .55rem; }
    }
  

/* --- final package additions: nav brand banner + one-piece spotlight --- */
.site-brand .nav-brand-star {
      flex-basis: 29px;
      width: 29px;
      height: 29px;
    }
.site-brand .nav-brand-copy strong { font-size: .8rem; }
.site-brand .nav-brand-copy span { margin-top: 3px; font-size: .54rem; }
.nav-brand-banner {
      display: flex;
      align-items: center;
      gap: 11px;
      min-width: 232px;
      padding: 10px 14px 10px 11px;
      color: var(--cream);
      background: var(--plum, #2b1233);
      border: 1px solid rgba(201, 154, 61, .55);
      border-radius: 17px 5px 17px 5px;
      box-shadow: 4px 4px 0 rgba(201, 154, 61, .18);
    }
.nav-brand-star {
      position: relative;
      display: block;
      flex: 0 0 36px;
      width: 36px;
      height: 36px;
    }
.nav-brand-star::before,
    .nav-brand-star::after {
      content: "";
      position: absolute;
      clip-path: polygon(50% 0, 58% 40%, 100% 50%, 58% 60%, 50% 100%, 42% 60%, 0 50%, 42% 40%);
    }
.nav-brand-star::before {
      inset: -2px;
      background: var(--gold);
      transform: rotate(45deg);
    }
.nav-brand-star::after {
      inset: 5px;
      background: var(--coral-deep);
    }
.nav-brand-copy { display: grid; line-height: 1; }
.nav-brand-copy strong {
      font-family: "DM Serif Display", serif;
      font-size: .94rem;
      font-weight: 400;
      letter-spacing: .015em;
    }
.nav-brand-copy span {
      margin-top: 4px;
      color: var(--gold-bright, #efd68e);
      font-size: .64rem;
      font-weight: 800;
      letter-spacing: .105em;
      text-transform: uppercase;
    }
/* brand logo inside the nav banner */
.nav-brand-banner img.nav-brand-logo { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 1px solid rgba(201,154,61,.6); flex: 0 0 44px; }
/* spotlight feature: one featured piece */
.spotlight-feature { margin-top: 26px; }



/* --- spotlight feature: one featured piece (design from the staged site) --- */
.spotlight-feature {
  display: grid;
  grid-template-columns: minmax(320px, .95fr) minmax(0, 1.05fr);
  gap: clamp(44px, 7vw, 92px);
  align-items: center;
  margin-top: 54px;
}
.spotlight-photo {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  background: var(--paper-2);
  border: 1px solid rgba(123,46,120,.26);
  clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px));
  box-shadow: 14px 14px 0 rgba(201,154,61,.17), var(--shadow);
}
.spotlight-photo img { width: 100%; height: 100%; min-height: 620px; object-fit: cover; }
.spotlight-photo .product-badge { top: 20px; left: 20px; }
.spotlight-copy { position: relative; }
.spotlight-copy::before {
  content: "";
  display: block;
  width: 62px;
  height: 62px;
  margin-bottom: 26px;
  background: var(--pink);
  clip-path: polygon(50% 0, 58% 37%, 85% 15%, 63% 42%, 100% 50%, 63% 58%, 85% 85%, 58% 63%, 50% 100%, 42% 63%, 15% 85%, 37% 58%, 0 50%, 37% 42%, 15% 15%, 42% 37%);
}
.spotlight-copy h3 { color: var(--ink); font-size: clamp(2.4rem, 5vw, 4.5rem); }
.spotlight-materials {
  margin: 17px 0 0;
  color: var(--coral-deep);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.spotlight-story {
  max-width: 620px;
  margin: 28px 0 0;
  padding-top: 27px;
  color: var(--muted);
  border-top: 1px solid var(--line);
  font-size: 1.03rem;
  line-height: 1.75;
}
.spotlight-action {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 30px;
  padding: 13px 19px;
  color: var(--cream);
  background: var(--coral-deep);
  border: 0;
  border-radius: 16px 4px 16px 4px;
  font-family: inherit;
  font-size: .84rem;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 5px 5px 0 rgba(201,154,61,.23);
  cursor: pointer;
}
.spotlight-action:hover, .spotlight-action:focus-visible { background: var(--plum); }
.spotlight-action svg { width: 16px; height: 16px; }
@media (max-width: 760px) {
  .spotlight-feature { grid-template-columns: 1fr; gap: 30px; margin-top: 32px; }
  .spotlight-photo, .spotlight-photo img { min-height: 0; }
  .spotlight-photo { aspect-ratio: 4 / 5; }
  .spotlight-copy::before { width: 50px; height: 50px; margin-bottom: 20px; }
}
