/* PDP v3 "The Showroom Walk" — scoped styles. Loaded ONLY by product_v3.twig.
   Everything namespaced under .pdp-v3 so no other page/template is affected.
   Source of truth: _wireframes/pdp_redesign_2026-07/pdp_proposal_v3.html */
.pdp-v3{
  --v3-bg:#FBFAF7; --v3-card:#FFFFFF; --v3-ink:#3E3B36; --v3-ink-soft:#6B675E;
  --v3-green:#6D8A72; --v3-green-ink:#4E6B55; --v3-green-tint:#EDF2ED;
  --v3-hairline:#E6E2D8; --v3-neutral:#F4F1EB;
  --v3-cta:#C97E63; --v3-cta-deep:#B36A50; --v3-gold:#B98A2F;
  --v3-radius:12px; --v3-shadow:0 1px 3px rgba(62,59,54,.07), 0 5px 16px rgba(62,59,54,.05);
  --v3-serif:"Source Serif 4", Georgia, serif;
  --v3-sans:"Source Sans 3", "Segoe UI", Verdana, sans-serif;
  font-family:var(--v3-sans); font-size:17px; line-height:1.6; color:var(--v3-ink);
}
.pdp-v3 a{color:var(--v3-green-ink)}
.pdp-v3 :focus-visible{outline:3px solid var(--v3-green-ink); outline-offset:2px; border-radius:4px}
.pdp-v3 h1,.pdp-v3 .v3-h2{font-family:var(--v3-serif); font-weight:700; letter-spacing:-.005em; color:var(--v3-ink)}
.pdp-v3 .kicker{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--v3-green-ink); margin-bottom:6px}
.pdp-v3 .v3-h2{font-size:clamp(22px,2.6vw,27px); margin-bottom:13px}

/* fold */
.pdp-v3 .fold{margin-top:8px; display:grid; gap:26px}
@media(min-width:960px){ .pdp-v3 .fold{grid-template-columns:minmax(0,7fr) minmax(0,5fr); align-items:start} }

/* gallery */
.pdp-v3 .g-stage{position:relative; background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:var(--v3-radius); overflow:hidden; aspect-ratio:3/2}
.pdp-v3 .g-slide{position:absolute; inset:0; opacity:0; transition:opacity .22s ease; margin:0}
.pdp-v3 .g-slide.on{opacity:1}
.pdp-v3 .g-slide img{width:100%; height:100%; object-fit:cover}
.pdp-v3 .g-badge{position:absolute; top:12px; left:12px; background:rgba(255,255,255,.95); border:1px solid var(--v3-hairline); border-radius:20px; padding:6px 13px; font-size:13px; font-weight:700; color:var(--v3-green-ink); z-index:2}
.pdp-v3 .g-nav{position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; border:1px solid var(--v3-hairline); background:rgba(255,255,255,.96); font-size:19px; color:var(--v3-ink); z-index:2; cursor:pointer}
.pdp-v3 .g-prev{left:10px}.pdp-v3 .g-next{right:10px}
.pdp-v3 .g-thumbs{display:flex; gap:9px; margin-top:11px; flex-wrap:wrap}
.pdp-v3 .g-thumbs button{width:88px; border:2px solid transparent; border-radius:9px; overflow:hidden; background:var(--v3-card); padding:0; min-height:58px; cursor:pointer}
.pdp-v3 .g-thumbs button.on{border-color:var(--v3-green)}
.pdp-v3 .g-thumbs img{display:block; width:100%; height:58px; object-fit:cover}
.pdp-v3 .visit-line{margin-top:11px; padding-top:11px; border-top:1px dashed var(--v3-hairline); font-size:14px; color:var(--v3-ink-soft); display:flex; gap:8px; align-items:flex-start; line-height:1.5}
.pdp-v3 .visit-line svg{flex:none; margin-top:3px}
.pdp-v3 .visit-line a{font-weight:700; white-space:nowrap}
/* gallery "why it lasts" info-slide + its thumb */
.pdp-v3 .g-info{background:var(--v3-green); color:#fff; display:flex; flex-direction:column; justify-content:center; padding:7% max(9%,66px); gap:13px; height:100%}
.pdp-v3 .g-info h3{font-family:var(--v3-serif); font-size:clamp(19px,2.4vw,25px); line-height:1.28; color:#fff; margin:0}
.pdp-v3 .g-info ul{list-style:none; display:grid; gap:8px; font-size:15px; margin:0; padding:0}
.pdp-v3 .g-info li{padding-left:19px; position:relative}
.pdp-v3 .g-info li::before{content:""; position:absolute; left:0; top:.55em; width:8px; height:8px; border-radius:50%; background:#F0DCA8}
.pdp-v3 .g-thumbs .t-label{display:flex; align-items:center; justify-content:center; width:100%; height:100%; min-height:58px; font-size:12.5px; font-weight:700; color:var(--v3-green-ink); background:var(--v3-green-tint); padding:4px; text-align:center}

/* buy column */
.pdp-v3 .buy h1{font-size:clamp(23px,2.6vw,28px); line-height:1.24; margin:0}
.pdp-v3 .rating{display:flex; align-items:center; gap:8px; margin-top:8px; font-size:14.5px; flex-wrap:wrap}
.pdp-v3 .stars-wrap{position:relative; display:inline-block; font-size:16px; letter-spacing:1.5px; line-height:1; color:#D9D4C8}
.pdp-v3 .stars-wrap .onn{position:absolute; inset:0; overflow:hidden; color:var(--v3-gold); white-space:nowrap}
.pdp-v3 .rating a{color:var(--v3-ink-soft)}
.pdp-v3 .oneliner{margin-top:9px; font-size:16.5px}
.pdp-v3 .goodfor{margin-top:7px; font-size:14.5px; color:var(--v3-ink-soft)}
.pdp-v3 .goodfor b{color:var(--v3-green-ink)}
.pdp-v3 .chips{display:flex; flex-wrap:wrap; gap:7px; margin-top:11px}
.pdp-v3 .chip{background:var(--v3-green-tint); color:var(--v3-green-ink); border-radius:16px; padding:5px 12px; font-size:13.5px; font-weight:700}
.pdp-v3 .price-block{margin-top:14px; padding:15px 16px; background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:var(--v3-radius); box-shadow:var(--v3-shadow)}
.pdp-v3 .price-row{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap}
.pdp-v3 .price{font-family:var(--v3-sans); font-weight:700; font-size:33px; letter-spacing:-.01em; font-variant-numeric:lining-nums; color:var(--v3-ink)}
.pdp-v3 .price-old{font-size:18px; color:var(--v3-ink-soft); text-decoration:line-through; font-weight:400}
.pdp-v3 .incl{font-size:13px; font-weight:700; color:var(--v3-green-ink); text-transform:uppercase; letter-spacing:.07em}
.pdp-v3 .fulfil{margin-top:11px; display:grid; gap:9px}
.pdp-v3 .fulfil .row{display:grid; grid-template-columns:19px 1fr; gap:10px; align-items:start; font-size:15px; line-height:1.45}
.pdp-v3 .fulfil .tick{width:19px; height:19px; border-radius:50%; background:var(--v3-green); display:flex; align-items:center; justify-content:center; margin-top:2px}
.pdp-v3 .fulfil .row > svg{margin-top:3px; justify-self:center}
.pdp-v3 .fulfil .sub{display:block; font-size:13px; color:var(--v3-ink-soft); margin-top:1px}

/* swatches */
.pdp-v3 .variants{margin-top:14px}
.pdp-v3 .variants .lbl{font-size:14px; font-weight:700; margin-bottom:7px}
.pdp-v3 .swatches{display:flex; gap:8px; flex-wrap:wrap}
.pdp-v3 .swatch{border:2px solid var(--v3-hairline); background:var(--v3-card); border-radius:9px; padding:6px 12px 6px 6px; display:flex; align-items:center; gap:8px; font-size:14px; min-height:46px; text-decoration:none; color:var(--v3-ink)}
.pdp-v3 .swatch img{width:32px; height:32px; border-radius:6px; object-fit:cover}
.pdp-v3 .swatch .dot{width:24px; height:24px; border-radius:50%; border:1px solid rgba(0,0,0,.15)}
.pdp-v3 .swatch.on{border-color:var(--v3-green); background:var(--v3-green-tint); font-weight:700}

/* assurance rows + help card */
.pdp-v3 .assure{margin-top:14px; display:grid; gap:11px}
.pdp-v3 .assure .row{display:grid; grid-template-columns:19px 1fr; gap:10px; align-items:start; font-size:14.5px; line-height:1.45}
.pdp-v3 .assure .row > svg{margin-top:2px; justify-self:center}
.pdp-v3 .assure .lead{font-weight:700; display:flex; align-items:center; gap:4px 8px; flex-wrap:wrap}
.pdp-v3 .assure .sub{display:block; font-size:12.5px; color:var(--v3-ink-soft); font-weight:400; margin-top:2px; line-height:1.5}
.pdp-v3 .assure .sub a{color:var(--v3-ink-soft)}
.pdp-v3 .assure .paychips{display:inline-flex; gap:5px; align-items:center}
.pdp-v3 .assure svg.pay{height:22px; width:35px; display:block; border-radius:3px; overflow:visible}
.pdp-v3 .help-card{margin-top:14px; background:var(--v3-green-tint); border-radius:10px; padding:12px 14px; display:grid; grid-template-columns:19px 1fr; gap:10px; align-items:start; font-size:14.5px; line-height:1.5}
.pdp-v3 .help-card > svg{margin-top:2px; justify-self:center}
.pdp-v3 .help-card b{display:block}
.pdp-v3 .help-card .hc-sub{display:block; color:var(--v3-ink-soft); font-size:13px; margin-top:2px}
.pdp-v3 .help-card a{font-weight:700; white-space:nowrap; color:var(--v3-green-ink)}

/* sections + essentials postcards */
.pdp-v3 .sect{margin-top:30px}
.pdp-v3 .sect-inner{max-width:830px}
.pdp-v3 .essentials{display:grid; gap:16px}
@media(min-width:760px){ .pdp-v3 .essentials.two{grid-template-columns:1.2fr 1fr} }
.pdp-v3 .postcard{background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:var(--v3-radius); padding:19px; box-shadow:var(--v3-shadow)}
.pdp-v3 .postcard h3{font-family:var(--v3-serif); font-size:19px; margin:0 0 11px; font-weight:700}
.pdp-v3 table.dims{width:100%; border-collapse:collapse; font-size:15px}
.pdp-v3 table.dims th,.pdp-v3 table.dims td{text-align:left; padding:7px 6px; border-bottom:1px solid var(--v3-hairline); vertical-align:top}
.pdp-v3 table.dims th{font-weight:700; white-space:nowrap}
.pdp-v3 table.dims tr:last-child th,.pdp-v3 table.dims tr:last-child td{border-bottom:0}
.pdp-v3 ul.included{list-style:none; display:grid; gap:7px; font-size:15px; margin:0; padding:0}
.pdp-v3 ul.included li{padding-left:21px; position:relative}
.pdp-v3 ul.included li::before{content:""; position:absolute; left:2px; top:.5em; width:9px; height:9px; border-radius:50%; background:var(--v3-green-tint); border:2px solid var(--v3-green)}
.pdp-v3 ul.included li.value{color:var(--v3-green-ink); font-weight:700}

/* accordions */
.pdp-v3 .acc{max-width:830px; display:grid; gap:9px}
.pdp-v3 .acc details{background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:var(--v3-radius); overflow:hidden}
.pdp-v3 .acc summary{list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:15px 18px; font-weight:700; font-size:16px; min-height:50px; cursor:pointer}
.pdp-v3 .acc summary::-webkit-details-marker{display:none}
.pdp-v3 .acc summary::after{content:"+"; font-size:21px; color:var(--v3-green-ink); font-weight:400}
.pdp-v3 .acc details[open] summary::after{content:"\2013"}
.pdp-v3 .acc .body{padding:2px 18px 16px; font-size:15px}
.pdp-v3 .acc .body h3{font-size:16px; margin:13px 0 5px; font-weight:700}
.pdp-v3 .acc .body p{margin-bottom:9px; max-width:70ch}
.pdp-v3 .acc .body ul{margin:0 0 9px 20px}
.pdp-v3 .acc .body strong{background:linear-gradient(transparent 62%, #F2E3C2 62%)}
/* visible "short version" about block */
.pdp-v3 .desc{max-width:830px}
.pdp-v3 .desc p{margin-bottom:12px; max-width:70ch; font-size:16px}
.pdp-v3 .desc ul{margin:0 0 12px 20px}
.pdp-v3 .desc strong{background:linear-gradient(transparent 62%, #F2E3C2 62%)}

/* who you're buying from */
.pdp-v3 .pano{margin:0 0 22px}
.pdp-v3 .pano img{width:100%; height:clamp(170px,26vw,300px); object-fit:cover; border-radius:var(--v3-radius); border:1px solid var(--v3-hairline)}
.pdp-v3 .whobg{background:var(--v3-neutral); border:1px solid var(--v3-hairline); border-radius:14px; padding:24px 18px 28px; margin-top:38px} /* contained panel — no full-bleed hacks inside the OC container */
@media(min-width:760px){ .pdp-v3 .whobg{padding:28px 26px 32px} }
.pdp-v3 .who{max-width:none}
.pdp-v3 .who h2{font-family:var(--v3-serif); font-weight:700; font-size:clamp(23px,3vw,30px); line-height:1.22; max-width:30ch; margin:0}
.pdp-v3 .who .lede{margin-top:9px; font-size:15.5px; color:var(--v3-ink-soft); max-width:70ch}
.pdp-v3 .who h3{font-family:var(--v3-serif); font-size:18px; margin:0 0 10px; font-weight:700}
.pdp-v3 .place-grid{display:grid; gap:12px; margin-top:20px}
@media(min-width:760px){ .pdp-v3 .place-grid{grid-template-columns:1fr 1fr 1fr} }
@media(max-width:759px){
  .pdp-v3 .place-grid{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; margin:20px -16px 0; padding:0 16px 6px}
  .pdp-v3 .place{flex:0 0 76vw; scroll-snap-align:start}
}
.pdp-v3 .place{background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:var(--v3-radius); overflow:hidden; box-shadow:var(--v3-shadow); margin:0}
.pdp-v3 .place img{width:100%; aspect-ratio:4/3; object-fit:cover}
.pdp-v3 .place figcaption{padding:10px 13px 12px; font-size:13px; line-height:1.45; color:var(--v3-ink-soft)}
.pdp-v3 .place figcaption b{display:block; font-size:14px; color:var(--v3-ink)}
.pdp-v3 .tour-line{margin-top:11px; font-size:14px; color:var(--v3-ink-soft)}
.pdp-v3 .who-cols{display:grid; gap:18px; margin-top:24px; align-items:start}
@media(min-width:920px){ .pdp-v3 .who-cols{grid-template-columns:1.02fr .98fr} }
.pdp-v3 .rate-tiles{display:grid; gap:9px}
.pdp-v3 .rate-tile{display:flex; align-items:center; gap:12px; background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:10px; padding:11px 14px; text-decoration:none; color:var(--v3-ink); box-shadow:var(--v3-shadow)}
.pdp-v3 .rate-tile:hover{border-color:var(--v3-green)}
.pdp-v3 .rate-tile > svg{width:28px; height:28px; flex:none}
.pdp-v3 .rate-tile b{display:block; font-size:15px}
.pdp-v3 .rate-tile .rt-main{flex:1; min-width:0}
.pdp-v3 .rate-tile .rt-sub{font-size:12.5px; color:var(--v3-ink-soft)}
.pdp-v3 .rate-tile .rt-score{font-weight:700; font-size:15.5px; white-space:nowrap; text-align:right}
.pdp-v3 .rate-tile .rt-score small{display:block; font-weight:400; font-size:12px; color:var(--v3-ink-soft)}
.pdp-v3 .rate-note{font-size:12.5px; color:var(--v3-ink-soft); margin-top:9px}
.pdp-v3 .who-quotes{margin-top:0}
.pdp-v3 .qcard{background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:var(--v3-radius); padding:14px 17px 13px; margin:0 0 10px; box-shadow:var(--v3-shadow)}
.pdp-v3 .qcard::before{content:"\201C"; font-family:var(--v3-serif); font-size:32px; line-height:.6; color:var(--v3-green); display:block; margin:6px 0 7px}
.pdp-v3 .qcard blockquote{margin:0; font-size:14.5px; line-height:1.55}
.pdp-v3 .qcard figcaption{margin-top:9px; font-size:12.5px; color:var(--v3-ink-soft)}
.pdp-v3 .visit-row{margin-top:22px; background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:14px; box-shadow:var(--v3-shadow); padding:16px 18px; display:grid; gap:14px}
@media(min-width:900px){ .pdp-v3 .visit-row{grid-template-columns:1fr 1fr 1fr 1fr auto; align-items:center} }
.pdp-v3 .visit-row .proof{font-size:13.5px; line-height:1.45}
.pdp-v3 .visit-row .proof b{display:block; font-size:14px; color:var(--v3-green-ink)}
.pdp-v3 .visit-row .acts{display:flex; gap:10px; flex-wrap:wrap}
.pdp-v3 .visit-row .acts a{display:inline-flex; align-items:center; padding:11px 16px; border-radius:9px; font-weight:700; font-size:14.5px; text-decoration:none; min-height:44px}
.pdp-v3 .visit-row .acts .visit{background:var(--v3-green); color:#fff}
.pdp-v3 .visit-row .acts .call{border:1.5px solid var(--v3-green); color:var(--v3-green-ink)}

/* sticky add-to-basket bar */
.pdp-v3-sticky{position:fixed; left:0; right:0; bottom:0; background:#fff; border-top:1px solid #E6E2D8; box-shadow:0 -4px 16px rgba(62,59,54,.09); padding:9px 14px; display:none; z-index:50; font-family:"Source Sans 3","Segoe UI",Verdana,sans-serif}
.pdp-v3-sticky.show{display:block}
.pdp-v3-sticky .wrap{max-width:1140px; margin:0 auto; display:flex; align-items:center; gap:12px}
.pdp-v3-sticky .nm{flex:1; min-width:0; font-size:14px; line-height:1.3; color:#3E3B36}
.pdp-v3-sticky .nm b{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pdp-v3-sticky .pr{font-weight:700; font-size:19px; white-space:nowrap; color:#3E3B36}
.pdp-v3-sticky .atc-mini{background:#C97E63; color:#fff; border:0; border-radius:9px; min-height:46px; padding:0 20px; font-size:16px; font-weight:700; cursor:pointer}
.pdp-v3-sticky .atc-mini:hover{background:#B36A50}

/* round-2 live additions: reviews shell + inline button */
.pdp-v3 .rev-agg-row{display:flex; align-items:center; gap:9px; margin-top:8px; font-size:15px; flex-wrap:wrap}
.pdp-v3 .rev-just{margin-top:9px; color:var(--v3-ink-soft); max-width:68ch; font-size:15px}
.pdp-v3 .v3-btn-line{background:none; border:1.5px solid var(--v3-green); color:var(--v3-green-ink); border-radius:9px; padding:9px 16px; font-weight:700; font-size:14px; cursor:pointer}
.pdp-v3 .v3-btn-line:hover{background:var(--v3-green-tint)}
.pdp-v3 .rev-list{max-width:830px; margin-top:14px}
.pdp-v3 #review{background:transparent}

/* related products slider (was missing from v1 css) */
.pdp-v3 .pcar{position:relative}
.pdp-v3 .pcar .track{display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding-bottom:8px}
.pdp-v3 .pcar .pnav{position:absolute; top:calc(50% - 14px); transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:1px solid var(--v3-hairline); background:rgba(255,255,255,.97); font-size:18px; color:var(--v3-ink); z-index:2; cursor:pointer}
.pdp-v3 .pcar .pprev{left:-6px}.pdp-v3 .pcar .pnext{right:-6px}
@media(max-width:700px){ .pdp-v3 .pcar .pnav{display:none} }
.pdp-v3 .pcard{flex:0 0 auto; width:min(242px,62vw); scroll-snap-align:start; background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:14px; overflow:hidden; text-decoration:none; color:var(--v3-ink); box-shadow:var(--v3-shadow); transition:box-shadow .15s ease}
.pdp-v3 .pcard:hover{box-shadow:0 4px 18px rgba(62,59,54,.14)}
.pdp-v3 .pcard img{width:100%; aspect-ratio:3/2; object-fit:cover}
.pdp-v3 .pcard .pb{display:block; padding:11px 13px 13px}
.pdp-v3 .pcard .pname{display:block; font-size:14.5px; font-weight:600; line-height:1.35; min-height:2.7em}
.pdp-v3 .pcard .pprice{display:block; margin-top:7px; font-weight:700; font-size:18px}
.pdp-v3 .pcard .pinc{font-size:11px; color:var(--v3-green-ink); font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-left:6px}

/* demo-style sitewide review photo cards */
.pdp-v3 .rev-head{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap}
.pdp-v3 .rev-agg{font-size:31px; font-weight:700; line-height:1}
.pdp-v3 .rev-agg .agg-sub{font-size:18px; color:var(--v3-ink-soft)}
.pdp-v3 .stars-wrap.big{font-size:19px}
.pdp-v3 .rev-grid{display:grid; gap:9px; margin-top:14px; max-width:1000px}
@media(min-width:760px){ .pdp-v3 .rev-grid{grid-template-columns:1fr 1fr 1fr} }
.pdp-v3 .rev-card{background:var(--v3-card); border:1px solid var(--v3-hairline); border-radius:var(--v3-radius); overflow:hidden; font-size:14px; line-height:1.5}
.pdp-v3 .rev-card img{aspect-ratio:4/3; object-fit:cover; width:100%}
.pdp-v3 .rev-card .rb{padding:12px 15px 13px}
.pdp-v3 .rev-card .who{color:var(--v3-ink-soft); margin-top:7px; font-size:13px}
.pdp-v3 .v3-btn-line.sm{padding:6px 12px; font-size:13px}
