/* ===== Paleta celeste =====
   primary: --primary (céfleo / celeste)
   dark: --primary-dark
   light background: --bg-light
*/
:root{
  --primary: #00A8E8;       /* celeste vibrante */
  --primary-dark: #0288D1;  /* celeste oscuro */
  --bg-light: #f3fbff;      /* fondo muy claro */
  --muted: #6b7c86;
  --text: #0f2a36;
}

/* --- Fuentes (mantengo Jost / Roboto como pediste) --- */
body{
  font-family: 'Jost', 'Roboto', sans-serif;
  color: var(--text);
  background: white;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Small utility font weights to match tu plantilla */
.jost-bold { font-weight:700; }
.jost-semibold { font-weight:600; }
.jost-medium { font-weight:500; }
.jost-regular { font-weight:400; }

/* TOP BAR */
.main-nav{
  background: linear-gradient(90deg, var(--primary-dark), rgba(0,168,232,0.85));
  color: #fff;
}
.main-nav a { color: #fff; opacity:0.95; }
.main-nav .top-left, .main-nav .top-center, .main-nav .top-right{
  font-size: 0.95rem;
}

/* NAVBAR */
.header-section .navbar{
  padding: 0.9rem 0;
  background: transparent;
}

/* Nuevo estilo para el logo de la web */
.logo-image {
  height: 40px;
  max-width: 100%;
}

.logo-icon{
  color: var(--primary);
  font-size: 1.6rem;
}
.logo-text{
  font-weight:700;
  color: var(--text);
  font-size:1.1rem;
}

/* Hero / Banner */
.home-banner-section{
  background: linear-gradient(180deg, rgba(0,168,232,0.07), rgba(0,168,232,0.02));
  padding: 4rem 0;
}
.home-banner-section .subtitle{
  color: var(--primary-dark);
  font-weight:600;
}
.home-banner-section h1{
  font-size: 2.4rem;
  color: var(--text);
}
.home-banner-section .underline{
  color: var(--primary-dark);
  border-bottom: 5px solid rgba(0,168,232,0.12);
}
.home-banner-section .lead{
  color: var(--muted);
}
.appointment-btn{
  background: var(--primary);
  border: none;
  color: white;
  padding: 0.6rem 1.1rem;
  border-radius: 6px;
  font-weight:600;
}
.btn-outline-light{
  color: var(--primary-dark);
  border-color: rgba(2,136,209,0.1);
}

/* EXP-CONTACT */
.section-padding{ padding: 3.2rem 0; }
.exp-contact-section h3, .exp-contact-section h6{ color: var(--text); }
.stat-number{ font-size:2.6rem; color:var(--primary-dark); font-weight:700; }
.stat-plus{ color:var(--primary); font-weight:600; margin-left:4px; }
.stat-plus-animated {
  font-size: 2.2rem;
  color: var(--primary);
  font-weight: 600;
  vertical-align: top;
  margin-left: -5px;
}
.video-cover{ position: relative; }
#playVideo{ position:absolute; top:40%; left:10%; color:#fff; background:rgba(2,88,120,0.6); padding:10px; border-radius:8px; display:flex; flex-direction:column; align-items:center;}

/* Schedule cards */
.schedule-section{ background: var(--bg-light); }
.schedule-card{
  background: #fff;
  border-radius: 10px;
  padding: 2rem 1rem;
  box-shadow: 0 6px 18px rgba(3,32,40,0.06);
  margin: 1rem 0;
  min-height: 220px;
  position: relative;
}
.schedule-no{
  position:absolute; top:14px; left:14px; font-weight:700; color: rgba(2,88,120,0.45);
  font-size:1.6rem;
}
.service-icon{
  color: var(--primary-dark);
  display:inline-block;
  padding: 12px;
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(0,168,232,0.08), rgba(2,136,209,0.03));
}

/* Info boxes */
.info-pill{
  display:inline-block;
  background: rgba(0,168,232,0.06);
  padding: 8px 12px;
  border-radius: 30px;
  margin: 6px;
  font-weight:600;
  color:var(--primary-dark);
}

/* Simple lists */
.simple-list{ list-style: none; padding-left:0; }
.simple-list li{ text-align: left; margin:6px 0; color:var(--muted); }

/* Benefits list */
.benefits-list{ margin-top: 1.5rem; }
.benefit-item{ width: 140px; padding: 16px; margin: 8px; border-radius:8px; background: rgba(255,255,255,0.9);}
.benefit-item i{ color: var(--primary-dark); }
.benefit-item div{ margin-top:8px; font-weight:600; color:var(--text); }

/* Appointment form */
.appointment-form .form-control{ border-radius: 6px; }
.appointment-btn{ min-width: 170px; }

/* Team */
.team-card{ background: #fff; padding: 1rem; border-radius:8px; box-shadow: 0 6px 18px rgba(3,32,40,0.04); }
.team-card img{ border-radius:8px; }
.team-card .socials a{ margin-right:8px; color:var(--primary-dark); }

/* Animated Border */
.team-card img,
.card-blog img,
.home-info-section img {
  border: 4px solid transparent;
  transition: border-color 0.3s ease-in-out;
  box-sizing: border-box;
}

.team-card:hover img,
.card-blog:hover img,
.home-info-section img:hover {
  border-color: var(--primary);
}

/* Blogs & cards */
.card-blog{ background:#fff; border-radius:8px; overflow:hidden; box-shadow: 0 6px 18px rgba(3,32,40,0.04); margin-bottom:1.2rem; }
.card-blog img{ width:100%; }

/* CTA time table */
.time-table-section{ background: linear-gradient(90deg, rgba(0,168,232,0.06), rgba(2,136,209,0.03)); padding:2.5rem 0; }

/* Footer */
.footer-section{ background: linear-gradient(180deg, rgba(2,88,120,0.04), rgba(0,0,0,0.02)); padding: 2.5rem 0; color:var(--muted); }
.footer-section h5, .footer-section h6{ color: var(--text); }
.footer-section .footer-social-icons a { color: var(--muted); }

/* Raised Button Style */
.btn-raised {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.btn-raised:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
}

/* Payment Icons */
.payment-methods {
  display: flex;
  align-items: center;
  gap: 10px;
}

.payment-methods i {
  font-size: 2.2rem;
  color: var(--muted);
}

.payment-methods img {
  height: 30px;
  width: auto;
}

/* Responsive tweaks */
@media (max-width: 767px){
  .home-banner-section h1{ font-size: 1.75rem; }
  .schedule-card{ min-height: auto; padding:1.4rem; }
}
/* =========================================
   ESTILOS: CRÉDITO DEL PROYECTO (FOOTER)
   ========================================= */

/* Estilos para el contenedor principal para centrar y alinear */
.footer-content {
    display: flex;
    flex-direction: column; /* Apila los elementos verticalmente */
    align-items: center; /* Centra horizontalmente */
    text-align: center;
    padding: 20px 0; /* Espaciado extra en la parte inferior del footer */
}

/* Contenedor de la información primaria (Copyright y RRSS del Cliente) */
.footer-primary-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 800px; /* Limita el ancho del contenido principal si es necesario */
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(107, 124, 134, 0.1); /* Línea divisoria sutil */
}

/* Estilo para la línea de atribución de Nexento */
.project-credit {
    font-size: 0.75rem; /* Más pequeño para ser discreto */
    color: var(--muted); /* Texto gris */
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.project-credit a {
    color: var(--primary); /* Color de acento del proyecto (celeste) */
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s;
}

.project-credit a:hover {
    color: var(--primary-dark);
}

/* Contenedor de los iconos sociales de Nexento */
.nexento-social-credit a {
    color: var(--muted); /* Iconos grises */
    font-size: 0.9rem; /* Tamaño discreto */
    margin-left: 5px;
    opacity: 0.8;
}

.nexento-social-credit a:hover {
    color: var(--primary); /* Color de acento al pasar el ratón */
    opacity: 1;
}

/* Media Query para móvil */
@media (max-width: 600px) {
    .footer-primary-info {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    .footer-primary-info p {
        order: 2; /* Mueve el copyright debajo de las RRSS */
        margin: 0;
    }
    .social-links {
        order: 1;
        margin-bottom: 5px;
    }
    .project-credit {
        flex-wrap: wrap; /* Asegura que no se desborde */
        justify-content: center;
    }
}