/* main.css - estilos generales del sitio PROREDSE */

:root{
  --brand:#ff6a00;        /* naranja PROREDSE */
  --brand-dark:#cc5300;
  --ink:#0f172a;          /* slate-900 */
  --muted:#6b7280;        /* gray-500 */
  --nav-bg:#020617;       /* azul muy profundo */
}

/* TIPOGRAFÍA Y FONDO GLOBAL */
html,body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
  color:var(--ink);
  background-color:#f9fafb;
}

/* Spacing más amplio en secciones */
.py-6{
  padding-top:4.5rem;
  padding-bottom:4.5rem;
}
@media (min-width: 992px){
  .py-6{
    padding-top:5.5rem;
    padding-bottom:5.5rem;
  }
  .py-lg-6{
    padding-top:5.5rem !important;
    padding-bottom:5.5rem !important;
  }
}

/* HERO / PORTADA */
.hero{
  background:
    radial-gradient(1200px 600px at 0% 0%, rgba(30,64,175,.12), transparent),
    radial-gradient(1000px 500px at 90% 20%, rgba(15,23,42,.08), transparent),
    #eef2ff;
}

/* Carrusel de portada con altura fija */
.hero-carousel-img {
  height: 360px;
  width: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 16px;
}

.hero-illustration{
  border-radius:24px;
  box-shadow:0 15px 50px rgba(2,6,23,.25);
  background:linear-gradient(135deg,#020617,#111827);
  position:relative;
  overflow:hidden;
}
.hero-illustration::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.08), transparent 40%);
}

/* BOTONES / TEXTOS MARCA */
.navbar-brand strong{letter-spacing:0.5px}
.btn-brand{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-brand:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
.text-brand{color:var(--brand)}
.badge-brand{
  background:rgba(255,106,0,.12);
  color:var(--brand);
  border:1px solid rgba(255,106,0,.25)
}

/* SECCIONES */
.section-title span{
  font-weight:700;
  letter-spacing:.6px;
}
.section-title p{
  max-width:640px;
  margin-left:auto;
  margin-right:auto;
}

/* BULLETS DE CONFIANZA */
.gallery img{
  border-radius:16px;
  box-shadow:0 10px 32px rgba(2,6,23,.12)
}
.check i{color:var(--brand)}
.footer a{text-decoration:none}

/* TARJETAS DE SERVICIOS */
.service-card{
  padding:2.3rem 2.1rem;
  border-radius:24px;
  border:1px solid rgba(15,23,42,.08);
  background:
    radial-gradient(circle at top left, rgba(37,99,235,.08), transparent 55%),
    #ffffff;
  box-shadow:0 18px 40px rgba(15,23,42,.08);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 60px rgba(15,23,42,.18);
  border-color:rgba(37,99,235,.5);
}
.service-icon-wrap{
  width:64px;
  height:64px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:1rem;
  background:radial-gradient(circle at 30% 0, rgba(255,255,255,.9), transparent 60%), #020617;
  box-shadow:0 12px 30px rgba(15,23,42,.7);
}
.service-icon-wrap i{
  font-size:1.6rem;
  color:#f97316;
}
.service-card h5{
  margin-bottom:.45rem;
}
.service-card p{
  font-size:.95rem;
}

/* PROYECTOS: tamaño uniforme */
.project-item{
  margin:0;
}
.project-thumb{
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 32px rgba(2,6,23,.12);
  background:#020617;
  aspect-ratio: 4 / 3;
}
.project-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.project-caption{
  margin-top:.55rem;
}
.project-caption h6{
  font-size:.95rem;
  margin-bottom:.15rem;
}
.project-caption p{
  font-size:.85rem;
  color:#6b7280;
}