Preview de mixed.css
/* MIXED CSS PACK */
/* Template: segurosderetiroonline.com/index.html */
/* Template mtime: 2025-10-16 14:23:24 */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css */
/* external link (no embedded): https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css */
/* external link (no embedded): https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css */
/* external link (no embedded): https://unpkg.com/[email protected]/dist/aos.css */
/* external @import (no embedded): https://fonts.googleapis.com/css2?family=Poppins:wght@300 */
/* external @import (no embedded): https://fonts.googleapis.com/css2?family=Montserrat:wght@700 */
/* ===== INLINE <style> BLOCK #1 ===== */
:root {
--primary-color: #6a11cb;
--secondary-color: #ff6b6b;
--accent-color: #48dbfb;
--dark-color: #1e272e;
--light-color: #f8f9fa;
--gradient: linear-gradient(135deg, var(--primary-color) 0%, #2575fc 100%);
--shadow: 0 15px 30px rgba(0, 0, 0, 0.12);
--transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
--glass: rgba(255, 255, 255, 0.1);
--glass-border: rgba(255, 255, 255, 0.2);
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;800;900&display=swap');
body {
font-family: 'Poppins', sans-serif;
scroll-behavior: smooth;
overflow-x: hidden;
background-color: #f9fbfd;
color: #4a4a4a;
line-height: 1.7;
}
h1, h2, h3, h4, h5, .display-1, .display-2, .display-3, .display-4 {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
line-height: 1.3;
}
/* Custom Scrollbar */
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
background: var(--primary-color);
border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
background: #555;
}
/* Navbar - Glassmorphism Effect */
.navbar {
background: rgba(30, 39, 46, 0.85) !important;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
transition: var(--transition);
padding: 20px 0;
box-shadow: 0 5px 30px rgba(0, 0, 0, 0.15);
border-bottom: 1px solid var(--glass-border);
}
.navbar.scrolled {
padding: 12px 0;
background: rgba(30, 39, 46, 0.95) !important;
}
.navbar-brand {
font-weight: 900;
font-size: 1.8rem;
background: linear-gradient(to right, #6a11cb, #2575fc);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
letter-spacing: 1px;
}
.nav-link {
font-weight: 600;
margin: 0 12px;
position: relative;
color: white !important;
letter-spacing: 0.5px;
transition: var(--transition);
}
.nav-link::before {
content: '';
position: absolute;
width: 0;
height: 3px;
bottom: -5px;
left: 0;
background: var(--secondary-color);
transition: var(--transition);
border-radius: 3px;
}
.nav-link:hover::before {
width: 100%;
}
.navbar-toggler {
border: none;
padding: 0.5rem;
}
.navbar-toggler:focus {
box-shadow: none;
}
.navbar-toggler-icon {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
/* Hero Section - Parallax Effect */
.hero {
background: var(--gradient);
color: white;
padding: 790px 0 150px;
text-align: center;
position: relative;
overflow: hidden;
/* */ /* ELIMINAR ESTO */
}
.hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 50%;
background: url('img/heroxi1.png') no-repeat center center/cover;
z-index: 0;
}
.hero-content {
padding-top: 120px;
position: relative;
z-index: 1;
}
.hero::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100px;
background: linear-gradient(to top, #f9fbfd, transparent);
z-index: 1;
}
.hero h1 {
font-size: 4rem;
font-weight: 900;
margin-bottom: 25px;
text-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
line-height: 1.2;
letter-spacing: -1px;
}
.hero p {
font-size: 1.4rem;
max-width: 750px;
margin: 0 auto 40px;
opacity: 0.9;
}
.hero .typed-cursor {
font-size: 3.5rem;
color: var(--secondary-color);
}
/* Floating Elements */
.floating-element {
position: absolute;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
z-index: 1;
animation: floating 15s infinite ease-in-out;
}
.floating-element:nth-child(1) {
width: 150px;
height: 150px;
top: 20%;
left: 10%;
animation-delay: 0s;
}
.floating-element:nth-child(2) {
width: 100px;
height: 100px;
top: 60%;
left: 15%;
animation-delay: 2s;
}
.floating-element:nth-child(3) {
width: 200px;
height: 200px;
bottom: 10%;
right: 10%;
animation-delay: 4s;
}
.floating-element:nth-child(4) {
width: 80px;
height: 80px;
top: 30%;
right: 20%;
animation-delay: 6s;
}
/* Buttons - Modern Style */
.btn-cotizar {
background-color: var(--secondary-color);
border: none;
color: white;
font-weight: 700;
padding: 15px 35px;
border-radius: 50px;
transition: var(--transition);
box-shadow: 0 10px 20px rgba(255, 107, 107, 0.3);
text-transform: uppercase;
letter-spacing: 1px;
position: relative;
overflow: hidden;
z-index: 1;
}
.btn-cotizar::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background-color: rgba(255, 255, 255, 0.2);
transition: var(--transition);
z-index: -1;
}
.btn-cotizar:hover {
transform: translateY(-5px);
box-shadow: 0 15px 30px rgba(255, 107, 107, 0.4);
}
.btn-cotizar:hover::before {
width: 100%;
}
.btn-outline-light {
border: 2px solid white;
color: white;
background: transparent;
transition: var(--transition);
font-weight: 600;
padding: 15px 35px;
border-radius: 50px;
letter-spacing: 1px;
position: relative;
overflow: hidden;
}
.btn-outline-light:hover {
background: white;
color: var(--primary-color);
box-shadow: 0 10px 20px rgba(255, 255, 255, 0.2);
}
/* Sections General Style */
section {
padding: 120px 0;
position: relative;
}
.section-title {
color: var(--primary-color);
font-weight: 900;
margin-bottom: 60px;
position: relative;
display: inline-block;
font-size: 2.5rem;
letter-spacing: -1px;
}
.section-title::after {
content: '';
position: absolute;
width: 70px;
height: 5px;
background: var(--gradient);
bottom: -15px;
left: 0;
border-radius: 5px;
}
.section-title.center::after {
left: 50%;
transform: translateX(-50%);
}
.section-subtitle {
font-size: 1.2rem;
color: #666;
max-width: 700px;
margin: 0 auto 60px;
}
/* About Section - Glassmorphism Card */
#quienessomos {
background: white;
border-radius: 20px;
box-shadow: var(--shadow);
margin-top: -80px;
position: relative;
z-index: 3;
border: 1px solid rgba(106, 17, 203, 0.1);
overflow: hidden;
}
#quienessomos::before {
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: radial-gradient(circle, rgba(106, 17, 203, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
z-index: -1;
}
.about-content {
position: relative;
z-index: 2;
}
.about-img {
border-radius: 15px;
overflow: hidden;
box-shadow: var(--shadow);
transform: perspective(1000px) rotateY(-10deg);
transition: var(--transition);
border: 10px solid white;
}
.about-img:hover {
transform: perspective(1000px) rotateY(0deg);
}
.contact-info {
background: white;
padding: 40px;
border-radius: 15px;
box-shadow: var(--shadow);
border: 1px solid rgba(106, 17, 203, 0.1);
position: relative;
overflow: hidden;
}
.contact-info::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 100%;
background: var(--gradient);
}
.contact-info i {
color: var(--primary-color);
margin-right: 15px;
font-size: 1.5rem;
width: 30px;
text-align: center;
}
/* Services Section - Card Hover Effects */
#servicios {
background: linear-gradient(to bottom, #f9fbfd 0%, #ffffff 100%);
position: relative;
overflow: hidden;
}
#servicios::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80') no-repeat center center/cover;
opacity: 0.03;
z-index: 0;
}
.service-card {
border: none;
border-radius: 20px;
overflow: hidden;
transition: var(--transition);
box-shadow: var(--shadow);
height: 100%;
background: white;
position: relative;
z-index: 1;
border: 1px solid rgba(106, 17, 203, 0.1);
}
.service-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 5px;
background: var(--gradient);
transition: var(--transition);
}
.service-card:hover {
transform: translateY(-15px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}
.service-card:hover::before {
height: 10px;
}
.service-icon {
font-size: 3rem;
color: var(--primary-color);
margin-bottom: 25px;
display: inline-block;
transition: var(--transition);
}
.service-card:hover .service-icon {
transform: scale(1.2) rotate(10deg);
color: var(--secondary-color);
}
.service-card .card-title {
font-weight: 700;
color: var(--dark-color);
font-size: 1.5rem;
}
.service-card .card-text {
color: #666;
}
/* Benefits Section - Gradient Background */
#porque {
background: url('https://images.unsplash.com/photo-1521791055366-0d553872125f?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80') no-repeat center center/cover;
position: relative;
color: white;
padding: 150px 0;
}
#porque::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(106, 17, 203, 0.9) 0%, rgba(37, 117, 252, 0.9) 100%);
}
#porque .section-title {
color: white;
}
#porque .section-title::after {
background: var(--secondary-color);
}
.benefit-list {
list-style: none;
padding: 0;
}
.benefit-list li {
margin-bottom: 20px;
position: relative;
padding-left: 40px;
font-size: 1.2rem;
font-weight: 500;
}
.benefit-list li::before {
content: '\f00c';
font-family: 'Font Awesome 6 Free';
font-weight: 900;
position: absolute;
left: 0;
top: 2px;
color: var(--secondary-color);
font-size: 1.5rem;
}
.stats-card {
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border-radius: 15px;
padding: 30px;
border: 1px solid var(--glass-border);
transition: var(--transition);
height: 100%;
}
.stats-card:hover {
transform: translateY(-10px);
background: rgba(255, 255, 255, 0.15);
}
.stats-card .display-4 {
font-weight: 900;
color: white;
margin-bottom: 10px;
background: linear-gradient(to right, white, #f8f9fa);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.stats-card p {
color: rgba(255, 255, 255, 0.8);
font-weight: 500;
}
/* Testimonials Section - Modern Carousel */
#ticker {
background: white;
position: relative;
}
#ticker::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80') no-repeat center center/cover;
opacity: 0.03;
z-index: 0;
}
.testimonial-carousel {
border-radius: 20px;
overflow: hidden;
box-shadow: var(--shadow);
position: relative;
}
.testimonial-item {
height: 500px;
position: relative;
overflow: hidden;
}
.testimonial-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
filter: brightness(0.7);
transition: filter 0.5s ease;
}
.testimonial-carousel:hover .testimonial-img {
filter: brightness(0.5);
}
.testimonial-content {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 40px;
background: linear-gradient(to top, rgba(30, 39, 46, 0.9), transparent);
color: white;
transform: translateY(20px);
opacity: 0;
transition: all 0.5s ease;
}
.testimonial-carousel:hover .testimonial-content {
transform: translateY(0);
opacity: 1;
}
.testimonial-quote {
font-size: 1.2rem;
font-style: italic;
margin-bottom: 20px;
position: relative;
}
.testimonial-quote::before {
content: '\201C';
font-size: 4rem;
position: absolute;
top: -30px;
left: -20px;
color: rgba(255, 255, 255, 0.2);
}
.testimonial-author {
font-weight: 700;
font-size: 1.3rem;
}
.testimonial-role {
font-size: 0.9rem;
opacity: 0.8;
}
.carousel-control-prev, .carousel-control-next {
width: 60px;
height: 60px;
background: rgba(255, 255, 255, 0.2);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
opacity: 0;
transition: var(--transition);
border: 1px solid var(--glass-border);
}
.testimonial-carousel:hover .carousel-control-prev,
.testimonial-carousel:hover .carousel-control-next {
opacity: 1;
}
.carousel-control-prev:hover, .carousel-control-next:hover {
background: rgba(255, 255, 255, 0.3);
}
/* FAQs Section - Modern Accordion */
#faqs {
background: linear-gradient(to bottom, #ffffff 0%, #f9fbfd 100%);
position: relative;
}
#faqs::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80') no-repeat center center/cover;
opacity: 0.03;
z-index: 0;
}
.accordion {
border-radius: 15px;
overflow: hidden;
box-shadow: var(--shadow);
border: 1px solid rgba(106, 17, 203, 0.1);
}
.accordion-item {
border: none;
margin-bottom: 15px;
border-radius: 10px !important;
overflow: hidden;
background: white;
border: 1px solid rgba(106, 17, 203, 0.1);
}
.accordion-button {
font-weight: 700;
color: var(--dark-color);
background: white;
box-shadow: none;
padding: 20px 25px;
font-size: 1.1rem;
}
.accordion-button:not(.collapsed) {
color: var(--primary-color);
background: rgba(106, 17, 203, 0.05);
}
.accordion-button:focus {
box-shadow: none;
border-color: var(--primary-color);
}
.accordion-button::after {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236a11cb'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
width: 1.5rem;
height: 1.5rem;
}
.accordion-body {
padding: 20px 25px;
color: #555;
}
/* Contact Section - Modern Form */
#contacto {
background: white;
position: relative;
}
#contacto::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80') no-repeat center center/cover;
opacity: 0.03;
z-index: 0;
}
.contact-form {
background: white;
padding: 50px;
border-radius: 20px;
box-shadow: var(--shadow);
border: 1px solid rgba(106, 17, 203, 0.1);
position: relative;
overflow: hidden;
}
.contact-form::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 100%;
background: var(--gradient);
}
.form-control {
height: 55px;
border-radius: 10px;
border: 1px solid #eee;
padding-left: 20px;
transition: var(--transition);
font-size: 1rem;
}
.form-control:focus {
box-shadow: none;
border-color: var(--primary-color);
}
textarea.form-control {
height: auto;
padding-top: 15px;
min-height: 150px;
}
.form-label {
font-weight: 600;
color: #555;
margin-bottom: 8px;
}
.form-check-input:checked {
background-color: var(--primary-color);
border-color: var(--primary-color);
}
.form-check-input:focus {
box-shadow: 0 0 0 0.25rem rgba(106, 17, 203, 0.25);
}
.contact-info-card {
height: 100%;
padding: 40px;
background: white;
border-radius: 20px;
box-shadow: var(--shadow);
border: 1px solid rgba(106, 17, 203, 0.1);
position: relative;
overflow: hidden;
}
.contact-info-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 100%;
background: var(--gradient);
}
.contact-feature {
display: flex;
margin-bottom: 30px;
}
.contact-feature-icon {
flex-shrink: 0;
width: 50px;
height: 50px;
background: linear-gradient(135deg, var(--primary-color) 0%, #2575fc 100%);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
margin-right: 20px;
}
.contact-feature-content h5 {
font-weight: 700;
color: var(--dark-color);
margin-bottom: 5px;
}
.contact-feature-content p {
color: #666;
margin-bottom: 0;
}
/* Footer - Modern Style */
footer {
background: var(--dark-color);
color: white;
padding: 80px 0 30px;
position: relative;
}
footer::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 15px;
background: var(--gradient);
}
.footer-logo {
font-weight: 900;
font-size: 2rem;
background: linear-gradient(to right, white, #f8f9fa);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
letter-spacing: 1px;
margin-bottom: 20px;
display: inline-block;
}
.footer-about {
color: rgba(255, 255, 255, 0.7);
margin-bottom: 20px;
}
.footer-links {
list-style: none;
padding: 0;
}
.footer-links li {
margin-bottom: 12px;
}
.footer-links a {
color: rgba(255, 255, 255, 0.7);
text-decoration: none;
transition: var(--transition);
display: inline-block;
}
.footer-links a:hover {
color: white;
transform: translateX(5px);
}
.footer-links i {
margin-right: 10px;
color: var(--accent-color);
width: 20px;
text-align: center;
}
.social-icons a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 45px;
height: 45px;
background: rgba(255, 255, 255, 0.1);
border-radius: 50%;
margin-right: 10px;
color: white;
transition: var(--transition);
font-size: 1.2rem;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.social-icons a:hover {
background: var(--primary-color);
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(106, 17, 203, 0.3);
}
.footer-bottom {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 30px;
margin-top: 50px;
}
/* WhatsApp Float Button */
.whatsapp-float {
position: fixed;
bottom: 30px;
right: 30px;
background: linear-gradient(135deg, #25d366, #128c7e);
color: white;
border-radius: 50%;
width: 70px;
height: 70px;
font-size: 35px;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
box-shadow: 0 10px 25px rgba(37, 211, 102, 0.3);
z-index: 9999;
transition: var(--transition);
animation: pulse 2s infinite;
border: none;
}
.whatsapp-float:hover {
transform: scale(1.1) translateY(-5px);
box-shadow: 0 15px 30px rgba(37, 211, 102, 0.4);
color: white;
}
/* Back to Top Button */
.back-to-top {
position: fixed;
bottom: 110px;
right: 30px;
background: linear-gradient(135deg, var(--primary-color), #2575fc);
color: white;
border-radius: 50%;
width: 50px;
height: 50px;
font-size: 20px;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
box-shadow: 0 5px 15px rgba(106, 17, 203, 0.3);
z-index: 9998;
transition: var(--transition);
opacity: 0;
visibility: hidden;
}
.back-to-top.active {
opacity: 1;
visibility: visible;
}
.back-to-top:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(106, 17, 203, 0.4);
}
/* Animations */
@keyframes floating {
0% { transform: translate(0, 0) rotate(0deg); }
50% { transform: translate(20px, 20px) rotate(10deg); }
100% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes pulse {
0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }
70% { box-shadow: 0 0 0 15px rgba(37, 211, 102, 0); }
100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}
/* Particles Background */
.particles-js-canvas-el {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
opacity: 0.3;
}
/* Responsive Styles */
@media (max-width: 1199.98px) {
.hero h1 {
font-size: 3.5rem;
}
section {
padding: 100px 0;
}
}
@media (max-width: 991.98px) {
.hero {
padding: 150px 0 120px;
}
.hero h1 {
font-size: 3rem;
}
.hero p {
font-size: 1.2rem;
}
.section-title {
font-size: 2.2rem;
}
#quienessomos {
margin-top: 0;
}
.testimonial-item {
height: 400px;
}
}
@media (max-width: 767.98px) {
.hero {
padding: 120px 0 100px;
}
.hero h1 {
font-size: 2.5rem;
}
.hero p {
font-size: 1.1rem;
}
.section-title {
font-size: 2rem;
}
.btn-cotizar, .btn-outline-light {
padding: 12px 25px;
font-size: 0.9rem;
}
.contact-form, .contact-info-card {
padding: 30px;
}
}
@media (max-width: 575.98px) {
.hero {
padding: 100px 0 80px;
}
.hero h1 {
font-size: 2rem;
}
.section-title {
font-size: 1.8rem;
}
.floating-element {
display: none;
}
.whatsapp-float {
width: 60px;
height: 60px;
font-size: 30px;
bottom: 20px;
right: 20px;
}
.back-to-top {
width: 45px;
height: 45px;
font-size: 18px;
bottom: 90px;
right: 20px;
}
}
/* Carousel image height tweak */
#tickerCarousel .carousel-item img{
object-fit: cover;
height: 500px;
}
@media (max-width: 767.98px){
#tickerCarousel .carousel-item img{
height: 60vw;
}
}
/* Carousel image display tweak */
#tickerCarousel .carousel-item img{
width: 100%;
height: auto; /* Mantiene proporción natural */
max-height: 500px; /* Evita que sean gigantes en desktop */
object-fit: contain; /* Muestra la imagen completa sin recorte */
}
@media (max-width: 767.98px){
#tickerCarousel .carousel-item img{
max-height: 75vh; /* Algo más alto en móviles, pero sin recortar */
}
}
/* Navbar text/icon visibility fix */
.navbar, .navbar a.nav-link, .navbar-brand {
color: #ffffff !important;
}
.navbar a.nav-link{
opacity: 0.9;
transition: opacity 0.3s;
}
.navbar a.nav-link:hover, .navbar a.nav-link:focus, .navbar a.nav-link.active{
color: var(--secondary-color) !important;
opacity: 1;
}
.navbar-toggler{
border-color: rgba(255,255,255,0.3);
}
.navbar-toggler-icon{
filter: invert(1) grayscale(100%);
}
section[id]{scroll-margin-top:90px;}
section[id]{scroll-margin-top:90px;}
/* --- FIX: Prevent horizontal scroll and navbar overflow --- */
*, *::before, *::after{ box-sizing:border-box; }
html,body{ max-width:100%; overflow-x:hidden; }
/* Ensure Bootstrap rows don't create negative margins that overflow when body overflow hidden */
.row{ margin-right:0; margin-left:0;}
/* Ensure hero parallax and other absolute elements stay within viewport */
.hero, .floating-element{ max-width:100vw; }
/* ===== INLINE <style> BLOCK #2 ===== */
/* ----- Mapa responsivo ----- */
.map-responsive{
position: relative;
padding-bottom: 56.25%; /* 16:9 */
height: 0;
overflow: hidden;
border-radius: 8px; /* puntas redondeadas, queda prolijo */
box-shadow: 0 0 10px rgba(0,0,0,.15);
}
.map-responsive iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}