:root { --navy:#062c62; --blue:#087fd6; --light:#eef7ff; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; font-family:Manrope,Arial,sans-serif; color:var(--navy); background:linear-gradient(135deg,#eff8ff,#fff 48%,#e8f4ff); }
.calculator-page { max-width:1140px; margin:0 auto; padding:35px 24px 58px; }.calculator-intro { text-align:center; }.calculator-intro img { width:132px; height:92px; object-fit:contain; }.calculator-intro p { margin:8px 0 4px; color:var(--blue); font-weight:800; letter-spacing:1.4px; text-transform:uppercase; font-size:12px; }.calculator-intro h1 { margin:0 0 30px; font-size:clamp(26px,4vw,45px); line-height:1.05; }.calculator-intro em { font-family:'Playfair Display',Georgia,serif; font-weight:700; color:#0b70bd; }
.calculator-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.85fr); gap:26px; align-items:start; }.calculator-form,.cart { padding:clamp(23px,4vw,38px); border:1px solid #d8eafa; border-radius:20px; background:#fff; box-shadow:0 14px 40px #062c6215; }.calculator-form h2,.cart h2 { margin:0 0 23px; font-size:21px; }.calculator-form label { display:block; margin:15px 0 8px; font-size:14px; font-weight:800; }.calculator-form select,.calculator-form input { width:100%; min-height:52px; padding:0 15px; border:1px solid #c7dceb; border-radius:10px; color:var(--navy); background:#fbfdff; font:600 15px Manrope,Arial,sans-serif; outline:none; }.calculator-form select:focus,.calculator-form input:focus { border-color:var(--blue); box-shadow:0 0 0 3px #087fd61c; }.unit-price { min-height:20px; margin:7px 0 0; color:#0b70bd; font-size:13px; font-weight:800; }.area-field { position:relative; }.area-field input { padding-right:52px; }.area-field span { position:absolute; top:50%; right:15px; transform:translateY(-50%); color:#66849e; font-weight:800; }.minimum-note { margin:10px 0 7px; padding:10px 12px; border-radius:8px; color:#386b92; background:#f1f8ff; font-size:12px; }.form-error { min-height:18px; margin:0; color:#d92632; font-size:12px; font-weight:700; }.line-total { margin:20px 0 14px; padding:16px; display:flex; justify-content:space-between; align-items:center; border-radius:12px; background:var(--navy); color:#fff; }.line-total span { font-size:13px; font-weight:700; }.line-total strong,.cart-total strong { font-size:24px; }.calculator-form button { width:100%; min-height:54px; border:0; border-radius:10px; background:linear-gradient(110deg,#075ca7,#0b91e9); color:#fff; font:800 16px Manrope,Arial,sans-serif; cursor:pointer; box-shadow:0 8px 18px #087fd635; }.calculator-form button:hover { filter:brightness(1.06); }
.dimension-labels,.dimension-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.dimension-labels label { margin-bottom:8px; }.calculated-area { margin:11px 0 0; color:#386b92; font-size:13px; }.calculated-area strong { color:#0b70bd; }
.cart { position:sticky; top:20px; }.cart-header { padding-bottom:15px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #e7f0f8; }.cart-header h2 { margin:0; }.cart-header span { padding:5px 9px; border-radius:99px; color:#0b70bd; background:#e9f6ff; font-size:12px; font-weight:800; }.cart-items { min-height:210px; }.empty-cart { padding:60px 0; color:#7891a6; text-align:center; font-size:14px; }.cart-item { padding:15px 0; display:grid; grid-template-columns:1fr auto; gap:8px; border-bottom:1px solid #e8f0f7; }.cart-item b { font-size:14px; }.cart-item small { display:block; margin-top:4px; color:#60809b; font-size:12px; }.cart-item strong { align-self:center; font-size:14px; }.remove-item { grid-column:2; padding:0; border:0; color:#d92632; background:none; font-size:12px; font-weight:800; cursor:pointer; }.cart-total { padding-top:20px; display:flex; align-items:end; justify-content:space-between; }.cart-total span { font-weight:800; }.cart-total strong { color:#0871bf; }
.whatsapp-button { margin-top:22px; min-height:54px; display:flex; align-items:center; justify-content:center; gap:10px; border-radius:10px; color:#fff; background:#25d366; box-shadow:0 8px 18px #25d36635; text-decoration:none; font-size:14px; font-weight:800; transition:transform .2s ease,filter .2s ease; }.whatsapp-button:hover { transform:translateY(-2px); filter:brightness(1.04); }.whatsapp-button span { font-size:20px; }.whatsapp-button.disabled { pointer-events:none; background:#a9bdcb; box-shadow:none; }.whatsapp-note { margin:9px 0 0; color:#7891a6; text-align:center; font-size:11px; }
@media (max-width:760px) { .calculator-page { padding:25px 16px 38px; }.calculator-layout { grid-template-columns:1fr; }.cart { position:static; }.calculator-intro h1 { font-size:30px; } }
@media(max-width:480px){body{overflow-x:hidden}.calculator-page{padding:18px 10px 30px}.calculator-intro img{width:112px;height:78px}.calculator-intro h1{font-size:26px}.calculator-intro p{font-size:10px}.calculator-layout{gap:16px}.calculator-form,.cart{padding:20px 14px;border-radius:16px}.calculator-form h2,.cart h2{font-size:19px;margin-bottom:17px}.calculator-form select,.calculator-form input{min-height:50px;font-size:16px}.dimension-labels,.dimension-fields{gap:8px}.line-total{padding:13px}.line-total strong,.cart-total strong{font-size:20px}.empty-cart{min-height:130px;padding:36px 0}.whatsapp-button{min-height:52px;font-size:13px}}