/* GSJ Cotizaciones */

/* Encabezado: Llamar + Cotizar */
.gsj-hcta { display: flex; align-items: center; gap: 14px; margin-left: 22px; flex: 0 0 auto; }
.gsj-hcta a { text-decoration: none !important; font-family: var(--gsj-head, 'Barlow Condensed', Arial, sans-serif); font-weight: 700; letter-spacing: .04em; line-height: 1; }
.gsj-hcta__tel { display: inline-flex; align-items: center; gap: 7px; color: var(--gsj-navy, #121a52) !important; font-size: 1.15rem; min-height: 44px; }
.gsj-hcta__tel svg { width: 18px; height: 18px; }
.gsj-hcta__tel:hover { color: var(--gsj-blue, #2a8fe3) !important; }
.gsj-hcta__btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 10px; background: var(--gsj-yellow, #f5b800); color: var(--gsj-navy-2, #0b1138) !important; text-transform: uppercase; font-size: 1.05rem; transition: background .15s, transform .15s; }
.gsj-hcta__btn:hover { background: #ffc928; transform: translateY(-1px); }
@media (max-width: 1100px) { .gsj-hcta__tel span { display: none; } }
@media (max-width: 781px) { .gsj-hcta { display: none; } }

/* Barra fija en celular */
.gsj-mbar { display: none; }
@media (max-width: 781px) {
	.gsj-mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--gsj-line, #e3e6ee); box-shadow: 0 -10px 24px -18px rgba(18, 26, 82, .5); }
	.gsj-mbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 54px; border: 1.5px solid var(--gsj-navy, #121a52); border-radius: 10px; color: var(--gsj-navy, #121a52) !important; text-decoration: none !important; font-family: var(--gsj-head, 'Barlow Condensed', Arial, sans-serif); font-weight: 700; font-size: 1rem; letter-spacing: .04em; text-transform: uppercase; }
	.gsj-mbar a svg { width: 20px; height: 20px; }
	.gsj-mbar a.gsj-mbar__cta { background: var(--gsj-yellow, #f5b800); border-color: var(--gsj-yellow, #f5b800); color: var(--gsj-navy-2, #0b1138) !important; }
	body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
	.gsj-fab { display: none !important; }
}

/* Formulario */
.gsj-form .gsj-req { color: #b42318; }
.gsj-form .gsj-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.gsj-form--v2 { position: relative; }
.gsj-form--v2 button[type="submit"] { width: 100%; }
.gsj-form--v2 button[type="submit"] + button[type="submit"] { margin-top: 10px; }
.gsj-form--v2 button[disabled] { opacity: .7; cursor: progress; transform: none; }
.gsj-form--v2 small strong { color: var(--gsj-navy, #121a52); }
.gsj-fmsg { display: none; margin: 0 0 12px; padding: 10px 14px; border-radius: 9px; background: #fef3f2; border: 1px solid #fecdca; color: #912018; font-weight: 600; font-size: .95rem; }
.gsj-fmsg.is-on { display: block; }

.gsj-ok { text-align: center; padding: 18px 4px; }
.gsj-ok__ico { width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%; background: var(--gsj-yellow, #f5b800); color: var(--gsj-navy-2, #0b1138); display: grid; place-items: center; }
.gsj-ok__ico svg { width: 32px; height: 32px; }
.gsj-ok h3 { margin: 0 0 6px; }
.gsj-ok p { margin: 0 0 10px; color: var(--gsj-ink, #1b2033); }
.gsj-ok__folio { font-family: var(--gsj-head, 'Barlow Condensed', Arial, sans-serif); font-size: 1.35rem; letter-spacing: .04em; color: var(--gsj-navy, #121a52) !important; }
.gsj-ok__hor { color: var(--gsj-muted, #5b6275) !important; font-size: .95rem; }
.gsj-ok .gsj-btn { margin-top: 8px; }

/* Contacto */
.gsj-citem .gsj-tel-link { margin-top: 2px; }
.gsj-citem--hor .gsj-hor-txt { color: var(--gsj-ink, #1b2033) !important; font-weight: 600; }

/* Servicios */
.gsj-scta { margin-top: 26px; }

/* ================= Páginas de grúa 24 horas ================= */
.gsj-lph { position: relative; background: var(--gsj-navy-2, #0b1138) center / cover no-repeat; color: #fff; }
.gsj-lph::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(11,17,56,.94) 0%, rgba(11,17,56,.82) 45%, rgba(11,17,56,.35) 100%); }
.gsj-lph .gsj-wrap { position: relative; z-index: 1; padding-top: 56px; padding-bottom: 56px; }
.gsj-lph__in { max-width: 680px; }
.gsj-lph .gsj-kicker { color: var(--gsj-yellow, #f5b800); }
.gsj-lph h1 { font-family: var(--gsj-head); font-weight: 800; font-size: clamp(2.4rem, 6vw, 4.2rem); line-height: .98; text-transform: uppercase; margin: 10px 0 16px; color: #fff; }
.gsj-lph__sub { font-size: 1.2rem; line-height: 1.5; color: #dfe4f5; margin: 0 0 22px; }
.gsj-price { display: inline-flex; align-items: baseline; gap: 10px; background: var(--gsj-yellow, #f5b800); color: var(--gsj-navy-2, #0b1138); border-radius: 10px; padding: 8px 16px; margin: 0 0 22px; font-family: var(--gsj-head); font-weight: 800; text-transform: uppercase; letter-spacing: .03em; }
.gsj-price b { font-size: 2rem; line-height: 1; white-space: nowrap; }
.gsj-price span { font-size: 1rem; }
.gsj-lph .gsj-btns { margin-bottom: 22px; }
.gsj-btn--call { background: var(--gsj-yellow, #f5b800); color: var(--gsj-navy-2, #0b1138) !important; font-size: 1.35rem; padding: 18px 30px; }
.gsj-btn--call:hover { background: #ffc928; }
.gsj-btn--wa { background: #1fa855; color: #fff !important; }
.gsj-btn--wa:hover { background: #18914a; }
.gsj-proof { display: flex; flex-wrap: wrap; gap: 10px 22px; list-style: none; margin: 0; padding: 0; color: #fff; font-weight: 600; }
.gsj-proof li { display: inline-flex; align-items: center; gap: 8px; }
.gsj-proof svg { width: 20px; height: 20px; color: var(--gsj-yellow, #f5b800); flex: none; }

.gsj-vcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.gsj-vcard { background: #fff; border: 1px solid var(--gsj-line, #e3e6ee); border-radius: var(--gsj-radius, 14px); padding: 24px; }
.gsj-vcard h3 { font-family: var(--gsj-head); font-size: 1.45rem; text-transform: uppercase; color: var(--gsj-navy, #121a52); margin: 0 0 8px; }
.gsj-vcard p { margin: 0; color: var(--gsj-muted, #5b6275); }

.gsj-pricebox { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 24px; align-items: center; background: var(--gsj-navy, #121a52); color: #fff; border-radius: var(--gsj-radius, 14px); padding: 30px; }
.gsj-pricebox__n { font-family: var(--gsj-head); font-weight: 800; font-size: 3.4rem; line-height: 1; color: var(--gsj-yellow, #f5b800); }
.gsj-pricebox__n small { display: block; font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; color: #dfe4f5; }
.gsj-pricebox p { margin: 0 0 6px; color: #dfe4f5; }
.gsj-pricebox strong { color: #fff; }

.gsj-why { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.gsj-why div { border-top: 3px solid var(--gsj-yellow, #f5b800); padding-top: 14px; }
.gsj-why b { display: block; font-family: var(--gsj-head); font-size: 2rem; color: var(--gsj-navy, #121a52); line-height: 1.05; }
.gsj-why span { color: var(--gsj-muted, #5b6275); }

.gsj-insure { display: flex; gap: 16px; align-items: flex-start; background: #fff8e1; border: 1px solid #f5d77a; border-radius: var(--gsj-radius, 14px); padding: 20px 22px; }
.gsj-insure svg { width: 28px; height: 28px; flex: none; color: #8a6200; }
.gsj-insure p { margin: 0; color: var(--gsj-ink, #1b2033); }

.gsj-faq details { border-bottom: 1px solid var(--gsj-line, #e3e6ee); padding: 4px 0; }
.gsj-faq summary { cursor: pointer; list-style: none; padding: 16px 36px 16px 0; position: relative; font-weight: 700; font-size: 1.1rem; color: var(--gsj-navy, #121a52); }
.gsj-faq summary::-webkit-details-marker { display: none; }
.gsj-faq summary::after { content: "+"; position: absolute; right: 6px; top: 12px; font-size: 1.6rem; color: var(--gsj-blue, #2a8fe3); }
.gsj-faq details[open] summary::after { content: "–"; }
.gsj-faq p { margin: 0 0 16px; color: var(--gsj-muted, #5b6275); }

.gsj-lp-other { text-align: center; margin-top: 18px; }
.gsj-lp-other a { font-weight: 700; color: var(--gsj-navy, #121a52); }

@media (max-width: 1024px) { .gsj-why { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 820px) { .gsj-vcards { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
	.gsj-lph .gsj-wrap { padding-top: 36px; padding-bottom: 36px; }
	.gsj-lph::before { background: rgba(11,17,56,.86); }
	.gsj-pricebox { grid-template-columns: 1fr; }
	.gsj-why { grid-template-columns: 1fr 1fr; }
}

/* En estas páginas la barra de celular destaca Llamar */
@media (max-width: 781px) {
	.gsj-lp .gsj-mbar a:first-child { background: var(--gsj-yellow, #f5b800); border-color: var(--gsj-yellow, #f5b800); color: var(--gsj-navy-2, #0b1138) !important; }
	.gsj-lp .gsj-mbar a.gsj-mbar__cta { background: #fff; border-color: var(--gsj-navy, #121a52); color: var(--gsj-navy, #121a52) !important; }
}
