/* eTrade storefront CSS: Storefront product page */
/* related / recommended cards: equal-height cards with the Add to cart buttons on one line at the bottom */
.rec>.scard{display:flex;flex-direction:column}
.rec>.scard .img{flex:none}
.rec>.scard .info{flex:1 1 auto;display:flex;flex-direction:column}
.rec>.scard .pr{margin-bottom:12px}
.rec>.scard .sadd{margin-top:auto}
body.product .hero{display:none}
#productPage .chero{padding:32px 0 84px}
.pd{display:grid;grid-template-columns:1.05fr 1fr;gap:32px;margin-top:-56px;position:relative;align-items:start}
.pd>*{min-width:0}
.pdmain{position:relative;height:460px;display:grid;place-items:center;overflow:hidden;cursor:zoom-in;transition:background .5s}
.pdart{width:64%;transition:scale .45s cubic-bezier(.2,.7,.2,1);transform-origin:var(--ox,50%) var(--oy,50%);filter:drop-shadow(0 24px 24px rgba(20,20,40,.22))}
.pdart svg{width:100%;height:auto;max-height:340px;transform:var(--vt,none);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.pdmain:hover .pdart{scale:1.3}
.pdmain .off{top:16px;left:16px;right:auto;font-size:11px;padding:3px 10px;z-index:2}
.pdw{position:absolute;top:14px;right:14px;z-index:2;width:38px;height:38px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 4px 14px rgba(20,20,40,.14);color:var(--dark)}
.pdw svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.pdw:hover{color:var(--pink);transform:scale(1.08)}
.pdw.on{background:var(--pink);color:#fff}
.pdw.on svg{fill:#fff}
.pdth{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
.tb{aspect-ratio:1;border-radius:12px;background:var(--grey);border:2px solid transparent;display:grid;place-items:center;overflow:hidden;padding:10px}
.tb:hover{border-color:#C9D8FA}
.tb.on{border-color:var(--blue);background:#fff}
.tb span{display:block;width:70%;transition:transform .3s}
.tb svg{width:100%;height:auto;display:block}
.pdi{padding:8px 4px}
.pdmeta{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.chipc{background:#F1EBFC;padding:4px 12px;border-radius:20px;margin:0!important}
.prat{display:flex;align-items:center;gap:8px;font-size:13px}
.prat b{font-size:14px}
.prat button{color:var(--blue);font-size:13px}
.prat button:hover{text-decoration:underline}
.pdprice{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:16px 0 12px}
.pdprice b{font-size:34px;letter-spacing:-.02em}
.pdprice s{color:#9CA3AF;font-size:17px}
.save2{background:#E6F6EE;color:#1E8E5A;font-size:12px;font-weight:600;padding:3px 10px;border-radius:20px}
.pdd{color:var(--muted);max-width:520px}
.opt{margin:22px 0 4px;font-size:13px}
.opt>span{display:block;margin-bottom:10px;color:var(--muted)}
.opt b{color:var(--dark)}
.vlist{display:flex;flex-wrap:wrap;gap:10px}
.vopt{padding:9px 16px;border-radius:12px;border:1.5px solid var(--bd);background:#fff;font:inherit;font-size:13px;font-weight:600;color:var(--dark);cursor:pointer;transition:.2s;display:inline-flex;flex-direction:column;align-items:center;gap:1px;line-height:1.25}
.vopt small{font-size:11px;font-weight:500;color:var(--muted)}
.vopt:hover{border-color:#C9D8FA}
.vopt.on{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue);color:var(--blue)}
.vopt:disabled,.vopt.soldout{opacity:.45;cursor:not-allowed;text-decoration:line-through}
.pdbuy .btn:disabled,.pbar .btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}
.tp p.pre{white-space:pre-line}
.tp p.rrep{font-size:13px;margin:8px 0 0;padding:8px 12px;background:var(--grey);border-radius:10px}
.pdbuy{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}
.pdbuy .qs button{height:46px;width:38px}
.pdbuy .qs span{min-width:40px}
.pdbuy .btn{padding:0 28px;height:48px;font-size:14px;justify-content:center;flex:1 1 150px}
.pdbuy .btn.bk{background:var(--dark);color:#fff;border-radius:6px}
.pdbuy .btn.bk:hover{background:var(--pink)}
.pdperks{list-style:none;display:grid;gap:10px;padding:18px 20px;background:var(--grey);border-radius:12px;font-size:13px}
.pdperks li:before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#fff;color:var(--blue);font-size:11px;margin-right:10px}
.pdtb li{display:flex;align-items:flex-start;gap:10px;line-height:1.45;min-width:0}
.pdtb li:before{content:none;display:none}
.pdtb .tbi{flex:none;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;color:var(--blue)}
.pdtb .tbi svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pdtb .tbt{min-width:0;overflow-wrap:anywhere;padding-top:2px}
@media (max-width:480px){
.pdtb{padding:16px;font-size:13.5px}
}
.ptabs{display:flex;gap:6px;border-bottom:1px solid var(--bd);margin-top:56px;overflow-x:auto;scrollbar-width:none}
.ptabs::-webkit-scrollbar{display:none}
.ptab{padding:12px 20px;font-weight:600;font-size:14px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.ptab:hover{color:var(--dark)}
.ptab.on{color:var(--blue);border-color:var(--blue)}
.tp{display:none;padding:28px 0}
.tp.on{display:block;animation:pop .45s both}
.tp p{color:var(--muted);max-width:720px;margin-bottom:12px}
.tp ul.ft{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;max-width:720px;margin-top:16px;font-size:14px;font-weight:500}
.tp ul.ft li:before{content:"✓";color:var(--blue);font-weight:700;margin-right:10px}
.spec{width:100%;max-width:720px;border-collapse:collapse;font-size:14px}
.spec td{padding:13px 16px;border-bottom:1px solid var(--bd)}
.spec tr:nth-child(odd){background:var(--grey)}
.spec td:first-child{font-weight:600;width:38%}
.spec td:last-child{color:var(--muted)}
.rsum{display:grid;grid-template-columns:200px 1fr;gap:32px;align-items:center;max-width:720px;margin-bottom:28px}
.rsum .big{text-align:center}
.rsum .big b{font-size:52px;line-height:1;letter-spacing:-.03em}
.rbars{display:grid;gap:8px;font-size:12px;color:var(--muted)}
.rbr{display:grid;grid-template-columns:22px 1fr 32px;gap:10px;align-items:center}
.rbr div{height:7px;background:#E6EAF2;border-radius:4px;overflow:hidden}
.rbr i{display:block;height:100%;width:var(--w);background:var(--star);border-radius:4px;transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.7,.2,1) .2s}
.tp.on .rbr i{transform:none}
.rvc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rvc>div{border:1px solid var(--bd);border-radius:14px;padding:20px;background:#fff}
.rvc p{font-size:13px;margin:8px 0 14px}
.rvc small{color:var(--muted);font-size:12px}
.rvc .rvtt{display:block;margin:8px 0 0;font-size:14px}
.rvc .rvtt+p{margin-top:4px}
.rvf{margin-top:32px;max-width:760px;border:1px solid var(--bd);border-radius:16px;padding:clamp(18px,3vw,28px);background:#fff;box-shadow:0 8px 28px rgba(20,20,40,.05)}
.rvf h3{font-size:20px;margin:0 0 4px}
.rvf-n{color:var(--muted);font-size:13px;margin:0 0 18px}
.rvf-r{margin-bottom:16px}
.rvf-r>span{display:block;font-size:12px;font-weight:600;margin-bottom:6px}
.rvf-r small,.rvf .fld small{display:none;color:var(--pink);font-size:12px;margin-top:6px}
.rvf-r.err small,.rvf .fld.err small{display:block}
.rvf-st{display:inline-flex;gap:4px}
.rvf-st button{width:40px;height:40px;border-radius:10px;font-size:24px;line-height:1;color:#C9D2E6;background:var(--grey);transition:color .15s,transform .15s,background .15s}
.rvf-st button:hover{transform:scale(1.08)}
.rvf-st button.on{color:var(--star);background:#FFF7DB}
.rvf-r.err .rvf-st button{box-shadow:0 0 0 1.5px var(--pink)}
.rvf-g{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.rvf .fld.err input,.rvf .fld.err textarea{border-color:var(--pink);background:#FFF5F8}
.rvf .fld em{font-style:normal;font-weight:400;color:var(--muted)}
.rvf-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.rvf-f{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.rvf-f .btn{height:46px;padding:0 28px;font-size:14px}
.rvf-f .btn:disabled{opacity:.6;cursor:wait}
.rvf-m{font-size:13px;color:var(--pink)}
.rvf-ok{display:flex;gap:16px;align-items:center;border-color:#BFE8D2;background:#F2FBF6}
.rvf-ok i{flex:none;width:44px;height:44px;border-radius:50%;background:#1E8E5A;color:#fff;display:grid;place-items:center;font-style:normal;font-size:22px;font-weight:700}
.rvf-ok p{margin:0;color:var(--muted);font-size:13px}
@media (max-width:600px){
.rvf-g{grid-template-columns:1fr}
.rvf-st button{width:44px;height:44px}
.rvf-f .btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
.rvf-st button{transition:none}
}
.pdrel{margin-top:40px}
.pbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;background:#fff;padding:10px 14px;box-shadow:0 -8px 24px rgba(20,20,40,.12);justify-content:space-between;align-items:center;gap:12px;transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.pbar.show{transform:none}
.pbar b{font-size:18px;display:block;line-height:1.2}
.pbar small{font-size:11px;color:var(--muted);display:block;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pbar .btn{padding:11px 22px;font-size:13px}
@media (max-width:1024px){
.pd{grid-template-columns:1fr 1fr;gap:24px}
.pdmain{height:380px}
.rvc{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
.pd{grid-template-columns:1fr;margin-top:-48px}
.pdmain{height:340px}
.pdart{width:56%}
.pbar{display:flex}
.pdrel{margin-bottom:56px}
.pdmain{cursor:default}
.pdmain:hover .pdart{scale:1}
}
@media (max-width:600px){
.rsum{grid-template-columns:1fr;gap:16px}
.tp ul.ft{grid-template-columns:1fr}
.rvc{grid-template-columns:1fr}
.rvc>div:nth-child(3){display:block}
.pdprice b{font-size:28px}
.pdmain{height:290px}
.ptab{padding:12px 14px}
}
@media (prefers-reduced-motion:reduce){
.tp.on{animation:none}
.pdart,.pdart svg{transition:none}
}
/* PDP gallery: product photos run edge-to-edge at full width, 4:3, object-fit:cover - no border, padding or gaps.
   Only applies when the product has photos (.has-img); the built-in SVG artwork fallback keeps its original look. */
.pdmain.has-img{display:block;height:auto;aspect-ratio:4/3;border:0;padding:0}
.pdmain.has-img .pdart{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;filter:none}
.pdmain.has-img .pdart .pimg{display:block;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;object-fit:cover}
.pdth .tb{position:relative;display:block;width:100%;aspect-ratio:4/3;padding:0;border:0;overflow:hidden;opacity:.72;transition:opacity .2s,box-shadow .2s}
.pdth .tb span{position:absolute;inset:0;display:block;width:100%;height:100%}
.pdth .tb .pimg{display:block;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;object-fit:cover}
.pdth .tb:hover{opacity:1;box-shadow:0 0 0 2px #C9D8FA}
.pdth .tb.on{opacity:1;box-shadow:0 0 0 2px var(--blue)}
/* PDP fullscreen image preview (lightbox) */
.pdzoom{position:absolute;right:14px;bottom:14px;z-index:2;width:38px;height:38px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 4px 14px rgba(20,20,40,.14);color:var(--dark);transition:transform .2s,color .2s}
.pdzoom svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pdzoom:hover{color:var(--blue);transform:scale(1.08)}
.lb.zoomed .lb-fig{cursor:grab}
.lb.drag .lb-fig{cursor:grabbing}
@media (prefers-reduced-motion:reduce){
.pdzoom{transition:none}
}
.pdart .pimg{height:auto;max-height:340px;border-radius:12px}
.tb .pimg{object-fit:cover;border-radius:8px}
.pd{margin-top:0}
@media (max-width:768px){
.pd{margin-top:0}
}
#productPage .chero{padding-top:40px;padding-bottom:96px;padding-left:24px;padding-right:24px}
@media (max-width:1024px){
#productPage .chero{padding-left:20px;padding-right:20px}
}
@media (max-width:768px){
#productPage .chero{padding-top:32px;padding-bottom:84px}
}
@media (max-width:480px){
#productPage .chero{padding-left:16px;padding-right:16px}
}
.fp-stage.drag{cursor:grabbing}