@font-face { font-family: "Product Heebo"; src: url("../fonts/lp-business/heebo-400.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Product Heebo"; src: url("../fonts/lp-business/heebo-700.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: "Product Heebo"; src: url("../fonts/lp-business/heebo-900.ttf") format("truetype"); font-style: normal; font-weight: 900; font-display: swap; }
.product-detail {
  font-family: "Product Heebo", "Heebo", sans-serif;
  --product-line: color-mix(in srgb, var(--text-primary) 15%, transparent);
  --product-muted: #b1b5c0;
}
[data-theme="light"] .product-detail { --product-muted: #475569; }
.product-hero > * { min-width: 0; }
.product-price-row { flex-wrap: wrap; }
.product-installation-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 16px 4px;
  color: var(--text-primary);
  font-weight: 700;
  border-bottom: 1px solid var(--product-line);
  text-decoration: none;
}
.product-installation-link:hover { color: var(--accent-cyan); }
.product-description { margin-top: 64px; padding-top: 40px; border-top: 1px solid var(--product-line); }
.product-description h2, .product-installations h2 {
  color: var(--text-primary);
  font-size: clamp(1.6rem, 2.5vw, 2.15rem);
  font-weight: 900;
  line-height: 1.35;
  margin: 0 0 28px;
  text-wrap: balance;
}
.product-description-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 72px; align-items: start; }
.product-copy { max-width: 72ch; color: var(--product-muted); font-size: 1.0625rem; line-height: 1.95; overflow-wrap: anywhere; }
.product-copy > :first-child { margin-top: 0; }
.product-copy > p:first-child { color: var(--text-primary); font-size: 1.125rem; line-height: 1.85; }
.product-copy p { margin: 0 0 20px; }
.product-copy h3 { margin: 36px 0 12px; color: var(--text-primary); font-size: 1.25rem; font-weight: 700; line-height: 1.5; }
.product-copy ul, .product-copy ol { padding-inline-start: 22px; margin: 0 0 24px; list-style: disc; }
.product-copy ol { list-style: decimal; }
.product-copy li { padding-inline-start: 5px; margin-bottom: 12px; }
.product-copy li::marker { color: var(--accent-cyan); }
.product-copy strong { color: var(--text-primary); font-weight: 700; }
.product-copy a { color: var(--accent-cyan); text-decoration: underline; text-underline-offset: 4px; }
.product-copy img { max-width: 100%; height: auto; }
.product-fit { padding: 28px; background: var(--bg-secondary); border-radius: 14px; }
.product-fit h3 { margin: 0 0 16px; color: var(--text-primary); font-size: 1.25rem; line-height: 1.5; font-weight: 700; }
.product-fit p { color: var(--product-muted); font-size: .9375rem; line-height: 1.85; margin: 0 0 24px; }
.product-fit .btn-primary { width: 100%; padding: 14px 12px; justify-content: center; text-align: center; font-size: .9375rem; }
.product-fit p.product-fit-note { margin: 16px 0 0; font-size: .8125rem; text-align: center; }
.product-installations { margin-top: 72px; padding-top: 48px; border-top: 1px solid var(--product-line); scroll-margin-top: 110px; }
.product-installations-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; margin-bottom: 32px; }
.product-installations-heading h2 { margin-bottom: 0; }
.product-installations-heading p { max-width: 58ch; color: var(--product-muted); line-height: 1.85; margin: 0; }
.product-installations-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
.product-installations-grid figure { min-width: 0; margin: 0; }
.product-installations-grid a { position: relative; display: block; overflow: hidden; border-radius: 12px; background: var(--bg-secondary); color: #fff; }
.product-installations-grid img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; }
.product-photo-open { position: absolute; bottom: 14px; left: 14px; display: inline-flex; align-items: center; gap: 8px; background: #0a0708e8; color: #fff; border-radius: 6px; padding: 8px 12px; font-size: .8125rem; }
.product-installations-grid a:hover .product-photo-open { text-decoration: underline; text-underline-offset: 4px; }
.product-installations-grid figcaption { color: var(--product-muted); font-size: .875rem; line-height: 1.6; margin-top: 12px; }
.product-installations-cta { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 40px; padding: 28px 0; border-block: 1px solid var(--product-line); }
.product-installations-cta h3 { font-size: 1.25rem; line-height: 1.5; color: var(--text-primary); font-weight: 700; margin: 0 0 8px; }
.product-installations-cta p { color: var(--product-muted); line-height: 1.7; margin: 0; }
.product-detail a:focus-visible { outline: 2px solid var(--accent-cyan); outline-offset: 5px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
@media (max-width: 959px) {
  .product-description-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .product-copy { max-width: 72ch; }
  .product-fit { max-width: 640px; }
  .product-installations-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-installations-heading { grid-template-columns: 1fr; gap: 16px; }
}
@media (max-width: 639px) {
  .product-description { margin-top: 44px; padding-top: 28px; }
  .product-copy { font-size: 1rem; line-height: 1.9; }
  .product-copy > p:first-child { font-size: 1.0625rem; }
  .product-description h2 { margin-bottom: 22px; }
  .product-fit { padding: 24px; }
  .product-installations { margin-top: 48px; padding-top: 32px; }
  .product-installations-grid { grid-template-columns: 1fr; gap: 28px; }
  .product-installations-cta { flex-direction: column; align-items: stretch; gap: 24px; }
  .product-installations-cta .btn-primary { justify-content: center; text-align: center; }
}