/* NOXA V18: neutral graphite studio. Original product artwork stays intact. */
:root {
  color-scheme: dark;
  --navy: #191a1c;
  --deep: #18191b;
  --blue: #303134;
  --teal: #55565a;
  --bright: #c6c5c1;
  --silver: #eeede9;
  --muted: #b8b7b3;
  --line: #414246;
  --surface: #232426;
}
body {
  color: var(--silver);
  background: radial-gradient(ellipse at 70% 0, #303133 0, transparent 45%), #191a1c;
  isolation: isolate;
}
/* The catalogue is a quiet studio, not another galaxy behind the artwork. */
body::before, body::after { display: none; }
.collection, .brand-story, .quiet-footer { background: transparent; color: var(--silver); }
p, .muted { color: var(--muted); }
header { background: #1d1e20; color: var(--silver); border-color: var(--line); }
.preview { background: #252628; color: #c5c4c0; padding-block: 7px; }
.official-mark img { filter: grayscale(1) contrast(8); mix-blend-mode: screen; }
header nav a, .header-actions, #motion { color: #d9d8d4; }
header nav a:hover, .header-actions button:hover { color: #f5f4f0; }
#cart-count, #order-count { border-color: #65666a; }
.eyebrow, .section-heading .eyebrow { color: #bdbcb8; letter-spacing: 1.8px; }
.section-heading h2 { color: #eeede9; font: 400 38px/1.2 Georgia, 'Times New Roman', serif; letter-spacing: -.6px; }
.section-heading p, .catalog-note, .concept-note { color: #b8b7b3; }
.collection-tools { border-color: var(--line); }
.filters button { color: #b8b7b3; }
.filters button.active { color: #eeede9; border-color: #d1d0cb; }
.density button { color: #a8a7a3; }
.density button[aria-pressed=true] { color: #eeede9; }
.product-card {
  background: var(--surface);
  border: 1px solid #4a4b4e;
  border-radius: 5px;
  box-shadow: 0 12px 24px #00000018;
}
.product-image, .transparent-card .product-image {
  /* Silver light behind the cap; a dark contact plane beneath the bottle. */
  background:
    radial-gradient(ellipse 48% 5% at 50% 82%, #111113a6 0, #17171933 50%, transparent 78%),
    radial-gradient(ellipse 75% 64% at 50% 32%, #4a4b4d 0, #37383b 46%, transparent 100%),
    linear-gradient(180deg, #2c2d30 0%, #2c2d2f 73%, #252628 100%) !important;
}
.transparent-card .package-art {
  background:
    radial-gradient(ellipse 62% 6% at 50% 80%, #111113a6 0, #17171933 52%, transparent 78%),
    radial-gradient(ellipse 75% 64% at 50% 32%, #4a4b4d 0, #37383b 46%, transparent 100%),
    linear-gradient(180deg, #2c2d30 0%, #2c2d2f 73%, #252628 100%);
}
.original-art.standalone.transparent,
.detail-art .original-art.standalone.transparent { background: transparent; }
.original-art.standalone.transparent img,
.detail-art .original-art.standalone.transparent img,
.transparent-card .package-art.packshot img {
  filter: drop-shadow(0 3px 2px #00000070) drop-shadow(0 9px 7px #00000030);
}
.product-info, .package-toggle { background: #232426; }
.product-info { padding: 18px 18px 11px; }
.product-info h3 { color: #eeede9; font-size: 16px; }
.product-info .card-price { color: #c5c4bf; font-size: 11px; }
.package-toggle { color: #c8c7c2; border-color: #414246; min-height: 42px; font-size: 10px; letter-spacing: .5px; }
.package-toggle:hover, .package-toggle:focus-visible { background: #353638; }
.catalog-note { font-size: 11px; line-height: 1.85; }
.editorial-story, .quiet-footer { border-color: var(--line); }
.editorial-title h2 { color: #e1e0db; }
.editorial-title .eyebrow, .story-summary p { color: #b8b7b3; }
.text-link { color: #deddd8; border-color: #92938f; }
.group-campaign { border-color: #4a4b4e; background: #222325; }
.quiet-footer { color: #b8b7b3; }
dialog { background: #232426; color: #eeede9; border-color: #65666a; box-shadow: 0 24px 90px #0008; }
dialog::backdrop { background: #09090bc9; }
.close { background: #232426ed; color: #e9e8e3; }
.detail-art {
  background:
    radial-gradient(ellipse 54% 5% at 50% 87%, #1010129c, transparent 80%),
    radial-gradient(ellipse at 50% 37%, #48494b, #292a2c 78%);
}
.detail-art:has(.transparent) .art-label { background: #232426cc; color: #c8c7c2; }
.detail-copy h2, .cart-content h2, .cart-row h3 { color: #eeede9; }
.detail-copy p, .cart-content p, .cart-row small, .checkout-note { color: #bdbcb8; }
.detail-copy details, .cart-row { border-color: #4a4b4e; }
.button.light, .detail-copy .light, .cart-content .light { background: #d0cfca; color: #1b1c1e; }
.button.light:hover, .detail-copy .light:hover, .cart-content .light:hover { background: #e0dfda; color: #17181a; }
.button.outline, #order-review { background: transparent; color: #deddd8; border-color: #8a8b8e; }
.button.outline:hover, #order-review:not(:disabled):hover { background: #38393c; }
.size-options button, .cart-row [data-order-step] { border-color: #6c6d70; }
.size-options .selected { color: #eeede9; background: #393a3c; border-color: #bcbcb8; }
.recipient-fields { border-color: #595a5e; }
.recipient-fields legend, .recipient-fields label, .order-product label { color: #d1d0cb; }
.recipient-fields input, .recipient-fields textarea, .order-product select { background: #1d1e20; color: #eeede9; border-color: #7b7c7f; caret-color: #eeede9; }
.recipient-fields input::placeholder, .recipient-fields textarea::placeholder { color: #a9a8a4; }
input[type=checkbox] { accent-color: #d0cfca; }
.review-summary { background: #333436; color: #eeede9; border: 1px solid #68696d; }
.order-subtotal strong { color: #eeede9; }
.order-steps { color: #b8b7b3; font-size: 11px; line-height: 1.8; }
.order-consent { color: #d1d0cb; }
.toast { background: #d0cfca; color: #1b1c1e; box-shadow: 0 8px 24px #0005; }
.no-js { background: #303134; color: #eeede9; }
.skip:focus { background: #d0cfca; color: #1b1c1e; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible,
select:focus-visible, summary:focus-visible, .product-card button:focus-visible { outline: 2px solid #e1e0db; outline-offset: 4px; }
.product-image:focus-visible { outline-offset: -5px; }
::selection { background: #bcbcb7; color: #17181a; }
@media (max-width: 767px) {
  .product-card { box-shadow: none; }
  .product-info { padding: 12px 12px 9px; }
  .product-info h3 { font-size: 14px; }
  .package-toggle { min-height: 44px; font-size: 10px; padding-inline: 12px; }
  .section-heading h2 { font-size: 32px; }
  .catalog-note { font-size: 10px; }
}
@media (max-width: 480px) {
  .section-heading h2 { margin-bottom: 10px; }
  .product-info .card-price { font-size: 10px; }
}
