.commerce-page { min-height: 58vh; }
.commerce-heading { max-width: 840px; margin-bottom: 48px; }
.commerce-heading .eyebrow { color: #7F5F30; margin: 0 0 18px; }
.commerce-heading .page-heading { margin: 0 0 22px; }
.commerce-intro { max-width: 64ch; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.8; color: #65584C; }
.commerce-layout { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.commerce-subheading { font-family: 'Playfair Display', Georgia, serif; font-size: clamp(25px, 3vw, 36px); font-weight: 400; line-height: 1.2; margin: 0 0 24px; letter-spacing: -.025em; }
.commerce-small { font-size: 13px; line-height: 1.7; color: #65584C; }
.commerce-small a { text-decoration: underline; text-underline-offset: 3px; }
.commerce-summary { padding: 32px; background: #EDE8DD; border: 1px solid #D6CDBE; position: sticky; top: 120px; }
.commerce-summary .eyebrow { margin-top: 0; color: #7F5F30; }
.commerce-full-button { display: flex; justify-content: space-between; width: 100%; margin-top: 28px; }
.commerce-totals { padding: 8px 0; margin: 12px 0; }
.commerce-totals > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; font-size: 14px; }
.commerce-totals dd { margin: 0; text-align: right; font-weight: 500; }
.commerce-totals .commerce-total-final { border-top: 1px solid #CFC5B5; margin-top: 12px; padding-top: 22px; }
.commerce-summary-note { font-size: 11px; text-align: center; color: #65584C; margin-bottom: 0; }
.commerce-cart-list { border-top: 1px solid #D6CDBE; }
.commerce-cart-item { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 24px; padding: 28px 0; border-bottom: 1px solid #D6CDBE; }
.commerce-cart-image { display: flex; align-items: center; justify-content: center; min-height: 140px; padding: 12px; background: #E9E2D6; }
.commerce-cart-image img { width: 100%; height: 140px; object-fit: contain; }
.commerce-cart-details .eyebrow { color: #7F5F30; font-size: 9px; margin: 0 0 8px; }
.commerce-cart-details h2 { margin: 0 0 8px; font-family: 'Playfair Display', Georgia, serif; font-weight: 400; font-size: 24px; line-height: 1.3; }
.commerce-cart-details h2 a:hover, .commerce-saved-body h2 a:hover { color: #7F5F30; }
.commerce-cart-details .commerce-small { margin: 0 0 14px; }
.commerce-cart-price { font-size: 15px; font-weight: 500; padding-top: 22px; white-space: nowrap; }
.commerce-cart-price small { display: block; font-size: 11px; color: #65584C; text-align: right; font-weight: 400; margin-top: 4px; }
.commerce-one-only { display: block; font-size: 11px; color: #65584C; }
.commerce-cart-remove { display: block; min-height: 44px; padding: 8px 0; background: none; border: 0; color: #65584C; font: inherit; font-size: 12px; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.commerce-cart-remove:hover { color: #2B221C; }
.commerce-quantity { display: flex; align-items: center; gap: 12px; font-size: 12px; }
.commerce-quantity input { width: 64px; min-height: 44px; border: 1px solid #C9BDAB; background: #FBF9F4; color: #2B221C; font: inherit; padding: 6px 10px; }
.commerce-text-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; font-size: 13px; color: #2B221C; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: #A59884; }
.commerce-text-link:hover { color: #7F5F30; }
.commerce-continue { margin-top: 22px; }
.commerce-empty { max-width: 760px; margin: 0 auto; text-align: center; padding: clamp(36px, 7vw, 84px) 28px; border: 1px solid #D6CDBE; background: #F4F0E8; }
.commerce-empty-mark { display: flex; width: 62px; height: 62px; border: 1px solid #CBBDA6; align-items: center; justify-content: center; border-radius: 50%; margin: 0 auto 24px; color: #7F5F30; font-size: 26px; }
.commerce-empty .commerce-subheading { max-width: 22ch; margin: 0 auto 18px; }
.commerce-empty p { color: #65584C; max-width: 48ch; margin: 0 auto 28px; line-height: 1.8; }
.commerce-empty-secondary { text-align: center; margin-top: 20px; }
.commerce-notice { border: 1px solid #D6CDBE; border-left: 3px solid #7F5F30; padding: 20px 24px; font-size: 14px; line-height: 1.8; margin-bottom: 40px; background: #F3EEE4; }
.commerce-notice strong { font-weight: 600; }
.commerce-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 20px; }
.commerce-field { min-width: 0; }
.commerce-field-full { grid-column: 1 / -1; }
.commerce-field label { display: block; margin-bottom: 8px; color: #2B221C; font-size: 13px; }
.commerce-field label span { color: #65584C; font-size: 11px; }
.commerce-field input, .commerce-field textarea, .commerce-field select { width: 100%; border: 1px solid #C9BEAD; background: #FBF9F4; color: #2B221C; font: inherit; font-size: 15px; line-height: 1.6; padding: 12px 14px; border-radius: 0; min-height: 49px; }
.commerce-field textarea { display: block; resize: vertical; min-height: 128px; }
.commerce-field input::placeholder, .commerce-field textarea::placeholder { color: #7A6C5C; opacity: 1; }
.commerce-field input:focus, .commerce-field textarea:focus { outline: 2px solid #7F5F30; outline-offset: 3px; }
.commerce-form > .commerce-small { margin: 22px 0; max-width: 58ch; }
.commerce-form button[disabled] { opacity: .65; cursor: wait; }
.commerce-form-status { font-size: 14px; color: #4F6044; line-height: 1.8; margin-top: 20px; scroll-margin-top: 130px; overflow-wrap: anywhere; }
.commerce-form-status:not(:empty) { padding: 18px 20px; border: 1px solid #C7D1BE; background: #F1F3EB; }
.commerce-form-status.is-error { color: #8C362A; border-color: #DABAAE; background: #FBF0E9; }
.commerce-form-status:focus { outline: 2px solid #7F5F30; outline-offset: 4px; }
.commerce-checkout-item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 16px 0; border-bottom: 1px solid #D6CDBE; font-size: 12px; }
.commerce-checkout-item img { width: 56px; height: 68px; object-fit: contain; background: #E0D8CB; padding: 4px; }
.commerce-checkout-item small { display: block; color: #65584C; line-height: 1.5; margin-top: 5px; font-size: 10px; }
.commerce-checkout-item > span { font-weight: 500; white-space: nowrap; }
.commerce-contact-layout { display: grid; grid-template-columns: minmax(240px, .85fr) minmax(0, 1.4fr); gap: clamp(40px, 8vw, 120px); align-items: start; }
.commerce-contact-aside { padding-top: 8px; }
.commerce-contact-aside .eyebrow { font-size: 10px; color: #7F5F30; margin-top: 0; }
.commerce-contact-aside > p { color: #65584C; font-size: 15px; line-height: 1.9; }
.commerce-aside-note { margin: 34px 0 24px; border-top: 1px solid #D6CDBE; padding-top: 24px; }
.commerce-aside-note h3 { font-family: 'Playfair Display', Georgia, serif; font-size: 23px; font-weight: 400; line-height: 1.35; margin: 0 0 10px; }
.commerce-aside-note p { color: #65584C; font-size: 14px; line-height: 1.8; }
.commerce-commission-intro { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 7vw, 96px); padding: clamp(28px, 5vw, 64px); background: #E9E1D3; border: 1px solid #D6CDBE; margin: 20px 0 80px; }
.commerce-commission-intro > div > p { font-size: 15px; color: #65584C; line-height: 1.9; margin: 0 0 26px; }
.commerce-process > div { display: flex; gap: 20px; padding-bottom: 22px; margin-bottom: 22px; border-bottom: 1px solid #CBBDAB; }
.commerce-process > div:last-child { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; }
.commerce-process > div > span { font-family: 'Playfair Display', Georgia, serif; color: #7F5F30; font-size: 28px; line-height: 1.1; }
.commerce-process h3 { font-size: 16px; font-weight: 500; margin: 0 0 7px; }
.commerce-process p { font-size: 13px; color: #65584C; line-height: 1.8; margin: 0; }
.commerce-commission-form { scroll-margin-top: 120px; }
.commerce-receipt { max-width: 960px; margin: 0 auto; text-align: center; }
.commerce-receipt > .eyebrow { color: #7F5F30; }
.commerce-receipt .commerce-intro { margin-inline: auto; }
.commerce-reference { display: inline-block; padding: 16px 24px; margin: 18px 0; border: 1px solid #CDBEAA; background: #EEE7DC; font-size: 14px; letter-spacing: .02em; overflow-wrap: anywhere; }
.commerce-receipt > p:not(.eyebrow) { max-width: 68ch; margin-left: auto; margin-right: auto; color: #65584C; line-height: 1.8; }
.commerce-receipt-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin: 42px 0; text-align: left; border-block: 1px solid #D6CDBE; padding: 32px 0; }
.commerce-receipt-steps span { font-family: 'Playfair Display', Georgia, serif; color: #7F5F30; font-size: 24px; }
.commerce-receipt-steps h2 { font-size: 16px; font-weight: 500; margin: 12px 0 8px; }
.commerce-receipt-steps p { color: #65584C; font-size: 13px; line-height: 1.7; margin: 0; }
.commerce-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.commerce-saved-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 28px; }
.commerce-saved-image { position: relative; aspect-ratio: 4 / 5; background: #E9E2D6; padding: 32px; }
.commerce-saved-image > a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.commerce-saved-image img { width: 100%; height: 100%; object-fit: contain; transition: transform .25s ease; }
.commerce-saved-image > a:hover img { transform: scale(1.025); }
.commerce-saved-badge { position: absolute; top: 14px; left: 14px; padding: 6px 9px; background: #FBF9F4; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.commerce-save-button { position: absolute; top: 10px; right: 10px; display: flex; justify-content: center; align-items: center; width: 44px; height: 44px; border-radius: 50%; border: 0; background: #FBF9F4; color: #7F5F30; cursor: pointer; }
.commerce-save-button[aria-pressed="true"] svg path { fill: currentColor; }
.commerce-saved-body { padding-top: 18px; }
.commerce-saved-body h2 { font-family: 'Playfair Display', Georgia, serif; font-size: 25px; font-weight: 400; line-height: 1.25; margin: 0 0 8px; }
.commerce-saved-body .commerce-small { margin: 0; }
.commerce-saved-bottom { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-top: 6px; font-size: 14px; }
.commerce-saved-bottom .commerce-text-link { font-size: 11px; }
.commerce-saved-note { margin-top: 40px; text-align: center; }
.store-toast { position: fixed; z-index: 100; bottom: 22px; left: 50%; transform: translate(-50%, 16px); max-width: min(560px, calc(100vw - 32px)); padding: 15px 24px; background: #2B221C; color: #FBF9F4; box-shadow: 0 8px 28px #2b221c26; font: 13px/1.6 Inter, sans-serif; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; text-align: center; width: max-content; }
.store-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 1020px) {
  .commerce-layout { grid-template-columns: minmax(0, 1fr) 310px; gap: 28px; }
  .commerce-summary { padding: 24px; }
  .commerce-cart-item { grid-template-columns: 88px minmax(0, 1fr); gap: 18px; }
  .commerce-cart-price { grid-column: 2; padding-top: 0; margin-top: -4px; }
  .commerce-cart-price small { display: inline; margin-left: 8px; }
  .commerce-cart-image { min-height: 120px; }
  .commerce-cart-image img { height: 120px; }
  .commerce-contact-layout { gap: 44px; }
  .commerce-saved-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .commerce-heading { margin-bottom: 32px; }
  .commerce-layout, .commerce-contact-layout, .commerce-commission-intro { grid-template-columns: 1fr; }
  .commerce-summary { position: static; }
  .commerce-cart-item { grid-template-columns: 96px minmax(0, 1fr) auto; }
  .commerce-cart-price { grid-column: auto; padding-top: 22px; margin-top: 0; }
  .commerce-cart-price small { display: block; margin-left: 0; }
  .commerce-contact-aside { padding: 0 0 28px; border-bottom: 1px solid #D6CDBE; }
  .commerce-contact-aside .commerce-aside-note { margin-top: 20px; }
  .commerce-commission-intro { gap: 36px; margin-bottom: 48px; }
  .commerce-receipt-steps { gap: 20px; }
}
@media (max-width: 520px) {
  .commerce-fields { grid-template-columns: 1fr; gap: 20px; }
  .commerce-cart-item { grid-template-columns: 82px minmax(0, 1fr); gap: 16px; }
  .commerce-cart-details h2 { font-size: 21px; }
  .commerce-cart-price { grid-column: 2; padding-top: 0; margin-top: -8px; }
  .commerce-cart-price small { display: inline; margin-left: 8px; }
  .commerce-cart-image { min-height: 110px; padding: 8px; }
  .commerce-cart-image img { height: 110px; }
  .commerce-notice { padding: 16px 18px; }
  .commerce-submit { width: 100%; }
  .commerce-receipt-steps, .commerce-saved-grid { grid-template-columns: 1fr; }
  .commerce-receipt-steps > div { border-bottom: 1px solid #D6CDBE; padding-bottom: 20px; }
  .commerce-receipt-steps > div:last-child { border-bottom: 0; padding-bottom: 0; }
  .commerce-actions { flex-direction: column; }
  .commerce-actions .button { justify-content: center; }
  .commerce-contact-layout { gap: 28px; }
  .commerce-checkout-item { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 9px; }
  .commerce-checkout-item img { width: 48px; }
}
/* ---- Checkout ---- */
.checkout-steps { display: flex; gap: 10px; flex-wrap: wrap; list-style: none; padding: 0; margin: -18px 0 40px; font-size: 12px; color: #65584C; }
.checkout-steps li { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 8px; border: 1px solid #D6CDBE; border-radius: 999px; }
.checkout-steps li span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #E9E2D6; font-size: 11px; }
.checkout-steps li[aria-current] { color: #2B221C; border-color: #2B221C; }
.checkout-steps li[aria-current] span { background: #2B221C; color: #FBF9F4; }
.checkout-fieldset { border: 0; padding: 0 0 36px; margin: 0 0 36px; border-bottom: 1px solid #D6CDBE; min-width: 0; }
.checkout-fieldset legend { padding: 0; margin-bottom: 20px; font-size: clamp(22px, 2.4vw, 28px); }
.field-hint { display: block; margin-top: 7px; font-size: 11px; color: #65584C; line-height: 1.5; }
.commerce-field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #65584C 50%), linear-gradient(135deg, #65584C 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 40px; }
.commerce-field input:user-invalid, .commerce-field select:user-invalid { border-color: #A13028; }
.checkout-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.checkout-choice { display: flex; gap: 12px; align-items: flex-start; padding: 16px; border: 1px solid #C9BEAD; background: #FBF9F4; cursor: pointer; }
.checkout-choice:has(input:checked) { border-color: #2B221C; box-shadow: inset 0 0 0 1px #2B221C; }
.checkout-choice input { min-height: 0; width: 18px; height: 18px; margin-top: 3px; accent-color: #2B221C; }
.checkout-choice strong { display: block; font-weight: 500; font-size: 14px; }
.checkout-choice small { display: block; color: #65584C; font-size: 12px; line-height: 1.5; }
.checkout-delivery { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.checkout-delivery li { display: grid; grid-template-columns: 120px 1fr; gap: 16px; padding: 14px 16px; background: #F3EEE4; font-size: 13px; line-height: 1.6; }
.checkout-delivery span { color: #4A3F36; }
.checkout-terms { display: flex; gap: 12px; align-items: flex-start; font-size: 13px; line-height: 1.7; margin-bottom: 24px; }
.checkout-terms input { min-height: 0; width: 18px; height: 18px; margin-top: 3px; flex: none; accent-color: #2B221C; }
.checkout-terms a { text-decoration: underline; text-underline-offset: 3px; }
.checkout-pay { width: 100%; min-height: 58px; font-size: 14px; letter-spacing: .02em; }
.checkout-secure { text-align: center; margin: 14px 0 0; }
.cart-destination { display: grid; gap: 8px; font-size: 12px; color: #65584C; margin-bottom: 8px; }
.cart-destination select { border: 1px solid #C9BEAD; background: #FBF9F4; min-height: 46px; padding: 0 12px; font: inherit; font-size: 14px; color: #2B221C; }
/* ---- Order confirmation ---- */
.receipt-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 24px; margin: 32px 0 8px; text-align: left; }
.receipt-card { border: 1px solid #D6CDBE; background: #FBF9F4; padding: 28px; }
.receipt-card h2 { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; font-family: inherit; font-weight: 600; color: #7F5F30; margin: 0 0 12px; }
.receipt-card h2:not(:first-child) { margin-top: 26px; }
.receipt-card address, .receipt-card p { font-style: normal; font-size: 14px; line-height: 1.8; color: #4A3F36; margin: 0; }
@media (max-width: 760px) {
  .receipt-grid, .checkout-choices { grid-template-columns: 1fr; }
  .checkout-delivery li { grid-template-columns: 1fr; gap: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  .store-toast, .commerce-saved-image img { transition: none; }
}