/* ===== Future Motors – custom CSS for dynamic Laravel build ===== */

/* Booking / appointment modal */
.booking-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:1rem}
.booking-modal.is-open{display:flex}
.booking-modal-backdrop{position:absolute;inset:0;background:rgba(15,22,36,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.booking-modal-dialog{position:relative;width:100%;max-width:560px;max-height:92vh;overflow-y:auto;background:#fff;border-radius:20px;padding:30px;box-shadow:0 30px 80px rgba(15,22,36,.45);animation:bkPop .35s cubic-bezier(.23,1,.32,1)}
@keyframes bkPop{0%{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.booking-modal-close{position:absolute;top:16px;right:16px;width:34px;height:34px;border:none;border-radius:50%;background:#f1f5f9;color:#475569;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s}
.booking-modal-close:hover{background:#e2e8f0;color:#0f1624}
.booking-modal-eyebrow{font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:#1aaaa3;margin-bottom:8px}
.booking-modal-title{font-family:var(--font-heading);font-size:1.55rem;font-weight:700;color:#0f1624;margin-bottom:6px;line-height:1.15}
.booking-modal-sub{font-family:var(--font-body);font-size:.875rem;color:#64748b;margin-bottom:22px}
.booking-form .booking-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.booking-form label{display:flex;flex-direction:column;font-family:var(--font-body);font-size:12px;font-weight:600;color:#334155;gap:6px;margin-bottom:14px}
.booking-form .booking-full{grid-column:1/-1}
.booking-form input,.booking-form select,.booking-form textarea{font-family:var(--font-body);font-size:14px;font-weight:400;padding:11px 13px;border:1.5px solid #e2e8f0;border-radius:9px;color:#0f1624;background:#f8fafc;transition:.2s;width:100%}
.booking-form input:focus,.booking-form select:focus,.booking-form textarea:focus{outline:none;border-color:#1aaaa3;background:#fff;box-shadow:0 0 0 3px rgba(26,170,163,.12)}
.booking-submit{width:100%;justify-content:center;margin-top:6px}
.booking-error{color:#dc2626;font-size:13px;margin-top:10px;text-align:center}
.booking-success{text-align:center;padding:24px 8px 8px}
.booking-success-icon{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#1aaaa3,#30a873);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;animation:bkPop .4s cubic-bezier(.23,1,.32,1)}
.booking-success-icon svg{width:30px;height:30px}
.booking-success h4{font-family:var(--font-heading);font-size:1.4rem;color:#0f1624;margin-bottom:8px}
.booking-success p{font-family:var(--font-body);color:#64748b}
body.booking-locked{overflow:hidden}
@media(max-width:560px){.booking-form .booking-grid{grid-template-columns:1fr}.booking-modal-dialog{padding:22px}}

/* Small basic animations (subtle) */
.reveal-pop{animation:bkPop .4s cubic-bezier(.23,1,.32,1)}
.hover-raise{transition:transform .3s cubic-bezier(.23,1,.32,1),box-shadow .3s}
.hover-raise:hover{transform:translateY(-4px)}

/* Flash / form messages */
.fm-flash{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:9998;background:#0f1624;color:#fff;padding:14px 22px;border-radius:10px;font-family:var(--font-body);font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.25);animation:bkPop .3s ease}
.fm-flash.success{background:linear-gradient(135deg,#1aaaa3,#30a873)}

/* Generic page hero (for content pages) */
.page-hero{position:relative;padding:8rem 0 4rem;background:linear-gradient(135deg,#192e6e,#0f1624)}
.page-hero-eyebrow{font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:.35em;text-transform:uppercase;color:#39c5bb;margin-bottom:14px}
.page-hero-title{font-family:var(--font-heading);font-weight:700;color:#fff;font-size:2.6rem;line-height:1.08;margin-bottom:14px}
.page-hero-sub{font-family:var(--font-body);color:rgba(255,255,255,.7);max-width:44rem;font-size:1.05rem}