/* shop.css — v2 新增组件，沿用 styles.css 的变量与调性 */

.announce{background:var(--pine);color:#EDE9E0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;text-align:center;padding:11px 0}
.announce .wrap{padding:0 20px}

.hero-note{margin-top:22px;font-size:12.5px;letter-spacing:.04em;color:var(--ink-faint)}

/* 两大分类 */
.cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:44px}
.cat{display:block;background:var(--paper-2)}
.cat-img img{width:100%;height:340px;object-fit:cover}
.cat-b{padding:26px 26px 30px}
.cat-b h3{font-family:var(--serif);font-size:34px;font-weight:400;margin:8px 0 6px}
.cat-b p{color:var(--ink-soft);font-size:14.5px}
.cat-l{display:inline-block;margin-top:16px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--ink)}

/* 四格事实 */
.facts-strip{background:var(--paper-2);padding:56px 0;margin-top:76px}
.facts-4{display:grid;grid-template-columns:repeat(4,1fr);gap:34px}
.facts-4 strong{display:block;font-family:var(--serif);font-size:21px;font-weight:500;margin-bottom:8px}
.facts-4 span{font-size:13.5px;color:var(--ink-soft);line-height:1.55}

/* 包装二选一 */
.wrap-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:40px}
.wrapcard{background:var(--paper-2);padding-bottom:28px}
.wrapcard img{width:100%;aspect-ratio:1/1;object-fit:cover}
.wrapcard h3{font-family:var(--serif);font-size:26px;font-weight:400;margin:20px 26px 8px}
.wrapcard p{font-size:14px;color:var(--ink-soft);margin:0 26px;line-height:1.6}
.tag{display:inline-block;margin:16px 26px 0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line);padding:5px 10px;color:var(--ink-soft)}

/* 产品卡 */
.pcard{display:block}
.pcard .card-img img{aspect-ratio:1/1;object-fit:cover;width:100%}
.pcard h3{font-family:var(--serif);font-size:23px;font-weight:400}

/* PDP */
.pdp{padding-top:48px;padding-bottom:64px}
.pdp-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.pdp-img img{width:100%;aspect-ratio:1/1;object-fit:cover}
.pdp-info h1{font-family:var(--serif);font-size:46px;font-weight:400;line-height:1.1;margin:10px 0 8px}
.pdp-sub{color:var(--ink-soft);letter-spacing:.04em;font-size:14px}
.pdp-price{margin:20px 0 28px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.pdp-price strong{font-family:var(--serif);font-size:34px;font-weight:400}
.pdp-price span{font-size:13px;color:var(--ink-faint)}
.pdp-price em{font-style:normal;font-size:11px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);padding:4px 9px;color:var(--ink-soft)}

.field-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:22px 0 12px}

/* 数量档位：整块可点 */
.opts{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.opt{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
     gap:2px;padding:13px 4px;border:1px solid var(--line);background:#fff;cursor:pointer;
     transition:border-color .15s,background .15s;text-align:center;min-height:74px}
.opt:hover{border-color:var(--ink-faint)}
.opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;margin:0}
.opt-n{font-size:12.5px;letter-spacing:.02em}
.opt-p{font-family:var(--serif);font-size:19px;line-height:1.1}
.opt-e{font-size:10.5px;color:var(--ink-faint)}
.opt em{font-style:normal;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.opt:has(input:checked){border-color:var(--ink);background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--ink)}
.opt:has(input:focus-visible){outline:2px solid var(--pine);outline-offset:2px}

/* 包装选项 */
.wrapopts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wrapbox{position:relative;display:block;border:1px solid var(--line);background:#fff;padding:10px;cursor:pointer}
.wrapbox input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;margin:0}
.wrapbox img{width:100%;aspect-ratio:4/3;object-fit:cover}
.wrapbox-t{display:flex;justify-content:space-between;align-items:baseline;margin-top:9px;font-size:13px}
.wrapbox-t em{font-style:normal;font-size:11px;color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase}
.wrapbox-n{display:block;font-size:11.5px;color:var(--ink-faint);line-height:1.45;margin-top:4px}
.wrapbox:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}

.btn-block{display:block;width:100%;text-align:center;margin-top:24px}
.form-note{font-size:11.5px;color:var(--ink-faint);margin-top:10px;text-align:center}

/* 四条事实 */
.facts{list-style:none;margin-top:34px;border-top:1px solid var(--line)}
.facts li{display:flex;gap:18px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
.facts strong{flex:0 0 190px;font-weight:500;font-size:13.5px}
.facts span{font-size:13px;color:var(--ink-soft)}

.buy-note{background:var(--paper-2);padding:30px 34px}
.buy-note h3{font-family:var(--serif);font-size:24px;font-weight:400;margin-bottom:10px}
.buy-note p{font-size:14px;color:var(--ink-soft)}

/* care 页 */
.h3{font-family:var(--serif);font-size:25px;font-weight:400;margin:38px 0 10px}
.care-list{margin:12px 0 0 20px}
.care-list li{font-size:14.5px;color:var(--ink-soft);margin-bottom:9px;line-height:1.6}

@media(max-width:900px){
  .cat-grid,.wrap-grid,.pdp-grid,.facts-4,.wrapopts{grid-template-columns:1fr}
  .cat-img img{height:260px}
  .pdp-grid{gap:32px}
  .pdp-info h1{font-size:36px}
  .opts{grid-template-columns:repeat(3,1fr)}
  .facts li{flex-direction:column;gap:2px}
  .facts strong{flex:none}
  .facts-strip{margin-top:52px;padding:40px 0}
}

/* 覆盖 styles.css 里 .pdp 的两栏设定（v2 用 .pdp > .wrap > .pdp-grid 三层） */
section.pdp{display:block}
.pdp-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:start}
.pdp-grid .pdp-img{background:var(--paper-2)}
.pdp-grid .pdp-info{position:static}