/* Frontend foundation; admin retains site.css. Layout and theme live in heritage.css. */
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url('./fonts/InterVariable-4.1.woff2') format('woff2')}
.site-body{--font:Inter,"Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;font-family:var(--font);font-size:16px;font-weight:400;line-height:1.5;overflow-wrap:anywhere}
.site-body h1,.site-body h2,.site-body h3{font-family:var(--font);font-weight:700;line-height:1.25;letter-spacing:0;color:var(--ink)}
.site-body p{line-height:1.6}.site-body strong{font-weight:600}.site-body .lede,.site-body .prose,.site-body .prose p:first-child{font-size:16px;line-height:1.6}
.site-body .btn{font-size:14px;font-weight:600;line-height:1.5;min-height:48px;max-width:100%;white-space:normal}
.site-body .small,.site-body .help-text,.site-body .note,.site-body .status-dot{font-size:14px}
.site-body .caption{font-size:12px;letter-spacing:0;line-height:1.5}.site-body .product-card{display:flex;flex-direction:column}.site-body .card-body{flex:1;display:flex;flex-direction:column;min-width:0}.site-body .card-links{margin-top:auto;flex-wrap:wrap;align-items:center}
.site-body label{font-size:14px;font-weight:500}.site-body input,.site-body select,.site-body textarea{font-size:16px;font-weight:400;background:white;min-height:48px}.site-body .checkbox input{min-height:18px}.site-body .checkbox{font-weight:400}
.site-body .alert{font-size:14px}.site-body .alert a{text-decoration:underline}.site-body .field-grid>*,.site-body .footer-grid>*,.site-body .editorial>*,.site-body .contact-grid>*{min-width:0}
.site-body [hidden]{display:none!important}
/* Detail gallery: one image stage, compact thumbnails, top-aligned information. */
.site-body .product-detail-section { padding-top: 2.75rem; padding-bottom: 4rem; }
.site-body .product-detail-section .breadcrumbs { margin-bottom: 1.75rem; }
.site-body .product-detail {
 display: grid;
 grid-template-columns: minmax(0, 480px) minmax(0, 1fr);
 grid-template-areas: "media heading" "media purchase";
 grid-template-rows: auto 1fr;
 gap: 1.5rem clamp(2rem, 5vw, 5rem);
 align-items: start;
}
.site-body .product-media-stack { grid-area: media; min-width: 0; }
.site-body .product-summary-heading { grid-area: heading; min-width: 0; }
.site-body .product-summary-heading .eyebrow { margin-bottom: .875rem; }
.site-body .product-summary-heading h1 { margin-bottom: 1rem; }
.site-body .product-summary-heading .lede { margin-bottom: 1.125rem; color: var(--ink); }
.site-body .product-purchase { grid-area: purchase; min-width: 0; }
.site-body .product-facts { margin: 0; border-top: 1px solid var(--line); }
.site-body .product-facts > div { display: grid; grid-template-columns: 6.75rem minmax(0,1fr); gap: 1rem; padding: 1.125rem 0; border-bottom: 1px solid var(--line); }
.site-body .product-facts dt { font-size: .875rem; font-weight: 500; color: var(--deep); }
.site-body .product-facts dd { margin: 0; font-size: .9375rem; color: var(--muted); }
.site-body .product-purchase .actions { margin: 1.75rem 0 1rem; }
.site-body .product-purchase > p:last-child { margin-bottom: 0; }
.site-body .product-visual { margin: 0; background: none; border: 0; border-radius: 0; overflow: visible; }
.site-body .product-gallery-stage { display: block; position: relative; aspect-ratio: 1; background: #f5f5f0; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.site-body .product-gallery-stage > img { width: 100%; height: 100%; object-fit: contain; }
.site-body .gallery-open-label { position: absolute; right: .75rem; bottom: .75rem; padding: .375rem .625rem; border: 1px solid var(--line); border-radius: 4px; background: #ffffffed; color: var(--deep); font-size: .75rem; line-height: 1.5; transition: background-color .15s, color .15s, border-color .15s; }
.site-body .product-gallery-stage:hover .gallery-open-label, .site-body .product-gallery-stage:focus-visible .gallery-open-label { background: var(--deep); color: #fff; border-color: var(--deep); }
.site-body .product-thumbnails { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .875rem; }
.site-body .product-thumbnail { display: block; width: 4.75rem; height: 4.75rem; border: 2px solid transparent; border-radius: 5px; padding: 3px; background: #f5f5f0; transition: border-color .15s; }
.site-body .product-thumbnail img { width: 100%; height: 100%; object-fit: contain; border-radius: 2px; }
.site-body .product-thumbnail:hover { border-color: #a5b49e; }
.site-body .product-thumbnail[aria-current="true"] { border-color: var(--deep); background: #eaf0e6; }
.site-body .product-visual .product-image-note { padding: .875rem 0 0; border: 0; background: none; font-size: .8125rem; line-height: 1.6; }
.site-body [data-gallery-caption]:not([hidden]) { display: block; margin-top: .25rem; }
.site-body .product-detail-section .info-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.site-body .product-detail-section .info-card { border: 0; padding: 1.75rem; background: #f5f6f1; }
.site-body .product-detail-section .info-card h2 { font-size: 1.25rem; margin-bottom: .75rem; }
@media (max-width: 1000px) and (min-width: 801px) {
 .site-body .product-detail { grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: 1.25rem 2rem; }
 .site-body .product-facts > div { grid-template-columns: 1fr; gap: .375rem; }
}
@media (max-width: 800px) {
 .site-body .product-detail-section { padding-top: 2rem; padding-bottom: 3rem; }
 .site-body .product-detail { grid-template-columns: minmax(0,1fr); grid-template-areas: "heading" "media" "purchase"; grid-template-rows: auto; gap: 1.5rem; }
 .site-body .product-media-stack { order: initial; }
 .site-body .product-gallery-stage { max-width: 30rem; }
 .site-body .product-summary-heading .status-dot { font-size: .875rem; }
 .site-body .product-detail-section .info-grid { margin-top: 2rem; padding-top: 1.5rem; }
}
@media (max-width: 650px) {
 .site-body .product-detail-section .info-grid { grid-template-columns: minmax(0,1fr); gap: 1rem; }
 .site-body .product-detail-section .info-card { padding: 1.375rem; }
 .site-body .product-facts > div { grid-template-columns: 1fr; gap: .375rem; padding-block: 1rem; }
 .site-body .product-purchase .actions { margin-top: 1.25rem; }
 .site-body .product-thumbnail { width: 4.25rem; height: 4.25rem; }
}

/* Native modal supplies focus containment and Escape dismissal. */
html.product-lightbox-open { overflow: hidden; scrollbar-gutter: stable; }
.site-body .product-lightbox { width: min(1100px, calc(100vw - 2rem)); max-width: none; max-height: calc(100dvh - 2rem); margin: auto; padding: 0; border: 0; background: transparent; color: #fff; overflow: auto; overscroll-behavior: contain; }
.site-body .product-lightbox::backdrop { background: rgb(9 18 12 / 92%); }
.site-body .lightbox-toolbar { display: flex; align-items: center; gap: 1rem; margin-bottom: .75rem; }
.site-body .lightbox-title { flex: 1; min-width: 0; font-size: 1rem; font-weight: 500; }
.site-body .lightbox-counter { font-size: .875rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.site-body .lightbox-control { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; flex-shrink: 0; padding: 0; border: 1px solid #9da69f; border-radius: 5px; background: #1e2c23; color: #fff; font-size: 2rem; line-height: 1; }
.site-body .lightbox-control:hover { background: var(--green); border-color: #dce7d9; }
.site-body .lightbox-control[hidden] { display: none; }
.site-body .lightbox-stage { position: relative; padding-inline: 3.75rem; }
.site-body .lightbox-stage > img { display: block; width: 100%; height: min(72dvh, 800px); object-fit: contain; margin: 0 auto; }
.site-body .lightbox-prev, .site-body .lightbox-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; }
.site-body .lightbox-prev { left: 0; }
.site-body .lightbox-next { right: 0; }
.site-body .lightbox-note { margin: .875rem auto 0; max-width: 800px; color: #e1e6df; font-size: .8125rem; line-height: 1.6; text-align: center; white-space: pre-line; }
@media (max-width: 650px) {
 .site-body .product-lightbox { width: calc(100vw - 1.25rem); max-height: calc(100dvh - 1.25rem); }
 .site-body .lightbox-stage { padding-inline: 0; }
 .site-body .lightbox-stage > img { height: min(64dvh, 600px); }
 .site-body .lightbox-prev { left: .375rem; }
 .site-body .lightbox-next { right: .375rem; }
 .site-body .lightbox-note { padding-inline: .375rem; }
}
