body.purchase-first .product-info { padding-top:16px !important; }
body.purchase-first #pName { margin-bottom:8px !important; font-size:clamp(28px,3vw,42px) !important; }
body.purchase-first #pShort { margin:10px 0 14px !important; font-size:14px !important; line-height:1.5 !important; }
body.purchase-first .product-info > .option { margin-block:10px !important; }
body.purchase-first #pAdd { min-height:50px !important; margin-top:8px !important; }
body.purchase-first #purchaseAvailability { margin:0 0 8px; font:400 12px/1.5 var(--font-body); color:#454545; }
body.purchase-first #purchaseService { margin:12px 0 22px; font:400 12px/1.6 var(--font-body); color:#555; }
body.purchase-first #mobileProductBar { display:none !important; }
#purchaseSticky { position:fixed; z-index:90; bottom:0; left:0; right:0; display:flex; justify-content:center; background:#fff; border-top:1px solid #ddd; padding:12px 24px calc(12px + env(safe-area-inset-bottom)); }
#purchaseSticky[hidden] { display:none; }
#purchaseSticky button { width:min(100%,560px); min-height:48px; padding:12px 20px; background:#2e2e2e; color:#fff; border:1px solid #2e2e2e; font:400 12px/1.5 var(--font-body); letter-spacing:.08em; cursor:pointer; }
#purchaseSticky button:disabled { opacity:.55; cursor:not-allowed; }
#purchaseSticky button:focus-visible { outline:2px solid #a84820; outline-offset:3px; }
body.purchase-sticky-visible { padding-bottom:88px; }
body.purchase-sticky-visible .chat-launcher { bottom:100px !important; }
@media(max-width:700px){
 body.purchase-first .product-info { padding:18px !important; }
 body.purchase-first #pName { font-size:28px !important; }
 #purchaseSticky { padding-inline:18px; }

}

body.purchase-first .product--cg { padding-top:24px !important; }
body.purchase-first #pVariantOpts { flex-direction:row !important; gap:8px !important; border:0 !important; }
body.purchase-first #pVariantOpts .chip--variant { flex:1; flex-direction:column; align-items:flex-start; justify-content:center; gap:3px; min-height:56px; padding:8px !important; border:1px solid #ddd !important; }
body.purchase-first #pVariantOpts .chip--variant.is-active { border-color:#2e2e2e !important; }
body.purchase-first #pVariantOpts .bag-size-price { margin-left:0; }
body.purchase-first #pShort { font-size:13px !important; }
body.purchase-first #pAdd { padding:14px !important; }

body.purchase-first #pName { font-size:32px !important; line-height:1.1 !important; margin:0 0 8px !important; }
body.purchase-first .bag-price-row { margin:0 !important; padding:0 !important; gap:8px !important; }
body.purchase-first #pPrice { margin:0 !important; padding:0 !important; font-size:24px !important; }
body.purchase-first .product-info > .option { margin-block:7px !important; }
body.purchase-first #purchaseDescription { font:400 14px/1.7 var(--font-body); }

/* Phones and tablets, every category: gallery first, then name, price, options and the
   add button (the live storefront's order), then the editorial detail. The category
   stylesheets hid the options and the add button here for a bottom sheet that
   purchase-first replaces, which left no way to add a piece to the bag. */
@media(max-width:860px) {
 body.purchase-first .product--cg { display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:10px !important; padding:0 18px 18px !important; }
 body.purchase-first .product--cg .product-info { display:contents !important; }
 body.purchase-first .product-info > * { order:2; }
 body.purchase-first .product-info > :is(#pName,.bag-price-row,#pPrice,#pShort,#pColorWrap,#pVariants,#pSize,#pFinish,.option--add,#purchaseService) { order:1; }
 body.purchase-first .product--cg .gallery { order:0 !important; grid-column:1 !important; grid-row:auto !important; position:relative !important; top:auto !important; margin:0 -18px 8px !important; width:auto !important; }
 body.purchase-first .product--cg .product-info > * { grid-column:1 !important; }
 body.purchase-first.maison-product .product-info > :is(#pColorWrap,#pVariants,.option--add) { display:block !important; }
 body.purchase-first.earring-product .product-info > :is(#pColorWrap,#pVariants) { display:none !important; }
 body.purchase-first #pName { font-size:28px !important; margin-top:8px !important; }
 body.purchase-first #purchaseService { margin-bottom:4px; }
}

/* Desktop, every category: gallery on the left, purchase column on the right (earrings and
   clothing used a mirrored grid). */
@media(min-width:861px) {
 body.purchase-first:is(.earring-product,.clothing-product) .product--cg { grid-template-columns:minmax(0,1fr) 460px !important; gap:40px !important; align-items:start !important; padding:24px 64px 96px !important; max-width:1720px; margin:0 auto; }
 body.purchase-first:is(.earring-product,.clothing-product) .product--cg .gallery { grid-column:1 !important; grid-row:1 !important; position:sticky !important; top:136px !important; }
 body.purchase-first:is(.earring-product,.clothing-product) .product--cg .product-info { grid-column:2 !important; grid-row:1 !important; padding:16px 0 0 !important; max-width:none !important; }
}

/* Delivery and returns in the purchase column: one line, the full policy on demand.
   #purchaseService carries the delivery line, so the older line under the button goes. */
body.purchase-first #pShipBar { display:none !important; }
body.purchase-first #purchaseService .purchase-service__line { margin:0 0 6px; }
body.purchase-first #purchaseService details { border-top:1px solid var(--bag-line,#e2ddd2); border-bottom:1px solid var(--bag-line,#e2ddd2); }
body.purchase-first #purchaseService summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; padding:12px 0; font:400 10px/1.5 var(--font-body); letter-spacing:.16em; text-transform:uppercase; color:#2e2e2e; }
body.purchase-first #purchaseService summary::-webkit-details-marker { display:none; }
body.purchase-first #purchaseService summary::after { content:'+'; font-size:14px; letter-spacing:0; }
body.purchase-first #purchaseService details[open] summary::after { content:'−'; }
body.purchase-first #purchaseService details p { margin:0 0 10px; font:400 12px/1.65 var(--font-body); color:#555; }

/* The same service tiles at the end of every product page. */
body.purchase-first .product-services { padding-top:0; }
body.purchase-first .product-services > div { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--bag-line,#e2ddd2); border-block:1px solid var(--bag-line,#e2ddd2); }
body.purchase-first .product-services article { padding:32px 28px; background:#fff; }
body.purchase-first .product-services h2 { font:400 9.5px/1.5 var(--font-body); letter-spacing:.2em; text-transform:uppercase; margin:0 0 14px; color:#2e2e2e; }
body.purchase-first .product-services p { font:400 13px/1.75 var(--font-body); color:#4a4a4a; margin:0; }
@media(max-width:860px) {
 body.purchase-first .product-services { width:100%; }
 body.purchase-first .product-services > div { grid-template-columns:1fr; }
 body.purchase-first .product-services article { padding:24px 20px; }
}
/* Related pieces close every product page, earrings included. */
body.purchase-first.earring-product .product-rail-section:not([hidden]) { display:block !important; }
