:root {
  --c0: #371955;  /* violeta principal */
  --c1: #3a3a3a;
  --c2: #182434;
  --c3: #4b4f58;
  --c5: #f5f7f8;
  --c7: #182434;
}

body {
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  line-height: 1.65em;
  color: var(--c3);
}
h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; font-weight: 700; color: var(--c2); line-height: 1em; }
a { color: var(--c0); }

/* ---------- Header ---------- */
.top-bar { background: var(--c7); color: #fff; font-size: 13px; padding: 8px 0; }
.top-bar .social a { font-size: 18px; text-decoration: none; }

.main-nav { background: var(--c0); padding: 5px 0; }
.main-nav .site-title { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 21px; color: #fff; }
.main-nav .nav-link { color: #fff !important; font-family: 'Montserrat', sans-serif; font-weight: 500; padding: 0 1em !important; line-height: 70px; }
.main-nav .nav-link.active, .main-nav .nav-link:hover { color: #dbbfff !important; }
.btn-header {
  background: var(--c0); color: #fff; border: 0; border-radius: 4px;
  font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 12px;
  text-transform: uppercase; letter-spacing: 1px; padding: 14px 28px; line-height: 1em;
}
.btn-header:hover { background: var(--c1); color: #fff; }

/* ---------- Botones ---------- */
.btn-pill {
  border-radius: 50px; font-family: 'Montserrat', sans-serif; font-weight: 600;
  font-size: 12px; padding: 14px 28px; line-height: 1em;
}
.btn-purple { background: var(--c0); color: #fff; border: 0; }
.btn-purple:hover { background: var(--c0); color: #fff; opacity: .9; }
.btn-outline-purple { border: 1px solid var(--c0); color: var(--c0); background: transparent; font-size: 13px; }
.btn-outline-purple:hover { background: var(--c0); color: #fff; }

/* ---------- Hero ---------- */
.hero {
  position: relative; padding: 200px 0 140px;
  background: url('../img/portada-01.jpg') center / cover no-repeat;
}
.hero::before { content: ""; position: absolute; inset: 0; background: var(--c7); opacity: .6; }
.hero h1 { font-size: 48px; line-height: 1em; color: #fff; margin-bottom: 20px; }
.hero .lead-hero { color: #fff; margin-bottom: 40px; }

/* ---------- Boleta ---------- */
.bloque-boleta { background: var(--c0); padding: 40px 0; }
.bloque-boleta p { font-size: 20px; line-height: 1.65em; }
.boleta-img { overflow: hidden; max-width: 450px; }
.boleta-img img { transition: transform .5s ease; }
.boleta-img:hover img { transform: scale(1.1); }

/* ---------- Propuesta ---------- */
.propuesta { background: var(--c5); padding: 100px 0; }
.separator { width: 80px; border-top: 6px solid var(--c0); margin-bottom: 20px; }
.propuesta .prefix { font-family: 'Amiri', serif; font-weight: 700; font-size: 16px; color: var(--c0); margin: 5px 0 10px; line-height: 1.3em; }
.propuesta h6.title-purple { font-size: 36px; line-height: 1.3em; margin-bottom: 20px; }
.title-purple { color: var(--c0) !important; }
.propuesta h4 { font-size: 22px; line-height: 1.2em; margin-bottom: 15px; }

/* ---------- Contador ---------- */
#contador {
  padding: 100px 40px;
  background: linear-gradient(90deg, rgba(24,36,52,1) 0%, rgba(84,7,166,1) 60%, rgba(55,25,85,1) 100%);
}
#contador, #contador * {
  font-family: 'Montserrat', sans-serif; color: #fff; font-weight: 600;
  text-transform: uppercase; font-size: 15px;
}
#contador .counter-icon { font-size: 32px; display: block; line-height: 1; }
#contador .counter-number, #contador .counter-number * { font-size: 26px; margin: 10px 0; }

/* ---------- Novedades ---------- */
.novedades { background: #fff; padding: 60px 0; }
.novedades h2 { font-size: 36px; line-height: 1.3em; }
.separator-center { width: 70px; border-top: 3px solid var(--c0); }
.post-card { background: #f6f6f6; text-align: center; height: 100%; padding-bottom: 20px; }
.post-card .post-img { display: block; aspect-ratio: 930 / 610; overflow: hidden; margin-bottom: 25px; }
.post-card .post-img img { width: 100%; height: 100%; object-fit: cover; }
.post-card h4 { font-size: 17px; line-height: 1.2em; padding: 0 20px 10px; }
.post-card h4 a { color: var(--c2); text-decoration: none; }
.post-card h4 a:hover { color: var(--c0); }
.post-card .btn-vermas {
  background: var(--c0); color: #fff; border-radius: 50px; font-size: 15px;
  padding: calc(.667em + 2px) calc(1.333em + 2px); text-decoration: none; display: inline-block; line-height: 1.65em;
}
.post-card .btn-vermas:hover { opacity: .9; color: #fff; }
.carousel-arrow {
  position: absolute; top: 40%; width: 36px; height: 36px; background: transparent;
  border: 2px solid var(--c0); color: var(--c0); z-index: 5; display: flex; align-items: center; justify-content: center;
}
.carousel-arrow.prev { left: -45px; }
.carousel-arrow.next { right: -45px; }
#novedadesDots [data-bs-target] { width: 8px; height: 8px; border-radius: 50%; background: var(--c0); border: 0; }
@media (max-width: 1290px) {
  .carousel-arrow.prev { left: 0; }
  .carousel-arrow.next { right: 0; }
}

/* ---------- Mi historia ---------- */
.page-hero {
  position: relative; padding: 70px 0; color: #fff;
  background: url('../img/about-bg.jpg') center / cover no-repeat;
}
.page-hero::before { content: ""; position: absolute; inset: 0; background: var(--c0); opacity: .6; }
.page-hero h1 { color: #fff; font-size: 55px; line-height: 1.4em; margin-bottom: 20px; }
.separator-white { width: 80px; border-top: 4px solid #fff; margin-bottom: 20px; }
.sobre-mi { background: var(--c5); padding: 100px 0 60px; }
.sobre-mi h2 { font-size: 36px; line-height: 1.3em; margin-bottom: 20px; }
.sobre-mi .sobre-desc { margin-bottom: 40px; }
.img-shadow-purple { box-shadow: 20px -20px 0 0 var(--c0); }
.share-bar { display: flex; gap: 4px; padding: 30px 12px; }
.share-bar a {
  width: 32px; height: 32px; border-radius: 4px; color: #fff; font-size: 18px;
  display: inline-flex; align-items: center; justify-content: center; text-decoration: none;
}
.share-bar a:hover { opacity: .75; }

/* ---------- Página Novedades ---------- */
.page-novedades { background: #fff; padding: 4em 0; }
.post-list { display: grid; gap: 20px; grid-template-columns: 1fr; }
.post-item { display: flex; background: #f6f6f6; padding: 20px; gap: 20px; }
.post-item .post-thumb { flex: none; width: 35%; display: block; overflow: hidden; }
.post-item .post-thumb img { width: 100%; height: auto; display: block; }
.post-item .post-body { display: flex; flex-direction: column; justify-content: center; }
.post-item h4 { font-size: 20px; line-height: 1.3em; margin-bottom: 15px; }
.post-item h4 a { color: var(--c2); text-decoration: none; }
.post-item h4 a:hover { color: var(--c0); }
.post-item p { margin-bottom: 25px; }
.post-item .btn-vermas {
  align-self: flex-start; background: var(--c0); color: #fff; border-radius: 30px; text-decoration: none;
  padding: calc(.667em + 2px) calc(1.333em + 2px); line-height: 1.65em;
}
.post-item .btn-vermas:hover { opacity: .9; color: #fff; }
.share { display: flex; gap: 6px; margin-top: 30px; }
.share a { width: 32px; height: 32px; border-radius: 4px; color: #fff; display: flex; align-items: center; justify-content: center; text-decoration: none; }
@media (min-width: 768px) and (max-width: 991.98px) {
  .post-list { grid-template-columns: repeat(2, 1fr); }
  .post-item { flex-direction: column; }
  .post-item .post-thumb { width: 100%; }
}
@media (max-width: 767.98px) {
  .post-item { flex-direction: column; }
  .post-item .post-thumb { width: 100%; }
}

/* ---------- Footer ---------- */
.site-footer { background: var(--c1); color: #fff; text-align: center; padding: 20px 0; }

/* ---------- Contacto ---------- */
.contacto-info { background: var(--c5); padding: 100px 0 60px; }
.contact-card { background: #fff; padding: 40px 25px; border-radius: 8px; box-shadow: 0 10px 30px rgba(55,25,85,.12); transition: transform .3s; }
.contact-card:hover { transform: translateY(-5px); }
.contact-card i { font-size: 40px; color: var(--c0); display: block; margin-bottom: 15px; }
.contact-card h4 { font-size: 22px; margin-bottom: 12px; }
.contact-card a { text-decoration: none; word-break: break-word; }
.redes { margin-top: 80px; }
.redes h2 { font-size: 32px; }
.redes a { width: 50px; height: 50px; border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 22px; transition: opacity .3s; }
.redes a:hover { opacity: .85; color: #fff; }

/* ---------- Scroll top ---------- */
#scroll-top {
  position: fixed; right: 30px; bottom: 30px; width: 2.1em; height: 2.1em; font-size: 21px;
  border: 0; border-radius: 50%; background: var(--c3); color: #fff; display: none; z-index: 99;
}

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
  .main-nav .nav-link { line-height: 3em; }
  .main-nav .navbar-brand img { width: 50px; height: 50px; }
  .top-bar .container-xl { flex-direction: column; gap: 4px; text-align: center; }
  .hero { padding: 120px 0 90px; }
  .propuesta h6.title-purple { font-size: 25px; }
  .page-hero h1 { font-size: 30px; }
  .sobre-mi h2 { font-size: 25px; }
}
@media (max-width: 575.98px) {
  .hero h1 { font-size: 30px; }
  .novedades h2 { font-size: 25px; }
}
