.breadcrumb {
  padding:25px 4.2vw; display:flex; gap:10px; color:var(--muted);
  border-bottom:1px solid var(--line); font-size:9px; letter-spacing:.1em;
}
.breadcrumb a:hover { color:var(--ink); }
.product-detail { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(430px,.75fr); min-height:calc(100vh - 140px); }
.detail-gallery { position:relative; display:grid; place-items:center; padding:6vw; background:#ebe7e1; }
.detail-image {
  width:min(100%,720px); aspect-ratio:1; background-image:url("assets/product-grid.png");
  background-repeat:no-repeat; background-size:400% 300%;
}
.image-index { position:absolute; left:30px; bottom:25px; color:var(--muted); font-size:9px; letter-spacing:.16em; }
.detail-panel { padding:7vw 7vw 6vw; background:#f8f5f0; }
.detail-series { margin:0 0 24px; color:var(--muted); font-size:9px; letter-spacing:.2em; }
.detail-panel h1 { margin:0; font-family:serif; font-size:clamp(34px,3.7vw,56px); font-weight:400; line-height:1.3; letter-spacing:.06em; }
.detail-price { margin:20px 0 30px; font-size:14px; letter-spacing:.07em; }
.detail-description { margin:0 0 40px; color:#67635c; font-family:serif; font-size:13px; line-height:2; }
.choice-block { margin:0; padding:24px 0; border:0; border-top:1px solid var(--line); }
.choice-title { width:100%; margin:0 0 16px; padding:0; display:flex; justify-content:space-between; color:var(--ink); font-size:10px; letter-spacing:.12em; }
.choice-title strong { font-weight:400; color:var(--muted); }
.choice-title a { color:var(--muted); border-bottom:1px solid var(--muted); }
.color-swatch { display:block; width:25px; height:25px; border:5px solid #f8f5f0; border-radius:50%; background:#ddd6c8; box-shadow:0 0 0 1px var(--ink); }
.size-list { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.size-list button { height:43px; border:1px solid var(--line); background:transparent; cursor:pointer; font-size:10px; transition:.2s; }
.size-list button:hover,.size-list button.is-selected { border-color:var(--ink); background:var(--ink); color:white; }
.purchase-row { display:grid; grid-template-columns:110px 1fr; gap:10px; margin-top:5px; }
.detail-quantity { display:grid; grid-template-columns:1fr 34px 1fr; border:1px solid var(--ink); }
.detail-quantity button { border:0; background:transparent; cursor:pointer; font-size:14px; }
.detail-quantity span { display:grid; place-items:center; font-size:11px; }
.detail-add-button { min-height:52px; border:1px solid var(--ink); background:var(--ink); color:white; cursor:pointer; font-size:10px; letter-spacing:.15em; transition:.25s; }
.detail-add-button:hover,.detail-add-button.is-added { background:#4b463f; }
.detail-message { min-height:18px; margin:12px 0 5px; color:#755047; text-align:right; font-size:10px; }
.detail-accordions { margin-top:25px; border-bottom:1px solid var(--line); }
.detail-accordions details { border-top:1px solid var(--line); }
.detail-accordions summary { padding:19px 0; display:flex; justify-content:space-between; cursor:pointer; list-style:none; font-size:10px; letter-spacing:.13em; }
.detail-accordions summary::-webkit-details-marker { display:none; }
.detail-accordions details[open] summary span { transform:rotate(45deg); }
.detail-accordions p { margin:0; padding:0 30px 22px 0; color:var(--muted); font-family:serif; font-size:11px; line-height:1.9; }
.detail-service { padding:75px 6vw; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.detail-service div { padding:5px 4vw; border-right:1px solid var(--line); }
.detail-service div:last-child { border:0; }
.detail-service span { color:var(--muted); font-size:9px; letter-spacing:.15em; }
.detail-service h2 { margin:16px 0 10px; font-family:serif; font-size:18px; font-weight:400; letter-spacing:.08em; }
.detail-service p { margin:0; color:var(--muted); font-size:10px; line-height:1.8; }
@media(max-width:900px){
  .product-detail{grid-template-columns:1fr}.detail-gallery{padding:8vw}.detail-image{width:min(100%,600px)}
  .detail-panel{padding:65px 8vw 80px}.detail-service{padding:55px 4vw}
}
@media(max-width:600px){
  .breadcrumb{padding:18px 5vw}.page-nav{font-size:10px}.page-nav a:nth-child(2){display:none}
  .detail-gallery{padding:10vw 5vw}.image-index{left:5vw;bottom:15px}
  .detail-panel{padding:55px 6vw 70px}.detail-panel h1{font-size:36px}
  .purchase-row{grid-template-columns:95px 1fr}.detail-service{grid-template-columns:1fr;padding:25px 6vw}
  .detail-service div{padding:28px 0;border-right:0;border-bottom:1px solid var(--line)}
}
