/* mipaginaweb — Quickly Energy. Estilos originales del HTML prefijados con .qke para que el tema no los altere. */
.qke { --color-primary: #0F9B90; --color-secondary: #32394B; --color-gray-light: #F0F0F0; --color-gray-med: #EBEBEB; --color-border: #CCCCCC; --color-primary-dark: #0b7a71; --color-white: #FFFFFF; --font-title: 'Barlow Condensed', sans-serif; --font-text: 'Roboto', sans-serif; --border-radius: 8px; }
.qke * { margin: 0; padding: 0; box-sizing: border-box; scroll-behavior: smooth; }
.qke { font-family: var(--font-text); color: var(--color-secondary); background-color: var(--color-white); line-height: 1.6; overflow-x: clip; font-size: 16px; text-align: left; }
.qke h1,
.qke h2,
.qke h3,
.qke h4,
.qke h5,
.qke h6 { font-family: var(--font-title); font-weight: 800; text-transform: uppercase; line-height: 1.1; }
.qke a { text-decoration: none; color: inherit; transition: 0.3s; }
.qke ul { list-style: none; }
.qke img { max-width: 100%; height: auto; display: block; }
.qke .container { width: 90%; max-width: 1200px; margin: 0 auto; padding: 0 15px; }
.qke .btn { display: inline-block; padding: 12px 30px; background-color: var(--color-primary); color: var(--color-white); font-family: var(--font-title); font-size: 1.2rem; border: none; border-radius: var(--border-radius); cursor: pointer; transition: background 0.3s, transform 0.2s; text-transform: uppercase; }
.qke .btn:hover { background-color: var(--color-primary-dark); transform: translateY(-2px); }
.qke .section-padding { padding: 80px 0; }
.qke .section-title { text-align: center; font-size: 2.8rem; color: var(--color-primary); margin-bottom: 20px; }
.qke .section-subtitle { text-align: center; font-family: var(--font-text); font-weight: 700; font-size: 1.1rem; color: var(--color-secondary); margin-bottom: 50px; max-width: 800px; margin-left: auto; margin-right: auto; }
.qke .top-bar { background-color: var(--color-secondary); color: var(--color-white); padding: 8px 0; font-size: 0.9rem; }
.qke .top-bar .container { display: flex; justify-content: space-between; align-items: center; }
.qke .top-bar-info { display: flex; gap: 20px; }
.qke .top-bar-info a { display: flex; align-items: center; gap: 8px; color: var(--color-gray-light); }
.qke .top-bar-info a:hover { color: var(--color-primary); }
.qke .top-bar-social { display: flex; gap: 15px; }
.qke .top-bar-social a { color: var(--color-white); }
.qke .top-bar-social a:hover { color: var(--color-primary); }
.qke header { background-color: var(--color-white); box-shadow: 0 2px 10px rgba(0,0,0,0.1); position: sticky; top: 0; z-index: 1000; }
.qke .header-content { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; }
.qke .logo { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.qke .logo-text { font-family: var(--font-title); font-size: 2rem; color: var(--color-secondary); display: flex; flex-direction: column; line-height: 0.8; }
.qke .logo-text .l1 { color: var(--color-primary); }
.qke .logo-text .l2 { color: inherit; }
.qke nav ul { display: flex; gap: 25px; align-items: center; }
.qke nav a { font-family: var(--font-text); font-weight: 700; font-size: 1rem; color: var(--color-secondary); text-transform: uppercase; }
.qke nav a:hover { color: var(--color-primary); }
.qke .nav-phone-btn { background-color: var(--color-primary); color: var(--color-white) !important; padding: 8px 18px; border-radius: var(--border-radius); display: flex; align-items: center; gap: 8px; font-weight: 700; transition: background 0.3s; }
.qke .nav-phone-btn:hover { background-color: var(--color-primary-dark); color: var(--color-white) !important; }
.qke .menu-toggle { display: none; cursor: pointer; color: var(--color-secondary); background: none; border: 0; padding: 4px; line-height: 0; }
.qke .hero { height: 85vh; background-color: var(--color-secondary); display: flex; align-items: center; justify-content: center; text-align: center; color: var(--color-white); padding: 0 20px; }
.qke .hero-content { max-width: 900px; position: relative; z-index: 2; }
.qke .hero h1 { font-size: 4.5rem; margin-bottom: 20px; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); }
.qke .hero p { font-size: 1.3rem; margin-bottom: 30px; font-weight: 400; }
.qke .intro { background-color: var(--color-gray-light); text-align: center; }
.qke .intro h2 { font-size: 2.5rem; color: var(--color-secondary); margin-bottom: 20px; }
.qke .intro p { font-size: 1.1rem; max-width: 800px; margin: 0 auto; color: #555; }
.qke .about-section { background-color: var(--color-white); }
.qke .about-layout { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: 40px; align-items: stretch; }
.qke .about-header-text { grid-column: 1 / -1; margin-bottom: 20px; text-align: center; }
.qke .about-header-text h3 { font-size: 2.5rem; color: var(--color-primary); margin-bottom: 20px; }
.qke .about-header-text p { font-size: 1.1rem; color: #444; max-width: 900px; margin: 0 auto; }
.qke .about-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: stretch; }
.qke .mv-card { background-color: var(--color-gray-light); padding: 25px; border-radius: var(--border-radius); border: 1px solid var(--color-border); display: flex; flex-direction: column; justify-content: center; text-align: center; }
.qke .mv-card h4 { color: var(--color-primary); font-size: 1.5rem; margin-bottom: 15px; }
.qke .mv-card p { font-size: 0.95rem; color: #555; }
.qke .about-image { height: 100%; display: flex; align-items: center; justify-content: center; }
.qke .about-image img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--border-radius); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.qke .services { background-color: var(--color-gray-light); }
.qke .services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.qke .service-card { background-color: var(--color-gray-light); padding: 25px; border-radius: var(--border-radius); border: 1px solid var(--color-border); transition: transform 0.3s; text-align: center; }
.qke .service-card:hover { transform: translateY(-5px); box-shadow: 0 5px 15px rgba(0,0,0,0.1); }
.qke .service-card .ico-box { display: flex; justify-content: center; color: var(--color-primary); margin-bottom: 15px; }
.qke .service-card .ico { width: 32px; height: 32px; }
.qke .service-card h4 { font-size: 1.4rem; margin-bottom: 10px; color: var(--color-secondary); }
.qke .service-card p { font-size: 0.95rem; color: #555; }
.qke .parts-general { background-color: var(--color-white); }
.qke .parts-general .section-title { color: var(--color-primary); }
.qke .brands-grid { display: flex; flex-wrap: nowrap; justify-content: center; gap: 15px; margin-bottom: 40px; overflow-x: auto; padding-bottom: 10px; }
.qke .brand-item { background-color: var(--color-white); border: 1px solid var(--color-border); padding: 15px 20px; border-radius: var(--border-radius); display: flex; align-items: center; justify-content: center; height: 80px; font-family: var(--font-title); font-size: 1.2rem; color: var(--color-secondary); font-weight: 800; flex-shrink: 0; min-width: 120px; }
.qke .parts-list-general { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; text-align: center; }
.qke .parts-list-general div { background-color: var(--color-gray-light); padding: 12px; border-radius: var(--border-radius); font-family: var(--font-text); font-weight: 700; color: var(--color-secondary); }
.qke .parts-motor { background-color: var(--color-secondary); color: var(--color-white); }
.qke .parts-motor .section-title { color: var(--color-white); }
.qke .parts-motor .section-subtitle { color: var(--color-gray-light); }
.qke .parts-list-motor { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; text-align: center; }
.qke .parts-list-motor div { background-color: rgba(255,255,255,0.1); padding: 12px; border-radius: var(--border-radius); font-family: var(--font-text); font-weight: 700; color: var(--color-white); }
.qke .gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
.qke .gallery-item { background-color: var(--color-white); border-radius: var(--border-radius); overflow: hidden; border: 1px solid var(--color-border); }
.qke .gallery-item img { width: 100%; height: 200px; object-fit: cover; }
.qke .gallery-caption { padding: 15px; text-align: center; font-family: var(--font-text); font-weight: 700; font-size: 0.9rem; color: var(--color-secondary); }
.qke .contact { background-color: var(--color-gray-light); }
.qke .contact-container { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; background-color: var(--color-white); padding: 40px; border-radius: var(--border-radius); border: 1px solid var(--color-border); overflow: hidden; }
.qke .contact-info h3 { font-size: 2rem; color: var(--color-primary); margin-bottom: 20px; text-align: center; }
.qke .contact-info p { margin-bottom: 15px; display: flex; align-items: center; gap: 10px; justify-content: center; }
.qke .contact-info p > .ico, .qke .contact-info p > .qke-ico-img { color: var(--color-primary); width: 20px; height: 20px; flex-shrink: 0; }
.qke .contact-form .form-group { margin-bottom: 20px; }
.qke .contact-form input,
.qke .contact-form textarea { width: 100%; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--border-radius); font-family: var(--font-text); font-size: 1rem; }
.qke .contact-form textarea { height: 120px; resize: vertical; }
.qke .contact-form button { width: 100%; font-family: var(--font-title); }
.qke footer { background-color: var(--color-secondary); color: var(--color-white); padding: 60px 0 20px; }
.qke .footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 40px; margin-bottom: 40px; }
.qke .footer-col h4 { font-size: 1.5rem; color: var(--color-primary); margin-bottom: 20px; }
.qke .footer-logo { display: flex; flex-direction: column; font-family: var(--font-title); font-size: 2rem; line-height: 0.8; margin-bottom: 20px; }
.qke .footer-logo .l1 { color: var(--color-primary); }
.qke .footer-logo .l2 { color: inherit; }
.qke .footer-col p,
.qke .footer-col ul li { margin-bottom: 10px; color: var(--color-gray-light); font-size: 0.95rem; }
.qke .footer-col ul li a:hover { color: var(--color-primary); }
.qke .footer-social { display: flex; gap: 15px; margin-top: 15px; }
.qke .footer-social a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background-color: rgba(255,255,255,0.1); border-radius: 50%; color: var(--color-white); }
.qke .footer-social a:hover { background-color: var(--color-primary); }
.qke .footer-bottom { text-align: center; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 20px; font-size: 0.9rem; color: #aaa; }
@media (max-width: 992px) {
.qke .about-layout { grid-template-columns: 1fr; }
.qke .about-cards { grid-template-columns: 1fr; }
.qke .contact-container { grid-template-columns: 1fr; }
.qke .parts-list-general,
.qke .parts-list-motor { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
.qke .top-bar { display: none; }
.qke .menu-toggle { display: block; }
.qke nav ul { display: none; flex-direction: column; position: absolute; top: 100%; left: 0; width: 100%; background-color: var(--color-white); padding: 20px; box-shadow: 0 5px 10px rgba(0,0,0,0.1); gap: 15px; }
.qke nav ul.active { display: flex; }
.qke .hero h1 { font-size: 3rem; }
.qke .hero p { font-size: 1rem; }
.qke .section-title { font-size: 2.2rem; }
.qke .brands-grid { justify-content: flex-start; }
.qke .container { width: 100%; padding: 0 10px; }
.qke .contact-container { padding: 20px 15px; gap: 20px; }
.qke .contact-info h3 { font-size: 1.8rem; }
.qke .contact-form .form-group { margin-bottom: 20px; }
.qke .contact-form input,
.qke .contact-form textarea { padding: 15px; font-size: 1rem; }
.qke .contact-form button { padding: 15px; font-size: 1.2rem; }
.qke .service-card,
.qke .mv-card,
.qke .brand-item { padding: 15px; }
}

/* =========================================
   AÑADIDOS DEL PLUGIN (no cambian el diseño original)
   ========================================= */
body.qke-fullpage { margin: 0; padding: 0; background: #fff; }
.qke .ico { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; display: block; flex-shrink: 0; }
.qke .ico.is-fill { fill: currentColor; stroke: none; }
.qke img.qke-ico-img { object-fit: contain; display: block; max-width: none; }
.qke img.qke-logo-img { width: auto; max-width: 100%; object-fit: contain; flex: none; }
/* El pie es una columna flex: sin esto la imagen se estiraba a todo el ancho y se deformaba. */
.qke .footer-logo { align-items: flex-start; }
.qke .footer-logo img.qke-logo-img { width: auto; height: auto; align-self: flex-start; }
.qke .brand-item img.qke-brand-img { width: auto; max-width: 160px; object-fit: contain; }
.qke button { font-family: inherit; }

/* Iconos en barra superior, redes y pie (antes Font Awesome) */
.qke .top-bar-info .ico, .qke .top-bar-info .qke-ico-img { width: 16px; height: 16px; }
.qke .top-bar-item { display: flex; align-items: center; gap: 8px; color: var(--color-gray-light); }
.qke .top-bar-social { align-items: center; }
.qke .top-bar-social a { display: flex; align-items: center; }
.qke .top-bar-social .ico, .qke .top-bar-social .qke-ico-img { width: 16px; height: 16px; }
.qke .nav-phone-btn .ico, .qke .nav-phone-btn .qke-ico-img { width: 16px; height: 16px; }
.qke .footer-social .ico, .qke .footer-social .qke-ico-img { width: 18px; height: 18px; }
.qke .footer-col p .ico, .qke .footer-col p .qke-ico-img { display: inline-block; width: 16px; height: 16px; vertical-align: -3px; margin-right: 6px; }
.qke .contact-info .footer-social { margin-top: 20px; justify-content: center; }
.qke .contact-info .footer-social a { background-color: var(--color-primary); }
.qke .footer-bottom p { margin: 0; }
.qke .qke-pp + .qke-pp { margin-top: 1em; }

/* Quiénes somos sin imagen */
.qke .about-layout.is-solo .about-cards { grid-column: 1 / -1; }

/* Contacto sin formulario */
.qke .contact-container.is-solo { grid-template-columns: 1fr; }
.qke .contact-form .form-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.qke .contact-form .form-msg { display: none; margin-top: 14px; padding: 12px 16px; border-radius: var(--border-radius); font-size: 14px; text-align: center; }
.qke .contact-form .form-msg.is-ok { display: block; background: #e6f6f4; color: #0b6b63; }
.qke .contact-form .form-msg.is-err { display: block; background: #fdecec; color: #a12626; }
.qke .contact-form .btn[disabled] { opacity: .7; cursor: wait; transform: none; }

/* Espaciado superior / inferior definido por bloque (en móvil se reduce al 70 %) */
.qke .qke-block.has-pt { padding-top: var(--qke-pt); }
.qke .qke-block.has-pb { padding-bottom: var(--qke-pb); }
@media (max-width: 768px) {
  .qke .qke-block.has-pt { padding-top: calc(var(--qke-pt) * .7); }
  .qke .qke-block.has-pb { padding-bottom: calc(var(--qke-pb) * .7); }
}

/* Parallax (cualquier bloque) */
.qke .qke-par { position: relative; overflow: hidden; }
.qke .qke-par-bg { position: absolute; left: 0; right: 0; top: -20%; height: 140%; background-size: cover; background-position: center; z-index: 0; will-change: transform; pointer-events: none; }
.qke .qke-par::before { content: ""; position: absolute; inset: 0; background: var(--par-ov, rgba(50, 57, 75, .7)); z-index: 1; }
.qke .qke-par > .container, .qke .qke-par > .hero-content { position: relative; z-index: 2; }
.qke .qke-on-dark h2, .qke .qke-on-dark .about-header-text h3, .qke .qke-on-dark .section-title { color: #fff; }
.qke .qke-on-dark .section-subtitle, .qke .qke-on-dark .intro p, .qke .qke-on-dark .about-header-text p, .qke .qke-on-dark .tpl-text p, .qke .qke-on-dark .tpl-eyebrow, .qke .qke-on-dark .tpl-body p, .qke .qke-on-dark .gallery-caption { color: var(--color-gray-light); }

/* Plantillas nuevas, con el mismo lenguaje visual */
.qke .cta-banner { background-color: var(--color-primary); color: var(--color-white); text-align: center; }
.qke .cta-banner h2 { font-size: 2.5rem; margin-bottom: 15px; }
.qke .cta-banner p { font-size: 1.2rem; margin: 0 auto 25px; max-width: 800px; }
.qke .btn-light { background-color: var(--color-white); color: var(--color-primary); }
.qke .btn-light:hover { background-color: var(--color-gray-light); color: var(--color-primary); }
.qke .tpl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.qke .tpl-grid.is-rev .tpl-img { order: -1; }
.qke .tpl-grid.is-solo { grid-template-columns: 1fr; }
.qke .tpl-text h2 { font-size: 2.5rem; color: var(--color-primary); margin-bottom: 20px; }
.qke .tpl-text p { font-size: 1.1rem; color: #444; }
.qke .tpl-eyebrow { display: block; font-family: var(--font-text); font-weight: 700; text-transform: uppercase; letter-spacing: 2px; font-size: .9rem; color: var(--color-secondary); margin-bottom: 10px; }
.qke .tpl-img img { width: 100%; height: auto; border-radius: var(--border-radius); box-shadow: 0 10px 20px rgba(0,0,0,.1); }
.qke .tpl-btn { margin-top: 20px; }
.qke .tpl-body { max-width: 800px; margin: 0 auto; text-align: center; }
.qke .tpl-body p { font-size: 1.1rem; color: #444; }
.qke .services-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.qke .services-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.qke .services-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
.qke .tpl-dark { background-color: var(--color-secondary); color: var(--color-white); }
.qke .tpl-dark .section-title { color: var(--color-white); }
.qke .tpl-dark .section-subtitle { color: var(--color-gray-light); }
.qke .tpl-dark .service-card { background-color: rgba(255,255,255,.1); border-color: rgba(255,255,255,.2); }
.qke .tpl-dark .service-card h4 { color: var(--color-white); }
.qke .tpl-dark .service-card p { color: var(--color-gray-light); }
.qke .tpl-dark .service-card .ico-box { color: var(--color-white); }

/* =========================================
   BOTONES FLOTANTES (volver arriba + WhatsApp debajo)
   ========================================= */
.qke .floating-buttons { position: fixed; right: 30px; bottom: 30px; z-index: 999; display: flex; flex-direction: column; align-items: center; gap: 10px; pointer-events: none; }
.qke .floating-buttons > * { pointer-events: auto; }
.qke .float-btn { display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 0; padding: 0; color: var(--color-white); cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.3); transition: transform 0.3s, background 0.3s, opacity 0.3s, visibility 0.3s; }
.qke .float-btn:hover { transform: scale(1.1); }
.qke .scroll-top-btn { width: var(--btn-top-size, 60px); height: var(--btn-top-size, 60px); background-color: var(--btn-top-color, var(--color-primary)); opacity: 0; visibility: hidden; }
.qke .scroll-top-btn.is-visible { opacity: 1; visibility: visible; }
.qke .whatsapp-btn { width: var(--btn-wa-size, 60px); height: var(--btn-wa-size, 60px); background-color: var(--btn-wa-color, #25D366); }
.qke .scroll-top-btn .ico { width: calc(var(--btn-top-size, 60px) * .4); height: calc(var(--btn-top-size, 60px) * .4); }
.qke .whatsapp-btn .ico { width: calc(var(--btn-wa-size, 60px) * .5); height: calc(var(--btn-wa-size, 60px) * .5); }

/* =========================================
   MODAL WHATSAPP
   ========================================= */
.qke .modal { display: none; position: fixed; z-index: 2000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); align-items: center; justify-content: center; }
.qke .modal.is-open { display: flex; }
.qke .modal-content { background-color: var(--color-white); padding: 30px; border-radius: var(--border-radius); width: 90%; max-width: 400px; text-align: center; position: relative; }
.qke .modal-content h3 { color: var(--color-primary); margin-bottom: 15px; font-size: 1.8rem; }
.qke .modal-content p { margin-bottom: 12px; }
.qke .modal-content textarea { width: 100%; height: 100px; padding: 10px; border: 1px solid var(--color-border); border-radius: var(--border-radius); margin-bottom: 20px; font-family: var(--font-text); font-size: 1rem; resize: none; }
.qke .close-modal { position: absolute; top: 10px; right: 15px; font-size: 1.5rem; line-height: 1; cursor: pointer; color: var(--color-secondary); background: none; border: 0; padding: 4px; }

/* Barra de administración de WordPress (cuando hay sesión iniciada) */
body.admin-bar .qke header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .qke header { top: 46px; } }

/* Responsivo de las plantillas nuevas */
@media (max-width: 992px) {
  .qke .tpl-grid { grid-template-columns: 1fr; }
  .qke .tpl-grid.is-rev .tpl-img { order: 0; }
  .qke .services-grid.cols-3, .qke .services-grid.cols-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .qke .services-grid.cols-2, .qke .services-grid.cols-3, .qke .services-grid.cols-4 { grid-template-columns: 1fr; }
  .qke .cta-banner h2 { font-size: 2rem; }
  .qke .tpl-text h2 { font-size: 2rem; }
}
@media (prefers-reduced-motion: reduce) { .qke .float-btn, .qke .btn { transition: none; } }