/* CSS específico para el snippet Portada reutilizable */
:root{ --vrp-primary: #2F7AE0; --vrp-dark:#192258 }
.vrp-portada-carousel { width:100%; height:60dvh; position:relative; overflow:hidden; font-family:Arial, sans-serif; color:#fff }
.vrp-portada-slide{ position:relative; width:100%; height:100%; overflow:hidden }
.vrp-portada-bgimg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 35%; z-index:1; pointer-events:none; transition: object-position .25s ease; }
.vrp-portada-overlay{ position:absolute; inset:0; background:rgba(0,0,0,.4); z-index:2 }
.vrp-portada-particles-layer{ position:absolute; inset:0; z-index:3; pointer-events:none }
.vrp-portada-texts{ position:absolute; inset:0; z-index:6; display:block; }
.vrp-portada-text{ position:relative; height:100%; text-align:center; }
.vrp-portada-text-title{ position:absolute; top:6%; left:50%; transform:translateX(-50%); z-index:6; margin:0 12px 8px; font-weight:900; font-size:clamp(16px,3.2vw,40px); text-transform:uppercase; text-shadow:0 6px 18px rgba(0,0,0,.45) }
.vrp-portada-text-subtitle{ position:absolute; top:32%; left:50%; transform:translateX(-50%); z-index:6; margin:0 18px; max-width:1100px; width:calc(100% - 40px); text-shadow:0 4px 12px rgba(0,0,0,.35) }
.vrp-portada-text-subtitle .vrp-portada-line1{ display:block; font-weight:800; font-size:clamp(14px,2.6vw,22px) }
.vrp-portada-text-subtitle .vrp-portada-line2{ display:block; font-weight:700; font-size:clamp(13px,2.6vw,20px); margin-top:6px }
@media (max-width:900px){.vrp-portada-text-title{font-size:clamp(18px,6.5vw,40px);top:4%}.vrp-portada-text-subtitle{top:30%}.vrp-portada-bgimg{ object-position:50% 20%; }}
@media (max-width:576px){.vrp-portada-text-title{font-size:clamp(16px,8.5vw,32px);top:3%}.vrp-portada-text-subtitle{top:26%}.vrp-portada-bgimg{ object-position:50% 10%; }}