/* Product photography keeps its full frame; portrait packaging gets more height. */
body { color: #242a2c; }
.header-main { padding: 16px 0; border-bottom: 0; }
.main-nav { background: #fff; border-top: 1px solid #e6e8e8; border-bottom: 1px solid #e6e8e8; }
.main-nav > ul > li > a { color: #303638; padding-block: 14px; }
.main-nav > ul > li > a:hover, .main-nav > ul > li > a:focus-visible { background: #faf0f1; color: #a5222b; }
.main-nav ul ul { border-radius: 0 0 6px 6px; box-shadow: 0 10px 24px #242a2c12; }
.button { border-radius: 6px; padding: 12px 18px; transition: background-color .15s, border-color .15s; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #247e88; outline-offset: 3px; }
.hero, .route-hero { border: 0; border-radius: 0; padding: 28px 0 36px; gap: 48px; border-bottom: 1px solid #e6e8e8; }
.hero { grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); }
.hero-image { background: #fff; padding: 0; border-radius: 0; }
.hero-image img { width: 100%; max-width: 470px; height: auto; max-height: 350px; object-fit: contain; }
.image-caption { border-top: 0; margin-top: 12px; padding-top: 0; }
.image-caption strong { font-size: 28px; }
.image-caption span { font-size: 14px; }
.route-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
.route-image { position: relative; width: 100%; aspect-ratio: 4 / 3; min-height: 0; max-height: none; padding: 0; background: #fff; border: 1px solid #e6e8e8; border-radius: 8px; overflow: hidden; }
.route-image:has(img[data-format="portrait"]) { aspect-ratio: 4 / 5; max-width: 420px; justify-self: center; }
.route-image:has(img[data-format="wide"]) { aspect-ratio: 2 / 1; }
.route-image img, .route-image img[src*="luminous-"] { position: absolute; inset: 16px; display: block; width: calc(100% - 32px); height: calc(100% - 32px); max-width: none; max-height: none; margin: 0; object-fit: contain; aspect-ratio: auto; }
.route-copy .lead { font-size: 17px; line-height: 1.65; }
.route-article { max-width: 980px; padding: 28px 0; }
.route-article h2 { font-size: 23px; margin-bottom: 16px; }
.route-article p { max-width: 850px; line-height: 1.75; }
.spec-table th { background: #eef5f5; }
.spec-table tbody tr:nth-child(even) { background: #fafbfb; }
.spec-table td { min-width: 0; }
.spec-scroll { border: 1px solid #e3e8e8; border-radius: 6px; }
.material-photo { width: 100%; max-width: 850px; background: #fff; }
.material-photo img { width: 100%; height: auto; max-height: 560px; object-position: center; }
.material-photo:has(img[data-format="portrait"]) { max-width: 450px; }
.material-photo img[data-format="portrait"] { max-height: none; }
.color-card-gallery { align-items: start; gap: 24px; }
.color-card-item { padding: 16px; border-color: #e3e8e8; border-radius: 8px; }
.color-card-open { position: relative; height: auto; aspect-ratio: 4 / 3; display: block; background: #fff; overflow: hidden; }
.color-card-item img, .color-card-item img[src*="luminous-"] { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; object-fit: contain; aspect-ratio: auto; }
.color-card-item figcaption { border-top: 1px solid #eceeee; margin-top: 12px; padding-top: 14px; }
.category-grid { gap: 24px; }
.category-card { grid-template-rows: 200px 1fr; border-color: #e3e8e8; border-radius: 8px; }
.category-image { position: relative; min-height: 0; background: #fff; padding: 0; border-bottom: 1px solid #eef0f0; }
.category-image img { position: absolute; inset: 12px; width: calc(100% - 24px); height: calc(100% - 24px); max-width: none; max-height: none; object-fit: contain; }
.category-copy { padding: 20px; }
.catalog-section { margin-top: 36px; }
.request-section { border-top: 2px solid #b72b31; padding-top: 32px; }
.site-footer { border-top: 1px solid #e6e8e8; margin-top: 24px; }
@media (max-width: 880px) {
  .hero, .route-hero { gap: 24px; }
  .main-nav > ul > li > a { padding-block: 12px; }
}
@media (max-width: 640px) {
  .header-main { padding: 12px 0; }
  .button { padding: 11px 12px; }
  .header-request { padding: 8px 10px; }
  .hero, .route-hero { grid-template-columns: minmax(0,1fr); padding: 14px 0 24px; gap: 22px; }
  .hero-image img { height: 210px; max-height: 210px; }
  .hero-image { padding: 0; }
  .image-caption { gap: 0; margin-top: 4px; }
  .image-caption strong { font-size: 24px; }
  .route-image { width: 100%; aspect-ratio: 4 / 3; padding: 0; max-height: none; }
  .route-image:has(img[data-format="portrait"]) { aspect-ratio: 4 / 5; max-width: 320px; }
  .route-image img { max-height: none; }
  .route-copy .lead { font-size: 15px; }
  .route-article { padding: 22px 0; }
  .route-article h2 { font-size: 21px; }
  .color-card-gallery { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .color-card-item { padding: 12px; }
  .category-grid { gap: 14px; }
  .category-card { grid-template-columns: 112px minmax(0,1fr); grid-template-rows: minmax(146px,auto); }
  .category-image { padding: 0; border-bottom: 0; }
  .category-image img { inset: 6px; width: calc(100% - 12px); height: calc(100% - 12px); }
  .category-copy { padding: 14px; }
  .spec-table { font-size: 12px; }
  .spec-table th, .spec-table td { padding: 10px 7px; overflow-wrap: anywhere; }
}

.image-viewer.is-detailed{width:min(1500px,calc(100% - 20px));height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);overflow:hidden;box-sizing:border-box}
.image-viewer.is-detailed[open]{display:flex;flex-direction:column}
.image-viewer-title{font-size:17px}
.image-viewer-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.image-viewer-tools button,.image-viewer-tools a{font:inherit;font-size:16px;padding:7px 12px;min-height:44px;border:1px solid #76827c;border-radius:4px;background:white;color:#243d33;cursor:pointer}
.image-viewer-tools button:disabled{opacity:.45;cursor:default}
.image-viewer-tools output{min-width:56px;text-align:center;color:#243d33;font-size:16px}
.image-viewer-hint{font-size:15px;line-height:1.45;margin:10px 0;color:#38423e}
.image-viewer-stage{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;background:#eef1ef;touch-action:pan-x pan-y;border:1px solid #b8c2bd;padding:10px}
.image-viewer-stage .image-viewer-image{max-width:none;max-height:none;height:auto;margin:0;object-fit:contain}

.image-viewer:not(.is-detailed) .image-viewer-tools,.image-viewer:not(.is-detailed) .image-viewer-hint{display:none}
.image-viewer:not(.is-detailed) .image-viewer-image{max-width:100%;max-height:calc(100vh - 105px);width:auto!important;margin:0 auto}

.image-viewer[open]{display:flex;flex-direction:column;height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);overflow:hidden;box-sizing:border-box}.image-viewer-bar,.image-viewer-tools,.image-viewer-hint{flex-shrink:0}.image-viewer-stage{flex:1 1 0;min-height:0;min-width:0;overflow:auto;padding:10px;box-sizing:border-box}.image-viewer .image-viewer-stage .image-viewer-image{display:block;max-width:none;max-height:none;margin:0 auto;width:revert!important;height:revert}.image-viewer .image-viewer-stage .image-viewer-image{width:var(--viewer-width)!important;height:var(--viewer-height)}

.image-viewer[open],.image-viewer.is-detailed[open]{width:var(--dialog-width,auto);height:auto;max-height:calc(100dvh - 24px);padding:12px;overflow:hidden;border:0;background:#fff}.image-viewer .image-viewer-stage{flex:0 0 auto;min-height:0;padding:0;border:0;background:transparent;box-sizing:border-box}.image-viewer .image-viewer-stage .image-viewer-image{margin:0 auto}.image-viewer-bar{margin-bottom:8px}.image-viewer-hint{margin:8px 0}.image-viewer-stage:focus{outline:none}.image-viewer-stage:focus-visible{outline:2px solid #243d33;outline-offset:2px}

.image-viewer[open],.image-viewer.is-detailed[open]{height:fit-content}
@media(max-width:880px){.main-nav.is-open{background:#fff}.main-nav.is-open a,.main-nav.is-open ul ul a{color:#303638;opacity:1}.main-nav.is-open>ul>li>a{font-size:16px;font-weight:600}.main-nav.is-open ul ul a{font-size:15px;line-height:1.5;padding:9px 8px}.main-nav.is-open>ul>li{border-bottom:1px solid #dce2df}.main-nav.is-open a:hover,.main-nav.is-open a:focus-visible{color:#8f2027;background:#faf0f1}}
