/* ========================================================================== vistas-internas.css Reducción proporcional al ~85 % de la escala visual. Se activa SOLO cuando lleva la clase "vista-interna". No afecta Home ni vistas de administración. ========================================================================== */ /* ── Todas las reglas solo aplican en desktop (≥768 px) ─────────────────── */ @media (min-width: 768px) { /* ------------------------------------------------------------------ */ /* 1. CONTENEDOR PRINCIPAL — más estrecho, más espacio lateral */ /* ------------------------------------------------------------------ */ body.vista-interna .container { max-width: 1000px !important; } /* ------------------------------------------------------------------ */ /* 2. NAVBAR — ligeramente más compacto */ /* ------------------------------------------------------------------ */ body.vista-interna .logo-img { height: 58px !important; } body.vista-interna .nav-link, body.vista-interna .dropdown-item { font-size: 0.9rem !important; } body.vista-interna .dropdown-item i { font-size: 1.2rem !important; } body.vista-interna .nav-brand span { font-size: 1.05rem !important; } /* ------------------------------------------------------------------ */ /* 3. HERO BANNER — de 400 px → 280 px */ /* ------------------------------------------------------------------ */ body.vista-interna .hero-item { height: 280px !important; } body.vista-interna .hero-seccion { margin-bottom: 24px !important; } /* Logo dentro del hero */ body.vista-interna .hero-item img[alt="Logo"] { height: 70px !important; } /* Título del hero (display-5 de Bootstrap ≈ 3rem) */ body.vista-interna .hero-item .display-5, body.vista-interna .hero-item h1 { font-size: 2.2rem !important; } /* Subtítulo del hero (h2) */ body.vista-interna .hero-item h2 { font-size: 1.2rem !important; } /* Overlay padding */ body.vista-interna .carousel-overlay { padding: 1.5rem !important; } /* ------------------------------------------------------------------ */ /* 4. BLOQUES GENÉRICOS (.bloque-seccion) */ /* ------------------------------------------------------------------ */ body.vista-interna .bloque-seccion { padding: 24px !important; } body.vista-interna .bloque-seccion.hero-seccion { padding: 0 !important; /* hero no lleva padding */ } /* ------------------------------------------------------------------ */ /* 5. MÁRGENES BOOTSTRAP — escalados */ /* ------------------------------------------------------------------ */ body.vista-interna .mt-5 { margin-top: 2.25rem !important; } body.vista-interna .mb-5 { margin-bottom: 2.25rem !important; } body.vista-interna .my-5 { margin-top: 2.25rem !important; margin-bottom: 2.25rem !important; } body.vista-interna .mt-4 { margin-top: 1.15rem !important; } body.vista-interna .mb-4 { margin-bottom: 1.15rem !important; } body.vista-interna .my-4 { margin-top: 1.15rem !important; margin-bottom: 1.15rem !important; } body.vista-interna .mb-3:not(.d-flex):not(.nav) { margin-bottom: 0.75rem !important; } body.vista-interna .mt-2 { margin-top: 0.4rem !important; } /* Paddings Bootstrap */ body.vista-interna .p-5 { padding: 2.25rem !important; } body.vista-interna .p-4 { padding: 1.15rem !important; } body.vista-interna .py-4 { padding-top: 1.15rem !important; padding-bottom: 1.15rem !important; } body.vista-interna .pt-3 { padding-top: 0.75rem !important; } /* ------------------------------------------------------------------ */ /* 6. TIPOGRAFÍA — escalada */ /* ------------------------------------------------------------------ */ /* Encabezados */ body.vista-interna h2:not(.hero-item h2) { font-size: 1.5rem !important; } body.vista-interna h3 { font-size: 1.4rem !important; } body.vista-interna h4 { font-size: 1.25rem !important; } body.vista-interna h5 { font-size: 1.05rem !important; } body.vista-interna h6 { font-size: 0.875rem !important; } /* Párrafos y texto general */ body.vista-interna p, body.vista-interna .fs-6, body.vista-interna .text-secondary, body.vista-interna li, body.vista-interna label, body.vista-interna .form-control, body.vista-interna .form-select { font-size: 0.875rem !important; } body.vista-interna p { line-height: 1.6 !important; } body.vista-interna .small, body.vista-interna small { font-size: 0.78rem !important; } /* Display utilities de Bootstrap */ body.vista-interna .display-4 { font-size: 2.5rem !important; } body.vista-interna .display-5 { font-size: 2.2rem !important; } body.vista-interna .display-6 { font-size: 1.8rem !important; } /* ------------------------------------------------------------------ */ /* 7. TARJETAS Y COMPONENTES */ /* ------------------------------------------------------------------ */ /* Iconos circulares (Misión, Visión, etc.) */ body.vista-interna .tarjeta-principal .shadow-sm[style*="width: 40px"] { width: 34px !important; height: 34px !important; font-size: 1rem !important; } /* Iconos grandes en tarjetas de miembros */ body.vista-interna .card.miembro .display-4 { font-size: 2.5rem !important; } body.vista-interna .card.miembro .display-5 { font-size: 2rem !important; } /* ------------------------------------------------------------------ */ /* 8. IMÁGENES DE CONTENIDO */ /* ------------------------------------------------------------------ */ body.vista-interna img[style*="max-height: 300px"] { max-height: 240px !important; } body.vista-interna img[style*="max-height: 500px"] { max-height: 380px !important; } /* ------------------------------------------------------------------ */ /* 9. BOTONES */ /* ------------------------------------------------------------------ */ body.vista-interna .btn-institucional { padding: 0.75rem 1.15rem !important; font-size: 0.875rem !important; border-radius: 10px !important; } body.vista-interna .btn { font-size: 0.875rem !important; } body.vista-interna .btn-lg { font-size: 0.95rem !important; padding: 0.6rem 1.2rem !important; } /* ------------------------------------------------------------------ */ /* 10. GUTTERS */ /* ------------------------------------------------------------------ */ body.vista-interna .g-3 { --bs-gutter-x: 0.85rem; --bs-gutter-y: 0.85rem; } body.vista-interna .g-4 { --bs-gutter-x: 1.15rem; --bs-gutter-y: 1.15rem; } body.vista-interna .g-5 { --bs-gutter-x: 2.25rem; --bs-gutter-y: 2.25rem; } /* ------------------------------------------------------------------ */ /* 11. SECCIÓN DE CONTACTO / COLEGIATURA — ajustes específicos */ /* ------------------------------------------------------------------ */ body.vista-interna .seccion-contacto, body.vista-interna .seccion-colegiatura { padding-top: 30px !important; padding-bottom: 2.5rem !important; } /* Pasos del proceso (Colegiatura) */ body.vista-interna .paso-item { width: 155px !important; } body.vista-interna .paso-circulo { width: 44px !important; height: 44px !important; font-size: 1rem !important; } /* ------------------------------------------------------------------ */ /* 12. TÍTULO DE SECCIÓN CON SUBRAYADO */ /* ------------------------------------------------------------------ */ body.vista-interna .title-underline { width: 34px !important; height: 2.5px !important; } /* ------------------------------------------------------------------ */ /* 13. TABS Y FORMULARIOS */ /* ------------------------------------------------------------------ */ body.vista-interna .nav-tabs .nav-link { font-size: 0.875rem !important; padding: 0.5rem 0.85rem !important; } body.vista-interna .form-control, body.vista-interna .form-select { padding: 0.45rem 0.75rem !important; } /* ------------------------------------------------------------------ */ /* 14. ALERTAS Y BADGES */ /* ------------------------------------------------------------------ */ body.vista-interna .alert { padding: 0.65rem 1rem !important; font-size: 0.875rem !important; } body.vista-interna .rounded-pill.px-4 { padding-left: 1.15rem !important; padding-right: 1.15rem !important; } /* ------------------------------------------------------------------ */ /* 15. BREADCRUMBS */ /* ------------------------------------------------------------------ */ body.vista-interna .breadcrumb { font-size: 0.82rem !important; } /* ------------------------------------------------------------------ */ /* 16. TABLA */ /* ------------------------------------------------------------------ */ body.vista-interna .table { font-size: 0.85rem !important; } body.vista-interna .table th, body.vista-interna .table td { padding: 0.55rem 0.7rem !important; } /* ------------------------------------------------------------------ */ /* 17. CARD-HISTORIAL (Consejos anteriores) */ /* ------------------------------------------------------------------ */ body.vista-interna .card-historial { margin-bottom: 1.5rem !important; } /* ------------------------------------------------------------------ */ /* 18. NORMATIVA — tarjetas de documentos */ /* ------------------------------------------------------------------ */ body.vista-interna .seccion-header { margin-bottom: 0.85rem !important; } body.vista-interna .seccion-titulo { font-size: 1.4rem !important; } } /* ── FIN media query ─────────────────────────────────────────────────── */