/* Shared by the demo and the future PHP product-detail partials. */
#hhm-product-detail {--pd-orange:#f66b15;--pd-ink:#263140;--pd-muted:#687280;font:16px/1.65 'Segoe UI',Arial,sans-serif;color:var(--pd-ink);max-width:1340px;margin:auto;padding:24px 28px 48px;box-sizing:border-box;}
#hhm-product-detail *,#hhm-product-detail *::before,#hhm-product-detail *::after {box-sizing:border-box;}
#hhm-product-detail h1,#hhm-product-detail h2,#hhm-product-detail h3 {color:var(--pd-ink);font-family:inherit;line-height:1.3;margin:0 0 18px;font-weight:700;}
#hhm-product-detail h1 {font-size:30px;margin:12px 0 8px;}
#hhm-product-detail h2 {font-size:23px;}
#hhm-product-detail h3 {font-size:19px;}
#hhm-product-detail p {margin:0 0 16px;}
#hhm-product-detail a {color:#b74306;}
#hhm-product-detail button,#hhm-product-detail input,#hhm-product-detail textarea {font:inherit;}
#hhm-product-detail button {cursor:pointer;}
#hhm-product-detail button:focus-visible,#hhm-product-detail a:focus-visible,#hhm-product-detail input:focus-visible,#hhm-product-detail textarea:focus-visible,.hhm-detail-dialog button:focus-visible {outline:3px solid #ffae79;outline-offset:3px;}
#hhm-product-detail .pd-breadcrumb {display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--pd-muted);}
#hhm-product-detail .pd-review-state {display:inline-block;font-size:14px;margin-bottom:22px;color:var(--pd-muted);}
#hhm-product-detail .pd-hero {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'gallery buy' 'assurance buy';column-gap:44px;row-gap:16px;align-items:start;}
#hhm-product-detail .pd-gallery {grid-area:gallery;}
#hhm-product-detail .pd-buy {grid-area:buy;}
#hhm-product-detail .pd-assurance {grid-area:assurance;}
#hhm-product-detail .pd-gallery,#hhm-product-detail .pd-buy {min-width:0;}
#hhm-product-detail .pd-image-button {display:flex;align-items:center;justify-content:center;width:100%;height:475px;border:1px solid #f0e6df;border-radius:24px;background:#fffaf7;padding:30px;}
#hhm-product-detail .pd-image-button img {width:100%;height:100%;object-fit:contain;transition:opacity .18s ease;}
#hhm-product-detail .pd-thumbnails {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 10px;}
#hhm-product-detail .pd-thumbnail {min-width:0;border:1px solid #e6e8eb;border-radius:12px;background:white;padding:8px;color:var(--pd-ink);font-size:12px;}
#hhm-product-detail .pd-thumbnail img {display:block;width:100%;height:76px;object-fit:contain;margin-bottom:4px;}
#hhm-product-detail button[aria-pressed=true] {border-color:var(--pd-orange);background:#fff2e8;box-shadow:inset 0 0 0 1px var(--pd-orange);}
#hhm-product-detail .pd-caption {font-size:13px;color:var(--pd-muted);}
#hhm-product-detail .pd-assurance {margin-top:24px;padding:24px;border-top:1px solid #e9e3de;}
#hhm-product-detail .pd-assurance p {font-size:14px;}
#hhm-product-detail .pd-price {font-size:34px;font-weight:750;color:#c64b08;line-height:1.2;}
#hhm-product-detail .pd-reference {font-size:14px;color:var(--pd-muted);margin:8px 0 22px;min-height:23px;}
#hhm-product-detail fieldset {padding:0;border:0;min-width:0;margin:0 0 24px;}
#hhm-product-detail legend {display:block;float:none;border:0;font:600 16px/1.4 'Segoe UI',Arial,sans-serif;color:var(--pd-ink);margin-bottom:12px;width:auto;}
#hhm-product-detail .pd-options {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
#hhm-product-detail .pd-option {position:relative;min-height:56px;border:1px solid #dce0e5;border-radius:10px;background:white;padding:12px 8px;color:var(--pd-ink);font-size:14px;font-weight:600;}
#hhm-product-detail .pd-option[aria-pressed=true]::after {content:'✓';position:absolute;right:6px;top:2px;color:#b94304;font-size:11px;}
#hhm-product-detail .pd-swatch {display:inline-block;width:12px;height:12px;vertical-align:middle;border-radius:50%;border:1px solid #0002;margin-right:5px;}
#hhm-product-detail .pd-selection {padding:12px 16px;border-radius:10px;background:#f7f8fa;margin-bottom:10px;font-weight:600;}
#hhm-product-detail .pd-data-note {font-size:12px;color:var(--pd-muted);margin-bottom:18px;}
#hhm-product-detail .pd-action {display:inline-flex;justify-content:center;align-items:center;min-height:50px;border-radius:12px;border:1px solid #f3c7ab;padding:12px 16px;font-weight:650;background:#fff5ec;color:#a93e06;text-decoration:none;}
#hhm-product-detail .pd-primary {width:100%;background:var(--pd-orange);color:white;border-color:var(--pd-orange);font-size:18px;}
#hhm-product-detail .pd-secondary {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 24px;}
#hhm-product-detail .pd-promotions {border:1px solid #f0d5c4;border-radius:16px;padding:20px;background:#fffaf6;margin-bottom:20px;}
#hhm-product-detail .pd-promotions summary {font-size:17px;font-weight:700;cursor:pointer;}
#hhm-product-detail .pd-promotions .pd-promotion-content {font-size:14px;padding-top:16px;}
#hhm-product-detail .pd-promotion-content p {margin-bottom:10px;}
#hhm-product-detail .pd-service {font-size:14px;}
#hhm-product-detail .pd-nav {display:flex;gap:8px;flex-wrap:wrap;margin:40px 0 28px;padding-bottom:16px;border-bottom:1px solid #e6e9ed;}
#hhm-product-detail .pd-nav a {padding:10px 18px;border-radius:24px;background:#fff1e6;font-size:14px;font-weight:650;text-decoration:none;}
#hhm-product-detail .pd-content-grid {display:grid;grid-template-columns:minmax(0,1fr);gap:36px;align-items:start;}
#hhm-product-detail section[id] {scroll-margin-top:115px;}
#hhm-product-detail .pd-article {min-width:0;}
#hhm-product-detail .pd-article-body {max-height:720px;overflow:hidden;position:relative;}
#hhm-product-detail .pd-article-body:not(.is-expanded)::after {content:'';position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(transparent,white);pointer-events:none;}
#hhm-product-detail .pd-article-body.is-expanded {max-height:none;}
#hhm-product-detail .pd-article-body img {display:block;max-width:100%!important;height:auto!important;margin:22px auto;border-radius:14px;}
#hhm-product-detail .pd-article-body h2 {font-size:23px;margin-top:28px;}
#hhm-product-detail .pd-article-body h3 {margin-top:22px;}
#hhm-product-detail table {width:100%!important;table-layout:fixed;border-collapse:collapse;font-size:14px;}
#hhm-product-detail td,#hhm-product-detail th {padding:12px;border:1px solid #e8eaee;overflow-wrap:anywhere;vertical-align:top;}
#hhm-product-detail td p {margin:0;}
#hhm-product-detail ul {padding-left:20px;}
#hhm-product-detail .pd-specs {padding:24px;border:1px solid #e8e9ed;border-radius:18px;background:#fafbfc;min-width:0;}
#hhm-product-detail .pd-spec-summary {margin:0;}
#hhm-product-detail .pd-spec-summary div {display:grid;grid-template-columns:1fr 1.4fr;gap:12px;padding:12px 0;border-bottom:1px solid #e5e7eb;font-size:14px;}
#hhm-product-detail .pd-spec-summary dt {font-weight:400;color:var(--pd-muted);}
#hhm-product-detail .pd-spec-summary dd {margin:0;font-weight:600;}
#hhm-product-detail .pd-specs details {margin-top:18px;}
#hhm-product-detail .pd-specs summary {cursor:pointer;color:#b74306;font-weight:600;padding:10px 0;}
#hhm-product-detail .pd-spec-table {max-height:650px;overflow:auto;margin-top:12px;}
#hhm-product-detail .pd-spec-table td[colspan] {background:#fff0e6;font-weight:650;}
#hhm-product-detail .pd-reviews {margin-top:40px;padding-top:28px;border-top:1px solid #e5e8ec;}
#hhm-product-detail .pd-review-grid {display:grid;grid-template-columns:1fr 1.5fr;gap:36px;}
#hhm-product-detail .pd-empty {background:#faf7f3;padding:28px;border-radius:16px;}
#hhm-product-detail .pd-review-form label {display:block;font-size:14px;margin-bottom:12px;}
#hhm-product-detail .pd-review-form input,#hhm-product-detail .pd-review-form textarea,#hhm-product-detail .pd-review-form select {display:block;width:100%;padding:12px;border:1px solid #d9dfe5;border-radius:10px;background:white;margin-top:5px;}
#hhm-product-detail .pd-related {margin-top:40px;}
#hhm-product-detail .pd-related-card {max-width:300px;}
.hhm-detail-dialog {width:min(620px,calc(100% - 32px));border:0;border-radius:20px;padding:28px;color:#263140;font:16px/1.6 'Segoe UI',Arial,sans-serif;box-shadow:0 24px 80px #0004;}
.hhm-detail-dialog::backdrop {background:#1c263b88;}
.hhm-detail-dialog h2 {font-size:23px;margin:0 0 16px;color:#263140;}
.hhm-detail-dialog img {width:100%;max-height:65vh;object-fit:contain;}
.hhm-detail-dialog button {border:0;border-radius:10px;background:#f66b15;color:white;padding:12px 22px;font:600 15px 'Segoe UI',Arial,sans-serif;cursor:pointer;margin-top:18px;}
@media(max-width:1100px) {#hhm-product-detail {padding:22px 24px;}#hhm-product-detail .pd-hero {gap:26px;}#hhm-product-detail .pd-options {grid-template-columns:repeat(2,minmax(0,1fr));}#hhm-product-detail .pd-image-button {height:390px;padding:20px;}#hhm-product-detail .pd-content-grid {grid-template-columns:minmax(0,1fr);gap:24px;}}
@media(max-width:800px) {#hhm-product-detail .pd-hero,#hhm-product-detail .pd-content-grid,#hhm-product-detail .pd-review-grid {grid-template-columns:1fr;}#hhm-product-detail .pd-hero {grid-template-areas:'gallery' 'buy' 'assurance' 'specs';}#hhm-product-detail .pd-image-button {height:420px;}#hhm-product-detail .pd-assurance {padding:16px;margin-top:12px;}#hhm-product-detail .pd-price {font-size:30px;}#hhm-product-detail .pd-options {grid-template-columns:repeat(4,minmax(0,1fr));}}
@media(max-width:480px) {#hhm-product-detail {padding:18px 16px 32px;}#hhm-product-detail h1 {font-size:24px;}#hhm-product-detail .pd-image-button {height:330px;border-radius:18px;padding:20px;}#hhm-product-detail .pd-thumbnail img {height:56px;}#hhm-product-detail .pd-thumbnails {gap:6px;}#hhm-product-detail .pd-options {grid-template-columns:repeat(2,minmax(0,1fr));}#hhm-product-detail .pd-nav a {padding:9px 11px;font-size:13px;}#hhm-product-detail .pd-specs {padding:18px;}#hhm-product-detail .pd-secondary {gap:8px;}#hhm-product-detail .pd-action {padding:12px 10px;font-size:14px;}}
@media(prefers-reduced-motion:reduce) {#hhm-product-detail .pd-image-button img {transition:none;}html {scroll-behavior:auto!important;}}
/* Refinement: independent media flow avoids distributed grid-row blank space. */
#hhm-product-detail .pd-hero {grid-template-areas:'media buy';}
#hhm-product-detail .pd-media {grid-area:media;min-width:0;}
#hhm-product-detail .pd-assurance {margin-top:16px;padding:20px 12px;}
#hhm-product-detail .pd-assurance p,#hhm-product-detail .pd-service {font-size:16px;line-height:1.75;}
#hhm-product-detail .pd-promotions .pd-promotion-content {font-size:16px;line-height:1.65;}
#hhm-product-detail .pd-promo-group + .pd-promo-group {border-top:1px solid #efded2;padding-top:14px;margin-top:14px;}
#hhm-product-detail .pd-promo-group h3 {font-size:15px;color:#97502a;margin:0 0 10px;}
#hhm-product-detail .pd-promo-group ul {list-style:none;margin:0;padding:0;}
#hhm-product-detail .pd-promo-group li {display:flex;align-items:flex-start;gap:12px;margin:0 0 12px;}
#hhm-product-detail .pd-promo-icon {display:flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border-radius:9px;background:#fff0e4;color:#c9510e;}
#hhm-product-detail .pd-promo-icon svg {width:21px;height:21px;}
.hhm-detail-dialog {position:fixed!important;inset:0!important;margin:auto!important;height:fit-content;max-height:calc(100dvh - 32px);overflow:auto;}
#pd-image-dialog {width:min(940px,calc(100vw - 32px));padding:18px;}
.pd-viewer-header {display:flex;align-items:center;justify-content:space-between;gap:12px;}
.pd-viewer-header h2 {font-size:19px;margin:0;}
.pd-viewer-header button {margin:0;width:42px;height:42px;padding:0;font-size:27px;}
.pd-zoom-stage {display:flex;align-items:center;justify-content:center;overflow:hidden;height:min(64dvh,600px);margin:14px 0;background:#faf8f6;border-radius:14px;touch-action:none;cursor:zoom-in;}
.pd-zoom-stage.is-zoomed {cursor:grab;}
.pd-zoom-stage.is-dragging {cursor:grabbing;}
.pd-zoom-stage img {display:block;width:100%;height:100%;max-height:none;object-fit:contain;transform-origin:center;user-select:none;pointer-events:none;}
.pd-zoom-tools {display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;}
.pd-zoom-tools button {margin:0;min-height:44px;min-width:44px;padding:8px 14px;}
.pd-zoom-tools button:disabled {opacity:.4;cursor:default;}
.pd-zoom-tools output {min-width:54px;text-align:center;font-weight:650;}
.pd-zoom-hint {margin:12px 0 0;text-align:center;font-size:13px;color:#687280;}
#hhm-product-detail .pd-feedback-mode label {display:inline-flex;gap:8px;align-items:center;margin:0 14px 10px 0;}
#hhm-product-detail .pd-feedback-mode input {display:inline-block;width:auto;margin:0;}
#hhm-product-detail .pd-stars {display:flex;gap:10px;}
#hhm-product-detail .pd-star {position:relative;display:flex;margin:0;cursor:pointer;padding:4px;}
#hhm-product-detail .pd-star input {position:absolute;width:1px;height:1px;padding:0;border:0;clip-path:inset(50%);overflow:hidden;margin:0;}
#hhm-product-detail .pd-star svg {width:34px;height:34px;fill:#fff;stroke:#b3bbc5;stroke-width:1.4;}
#hhm-product-detail .pd-star.is-filled svg {fill:#ffbd36;stroke:#d99310;}
#hhm-product-detail .pd-star:focus-within {outline:2px solid #f66b15;outline-offset:2px;border-radius:6px;}
#hhm-product-detail .pd-rating-hint {font-size:14px;color:#687280;margin-top:8px;}
#hhm-product-detail .pd-rating[hidden] {display:none;}
#hhm-product-detail .pd-news-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
#hhm-product-detail .pd-news-card {border:1px solid #e8e5e2;border-radius:16px;overflow:hidden;text-decoration:none;background:#fff;color:#263140;}
#hhm-product-detail .pd-news-card img {display:block;width:100%;height:190px;object-fit:cover;}
#hhm-product-detail .pd-news-card h3 {font-size:17px;line-height:1.5;margin:16px;}
#hhm-product-detail .pd-news-card:hover h3 {color:#c9510e;}
@media(max-width:800px) {#hhm-product-detail .pd-hero {grid-template-areas:'gallery' 'buy' 'assurance' 'specs';}#hhm-product-detail .pd-media {display:contents;}#hhm-product-detail .pd-news-grid {grid-template-columns:1fr;}#hhm-product-detail .pd-news-card {display:grid;grid-template-columns:110px 1fr;align-items:center;}#hhm-product-detail .pd-news-card img {height:110px;}#hhm-product-detail .pd-news-card h3 {font-size:16px;margin:12px;}}
@media(max-width:480px) {#pd-image-dialog {padding:12px;width:calc(100vw - 20px);max-height:calc(100dvh - 20px);}.pd-zoom-stage {height:55dvh;}.pd-zoom-hint {font-size:12px;}.pd-zoom-tools {gap:8px;}#hhm-product-detail .pd-promotion-content {font-size:16px;}}
#hhm-product-detail [data-action="article"] {display:flex;width:max-content;max-width:100%;margin:16px auto 0;font-size:17px;}
@media(max-width:480px) {#hhm-product-detail [data-action="article"] {font-size:15px;}}
#hhm-product-detail .pd-gallery-play {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0;}
#hhm-product-detail .pd-gallery-play p {margin:0;}
#hhm-product-detail [data-autoplay],#hhm-product-detail [data-news-step] {border:1px solid #f0c9b0;border-radius:10px;background:#fff4eb;color:#9f410e;padding:8px 12px;font-size:13px;min-height:42px;flex:none;}
#hhm-product-detail .pd-auto-image {animation:pd-auto-fade .35s ease;}
@keyframes pd-auto-fade {from {opacity:.25;}to {opacity:1;}}
#hhm-product-detail .pd-news-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;}
#hhm-product-detail .pd-news-heading h2 {margin:0;}
#hhm-product-detail .pd-news-controls {display:flex;gap:8px;}
#hhm-product-detail .pd-news-controls[hidden] {display:none;}
#hhm-product-detail .pd-news-grid {display:flex;overflow-x:auto;gap:20px;scroll-snap-type:x mandatory;scrollbar-width:thin;overscroll-behavior-x:contain;padding:2px 0 12px;}
#hhm-product-detail .pd-news-card {flex:0 0 calc((100% - 40px)/3);min-width:0;scroll-snap-align:start;}
@media(max-width:1100px) {#hhm-product-detail .pd-news-card {flex-basis:calc((100% - 20px)/2);}}
@media(max-width:800px) {#hhm-product-detail .pd-news-card {flex-basis:100%;}#hhm-product-detail .pd-news-heading {align-items:flex-start;flex-direction:column;}}
@media(prefers-reduced-motion:reduce) {#hhm-product-detail .pd-auto-image {animation:none;}#hhm-product-detail .pd-news-grid {scroll-behavior:auto;}}
/* Timed news frames dissolve into the next set instead of scrolling a rail. */
#hhm-product-detail .pd-image-button {position:relative;}
#hhm-product-detail .pd-image-button .pd-image-fading {position:absolute;inset:0;width:100%;height:100%;padding:inherit;box-sizing:border-box;pointer-events:none;}
#hhm-product-detail .pd-news-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;scroll-snap-type:none;}
#hhm-product-detail .pd-news-card[hidden] {display:none!important;}
@media(max-width:1100px) {#hhm-product-detail .pd-news-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:800px) {#hhm-product-detail .pd-news-grid {grid-template-columns:1fr;}}

/* Specifications follow assurances in the media column; article spans the page. */
#hhm-product-detail .pd-specs {grid-area:specs;margin-top:16px;}
#hhm-product-detail .pd-related-card .hhm-card-visual {display:flex;align-items:center;justify-content:center;aspect-ratio:1;padding:16px;}
#hhm-product-detail .pd-related-card .hhm-card-visual img {display:block;width:100%;height:100%;min-height:0;object-fit:contain;}
@media(max-width:800px) {#hhm-product-detail .pd-specs {margin-top:0;}}