/* =============================================
   LEÓN SOLEDAD — Formulario "Solicitud de propuesta" y "Agendar asesoría" (drawer .pm-*)
   Extraído de styles.css (v1) sin cambiar reglas; la paleta se remapea a negro y blanco
   con variables locales, así la lógica de cada página sigue igual.
   ============================================= */
.proposal-overlay, .proposal-modal {
  --gold:#0B0B0B; --gold-lt:#E4E4E4; --gold-dk:#0B0B0B; --gold-text:#0B0B0B;
  --cream:#FFFFFF; --cream-dk:#F4F4F4; --white:#FFFFFF;
  --dark:#0B0B0B; --dark-soft:#1A1A1A; --brown:#0B0B0B; --brown-lt:#5C5C5C;
  --terra:#0B0B0B; --terra-dk:#222222; --gray-lt:#E4E4E4; --gray:#8A8A8A;
  --font-heading:'EB Garamond', Georgia, serif; --font-body:'Hanken Grotesk', system-ui, sans-serif;
  --sp-xs:.5rem; --sp-sm:1rem; --sp-md:1.5rem; --sp-lg:2.5rem; --sp-xl:4rem;
  --shadow-sm:none; --shadow-md:none; --shadow-lg:none; --shadow-xl:none;
  --radius-sm:0; --radius-md:0; --radius-lg:0;
  --ease:cubic-bezier(.22,.61,.36,1); --ease-out:cubic-bezier(.22,.61,.36,1); --dur:.3s;
  font-family:var(--font-body);
}
.proposal-modal h3 { font-family:var(--font-heading); font-weight:400; }
.proposal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:2000;
  opacity:0; visibility:hidden; transition:all .35s var(--ease);
  backdrop-filter:blur(4px);
}
.proposal-overlay.active { opacity:1; visibility:visible; }

.proposal-modal {
  position:fixed; top:0; right:-100%; width:100vw; height:100vh;
  background:var(--cream); z-index:2001; overflow-y:auto;
  transition:right .4s var(--ease-out); box-shadow:-10px 0 40px rgba(0,0,0,.15);
}
.proposal-modal.active { right:0; }

.proposal-modal__header {
  position:sticky; top:0; z-index:10; background:var(--dark); color:var(--white);
  padding:var(--sp-md) var(--sp-lg); display:flex; align-items:center; justify-content:space-between;
}
.proposal-modal__header h3 { color:var(--white); margin:0; font-size:1.2rem; }
.proposal-modal__close {
  width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.2);
  display:flex; align-items:center; justify-content:center; color:var(--white);
  font-size:1rem; cursor:pointer; transition:all var(--dur) var(--ease); background:none;
}
.proposal-modal__close:hover { background:rgba(255,255,255,.1); }

/* Mobile: tighter body padding */
.proposal-modal__body { padding:var(--sp-md) var(--sp-sm); }

.pm-card {
  background:var(--white); border:1px solid var(--gray-lt); border-radius:var(--radius-md);
  padding:var(--sp-lg); margin-bottom:var(--sp-md); box-shadow:var(--shadow-sm);
}
.pm-card__head { display:flex; align-items:flex-start; gap:12px; margin-bottom:var(--sp-md); }
.pm-step {
  width:32px; height:32px; border-radius:50%; background:transparent; color:var(--gold);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; flex-shrink:0;
  border:2px solid var(--gold);
}
.pm-card h3 { margin:0; font-family:var(--font-heading); font-size:1.15rem; color:var(--dark); }
.pm-card .pm-sub { font-size:.82rem; color:var(--brown-lt); margin-top:3px; }

.pm-field { margin-bottom:var(--sp-md); }
.pm-field label { display:block; font-size:.82rem; font-weight:600; color:var(--dark); margin-bottom:6px; letter-spacing:.3px; }
/* 1rem = 16px: iOS-safe, no zoom on focus; refined to .9rem at 600px+ */
.pm-field input, .pm-field select, .pm-field textarea {
  width:100%; padding:10px 14px; border:1px solid var(--gray-lt); border-radius:var(--radius-sm);
  font-family:var(--font-body); font-size:1rem; outline:none; transition:border-color var(--dur) var(--ease);
  background:var(--white); color:var(--dark);
}
.pm-field input:focus, .pm-field select:focus, .pm-field textarea:focus { border-color:var(--dark); }
.pm-field textarea { resize:vertical; min-height:90px; }

/* Mobile: single column grids */
.pm-grid { display:grid; gap:10px; }
.pm-grid--2 { grid-template-columns:1fr; }
.pm-grid--3 { grid-template-columns:1fr; }

.pm-choice {
  padding:12px; border:1px solid var(--gray-lt); border-radius:var(--radius-sm);
  background:var(--white); cursor:pointer; transition:all .25s var(--ease); text-align:left;
}
.pm-choice:hover { border-color:var(--dark); background:var(--cream-dk); }
.pm-choice.active { border-color:var(--dark); background:var(--dark); color:var(--white); box-shadow:none; }
.pm-choice.active .pm-choice__title { color:var(--white); }
.pm-choice.active .pm-choice__help { color:rgba(255,255,255,.6); }
.pm-choice__title { font-weight:600; font-size:.85rem; color:var(--dark); }
.pm-choice__help { font-size:.75rem; color:var(--brown-lt); margin-top:3px; }

.pm-hint {
  padding:10px 14px; background:var(--cream-dk); border:1px solid var(--gray-lt);
  border-radius:var(--radius-sm); font-size:.8rem; color:var(--brown-lt); margin:10px 0 12px; line-height:1.5;
}

.pm-summary {
  background:var(--dark); color:var(--white); border-radius:var(--radius-md);
  padding:15px; margin-top:var(--sp-md);
}
.pm-summary h3 { color:var(--white); margin-bottom:var(--sp-sm); font-size:1.45rem; }
/* Mobile: tighter value size */
.pm-summary__value {
  font-family:var(--font-heading); font-size:1.3rem; font-weight:700; color:var(--white);
  margin:var(--sp-xs) 0 var(--sp-sm);
}
.pm-summary__detail { font-size:.82rem; color:rgba(255,255,255,.65); line-height:1.6; margin-bottom:var(--sp-xs); }
.pm-chip-wrap { display:flex; flex-wrap:wrap; gap:6px; margin:var(--sp-sm) 0; }
.pm-chip {
  padding:4px 10px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.15);
  border-radius:20px; font-size:.72rem; color:rgba(255,255,255,.8);
}

.pm-wa-btn {
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; padding:16px; background:#0B0B0B; color:#FFFFFF; border-radius:0;
  text-decoration:none; font-weight:700; font-size:1.05rem; transition:background .3s; margin-top:var(--sp-md);
  border:none; cursor:pointer;
}
.pm-wa-btn:hover { background:#333333; }

.pm-footnote { font-size:.82rem; color:#5C5C5C; text-align:center; margin-top:var(--sp-sm); }
.pm-summary__includes { font-size:.78rem; color:rgba(255,255,255,.5); margin-bottom:var(--sp-sm); line-height:1.6; }
.pm-summary__reassurance {
  font-size:.78rem; color:var(--gold); margin:8px 0 var(--sp-sm);
  display:flex; align-items:center; gap:7px; opacity:.9;
}

/* Wizard step navigation */
.pm-step-label { font-size:.72rem; color:rgba(255,255,255,.5); letter-spacing:.4px; white-space:nowrap; }
.pm-progress-bar { height:3px; background:rgba(0,0,0,.12); }
.pm-panel { display:none; }
@keyframes pmFadeIn {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:translateY(0); }
}
.pm-panel.active { display:block; animation:pmFadeIn .28s ease; }
.pm-nav { display:flex; justify-content:space-between; align-items:center; margin-top:var(--sp-md); gap:10px; }
.pm-btn-next {
  margin-left:auto; background:var(--dark); color:var(--white); border:none;
  padding:13px 28px; border-radius:var(--radius-sm); font-family:var(--font-body);
  font-weight:600; font-size:.9rem; cursor:pointer; display:flex; align-items:center;
  gap:8px; transition:background var(--dur) var(--ease); letter-spacing:.2px;
}
.pm-btn-next:hover { background:#1a1a1a; }
.pm-btn-back {
  background:transparent; border:1px solid var(--gray-lt); color:var(--brown-lt);
  padding:13px 20px; border-radius:var(--radius-sm); font-family:var(--font-body);
  font-size:.9rem; cursor:pointer; display:flex; align-items:center; gap:8px;
  transition:all var(--dur) var(--ease);
}
.pm-day-msg { font-size:.8rem; line-height:1.5; margin:-4px 0 12px; }
.pm-day-msg:empty { margin:0; }
.pm-day-msg i { margin-right:5px; }
.pm-day-msg--warn { color:#8a6d00; }
.pm-day-msg--error { color:#b00020; }
.pm-hint--error { background:#fdecea; border-color:#f1b0b7; color:#b00020; }
.ag-add { display:inline-flex; align-items:center; gap:6px; background:none; border:1px dashed var(--gray-lt); color:var(--brown-lt); padding:8px 12px; border-radius:var(--radius-sm); font-family:var(--font-body); font-size:.82rem; cursor:pointer; margin-bottom:12px; transition:all var(--dur) var(--ease); }
@media(min-width:600px) {
  .proposal-modal { width:min(680px,100vw); }
  .proposal-modal__body { padding:var(--sp-lg); }
  .pm-summary { padding:var(--sp-lg); }
  .pm-grid--2 { grid-template-columns:1fr 1fr; }
  .pm-grid--3 { grid-template-columns:1fr 1fr 1fr; }
  .pm-summary__value { font-size:1.6rem; }
  .pm-field input, .pm-field select, .pm-field textarea { font-size:.9rem; }
}