@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800&display=swap');

:root{
	/* Paleta y tokens globales */
	--brand: #283c63;
	--brand-2: #375287;
	--navy: #283c63;
	--blue: #375287;
	--accent: #f6a800;
	--peach: #fbe8d3;
	--sand: #f7d0a4;
	--white: #ffffff;
	--bg: #f7f8fb;
	--bg-subtle: #fbfdff;
	--bg-light: #f6f8ff;
	--card: #ffffff;
	--muted: #6b7280;
	--dark: #19263f;
	--text-color: #16202b;
	--text-secondary: #495057;
	--shadow: 0 6px 20px rgba(15,76,129,0.08);
	--card-radius: 12px;
	/* Colores funcionales */
	--whatsapp: #16A34A;
	--border-light: rgba(0,0,0,0.06);
	--border-input: #e6e9ef;
}

html, body {height:100%; background: var(--bg); color: var(--text-color); font-family: 'Nunito', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif}
/* Tipografía global: tamaños y legibilidad */
html{font-size:16px}
body{font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

h1,h2,h3,h4,h5,h6{font-family:inherit;color:var(--navy);margin-top:0;margin-bottom:.6rem}
h1{font-size:2.25rem;font-weight:800}
h2{font-size:1.75rem;font-weight:700}
h3{font-size:1.25rem;font-weight:700}
p{font-size:1rem;color:var(--text-color);line-height:1.7;margin-bottom:1rem}

/* Mejor lectura en columnas de texto: limitar ancho y usar contrastes correctos */
.export-info, .p-4, .side, .service-highlight, .faq-page .panel p{font-size:1rem;line-height:1.7;color:var(--text-color)}
.export-info p, .p-4 p{max-width:46ch}

/* Ajustes específicos de jerarquía en la sección de servicios */
.service-section h2{font-size:1.6rem;color:var(--navy);font-weight:700}
.service-section .card-title{font-size:1.05rem}
.service-section .card-text{font-size:.98rem;color:rgba(22,32,43,0.9)}
	.min-vh-100 {min-height:100vh}

/* Ensure page layout provides height for the hero */
main.min-vh-100{min-height:100vh !important}
.hero-left, .hero-right{min-height:80vh;display:flex}
	#anim svg {width:100%; height:100%;}
	.hero-left {background: var(--card)}
	.hero-right {background: var(--card);}
	#anim {background: var(--card)}

	h1 {color: var(--sand)}
    .lead {color: var(--dark)}
	.navbar {background-color: var(--white)}

/* Navbar: agrandar logo y enlaces para mayor presencia */
.navbar{height:84px;padding-top:8px;padding-bottom:8px}
.navbar-brand img{width:82px;height:82px;object-fit:contain}
.navbar-nav .nav-link{font-size:1.3rem;padding:.5rem .75rem;color:var(--dark)}
.navbar-toggler{height:56px;width:56px}

@media (max-width: 991.98px){
	.navbar{height:auto;padding-top:6px;padding-bottom:6px}
	.navbar-brand img{width:74px;height:74px}
	.navbar-nav .nav-link{font-size:1rem}
}
@media (max-width: 767.98px){
	.navbar-brand img{width:56px;height:56px}
	.navbar-nav .nav-link{font-size:0.95rem}
}
	.btn-primary {background-color: var(--blue); border-color: var(--blue)}
	.btn-primary:focus, .btn-primary:hover {background-color: var(--navy); border-color: var(--navy)}
	.btn-outline-primary {border-color: var(--blue); color: var(--blue)}
	.btn-outline-primary:hover {background-color: rgba(55,82,135,0.06)}

	@media (max-width: 767.98px) {
		#anim {height:50vh}
	}

	/* Estilos para panel de contacto (profesional y minimalista) */
	.contact-card{background:var(--card);border:1px solid rgba(25,38,63,0.04);border-radius:12px;box-shadow:var(--shadow);min-height:220px}
	.contact-card h3{margin-bottom:0.2rem}
	.contact-card p{margin-bottom:0.8rem}
	.contact-buttons .btn{justify-content:flex-start;padding-left:14px;padding-right:14px;border-radius:10px;font-weight:600}
	.contact-buttons .btn i{display:inline-flex;align-items:center;justify-content:center}
	.contact-buttons .btn:hover{background:rgba(55,82,135,0.06)}
	.contact-buttons .btn:focus{box-shadow:0 6px 18px rgba(55,82,135,0.12)}

	@media (max-width:767.98px){
		.contact-card{padding:1rem}
		.contact-buttons .btn{font-size:0.95rem;padding-top:0.6rem;padding-bottom:0.6rem}

	/* Estilos para el conversor UF */
	#uf-converter .card{border-radius:12px;box-shadow:0 10px 30px rgba(25,38,63,0.06)}
	#uf-converter h3{font-weight:700;color:var(--navy)}
	#uf-converter .form-label{font-weight:600;color:var(--dark)}
	#uf-converter #swap-btn{min-width:56px}
	#uf-converter canvas{width:100%;height:auto;border-radius:8px;background:linear-gradient(180deg,rgba(255,255,255,0.6),rgba(255,255,255,0.9));}
	#uf-converter table th, #uf-converter table td{vertical-align:middle}

	/* Estilos para calculadora de volumen */
	#volumen-calculator .card{border-radius:12px;box-shadow:0 10px 30px rgba(25,38,63,0.06)}
	#result-card{background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(250,250,250,0.98));}

	/* Resaltar total estimado */
	.total-estimated{font-size:1.35rem;padding-top:8px;padding-bottom:6px;color:var(--blue);font-weight:800}

	/* Inputs más agradables */
	.form-control.form-control-lg{border-radius:10px;padding:0.8rem 0.9rem}
	.form-select{border-radius:10px}

	/* Ilustración contenedor */
	#container-illustration svg{width:100%;height:auto;border-radius:8px}

	/* Mensaje de no entran */
	.text-danger{font-weight:700}

	}

/* Ajustes para agrandar el hero (emular zoom ~125%) */
.hero-left .display-5 {font-size:3.2rem}
.hero-left h3.display-5 {font-size:2.6rem;margin-top:0.35rem}
.hero-left .lead {font-size:1.40rem;max-width:58rem}

@media (min-width:1200px){
	.hero-left .display-5{font-size:3rem}
	.hero-left h3.display-5{font-size:6rem}
	#anim{height:82vh;max-width:1000px}
}

@media (max-width:991.98px){
	.hero-left .display-5{font-size:2.6rem}
	.hero-left h3.display-5{font-size:1.8rem}
	#anim{height:60vh}
}


.import-carousel, .export-carousel {display:flex;align-items:center;gap:12px}
.import-carousel .carousel-control, .export-carousel .carousel-control {background:#ffffff;border:1px solid rgba(0,0,0,0.06);width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:24px;cursor:pointer;box-shadow:0 6px 18px rgba(55,82,135,0.08)}
.import-carousel .carousel-control:active, .export-carousel .carousel-control:active {transform:translateY(1px)}
.cards-viewport{overflow:hidden;flex:1}
.cards-track{display:flex;gap:20px;transition:transform 400ms cubic-bezier(.2,.8,.2,1);padding:8px}
.card-item{flex:0 0 300px;background:#ffffff;border-radius:12px;padding:20px;box-shadow:0 12px 30px rgba(50,70,120,0.06);text-align:center}
.card-illustration{width:100%;height:160px;object-fit:cover;margin:0 0 12px 0;display:block;border-radius:10px;background:#f6f8ff;opacity:0.75;transition:opacity .22s ease}
.card-title{font-weight:700;margin-bottom:8px;color:var(--dark)}
.card-desc{color:#6b7280;font-size:0.95rem}

@media (max-width: 991.98px){
	.card-item{flex:0 0 280px}
}
@media (max-width: 767.98px){
	.card-item{flex:0 0 230px;padding:16px}
	.card-illustration{height:120px}
}
@media (max-width: 575.98px){
	.import-carousel, .export-carousel {gap:8px}
	.card-item{flex:0 0 200px;padding:14px}
	.card-illustration{height:100px}
}

/* Export: mostrar una sola card, más grande, para diferenciar de importación */
#export-flow .export-carousel {justify-content:flex-start}
#export-flow .cards-viewport{flex:1;max-width:100%;margin:0 12px}
#export-flow .cards-track{gap:28px}
#export-flow .card-item{flex:0 0 100%;padding:28px;max-width:100%}

@media (max-width: 991.98px){
	#export-flow .card-item{padding:24px}
}
@media (max-width: 767.98px){
	#export-flow .cards-viewport{flex:0 0 88%;max-width:88%}
	#export-flow .card-item{flex:0 0 100%}
	#export-flow .card-illustration{height:220px}
}
@media (max-width: 575.98px){
	#export-flow .cards-viewport{flex:0 0 94%;max-width:94%}
	#export-flow .card-item{flex:0 0 100%;padding:18px}
	#export-flow .card-illustration{height:160px}
}

/* Increase illustration height on desktop for #export-flow */
#export-flow .card-illustration{height:260px}
 #export-flow .card-item{padding:34px}

/* Export text column */
#export-flow .export-info{padding:12px 24px}
#export-flow .export-info h3{font-size:1.6rem;color:var(--dark)}
#export-flow .export-info p{color:#6b7280}

/* Small visual polish */
.import-carousel .carousel-control:hover, .export-carousel .carousel-control:hover {box-shadow:0 16px 36px rgba(55,82,135,0.12)}

/* Stats section under hero */
.stats-section{background:#f4f5f6}
.stats-section .stat-item{padding:28px 16px}
.stats-section .stat-number{font-weight:800;color:var(--navy);font-size:3rem;line-height:1}
.stats-section .stat-number .stat-plus{font-size:1.2rem;margin-left:6px}
.stats-section .stat-label{color:var(--dark);margin-top:10px;font-size:0.98rem}

@media(min-width:768px){
	.stats-section .col-md-3{border-right:1px solid rgba(0,0,0,0.06)}
	.stats-section .col-md-3:last-child{border-right:none}
	.stats-section .stat-item{padding:32px 24px}
	.stats-section .stat-number{font-size:3.6rem}
}

/* Services section */
.services-section{background:linear-gradient(180deg, rgba(55,82,135,0.08), rgba(55,82,135,0.02));padding-top:36px;padding-bottom:36px}
.services-section h2{color:var(--dark)}
.services-section p.text-muted{color:#6b7280}
.services-section .service-card{background:transparent;border-radius:10px;padding:20px;border:1px solid rgba(25,38,63,0.04);box-shadow:none;transition:border-color .18s ease,background-color .18s ease}
.services-section .service-card::before{content:'';display:block;width:40px;height:4px;background:var(--white);border-radius:3px;margin-bottom:10px;opacity:0.14}
.services-section .service-card h5{font-weight:600;margin-bottom:6px;color:var(--dark)}
.services-section .service-card p{color:#374151}
.services-section .service-card:hover{background:rgba(255,255,255,0.9);border-color:rgba(25,38,63,0.06)}

/* Compact layout for index: left summary, right illustration */
.services-compact .summary-list{margin:0;padding:0}
.services-compact .summary-list li{padding:8px 0;color:var(--dark);font-weight:600;position:relative;padding-left:22px}
.services-compact .summary-list li::before{content:'';position:absolute;left:0;top:12px;width:8px;height:8px;border-radius:50%;background:var(--blue);opacity:0.95}
.services-illustration{max-width:520px;width:100%;height:auto;object-fit:cover;box-shadow:0 18px 40px rgba(25,38,63,0.08);border-radius:12px}

@media(max-width:767.98px){
	.services-compact{text-align:left}
	.services-illustration{max-width:100%;margin-top:18px}
}

@media(min-width:768px){
	.services-section .service-card{height:100%}
}

	/* Footer (discreet, low-contrast) */
	.site-footer{background:transparent;padding:24px 0;border-top:1px solid rgba(0,0,0,0.04)}
	.site-footer .footer-text{color:rgba(25,38,63,0.48);font-size:0.80rem;line-height:1.3}
	.site-footer .footer-text a{color:rgba(25,38,63,0.6);text-decoration:underline}
	.site-footer .footer-text.small{font-size:0.75rem}

@media(max-width:767.98px){
	.stats-section{padding-top:16px;padding-bottom:16px}
	.stats-section .stat-number{font-size:2.2rem}
}

/* Stat cards: diseño vistoso, discreto y responsivo */
.stat-card{border:1px solid rgba(25,38,63,0.04);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .24s ease,box-shadow .24s ease}
.stat-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(25,38,63,0.08)}
.stat-card .stat-ico{width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,0.6),rgba(255,255,255,0.2));box-shadow:inset 0 -6px 18px rgba(0,0,0,0.02)}
.stat-number{font-weight:800;color:var(--navy);font-size:2.4rem;line-height:1}
.stat-number .stat-plus{font-size:1.1rem;margin-left:6px;color:var(--muted)}
.stat-label{color:var(--dark);margin-top:8px;font-size:0.95rem}

@media(min-width:768px){
	.stat-card{padding:22px}
	.stat-number{font-size:2.8rem}
}

@media(max-width:575.98px){
	.stat-card{padding:14px}
	.stat-ico{width:52px;height:52px}
	.stat-number{font-size:1.8rem}
}

/* Mapa responsivo */
.map-section h2{color:var(--navy);margin-bottom:0.25rem}
.map-section p{color:var(--muted)}
.map-embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px;box-shadow:0 12px 30px rgba(25,38,63,0.06);border:1px solid rgba(25,38,63,0.04);background:var(--card)}
.map-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}

@media(max-width:767.98px){
	.map-section .container{padding-left:12px;padding-right:12px}
}

/* Enhancements for services page: llamativo pero dentro de la paleta */
.service-highlight{position:relative;overflow:hidden;border-left:6px solid var(--sand);transition:transform .28s ease,box-shadow .28s ease;border-radius:12px}
.service-highlight:hover{transform:translateY(-8px);box-shadow:0 18px 40px rgba(25,38,63,0.12);border-left-color:var(--blue)}
.service-highlight .fs-1{width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--peach);color:var(--dark);font-size:28px}
.service-highlight h3{color:var(--navy);margin-top:6px}
.service-highlight p{color:#374151}
.service-highlight ul{margin-top:8px;margin-left:18px;color:#4b5563}

/* CTA estilo sólido, mayor presencia sin degradados */
.cta-section{background-color:var(--blue);box-shadow:0 12px 36px rgba(55,82,135,0.12);position:relative}
.cta-section .btn-light{background:#ffffff;color:var(--blue);font-weight:600}
.cta-section::after{content:"";position:absolute;right:-40px;top:-30px;width:140px;height:140px;border-radius:20px;background:rgba(255,255,255,0.06);transform:rotate(25deg);pointer-events:none}

/* Testimonials & FAQ polish */
.testimonials .p-3{background:rgba(15,23,42,0.02);border-left:4px solid rgba(55,82,135,0.08)}
.accordion-button:not(.collapsed){background:var(--peach);color:var(--navy);box-shadow:none}
.accordion-button{color:var(--dark)}

/* Make cards feel more dynamic on hover */
.card-item{transition:transform .28s ease,box-shadow .28s ease}
.card-item:hover{transform:translateY(-6px);box-shadow:0 20px 48px rgba(50,70,120,0.08)}
.card-item:hover .card-illustration{opacity:1}

@media (max-width:991.98px){
    .service-highlight{border-left-width:4px}
    .service-highlight .fs-1{width:56px;height:56px}
}

/* Nested dropdown (submenu) support */
.dropdown-menu li { position: relative; }
.dropdown-menu .submenu { display: none; position: absolute; left: 100%; top: 0; margin-top: -0.125rem; min-width: 12rem; z-index: 2000; }
.dropdown-menu .submenu { display: none; position: absolute; left: 100%; top: 0; margin-top: -0.125rem; min-width: 12rem; z-index: 2000; opacity: 0; transform: translateX(-6px); transition: opacity .16s ease, transform .16s ease; box-shadow: 0 8px 20px rgba(25,38,63,0.06); border-radius:6px; }
.dropdown-menu .submenu.show { display: block; opacity: 1; transform: translateX(0); }
.dropdown-item.has-submenu::after{ content: '\203A'; float: right; transform: rotate(0deg); color: rgba(25,38,63,0.45); font-size:0.95rem; margin-left:8px }

/* On small screens, show submenus stacked instead of absolute */
@media (max-width: 767.98px){
	.dropdown-menu .submenu { position: relative; left: 0; margin: 0.25rem 0 0 0; }
	.dropdown-item.has-submenu::after{ content: '\25be'; }
	/* On mobile avoid transform opacity to ensure immediate display */
	.dropdown-menu .submenu{ opacity:1; transform:none; box-shadow:none }
}

/* ===== RESPONSIVE IMPROVEMENTS ===== */
/* Reducir espacios verticales en mobile */
@media (max-width: 575.98px){
	.py-5 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
	.py-4 { padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
	.py-3 { padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; }
	.my-5 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
	.mb-4 { margin-bottom: 1rem !important; }
	.mb-3 { margin-bottom: 0.75rem !important; }
	.mb-2 { margin-bottom: 0.5rem !important; }
	
	/* Contenedores y secciones */
	.container { padding-left: 1rem; padding-right: 1rem; }
	
	/* Tipografía más compacta en mobile */
	h1 { font-size: 1.8rem !important; margin-bottom: 0.4rem; }
	h2 { font-size: 1.4rem !important; margin-bottom: 0.4rem; }
	h3 { font-size: 1.1rem !important; margin-bottom: 0.3rem; }
	p { margin-bottom: 0.6rem; }
	
	/* Cards con menos padding */
	.card { overflow: hidden; }
	.card > * { padding: 1rem; }
}

@media (max-width: 767.98px){
	.py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
	.container { padding-left: 1.25rem; padding-right: 1.25rem; }
	h1 { font-size: 1.9rem; }
	h2 { font-size: 1.5rem; }
}

/* Optimizar imágenes para mobile */
img { max-width: 100%; height: auto; }
.img-fluid { display: block; }

/* Mejorar botones en mobile */
@media (max-width: 767.98px){
	.btn { padding: 0.55rem 1rem; font-size: 0.95rem; }
	.btn-lg { padding: 0.6rem 1.2rem; font-size: 1rem; }
	.btn-group { gap: 0.5rem; }
}

/* Ajustar gap en filas en mobile */
@media (max-width: 767.98px){
	.g-4 { gap: 1.5rem; }
	.g-3 { gap: 1rem; }
	.g-2 { gap: 0.75rem; }
}

/* ===== FOOTER ===== */
.footer-brand { font-weight: 700; color: var(--dark); font-size: 0.95rem; }
.footer-divider { border-color: var(--border-light); }

/* ===== SERVICES PAGE ===== */
.service-section { padding: 1.5rem 0; }
@media (min-width: 768px) { .service-section { padding: 3rem 0; } }
.nav-pills { gap: .5rem; }
.nav-pills .nav-link { border-radius: 999px; padding: .7rem 1.2rem; font-size: 0.95rem; font-weight: 700; color: var(--brand-2); }
.nav-pills .nav-link.active { background: linear-gradient(90deg, var(--brand) 0%, var(--brand-2) 100%); color: var(--white); box-shadow: 0 12px 36px rgba(13,110,253,0.14); }

.service-card { border-radius: var(--card-radius); overflow: hidden; border: 1px solid rgba(13,110,253,0.06); transition: transform .18s ease, box-shadow .18s ease; background: var(--white); position: relative; min-height: 360px; display: flex; flex-direction: column; }
@media (max-width: 767.98px) { .service-card { min-height: 320px; } }
.service-card:hover { transform: translateY(-8px); box-shadow: 0 22px 48px rgba(14,30,37,0.14); }
.service-card .card-hero { height: 180px; display: flex; align-items: center; justify-content: center; padding: 1rem; background: var(--white); flex-direction: column; }
@media (max-width: 767.98px) { .service-card .card-hero { height: 140px; padding: 0.8rem; } }
.service-card .service-icon { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 0; background: transparent; }
.service-card .service-icon img.service-img { width: 100%; height: 100%; object-fit: contain; border-radius: 0; display: block; }
.service-card .service-icon i { color: var(--brand); font-size: 2.5rem; }
.service-card .card-body { padding: 1rem; text-align: center; margin-top: auto; }
@media (max-width: 767.98px) { .service-card .card-body { padding: 0.8rem; } }
.service-card .card-title { font-size: 0.95rem; font-weight: 700; margin-bottom: 0.3rem; }
@media (max-width: 767.98px) { .service-card .card-title { font-size: 0.9rem; } }
.service-card .card-text { font-size: 0.88rem; color: var(--text-secondary); margin: 0; }
@media (max-width: 767.98px) { .service-card .card-text { font-size: 0.82rem; } }
.service-card::after { content: ""; position: absolute; left: 0; bottom: 0; height: 6px; width: 100%; background: linear-gradient(var(--brand) 0%, var(--brand-2) 100%); }

/* Animación al cambiar tabs */
.tab-pane { opacity: 0; transform: translateY(8px); transition: opacity .28s ease, transform .28s ease; }
.tab-pane.show { opacity: 1; transform: none; }

/* ===== FAQ PAGE ===== */
.faq-page .faq-container { background: var(--bg); }
.faq-page .container { max-width: 1100px; margin: 1.5rem auto; padding: 1rem; }
@media(min-width:768px) { .faq-page .container { margin: 2rem auto; padding: 1.5rem; } }
.faq-page header.hero { display: flex; flex-direction: column; gap: 8px; }
.faq-page .eyebrow { color: var(--muted); font-weight: 600; }
.faq-page h1 { margin: 0; color: var(--sand); font-size: 1.8rem; }
@media(min-width:768px) { .faq-page h1 { font-size: 2.2rem; } }
.faq-page p.lead { color: var(--dark); font-size: 0.95rem; }
@media(min-width:768px) { .faq-page p.lead { font-size: 1rem; } }

.faq-page .searchWrap { display: flex; gap: 8px; align-items: center; margin-top: 1rem; }
.faq-page .search { flex: 1; position: relative; }
.faq-page .search input { width: 100%; padding: 10px 40px 10px 12px; border-radius: 10px; border: 1px solid var(--border-input); background: var(--card); box-shadow: var(--shadow); font-size: 0.9rem; }
.faq-page .search .icon { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); opacity: 0.6; }

.faq-page .grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 1rem; }
@media(min-width:880px) { .faq-page .grid { grid-template-columns: 1fr 320px; gap: 16px; margin-top: 1.5rem; } }

.faq-page .faqList { display: flex; flex-direction: column; gap: 8px; }
.faq-page .faqItem { background: var(--card); border-radius: 12px; box-shadow: var(--shadow); overflow: hidden; border: 1px solid rgba(11,18,32,0.04); }
.faq-page .q { display: flex; align-items: center; gap: 10px; padding: 10px 12px; }
@media(min-width:768px) { .faq-page .q { padding: 12px 14px; } }
.faq-page .q button { all: unset; display: flex; align-items: center; gap: 10px; width: 100%; justify-content: space-between; cursor: pointer; }
.faq-page .q .left { display: flex; gap: 10px; align-items: center; }
.faq-page .q .iconWrap { width: 36px; height: 36px; border-radius: 8px; background: linear-gradient(180deg, rgba(15,76,129,0.06), rgba(225,154,102,0.04)); display: flex; align-items: center; justify-content: center; }
.faq-page .q h3 { margin: 0; font-size: 0.92rem; color: var(--navy); font-weight: 600; }
@media(min-width:768px) { .faq-page .q h3 { font-size: 1rem; } }
.faq-page .q p { margin: 0; color: var(--muted); font-size: 0.85rem; }
@media(min-width:768px) { .faq-page .q p { font-size: 0.9rem; } }

.faq-page .panel { padding: 0 12px; max-height: 0; overflow: hidden; transition: max-height 320ms cubic-bezier(.2,.9,.2,1), padding 200ms; }
.faq-page .panel.open { padding: 8px 12px 12px; }
@media(min-width:768px) { .faq-page .panel.open { padding: 10px 14px 16px; } }
.faq-page .panel p { margin: 0; color: var(--text-color); font-size: 0.9rem; line-height: 1.5; }

.faq-page .side { background: linear-gradient(180deg, var(--white), var(--bg-subtle)); padding: 12px; border-radius: 12px; box-shadow: var(--shadow); border: 1px solid rgba(11,18,32,0.04); }
@media(min-width:768px) { .faq-page .side { padding: 14px; } }
.faq-page .side h4 { margin: 0 0 8px 0; color: var(--blue); font-size: 0.95rem; }
.faq-page .cta { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.faq-page .btn { background: var(--blue); color: var(--white); padding: 8px 12px; border-radius: 10px; text-decoration: none; display: inline-block; text-align: center; font-size: 0.9rem; }
.faq-page .btn.secondary { background: transparent; color: var(--blue); border: 1px solid rgba(15,76,129,0.12); }

.faq-page .muted { color: var(--muted); font-size: 0.9rem; }
.faq-page .no-results { padding: 12px; text-align: center; color: var(--muted); font-size: 0.9rem; }

.faq-page .q button:focus { outline: 3px solid rgba(225,154,102,0.16); border-radius: 8px; }
.faq-page .chev { transition: transform 260ms ease; }
.faq-page .open .chev { transform: rotate(180deg); }

/* ===== CONTACT PAGE ===== */
.bi-whatsapp { color: var(--whatsapp) !important; }

/* ===== TOTAL BOX (calculadora) ===== */
#total-box {
	border-radius: 12px;
	border: 1px solid rgba(55,82,135,0.08);
	background: linear-gradient(180deg, rgba(255,255,255,0.98), var(--bg-light));
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 110px;
}
