/* HC Showroom Lead Modal — vars del tema + reglas extraídas de producción + toggle */
:root{
  --font-display:'Source Serif 4', ui-serif, Georgia, 'Times New Roman', serif;
  --font-luxury-serif:'Source Serif 4', ui-serif, Georgia, 'Times New Roman', serif;
  --luxury-cream:#f9f7f2;
  --luxury-ink:#2a2a2a;
  --showroom-slate:#2c3539;
  --ultra-matte-black:#0d0d0d;
}
/* toggle abrir/cerrar (prod define .showroom-modal{display:grid}) */
#hc-showroom-modal{display:none;}
#hc-showroom-modal.is-open{display:grid;}
#hc-showroom-modal [hidden]{display:none !important;}
/* ===== reglas .showroom-modal EXTRAÍDAS DE PRODUCCIÓN ===== */
.showroom-modal { z-index: 120; place-items: center; padding: 1rem; display: grid; position: fixed; inset: 0px; }
.showroom-modal__overlay { background: rgba(15, 23, 42, 0.55); border: 0px; position: absolute; inset: 0px; }
.showroom-modal__panel { border: 1px solid color-mix(in srgb, var(--showroom-slate) 20%, transparent); background: linear-gradient(180deg, #fffffff2 0%, #f8f7f3f5 100%), color-mix(in srgb, var(--luxury-cream) 90%, white); border-radius: 1rem; width: min(980px, 100%); max-height: min(92vh, 980px); padding: clamp(1.15rem, 3vw, 1.75rem); position: relative; overflow: auto; box-shadow: rgba(15, 23, 42, 0.2) 0px 28px 70px, rgba(15, 23, 42, 0.08) 0px 3px 14px; }
.showroom-modal__header { border-bottom: 1px solid color-mix(in srgb, var(--showroom-slate) 16%, #e7e5e4); justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1.15rem; padding-bottom: 0.85rem; display: flex; }
.showroom-modal__eyebrow { letter-spacing: 0.18em; text-transform: uppercase; color: rgb(100, 116, 139); margin: 0px; font-size: 11px; }
.showroom-modal__title { font-family: var(--font-display); color: var(--luxury-ink); margin: 0.35rem 0px 0px; font-size: clamp(1.3rem, 2.4vw, 2rem); }
.showroom-modal__lede { max-width: 36rem; font-family: var(--font-luxury-serif), ui-serif, Georgia, serif; color: color-mix(in srgb, var(--showroom-slate) 88%, transparent); letter-spacing: 0.01em; text-transform: none; margin: 0.65rem 0px 0px; font-size: 0.95rem; font-weight: 500; line-height: 1.55; }
.showroom-modal__lede strong { color: var(--ultra-matte-black); font-weight: 600; }
.showroom-modal__close { border: 1.5px solid color-mix(in srgb, var(--ultra-matte-black) 55%, #94a3b8); background: color-mix(in srgb, #fff 92%, var(--luxury-cream)); cursor: pointer; width: 2.55rem; height: 2.55rem; color: var(--ultra-matte-black); border-radius: 0.55rem; flex-shrink: 0; justify-content: center; align-items: center; transition: background-color 0.15s, border-color 0.15s, box-shadow 0.15s; display: inline-flex; box-shadow: rgba(255, 255, 255, 0.75) 0px 1px inset, rgba(15, 23, 42, 0.12) 0px 2px 8px; }
.showroom-modal__close:hover, .showroom-modal__close:focus-visible { border-color: var(--ultra-matte-black); background: rgb(255, 255, 255); outline: none; box-shadow: rgba(255, 255, 255, 0.9) 0px 1px inset, rgba(15, 23, 42, 0.18) 0px 4px 14px; }
.showroom-modal__close svg { stroke: currentcolor; stroke-width: 2.25px; }
.showroom-modal__grid { grid-template-columns: 1fr; gap: 0.9rem; display: grid; }
.showroom-modal__grid > .showroom-modal__contact-sheet { grid-column: 1 / -1; }
.showroom-modal__contact-sheet { grid-template-columns: 1fr; gap: 0.9rem 1rem; display: grid; }
.showroom-modal__contact-sheet > .showroom-modal__contact-field { margin: 0px; }
.showroom-modal__grid label, .showroom-modal__notes { letter-spacing: 0.08em; text-transform: uppercase; color: rgb(47, 61, 81); flex-direction: column; gap: 0.42rem; font-size: 0.8125rem; font-weight: 600; display: flex; }
.showroom-modal input, .showroom-modal select, .showroom-modal textarea { border: 1px solid color-mix(in srgb, var(--showroom-slate) 20%, #d6d3d1); color: rgb(15, 23, 42); background: rgba(255, 255, 255, 0.94); border-radius: 0.72rem; padding: 0.74rem 0.82rem; font-size: 0.99rem; line-height: 1.35; transition: border-color 0.18s, box-shadow 0.18s, background-color 0.18s; box-shadow: rgba(255, 255, 255, 0.82) 0px 1px inset; }
.showroom-modal input::placeholder, .showroom-modal textarea::placeholder { color: rgb(113, 129, 152); }
.showroom-modal input:focus-visible, .showroom-modal select:focus-visible, .showroom-modal textarea:focus-visible { border-color: color-mix(in srgb, var(--showroom-slate) 42%, #8b96a8); background: rgb(255, 255, 255); outline: none; box-shadow: rgba(217, 225, 238, 0.75) 0px 0px 0px 3px; }
.showroom-modal__fieldset { border: 1px solid color-mix(in srgb, var(--showroom-slate) 14%, #e7e5e4); background: rgba(255, 255, 255, 0.55); border-radius: 0.95rem; margin: 1.15rem 0px 0px; padding: 0.8rem; }
.showroom-modal__fieldset legend { letter-spacing: 0.12em; text-transform: uppercase; color: rgb(71, 85, 105); padding: 0px 0.45rem; font-size: 0.72rem; }
.showroom-modal__chips { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 0.56rem; display: grid; }
.showroom-modal__chip { border: 1px solid color-mix(in srgb, var(--showroom-slate) 12%, #e7e5e4); text-transform: none; letter-spacing: 0.01em; background: rgb(250, 250, 249); border-radius: 0.7rem; align-items: center; gap: 0.52rem; padding: 0.5rem 0.55rem; font-size: 0.82rem; transition: border-color 0.16s, background-color 0.16s, transform 0.16s; display: flex; }
.showroom-modal__chip:has(input:checked) { background: rgb(246, 244, 239); border-color: rgb(152, 156, 162); }
.showroom-modal__chip:hover { transform: translateY(-1px); }
.showroom-modal__chip input[type="checkbox"] { accent-color: rgb(51, 65, 85); block-size: 1rem; inline-size: 1rem; }
.showroom-modal__notes { margin-top: 1.05rem; }
.showroom-modal__notes-hint { letter-spacing: 0.04em; text-transform: none; color: rgb(90, 105, 127); font-weight: 500; }
.showroom-modal__submit { letter-spacing: 0.16em; text-transform: uppercase; color: var(--luxury-ink); background: linear-gradient(rgb(255, 255, 255) 0%, rgb(248, 247, 244) 100%); border: 1px solid rgba(31, 41, 55, 0.56); border-radius: 999px; margin-top: 1.05rem; padding: 0.8rem 1.5rem; font-size: 11.5px; font-weight: 700; transition: background-color 0.22s, transform 0.22s, box-shadow 0.22s; }
.showroom-modal__submit:hover { background: linear-gradient(rgb(243, 232, 203) 0%, rgb(236, 221, 188) 100%); transform: translateY(-1px); box-shadow: rgba(31, 41, 55, 0.16) 0px 8px 22px; }
.showroom-modal__submit:disabled { opacity: 0.62; cursor: not-allowed; box-shadow: none; transform: none; }
.showroom-modal__error { color: rgb(185, 28, 28); margin: 0.8rem 0px 0px; font-size: 0.82rem; }
.showroom-modal__success { gap: 0.8rem; display: grid; }
@media (min-width: 768px){.showroom-modal__panel { padding: 1.3rem 1.4rem; }.showroom-modal__grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }.showroom-modal__grid label.showroom-modal__grid-span-2, .showroom-modal__grid fieldset.showroom-modal__grid-span-2 { grid-column: 1 / -1; }.showroom-modal__contact-sheet { grid-template-columns: repeat(2, minmax(0px, 1fr)); }.showroom-modal__contact-sheet > .showroom-modal__contact-field--phone, .showroom-modal__contact-sheet > .showroom-modal__contact-field--visit { grid-column: 1 / -1; }.showroom-modal__chips { grid-template-columns: repeat(3, minmax(0px, 1fr)); }}
@media (min-width: 1024px){.showroom-modal__contact-sheet { grid-template-columns: repeat(6, minmax(0px, 1fr)); }.showroom-modal__contact-sheet > .showroom-modal__contact-field--name, .showroom-modal__contact-sheet > .showroom-modal__contact-field--email, .showroom-modal__contact-sheet > .showroom-modal__contact-field--phone { grid-column: span 2; }.showroom-modal__contact-sheet > .showroom-modal__contact-field--visit { grid-column: 1 / -1; }.showroom-modal__contact-sheet > .showroom-modal__contact-field--reach, .showroom-modal__contact-sheet > .showroom-modal__contact-field--role { grid-column: span 3; }}