/* ==========================================================================
   PÁGINA DE ORÇAMENTO (orcamento.html)
   ========================================================================== */

.quote-page{padding:64px 0 100px}

.quote-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:start}

.quote-intro h1{font-size:clamp(34px,4vw,52px);margin-bottom:18px}
.quote-intro p{color:var(--text);line-height:1.7;margin-bottom:26px}

.quote-benefits{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;color:var(--text);font-weight:600}

.quote-form{display:grid;grid-template-columns:1fr 1fr;gap:18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow-soft)}

.quote-form label{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:700;color:#20252d}

.quote-form input,
.quote-form select,
.quote-form textarea{
    font-family:inherit;
    font-size:16px;
    padding:13px 14px;
    border:1px solid #dbe8f5;
    border-radius:12px;
    color:var(--ink);
    background:#fff;
    outline:0;
    transition:.2s;
}

.quote-form input:focus,
.quote-form select:focus,
.quote-form textarea:focus{border-color:var(--blue-strong);box-shadow:0 0 0 3px rgba(61,149,247,.15)}

.quote-form textarea{resize:vertical;min-height:100px}

.quote-form-full{grid-column:1 / -1}

.quote-form button{grid-column:1 / -1}

.quote-form small{grid-column:1 / -1;color:var(--muted);font-size:12px;line-height:1.5;text-align:center}

.quote-form-message{grid-column:1 / -1;display:none;padding:12px 14px;border-radius:12px;font-size:13.5px;font-weight:600;text-align:center}
.quote-form-message.success{display:block;background:#dcfce7;color:#166534}
.quote-form-message.error{display:block;background:#fee2e2;color:#b91c1c}

/* ==========================================================================
   BREAKPOINT: TABLET (≤1080px)
   ========================================================================== */

@media (max-width:1080px){
    .quote-grid{grid-template-columns:1fr;gap:36px}
}

/* ==========================================================================
   BREAKPOINT: MOBILE (≤760px)
   ========================================================================== */

@media (max-width:760px){
    .quote-page{padding:36px 0 60px}
    .quote-form{grid-template-columns:1fr;padding:24px;gap:16px}
}
