/* product.css — product page: split hero, gallery + lightbox, option chips, CTA stack, spec table, features,
   partner band. Logical properties only. */
/* One underline for "Call 010 …": icon + a single text span */
.text-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;color:var(--navy-800);text-decoration:none}
.text-link>span{text-decoration:underline;text-decoration-color:var(--line-400);text-underline-offset:.2em}
.text-link:hover>span{text-decoration-color:currentColor}
.pdp{padding-block:12px var(--sp-8)}
.pdp__nav .crumbs{display:none}
@media (min-width:1024px){.pdp__nav .crumbs{display:block}.pdp__nav .backlink{display:none}.pdp{padding-block-start:24px}}
.backlink{display:inline-flex;align-items:center;gap:4px;min-height:44px;font-weight:600;font-size:15px;color:var(--navy-800);text-decoration:none}
.pdp__hero{display:grid;gap:20px;grid-template-areas:"head" "gallery" "summary";margin-block-start:4px}
.pdp__head{grid-area:head;display:grid;gap:12px;justify-items:start}
.pdp__head h1{font-size:var(--fs-product-title);line-height:var(--lh-product-title);font-weight:var(--fw-product-title);letter-spacing:var(--ls-product-title)}
.pdp__gallery{grid-area:gallery;min-width:0}
.pdp__summary{grid-area:summary;display:grid;gap:20px;align-content:start}
.value{font-size:var(--fs-lead);line-height:var(--lh-lead);color:var(--ink-700)}
.cta-stack{display:grid;gap:12px}
.cta-stack__row{display:grid;gap:12px}
.cta-stack .text-link{justify-self:start}
.micro-trust{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:14px;color:var(--ink-500)}
.micro-trust span{display:inline-flex;align-items:center;gap:6px}
.micro-trust .i{--i:16px;color:var(--azure-700)}
.stats--grid{display:grid;grid-template-columns:repeat(2,minmax(0,max-content))}
@media (max-width:379px){.stats--grid{grid-template-columns:1fr 1fr}.stats--grid .stat{padding-inline-end:10px;font-size:14px}}
.price-note--inline{margin:0;padding:0;background:none;font-size:14px;color:var(--ink-500)}
@media (min-width:480px){.cta-stack__row{grid-template-columns:1.4fr 1fr}}
/* Split hero from tablet portrait: gallery 55% / summary 45% */
@media (min-width:768px){
  .pdp__hero{grid-template-columns:minmax(0,55fr) minmax(0,45fr);grid-template-rows:auto 1fr;grid-template-areas:"gallery head" "gallery summary";column-gap:32px;row-gap:20px;margin-block-start:12px}
  .pdp__head{align-self:end}
  .pdp__gallery{position:sticky;inset-block-start:88px;align-self:start}
  .cta-stack__row{grid-template-columns:1fr}
}
@media (min-width:1024px){
  .pdp__hero{column-gap:56px;row-gap:24px;margin-block-start:16px}
  .pdp__gallery{inset-block-start:96px}
}
/* Side by side only when "Request a quote" fits on one line (summary column ≥ 500px) */
@media (min-width:1280px){.cta-stack__row{grid-template-columns:1.4fr 1fr}}
.anchors{display:flex;flex-wrap:wrap;gap:8px;margin-block:var(--sp-7) 0;padding-block-start:var(--sp-6);border-block-start:1px solid var(--line-100)}
.pdp-sec{padding-block:var(--sp-8) 0;scroll-margin-block-start:88px}
.pdp-sec h2{font-size:var(--fs-h3);line-height:var(--lh-h3)}
.pdp-sec>h2,.pdp-sec__h{margin-block-end:20px}
.pdp-sec__grid{display:grid;gap:32px}
@media (min-width:1024px){.pdp-sec__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}.pdp-sec__grid--side{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
.overview{display:grid;gap:16px;font-size:var(--fs-body);max-width:44rem}
.features{display:grid;gap:12px;margin-block-start:28px}
.feature{padding:20px;border:1px solid var(--line-100);border-radius:var(--r-card);background:#fff}
.feature h3{display:flex;align-items:center;gap:10px;font-size:17px;line-height:1.35;margin-block-end:8px}
.feature h3 .i{--i:28px;padding:5px;border-radius:50%;background:var(--sky-100);color:var(--azure-700)}
.feature ul{margin:0;padding-inline-start:18px;display:grid;gap:4px;font-size:15px;color:var(--ink-700)}
.feature li::marker{color:var(--sky-300)}
@media (min-width:768px){.features{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}
@media (min-width:1280px){.features{grid-template-columns:repeat(3,minmax(0,1fr))}}
.spec-note{margin-block-start:12px;font-size:13px;color:var(--ink-500)}

/* ---------- Spec table + checklist ---------- */
.spec{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line-200);border-radius:var(--r-panel);overflow:hidden;font-size:15px;line-height:1.5}
.spec th,.spec td{padding:12px 16px;text-align:start;vertical-align:top;border-block-start:1px solid var(--line-200)}
.spec tr:first-child>*{border-block-start:0}
.spec th{width:42%;background:var(--sky-50);font-weight:600;color:var(--ink-900)}
.spec td{background:#fff;color:var(--ink-700)}
@media (max-width:479px){
  .spec,.spec tbody,.spec tr,.spec th,.spec td{display:block;width:auto}
  .spec th{padding-block-end:2px;border-block-start:1px solid var(--line-200)}
  .spec td{padding-block-start:2px;border-block-start:0;background:var(--sky-50)}
}
.checklist{list-style:none;padding:0;display:grid;gap:12px}
.checklist li{display:flex;gap:12px;align-items:flex-start}
.checklist .i{--i:22px;color:var(--azure-500);margin-block-start:1px}

/* ---------- Gallery + lightbox ---------- */
.gallery{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}
.gallery__stage{position:relative}
.gallery__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border:1px solid var(--line-100);border-radius:var(--r-tile);background:#fff;overscroll-behavior-x:contain}
.gallery__track::-webkit-scrollbar{display:none}
.gallery__slide{flex:0 0 100%;scroll-snap-align:center;aspect-ratio:1;margin:0;display:grid;place-items:center;padding:4%}
.gallery__slide button{display:grid;place-items:center;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in}
.gallery__slide img{width:100%;height:100%;object-fit:contain}
/* Detail photos (not cut out): framed on sky-50 instead of a grey box on white */
.gallery__slide--photo{background:var(--sky-50);padding:8%}
/* Taken out of the flow, so a tall photo cannot stretch the square slide (aspect-ratio minimum size) */
.gallery__slide--photo{min-height:0}
.gallery__slide--photo button{position:relative}
.gallery__slide--photo img{position:absolute;inset:0;margin:auto;width:auto;height:auto;max-width:100%;max-height:100%;border-radius:12px;box-shadow:var(--sh-2)}
.gallery__count{position:absolute;inset-block-start:12px;inset-inline-end:12px;padding:4px 10px;border-radius:var(--r-pill);background:rgba(17,23,63,.72);color:#fff;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;pointer-events:none}
.gallery__zoom,.gallery__nav{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-100);background:#fff;color:var(--ink-900);box-shadow:var(--sh-1)}
.gallery__zoom{position:absolute;inset-block-end:12px;inset-inline-end:12px}
.gallery__nav{display:none}
.gallery__thumbs{display:none}
@media (min-width:768px){
  /* All thumbnails visible (wrapping grid, no scroller that would clip focus rings) */
  .gallery__thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:8px}
  .gallery__thumb{aspect-ratio:1;padding:4px;border:1px solid var(--line-100);border-radius:12px;background:#fff;opacity:.85;transition:border-color var(--t1),opacity var(--t1)}
  .gallery__thumb img{width:100%;height:100%;object-fit:contain}
  .gallery__thumb--photo{padding:0;overflow:hidden}
  .gallery__thumb--photo img{object-fit:cover}
  .gallery__thumb:hover{opacity:1;border-color:var(--sky-200)}
  .gallery__thumb[aria-current="true"]{opacity:1;border:2px solid var(--azure-500);padding:3px}
  .gallery__thumb--photo[aria-current="true"]{padding:0}
  .gallery__nav{position:absolute;inset-block-start:calc(50% - 22px);display:grid}
  .gallery__nav--prev{inset-inline-start:12px}
  .gallery__nav--next{inset-inline-end:12px}
  .gallery__nav[disabled]{opacity:0;pointer-events:none}
}

/* ---------- Option chips ---------- */
.options{display:grid;gap:16px;padding:20px;border:1px solid var(--line-100);border-radius:var(--r-card);background:var(--sky-50)}
.options__title{font-size:16px;font-weight:600;color:var(--ink-900)}
.options fieldset{border:0;margin:0;padding:0;display:grid;gap:8px}
.options legend{padding:0;margin-block-end:8px;font-size:14px;font-weight:600;color:var(--ink-700)}
.opt{display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:56px;justify-content:center;padding-inline:14px;border:1px solid var(--line-400);border-radius:var(--r-pill);background:#fff;color:var(--ink-900);font-size:15px;font-weight:600;transition:border-color var(--t1),background-color var(--t1)}
.opt .i{display:none;--i:16px;color:var(--navy-800)}
.opt:hover{border-color:var(--navy-800)}
.opt[aria-pressed="true"]{border:2px solid var(--navy-800);padding-inline:13px;background:var(--sky-100)}
.opt[aria-pressed="true"] .i{display:block}
.options__summary{font-size:14px;color:var(--ink-500);min-height:1.5em}
.options__summary strong{color:var(--ink-900)}

/* ---------- Navy quote band ---------- */
