.hero{
  background:
    radial-gradient(circle at top left, rgba(63,73,227,0.10), transparent 30%),
    radial-gradient(circle at bottom right, rgba(239,28,37,0.06), transparent 24%),
    linear-gradient(180deg,var(--hero-grad-a) 0%,var(--hero-grad-b) 100%);
  padding:26px 0 14px;border-bottom:1px solid var(--line);
}
.crumbs{font-size:.92rem;color:var(--muted)}
.crumbs a{color:var(--blue)}

.product-hero{padding:24px 0 34px}
.pdp-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:22px;align-items:start}

.gallery,.pdp-sidebar,.spec-card,.info-card,.related-card{
  background:var(--surface-card);border:1px solid var(--border-card);border-radius:22px;box-shadow:var(--shadow);
}
.gallery{padding:14px}

.main-art{
  display:block;position:relative;aspect-ratio:4/3;border-radius:16px;overflow:hidden;
  background:var(--art-gradient);
  border:1px solid var(--border-card);
}
.thumb-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.thumb{
  display:block;position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;
  background:var(--art-gradient);
  border:1px solid var(--border-card);
}

.slide{position:absolute;inset:0;opacity:0;transition:opacity .45s ease}
.slide.active{opacity:1}
.grid-overlay{
  position:absolute;inset:14px;border-radius:16px;border:1px solid var(--line);
  background:repeating-linear-gradient(135deg,rgba(63,73,227,0.08) 0 2px,transparent 2px 14px);
}
.beam{
  position:absolute;background:linear-gradient(180deg,rgba(24,34,58,0.95) 0%,rgba(16,24,38,0.95) 100%);
  border-radius:18px 18px 8px 8px;box-shadow:0 12px 26px rgba(24,34,58,0.18);
}
.beam.one{width:78px;height:110px;left:46px;bottom:28px}
.beam.two{width:56px;height:150px;left:142px;bottom:28px}
.beam.three{width:46px;height:188px;left:222px;bottom:28px}
.screen{
  position:absolute;border-radius:18px;background:linear-gradient(135deg,var(--blue),var(--blue-dark));
  box-shadow:0 14px 30px rgba(63,73,227,0.22);
}
.screen.one{width:92px;height:92px;right:28px;bottom:28px}
.screen.two{width:112px;height:72px;right:28px;bottom:30px}
.screen.red{background:linear-gradient(135deg,#ff4a52,var(--red));box-shadow:0 14px 30px rgba(239,28,37,0.22)}
.arc{
  position:absolute;border:2px solid rgba(239,28,37,0.35);border-left:0;border-bottom:0;border-radius:999px;
  width:138px;height:138px;right:42px;top:28px;transform:rotate(25deg);
}

.pdp-sidebar{padding:22px;position:sticky;top:104px}
.tag{
  display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(63,73,227,0.08);color:var(--blue);
  font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;border:1px solid rgba(63,73,227,0.14);
}
h1{
  margin:12px 0 8px;font-size:clamp(2rem,4vw,3.4rem);line-height:.98;letter-spacing:-.045em;color:var(--ink);
}
.subtitle{margin:0;color:var(--muted);line-height:1.7;font-size:.98rem}
.price{margin-top:14px;font-size:1.9rem;font-weight:900;color:var(--blue);line-height:1}
.sku{margin-top:10px;font-size:.92rem;color:var(--muted)}
.meta{display:grid;gap:8px;margin-top:14px;color:var(--muted);font-size:.93rem}
.actions{display:grid;gap:10px;margin-top:18px}

.section{padding:0 0 36px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.spec-card,.info-card,.related-card{padding:22px}
.spec-card h2,.info-card h2,.related-title{margin:0 0 14px;font-size:1.35rem}

table{width:100%;border-collapse:collapse;font-size:.96rem}
th,td{text-align:left;padding:11px 0;border-bottom:1px solid var(--border-card);vertical-align:top}
th{width:38%;color:var(--muted);font-weight:600}

.bullet-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.bullet-list li{display:flex;align-items:flex-start;gap:8px;line-height:1.6;color:var(--muted)}
.dot{width:8px;height:8px;border-radius:50%;margin-top:7px;flex:0 0 8px;background:var(--red);box-shadow:0 0 0 4px rgba(239,28,37,.10)}

.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.related-card h3{margin:12px 0 8px;font-size:1.08rem}
.related-card p{margin:0;color:var(--muted);line-height:1.65;font-size:.94rem}
.small-art{
  display:block;position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;
  background:var(--art-gradient);
  border:1px solid var(--border-card);margin-bottom:12px;
}

@media (max-width:1080px){
  .pdp-layout,.two-col,.related-grid{grid-template-columns:1fr}
  .pdp-sidebar{position:static}
}

@media (max-width:700px){
  .thumb-row{grid-template-columns:1fr}
}