.pay-page{max-width:1240px;margin:auto;padding:40px 6vw 100px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}
.pay-top{display:flex;justify-content:space-between;gap:24px;align-items:center}
.pay-top>span,.pay-index,.pay-tag,.pay-test-note>span,.pay-summary-head>span{font-family:var(--mono);font-size:11px;letter-spacing:.05em}
.pay-top .back{font-family:inherit;font-size:14px;padding:10px 0;margin:0}
.pay-heading{margin:48px 0 40px}
.pay-heading h1{font-size:clamp(54px,7.5vw,96px);font-weight:400;letter-spacing:-.065em;line-height:.95;margin:16px 0 20px;text-transform:none}
.pay-heading>p{font-size:18px;margin:0}
.pay-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:start}
.pay-form{min-width:0}
.pay-form fieldset{border:0;margin:0;padding:0}
.pay-form legend{font-size:14px;margin-bottom:16px}
.pay-option{display:flex;gap:16px;align-items:flex-start;padding:25px 22px;border:1px solid rgba(0,0,0,.28);margin-bottom:12px;cursor:pointer;transition:background 180ms,border-color 180ms}
.pay-option:has(input:checked){background:#f4f3ef;border-color:#151515}
.pay-option:hover{border-color:#151515}
.pay-option input{appearance:auto;accent-color:#151515;width:18px;height:18px;flex:0 0 18px;margin:3px 0 0;padding:0;min-height:0}
.pay-option:has(input:focus-visible){outline:2px solid #151515;outline-offset:4px}
.pay-option-body{display:grid;gap:10px;width:100%;min-width:0}
.pay-option-title{font-size:20px;font-weight:500;display:flex;gap:12px;justify-content:space-between;align-items:center}
.pay-tag{font-size:9px;padding:5px 7px;border:1px solid #aaa;white-space:nowrap}
.pay-option-description{font-size:14px;line-height:1.45}
.pay-option-detail{font-size:12px;line-height:1.5;color:#3a3a3a}
.pay-test-note{border-top:1px solid rgba(0,0,0,.3);margin-top:24px;padding-top:18px}
.pay-test-note p{font-size:12px;line-height:1.5;margin:8px 0 0}
.pay-result{font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.pay-result:empty{display:none}
.pay-continue{width:100%;border:0;background:#151515;color:#fff;padding:21px 22px;display:flex;justify-content:space-between;gap:12px;text-align:left;font:16px "Helvetica Neue",Helvetica,Arial,sans-serif;cursor:pointer;margin-top:24px;min-height:60px}
.pay-continue:hover{background:#303030}
.pay-continue:focus-visible{outline:2px solid #151515;outline-offset:4px}
.pay-continue:disabled{opacity:.65;cursor:default}
.pay-footnote{font-size:11px;margin:14px 0;line-height:1.5}
.pay-summary{background:#f4f3ef;padding:28px;min-width:0}
.pay-summary-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #c9c9c2;padding-bottom:20px}
.pay-summary h2{font-size:21px;font-weight:400;margin:0;letter-spacing:-.03em}
.pay-order-item{display:grid;grid-template-columns:70px 1fr auto;gap:16px;align-items:center;padding:22px 0;border-bottom:1px solid #c9c9c2;font-size:14px}
.pay-order-item img{width:70px;height:82px;object-fit:cover}
.pay-order-item div{display:grid;gap:8px}
.pay-order-item strong{font-weight:500}
.pay-order-item div span{font-size:11px;color:#555}
.pay-summary-delivery{display:flex;justify-content:space-between;font-size:13px;padding:22px 0}
.pay-total{display:flex;justify-content:space-between;align-items:baseline;gap:14px;border-top:1px solid #151515;padding-top:22px;font-size:17px}
.pay-total strong{font-size:30px;font-weight:400;letter-spacing:-.05em;white-space:nowrap}
.pay-summary>p{font-size:11px;margin:24px 0 0;color:#555}
@media(max-width:820px){.pay-page{padding:24px 6vw 60px}.pay-top>span{display:none}.pay-heading{margin:32px 0}.pay-layout{grid-template-columns:1fr;gap:28px}.pay-summary{order:-1;padding:22px}.pay-heading h1{font-size:64px}.pay-heading h1 br{display:none}.pay-summary-head{padding-bottom:14px}.pay-order-item{padding:16px 0}.pay-summary>p{display:none}.pay-option{padding:22px 18px}.pay-option-title{font-size:18px}}
@media(max-width:360px){.pay-heading h1{font-size:54px}.pay-order-item{grid-template-columns:52px 1fr auto;gap:10px;font-size:12px}.pay-order-item img{width:52px;height:68px}.pay-tag{display:none}}
@media(prefers-reduced-motion:reduce){.pay-option{transition:none}}
/* Match the site's existing sans/mono hierarchy, at checkout scale. */
.pay-page{font-family:var(--studio-sans,"Helvetica Neue",Helvetica,Arial,sans-serif);padding-top:32px}
.pay-heading{margin:32px 0}
.pay-heading h1{font-family:var(--studio-sans,"Helvetica Neue",Helvetica,Arial,sans-serif);font-size:clamp(34px,4vw,48px);line-height:1.08;letter-spacing:-.045em;margin:12px 0 14px}
.pay-heading h1 br{display:none}
.pay-heading>p{font-size:15px;line-height:1.5}
.pay-form legend{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:14px}
.pay-top .back{font-family:var(--mono);font-size:11px;text-transform:uppercase}
.pay-option{padding:20px;gap:14px}
.pay-option-body{gap:8px}
.pay-option-title{font-family:var(--mono);font-size:14px;font-weight:400;letter-spacing:0;text-transform:uppercase}
.pay-option-description{font-size:13px}
.pay-option-detail{font-size:11px}
.pay-continue{font:12px var(--mono);text-transform:uppercase;letter-spacing:.025em;padding:18px 20px;min-height:52px}
.pay-summary h2{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:0}
.pay-order-item{font-family:var(--mono);font-size:12px}
.pay-order-item strong{font-weight:400}
.pay-summary-delivery{font-family:var(--mono);font-size:11px}
.pay-total{font-family:var(--mono);font-size:12px;text-transform:uppercase}
.pay-total strong{font-family:var(--studio-sans,"Helvetica Neue",Helvetica,Arial,sans-serif);font-size:25px;letter-spacing:-.035em}
.pay-layout{gap:48px}
@media(max-width:820px){.pay-heading{margin:28px 0}.pay-heading h1{font-size:36px}.pay-option-title{font-size:13px}.pay-layout{gap:24px}.pay-summary{padding:20px}.pay-option{padding:20px 16px}}
@media(max-width:360px){.pay-heading h1{font-size:32px}.pay-order-item{font-size:11px}}

/* Continue the cart's editorial grid and green surface. */
.pay-page{max-width:none;padding:32px clamp(20px,4vw,70px) 72px;background:#21A663}
.pay-top{padding-bottom:24px;border-bottom:1px solid #151515}
.pay-heading{margin:28px 0 32px}
.pay-heading h1{font-size:48px;line-height:.95;letter-spacing:-.06em;margin:14px 0 16px}
.pay-layout{grid-template-columns:minmax(0,1fr) minmax(310px,.45fr);gap:clamp(26px,4vw,70px);border-top:1px solid #151515;padding-top:28px}
.pay-form legend{margin-bottom:18px}
.pay-option{border:0;border-top:1px solid rgba(21,21,21,.6);padding:24px 0;margin:0;gap:18px;background:transparent}
.pay-option:last-child{border-bottom:1px solid rgba(21,21,21,.6)}
.pay-option:has(input:checked){background:transparent;border-color:#151515}
.pay-option-title{font-family:var(--studio-sans);font-size:20px;letter-spacing:-.035em;text-transform:none}
.pay-option-description{font-family:var(--mono);font-size:11px;line-height:1.6}
.pay-option-detail{font-family:var(--mono);font-size:10px;line-height:1.6}
.pay-option-body{gap:9px}
.pay-summary{background:transparent;padding:0}
.pay-summary-head{border-bottom:1px solid #151515;padding:0 0 20px}
.pay-summary h2{font-family:var(--studio-sans);font-size:28px;line-height:1;letter-spacing:-.05em;text-transform:none}
.pay-order-item{border-color:rgba(21,21,21,.6);grid-template-columns:80px 1fr auto;gap:14px}
.pay-order-item img{width:80px;height:98px;object-fit:contain;background:#eeece7}
.pay-order-item div span,.pay-summary>p{color:#151515}
.pay-summary-delivery{font-size:11px}
.pay-total strong{font-size:28px}
.pay-test-note{border-top:0;margin-top:20px;padding-top:0}
.pay-test-note>span{font-size:9px}
.pay-test-note p{font-size:11px}
.pay-continue{margin-top:22px}
.pay-footnote{font-family:var(--mono);font-size:10px}
@media(max-width:820px){.pay-page{padding:24px 20px 56px}.pay-heading{margin:24px 0}.pay-heading h1{font-size:38px}.pay-layout{grid-template-columns:1fr;gap:32px;padding-top:24px}.pay-summary{padding:0;order:-1}.pay-summary h2{font-size:24px}.pay-summary-head{padding-bottom:16px}.pay-option{padding:22px 0}.pay-option-title{font-size:18px}}

.pay-discount-tag{font:10px var(--mono);border:1px solid currentColor;padding:5px 8px;letter-spacing:0}
.pay-discount-line{display:flex;justify-content:space-between;gap:16px;padding:0 0 18px;font:11px var(--mono);line-height:1.5}
.pay-discount-line[hidden]{display:none}
.pay-discount-line strong{font-weight:400;white-space:nowrap}

/* Light checkout exploration: retain cart green as a navigation accent. */
.pay-page{background:#f5f4ef;border-top:8px solid #21A663}
.pay-top{border-bottom-color:rgba(21,21,21,.25)}
.pay-top>span{color:#187446}
.pay-layout{border-top-color:rgba(21,21,21,.25)}
.pay-option{border-top-color:rgba(21,21,21,.25)}
.pay-option:last-child{border-bottom-color:rgba(21,21,21,.25)}
.pay-option input{accent-color:#187446}
.pay-option:has(input:checked) .pay-option-title{color:#187446}
.pay-discount-tag{background:#21A663;color:#151515;border-color:#21A663}
.pay-discount-line{color:#187446}
.pay-order-item img{background:#eeece7}

/* Green cart leads into a white payment surface. */
body[data-section="checkout"]::before{background:#fff}
.pay-page{background:#fff;border-top:0;animation:payment-white-arrive 650ms ease both}
.pay-top>span,.pay-option:has(input:checked) .pay-option-title,.pay-discount-line{color:#151515}
.pay-option input{accent-color:#151515}
.pay-discount-tag{background:transparent;border-color:#151515;color:#151515}
@keyframes payment-white-arrive{from{background-color:var(--route-from,#21A663)}to{background-color:#fff}}
@media(prefers-reduced-motion:reduce){.pay-page{animation:none}}

.pay-contact{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:36px!important}.pay-contact legend{margin-bottom:20px}.pay-contact .privacy-consent{grid-column:1/-1;font:11px var(--mono);line-height:1.6}.pay-contact input{background:#fff;border:1px solid #aaa}.pay-contact input[type=checkbox]{width:16px;min-height:0}
@media(max-width:600px){.pay-contact{grid-template-columns:1fr}}
