/* Strona zamówienia i podziękowania — styl Metabo RX */
:root{--o-bg:var(--bg); --o-head-bg:var(--bg); --o-head-link:var(--green-d); --o-line:var(--line); --o-r:var(--r); --o-sum-bg:var(--ink); --o-sum-text:#DCE8DF; --o-sum-muted:#9DB4A3; --o-accent:var(--honey); --o-accent-text:var(--ink); --o-price:var(--honey); --o-badge:var(--apple); --o-head:var(--serif); --o-card:var(--card); --o-ink:var(--ink); --o-muted:var(--muted); --o-soft:var(--green-l); --o-main:var(--green-d); --o-foot-bg:var(--ink); --o-foot-text:#9DB4A3;}
body.order-page{min-height:100vh; display:flex; flex-direction:column; background:var(--o-bg); margin:0;}
body.order-page main{flex:1;}
.order-page .wrap{max-width:1160px; margin:0 auto; padding:0 24px;}
.order-head{background:var(--o-head-bg); border-bottom:1px solid var(--o-line);}
.order-head .wrap{display:flex; align-items:center; justify-content:space-between; height:68px; gap:18px;}
.back-link{font-weight:700; font-size:14.5px; text-decoration:none; color:var(--o-head-link);}
.back-link:hover{opacity:.75;}
.order{padding:52px 0 80px;}
.order-grid{display:grid; grid-template-columns:360px minmax(0,1fr); gap:30px; align-items:start;}
.summary{position:sticky; top:24px; background:var(--o-sum-bg); color:var(--o-sum-text); padding:26px; border-radius:var(--o-r); box-shadow:0 18px 40px rgba(0,0,0,.16);}
.sum-kicker{display:inline-block; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; background:var(--o-accent); color:var(--o-accent-text); padding:5px 12px; border-radius:30px;}
.sum-prod{display:flex; gap:18px; align-items:center; margin:18px 0; padding-bottom:18px; border-bottom:1px solid rgba(255,255,255,.18);}
.sum-prod img{width:84px; flex:none; filter:drop-shadow(0 10px 14px rgba(0,0,0,.3));}
.sum-prod h2{color:#fff; font-family:var(--o-head); font-size:28px; line-height:1.1; margin:0 0 4px;}
.sum-prod p{font-size:14px; margin:0 0 10px; color:var(--o-sum-muted); line-height:1.45;}
.sum-price{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;}
.sum-price s{color:var(--o-sum-muted); font-size:15px;}
.sum-price strong{font-family:var(--o-head); font-size:32px; font-weight:800; color:var(--o-price); line-height:1;}
.sum-price span{background:var(--o-badge); color:#fff; font-weight:800; font-size:12px; padding:3px 9px; border-radius:20px;}
.sum-list{list-style:none; margin:0; padding:0;}
.sum-list li{display:flex; justify-content:space-between; gap:14px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.13); font-size:14.5px;}
.sum-list li span{color:var(--o-sum-muted);}
.sum-list li b{text-align:right; color:#fff;}
.sum-steps{margin:20px 0 0; padding:0; list-style:none; counter-reset:s;}
.sum-steps li{counter-increment:s; display:flex; gap:12px; align-items:center; font-size:14.5px; padding:6px 0;}
.sum-steps li::before{content:counter(s); width:28px; height:28px; flex:none; border-radius:50%; background:var(--o-accent); color:var(--o-accent-text); font-weight:800; display:flex; align-items:center; justify-content:center; font-size:13px;}
.form-card{background:var(--o-card); border:1px solid var(--o-line); border-radius:var(--o-r); padding:36px 38px 32px; box-shadow:0 18px 40px rgba(0,0,0,.06);}
.form-card h1{font-family:var(--o-head); font-size:clamp(30px,4vw,44px); line-height:1.08; margin:0 0 12px; color:var(--o-ink);}
.form-sub{color:var(--o-muted); margin:0 0 20px; max-width:560px;}
.pay-box{background:var(--o-soft); border-left:4px solid var(--o-main); border-radius:12px; padding:14px 18px; margin-bottom:26px; color:var(--o-ink);}
.form-alert{background:#FDECEA; color:#9B1C12; border:1px solid #F3BDB5; border-radius:12px; padding:12px 18px; margin-bottom:16px; font-weight:700; font-size:15px;}
.grid.one{display:grid; grid-template-columns:1fr; gap:16px; max-width:520px;}
.f{display:flex; flex-direction:column; min-width:0;}
.f label{font-size:14.5px; font-weight:700; color:var(--o-ink); margin-bottom:6px;}
.f input{width:100%; box-sizing:border-box; font:inherit; font-size:16.5px; color:var(--o-ink); background:#fff; border:1.5px solid var(--o-line); border-radius:12px; padding:12px 14px; height:52px; -webkit-appearance:none; appearance:none; transition:border-color .15s, box-shadow .15s;}
.f input:focus{outline:none; border-color:var(--o-main); box-shadow:0 0 0 4px var(--o-soft);}
.err{display:none; color:#B4271B; font-size:13px; margin-top:5px; font-weight:700;}
.f.bad input{border-color:#D9483B; background:#FFF8F6;}
.f.bad .err,.err.show{display:block;}
.agree{display:flex; gap:12px; align-items:flex-start; margin:22px 0 4px; font-size:14.5px; color:var(--o-muted); cursor:pointer;}
.agree input{width:22px; height:22px; flex:none; margin:1px 0 0; accent-color:var(--o-main);}
.agree a{color:var(--o-main);}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
.btn.submit{border:0; margin-top:22px; padding:17px 40px;}
.btn.submit:disabled{opacity:.7; cursor:wait; transform:none;}
.safe{font-size:13.5px; color:var(--o-muted); margin:16px 0 0;}
.thanks{display:flex; align-items:center; padding:64px 0 90px;}
.thanks .wrap{width:100%;}
.thanks-card{max-width:620px; margin:0 auto; background:var(--o-card); border:1px solid var(--o-line); border-radius:calc(var(--o-r) + 4px); padding:48px 40px; text-align:center; box-shadow:0 24px 60px rgba(0,0,0,.12);}
.tick{width:84px; height:84px; margin:0 auto 24px; border-radius:50%; background:var(--o-main); display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 10px var(--o-soft);}
.thanks-card h1{font-family:var(--o-head); font-size:clamp(30px,4.4vw,44px); line-height:1.1; margin:0; color:var(--o-ink);}
.order-foot{background:var(--o-foot-bg); color:var(--o-foot-text); padding:26px 0; font-size:13.5px; text-align:center;}
.order-foot a{color:#fff;}
.order-foot p{margin:8px 0 0;}
@media (max-width:900px){
  .order-grid{grid-template-columns:1fr;}
  .summary{position:relative; top:0; padding:20px 22px;}
  .sum-steps{display:none;}
}
@media (max-width:560px){
  .order{padding:24px 0 60px;}
  .form-card{padding:26px 18px;}
  .btn.submit{width:100%;}
  .thanks-card{padding:34px 20px;}
  .back-link{font-size:13px;}
}
