.book-hero{position:relative;color:#fff;overflow:hidden;
  background:linear-gradient(180deg,rgba(8,26,52,.55),rgba(8,26,52,.82)),
    url('https://images.unsplash.com/photo-1571896349842-33c89424de2d?auto=format&fit=crop&w=1700&q=80') center/cover;}
.book-hero .container{position:relative;z-index:2;padding:40px 22px}
.book-hero h1{font-size:clamp(28px,4.4vw,42px);font-weight:800}
.book-hero p{color:rgba(255,255,255,.85);margin-top:6px;max-width:520px}
.book-hero .hero-badges{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.book-hero .hb{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(8px);padding:8px 14px;border-radius:11px;font-size:12.5px;font-weight:500}

.book-wrap{display:grid;grid-template-columns:360px 1fr;gap:24px;align-items:start;margin-top:-26px;position:relative;z-index:5;padding-bottom:10px}
.card{background:#fff;border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow)}

/* summary sidebar */
.sum{position:sticky;top:88px;overflow:hidden}
.sum-img{position:relative;height:190px;background-size:cover;background-position:center}
.sum-img .badge-bhk{position:absolute;top:14px;left:14px}
.sum-img .fav{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.9);display:grid;place-items:center;color:var(--pink)}
.sum-body{padding:18px}
.sum-body h2{font-size:20px;font-weight:800;color:var(--navy)}
.sum-loc{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--muted);margin-top:4px}
.sum-loc .ic{color:var(--pink)}
.sum-rate{margin-top:8px}
.sum-specs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px 8px;margin:16px 0;padding:14px 0;border-top:1px solid var(--border-2);border-bottom:1px solid var(--border-2)}
.sum-specs span{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#334155}
.sum-specs .ic{color:var(--pink)}
.sum-section-h{font-size:15px;font-weight:700;color:var(--navy);margin:6px 0 12px;display:flex;align-items:center;gap:8px}
.sum-rows{display:flex;flex-direction:column;gap:11px}
.sum-rows .r{display:flex;justify-content:space-between;font-size:13.5px;color:#475569}
.sum-rows .r .lbl{display:flex;align-items:center;gap:8px}
.sum-rows .r b{color:var(--navy);font-weight:600}
.price-box{border:1px solid var(--border);border-radius:14px;padding:14px 16px;margin:16px 0}
.price-box .r{display:flex;justify-content:space-between;font-size:13.5px;color:#475569;margin-bottom:10px}
.price-box .total{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1.5px dashed var(--border);font-weight:700;margin-bottom:0}
.price-box .total .amt{color:var(--pink);font-size:20px;font-weight:800}
.cancel-box{display:flex;gap:12px;background:var(--green-soft);border:1px solid #c7ebd2;border-radius:14px;padding:14px;margin-bottom:14px}
.cancel-box .ic{color:var(--green-deep);flex-shrink:0}
.cancel-box h4{font-size:13.5px;font-weight:700;color:var(--green-deep)}
.cancel-box p{font-size:12px;color:#3f7a55}
.help-box{display:flex;gap:12px;background:#fff5f8;border:1px solid #ffd9e6;border-radius:14px;padding:14px;align-items:center}
.help-box .ic{width:40px;height:40px;border-radius:50%;background:#ffe1ec;display:grid;place-items:center;color:var(--pink);flex-shrink:0}
.help-box h4{font-size:13.5px;font-weight:700;color:var(--navy)}
.help-box p{font-size:11.5px;color:var(--muted)}
.help-box b{display:block;font-size:15px;color:var(--navy);margin-top:2px}

/* form */
.form-card{padding:26px 28px}
.fsec{padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid var(--border-2)}
.fsec:last-of-type{border-bottom:none;margin-bottom:0;padding-bottom:0}
.fsec-h{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;color:var(--navy);margin-bottom:20px}
.fsec-h .ic{width:34px;height:34px;border-radius:10px;background:#fff0f5;display:grid;place-items:center;color:var(--pink)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.frow.three{grid-template-columns:1fr 1fr 1fr}
.frow:last-child{margin-bottom:0}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-size:13px;font-weight:600;color:#334155}
.field label .req{color:var(--pink)}
.field input,.field select,.field textarea{
  border:1.5px solid var(--border);border-radius:11px;padding:12px 14px;outline:none;color:var(--ink);
  background:#fff;transition:border-color .2s,box-shadow .2s;width:100%}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(236,30,99,.1)}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-2)}
.field textarea{resize:vertical;min-height:84px}
.phone-wrap{display:flex;gap:8px}
.phone-wrap .cc{flex:0 0 92px}
.phone-wrap .cc select{font-weight:600}
.note-box{display:flex;align-items:center;gap:10px;background:#fff5f8;border:1px solid #ffd9e6;border-radius:12px;padding:13px 16px;font-size:13px;color:#a33;margin:8px 0 18px}
.note-box .ic{color:var(--pink);flex-shrink:0}
.submit-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.agree{display:flex;align-items:center;gap:10px;font-size:13.5px;color:#475569}
.agree input{width:18px;height:18px;accent-color:var(--pink)}
.agree a{color:var(--pink);font-weight:600}
.submit-btn{padding:14px 26px;font-size:15px}
.safe-note{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12.5px;color:var(--muted);margin-top:18px}
.safe-note .ic{color:var(--green-deep)}

@media(max-width:980px){ .book-wrap{grid-template-columns:1fr} .sum{position:static} }
@media(max-width:560px){
  .frow,.frow.three{grid-template-columns:1fr}
  .form-card{padding:20px 18px}
  .sum-specs{grid-template-columns:1fr 1fr}
  .book-hero .container{padding:32px 16px}
  .submit-btn{width:100%}
}