/* Tactile surfaces stay crisp at every display size, including 4K. */
:root {
  --depth-edge: #eed6e2;
  --depth-ink: #58233e;
  --depth-shadow: #74415b19;
}
body {
  background:
    radial-gradient(ellipse at 4% 27%, #f8e5ef80, transparent 30%),
    radial-gradient(ellipse at 100% 49%, #e6f0fc75, transparent 28%),
    linear-gradient(180deg, #fffafc, #fff 38%, #fff9fc 78%, #fff);
}
.announcement {
  border-top: 1px solid #fff9;
  box-shadow: inset 0 -1px 0 #fff9;
}
.site-header {
  background: #fffdfdf0;
  border-bottom: 1px solid #ffffff;
  box-shadow: 0 1px 0 #eedde6, 0 10px 26px #5830470d;
}
.brand img {
  box-shadow: inset 0 0 0 1px #fff, 0 3px 0 #e9c9d8, 0 7px 12px #6c304f1c;
}
.main-nav a:focus-visible,
.footer-contact a:focus-visible,
.brand:focus-visible,
.footer-brand:focus-visible {
  outline: 3px solid #a42061;
  outline-offset: 6px;
  border-radius: 6px;
}
.hero {
  border: 1px solid #fff;
  box-shadow: 0 2px 0 #fff, 0 9px 0 #e6d5e052, 0 26px 48px #754a6422;
}
.hero-copy {
  background:
    radial-gradient(ellipse at 5% 10%, #fff9, transparent 60%),
    linear-gradient(125deg, #ecf7ff 5%, #edf3fd 58%, #fff1f7);
}
.hero h1 em {
  color: #df257a;
  text-shadow: 0 1px 0 #fffbfd, 0 2px 0 #cc1b681c, 0 8px 20px #bf367d12;
}
.hero-foot {
  border-top-color: #c6dbe986;
  box-shadow: inset 0 1px 0 #fff8;
}
.cart-button,
.primary-link,
.checkout-button {
  background: linear-gradient(165deg, #f23b90, #dd2374 80%);
  border: 1px solid #ffffff42;
  box-shadow: inset 0 2px 0 #ffffff38, inset 0 -2px 0 #b816623b, 0 5px 0 #ad1957, 0 11px 20px #b924612a;
  text-shadow: 0 1px 1px #aa1f6340;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.cart-button:focus-visible,
.primary-link:focus-visible,
.checkout-button:focus-visible {
  outline: 3px solid #93245c;
  outline-offset: 6px;
}
.cart-button:active,
.primary-link:active,
.checkout-button:not(:disabled):active {
  transform: translateY(3px);
  box-shadow: inset 0 1px 3px #870d4633, 0 2px 0 #ad1957, 0 6px 12px #b924611f;
}
.checkout-button:disabled {
  background: #c8bec4;
  border-color: #c8bec4;
  box-shadow: none;
  text-shadow: none;
  transform: none;
}
.cart-count {
  box-shadow: inset 0 1px 3px #89194925, 0 1px 0 #fffd;
}
.brand-promise > div,
.product-card {
  position: relative;
  isolation: isolate;
  transform: none;
  background: linear-gradient(145deg, #fff 60%, #fffafd);
  border: 1px solid #ffffff;
  outline: 1px solid #f0e0e8;
  box-shadow: 0 3px 0 #ecdce4, 0 11px 22px var(--depth-shadow);
  transition: transform 180ms ease;
  filter: none;
}
.product-card { contain: layout style; }
.brand-promise > div::before,
.product-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  background: radial-gradient(circle at 50% 25%, #ffffff2b, transparent 60%);
  transition: opacity 240ms ease;
}
.promise-mark {
  border: 1px solid #fff;
  background: linear-gradient(145deg, #fffafd, #fbd8e7);
  text-shadow: 0 1px 0 #fff;
  box-shadow: inset 0 2px 1px #fff, inset 0 -2px 2px #b16b8b13, 0 3px 0 #edc7d9, 0 7px 11px #94527117;
}
.catalog-section { position: relative; }
.section-heading h2 { text-shadow: 0 2px 0 #fff; }
.section-heading h2::after {
  height: 4px;
  box-shadow: 0 2px 0 #f4cbdd;
}
.catalog-controls {
  background: linear-gradient(175deg, #fff, #fffafc);
  border: 1px solid #fff;
  outline: 1px solid #f1e0e8;
  box-shadow: inset 0 1px 0 #fff, 0 4px 0 #f2e5ec, 0 14px 24px #77435d0b;
}
.category-button,
.round-action,
.icon-button,
.rating-options span {
  background: linear-gradient(160deg, #fff, #fbf1f6);
  border: 1px solid #eeddE6;
  box-shadow: inset 0 1px 0 #fff, 0 3px 0 #e4cfdb, 0 6px 10px #66324d0d;
}
.category-button[aria-pressed=true] {
  color: #fff;
  background: linear-gradient(150deg, #604052, #392d39);
  border-color: #705365;
  box-shadow: inset 0 1px 0 #ffffff26, 0 3px 0 #261c27, 0 6px 10px #3d21381b;
}
.category-button:active,
.round-action:active,
.icon-button:active {
  transform: translateY(2px);
  box-shadow: inset 0 1px 3px #6a36541a, 0 1px 0 #dfcbd8;
}
.search-box {
  background: #fff;
  box-shadow: inset 0 2px 5px #6e3b5510, 0 1px 0 #fff;
}
.search-box:focus-within {
  border-color: #bf3174;
  outline: 3px solid #e72e8220;
}
.product-image {
  box-shadow: inset 0 1px 0 #fff, 0 2px 0 #f2e4ec;
}
.product-image img { transition: transform 320ms ease; }
.product-tag {
  border: 1px solid #fff;
  background: #fffefaf5;
  box-shadow: 0 2px 0 #e8d5dfcc, 0 6px 12px #5a294019;
}
.product-meta { box-shadow: inset 0 1px 0 #fff; }
.how-section {
  background:
    radial-gradient(ellipse at 12% 22%, #ffffffc4, transparent 46%),
    radial-gradient(ellipse at 94% 110%, #e5eaf6a8, transparent 40%),
    linear-gradient(125deg, #fae9f0, #f8edf5);
  box-shadow: inset 0 2px 0 #fff, inset 0 -2px 0 #fffc;
}
.how-steps div {
  border: 1px solid #fff;
  background: linear-gradient(150deg, #fff, #fffbfd);
  box-shadow: 0 4px 0 #e9ccdb, 0 16px 23px #88516b1a;
}
.how-steps b {
  border: 1px solid #fff;
  background: linear-gradient(145deg, #fff7fb, #f6d5e5);
  box-shadow: inset 0 2px 0 #fff, 0 3px 0 #e2bace, 0 7px 12px #b9528217;
  text-shadow: 0 1px 0 #fff;
}
.review-form {
  border: 1px solid #fff;
  outline: 1px solid #f0dce7;
  background: linear-gradient(145deg, #fff 35%, #fff7fb);
  box-shadow: 0 5px 0 #ecd5e1, 0 21px 35px #82436316;
}
.reviews-placeholder {
  background: linear-gradient(145deg, #fff8fb, #fcecf3);
  border: 1px solid #fff;
  box-shadow: 0 3px 0 #ead3df, 0 13px 23px #8243630e;
}
.field input,
.field select,
.field textarea {
  box-shadow: inset 0 2px 4px #74415b0a, 0 1px 0 #fff;
}
.rating-options input:checked + span {
  background: linear-gradient(150deg, #fff0f7, #f5cde0);
  box-shadow: inset 0 1px 3px #b9407620, 0 2px 0 #dbb2c7;
}
footer {
  background:
    radial-gradient(ellipse at 5% -20%, #71425c8a, transparent 48%),
    radial-gradient(ellipse at 97% 130%, #423253, transparent 45%),
    linear-gradient(140deg, #302731, #27212c);
  border-top: 1px solid #a2759138;
  box-shadow: inset 0 2px 0 #ffffff12;
}
.footer-brand { text-shadow: 0 2px 0 #0d071930, 0 9px 18px #180b1b55; }
.cart-panel { box-shadow: -4px 0 0 #edd6e3, -14px 0 35px #20121c26; }
.cart-head,
.cart-bottom { background: linear-gradient(145deg, #fff, #fff8fc); }
.detail-dialog { box-shadow: 0 7px 0 #d7baca80, 0 30px 70px #26142055; }

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .cart-button:hover,
  .primary-link:hover,
  .checkout-button:not(:disabled):hover {
    background: linear-gradient(165deg, #f24697, #d42170 80%);
    transform: translateY(-2px);
    box-shadow: inset 0 2px 0 #ffffff40, 0 7px 0 #a81854, 0 15px 22px #b924612e;
  }
  .product-card:hover,
  .brand-promise > div:hover {
    transform: translateY(-4px);
    box-shadow: 0 5px 0 #e7d4df, 0 19px 30px #74415b26;
    filter: none;
  }
  .product-card[data-depth-active],
  .brand-promise > div[data-depth-active] { transition: transform 100ms ease; }
  .product-card[data-depth-active]::before,
  .brand-promise > div[data-depth-active]::before { opacity: 1; }
  .product-card:hover .product-image img { transform: scale(1.025); }
  .category-button:hover,
  .round-action:hover,
  .icon-button:hover,
  .rating-options label:hover span {
    transform: translateY(-1px);
    box-shadow: inset 0 1px 0 #fff, 0 4px 0 #d7bfce, 0 9px 14px #66324d17;
  }
  .category-button:hover { background: #443342; color: #fff; border-color: #443342; }
  .round-action:hover { background: #db267b; color: #fff; }
  .how-steps div:hover,
  .reviews-placeholder:hover,
  .review-form:hover { transform: none; }
}
@media (max-width: 700px) {
  .hero { border: 0; box-shadow: 0 1px 0 #ebdbe5; }
  .product-card { box-shadow: 0 2px 0 #ead9e3, 0 7px 13px #74415b12; }
  .catalog-controls { border-radius: 20px; }
  .brand-promise > div { box-shadow: 0 3px 0 #ecdae4, 0 8px 13px #74415b0f; }
  .product-tag { font-size: 11px; left: 8px; top: 8px; }
  .how-steps div { box-shadow: 0 3px 0 #e9ccdb, 0 10px 15px #88516b13; }
}
@media (min-width: 1800px) {
  .product-card { border-radius: 30px; padding: 10px; }
  .product-image { border-radius: 22px; }
  .catalog-controls { padding: 22px 25px; margin-bottom: 38px; }
  .brand-promise > div { border-radius: 25px; }
  .product-tag { font-size: 15px; padding: 7px 14px; }
  .round-action { width: 46px; height: 46px; font-size: 25px; }
  .how-steps { gap: 22px; }
  .how-steps div { border-radius: 26px; }
}
@media (prefers-reduced-motion: reduce), (hover: none), (pointer: coarse) {
  .product-card,
  .product-card:hover,
  .brand-promise > div,
  .brand-promise > div:hover,
  .cart-button:hover,
  .primary-link:hover,
  .checkout-button:hover,
  .category-button:hover,
  .round-action:hover,
  .icon-button:hover,
  .rating-options label:hover span,
  .how-steps div:hover,
  .reviews-placeholder:hover,
  .review-form:hover { transform: none; transition: none; }
  .product-card::before,
  .brand-promise > div::before { display: none; }
  .product-card:hover .product-image img { transform: none; }
  .product-image img { transition: none; }
}

/* Always-visible cart actions, without additional animation layers. */
.add-to-cart {
  width: 100%;
  min-height: 46px;
  margin-top: 14px;
  padding: 10px 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid #a51655;
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(155deg, #cc216d, #b81761);
  box-shadow: inset 0 1px 0 #ffffff30, 0 3px 0 #95134d;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
}
.add-to-cart > [aria-hidden] { font-size: 19px; line-height: 1; }
.add-to-cart:focus-visible { outline: 3px solid #58233e; outline-offset: 4px; }
.add-to-cart:active { box-shadow: inset 0 2px 3px #740a4030, 0 1px 0 #95134d; }
@media (hover: hover) and (pointer: fine) {
  .add-to-cart:hover { background: #a91456; }
}
@media (max-width: 700px) {
  .cart-button { font-size: 14px; }
  .add-to-cart { min-height: 48px; }
}
