.product-detail-page { background: #fff; }
.product-detail-page .footer { margin-top: 0; }
.product-detail-main { padding-top: var(--nav-h); }

.product-detail-hero {
  --detail-hero-bg: #1d181a;
  position: relative;
  min-height: clamp(470px, 55vw, 850px);
  overflow: hidden;
  isolation: isolate;
  background: var(--detail-hero-bg);
  color: #fff;
}

.damavand-hero { --detail-hero-bg: #8f0000; }
.product-detail-hero > img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.product-detail-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(0,0,0,.18), transparent 52%);
  pointer-events: none;
}

.product-hero-copy {
  position: absolute;
  top: 25%;
  left: var(--gut);
}
.product-hero-copy h1 {
  font-size: clamp(48px, 5.2vw, 84px);
  font-weight: 400;
  line-height: .86;
  letter-spacing: -.025em;
  white-space: nowrap;
}
.product-hero-copy > p {
  margin-top: clamp(9px, .8vw, 13px);
  font-size: clamp(20px, 1.75vw, 28px);
  line-height: 1;
  text-align: left;
}
.product-shop-button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 52px;
  margin-top: clamp(40px, 4vw, 64px);
  padding: 9px 17px 6px;
  background: var(--orange);
  color: #fff;
  font-size: clamp(17px, 1.3vw, 22px);
  line-height: 1;
  text-decoration: none;
  transition: background-color .22s ease, transform .22s ease;
}
.product-shop-button span { font-size: 1.45em; line-height: .6; }
.product-shop-button:hover,
.product-shop-button:focus-visible { background: #d94d1a; transform: translateY(-2px); }

.product-hero-credit {
  position: absolute;
  right: var(--gut);
  bottom: clamp(40px, 5vw, 78px);
  color: rgba(255,255,255,.72);
  font-size: clamp(17px, 1.35vw, 22px);
  line-height: .92;
  text-align: right;
}
.product-hero-credit strong { color: #fff; font-weight: 400; }

.product-detail-content { padding-top: clamp(66px, 7vw, 112px); padding-bottom: clamp(70px, 7vw, 112px); }
.product-detail-content section { scroll-margin-top: calc(var(--nav-h) + 18px); }
.product-section-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: clamp(125px, 10vw, 160px);
  min-height: clamp(54px, 4.4vw, 70px);
  padding: 11px 18px 7px;
  background: var(--peach);
  color: var(--ink);
  font-size: clamp(20px, 1.7vw, 28px);
  font-weight: 400;
  line-height: 1;
}
.product-section-tag-stacked { flex-direction: column; align-items: flex-start; line-height: .72; }
.product-section-tag-stacked span { color: var(--muted); font-size: .6em; }
.product-section-tag-stacked strong { font-size: 1em; font-weight: 400; }

.product-concept { padding-bottom: clamp(86px, 9vw, 146px); }
.concept-copy {
  color: #585858;
  font-size: clamp(17px, 1.32vw, 22px);
  line-height: 1.35;
}
.concept-copy p { text-align: justify; }
.concept-copy p + p { margin-top: 4px; }
.akbar-concept .concept-copy { max-width: 830px; margin-top: clamp(38px, 4vw, 62px); }

.damavand-concept-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas:
    "floor family"
    "dandelion portrait";
  gap: clamp(34px, 4vw, 64px) clamp(36px, 5vw, 80px);
  margin-top: clamp(38px, 4vw, 62px);
  align-items: start;
}
.concept-family-copy { grid-area: family; }
.concept-floor-image { grid-area: floor; }
.concept-dandelion-copy { grid-area: dandelion; }
.concept-portrait-image { grid-area: portrait; }
.concept-floor-image { aspect-ratio: 770 / 886; }
.concept-portrait-image { aspect-ratio: 855 / 1237; }

.product-specs { padding-bottom: clamp(96px, 10vw, 160px); }
.specs-layout {
  display: grid;
  grid-template-columns: minmax(340px, .9fr) minmax(0, 1.1fr);
  gap: clamp(52px, 7vw, 112px);
  margin-top: clamp(48px, 5.5vw, 88px);
  align-items: center;
}
.specs-list { margin: 0; }
.specs-list > div {
  display: grid;
  grid-template-columns: minmax(130px, .9fr) minmax(160px, 1.4fr);
  align-items: start;
  gap: 18px;
  padding: clamp(10px, .9vw, 14px) 0 clamp(7px, .7vw, 11px);
  border-bottom: 1px solid #555;
}
.specs-list dt,
.specs-list dd { font-size: clamp(15px, 1.1vw, 18px); line-height: 1.14; }
.specs-list dt { color: var(--muted); text-transform: uppercase; }
.specs-list dd { color: #292929; }
.height-options dd { display: flex; gap: 8px; }
.height-options dd span { min-width: 58px; padding: 4px 9px 2px; background: #8f8f8f; color: #fff; text-align: center; }
.height-options dd span:last-child { background: var(--orange); }

.akbar-dimensions { display: flex; align-items: center; justify-content: center; gap: clamp(30px, 4vw, 68px); }
.akbar-dimensions img:first-child { width: min(43%, 427px); }
.akbar-dimensions img:last-child { width: min(37%, 345px); }

.damavand-dimensions {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  grid-template-rows: 1fr 1fr;
  align-items: center;
  gap: clamp(14px, 2vw, 30px);
}
.damavand-dimensions img { width: 100%; height: 100%; object-fit: contain; }
.dimension-tall { grid-row: 1 / 3; }
.dimension-top { grid-column: 2; grid-row: 1; }
.dimension-short { grid-column: 2; grid-row: 2; }

.product-gallery { padding-bottom: clamp(58px, 6vw, 92px); }
.gallery-frame { overflow: hidden; background: #e7e4e1; }
.gallery-frame img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.002); transition: transform .72s cubic-bezier(.2,.72,.2,1); }
.gallery-frame:hover img { transform: scale(1.035); }

.akbar-gallery-grid,
.damavand-gallery-grid { display: grid; gap: clamp(12px, 1.2vw, 20px); margin-top: clamp(46px, 5vw, 78px); }
.akbar-gallery-grid {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: minmax(0, .72fr) minmax(0, .3fr) minmax(0, .98fr);
  aspect-ratio: 1.12 / 1;
}
.akbar-gallery-warm { grid-column: 1; grid-row: 1 / 3; }
.akbar-gallery-profile { grid-column: 2; grid-row: 1; }
.akbar-gallery-detail { grid-column: 1; grid-row: 3; }
.akbar-gallery-hand { grid-column: 2; grid-row: 2 / 4; }
.akbar-gallery-grid .gallery-frame { min-height: 0; }

.damavand-gallery-grid { grid-template-columns: 1fr 1fr; }
.damavand-gallery-grid > .gallery-frame:not(.damavand-gallery-wide) { aspect-ratio: .77 / 1; }
.damavand-gallery-wide { grid-column: 1 / -1; aspect-ratio: 1376 / 768; }

.product-year { display: inline-flex; flex-direction: column; font-size: clamp(22px, 2vw, 32px); line-height: .88; text-align: left; }
.product-year strong { font-weight: 400; }

@media (max-width: 900px) {
  .product-detail-hero { min-height: clamp(520px, 72vw, 680px); }
  .product-hero-copy { top: 20%; }
  .specs-layout { grid-template-columns: 1fr; }
  .akbar-dimensions { max-width: 720px; margin-inline: auto; }
  .damavand-dimensions { max-width: 760px; margin-inline: auto; }
}

@media (max-width: 700px) {
  .product-detail-hero { min-height: calc(100svh - var(--nav-h)); max-height: 760px; }
  .product-detail-hero > img { object-position: 64% center; }
  .product-detail-hero::after { background: linear-gradient(180deg, rgba(0,0,0,.2), transparent 46%, rgba(0,0,0,.14)); }
  .product-hero-copy { top: 10%; left: 22px; right: 22px; }
  .product-hero-copy h1 { font-size: clamp(42px, 12vw, 62px); white-space: normal; }
  .product-hero-copy > p { font-size: 20px; }
  .product-shop-button { min-height: 48px; margin-top: 30px; font-size: 18px; }
  .product-hero-credit { right: 22px; bottom: 24px; font-size: 16px; }

  .damavand-concept-grid {
    grid-template-columns: 1fr;
    grid-template-areas: "family" "floor" "dandelion" "portrait";
  }
  .concept-copy { font-size: 17px; }
  .concept-copy p { text-align: left; }
  .concept-floor-image { aspect-ratio: 770 / 886; }
  .concept-portrait-image { aspect-ratio: 855 / 1080; }
  .concept-portrait-image img { object-position: center 28%; }

  .specs-layout { gap: 48px; }
  .specs-list > div { grid-template-columns: 122px 1fr; gap: 14px; }
  .specs-list dt, .specs-list dd { font-size: 15px; }
  .akbar-dimensions { gap: 18px; }
  .akbar-dimensions img:first-child { width: 47%; }
  .akbar-dimensions img:last-child { width: 41%; }

  .akbar-gallery-grid,
  .damavand-gallery-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
  .akbar-gallery-grid { aspect-ratio: auto; }
  .akbar-gallery-grid .gallery-frame { grid-column: auto; grid-row: auto; aspect-ratio: auto; }
  .damavand-gallery-wide { grid-column: auto; aspect-ratio: 1.45 / 1; }
}

@media (max-width: 430px) {
  .product-hero-copy h1 { font-size: clamp(38px, 11vw, 48px); }
  .damavand-dimensions { gap: 8px; }
  .specs-list > div { grid-template-columns: 108px 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-frame img { transition: none; }
  .gallery-frame:hover img { transform: none; }
}
