.contact-page{
  padding:80px 0;
  padding-bottom:120px;
}

.contact-page .container{
  max-width:1200px;
}

.contact-intro{
  text-align:center;
  margin-bottom:40px;
  color:#666;
}

.contact-grid{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:40px;
  align-items:start;
  
}

/* FORM */
.contact-form-box{
  background:rgba(255,255,255,0.96);

  backdrop-filter:blur(8px);

  padding:48px;

  border-radius:18px;

  box-shadow:
    0 20px 50px rgba(0,0,0,0.12);

  border:1px solid rgba(255,255,255,0.6);
  
  margin-top:-90px;

  position:relative;
  z-index:5;
  transition:0.4s ease;
}

.contact-form-box input,
.contact-form-box textarea{
  width:100%;

  padding:14px 16px;

  margin-bottom:18px;

  border:1px solid rgba(0,0,0,0.08);

  border-radius:12px;

  background:#fff;

  transition:0.3s ease;

  font-size:14px;
}

.contact-form-box input:focus,
.contact-form-box textarea:focus{
  outline:none;

  border-color:rgba(28,53,94,0.18);

  box-shadow:
    0 0 0 4px rgba(28,53,94,0.08);
}

.contact-form-box:hover{
  transform:translateY(-3px);
}

.contact-form-box button{
    margin-top:10px;
    width:100%;
    padding:15px;
    background:linear-gradient(
    135deg,
    #1c355e 0%,
    #27497e 100%
    );
    color:#fff;
    border:none;
    border-radius:12px;
    font-weight:600;
    letter-spacing:0.5px;
    transition:0.3s ease;
    position:relative;
    overflow:hidden;
    }

.contact-form-box button:hover{
  transform:translateY(-2px);

  box-shadow:
    0 10px 20px rgba(28,53,94,0.18);
}

.contact-form-box button::before{
  content:'';

  position:absolute;
  top:0;
  left:-120%;

  width:100%;
  height:100%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,0.18),
    transparent
  );

  transition:0.7s;
}

.contact-form-box button:hover::before{
  left:120%;
}

/* INFO */
.contact-info-box{
  padding:30px;
}

.contact-info-box h5{
  margin-bottom:15px;
}

/* MOBILE */

@media(max-width:768px){

  .contact-grid{
    grid-template-columns:1fr;
  }

  .contact-form-box{
    margin-top:-50px;
  }

}

/* ========================= */
/* HERO CONTACTO */
/* ========================= */

.contact-hero{
  position:relative;

  background:url('../img/hero/contacto-hero.jpg');
  background-size:cover;
  background-position:center;

  padding:110px 0 90px;

  overflow:hidden;
}

.contact-hero-overlay{
  position:absolute;
  inset:0;

  background:linear-gradient(
    180deg,
      rgba(8,24,51,0.82) 0%,
      rgba(8,24,51,0.72) 45%,
      rgba(8,24,51,0.58) 100%
  );

  z-index:1;

}

.contact-hero-content{
  position:relative;
  z-index:2;

  color:#fff;
}

.contact-breadcrumb{
  display:inline-block;

  font-size:13px;
  letter-spacing:1px;

  opacity:0.75;

  margin-bottom:18px;

  text-transform:uppercase;
}

.contact-hero h1{
  font-size:56px;
  font-weight:600;

  margin-bottom:18px;

  max-width:700px;
}

.contact-hero p{
  font-size:18px;
  line-height:1.8;

  max-width:620px;

  color:rgba(255,255,255,0.82);
}

/* MOBILE */
@media(max-width:768px){

  .contact-hero{
    padding:90px 0 70px;
  }

  .contact-hero h1{
    font-size:38px;
  }

  .contact-hero p{
    font-size:16px;
  }

}

.contact-hero::after{
  content:'';

  position:absolute;

  left:0;
  right:0;
  bottom:0;

  height:120px;

  background:linear-gradient(
    to bottom,
    transparent,
    rgba(255,255,255,0.08)
  );

  pointer-events:none;
}

.contact-hero::before{
  content:'';

  position:absolute;
  inset:0;

  background:
    radial-gradient(
      circle at top right,
      rgba(255,255,255,0.08),
      transparent 35%
    );

  z-index:1;
}

/* ========================= */
/* SIDEBAR CONTACTO */
/* ========================= */

.contact-info-box{
  padding-top:20px;
}

.contact-tag{
  display:inline-block;

  padding:8px 14px;

  background:rgba(28,53,94,0.08);

  border-radius:30px;

  font-size:12px;
  font-weight:600;

  letter-spacing:1px;
  text-transform:uppercase;

  color:var(--azul);

  margin-bottom:20px;
}

.contact-info-box h3{
  font-size:38px;
  line-height:1.2;

  margin-bottom:20px;

  color:var(--azul);
}

.contact-side-text{
  color:#5c6470;

  line-height:1.8;

  margin-bottom:35px;

  max-width:420px;
}

.contact-side-items{
  display:flex;
  flex-direction:column;

  gap:18px;

  margin-bottom:40px;
}

.contact-side-items a{
  display:flex;
  align-items:center;

  gap:14px;

  color:var(--azul);

  text-decoration:none;

  font-weight:500;

  transition:0.3s ease;
}

.contact-side-items a:hover{
  transform:translateX(5px);
}

.contact-side-items i{
  color:var(--amarillo);

  font-size:15px;
}

.contact-side-links{
  display:flex;
  gap:15px;
}

.contact-side-links a{
  padding:14px 22px;

  border-radius:12px;

  background:rgba(28,53,94,0.04);

  border:1px solid rgba(0,0,0,0.08);

  text-decoration:none;

  color:var(--azul);

  font-weight:600;

  transition:0.3s ease;
}

.contact-side-links a:hover{
  background:var(--azul);
  color:#fff;
  transform:translateY(-2px);
}

.fade-up{
  opacity:0;
  transform:translateY(40px);
  transition:all 1s ease;
}

.fade-up.show{
  opacity:1;
  transform:translateY(0);
}

/* ========================= */
/* COBERTURA */
/* ========================= */

.coverage-section{
  padding:70px 0;

  background:#f7f9fc;
}

.coverage-grid{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:70px;

  align-items:center;
}

.coverage-tag{
  display:inline-block;

  padding:8px 14px;

  border-radius:30px;

  background:rgba(28,53,94,0.08);

  color:var(--azul);

  font-size:12px;
  font-weight:600;

  letter-spacing:1px;
  text-transform:uppercase;

  margin-bottom:20px;
}

.coverage-content h2{
  font-size:40px;
  line-height:1.2;

  margin-bottom:24px;

  color:var(--azul);

  max-width:580px;
}

.coverage-content p{
  color:#5d6673;

  line-height:1.9;

  margin-bottom:40px;

  max-width:520px;
}

.coverage-stats{
  display:flex;
  gap:40px;

  flex-wrap:wrap;
}

.coverage-stats div{
  display:flex;
  flex-direction:column;
}

.coverage-stats strong{
  font-size:30px;
  color:var(--azul);

  margin-bottom:5px;
}

.coverage-stats span{
  color:#687280;
  font-size:14px;
}

.coverage-map{
  border-radius:22px;

  overflow:hidden;

  box-shadow:
    0 20px 50px rgba(0,0,0,0.10);

    transition:0.4s ease;
}

.coverage-map:hover{
  transform:translateY(-4px);
}

.coverage-map iframe{
  width:100%;
  height:380px;

  border:0;

  filter:grayscale(1) contrast(1.05);
}

/* MOBILE */
@media(max-width:768px){

  .coverage-grid{
    grid-template-columns:1fr;
  }

  .coverage-content h2{
    font-size:40px;
  }

  .coverage-map iframe{
    height:320px;
  }

}

.form-title{
  font-size:30px;

  color:var(--azul);

  margin-bottom:12px;
}

.form-subtitle{
  color:#66707d;

  line-height:1.7;

  margin-bottom:30px;
}

/* ========================= */
/* THANK YOU PAGE */
/* ========================= */

.thanks-section{
  position:relative;

  min-height:calc(100vh - 180px);

  display:flex;
  align-items:center;
  justify-content:center;

  text-align:center;

  overflow:hidden;

  background:url('../img/hero/contacto-hero.jpg');
  background-size:cover;
  background-position:center;
}

.thanks-bg{
  position:absolute;
  inset:0;

  background:linear-gradient(
    180deg,
    rgba(8,24,51,0.84) 0%,
    rgba(8,24,51,0.72) 100%
  );
}

.thanks-content{
  position:relative;
  z-index:2;

  color:#fff;

  max-width:760px;

  padding:80px 0;
}

.thanks-content p{
  max-width:700px;

  margin-left:auto;
  margin-right:auto;
}

.thanks-check{
  width:140px;
  height:140px;

  margin:0 auto 30px;

  border-radius:50%;

  display:flex;
  align-items:center;
  justify-content:center;

  background:rgba(255,255,255,0.08);

  border:1px solid rgba(255,255,255,0.18);

  backdrop-filter:blur(10px);
}

.thanks-check i{
  font-size:68px;

  color:var(--amarillo);
}

.thanks-content h1{
  font-size:64px;

  margin-bottom:12px;
}

.thanks-content h4{
  font-size:28px;

  font-weight:400;

  margin-bottom:28px;

  color:rgba(255,255,255,0.88);
}

.thanks-divider{
  width:90px;
  height:2px;

  background:var(--amarillo);

  margin:0 auto 30px;
}

.thanks-content p{
  font-size:18px;

  line-height:1.9;

  color:rgba(255,255,255,0.78);

  margin-bottom:40px;
}

.thanks-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:16px 34px;

  border-radius:14px;

  text-decoration:none;

  color:#fff;

  background:linear-gradient(
    135deg,
    #1c355e 0%,
    #27497e 100%
  );

  font-weight:600;

  transition:0.35s ease;

  position:relative;
overflow:hidden;
}

.thanks-btn::before{
  content:'';

  position:absolute;

  top:0;
  left:-120%;

  width:100%;
  height:100%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,0.18),
    transparent
  );

  transition:0.7s;
}

.thanks-btn:hover::before{
  left:120%;
}

.thanks-btn:hover{
  transform:translateY(-4px);

  color:#fff;

  box-shadow:
    0 15px 30px rgba(0,0,0,0.18);
}