.page-pdp{
  --pdp-paper:#F9F3F3;
  --pdp-paper-2:#FBF7F7;
  --pdp-stage:#E9E5E9;
  --pdp-stage-2:#EEE9EC;
  --pdp-ink:#332433;
  --pdp-plum:#54394E;
  --pdp-plum-deep:#452F42;
  --pdp-text:#5c5460;
  --pdp-muted:#8c8290;
  --pdp-line:rgba(64,44,64,.13);
  --pdp-rose:#C98F94;
  --pdp-star:#CBB7C4;
  background:var(--pdp-paper);
  color:var(--pdp-text);
}
.page-pdp .wrap{max-width:1180px; margin:0 auto; padding-inline:var(--pad)}

.page-pdp .eyebrow-title{font-family:var(--headline); font-style:italic; font-weight:600; font-size:15px; color:var(--pdp-rose); margin:0 0 10px}
.pdp-section-head{text-align:center; margin:0 0 clamp(26px,3.4vw,44px)}
.pdp-section-head .kicker{margin:0 0 8px; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--pdp-muted)}
.pdp-section-head h2{font-family:var(--headline); font-weight:700; font-size:clamp(20px,2.4vw,30px); color:var(--pdp-ink); margin:0}

.pdp-buy{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(28px,4vw,64px); padding-block:clamp(28px,3.6vw,54px)}
.pdp-gallery{position:relative; display:flex; flex-direction:column; height:100%}
.gallery-decor{position:absolute; left:-5%; top:-10%; width:24%; opacity:.85; pointer-events:none; z-index:2}
.gallery-tape{position:absolute; left:10%; top:-3.5%; width:20%; aspect-ratio:4.4; rotate:-3deg; background:linear-gradient(100deg,rgba(236,222,196,.92),rgba(216,198,164,.88)); clip-path:polygon(2% 0,98% 4%,100% 96%,1% 100%); box-shadow:0 6px 14px rgba(90,70,60,.14); z-index:3}
.pdp-stage-shot{position:relative; background:var(--pdp-stage); border-radius:4px; overflow:hidden; flex:1 1 auto; min-height:360px; z-index:1; margin:0}
.pdp-stage-shot img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; margin:0}
.pdp-thumbs{display:flex; align-items:center; gap:clamp(6px,1vw,12px); margin-top:clamp(12px,1.6vw,18px)}
.pdp-thumb-arrow{width:28px; height:28px; border-radius:50%; display:grid; place-items:center; color:var(--pdp-muted); flex:none; transition:color .3s, background .3s}
.pdp-thumb-arrow:hover{color:var(--pdp-ink); background:var(--pdp-stage)}
.thumb-strip{display:flex; align-items:center; gap:clamp(8px,1.2vw,14px); overflow:auto; flex:1; scrollbar-width:none}
.thumb-strip::-webkit-scrollbar{display:none}
.page-pdp .thumb{
  flex:none; width:clamp(58px,7.6vw,88px); aspect-ratio:1; border-radius:3px; overflow:hidden;
  background:var(--pdp-stage-2); border:1px solid transparent; display:flex; align-items:center; justify-content:center; padding:8px;
  transition:border-color .3s;
}
.page-pdp .thumb img{height:100%; width:auto; max-width:100%; object-fit:contain}
.page-pdp .thumb.orchid img{height:100%; width:100%; object-fit:cover}
.page-pdp .thumb[aria-current="true"]{border-color:var(--pdp-plum)}
.page-pdp .thumb:hover{border-color:rgba(84,57,78,.4)}

.pdp-info .eyebrow-title{margin-bottom:8px}
.pdp-info h1{margin:0 0 clamp(10px,1.4vw,16px); font-size:clamp(24px,2.9vw,34px); color:var(--pdp-ink); text-transform:none; line-height:1.18}
.pdp-size{margin:0 0 clamp(12px,1.6vw,18px); font-size:12.5px; letter-spacing:.04em; color:var(--pdp-muted)}
.pdp-stars{display:flex; align-items:center; gap:8px; margin:0 0 clamp(16px,2vw,22px)}
.pdp-stars .row{display:flex; gap:2px; color:var(--pdp-star)}
.pdp-stars span.count{font-size:12px; color:var(--pdp-muted)}
.feat-list{list-style:none; margin:0 0 clamp(18px,2.4vw,26px); padding:0; display:grid; gap:10px}
.feat-list li{display:flex; align-items:center; gap:11px; font-size:13px; color:var(--pdp-text)}
.feat-list svg{flex:none; color:var(--pdp-rose)}
.pdp-price{margin:0 0 clamp(16px,2vw,22px); font-family:var(--headline); font-size:clamp(19px,2.1vw,26px); color:var(--pdp-ink)}
.pdp-qty{display:flex; width:100%; align-items:center; justify-content:space-between; border:1px solid rgba(64,44,64,.28); border-radius:8px; margin-bottom:clamp(12px,1.6vw,18px)}
.pdp-qty button{flex:none; width:40px; height:44px; display:grid; place-items:center; color:var(--pdp-plum); transition:color .3s}
.pdp-qty button:hover{color:var(--pdp-ink)}
.pdp-qty input{flex:1; width:auto; height:44px; border:0; text-align:center; font:inherit; font-size:14px; color:var(--pdp-ink); background:none}
.pdp-qty input::-webkit-outer-spin-button,.pdp-qty input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.pdp-qty input{-moz-appearance:textfield}
.pdp-bag{
  width:100%; display:flex; align-items:center; justify-content:center; gap:14px;
  padding:17px; border-radius:2px; background:var(--pdp-plum); color:#fff;
  font-size:11px; letter-spacing:.22em; text-transform:uppercase; transition:background .3s;
}
.pdp-bag:hover{background:var(--pdp-plum-deep)}
.pdp-assure{list-style:none; margin:clamp(18px,2.2vw,26px) 0 0; padding:clamp(16px,2vw,22px) 0 0; border-top:1px solid var(--pdp-line); display:grid; grid-template-columns:1fr 1fr; gap:clamp(12px,1.6vw,18px)}
.pdp-assure li{display:flex; align-items:flex-start; gap:13px}
.pdp-assure svg{flex:none; color:var(--pdp-plum); margin-top:2px}
.pdp-assure strong{display:block; font-size:12.5px; font-weight:500; color:var(--pdp-ink)}
.pdp-assure span span{display:block; font-size:11.5px; color:var(--pdp-muted); margin-top:2px}

.pdp-story{padding-block:clamp(30px,4vw,58px); border-top:1px solid var(--pdp-line)}
.pd-view{display:flex; align-items:stretch; justify-content:center; gap:clamp(8px,2vw,20px)}
.pd-stage{position:relative; flex:1 1 auto; max-width:560px; margin:0 auto}
.pd-stage img{display:block; width:100%; height:auto; border-radius:6px; margin:0}
.pd-arrow-slot{flex:none; width:40px; position:relative}
.pd-arrow{
  position:sticky; top:calc(50vh - 20px); width:40px; height:40px; border-radius:50%; border:none; padding:0; cursor:pointer;
  background:rgba(255,255,255,.92); display:grid; place-items:center; color:var(--pdp-plum);
  box-shadow:0 6px 18px rgba(60,40,60,.14); transition:background .3s, color .3s; z-index:3;
}
.pd-arrow:hover{background:#fff; color:var(--pdp-ink)}
.pd-meta{display:flex; align-items:center; gap:16px; max-width:420px; margin:clamp(16px,2vw,22px) auto 0}
.pd-count{font-size:11px; letter-spacing:.08em; color:var(--pdp-muted); flex:none}
.pd-bar{flex:1; height:2px; background:var(--pdp-line); position:relative; border-radius:2px; overflow:hidden}
.pd-bar-fill{position:absolute; inset:0; width:10%; background:var(--pdp-plum); transition:width .35s ease}
.pd-thumbs{display:flex; gap:clamp(8px,1.2vw,14px); overflow:auto; margin-top:clamp(18px,2.2vw,26px); padding-bottom:6px; scrollbar-width:thin}
.pd-thumb{flex:none; width:clamp(56px,7vw,76px); text-align:center; cursor:pointer}
.pd-thumb .box{aspect-ratio:1; border-radius:3px; overflow:hidden; background:var(--pdp-stage-2); border:1px solid transparent; transition:border-color .3s}
.pd-thumb img{width:100%; height:100%; object-fit:cover}
.pd-thumb span{display:block; margin-top:6px; font-size:10px; letter-spacing:.08em; color:var(--pdp-muted)}
.pd-thumb[aria-current="true"] .box{border-color:var(--pdp-plum)}
.pd-thumb[aria-current="true"] span{color:var(--pdp-ink)}
.pd-caption{text-align:center; margin:clamp(14px,1.8vw,20px) 0 0; font-size:11.5px; color:var(--pdp-muted); font-style:italic}

.pdp-faq{padding-block:clamp(30px,4vw,54px); border-top:1px solid var(--pdp-line)}
.pdp-faq-list{max-width:760px; margin:0 auto}
.pdp-faq-list details{border-bottom:1px solid var(--pdp-line)}
.pdp-faq-list summary{
  list-style:none; cursor:pointer; position:relative; padding:17px 34px 17px 4px;
  font-size:13.5px; line-height:1.6; color:var(--pdp-text); transition:color .3s;
}
.pdp-faq-list summary::-webkit-details-marker{display:none}
.pdp-faq-list summary:hover{color:var(--pdp-ink)}
.pdp-faq-list summary::after{content:"+"; position:absolute; right:6px; top:50%; translate:0 -50%; font-size:18px; color:var(--pdp-muted); transition:transform .35s ease}
.pdp-faq-list details[open] summary{color:var(--pdp-ink)}
.pdp-faq-list details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.pdp-faq-list details > p{margin:0 0 18px; font-size:12.5px; line-height:1.85; color:var(--pdp-muted); padding:0 34px 0 4px}

.pdp-rel{padding-block:clamp(30px,4vw,54px); border-top:1px solid var(--pdp-line)}
.rel-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:clamp(14px,1.8vw,22px)}
.rel-card{display:flex; flex-direction:column; text-align:center; align-items:center}
.rel-shot{width:100%; background:var(--pdp-stage-2); border-radius:3px; aspect-ratio:.92; display:grid; place-items:center; margin-bottom:12px; overflow:hidden}
.rel-shot img{max-height:76%; max-width:60%; width:auto; height:auto}
.rel-cat{margin:0 0 4px; font-size:9.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--pdp-rose)}
.rel-name{margin:0 0 8px; font-family:var(--headline); font-weight:700; font-size:13.5px; line-height:1.4; color:var(--pdp-ink); min-height:2.8em}
.rel-name a{color:inherit}
.rel-price{margin:0 0 12px; font-size:12.5px; color:var(--pdp-text)}
.rel-btn{width:100%; margin-top:auto; padding:11px; text-align:center; border:1px solid rgba(64,44,64,.32); border-radius:2px; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--pdp-plum); transition:background .3s, color .3s}
.rel-btn:hover{background:var(--pdp-plum); color:#fff}

.pdp-trust{background:var(--pdp-stage-2); border-top:1px solid var(--pdp-line); border-bottom:1px solid var(--pdp-line)}
.pdp-trust-in{max-width:1180px; margin:0 auto; padding-inline:var(--pad); display:grid; grid-template-columns:repeat(4,1fr)}
.pdp-trust-in div{display:flex; align-items:center; gap:12px; padding:clamp(18px,2.2vw,26px) clamp(10px,1.4vw,18px); border-left:1px solid var(--pdp-line)}
.pdp-trust-in div:first-child{border-left:0}
.pdp-trust-in svg{color:var(--pdp-plum); flex:none}
.pdp-trust-in strong{display:block; font-size:11.5px; letter-spacing:.02em; color:var(--pdp-ink)}
.pdp-trust-in span span{display:block; font-size:10.5px; color:var(--pdp-muted); margin-top:2px}

@media (max-width:1000px){
  .pdp-buy{grid-template-columns:1fr}
  .rel-grid{grid-template-columns:repeat(3,1fr)}
  .pdp-trust-in{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .rel-grid{grid-template-columns:1fr 1fr}
  .pdp-trust-in{grid-template-columns:1fr}
  .pdp-trust-in div{border-left:0; border-top:1px solid var(--pdp-line)}
  .pdp-trust-in div:first-child{border-top:0}
  .pd-view{gap:6px}
  .pd-arrow-slot{width:32px}
  .pd-arrow{width:32px; height:32px}
}
@media (prefers-reduced-motion:reduce){
  .pd-bar-fill,.pdp-bag,.rel-btn{transition:none}
}
