/* Premium theme. Keep these tokens together for easy brand changes. */
@layer premium {
  :root {
    --bg: #100b10;
    --surface: #1b121b;
    --gold: #edb2b8;
    --gold-hover: #f9d3c8;
    --text: #fff5f0;
    --muted: #b5a4b1;
    --line: #ffffff14;
    --radius: 16px;
    --champagne: #f1d4ba;
    --wine: #792940;
  }
  body {
    background: radial-gradient(ellipse 65% 520px at 85% 60px, #6e1c3633, transparent),
      radial-gradient(ellipse 55% 500px at 0 55%, #37203d24, transparent), var(--bg);
  }
  .site-header { background: #100b10e8; border-color: #f4c6cd12; }
  .header-inner { min-height: 84px; }
  .header-collection { font-size: 13px; color: #c4afb9; }
  .header-collection:hover { color: var(--gold); }
  .adult-label { margin-left: 10px; border: 1px solid #c38d9b40; border-radius: 5px; padding: 4px 6px; color: var(--gold); }
  .button { border-radius: 9px; min-height: 48px; position: relative; overflow: hidden; transition: transform .2s, box-shadow .2s, background .2s; }
  .button-gold { background: linear-gradient(110deg, #ecc9ab, #edb2b8 65%, #e49aae); color: #2c1521; border: 1px solid #ffead655; box-shadow: inset 0 1px #fff5, 0 4px 20px #c34c7215; }
  .button-gold::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 25%, #fff5 48%, transparent 70%); transform: translateX(-140%); transition: transform .65s ease; pointer-events: none; }
  .button-gold:hover, .button-gold:focus-visible { background: linear-gradient(110deg, #f6d8ba, #f4bccc 80%); box-shadow: 0 6px 30px #d6668935; }
  .button-gold:hover::after, .button-gold:focus-visible::after { transform: translateX(140%); }
  .button-outline { border-color: #a782963e; background: #ffffff03; color: #e7d5df; }
  .button-outline:hover { background: #352031; border-color: #c68e9d; }
  .intro { padding-block: 52px 42px; gap: 30px; position: relative; }
  .intro-main { position: relative; z-index: 1; }
  .eyebrow { color: #dba7b5; letter-spacing: 2.6px; font-size: 11px; }
  .intro .eyebrow > span { background: var(--gold); box-shadow: 0 0 16px #eaa4b6a0; }
  h1 { font-size: clamp(36px, 4.3vw, 64px); font-weight: 500; letter-spacing: -2.7px; margin-top: 16px; }
  h1 em { color: var(--champagne); }
  .intro-copy { font-size: 15px; color: #bba7b5; margin-top: 14px; }
  .intro-actions { display: flex; align-items: center; gap: 20px; margin-top: 24px; }
  .intro-caption { font-size: 12px; line-height: 1.6; color: #bda7b5; }
  .intro-stamp { display: flex; flex-direction: column; justify-content: center; gap: 0; width: 300px; flex-shrink: 0; text-align: center; position: relative; padding: 25px 0; }
  .intro-stamp::before { content: ''; position: absolute; inset: 4% -5%; border-radius: 50%; background: radial-gradient(ellipse, #8e32582b, transparent 68%); pointer-events: none; }
  .stamp-kicker { font-size: 9px; letter-spacing: 2.6px; color: #c79aa9; }
  .stamp-monogram { font: italic 108px/1.2 Georgia, serif; letter-spacing: -11px; color: #e0afad; text-shadow: 0 6px 40px #de7a9920; }
  .stamp-monogram span { color: #713447; font-weight: 400; }
  .stamp-bottom { font: italic 14px Georgia, serif; color: #bb99a8; }
  .collection-toolbar { padding-block: 16px; border-top: 1px solid var(--line); }
  .filters { gap: 6px; }
  .filter { border-radius: 24px; padding-inline: 19px; color: #bdaab8; border: 1px solid transparent; transition: color .2s, background .2s, border-color .2s; }
  .filter.active { background: #34202d; color: #f3c7cd; border-color: #b86c844a; box-shadow: inset 0 1px #ffcad311; }
  .filter:hover { background: #271923; color: #ffdfdf; }
  .filter span { background: #f4b8c215; color: #e3b1be; border-radius: 10px; }
  .collection-note { color: #9b8292; }
  .section-heading { padding-block: 26px 20px; }
  .section-heading h2 { font-size: 18px; letter-spacing: -.4px; }
  .gallery { gap: 22px 20px; }
  .card-button { height: 100%; padding: 7px 7px 15px; background: linear-gradient(150deg, #211720, #171017); border: 1px solid #e8a9c014; transition: transform .25s, border-color .25s, box-shadow .25s; }
  .thumbnail { border: 0; border-radius: 11px; }
  .thumbnail img { transition: transform .55s cubic-bezier(.2,.7,.2,1), filter .4s; filter: saturate(.75); }
  .thumbnail::after { background: linear-gradient(180deg, #17081108 30%, #17081188); }
  .play { width: 50px; height: 50px; background: #26111f65; border-color: #ffd9e27a; box-shadow: 0 0 0 7px #fff1; transition: transform .25s, background .25s, box-shadow .25s; }
  .card-title { padding-inline: 8px; margin-top: 14px; color: #f4e8ed; font-size: 15px; }
  .card-meta { padding-inline: 8px; color: #b19aac; }
  .meta-dot { color: #866277; }
  .card-badge { background: #200e1ecc; color: #f6dfe8; border: 1px solid #ffdfeb20; border-radius: 5px; letter-spacing: 1px; }
  .card-badge.featured { background: linear-gradient(100deg, #ecc9ab, #e6b0bc); color: #301b25; }
  .duration { background: #170d18cc; border-color: #fff2; }
  .card-invitation { position: absolute; bottom: 15px; left: 13px; z-index: 1; font-size: 12px; color: #ffe5ed; opacity: 0; transform: translateY(5px); transition: opacity .25s, transform .25s; }
  .card-button:focus-visible { border-color: #edb2b8; }
  .card-button:focus-visible .card-invitation { opacity: 1; transform: none; }
  @media (hover: hover) and (pointer: fine) {
    .card-button:hover { transform: translateY(-5px); border-color: #ce829b65; box-shadow: 0 15px 35px #0005, 0 0 22px #a3325f0d; }
    .card-button:hover .thumbnail img { transform: scale(1.055); filter: saturate(1); }
    .card-button:hover .play { background: #f1bcc5; box-shadow: 0 0 0 9px #f1bcc51a, 0 8px 25px #08010860; }
    .card-button:hover .card-invitation { opacity: 1; transform: none; }
  }
  .load-area { padding-block: 36px 44px; }
  .load-area p { color: #a78f9f; }
  .member-banner { position: relative; overflow: hidden; padding: 34px; gap: 30px; border-color: #e0a0b335; background: radial-gradient(ellipse at 90% 20%, #872f4f35, transparent 60%), linear-gradient(110deg, #311a28, #1b111c); box-shadow: inset 0 1px #ffd7e510; }
  .banner-mark { color: #f4d5d5; font-family: Georgia, serif; font-style: italic; font-weight: 400; font-size: 74px; }
  .member-banner h2 { font: 36px/1.2 Georgia, serif; letter-spacing: -1px; margin-top: 9px; }
  .member-banner p:not(.eyebrow) { color: #c0a9b7; margin-top: 9px; }
  .footer-top p, .footer-bottom { color: #a78f9f; }
  .footer-top nav button { color: #c7b2c1; }
  .footer-bottom strong { color: #e9b9c4; border-color: #634151; }
  dialog { background: radial-gradient(ellipse at top right, #5d23312a, transparent 65%), #1b121b; border-color: #b57b8f50; border-radius: 22px; box-shadow: 0 32px 120px #000b, 0 0 80px #82294c13; }
  dialog::backdrop { background: #080309d4; backdrop-filter: blur(10px); }
  .modal-cover { position: relative; }
  .modal-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 20%, #1b121b); }
  .modal-image { height: 170px; filter: saturate(.7); }
  .modal-cover-label { position: absolute; bottom: 14px; left: 32px; z-index: 1; color: #f3d0db; font-size: 10px; letter-spacing: 2.5px; }
  #access-dialog .dialog-content { padding-top: 13px; }
  .dialog-content h2 { font: 36px/1.12 Georgia, serif; letter-spacing: -1px; }
  .dialog-content p:not(.eyebrow) { color: #c5b0bf; }
  .dialog-content strong { color: #fff1f5; font-weight: 600; }
  .access-benefits { display: flex; flex-wrap: wrap; gap: 9px 20px; margin-top: 20px; color: #ddbdcc; font-size: 12px; }
  .access-benefits span::before { content: '✓'; color: #f0bdcb; margin-right: 7px; }
  .dialog-content .button-full { min-height: 54px; margin-top: 22px; }
  .close-dialog { background: #190c19a8; border-color: #f2b6ca40; }
  .age-symbol { border-color: #ba7d934f; background: radial-gradient(circle, #68283e55, #29162333); box-shadow: 0 0 0 9px #cf76970a; }
  .age-content .dialog-note { color: #ab94a5; }
  @media (max-width: 1200px) { .intro-stamp { width: 230px; } .stamp-monogram { font-size: 90px; } .stamp-kicker { font-size: 8px; } }
  @media (max-width: 900px) { .intro-stamp { display: none; } .intro { padding-block: 38px; } h1 { font-size: 48px; } .header-collection { display: none; } }
  @media (max-width: 800px) { .member-banner h2 { font-size: 32px; } .member-banner { padding: 26px; } }
  @media (max-width: 560px) {
    .header-inner { min-height: 76px; flex-wrap: nowrap; gap: 9px; }
    .header-inner .brand img { width: 124px; height: auto; }
    .header-actions .button { font-size: 12px; padding-inline: 12px; gap: 9px; min-height: 42px; }
    .header-actions .plus { display: none; }
    .intro { padding-block: 31px; }
    h1 { font-size: 40px; letter-spacing: -1.9px; max-width: 100%; }
    .intro-copy { font-size: 14px; max-width: 310px; }
    .intro-actions { gap: 13px; margin-top: 21px; }
    .intro-actions .button { padding-inline: 15px; gap: 10px; font-size: 13px; }
    .intro-caption { font-size: 11px; }
    .collection-toolbar { padding-block: 13px; }
    .filter { padding-inline: 11px; font-size: 12px; }
    .gallery { gap: 14px 10px; }
    .card-button { padding: 4px 4px 12px; border-radius: 12px; }
    .thumbnail { border-radius: 8px; }
    .card-title { font-size: 13px; margin-top: 11px; padding-inline: 5px; }
    .card-meta { padding-inline: 5px; font-size: 10px; }
    .play { width: 37px; height: 37px; box-shadow: 0 0 0 5px #fff1; }
    .card-invitation { display: none; }
    .card-badge { font-size: 9px; }
    .member-banner { padding: 25px 22px; }
    .dialog-content h2 { font-size: 31px; }
    .modal-cover-label { left: 22px; }
    .modal-image { height: 140px; }
    .access-benefits { font-size: 11px; gap: 10px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .button-gold::after { display: none; }
    .card-button:hover, .card-button:hover .thumbnail img { transform: none; }
  }
}