/* ============================================================ AGPOL - Landing Grupos de Presión Archivo: /themes/TU_TEMA/css/agpol-grupos-presion.css Enlazar en el del layout o desde el back-office: Módulos > Cabecera HTML > añadir ============================================================ */ /* Reset mínimo para la sección */ .agpol-gp * { box-sizing: border-box; } /* ---- HERO ---- */ .agpol-gp .agp-hero { background: #1a4f8a; color: #fff; padding: 56px 32px; text-align: center; } .agpol-gp .agp-hero h1 { font-size: 28px; font-weight: 700; line-height: 1.3; margin-bottom: 14px; color: #fff; } .agpol-gp .agp-hero p { font-size: 16px; opacity: .9; max-width: 620px; margin: 0 auto 30px; } .agpol-gp .agp-hero-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; } .agpol-gp .agp-btn-primary { background: #f5a623; color: #fff; padding: 13px 30px; border-radius: 4px; font-weight: 700; font-size: 15px; text-decoration: none; display: inline-block; transition: background .2s; } .agpol-gp .agp-btn-primary:hover { background: #d98f1a; } .agpol-gp .agp-btn-secondary { background: transparent; color: #fff; border: 2px solid #fff; padding: 11px 28px; border-radius: 4px; font-weight: 700; font-size: 15px; text-decoration: none; display: inline-block; transition: background .2s; } .agpol-gp .agp-btn-secondary:hover { background: rgba(255,255,255,.1); } /* ---- BARRA DE CONFIANZA ---- */ .agpol-gp .agp-trust { background: #f2f5f9; display: flex; justify-content: center; flex-wrap: wrap; border-bottom: 1px solid #dce3ed; } .agpol-gp .agp-trust-item { flex: 1 1 160px; max-width: 220px; text-align: center; padding: 20px 14px; border-right: 1px solid #dce3ed; } .agpol-gp .agp-trust-item:last-child { border-right: none; } .agpol-gp .agp-trust-item strong { display: block; font-size: 22px; color: #1a4f8a; font-weight: 700; } .agpol-gp .agp-trust-item span { font-size: 11px; color: #777; text-transform: uppercase; letter-spacing: .6px; } /* ---- SECCIONES GENÉRICAS ---- */ .agpol-gp .agp-section { padding: 48px 32px; background: #fff; } .agpol-gp .agp-section-alt { padding: 48px 32px; background: #f7f9fc; } .agpol-gp .agp-section-title { font-size: 21px; font-weight: 700; color: #1a4f8a; margin-bottom: 6px; } .agpol-gp .agp-section-sub { color: #777; font-size: 14px; margin-bottom: 28px; } /* ---- CAJAS DESCRIPTIVAS ---- */ .agpol-gp .agp-desc-box { background: #f7f9fc; border-left: 4px solid #1a4f8a; padding: 18px 22px; border-radius: 0 4px 4px 0; margin-bottom: 16px; font-size: 15px; line-height: 1.7; } .agpol-gp .agp-desc-box.agp-accent { border-left-color: #f5a623; } /* ---- TARJETAS DE TIPOS ---- */ .agpol-gp .agp-types-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; } .agpol-gp .agp-type-card { background: #fff; border: 1px solid #d0d9e8; border-radius: 6px; padding: 22px 20px; transition: box-shadow .2s; } .agpol-gp .agp-type-card:hover { box-shadow: 0 4px 16px rgba(26,79,138,.12); } .agpol-gp .agp-type-card .agp-card-icon { font-size: 28px; margin-bottom: 12px; display: block; } .agpol-gp .agp-type-card h3 { font-size: 15px; font-weight: 700; color: #1a4f8a; margin-bottom: 8px; } .agpol-gp .agp-type-card p { font-size: 13px; color: #555; line-height: 1.65; } /* ---- PASOS ---- */ .agpol-gp .agp-steps { display: flex; flex-direction: column; } .agpol-gp .agp-step { display: flex; gap: 20px; padding: 20px 0; border-bottom: 1px solid #eee; } .agpol-gp .agp-step:last-child { border-bottom: none; } .agpol-gp .agp-step-num { width: 38px; height: 38px; background: #1a4f8a; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px; flex-shrink: 0; margin-top: 2px; } .agpol-gp .agp-step-body h3 { font-size: 15px; font-weight: 700; color: #222; margin-bottom: 5px; } .agpol-gp .agp-step-body p { font-size: 13px; color: #555; line-height: 1.65; } /* ---- GALERÍA ---- */ .agpol-gp .agp-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; } .agpol-gp .agp-gallery-item { border-radius: 4px; overflow: hidden; height: 160px; background: #d0d9e8; display: flex; align-items: center; justify-content: center; } .agpol-gp .agp-gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; } /* ---- FORMULARIO ---- */ .agpol-gp .agp-form-section { background: #f2f5f9; padding: 48px 32px; } .agpol-gp .agp-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; } .agpol-gp .agp-field { display: flex; flex-direction: column; gap: 6px; } .agpol-gp .agp-field.full { grid-column: 1 / -1; } .agpol-gp .agp-field label { font-size: 13px; font-weight: 700; color: #444; } .agpol-gp .agp-field input, .agpol-gp .agp-field select, .agpol-gp .agp-field textarea { border: 1px solid #c5cfe0; border-radius: 4px; padding: 10px 12px; font-size: 14px; background: #fff; width: 100%; color: #333; font-family: inherit; } .agpol-gp .agp-field input:focus, .agpol-gp .agp-field select:focus, .agpol-gp .agp-field textarea:focus { outline: none; border-color: #1a4f8a; } .agpol-gp .agp-field textarea { height: 100px; resize: vertical; } .agpol-gp .agp-form-submit { margin-top: 18px; } .agpol-gp .agp-form-submit button { background: #1a4f8a; color: #fff; border: none; padding: 13px 36px; border-radius: 4px; font-size: 15px; font-weight: 700; cursor: pointer; transition: background .2s; } .agpol-gp .agp-form-submit button:hover { background: #153e6e; } .agpol-gp .agp-form-nota { font-size: 12px; color: #888; margin-top: 8px; } /* ---- CTA STRIP URGENCIAS ---- */ .agpol-gp .agp-cta-strip { background: #1a4f8a; color: #fff; padding: 36px 32px; text-align: center; } .agpol-gp .agp-cta-strip h2 { font-size: 21px; font-weight: 700; margin-bottom: 8px; color: #fff; } .agpol-gp .agp-cta-strip p { opacity: .85; font-size: 14px; margin-bottom: 22px; } .agpol-gp .agp-cta-strip a { background: #f5a623; color: #fff; padding: 13px 32px; border-radius: 4px; font-weight: 700; text-decoration: none; font-size: 15px; display: inline-block; } .agpol-gp .agp-cta-strip a:hover { background: #d98f1a; } /* ---- RESPONSIVE ---- */ @media (max-width: 640px) { .agpol-gp .agp-hero { padding: 40px 20px; } .agpol-gp .agp-hero h1 { font-size: 22px; } .agpol-gp .agp-section, .agpol-gp .agp-section-alt, .agpol-gp .agp-form-section { padding: 36px 18px; } .agpol-gp .agp-trust-item { flex: 1 1 50%; } .agpol-gp .agp-types-grid { grid-template-columns: 1fr; } .agpol-gp .agp-form-grid { grid-template-columns: 1fr; } .agpol-gp .agp-field.full { grid-column: 1; } .agpol-gp .agp-gallery { grid-template-columns: 1fr 1fr; } }