.checkout-page { min-height:100vh; }
.checkout-header { position:relative; z-index:3; width:min(1260px,calc(100% - 36px)); margin:18px auto; padding:14px 18px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; border:1px solid rgba(255,255,255,.055); border-radius:20px; background:rgba(7,7,10,.78); backdrop-filter:blur(16px); box-shadow:0 18px 55px rgba(0,0,0,.38); }
.checkout-logo { width:max-content; }
.checkout-logo img { display:block; width:58px; height:58px; object-fit:contain; filter:drop-shadow(0 0 18px rgba(255,33,74,.38)); }
.secure-note { color:#d9dae0; font-size:11px; font-weight:950; letter-spacing:.16em; }
.secure-note span { color:#54ff78; margin-right:8px; text-shadow:0 0 12px #54ff78; }
.back-link { justify-self:end; color:#b9bac3; text-decoration:none; font-size:13px; font-weight:800; }
.back-link:hover { color:#fff; }
.checkout-shell { position:relative; z-index:2; width:min(1260px,calc(100% - 36px)); margin:34px auto 90px; display:grid; grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr); gap:30px; align-items:start; }
.checkout-main { min-width:0; }
.checkout-intro { margin-bottom:24px; }
.checkout-intro > p:first-child { margin:0 0 9px; color:#ff6d8a; font-size:12px; font-weight:950; letter-spacing:.2em; }
.checkout-intro h1 { margin:0; font-size:clamp(38px,5vw,68px); text-transform:uppercase; letter-spacing:-.035em; line-height:.98; }
.checkout-intro h1 span { color:var(--red); text-shadow:0 0 28px rgba(255,35,76,.28); }
.checkout-sub { max-width:700px; margin:13px 0 0; color:var(--muted); line-height:1.65; }
.checkout-form, .order-card { border:1px solid rgba(255,255,255,.065); border-radius:26px; background:linear-gradient(165deg,rgba(19,19,25,.9),rgba(7,7,11,.97)); box-shadow:0 28px 80px rgba(0,0,0,.42), inset 0 0 55px rgba(255,0,45,.035); }
.checkout-form { padding:30px; }
.form-section + .form-section { margin-top:30px; padding-top:28px; border-top:1px solid rgba(255,255,255,.055); }
.step-label { margin-bottom:18px; color:#f4f4f7; font-size:11px; font-weight:950; letter-spacing:.14em; }
.step-label b { display:inline-grid; place-items:center; width:30px; height:30px; margin-right:10px; border-radius:9px; color:#fff; background:linear-gradient(145deg,#ff3157,#9d0026); box-shadow:0 8px 20px rgba(255,0,53,.18); }
.field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.field-grid label { display:grid; gap:8px; color:#d4d5dc; font-size:12px; font-weight:850; }
.field-grid input, .field-grid select { width:100%; min-height:50px; padding:0 14px; border:1px solid rgba(255,255,255,.08); border-radius:12px; outline:none; color:#fff; background:#0b0b10; font:inherit; transition:border-color .2s ease, box-shadow .2s ease; }
.field-grid input::placeholder { color:#666873; }
.field-grid input:focus, .field-grid select:focus { border-color:rgba(255,49,83,.6); box-shadow:0 0 0 3px rgba(255,49,83,.08), 0 0 22px rgba(255,0,53,.08); }
.field-grid select option { background:#0b0b10; color:#fff; }
.payment-box { display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; padding:16px; border:1px solid rgba(255,255,255,.07); border-radius:15px; background:rgba(255,255,255,.025); }
.payment-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:12px; color:#fff; font-size:20px; background:linear-gradient(145deg,#ff3157,#850020); }
.payment-box strong { display:block; font-size:14px; }
.payment-box p { margin:4px 0 0; color:#9395a0; font-size:12px; line-height:1.45; }
.payment-status { padding:7px 9px; border-radius:999px; color:#ffb4c3; font-size:9px; font-weight:950; letter-spacing:.1em; background:rgba(255,49,83,.08); border:1px solid rgba(255,49,83,.2); }
.terms-row { display:flex; align-items:flex-start; gap:10px; margin-top:16px; color:#aaaab4; font-size:12px; line-height:1.5; }
.terms-row input { margin-top:2px; accent-color:#ff3157; }
.checkout-submit { width:100%; margin-top:28px; min-height:56px; border:0; cursor:pointer; font-family:inherit; }
.checkout-message { margin-top:14px; padding:13px 15px; border-radius:12px; color:#ffd3dc; font-size:12px; line-height:1.5; background:rgba(255,45,80,.08); border:1px solid rgba(255,45,80,.18); }
.order-panel { position:sticky; top:22px; }
.order-card { padding:24px; overflow:hidden; }
.order-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; color:#c6c7d0; font-size:11px; font-weight:950; letter-spacing:.15em; }
.order-badge { padding:6px 9px; border-radius:999px; color:#ffd5dd; background:rgba(255,35,70,.1); border:1px solid rgba(255,50,80,.22); }
.order-product { display:grid; grid-template-columns:130px 1fr; gap:16px; align-items:center; padding:16px 0 22px; border-bottom:1px solid rgba(255,255,255,.06); }
.order-image-wrap { height:125px; display:grid; place-items:center; border-radius:17px; background:radial-gradient(circle,rgba(255,0,52,.10),transparent 68%); }
.order-image-wrap img { width:100%; height:120px; object-fit:contain; filter:drop-shadow(0 14px 16px rgba(0,0,0,.5)); }
.order-product p { margin:0 0 5px; color:#ff7892; font-size:9px; font-weight:950; letter-spacing:.13em; }
.order-product h2 { margin:0 0 5px; font-size:30px; text-transform:uppercase; letter-spacing:.05em; }
.order-product > div:last-child > span { color:#999ba5; font-size:12px; }
.order-lines { display:grid; gap:13px; padding:22px 0; }
.order-lines > div { display:flex; align-items:center; justify-content:space-between; gap:16px; color:#a8aab4; font-size:13px; }
.order-lines strong { color:#fff; }
.discount-line strong { color:#69ff8b; }
.order-total { margin-top:6px; padding-top:16px; border-top:1px solid rgba(255,255,255,.06); font-size:15px !important; }
.order-total strong { font-size:30px; letter-spacing:-.03em; }
.bundle-saving { margin:-4px 0 18px; padding:10px 12px; text-align:center; border-radius:11px; color:#ffd8e0; font-size:10px; font-weight:950; letter-spacing:.12em; background:linear-gradient(135deg,rgba(255,49,87,.18),rgba(151,0,39,.12)); border:1px solid rgba(255,49,87,.2); }
.checkout-benefits { display:grid; gap:9px; padding-top:18px; border-top:1px solid rgba(255,255,255,.055); }
.checkout-benefits span { color:#c5c6ce; font-size:12px; }
.checkout-benefits span::first-letter { color:#ff5576; }
@media (max-width:980px) { .checkout-shell { grid-template-columns:1fr; } .order-panel { position:static; order:-1; } .order-card { display:grid; grid-template-columns:1fr; } }
@media (max-width:650px) { .checkout-header { grid-template-columns:auto 1fr; width:calc(100% - 20px); } .secure-note { justify-self:end; } .back-link { grid-column:1/-1; justify-self:start; } .checkout-shell { width:calc(100% - 24px); margin-top:24px; } .checkout-form { padding:22px 18px; } .field-grid { grid-template-columns:1fr; } .payment-box { grid-template-columns:auto 1fr; } .payment-status { grid-column:2; width:max-content; } .order-product { grid-template-columns:105px 1fr; } .order-image-wrap { height:105px; } .order-image-wrap img { height:100px; } .checkout-intro h1 { font-size:38px; } }
.bundle-images { grid-template-columns:1fr 1fr; gap:0; padding:0 4px; }
.bundle-images img { width:78px; height:110px; margin:0 -10px; object-fit:contain; }
.checkout-submit.payment-ready { background:linear-gradient(135deg,#8b1230,#5d0c21); box-shadow:none; }

/* External payment options */
.payment-instruction { margin:0 0 16px; color:#a5a7b2; font-size:13px; line-height:1.6; }
.payment-methods { display:grid; gap:12px; }
.payment-method { display:grid; grid-template-columns:1fr auto; gap:5px 16px; align-items:center; padding:17px 18px; border:1px solid rgba(255,255,255,.075); border-radius:15px; text-decoration:none; background:rgba(255,255,255,.028); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.payment-method:hover,.payment-method.selected { transform:translateY(-2px); border-color:rgba(255,49,83,.5); background:rgba(255,49,83,.055); box-shadow:0 12px 32px rgba(0,0,0,.22),0 0 20px rgba(255,37,76,.08); }
.payment-method strong { color:#fff; font-size:16px; }
.payment-method span { grid-column:1; color:#9496a1; font-size:12px; }
.payment-method em { grid-column:2; grid-row:1/3; color:#ff89a0; font-size:10px; font-style:normal; font-weight:950; letter-spacing:.1em; }
.payment-warning { margin-top:14px; padding:12px 14px; border-radius:12px; color:#c9c9d0; font-size:11px; line-height:1.5; background:rgba(255,174,0,.045); border:1px solid rgba(255,174,0,.13); }
.confirm-step { position:relative; }
.confirm-step::after { content:"MANUAL CONFIRMATION"; position:absolute; top:26px; right:0; color:#777985; font-size:9px; font-weight:950; letter-spacing:.12em; }
@media (max-width:650px) { .payment-method { grid-template-columns:1fr; } .payment-method em { grid-column:1; grid-row:auto; margin-top:4px; } .confirm-step::after { display:none; } }

/* Payment confirmation success + instructions */
.checkout-submit:disabled { cursor:default; opacity:.82; transform:none; }
.payment-success,.instruction-modal { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:20px; background:rgba(0,0,0,.76); backdrop-filter:blur(10px); }
.success-card,.instruction-card { width:min(560px,100%); border:1px solid rgba(255,255,255,.08); border-radius:26px; background:linear-gradient(165deg,rgba(18,18,24,.98),rgba(7,7,11,.99)); box-shadow:0 35px 100px rgba(0,0,0,.68),0 0 50px rgba(255,0,50,.08); }
.success-card { padding:42px 34px; text-align:center; }
.success-tick { width:82px; height:82px; margin:0 auto 20px; display:grid; place-items:center; border-radius:50%; color:#06120a; background:#55ff79; font-size:44px; font-weight:950; box-shadow:0 0 0 10px rgba(85,255,121,.07),0 0 38px rgba(85,255,121,.35); }
.success-card h2 { margin:0 0 10px; font-size:30px; text-transform:uppercase; }
.success-card p { margin:0; color:#aeb1ba; line-height:1.6; }
.instruction-card { position:relative; padding:34px; }
.modal-close { position:absolute; top:15px; right:15px; width:38px; height:38px; border:1px solid rgba(255,255,255,.08); border-radius:12px; cursor:pointer; color:#fff; background:rgba(255,255,255,.04); font-size:25px; }
.modal-kicker { color:#ff7791; font-size:10px; font-weight:950; letter-spacing:.18em; }
.instruction-card h2 { margin:10px 48px 12px 0; font-size:32px; line-height:1.05; text-transform:uppercase; }
.instruction-card > p { margin:0 0 18px; color:#b9bbc4; line-height:1.7; }
.instruction-note { margin:0 0 20px; padding:13px 14px; border-radius:12px; color:#d3d4da; font-size:11px; line-height:1.55; background:rgba(255,174,0,.045); border:1px solid rgba(255,174,0,.13); }

/* Respect hidden state for checkout overlays */
.payment-success[hidden],
.instruction-modal[hidden] {
  display: none !important;
}

/* Full place-order flow */
button.payment-method { width:100%; color:inherit; font:inherit; text-align:left; cursor:pointer; }
button.payment-method.selected em { color:#fff; }
.order-step { position:relative; }
.placed-order { margin-top:22px; padding:20px; border:1px solid rgba(85,255,121,.16); border-radius:18px; background:linear-gradient(155deg,rgba(13,25,17,.62),rgba(8,8,12,.9)); box-shadow:inset 0 0 36px rgba(85,255,121,.025); }
.placed-order-head,.placed-order-row { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.placed-order-head { padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid rgba(255,255,255,.06); color:#7cff98; font-size:10px; font-weight:950; letter-spacing:.14em; }
.placed-order-head strong { color:#fff; font-size:12px; letter-spacing:.08em; }
.placed-order-row { margin:10px 0; color:#9fa1ac; font-size:12px; }
.placed-order-row strong { color:#fff; }
.provider-pay { margin-top:18px; min-height:54px; }
.return-note { margin:12px 0 4px; color:#8f919b; font-size:11px; line-height:1.55; }
.confirm-payment { margin-top:14px; min-height:52px; border:0; cursor:pointer; font-family:inherit; }
.modal-order-ref { margin:-6px 0 20px; color:#8e909b; font-size:11px; }
.modal-order-ref strong { color:#fff; letter-spacing:.06em; }
@media (max-width:650px) { .placed-order-head,.placed-order-row { align-items:flex-start; flex-direction:column; gap:5px; } }
/* Stripe */
.payment-method.stripe strong { color:#b9a7ff; }
.provider-pay.stripe-not-ready { pointer-events:none; cursor:not-allowed; opacity:.58; background:linear-gradient(135deg,#4d3c85,#2d244f); box-shadow:none; }

.terms-row a { color:#ff5a73; font-weight:850; text-decoration:none; }
.terms-row a:hover { color:#fff; text-decoration:underline; }

/* PayPal-specific purchase notice */
.paypal-disclaimer { margin-top:14px; padding:15px 16px; border:1px solid rgba(255,49,83,.26); border-radius:14px; background:linear-gradient(145deg,rgba(255,49,83,.09),rgba(87,0,22,.08)); box-shadow:inset 0 0 28px rgba(255,0,45,.025); }
.paypal-disclaimer strong { display:block; margin-bottom:6px; color:#fff; font-size:12px; font-weight:950; letter-spacing:.08em; text-transform:uppercase; }
.paypal-disclaimer span { display:block; color:#c6c7d0; font-size:12px; line-height:1.6; }
.paypal-disclaimer[hidden] { display:none !important; }


/* Stripe automatic verification */
.stripe-auto-status{display:flex;align-items:center;gap:12px;margin:14px 0;padding:14px 16px;border:1px solid rgba(255,49,83,.26);border-radius:14px;background:rgba(255,31,72,.06)}
.stripe-auto-status[hidden]{display:none!important}.stripe-auto-status div{display:grid;gap:3px}.stripe-auto-status strong{font-size:10px;letter-spacing:.12em;color:#fff}.stripe-auto-status small{color:#aeb0ba;font-size:12px}.stripe-auto-dot{width:10px;height:10px;flex:0 0 10px;border-radius:50%;background:#ff3157;box-shadow:0 0 0 4px rgba(255,49,87,.09),0 0 16px rgba(255,49,87,.75);animation:stripeVerifyPulse 1.5s ease-in-out infinite}@keyframes stripeVerifyPulse{50%{transform:scale(1.2);box-shadow:0 0 0 7px rgba(255,49,87,.06),0 0 24px rgba(255,49,87,.95)}}