/* iCalm / NatMag premium packshot presentation v1.
 * The photographed package remains an unaltered source image. The gallery
 * backdrop, studio lights and cast shadows are decorative CSS only.
 * Light/Dark/System resolve via data-theme set by assets/theme.js. */
:root {
  --nm-photo-backdrop:linear-gradient(151deg,#fcfdfd 0%,#f2f6f7 48%,#e4eaec 100%);
  --nm-photo-halo:rgba(113,171,188,.22);
  --nm-photo-rim:rgba(255,255,255,.94);
  --nm-photo-line:rgba(135,169,180,.28);
  --nm-photo-glass:rgba(255,255,255,.6);
  --nm-photo-horizon:rgba(158,183,188,.26);
  --nm-photo-cast:rgba(28,51,61,.18);
  --nm-photo-depth:rgba(20,41,50,.09);
  --nm-photo-reflect:rgba(255,255,255,.67);
  --nm-photo-brand:#5a7f91;
}
:root[data-theme="dark"] {
  --nm-photo-backdrop:linear-gradient(150deg,#1e2a35 0%,#141f29 48%,#0e151d 100%);
  --nm-photo-halo:rgba(82,160,196,.33);
  --nm-photo-rim:rgba(163,214,229,.19);
  --nm-photo-line:rgba(153,203,219,.12);
  --nm-photo-glass:rgba(233,247,255,.075);
  --nm-photo-horizon:rgba(136,186,207,.19);
  --nm-photo-cast:rgba(0,0,0,.59);
  --nm-photo-depth:rgba(0,0,0,.26);
  --nm-photo-reflect:rgba(171,219,232,.19);
  --nm-photo-brand:#b4d7e7;
}
/* CSS fallback for clients where JS does not set data-theme. */
@media(prefers-color-scheme:dark) {
  :root:not([data-theme]) {
    --nm-photo-backdrop:linear-gradient(150deg,#1e2a35 0%,#141f29 48%,#0e151d 100%);
    --nm-photo-halo:rgba(82,160,196,.33);
    --nm-photo-rim:rgba(163,214,229,.19);
    --nm-photo-line:rgba(153,203,219,.12);
    --nm-photo-glass:rgba(233,247,255,.075);
    --nm-photo-horizon:rgba(136,186,207,.19);
    --nm-photo-cast:rgba(0,0,0,.59);
    --nm-photo-depth:rgba(0,0,0,.26);
    --nm-photo-reflect:rgba(171,219,232,.19);
    --nm-photo-brand:#b4d7e7;
  }
}
.hero-product-visual,
.product-preview-media {
  background:var(--nm-photo-backdrop);
  box-shadow:inset 0 1px 0 var(--nm-photo-rim),
             inset 0 -1px 0 var(--nm-photo-line),
             0 16px 45px var(--nm-photo-depth);
  isolation:isolate;
  transition:background .24s ease,box-shadow .24s ease;
}
/* Controlled editorial glow: independent of the package pixels. */
.hero-product-visual::before {
  content:"";
  position:absolute;
  inset:3% 4% 8%;
  width:auto;
  aspect-ratio:auto;
  top:3%;
  left:4%;
  pointer-events:none;
  background:
    radial-gradient(ellipse 66% 54% at 48% 46%,var(--nm-photo-halo),transparent 83%),
    linear-gradient(115deg,transparent 25%,var(--nm-photo-glass) 46%,transparent 64%);
  z-index:0;
}
.hero-product-visual::after {
  content:"";
  position:absolute;
  bottom:13%;
  left:15%;
  right:15%;
  height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--nm-photo-horizon),transparent);
  z-index:0;
}
.hero-product-visual .art-label,
.hero-product-visual .art-note {color:var(--nm-photo-brand);z-index:3}
.hero-product-photo {position:relative;isolation:isolate;z-index:2}
.hero-product-photo::before {
  content:"";
  position:absolute;
  bottom:0;
  left:18%;
  width:64%;
  height:11%;
  border-radius:50%;
  background:var(--nm-photo-cast);
  filter:blur(21px);
  transform:scaleX(.8);
  z-index:-1;
  pointer-events:none;
}
/* No invert, brightness, contrast, hue-shift or AI-restored labels. */
.hero-product-photo img {
  object-fit:contain;
  image-rendering:auto;
  filter:drop-shadow(0 17px 24px var(--nm-photo-cast));
  transform:none;
  max-width:94%;
  max-height:410px;
}
.product-preview-media {
  position:relative;
  border-color:var(--nm-photo-line);
  overflow:hidden;
}
.product-preview-media::before {
  content:"";
  position:absolute;
  inset:0;
  width:auto;
  height:auto;
  pointer-events:none;
  background:
    radial-gradient(ellipse 68% 49% at 50% 39%,var(--nm-photo-halo),transparent 88%),
    linear-gradient(125deg,var(--nm-photo-glass),transparent 43%);
  z-index:0;
}
.product-preview-media::after {
  content:"";
  position:absolute;
  bottom:10%;
  left:20%;
  width:60%;
  height:6%;
  border-radius:50%;
  background:var(--nm-photo-cast);
  filter:blur(16px);
  z-index:0;
  pointer-events:none;
}
.product-preview-media img {
  display:block;
  width:90%;
  height:84%;
  object-fit:contain;
  object-position:center;
  position:relative;
  z-index:1;
  transform:none;
  image-rendering:auto;
  /* Transparent edges stay transparent; source RGB/lettering is never altered. */
  filter:drop-shadow(0 9px 15px var(--nm-photo-cast));
  transition:transform .25s ease;
}
.product-preview-card:hover .product-preview-media img {transform:translateY(-3px)}
.product-preview-photo-fallback {z-index:1;pointer-events:none}
.product-preview-size {
  background:var(--bg);
  border-color:var(--nm-photo-line);
  color:var(--ink);
  box-shadow:0 3px 10px var(--nm-photo-depth);
}
.product-preview-card .product-preview-price {
  font-variant-numeric:tabular-nums;
  color:var(--ink);
}
.product-preview-card .product-preview-description {max-width:29ch}
.catalog-showcase-intro {border-color:var(--nm-photo-line)}
.product-preview-media.photo-unavailable {
  background:var(--nm-photo-backdrop);
}
/* The text fallback must remain crisp; never apply the cast-shadow blur to it. */
.hero-product-photo.photo-unavailable::before {
  content:"НатуралМаг";
  position:static;
  width:auto;
  height:auto;
  background:none;
  border-radius:0;
  filter:none;
  transform:none;
  z-index:1;
  font:italic 400 clamp(2rem,4vw,3.5rem)/1.1 var(--serif);
  color:var(--nm-photo-brand);
  text-align:center;
}

@media(max-width:760px) {
  .hero-product-visual {min-height:405px;padding:1.8rem}
  .hero-product-photo img {max-height:315px}
}
@media(max-width:520px) {
  .product-preview-media{aspect-ratio:1.08}
  .hero-product-photo img {max-height:270px}
}
@media(prefers-reduced-motion:reduce) {
  .hero-product-visual,.product-preview-media,.product-preview-media img {transition:none}
}