.product-shell {
  min-height: 100vh;
  padding: 28px 16px 48px;
  background:
    linear-gradient(rgba(12, 16, 38, .8), rgba(12, 16, 38, .92)),
    url("../assets/background.jpg") center / cover fixed no-repeat;
}

.product-card {
  width: min(100%, 900px);
  margin: 0 auto;
  padding: 42px 48px;
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 26px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 26px 80px rgba(0,0,0,.34);
}

.breadcrumb { display: flex; gap: 8px; color: #7b7f8b; font-size: 13px; }
.breadcrumb a, .text-link, .product-footer a { color: #b85b18; font-weight: 750; text-decoration: none; }

.product-hero {
  display: grid;
  grid-template-columns: 104px 1fr;
  gap: 24px;
  align-items: center;
  margin: 28px 0 30px;
}
.product-hero img { border-radius: 22px; box-shadow: 0 12px 30px rgba(0,153,234,.18); }
.eyebrow { margin: 0 0 6px; color: #ff8124; font-size: 11px; font-weight: 850; letter-spacing: .16em; }
.product-hero h1 { margin: 0; font-size: clamp(28px, 5vw, 42px); line-height: 1.2; }
.product-hero div > p:last-child { margin: 12px 0 0; color: #5e6270; font-size: 15px; line-height: 1.8; }

.product-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.product-actions a {
  display: grid;
  place-items: center;
  min-height: 56px;
  padding: 12px;
  border: 1px solid #ffd0aa;
  border-radius: 13px;
  color: #ae5617;
  text-align: center;
  text-decoration: none;
  font-weight: 800;
  background: #fff5ec;
}
.product-actions .primary-action { color: #fff; border-color: #ff8a2a; background: linear-gradient(135deg, #ff9f45, #ff8124); }

.product-card section { margin-top: 38px; padding-top: 32px; border-top: 1px solid #ececf0; }
.product-card h2 { margin: 0 0 14px; font-size: 25px; line-height: 1.35; }
.product-card section > p, .device-grid p, .safety-list, details p, .product-notice p { color: #5f6370; font-size: 15px; line-height: 1.85; }

.device-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.device-grid article { padding: 20px; border: 1px solid #ececf1; border-radius: 15px; background: #fafafd; }
.device-grid h3 { margin: 0 0 7px; font-size: 17px; }
.device-grid p { margin: 0; font-size: 14px; }
.safety-list { margin: 0 0 16px; padding-left: 22px; }
.safety-list li + li { margin-top: 7px; }

details { border-top: 1px solid #ececf0; }
details:last-of-type { border-bottom: 1px solid #ececf0; }
summary { padding: 17px 3px; cursor: pointer; font-weight: 750; }
details p { margin: -4px 3px 17px; }

.product-notice { margin-top: 34px; padding: 20px; border: 1px solid #ffd0aa; border-radius: 15px; background: #fff8f2; }
.product-notice strong { color: #b75a19; }
.product-notice p { margin: 7px 0 0; font-size: 13px; }
.product-footer { display: flex; justify-content: space-between; gap: 18px; margin-top: 28px; }

@media (max-width: 680px) {
  .product-shell { padding: 12px 10px 28px; background-attachment: scroll; }
  .product-card { padding: 26px 20px; border-radius: 20px; }
  .product-hero { grid-template-columns: 74px 1fr; gap: 15px; margin-block: 23px; }
  .product-hero img { width: 74px; height: 74px; border-radius: 17px; }
  .product-hero h1 { font-size: 27px; }
  .product-hero div > p:last-child { grid-column: 1 / -1; font-size: 14px; }
  .product-actions { grid-template-columns: 1fr; }
  .product-actions a { min-height: 54px; }
  .product-card section { margin-top: 30px; padding-top: 25px; }
  .product-card h2 { font-size: 22px; }
  .device-grid { grid-template-columns: 1fr; }
  .product-footer { flex-direction: column; text-align: center; }
}
