.oculto {

  display: none;

}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:'Lora', serif;
  background:#f7efe5;
  color:#3d2419;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

a{
  text-decoration:none;
  color:inherit;
}

/* NAVBAR */

.navbar{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index:100;
  height:75px;
  padding:0 70px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:rgba(255,248,240,0.40);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(120,70,40,0.06);
}

.logo{
  display:flex;
  align-items:center;
  gap:10px;
}

.logo-image{
  width:70px;
  height:70px;
  object-fit:contain;
  display:block;
  flex-shrink:0;
}

.logo-text{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.logo-text h2{
  font-family:'Cinzel', serif;
  font-size:2rem;
  line-height:0.9;
  letter-spacing:1.8px;
  color:#3b2416;
  margin:0;
  font-weight:500;
}

.logo-text span{
  display:block;
  margin-top:4px;
  font-family:'Cinzel', serif;
  font-size:0.8rem;
  letter-spacing:1.5px;
  color:#23140b;
  line-height:1;
}

.nav-links{
  display:flex;
  gap:34px;
  font-family:'Cinzel', serif;
}

.nav-links a{
  letter-spacing:1.5px;
  font-size:0.68rem;
  transition:0.3s ease;
}

.nav-links a:hover{
  opacity:0.7;
}

.btn-login{
  background:#8d2d1e;
  color:white;
  padding:05px 34px;
  border-radius:999px;
  font-family:'Cinzel', serif;
  letter-spacing:1px;
  transition:0.3s ease;
}

/* HERO */

.hero{
  min-height:520px;

  background:
    linear-gradient(
      rgba(255,248,240,0.10),
      rgba(255,248,240,0.08)
    ),
    url("images/hero.jpg") center/cover no-repeat;

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

  padding:115px 20px 55px;

  position:relative;
  overflow:hidden;
}

.hero-content{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1450px;
}

.hero-logo{
  width:auto;
  margin:0 auto 15px;
  text-align:center;
  transform:translateY(-20px)
}

.hero-logo-img{
  display:block;
  width:110px;
  height:auto;
  margin:0 auto -40px;
  opacity:0.95;
}

.hero-logo{
  text-align:center;
}

.hero-logo h3{
  font-family:'Cinzel', serif;
  font-size:1.8rem;
  line-height:0.65;
  color:#7b4c24;
  margin:0;
  text-align:center;
}

.hero-logo .tao{
  display:inline-block;
  font-size:1.05em;
  font-weight:600;
  letter-spacing:12px;
  padding-left:12px; /* compensa el espacio extra */
}

.hero-logo .con{
  display:inline-block;
  font-size:0.35em;
  font-weight:300;
  letter-spacing:3px;
}

.hero-logo .con-line{
  letter-spacing:0;
  font-size:0.35em;
  color:#9a7448;
}

.hero-logo .sharon{
  display:inline-block;
  font-size:0.60em;
  font-weight:400;
  letter-spacing:2px;
}

.hero-title{
  font-family:'Cormorant Garamond', serif;
  font-size:2.5rem;
  line-height:1.03;
  margin-bottom:14px;
  text-transform:uppercase;
  font-weight:500;
  color:#2f1a11;
  max-width:1450px;
  margin-inline:auto;
}

.hero-subtitle{
  font-family:'Cinzel', serif;
  letter-spacing:5px;
  text-transform:uppercase;
  font-size:0.82rem;
  color:#5d3d2c;
  margin-bottom:18px;
}

.hero-text{
  max-width:520px;
  margin:0 auto 24px;
  line-height:1.55;
  font-size:0.98rem;
}

.hero-buttons{
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
}

.btn{
  padding:14px 34px;
  border-radius:999px;
  transition:0.3s ease;
  font-family:'Cinzel', serif;
  letter-spacing:1px;
  text-transform:uppercase;
  font-size:0.74rem;
}

.btn-primary{
  background:#611b17;
  color:white;
}

.btn-secondary{
  border:1px solid #d1b28e;
  background:rgba(255,255,255,0.7);
  color:#5a3b2d;
}

/* FEATURES */

.features{
  background:#f1e0ce;
  padding:34px 80px;
  display:grid;
  grid-template-columns:repeat(6,1fr);
}

.feature{
  text-align:center;
  padding:8px 34px;
  border-right:1px solid rgba(120,70,40,0.16);
}

.feature:last-child{
  border-right:none;
}

.feature-icon{
  font-size:2.4rem;
  color:#b8893f;
  margin-bottom:10px;
}

.feature h3{
  font-family:'Cinzel', serif;
  font-size:0.86rem;
  line-height:1.35;
  margin:12px 0;
  color:#5c3d2d;
}

.feature p{
  line-height:1.45;
  color:#6b5143;
  font-size:0.78rem;
}

/* COURSE SECTION */

.course-section{
  display:grid;
  grid-template-columns:40% 60%;
  height:220px;
  border-top:1px solid rgba(120,70,40,0.12);
}

/* LEFT IMAGE */

.course-image{
  height:220px;
  min-height:0;
}

.course-image video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
}

/* RIGHT SIDE */

.course-info{
  height:220px;
  min-height:0;

  display:flex;
  align-items:center;

  overflow:hidden;

  background:
    linear-gradient(
      90deg,
      rgba(243,228,212,0.96) 0%,
      rgba(243,228,212,0.90) 22%,
      rgba(243,228,212,0.58) 48%,
      rgba(243,228,212,0.08) 100%
    ),
    url("images/course-right.jpg")
    center center
    no-repeat;

  background-size:cover;
}

/* TEXT OVER IMAGE */

.course-content{
  width:100%;

  padding:42px 70px;

  position:relative;
  z-index:2;
}

.course-content small{
  font-family:'Cinzel', serif;
  letter-spacing:2px;
  color:#a07858;
  font-size:0.8rem;
}

.course-content h2{
  font-family:'Cormorant Garamond', serif;
  font-size:2.35rem;
  line-height:1;
  margin:10px 0 6px;
  color:#611b17;

  white-space:nowrap;

  max-width:900px;
}

.course-content h3{
  font-family:'Cinzel', serif;
  font-size:0.76rem;
  letter-spacing:1.6px;
  line-height:1.4;
  color:#765441;
  margin-bottom:16px;
  font-weight:400;

  white-space:nowrap;
}

.course-content p{
  line-height:1.55;
  color:#5f4638;
  margin-bottom:10px;
  max-width:470px;
  font-size:0.70rem;
  transform:translateY(-4px)
}

.course-content .btn{
  width:max-content;
  padding:08px 20px;
  margin-bottom:12px;
}

.footer-bar{
  background:
    linear-gradient(
      90deg,
      #4a120d,
      #66180f,
      #4a120d
    );

  color:#b89463;

  text-align:center;

  padding:12px 20px;

  font-family:'Cinzel', serif;

  font-size:0.72rem;

  letter-spacing:3px;

  text-transform:uppercase;

  display:flex;
  justify-content:center;
  align-items:center;
  gap:35px;

  border-top:1px solid rgba(212,170,98,.15);
}

.footer-divider{
  color:rgba(184,148,99,.35);
  font-size:1.1rem;
}

.footer-item{
  white-space:nowrap;
}

/* MOBILE */
.menu-toggle{
  display:none;
  font-size:2rem;
  cursor:pointer;
}

@media(max-width:1024px){

  .course-section{
    grid-template-columns:1fr;
  }

  .course-info{
    min-height:420px;
  }

  .course-content h2{
    white-space:normal;
  }

  .course-content h3{
    white-space:normal;
  }

}

@media(max-width:768px){

.navbar{
  height:auto;
  padding:10px 20px;
  flex-wrap:wrap;
  display:flex;
  align-items:center;
}

  .logo-image{
    width:46px;
    height:46px;
  }

  .logo-text h2{
    font-size:1.7rem;
  }

  .logo-text span{
    font-size:0.48rem;
    letter-spacing:1.2px;
  }

 .menu-toggle{
  display:block;
  margin-left:auto;
  margin-right:10px;
  font-size:2rem;
  cursor:pointer;
}

  .nav-links{
    width:100%;
    display:none;
    flex-direction:column;
    gap:20px;
    padding-top:20px;
    text-align:center;
  }

  .nav-links.active{
    display:flex;
  }

  .hero{
    min-height:620px;
    padding:130px 20px 70px;
  }

  .hero-title{
    font-size:2.2rem;
  }

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

  .feature{
    border-right:none;
    border-bottom:1px solid rgba(120,70,40,0.12);
  }

  /* Corrección sección I Ching */

  .course-section{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
    height:auto;
    position:relative;
    clear:both;
  }

  .course-image{
    position:relative;
    width:100%;
  }

  .course-info{
    position:relative;
    width:100%;
    height:auto;
    min-height:420px;
  }

  .course-content{
    padding:40px 30px;
  }

  .course-content h2{
    font-size:2rem;
  }

  /* Footer */

  .footer-bar{
    display:flex;
    position:relative;
    width:100%;
    height:auto;
    min-height:90px;
    padding:25px 20px;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:8px;
    text-align:center;
    box-sizing:border-box;
    clear:both;
    z-index:10;
  }

  .footer-item{
    display:block;
    width:100%;
    font-size:0.75rem;
    line-height:1.4;
  }

  .footer-divider{
    display:none;
  }

  @media(max-width:768px){

  .btn-login{
    display:none;
  }

}
}

/* ABOUT PAGE */

.about-hero{
  min-height:520px;

  background:
    radial-gradient(
      ellipse at 20% 53%,
      rgba(255,245,232,0.95) 0%,
      rgba(255,245,232,0.82) 26%,
      rgba(255,245,232,0.45) 42%,
      rgba(255,245,232,0.12) 58%,
      rgba(255,245,232,0) 72%
    ),
    url("images/about-hero.jpg") center/cover no-repeat;

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

  padding:120px 120px 70px;

  position:relative;
}

.about-hero-content{
  max-width:620px;
  text-align:center;

  position:relative;
  z-index:2;

  padding:45px 55px;

  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.about-hero-content small{
  font-family:'Cinzel', serif;
  letter-spacing:2px;
  color:#5d3d2c;
}

.sello {

    width: 100px;
    opacity: 0.9;
    margin: 30px auto 20px;
    display: block;

}
.con-line-about{
  letter-spacing:0;
  font-size:0.35em;
  color:#9e6625;
}

.about-hero-content h1{
  font-family:'Cormorant Garamond', serif;
  font-size:3rem;
  line-height:1;
  text-transform:uppercase;
  font-weight:500;
  color:#2f1a11;
}

.about-hero-content h2{
  font-family:'Cinzel', serif;
  font-size:0.8rem;
  letter-spacing:2px;
  color:#b0724e;
  margin:14px 0 24px;
}

.about-hero-content p{
  max-width:560px;
  margin:0 auto 28px;
  line-height:1.8;
  font-size:0.70rem;
}

.about-quote{
  max-width:260px;
  text-align:center;
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-size:1.2rem;
  line-height:1.6;
  color:#fff7f4;
  margin-right:60px;
}

.about-quote span{
  font-size:4rem;
  color:rgba(255,255,255,0.75);
}

/* MAIN ABOUT */

.about-main{
  display:grid;
  grid-template-columns:50% 50%;
  background:#f2e2d4;
  padding:36px 55px 40px;
  gap:30px;
  align-items:start;
}

.about-values{
  text-align:center;
}

.about-values h2,
.about-story h2{
  font-family:'Cinzel', serif;
  font-size:1.1rem;
  letter-spacing:1px;
  color:#2f1a11;
  margin:0;
}

.section-mark{
  color:#8d2d1e;
  margin:8px 0 24px;
}

.values-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:0;
  align-items:start;
}

.value-card{
  padding:8px 12px;
  border-right:1px solid rgba(120,70,40,0.15);
}

.value-card:last-child{
  border-right:none;
}

.value-icon{
  font-size:1.7rem;
  color:#b8893f;
  margin-bottom:10px;
}

.value-card h3{
  font-family:'Cinzel', serif;
  font-size:0.68rem;
  line-height:1.35;
  color:#4b3023;
  margin:0 0 14px;
}

.value-card p{
  font-size:0.62rem;
  line-height:1.55;
  color:#5b4538;
  margin:0;
}

/* STORY */

.about-story{
  display:grid;
  grid-template-columns:1.9fr 0.9fr;
  gap:25px;
  border-left:1px solid rgba(120,70,40,0.15);
  padding-left:35px;
  align-items:start;
}

.story-text{
  max-width:none;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.story-text p{
  font-size:0.64rem;
  line-height:1.55;
  margin:0 0 12px;
  color:#4b3629;
}

.signature{
  font-family:'Allura', cursive;
  font-style:italic;
  color:#8d2d1e;
  font-size:1.3rem !important;
  line-height:1.3 !important;
  margin-top:18px !important;
  margin-bottom: 0px !important;
}

.story-lotus img {

  width:80px;
  height:auto;
  display:block;
  margin:0px 0 0;
  opacity:.3;
}

.story-image{
  width:180px;
  height:240px;
  border-radius:50%;

  background:
    url("images/about-circle.jpg")
    center/cover;

  border:2px solid rgba(120,70,40,0.12);
  margin:0 auto;
}

/* ABOUT FOOTER */

.about-footer{
  background:
    linear-gradient(
      90deg,
      #4a120d,
      #66180f,
      #4a120d
    );

  color:#e9d7c4;

  padding:30px 60px;

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

  font-family:'Cinzel', serif;
  letter-spacing:3px;
  font-size:0.65rem;
}

.footer-cta{
  background:#e2c7af;
  color:#4b3023;
  padding:10px 24px;
  border-radius:6px;
  display:flex;
  align-items:center;
  gap:30px;
  letter-spacing:0;
  font-family:'Lora', serif;
}
.btn-about {
padding: 06px 34px;
border-radius: 999px;
transition: 0.3s ease;
font-family: 'Cinzel', serif;
letter-spacing: 1px;
text-transform: uppercase;
font-size: 0.74rem;
background:#611b17;
color:white;
}

/* ACTIVE MENU */

.nav-links a.active{
  color:#8d2d1e;
  border-bottom:1px solid #8d2d1e;
  padding-bottom:8px;
}

/* RESPONSIVE ABOUT */

@media(max-width:1200px){

  .about-main{
    grid-template-columns:1fr;
  }

  .about-story{
    border-left:none;
    padding-left:0;
  }

}

@media(max-width:1024px){

  .values-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .about-footer{
    flex-direction:column;
    gap:20px;
    text-align:center;
  }

}

@media(max-width:768px){

.about-hero{
  padding:130px 30px 70px;
  flex-direction:column;
  text-align:center;

  background-size:cover;
  background-position:55% center;
  background-repeat:no-repeat;
}

  .about-hero-content h1{
    font-size:2.8rem;
  }

  .about-quote{
    margin:40px 0 0;
  }

  .about-main{
    padding:50px 30px;
  }

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

  .value-card{
    border-right:none;
    border-bottom:1px solid rgba(120,70,40,0.15);
  }

  .about-story{
    grid-template-columns:1fr;
  }

  .story-image{
    width:180px;
    height:240px;
  }

  .footer-cta{
    flex-direction:column;
  }

.about-hero .btn,
.about-hero .btn-primary{
  display:inline-flex;
  justify-content:center;
  align-items:center;

  width:90%;
  max-width:340px;
  min-width:0;

  min-height:60px;
  padding:18px 20px;

  text-align:center;
  white-space:nowrap;
  line-height:1;

  box-sizing:border-box;
}

}

/* ===============================
   CURSOS HERO
=============================== */

.cursos-hero{
  min-height:200px;

  background:
    radial-gradient(
      circle at center,
      rgba(247,239,229,0.75) 0%,
      rgba(247,239,229,0.45) 35%,
      rgba(247,239,229,0.15) 45%,
      rgba(247,239,229,0) 65%
   ),
    url("images/cursos-hero.jpg")
    center/cover
    no-repeat;

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

  text-align:center;

  padding:125px 20px 60px;

  position:relative;
  background-position:center 40%;
}

.cursos-hero-content{
  max-width:900px;
}

.cursos-lotus{
  color:#8d2d1e;
  font-size:0.8rem;
  margin-bottom:10px;
}

.cursos-hero h1{
  font-family:'Cormorant Garamond', serif;
  font-size:3.0rem;
  line-height:1;
  font-weight:500;
  letter-spacing:12px;
  color:#2f1a11;
  margin-bottom:18px;
}

.cursos-divider{
  width:330px;
  height:1px;
  background:#b8893f;
  margin:0 auto 22px;
  position:relative;
}

.cursos-divider::before,
.cursos-divider::after{
  content:"";
  width:8px;
  height:8px;
  background:#b8893f;
  position:absolute;
  top:-4px;
  transform:rotate(45deg);
}

.cursos-divider::before{
  left:48%;
}

.cursos-divider::after{
  right:48%;
}

.cursos-hero p{
  max-width:650px;
  margin:auto;
  line-height:1.8;
  color:#4b3629;
  font-size:1rem;
}

/* ===============================
   FILTER
=============================== */

.cursos-filter{
  max-width:960px;

  margin:-28px auto 45px;

  background:rgba(255,248,240,0.96);

  border:1px solid rgba(120,70,40,0.12);

  border-radius:999px;

  display:flex;
  justify-content:center;

  overflow:hidden;

  position:relative;
  z-index:10;

  box-shadow:
  0 10px 35px rgba(50,20,10,0.06);
}

.cursos-filter a{
  padding:15px 28px;

  font-family:'Cinzel', serif;

  font-size:0.66rem;

  letter-spacing:1.2px;

  text-transform:uppercase;

  color:#4b3023;

  border-right:1px solid rgba(120,70,40,0.10);
}

.cursos-filter a:last-child{
  border-right:none;
}

.cursos-filter a.active{
  background:#8d2d1e;
  color:white;
  border-radius:999px;
}

/* ===============================
   GRID
=============================== */

.cursos-grid{
  max-width:1350px;

  margin:auto;

  padding:0 10px 60px;

  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:28px;
}

/* ===============================
   COURSE CARD
=============================== */

.curso-card{
  background:
    linear-gradient(
      180deg,
      #fff7ee 0%,
      #f4dfc9 100%
    );

  border:1px solid rgba(120,70,40,0.14);

  border-radius:18px;

  overflow:hidden;

  text-align:center;

  box-shadow:
  0 15px 35px rgba(70,35,15,0.08);

  transition:0.3s ease;
}

.curso-card:hover{
  transform:translateY(-6px);
}

.curso-img{
  height:200px;

  background-size:cover;
  background-position:center;

  position:relative;
}

.curso-badge{
  position:absolute;

  top:14px;
  left:14px;

  background:#4a120d;

  color:white;

  font-family:'Cinzel', serif;

  font-size:0.6rem;

  letter-spacing:1px;

  padding:8px 12px;

  text-transform:uppercase;
}

.curso-icon{
  width:60px;
  height:60px;

  border-radius:50%;

  background:#8d2d1e;

  color:white;

  border:2px solid #f7efe5;

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

  font-size:1.5rem;

  margin:-30px auto 14px;

  position:relative;
  z-index:2;
}

.curso-icon.gold{
  background:#b8893f;
}

.curso-content{
  padding:0 24px 28px;
}

.curso-content h2{
  font-family:'Cormorant Garamond', serif;

  font-size:1.3rem;

  line-height:1;

  color:#8d2d1e;

  text-transform:uppercase;

  font-weight:700;

  margin-bottom:8px;
}

.curso-subtitle{
  font-family:'Cinzel', serif;

  font-size:0.55rem;

  letter-spacing:1.2px;

  line-height:1.5;

  text-transform:uppercase;

  color:#6b5143;

  margin-bottom:14px;
}

.curso-content p{
  font-size:0.70rem;

  line-height:1.7;

  color:#4b3629;

  min-height:8px;

  margin-bottom:10px;
}

.curso-meta{
  border-top:1px solid rgba(120,70,40,0.12);

  padding-top:10px;

  margin-bottom:22px;

  display:flex;
  justify-content:center;
  gap:13px;
  flex-wrap:wrap;
}

.curso-meta span{
  font-family:'Cinzel', serif;

  font-size:0.50rem;

  letter-spacing:0.8px;

  color:#5f4638;

  text-transform:uppercase;

  font-weight:500;
}

.curso-btn{
  display:inline-block;

  background:#8d2d1e;

  color:white;

  padding:8px 40px;

  border-radius:999px;

  font-family:'Cinzel', serif;

  font-size:0.66rem;

  letter-spacing:1px;

  text-transform:uppercase;
}

.curso-btn.gold{
  background:#b8893f;
}

/* ===============================
   BENEFITS
=============================== */

.cursos-benefits{
  background:
    linear-gradient(
      rgba(246,237,226,0.45),
      rgba(246,237,226,0.45)
    ),
    url("images/loto-agua.jpg")
    center/cover
    no-repeat;

  padding:20px 70px 45px;

  border-top:1px solid rgba(120,70,40,0.08);
  max-height: 400px;
}

.benefits-grid{
  max-width:1400px;

  margin:auto;

  display:grid;

  grid-template-columns:repeat(5,1fr);

  gap:15px;

  text-align:center;
}

.benefit-card{
  padding:10px 15px;
}

.benefit-icon{
  font-size:2rem;
  color:#b8893f;
  margin-bottom:10px;
}

.benefit-card h3{
  font-family:'Cinzel', serif;

  font-size:0.78rem;

  letter-spacing:1px;

  text-transform:uppercase;

  color:#4b3023;

  margin-bottom:8px;
}

.benefit-card p{
  font-size:0.82rem;

  line-height:1.55;

  color:#4b3629;
}

/* ===============================
   CTA
=============================== */

.cursos-bottom{
  max-width:800px;

  margin:4px auto 0;

  display:grid;

  grid-template-columns:1.45fr 1fr;

  gap:20px;

  align-items:center;
}

.cursos-cta{
  border:1px solid rgba(141,45,30,0.45);

  border-radius:18px;

  background:rgba(255,248,240,0.72);

  padding:10px;

  text-align:center;
}

.cursos-cta h2{
  font-family:'Cinzel', serif;

  font-size:1rem;

  letter-spacing:1.8px;

  text-transform:uppercase;

  font-weight:400;

  color:#2f1a11;

  margin-bottom:10px;
}

.cursos-cta p{
  max-width:560px;

  margin:0 auto 10px;

  font-size:0.70rem;

  line-height:1.7;
}

.cursos-quote{
  border-left:1px solid rgba(120,70,40,0.16);

  text-align:center;

  font-family:'Allura', cursive;

  font-size:1.35rem;

  line-height:1.4;

  font-style:italic;

  color:#4b3023;

  padding-left:30px;
  
}

.cursos-quote span{
  font-size:4rem;
  color:rgba(184,137,63,0.25);
  display:block;
  line-height:0.7;
  margin-left:-200px
}

/* ===============================
   RESPONSIVE
=============================== */

@media(max-width:1200px){

  .cursos-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .benefits-grid{
    grid-template-columns:repeat(3,1fr);
  }

}

@media(max-width:768px){

  .navbar{
    padding:12px 20px;
    flex-wrap:wrap;
  }

  .menu-toggle{
    display:block;
  }

  .nav-links{
    width:100%;
    display:none;
    flex-direction:column;
    gap:20px;
    padding-top:20px;
    text-align:center;
  }

  .nav-links.active{
    display:flex;
  }

  .cursos-hero{
    padding:130px 20px 70px;
  }

  .cursos-hero h1{
    font-size:3.2rem;
    letter-spacing:6px;
  }

  .cursos-filter{
    flex-wrap:wrap;
    border-radius:24px;
    margin:-22px 20px 35px;
  }

  .cursos-filter a{
    flex:1 1 45%;
    text-align:center;
  }

  .cursos-grid,
  .benefits-grid,
  .cursos-bottom{
    grid-template-columns:1fr;
  }

  .cursos-grid{
    padding:0 24px 45px;
  }

  .cursos-benefits{
    padding:45px 24px;
  }

  .cursos-quote{
    border-left:none;
    padding-left:0;
  }

}/* ===============================
   CURSO I CHING - CLASE INTERNA
=============================== */

.site-header{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index:100;
  padding:14px 55px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:rgba(255,248,240,0.72);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(120,70,40,0.12);
}

.main-nav{
  display:flex;
  gap:28px;
  font-family:'Cinzel', serif;
}

.main-nav a{
  font-size:0.68rem;
  letter-spacing:1.4px;
  text-transform:uppercase;
}

.main-nav a.active{
  color:#8d2d1e;
  border-bottom:1px solid #8d2d1e;
  padding-bottom:8px;
}

.header-actions{
  display:flex;
  align-items:center;
  gap:20px;
}

.account-btn{
  background:#7d1f1b;
  color:white;
  padding:12px 28px;
  border-radius:999px;
  font-family:'Cinzel', serif;
  font-size:0.68rem;
  letter-spacing:1px;
  text-transform:uppercase;
}

.cart-btn{
  font-family:'Cinzel', serif;
  font-size:0.7rem;
}

.course-page{
  background:#f7efe5;
}

.course-hero{
  min-height:430px;
  background:
    linear-gradient(90deg,
      rgba(247,239,229,0.98) 0%,
      rgba(247,239,229,0.84) 34%,
      rgba(247,239,229,0.20) 58%,
      rgba(247,239,229,0.02) 100%
    ),
    url("images/iching-hero.jpg") center/cover no-repeat;
  padding:125px 70px 45px;
  display:flex;
  align-items:center;
}

.course-hero-content{
  width:45%;
  text-align:center;
}

.back-link{
  display:block;
  text-align:left;
  margin-bottom:25px;
  font-size:0.85rem;
}

.course-label{
  display:block;
  font-family:'Cinzel', serif;
  color:#a15f24;
  letter-spacing:2px;
  text-transform:uppercase;
  font-size:0.78rem;
  margin-bottom:10px;
}

.course-hero h1{
  font-family:'Cormorant Garamond', serif;
  font-size:4.7rem;
  line-height:1;
  font-weight:500;
  color:#3a1712;
  text-transform:uppercase;
}

.course-hero h2{
  font-family:'Cinzel', serif;
  color:#a15f24;
  font-size:1.35rem;
  line-height:1.45;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-top:10px;
}

.progress-area{
  margin-top:35px;
}

.progress-text{
  display:flex;
  justify-content:space-between;
  font-size:0.78rem;
  margin-bottom:10px;
}

.progress-bar{
  height:10px;
  background:#eaded1;
  border-radius:999px;
  overflow:hidden;
}

.progress-fill{
  height:100%;
  background:#7d1f1b;
  border-radius:999px;
}

.course-layout{
  display:grid;
  grid-template-columns:310px 1fr;
  gap:32px;
  padding:0 38px 50px;
  margin-top:-18px;
}

.course-sidebar{
  background:#fff7ee;
  border:1px solid rgba(120,70,40,0.14);
  border-radius:14px;
  overflow:hidden;
  height:max-content;
}

.sidebar-title{
  background:#7d1f1b;
  color:white;
  text-align:center;
  padding:18px;
  font-family:'Cinzel', serif;
  font-size:0.75rem;
  letter-spacing:1px;
  text-transform:uppercase;
}

.module-header{
  width:100%;
  border:0;
  background:#f2dfcc;
  color:#7d1f1b;
  padding:15px 20px;
  text-align:left;
  font-family:'Cinzel', serif;
  font-size:0.75rem;
  letter-spacing:0.7px;
  text-transform:uppercase;
  cursor:pointer;
}

.lesson-list{
  list-style:none;
  padding:12px 14px;
}

.lesson-list li button{
  width:100%;
  border:0;
  background:transparent;
  padding:10px 12px;
  text-align:left;
  font-family:'Lora', serif;
  font-size:0.78rem;
  color:#3d2419;
  border-radius:6px;
  cursor:pointer;
}

.lesson-list li.active button{
  background:#f0dfce;
  color:#7d1f1b;
  font-weight:600;
}

.course-materials{
  margin:18px;
  padding:18px;
  border:1px solid rgba(141,45,30,0.22);
  border-radius:12px;
  background:#f8eadc;
}

.course-materials h3{
  font-family:'Cinzel', serif;
  color:#7d1f1b;
  font-size:0.78rem;
  margin-bottom:8px;
}

.course-materials p{
  font-size:0.78rem;
  line-height:1.5;
}

.lesson-card,
.module-summary{
  background:rgba(255,248,240,0.86);
  border:1px solid rgba(120,70,40,0.16);
  border-radius:16px;
  box-shadow:0 18px 45px rgba(70,35,15,0.06);
}

.lesson-card{
  padding:42px;
}

.lesson-heading{
  display:flex;
  gap:12px;
  font-family:'Cinzel', serif;
  color:#7d1f1b;
  font-size:0.75rem;
  letter-spacing:1.2px;
  text-transform:uppercase;
  margin-bottom:18px;
}

.lesson-card h2{
  font-family:'Cormorant Garamond', serif;
  font-size:2.3rem;
  font-weight:500;
  color:#2f1a11;
  margin-bottom:30px;
}

.lesson-main{
  display:grid;
  grid-template-columns:1fr 330px;
  gap:45px;
  align-items:center;
}

.lesson-text p{
  font-size:0.88rem;
  line-height:1.9;
  margin-bottom:20px;
}

.lesson-image img{
  width:100%;
  display:block;
  border-radius:50%;
}

.video-btn,
.next-lesson{
  display:inline-block;
  background:#7d1f1b;
  color:white;
  padding:14px 28px;
  border-radius:999px;
  font-family:'Cinzel', serif;
  font-size:0.7rem;
  letter-spacing:1px;
  text-transform:uppercase;
  border:0;
  cursor:pointer;
}

.lesson-resources{
  margin-top:45px;
  border-top:1px solid rgba(120,70,40,0.16);
  padding-top:28px;
}

.lesson-resources h3,
.reflection-box h3{
  font-family:'Cinzel', serif;
  color:#4b3023;
  font-size:0.78rem;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:18px;
}

.resource-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}

.resource-card{
  background:#fff6ed;
  border:1px solid rgba(120,70,40,0.12);
  border-radius:14px;
  padding:24px;
  min-height:125px;
}

.resource-card h4{
  font-family:'Cinzel', serif;
  color:#7d1f1b;
  font-size:0.68rem;
  text-transform:uppercase;
  margin-bottom:10px;
}

.resource-card p{
  font-size:0.86rem;
  line-height:1.45;
  margin-bottom:16px;
}

.resource-card span{
  font-size:0.68rem;
}

.reflection-box{
  margin-top:35px;
  border:1px solid rgba(184,137,63,0.45);
  border-radius:14px;
  padding:26px;
  background:rgba(255,244,232,0.7);
}

.reflection-box p{
  font-style:italic;
  line-height:1.7;
  font-size:0.9rem;
}

.lesson-navigation{
  display:flex;
  justify-content:space-between;
  margin-top:38px;
}

.prev-lesson{
  background:transparent;
  color:#5c3d2d;
  border:1px solid rgba(120,70,40,0.28);
  padding:13px 28px;
  border-radius:999px;
  font-family:'Cinzel', serif;
  font-size:0.7rem;
  letter-spacing:1px;
  text-transform:uppercase;
  cursor:pointer;
}

.module-summary{
  margin-top:32px;
  padding:32px 42px;
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:35px;
  align-items:center;
}

.module-summary h3{
  font-family:'Cinzel', serif;
  font-size:0.82rem;
  text-transform:uppercase;
  margin-bottom:14px;
}

.module-summary p{
  font-size:0.82rem;
  line-height:1.7;
  margin-bottom:18px;
}

.module-btn{
  display:inline-block;
  border:1px solid rgba(120,70,40,0.28);
  border-radius:999px;
  padding:12px 24px;
  font-family:'Cinzel', serif;
  font-size:0.68rem;
  text-transform:uppercase;
}

.module-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  text-align:center;
}

.module-stats div{
  border-left:1px solid rgba(120,70,40,0.14);
  padding:10px;
}

.module-stats strong{
  display:block;
  font-family:'Cormorant Garamond', serif;
  color:#7d1f1b;
  font-size:1.35rem;
}

.module-stats span{
  font-size:0.72rem;
}

.course-footer-banner{
  min-height:190px;
  background:
    linear-gradient(90deg,
      rgba(247,239,229,0.86) 0%,
      rgba(247,239,229,0.60) 45%,
      rgba(247,239,229,0.08) 100%
    ),
    url("images/iching-footer.jpg") center/cover no-repeat;
  display:flex;
  align-items:center;
  padding-left:210px;
}

.course-footer-banner p{
  max-width:520px;
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-size:1.65rem;
  line-height:1.55;
  color:#5b2a1f;
}

/* RESPONSIVE */

@media(max-width:1100px){
  .course-layout{
    grid-template-columns:1fr;
  }

  .course-hero-content{
    width:60%;
  }

  .lesson-main{
    grid-template-columns:1fr;
  }

  .lesson-image{
    max-width:330px;
    margin:auto;
  }

  .module-summary{
    grid-template-columns:1fr;
  }
}

@media(max-width:768px){
  .site-header{
    position:relative;
    padding:16px 22px;
    flex-direction:column;
    gap:18px;
  }

  .main-nav{
    flex-wrap:wrap;
    justify-content:center;
    gap:16px;
  }

  .course-hero{
    padding:60px 24px 45px;
  }

  .course-hero-content{
    width:100%;
  }

  .course-hero h1{
    font-size:3.2rem;
  }

  .course-layout{
    padding:0 20px 40px;
  }

  .lesson-card{
    padding:28px;
  }

  .resource-grid,
  .module-stats{
    grid-template-columns:1fr;
  }

  .lesson-navigation{
    flex-direction:column;
    gap:16px;
  }

  .course-footer-banner{
    padding:50px 30px;
  }
}
/* ===============================
   INFO CURSO I CHING
=============================== */

.iching-info-hero{
  min-height:520px;
  background:
    linear-gradient(
      90deg,
      rgba(247,239,229,0.98) 0%,
      rgba(247,239,229,0.88) 30%,
      rgba(247,239,229,0.35) 52%,
      rgba(247,239,229,0.02) 100%
    ),
    url("images/iching-info-hero.jpg") center/cover no-repeat;
  padding:125px 70px 70px;
  display:flex;
  align-items:center;
}

.hero-left{
  width:46%;
  text-align:center;
}

.hero-symbol{
  width:50px;
  height:50px;
  margin:0 auto 14px;
  border:2px solid #8d2d1e;
  border-radius:50%;
  opacity:.35;
}

.hero-course-label{
  font-family:'Cinzel', serif;
  color:#a15f24;
  letter-spacing:5px;
  text-transform:uppercase;
  font-size:.85rem;
}

.iching-info-hero h1{
  font-family:'Cormorant Garamond', serif;
  font-size:5rem;
  font-weight:500;
  line-height:1;
  color:#111;
  margin-top:12px;
}

.iching-info-hero h2{
  font-family:'Cormorant Garamond', serif;
  font-size:2.35rem;
  font-weight:400;
  color:#111;
  margin-top:6px;
}

.hero-divider,
.mini-divider{
  width:190px;
  height:1px;
  background:#caa66d;
  margin:24px auto;
  position:relative;
}

.hero-divider::after,
.mini-divider::after{
  content:"";
  width:8px;
  height:8px;
  background:#a56b27;
  position:absolute;
  left:50%;
  top:-4px;
  transform:translateX(-50%) rotate(45deg);
}

.iching-info-hero p{
  max-width:620px;
  margin:0 auto;
  line-height:1.8;
  font-size:1rem;
  color:#2f1a11;
}

.hero-buttons{
  display:flex;
  justify-content:center;
  gap:28px;
  margin-top:34px;
}

.hero-main-btn,
.hero-video-btn,
.buy-btn,
.cart-btn-outline{
  font-family:'Cinzel', serif;
  text-transform:uppercase;
  letter-spacing:1.3px;
  border-radius:14px;
  padding:16px 38px;
  font-size:.78rem;
}

.hero-main-btn,
.buy-btn{
  background:#72150f;
  color:white;
}

.hero-video-btn,
.cart-btn-outline{
  border:1px solid #8d2d1e;
  color:#6b1b14;
  background:rgba(255,248,240,.55);
}

.iching-info-grid{
  background:#f7efe5;
  padding:35px 70px 28px;
  display:grid;
  grid-template-columns:1.8fr 1.1fr .75fr .85fr;
  gap:38px;
  align-items:stretch;
}

.info-block{
  text-align:center;
  padding:12px 20px;
}

.info-block h3,
.includes-card h3{
  font-family:'Cinzel', serif;
  font-size:.95rem;
  letter-spacing:1px;
  text-transform:uppercase;
  color:#2f1a11;
}

.info-block p{
  font-size:.83rem;
  line-height:1.75;
  color:#3d2419;
}

.info-icons{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:30px;
}

.icon-card{
  text-align:center;
  font-size:.78rem;
  line-height:1.45;
}

.icon-circle{
  width:58px;
  height:58px;
  border-radius:50%;
  margin:0 auto 12px;
  background:#f0dcc7;
  color:#72150f;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.6rem;
}

.learn-list,
.includes-card ul{
  list-style:none;
  text-align:left;
}

.learn-list li{
  margin-bottom:17px;
  font-size:.85rem;
  line-height:1.5;
  position:relative;
  padding-left:34px;
}

.learn-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:-2px;
  width:22px;
  height:22px;
  border-radius:50%;
  border:1px solid #b8893f;
  color:#9b5d1f;
  text-align:center;
  line-height:22px;
  font-size:.75rem;
}

.includes-card,
.price-card{
  background:rgba(255,248,240,.88);
  border:1px solid rgba(120,70,40,.12);
  border-radius:18px;
  padding:30px;
  box-shadow:0 18px 40px rgba(70,35,15,.08);
  text-align:center;
}

.includes-card li{
  font-size:.78rem;
  margin-bottom:18px;
  padding-left:30px;
  position:relative;
}

.includes-card li::before{
  content:"☉";
  position:absolute;
  left:0;
  color:#b8893f;
}

.price-symbol{
  width:34px;
  height:34px;
  border:5px solid #b8893f;
  border-left-color:transparent;
  border-radius:50%;
  margin:0 auto 18px;
}

.price-label{
  font-family:'Cinzel', serif;
  text-transform:uppercase;
  font-size:.72rem;
  letter-spacing:1px;
}

.price{
  font-family:'Cormorant Garamond', serif;
  font-size:2.4rem;
  color:#6b1b14;
  margin:6px 0;
}

.price-card p{
  font-size:.85rem;
  margin-bottom:20px;
}

.buy-btn,
.cart-btn-outline{
  display:block;
  margin-bottom:14px;
}

.price-card small{
  font-weight:600;
  font-size:.72rem;
}

.iching-video-section{
  display:grid;
  grid-template-columns:1.15fr 1.65fr;
  gap:35px;
  padding:25px 70px 35px;
  background:#f7efe5;
}

.quote-landscape{
  min-height:230px;
  background:
    linear-gradient(rgba(247,239,229,.20), rgba(247,239,229,.20)),
    url("images/iching-landscape.jpg") center/cover no-repeat;
  border-radius:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.quote-overlay{
  max-width:430px;
  text-align:center;
  color:#3d2419;
}

.quote-mark{
  font-family:'Cormorant Garamond', serif;
  font-size:3.2rem;
  color:#b8893f;
  line-height:1;
}

.quote-overlay p{
  font-family:'Cormorant Garamond', serif;
  font-size:1.25rem;
  line-height:1.45;
}

.lotus-small{
  color:#b8893f;
  font-size:1.5rem;
  margin-top:16px;
}

.video-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}

.video-card{
  position:relative;
  min-height:230px;
  border-radius:12px;
  overflow:hidden;
}

.video-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.video-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(0,0,0,.05) 0%,
    rgba(70,20,10,.76) 100%
  );
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:center;
  padding:22px;
  color:white;
  text-align:center;
}

.play-btn{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:62px;
  height:62px;
  border-radius:50%;
  border:2px solid white;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
}

.video-overlay span{
  font-family:'Lora', serif;
  font-size:.95rem;
}

/* RESPONSIVE INFO CURSO */

@media(max-width:1200px){
  .iching-info-grid{
    grid-template-columns:1fr 1fr;
  }

  .iching-video-section{
    grid-template-columns:1fr;
  }

  .video-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:768px){
  .iching-info-hero{
    padding:70px 24px;
    background-position:center;
  }

  .hero-left{
    width:100%;
  }

  .iching-info-hero h1{
    font-size:3.2rem;
  }

  .iching-info-hero h2{
    font-size:1.8rem;
  }

  .hero-buttons{
    flex-direction:column;
  }

  .iching-info-grid,
  .iching-video-section{
    grid-template-columns:1fr;
    padding:30px 24px;
  }

  .info-icons,
  .video-grid{
    grid-template-columns:1fr;
  }
}
/* ==========================================
   CURSO SOS FENG SHUI
========================================== */

/* AJUSTE HERO SOS FENG SHUI */

.course-hero{
  min-height:500px;
  height:500px;
  padding:55px 8% 45px;
  align-items:center;

  background:
    linear-gradient(
      90deg,
      rgba(250,244,238,.96) 0%,
      rgba(250,244,238,.78) 0%,
      rgba(250,244,238,.08) 42%,
      rgba(250,244,238,0) 65%
    ),
    url('images/sos-fengshui-hero.jpg');

  background-size:100%;
  background-position:center center;
  background-repeat:no-repeat;
}

.course-hero-content{
  max-width:640px;
  text-align:center;
  margin-top: 0px;
}

.course-lotus{
  font-size:32px;
  margin-bottom:10px;
}

.course-tag{
  font-size:14px;
  letter-spacing:6px;
  margin-bottom:14px;
}

.course-hero h1{
  font-size:3rem;
  line-height:.9;
  margin-bottom:8px;
  white-space:nowrap;
}

.course-subtitle{
  font-size:1rem;
  line-height:1.1;
  margin-bottom:22px;
}

.hero-divider{
  margin:0 auto 22px;
  width:220px;
}

.course-description{
  max-width:560px;
  margin:0 auto 30px;
  font-size:0.8rem;
  line-height:1.7;
}

.hero-buttons{
  justify-content:center;
}

.hero-btn-primary,
.hero-btn-secondary{
  padding:15px 34px;
  border-radius:12px;
  font-size:.7rem;
}
/* ==========================================
   INFO CURSO SOS FENG SHUI
========================================== */

.sos-course-info{
  display:grid;
  grid-template-columns:1.25fr 1fr .75fr .75fr;
  gap:35px;
  padding:45px 7% 55px;
  background:#fbf5ee;
  height:auto;
  min-height:0;
  overflow:visible;
  align-items:start;
}

.sos-course-about,
.sos-course-learn,
.sos-card{
  position:relative;
  top:auto;
}

.sos-section-title{
  font-family:'Cormorant Garamond', serif;
  font-size:1.75rem;
  text-align:center;
  margin-bottom:16px;
  color:#3a2018;
}

.sos-section-text{
  text-align:center;
  line-height:1.65;
  font-size:.9rem;
  margin-bottom:0;
}

.sos-features-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-top:26px;
}

.sos-feature-item{
  text-align:center;
}

.sos-feature-icon{
  width:68px;
  height:68px;
  margin:auto;
  margin-bottom:12px;
  border-radius:50%;
  background:#f1dfcd;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.7rem;
  color:#7b4c24;
}

.sos-feature-item h4{
  font-size:.78rem;
  line-height:1.45;
  font-weight:600;
}
/* ==========================================
   APRENDERAS SOS FENG SHUI
========================================== */

.sos-learn-list{
  display:flex;
  flex-direction:column;
  gap:13px;
}

.sos-learn-list li{
  line-height:1.55;
  font-size:.86rem;
  display:flex;
  align-items:flex-start;
}

.sos-learn-list li::before{
  content:"✓";
  color:#b1844f;
  border:1px solid #b1844f;
  border-radius:50%;
  width:22px;
  height:22px;
  min-width:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-right:10px;
  font-size:.75rem;
  line-height:1;
}

/* ==========================================
   TARJETAS SOS FENG SHUI
========================================== */

.sos-card{
  background:white;
  border-radius:22px;
  padding:30px 28px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}

.sos-card-title{
  text-align:center;
  font-size:1.05rem;
  margin-bottom:22px;
  color:#3a2018;
}

.sos-includes-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.sos-includes-list li{
  font-size:.82rem;
}

.sos-price-card{
  text-align:center;
}

.sos-price-label{
  font-size:.5rem;
  margin-bottom:10px;
  letter-spacing:.5px;
}

.sos-price{
  font-family:'Cormorant Garamond', serif;
  font-size:3.0rem;
  color:#6b0f08;
  margin-bottom:6px;
  line-height:1;
}

.sos-price-note{
  margin-bottom:22px;
  font-size:.7rem;
}

.sos-buy-btn{
  display:block;
  background:#6b0f08;
  color:white;
  padding:15px;
  border-radius:10px;
  margin-bottom:14px;
  font-weight:600;
  font-size:.50rem;
}

.sos-cart-btn{
  display:block;
  border:1px solid #caa36a;
  color:#6b0f08;
  padding:14px;
  border-radius:10px;
  font-weight:600;
  font-size:.85rem;
}

.sos-secure-payment{
  margin-top:14px;
  font-size:.78rem;
}

/* ==========================================
   VIDEOS SOS FENG SHUI
========================================== */

.sos-video-section{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:40px;
  padding:45px 7% 65px;
  background:#fff9f4;
  margin-top:0;
  position:relative;
  z-index:1;
  clear:both;
}

.sos-quote-box{
  display:flex;
  align-items:center;
  justify-content:center;
}

.sos-quote{
  font-family:'Cormorant Garamond', serif;
  font-size:1.75rem;
  line-height:1.65;
  text-align:center;
  max-width:420px;
  color:#3a2018;
}

.sos-video-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}

.sos-video-card{
  position:relative;
  min-height:240px;
  border-radius:16px;
  overflow:hidden;
  background:#d8c0a4;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

.sos-video-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to top,
    rgba(0,0,0,.72),
    rgba(0,0,0,.05)
  );
}

.sos-video-play{
  position:absolute;
  width:58px;
  height:58px;
  border:2px solid white;
  border-radius:50%;
  top:48%;
  left:50%;
  transform:translate(-50%,-50%);
  z-index:2;
}

.sos-video-play::after{
  content:"";
  position:absolute;
  left:22px;
  top:17px;
  width:0;
  height:0;
  border-left:15px solid white;
  border-top:10px solid transparent;
  border-bottom:10px solid transparent;
}

.sos-video-title{
  position:absolute;
  left:15px;
  right:15px;
  bottom:18px;
  color:white;
  z-index:2;
  text-align:center;
  font-size:1rem;
  line-height:1.35;
}
/* ==========================================
   RESPONSIVE SOS FENG SHUI
========================================== */

@media (max-width:1200px){

  .course-info{
    grid-template-columns:1fr 1fr;
  }

  .sos-video-section{
    grid-template-columns:1fr;
  }

  .sos-video-grid{
    grid-template-columns:repeat(2,1fr);
  }

}

@media (max-width:768px){

  .course-hero{
    text-align:center;
    padding:70px 25px;
  }

  .course-hero-content{
    margin:auto;
  }

  .course-hero h1{
    font-size:3.3rem;
    white-space:normal;
  }

  .course-subtitle{
    font-size:1.8rem;
  }

  .hero-divider{
    margin-left:auto;
    margin-right:auto;
  }

  .hero-buttons{
    justify-content:center;
  }

  .course-info{
    grid-template-columns:1fr;
    padding:45px 25px;
  }

  .features-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .sos-video-section{
    padding:45px 25px 60px;
  }

  .sos-video-grid{
    grid-template-columns:1fr;
  }

}
/* =========================================================
   PÁGINA LECTURAS - TAO CON SHARON
   Todo está encapsulado con .lecturas-page o .lecturas-
   para evitar que afecte otras páginas.
========================================================= */

.lecturas-page{
  margin:0;
  background:#f6eadc;
  color:#321b16;
  font-family:'Lora', serif;
}

.lecturas-page *{
  box-sizing:border-box;
}

.lecturas-page a{
  color:inherit;
  text-decoration:none;
}

/* HEADER */
.lecturas-header{
  height:98px;
  padding:0 6.8%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(255,246,238,.93);
  border-bottom:1px solid rgba(120,70,40,.10);
}

.lecturas-logo img{
  width:155px;
  display:block;
}

.lecturas-nav{
  display:flex;
  gap:42px;
  align-items:center;
  font-family:'Cinzel', serif;
  font-size:.78rem;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.lecturas-nav a{
  position:relative;
  padding:38px 0 32px;
}

.lecturas-nav a.active::after,
.lecturas-nav a:hover::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:21px;
  height:1px;
  background:#7b241d;
}

.lecturas-actions{
  display:flex;
  align-items:center;
  gap:24px;
}

.lecturas-top-btn,
.lecturas-hero-btn,
.lecturas-card-body a,
.lecturas-cta-panel a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  background:#6f1f1a;
  color:#f7e6d5;
  border-radius:999px;
  font-family:'Cinzel', serif;
  text-transform:uppercase;
  letter-spacing:.8px;
  box-shadow:0 10px 22px rgba(74,18,13,.16);
  margin-bottom: 2px;
}

.lecturas-top-btn{
  min-width:260px;
  height:45px;
  font-size:.73rem;
}

.lecturas-cart{
  font-size:1.7rem;
  color:#3f2019;
}

/* HERO */
.lecturas-hero{
  min-height:300px;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg, rgba(250,236,220,.92) 0%, rgba(250,236,220,.70) 29%, rgba(250,236,220,.18) 52%, rgba(250,236,220,0) 100%),
    url('images/lecturas-hero.jpg') center/cover no-repeat;
}

.lecturas-hero-content{
  width:520px;
  margin-left:5.5%;
  text-align:center;
}

.lecturas-lotus{
  color:#8b3329;
  font-size:2rem;
  line-height:1;
}

.lecturas-kicker,
.lecturas-section-title h2{
  margin:10px 0 5px;
  font-family:'Cinzel', serif;
  text-transform:uppercase;
  letter-spacing:1.8px;
  color:#743129;
}

.lecturas-kicker{
  font-size:.80rem;
}

.lecturas-hero h1{
  margin:0;
  font-family:'Cormorant Garamond', serif;
  font-size:2rem;
  font-weight:600;
  line-height:.98;
}

.lecturas-divider,
.lecturas-section-title span{
  display:block;
  height:15px;
  margin:10px auto;
  opacity:.4;
}

.lecturas-hero-text{
  max-width:390px;
  margin:0 auto 14px;
  font-size:.80rem;
  line-height:1.55;
}

.lecturas-hero-btn{
  min-width:315px;
  height:35px;
  font-size:.78rem;
  margin-bottom:20px;
}

/* TARJETAS */
.lecturas-servicios{
  padding:12px 6.8% 22px;
  background:#f5e6d5;
}

.lecturas-section-title{
  text-align:center;
}

.lecturas-section-title h2{
  font-size:1.05rem;
  letter-spacing:3px;
  margin:0;
}

.lecturas-section-title span{
  margin:5px auto 18px;
  width:92px;
  height:11px;
}

.lecturas-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:32px;
}

.lecturas-card{
  overflow:hidden;
  border:1px solid rgba(145,82,46,.35);
  border-radius:11px;
  background:rgba(255,246,238,.42);
}

.lecturas-card-img{
  height:150px;
  position:relative;
  background-size:cover;
  background-position:center;
}

.lecturas-card-icon{
  position:absolute;
  top:12px;
  left:14px;
  width:62px;
  height:62px;
  border:1px solid #d9b578;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#78211b;
  color:#dfbe7f;
  font-size:1.75rem;
}

.lecturas-card-body{
  min-height:205px;
  padding:13px 20px 18px;
  text-align:center;
}

.lecturas-card-body h3{
  min-height:42px;
  margin:0 0 10px;
  font-family:'Cormorant Garamond', serif;
  font-size:1.27rem;
  line-height:.9;
  text-transform:uppercase;
}

.lecturas-card-body p{
  min-height:48px;
  margin:0 auto 14px;
  font-size:.82rem;
  line-height:1.55;
}

.lecturas-card-body small{
  display:block;
  margin-bottom:13px;
  font-family:'Cinzel', serif;
  font-size:.72rem;
  text-transform:uppercase;
  color:#6f4736;
}

.lecturas-card-body a{
  width:176px;
  height:39px;
  font-size:.72rem;
}

/* FRANJA INFERIOR */
.lecturas-info-strip{
  display:grid;
  grid-template-columns:1.15fr 1.25fr 2.25fr 1.2fr;
  height:223px;
  border-top:1px solid rgba(145,82,46,.28);
  background:#f6eadc;
  overflow:hidden;
}

.lecturas-info-strip > *{
  border-right:1px solid rgba(145,82,46,.28);
}

.lecturas-quote-panel{
  padding:26px 24px;
  background:url('images/lecturas-quote.jpg') center center no-repeat;
  background-size:102%;
  color:#fff0df;
  display:flex;
  align-items:center;
  background-position:center 0%;
}

.lecturas-quote-panel blockquote{
  margin: -80px 0 0 70px;
  font-family:'Cormorant Garamond', serif;
  font-size:1.0rem;
  line-height:1.25;
}

.lecturas-includes,
.lecturas-steps{
  padding:26px 38px 16px;
  position:relative;
}

.lecturas-includes h2,
.lecturas-steps h2,
.lecturas-cta-panel h2{
  margin:0 0 22px;
  margin-bottom:16px;
  font-family:'Cinzel', serif;
  font-size:0.82rem;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.9px;
  color:#5e1e19;
}

.lecturas-includes li{
  margin-bottom:9px;
  font-size:.72rem;
  line-height:1.25;
}

.lecturas-includes li span{
  width:28px;
  color:#9a5c35;
}

.lecturas-watermark{
  text-align:center;
  margin-top:-23px;
  margin-bottom:-20px; /* súbelo */
  opacity:.20;
}

.lecturas-watermark img{
  width:100px;
  height:auto;
  display:inline-block;
}

.lecturas-step-row{
  display:grid;
  grid-template-columns:1fr 18px 1fr 18px 1fr 18px 1fr;
  gap:14px;
  align-items:start;
  text-align:center;
}

.lecturas-step-row b{
  margin-top:34px;
  color:#a05f39;
  font-size:2rem;
  font-weight:300;
}

.lecturas-step span{
  width:64px;
  height:64px;
  margin:0 auto 10px;
  border-radius:50%;
  background:#ecd6c1;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#8d4d2e;
  font-size:1.45rem;
}

.lecturas-step span i{

    color:#8d4d2e;

    font-size:1.8rem;

}

.lecturas-step h3{
  margin:0 0 12px;
  font-family:'Cinzel', serif;
  font-size:.68rem;
  text-transform:uppercase;
}

.lecturas-step p{
  margin:0 auto;
  max-width:115px;
  font-size:.66rem;
  line-height:1.2;
}

.lecturas-cta-panel{
  align-items:center;
  justify-content:center;
  overflow:visible;
  background-image:url('images/lecturas-cta-bg.jpg');
  background-repeat:no-repeat;
  background-size:120%;
  background-position:14% center;
}

.lecturas-circle{
  width:225px;
  height:225px;
  margin-left:16px;
  transform:scale(.92);
  border-radius:50%;
  padding:32px 24px 18px;
  text-align:center;
}

.lecturas-circle p{
  margin:10px auto 12px;
  font-size:.72rem;
  line-height:1.25;
}

.lecturas-circle a{
  width:100px;
  height:36px;
  font-size:.62rem;
}

/* FOOTER */
.lecturas-footer{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:70px;
  background:linear-gradient(90deg, #52140f, #762018, #52140f);
  color:#c89d60;
  font-family:'Cinzel', serif;
  text-transform:uppercase;
  letter-spacing:1.6px;
  font-size:.82rem;
}

/* Loto exclusivo del hero de Lecturas */
.lecturas-hero .lecturas-hero-content > img{
  width:65px;
  height:auto;
  display:block;
  margin:70px auto 25px;
  opacity:.5;
  transform: translateY(20px);

}

/* RESPONSIVE */
@media (max-width:1200px){
  .lecturas-nav{gap:22px;}
  .lecturas-grid{grid-template-columns:repeat(3, 1fr);}
  .lecturas-info-strip{grid-template-columns:1fr 1fr;}
}

@media (max-width:820px){
  .lecturas-header{height:auto; padding:22px; flex-direction:column; gap:18px;}
  .lecturas-nav{flex-wrap:wrap; justify-content:center;}
  .lecturas-hero-content{margin:0 auto; padding:35px 22px;}
  .lecturas-grid{grid-template-columns:1fr;}
.lecturas-info-strip{
  grid-template-columns:1fr;
  height:auto;
  overflow:visible;
}  .lecturas-step-row{grid-template-columns:1fr;}
  .lecturas-step-row b{display:none;}
  .lecturas-footer{flex-direction:column; gap:14px; padding:22px;}
    .lecturas-quote-panel{
    min-height:320px;
    background-size:cover;
    background-position:center center;
  }

  .lecturas-quote-panel blockquote{
    margin:0;
  }

}

/* ==========================================
TESTIMONIOS PAGE
TODO EL CSS ESTÁ AISLADO
NO MODIFICA OTRAS PÁGINAS
========================================== */

.testimonios-section{
  background:#f8efe6;
  padding-bottom:70px;
}

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

.testimonios-hero{

  background:
  url("images/testimonios-bg.jpg")
  center center/cover
  no-repeat;

  padding:100px 7% 140px;

  text-align:center;

  position:relative;
}

.testimonios-header{
  max-width:900px;
  margin:auto;
}

.testimonios-lotus{
  font-size:2.2rem;
  color:#9c4e3b;
  margin-bottom:10px;
}

.testimonios-kicker{
  display:block;

  font-family:'Cinzel',serif;

  letter-spacing:2px;

  color:#8d2d1e;

  margin-bottom:18px;
}

.testimonios-header h1{
  font-family:'Cormorant Garamond',serif;

  font-size:2.2rem;

  line-height:1;

  color:#351c16;

  margin-bottom:25px;
}

.testimonios-divider{
  width:170px;
  height:1px;

  background:#b8893f;

  margin:0 auto 25px;
}

.testimonios-header p{
  max-width:500px;

  margin:auto;
  
  font-size: 0.8rem;

  line-height:1.8;

  color:#4d3428;
}

/* ==========================================
STATS
========================================== */

.testimonios-stats{

  width:min(100%,900px);

  background:#f7ede3;

  border-radius:26px;

  box-shadow:0 15px 45px rgba(0,0,0,.08);

  display:flex;

  justify-content:center;

  align-items:center;

  padding:35px;

  margin:auto;

  position:absolute;

  left:50%;

  transform:translateX(-50%);

  bottom:-70px;
}

.testimonios-stat{
  flex:1;
  text-align:center;
}

.testimonios-number{
  display:block;

  font-family:'Cormorant Garamond',serif;

  font-size:4rem;

  color:#7f2418;

  line-height:1;
}

.testimonios-stat h3{
  font-family:'Cinzel',serif;

  font-size:1rem;

  margin-top:10px;

  color:#42261d;
}

.testimonios-stat p{
  margin-top:8px;
  color:#4d3428;
}

.testimonios-stat-divider{
  width:1px;
  height:120px;
  background:#d8c3af;
}

/* ==========================================
TESTIMONIOS GRID
========================================== */

.testimonios-carousel{
  padding:100px 6% 0;

  display:flex;

  align-items:center;

  gap:25px;
}

.testimonios-grid {
  flex: 1;
  display: flex;
  gap: 18px;
  overflow: hidden;
}


.testimonios-card{
  flex: 0 0 calc((100% - 36px) / 3);

  background:#f9f0e7;

  border:1px solid #e4cdb8;
  box-sizing: border-box;
  border-radius:24px;

  padding:30px 25px;

  text-align:center;
}
.testimonios-card-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 22px;
}

.testimonios-avatar{
  width:95px;
  height:95px;
  flex-shrink: 0;
  border-radius: 50%;
  object-fit: cover;
}

.testimonios-stars{
  color:#b8893f;

  font-size:1.1rem;

  margin-bottom:12px;
}

.testimonios-card h3{
  font-family:'Cinzel',serif;

  font-size:1.15rem;

  color:#7f2418;

  line-height:1.4;

  margin-bottom:20px;
}

.testimonios-text{

  font-size:0.7rem;

  line-height:1.9;

  color:#4b3023;

  margin-bottom:30px;
}

.testimonios-author{

  font-size:.6rem;

  color:#5a4134;
}

.testimonios-lotus-bottom{

  margin-top:25px;

  color:#b8893f;

  font-size:1.7rem;
}

.testimonios-arrow{

  width:58px;
  height:58px;

  border:none;

  border-radius:50%;

  cursor:pointer;

  background:#7f2418;

  color:white;

  font-size:1.5rem;
}
.testimonio-video {
    width: 70%;
    height: 70%;
    object-fit: cover;
    display: block;
    border-radius: inherit;
}

/* ==========================================
CTA
========================================== */

.testimonios-cta{

  width:min(1130px,90%);

  margin:40px auto 0;

  background:#f0dccc;

  border:1px solid #e4cdb8;

  border-radius:24px;

  padding:23px 90px;

  display:flex;

  justify-content:space-between;

  align-items:center;

  gap:25px;
}

.testimonios-cta-content{
  display:flex;
  align-items:center;
  gap:25px;
}

.testimonios-cta-icon{
  font-size:2rem;
  color:#b8893f;
}

.testimonios-cta h2{

  font-family:'Cinzel',serif;

  font-size:1.0rem;

  color:#7f2418;

  margin-bottom:10px;
}

.testimonios-cta p{
  color:#4b3023;
}

.testimonios-btn{

  display:inline-flex;

  align-items:center;

  justify-content:center;

      padding: 15px 32px;

  border: 1px solid #C9A45C;
  border-radius: 80px;

  text-decoration:none;

  background: #8B1E24;
  color: #fff;

  font-family:'Cinzel',serif;

  transition: all 0.3s ease;
}

.testimonios-btn:hover{
  transform:translateY(-2px);
  background: #C9A45C;
  color: #1a1a1a;
}

.testimonios-prev,
.testimonios-next {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid #A52A30;
    background: #8B1E24;
    color: #FFFFFF;

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

    font-size: 24px;
    cursor: pointer;

    transition: all 0.3s ease;

    box-shadow: 0 4px 12px rgba(139, 30, 36, 0.25);
}

.testimonios-prev:hover,
.testimonios-next:hover {
    background: #A52A30;
    border-color: #C9A45C;
    color: #FFFFFF;

    transform: scale(1.08);
    box-shadow: 0 6px 18px rgba(139, 30, 36, 0.35);
}

/* ==========================================
RESPONSIVE
========================================== */

/* ==========================================
   RESPONSIVE — TESTIMONIOS
========================================== */

/* TABLET */
@media (max-width: 1100px) {

  .testimonios-hero {
    padding: 100px 5% 130px;
  }

  .testimonios-carousel {
    padding: 90px 4% 0;
    gap: 16px;
  }

  .testimonios-card {
    flex: 0 0 calc((100% - 18px) / 2);
  }

  .testimonios-cta {
    width: 90%;
    padding: 25px 45px;
  }

}


/* TABLET PEQUEÑA / CELULAR GRANDE */
@media (max-width: 768px) {

  /* HERO */

  .testimonios-hero {
    padding: 90px 6% 125px;
  }

  .testimonios-header h1 {
    font-size: 1.6rem;
    line-height: 1.05;
  }

  .testimonios-header p {
    font-size: 0.78rem;
    line-height: 1.7;
  }


  /* ESTADÍSTICAS */

  .testimonios-stats {
    width: 88%;
    padding: 25px 20px;
    bottom: -95px;

    flex-direction: column;
    gap: 20px;
  }

  .testimonios-stat {
    width: 100%;
  }

  .testimonios-number {
    font-size: 3rem;
  }

  .testimonios-stat-divider {
    width: 60px;
    height: 1px;
  }


  /* CARRUSEL */

  .testimonios-carousel {
    padding: 125px 15px 0;
    gap: 10px;
  }

  .testimonios-grid {
    width: 100%;
    min-width: 0;
    gap: 0;
  }


  /* UNA SOLA TARJETA EN CELULAR */

  .testimonios-card {
    flex: 0 0 100%;
    width: 100%;
    padding: 25px 20px;
    border-radius: 20px;
  }


  /* HEADER DE LA TARJETA */

  .testimonios-card-header {
    gap: 15px;
    margin-bottom: 20px;
  }

  .testimonios-avatar {
    width: 80px;
    height: 80px;
  }

  .testimonios-stars {
    font-size: 1rem;
    margin-bottom: 8px;
  }

  .testimonios-card h3 {
    font-size: 1rem;
    line-height: 1.3;
    margin-bottom: 15px;
  }


  /* TEXTO */

  .testimonios-text {
    font-size: 0.72rem;
    line-height: 1.8;
    margin-bottom: 22px;
  }


  /* VIDEO */

  .testimonio-video {
    width: 100%;
    height: auto;
    max-height: 400px;
    object-fit: cover;
  }


  /* FLECHAS */

  .testimonios-prev,
  .testimonios-next {
    width: 42px;
    height: 42px;
    min-width: 42px;

    font-size: 20px;
  }


  /* CTA */

  .testimonios-cta {
    width: 88%;
    padding: 30px 22px;

    flex-direction: column;
    text-align: center;

    gap: 25px;
  }

  .testimonios-cta-content {
    flex-direction: column;
    gap: 12px;
  }

  .testimonios-cta-icon {
    font-size: 1.7rem;
  }

  .testimonios-cta h2 {
    font-size: 0.95rem;
  }

  .testimonios-cta p {
    font-size: 0.78rem;
    line-height: 1.6;
  }

  .testimonios-btn {
    width: 100%;
    max-width: 280px;
  }

}


/* CELULAR PEQUEÑO */
@media (max-width: 480px) {

  .testimonios-hero {
    padding: 80px 5% 120px;
  }

  .testimonios-header h1 {
    font-size: 1.2rem;
  }

  .testimonios-lotus {
    font-size: 1.8rem;
  }

  .testimonios-stats {
    width: 90%;
  }

  .testimonios-carousel {
    padding-left: 8px;
    padding-right: 8px;
    gap: 6px;
  }

  .testimonios-prev,
  .testimonios-next {
    width: 38px;
    height: 38px;
    min-width: 38px;

    font-size: 18px;
  }

  .testimonios-card {
    padding: 22px 16px;
  }

  .testimonios-card-header {
    gap: 12px;
  }

  .testimonios-avatar {
    width: 70px;
    height: 70px;
  }

  .testimonios-card h3 {
    font-size: 0.9rem;
  }

  .testimonios-text {
    font-size: 0.69rem;
    line-height: 1.75;
  }

}

/* =========================================================
   FIX CARRUSEL TESTIMONIOS
   ========================================================= */

/* evita que el borde de la última tarjeta sea recortado */
.testimonios-grid{
  padding:1px;
  scroll-padding:1px;

  scrollbar-width:none;
  -ms-overflow-style:none;
}

.testimonios-grid::-webkit-scrollbar{
  display:none;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:768px){

  .testimonios-carousel{
    position:relative;

    width:100%;

    padding:125px 55px 0;

    display:block;
  }


  .testimonios-grid{
    width:100%;
    min-width:0;

    display:flex;

    gap:0;

    overflow:hidden;

    padding:1px;
  }


  .testimonios-card{
    flex:0 0 100%;
    width:100%;
    min-width:100%;
    max-width:100%;

    box-sizing:border-box;

    padding:25px 20px;
  }


  /* flechas fuera del ancho de la tarjeta */

  .testimonios-prev,
  .testimonios-next{
    position:absolute;

    top:50%;

    transform:translateY(-50%);

    z-index:5;

    width:42px;
    height:42px;
    min-width:42px;

    margin:0;
  }


  .testimonios-prev{
    left:7px;
  }


  .testimonios-next{
    right:7px;
  }


  .testimonios-prev:hover,
  .testimonios-next:hover{
    transform:translateY(-50%) scale(1.08);
  }


  .testimonios-card-header{
    justify-content:center;
  }


  .testimonios-text{
    overflow-wrap:anywhere;
  }


  .testimonio-video{
    width:100%;
    height:auto;
    max-height:none;

    margin:0 auto 20px;
  }

}


/* =========================================================
   CELULAR PEQUEÑO
   ========================================================= */

@media (max-width:480px){

  .testimonios-carousel{
    padding-left:48px;
    padding-right:48px;
  }


  .testimonios-prev,
  .testimonios-next{
    width:36px;
    height:36px;
    min-width:36px;

    font-size:18px;
  }


  .testimonios-prev{
    left:6px;
  }


  .testimonios-next{
    right:6px;
  }


  .testimonios-card{
    padding:22px 17px;
  }


  .testimonios-avatar{
    width:70px;
    height:70px;
  }

}

/* ==========================================
CONTACTO PAGE
TODO EL CSS ESTÁ AISLADO CON contacto-
NO MODIFICA OTRAS PÁGINAS
========================================== */

.contacto-page{
  background:#f8efe6;
  color:#3b2119;
  overflow: visible;
}

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

.contacto-hero{
  min-height:1020px;

  position:relative;
  overflow:visible;

  display:grid;
  grid-template-columns:40% 50%;

  padding-bottom:200px;


  background: url("images/contacto-bg.png");

background-size: 100% auto;

background-repeat:no-repeat;

background-position: 83% center;
}

/* ==========================================
CONTACTO INTRO IZQUIERDA
========================================== */

.contacto-intro{
  padding:90px 7% 40px;
  text-align:center;
  padding-left: 70px;
  
}

.contacto-lotus{
  font-size:2.2rem;
  color:#8d2d1e;
  margin-bottom:12px;
}

.contacto-kicker{
  font-family:'Cinzel',serif;
  font-size:.95rem;
  letter-spacing:1px;
  color:#5a261c;
}


.contacto-divider::after,
.contacto-form-divider::after{
  content:"";
  display:flex;
  justify-content:center;
  width:120px;      /* largo de la línea */
  height:1px;
  background:#d8c2a3; /* o #9c5e27 si la quieres más oscura */
  margin:18px auto 0;
}

.contacto-intro h1{
  font-family:'Cormorant Garamond',serif;
  font-size:2rem;
  line-height:1.15;
  color:#3b1512;
  margin-bottom:18px;
  margin-top: 10px;
}

.contacto-intro h2{
  font-family:'Cinzel',serif;
  font-size:0.8rem;
  letter-spacing:.5px;
  color:#9c5e27;
  margin-bottom:20px;
}

.contacto-intro p{
  font-size:0.9rem;
  line-height:1.8;
  color:#3f2a22;
}

.contacto-script{
  font-family:'Allura',cursive;
  font-size:1.75rem !important;
  color:#9c5e27 !important;
  margin-top:32px;
}

.contacto-heart{
  color:#5f1712;
  margin-bottom:25px;
}

/* ==========================================
CONTACTO CAJA DE AGENDA
========================================== */

.contacto-schedule-box{
  max-width:470px;
  margin:0 auto;

  border:1px solid #d9bfa7;
  border-radius:24px;

  padding:25px;

  display:flex;
  gap:22px;
  align-items:center;

  text-align:left;
  background:rgba(255,246,237,.55);
}

.contacto-schedule-icon{
  min-width:70px;
  height:70px;
  border-radius:50%;

  background:#6e1b14;
  color:#f8efe6;

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

  font-size:1.8rem;
}

.contacto-schedule-box h3{
  font-family:'Cinzel',serif;
  font-size:.85rem;
  color:#5a1d17;
  margin-bottom:10px;
}

.contacto-schedule-box p{
  font-size:.9rem;
  line-height:1.7;
  margin-bottom:12px;
}

.contacto-small-btn{
  display:inline-flex;
  align-items:center;
  gap:14px;

  padding:12px 24px;

  border-radius:999px;

  background:#6e1b14;
  color:white;

  text-decoration:none;

  font-family:'Cinzel',serif;
  font-size:.82rem;
}

.contacto-small-btn span{
  width:22px;
  height:22px;
  border:1px solid rgba(255,255,255,.6);
  border-radius:50%;

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

/* ==========================================
CONTACTO FORMULARIO
========================================== */

.contacto-form-area{
  display:flex;
  align-items:center;
  justify-content:center;
padding-right: 100px;
}

.contacto-form{
  width:min(100%,420px);

  background:rgba(248,239,230,.88);

  border:1px solid #dfc4ad;
  border-radius:28px;

  padding:35px 35px 28px;

  text-align:center;

  box-shadow:0 20px 55px rgba(0,0,0,.12);
  max-height: 400px;

}

.contacto-form h3{
  font-family:'Cinzel',serif;
  color:#321914;
  font-size:1.1rem;
  letter-spacing:.5px;
}

.contacto-form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

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

  border:1px solid #d8bca3;
  border-radius:7px;

  background:rgba(255,247,239,.65);

  padding:14px;

  font-family:'Cormorant Garamond',serif;
  font-size:0.7rem;

  color:#3f2a22;

  margin-bottom:08px;
}

.contacto-form textarea{
  min-height:135px;
  resize:vertical;
}

.contacto-form button{
  width:100%;

  border:none;
  border-radius:9px;

  padding:16px;

  background:#6e1b14;
  color:white;

  font-family:'Cinzel',serif;
  font-size:.5rem;

  cursor:pointer;
}

.contacto-form button span{
  margin-left:15px;
  color:#d7a85b;
}

.contacto-secure{
  margin-top:10px;
  font-size:.65rem;
  color:#5f4638;
}

.contacto-success{
  display:none;

  width:min(520px, 88%);
  min-height:380px;

  margin:auto;

  flex-direction:column;
  align-items:center;
  justify-content:center;

  text-align:center;

  padding:50px 45px;

  background:rgba(255, 248, 240, 0.90);

  border:1px solid rgba(184,137,63,0.35);
  border-radius:24px;

  box-shadow:
    0 18px 50px rgba(70,35,15,0.16);

  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}


.contacto-success-icon{
  width:78px;
  height:78px;

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

  margin-bottom:24px;

  border:1px solid #b8893f;
  border-radius:50%;

  background:rgba(255,248,240,0.65);

  color:#8d2d1e;
  font-size:2.2rem;
}


.contacto-success h3{
  font-family:'Cinzel', serif;

  color:#7f2418;

  font-size:1.35rem;
  letter-spacing:1.5px;

  margin-bottom:20px;
}


.contacto-success .contacto-form-divider{
  width:150px;
  height:1px;

  background:#b8893f;

  margin:0 auto 24px;
}


.contacto-success p{
  font-family:'Lora', serif;

  color:#4b3023;

  font-size:.88rem;
  line-height:1.8;

  margin-bottom:18px;
}


.contacto-success span{
  font-family:'Cormorant Garamond', serif;

  color:#765441;

  font-size:1.05rem;
  font-style:italic;
}

/* ==========================================
CONTACTO MÉTODOS
========================================== */

.contacto-methods{
  width:min(1350px,92%);

  margin:-380px auto 0;

  background:rgba(252, 235, 217, 0.92);

  border: 1px solid #dfc4ad;
  border-radius:24px;

  padding:10px 33px;

  display:grid;
  grid-template-columns:1fr 280px;
  gap:35px;

  position:relative;
  z-index:20;

  box-shadow:0 25px 55px rgba(0,0,0,.08);
}

.contacto-divider.small{
  margin-bottom:25px;
}

.contacto-methods-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}

.contacto-method{
  text-align:center;
  padding:10px 25px;
  border-right:1px solid #ddc4af;
}

.contacto-method:last-child{
  border-right:none;
}

.contacto-method-icon{
  width:58px;
  height:58px;

  border-radius:50%;

  background:#6e1b14;
  color:white;

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

  margin:0 auto 15px;

  font-size:1.5rem;
}

.contacto-method h3{
  font-family:'Cinzel',serif;
  font-size:.95rem;
  color:#5a1d17;
  margin-bottom:8px;
}

.contacto-method strong{
  display:block;
  margin-bottom:8px;
  font-size:.95rem;
}

.contacto-method p{
  font-size:.7rem;
  line-height:1.5;
}

.contacto-methods-main > h2{
  font-size:1.15rem;
    position:relative;
    font-family: 'Cinzel',serif;
    text-align:center;
  width:100%;
  top:15px;
  line-height:1.2;
  margin-bottom:8px;
}

/* ==========================================
CONTACTO FRASE CIRCULAR
========================================== */

.contacto-quote{
  border-left:1px solid #ddc4af;

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

.contacto-quote-circle{
  width:220px;
  height:220px;

  border-radius:50%;

  border:8px double rgba(184,137,63,.35);

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

  text-align:center;
}

.contacto-quote-circle span{
  font-size:3rem;
  color:#b8893f;
  line-height:1;
}

.contacto-quote-circle p{
  font-size:.95rem;
  line-height:1.6;
  color:#3f2a22;
}

.contacto-quote-lotus{
  font-size:2rem;
  color:#b8893f;
  margin-top:8px;
}

.contacto-footer{
  position:relative;
  z-index:30;

  width:100%;

  display:flex;

  visibility:visible;
  opacity:1;

  margin-top:20px;
}
.contacto-page{
  position:relative;
  overflow:visible;
}
/* ==========================================
RESPONSIVE CONTACTO
========================================== */


@media (max-width:768px){

  .contacto-success{
    width:90%;
    min-height:340px;

    padding:40px 25px;

    border-radius:20px;
  }

  .contacto-success h3{
    font-size:1.1rem;
  }

  .contacto-success p{
    font-size:.8rem;
  }

}

@media(max-width:1100px){

  .contacto-hero{
    grid-template-columns:1fr;
    background-position:25% top;
  }

  .contacto-methods{
    grid-template-columns:1fr;
  }

  .contacto-methods-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .contacto-quote{
    border-left:none;
    border-top:1px solid #ddc4af;
    padding-top:25px;
  }

}

@media(max-width:700px){

  .contacto-intro h1{
    font-size:2.2rem;
  }

  .contacto-form-row,
  .contacto-methods-grid{
    grid-template-columns:1fr;
  }

  .contacto-method{
    border-right:none;
    border-bottom:1px solid #ddc4af;
  }

  .contacto-method:last-child{
    border-bottom:none;
  }

  .contacto-schedule-box{
    flex-direction:column;
    text-align:center;
  }

  .contacto-hero{
    grid-template-columns:1fr;
    background-position:25% top;
  }

}
/* ==========================================
CONTACTO FOOTER
AISLADO - NO AFECTA OTRAS PÁGINAS
========================================== */

.contacto-footer{

  background:
  linear-gradient(
    90deg,
    #4a120d,
    #6a1a12,
    #4a120d
  );

  min-height:85px;

  padding:0 45px;

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

  color:#c99847;
}

.contacto-footer-left{

  display:flex;
  align-items:center;
  gap:22px;

  font-family:'Cinzel',serif;
  font-size:.95rem;
  letter-spacing:1px;
}

.contacto-footer-item{
  display:flex;
  align-items:center;
  gap:10px;
}

.contacto-footer-item span{
  white-space:nowrap;
}

.contacto-footer-dot{
  color:#b8893f;
  font-size:1.1rem;
}

.contacto-footer-center{

  color:#e8d7c7;

  font-size:.92rem;

  text-align:center;
}

.contacto-footer-seal{

  width:52px;
  height:52px;

  border:1px solid rgba(201,152,71,.45);

  border-radius:4px;

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

  color:#c99847;

  font-size:1rem;

  line-height:1.05;

  font-family:'Noto Serif SC',serif;
}

/* ==========================================
RESPONSIVE FOOTER
========================================== */

/* =========================================================
   CONTACTO — RESPONSIVE NUEVO
   ========================================================= */


/* =========================================================
   TABLET / PANTALLAS MEDIANAS
   ========================================================= */

@media (max-width:1100px){

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

  .contacto-hero{
    width:100%;
    min-height:auto;

    display:grid;
    grid-template-columns:1fr;

    padding:110px 30px 45px;

    gap:30px;

    overflow:visible;

    background-size:cover;
    background-position:2% top;
    background-repeat:no-repeat;
  }


  /* =========================================
     INTRO
     ========================================= */

  .contacto-intro{
    width:100%;
    max-width:680px;

    margin:0 auto;

    padding:30px 20px 20px;

    text-align:center;
  }

  .contacto-intro h1{
    font-size:2.2rem;
  }

  .contacto-intro h2{
    font-size:.78rem;
  }

  .contacto-intro p{
    font-size:.85rem;
  }

  .contacto-script{
    font-size:1.6rem !important;
    margin-top:22px;
  }


  /* =========================================
     WHATSAPP
     ========================================= */

  .contacto-schedule-box{
    width:100%;
    max-width:500px;

    margin:0 auto;

    padding:22px;

    gap:18px;
  }


  /* =========================================
     FORMULARIO
     ========================================= */

  .contacto-form-area{
    width:100%;

    padding:10px 20px 30px;

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

  .contacto-form{
    width:100%;
    max-width:520px;

    max-height:none;

    margin:0 auto;

    padding:32px;
  }

  .contacto-success{
    width:100%;
    max-width:520px;

    min-height:340px;

    margin:0 auto;
  }


  /* =========================================
     MÉTODOS DE CONTACTO
     ========================================= */

  .contacto-methods{
    width:92%;

    margin:25px auto 30px;

    padding:28px 30px;

    display:grid;
    grid-template-columns:1fr;

    gap:28px;

    border-radius:22px;
  }

  .contacto-methods-main{
    width:100%;
  }

  .contacto-methods-main > h2{
    width:100%;

    text-align:center;

    font-size:1rem;

    margin:0 0 8px;
  }

  .contacto-methods-main > .contacto-divider{
    margin-left:auto;
    margin-right:auto;
  }


  .contacto-methods-grid{
    width:100%;

    display:grid;
    grid-template-columns:repeat(2, 1fr);
  }


  .contacto-method{
    padding:22px 20px;

    border-right:none;
  }


  .contacto-method:nth-child(odd){
    border-right:1px solid #ddc4af;
  }

  .contacto-method:nth-child(-n+2){
    border-bottom:1px solid #ddc4af;
  }


  /* =========================================
     FRASE CIRCULAR
     ========================================= */

  .contacto-quote{
    width:100%;

    border-left:none;
    border-top:1px solid #ddc4af;

    padding-top:28px;
  }

  .contacto-quote-circle{
    width:180px;
    height:180px;

    margin:0 auto;
  }

  .contacto-quote-circle p{
    font-size:.8rem;
  }


  /* =========================================
     FOOTER
     ========================================= */

  .contacto-footer{
    width:100%;

    min-height:auto;

    margin-top:20px;

    padding:28px 25px;

    display:flex;
    flex-direction:column;

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

    gap:20px;

    text-align:center;
  }

  .contacto-footer-left{
    width:100%;

    display:flex;
    flex-wrap:wrap;

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

    gap:10px 16px;

    font-size:.78rem;
  }

  .contacto-footer-center{
    font-size:.78rem;
  }

  .contacto-footer-seal{
    width:46px;
    height:46px;
  }

}



/* =========================================================
   CELULAR
   ========================================================= */

@media (max-width:700px){

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

  .contacto-hero{
    min-height:auto;

    padding:95px 16px 35px;

    gap:20px;

    background-position: 2% top;
  }


  /* =========================================
     INTRO
     ========================================= */

  .contacto-intro{
    padding:25px 8px 15px;
  }

  .contacto-kicker{
    font-size:.75rem;
  }

  .contacto-intro h1{
    font-size:1.85rem;
    line-height:1.08;

    margin-top:10px;
    margin-bottom:15px;
  }

  .contacto-intro h2{
    font-size:.68rem;
    line-height:1.5;

    margin-bottom:15px;
  }

  .contacto-intro p{
    font-size:.78rem;
    line-height:1.65;
  }

  .contacto-script{
    font-size:1.45rem !important;

    margin-top:20px;
  }


  /* =========================================
     WHATSAPP
     ========================================= */

  .contacto-schedule-box{
    max-width:420px;

    padding:20px 18px;

    flex-direction:column;

    gap:15px;

    text-align:center;
  }

  .contacto-schedule-icon{
    min-width:58px;
    width:58px;
    height:58px;

    font-size:1.45rem;
  }

  .contacto-schedule-box h3{
    font-size:.72rem;
  }

  .contacto-schedule-box p{
    font-size:.78rem;
  }

  .contacto-small-btn{
    padding:11px 18px;

    font-size:.7rem;
  }


  /* =========================================
     FORMULARIO
     ========================================= */

  .contacto-form-area{
    padding:10px 4px 25px;
  }

  .contacto-form{
    width:100%;
    max-width:440px;

    padding:28px 20px 24px;

    border-radius:22px;
  }

  .contacto-form h3{
    font-size:.95rem;
  }

  .contacto-form-row{
    display:grid;
    grid-template-columns:1fr;

    gap:0;
  }

  .contacto-form input,
  .contacto-form textarea{
    padding:13px;

    font-size:.95rem;
  }

  .contacto-form textarea{
    min-height:120px;
  }

  .contacto-form button{
    padding:14px;

    font-size:.75rem;
  }

  .contacto-secure{
    font-size:.7rem;

    margin-top:14px;
  }


  /* =========================================
     MENSAJE ENVIADO
     ========================================= */

  .contacto-success{
    width:100%;
    max-width:440px;

    min-height:300px;

    padding:35px 22px;

    border-radius:20px;
  }

  .contacto-success-icon{
    width:62px;
    height:62px;

    font-size:1.7rem;

    margin-bottom:18px;
  }

  .contacto-success h3{
    font-size:1rem;
  }

  .contacto-success p{
    font-size:.76rem;
  }


  /* =========================================
     OTRAS FORMAS DE CONECTAR
     ========================================= */

  .contacto-methods{
    width:92%;

    margin:20px auto 25px;

    padding:25px 20px;

    gap:22px;
  }

  .contacto-methods-main > h2{
    font-size:.9rem;

    text-align:center;

    margin:0 0 5px;
  }

  .contacto-divider.small{
    margin-bottom:18px;
  }


  /* UNA TARJETA POR FILA */

  .contacto-methods-grid{
    grid-template-columns:1fr;
  }

  .contacto-method{
    width:100%;

    padding:20px 10px;

    border-right:none !important;
    border-bottom:1px solid #ddc4af;
  }

  .contacto-method:last-child{
    border-bottom:none;
  }

  .contacto-method-icon{
    width:52px;
    height:52px;

    margin-bottom:10px;

    font-size:1.3rem;
  }

  .contacto-method h3{
    font-size:.75rem;

    margin-bottom:6px;
  }

  .contacto-method strong{
    font-size:.78rem;

    margin-bottom:6px;

    overflow-wrap:anywhere;
  }

  .contacto-method p{
    font-size:.66rem;
  }


  /* =========================================
     FRASE
     ========================================= */

  .contacto-quote{
    padding-top:22px;
  }

  .contacto-quote-circle{
    width:165px;
    height:165px;

    border-width:6px;
  }

  .contacto-quote-circle span{
    font-size:2.3rem;
  }

  .contacto-quote-circle p{
    font-size:.72rem;
    line-height:1.45;
  }

  .contacto-quote-lotus{
    font-size:1.5rem;
  }


  /* =========================================
     FOOTER
     ========================================= */

  .contacto-footer{
    margin-top:15px;

    padding:25px 18px;

    gap:17px;
  }

  .contacto-footer-left{
    flex-direction:column;

    gap:7px;

    font-size:.7rem;
  }

  .contacto-footer-dot{
    display:none;
  }

  .contacto-footer-item{
    justify-content:center;
  }

  .contacto-footer-center{
    font-size:.68rem;
    line-height:1.5;
  }

}



/* =========================================================
   CELULAR PEQUEÑO
   ========================================================= */

@media (max-width:480px){

  .contacto-hero{
    padding-left:12px;
    padding-right:12px;
  }

  .contacto-intro h1{
    font-size:1.6rem;
  }

  .contacto-intro h2{
    font-size:.62rem;
  }

  .contacto-schedule-box{
    padding:18px 14px;
  }

  .contacto-form{
    padding:25px 16px 22px;
  }

  .contacto-methods{
    width:94%;

    padding:22px 15px;
  }

  .contacto-methods-main > h2{
    font-size:.82rem;
  }

}
/* =========================================================
   PÁGINA SOBRE MÍ INTERNA
   Clases exclusivas: sobremi
   ========================================================= */

.sobremi-page{
  background:#f7eadf;
  color:#241510;
  font-family:'Lora', serif;
  padding:100px 60px 30px;
}

.sobremi-main{
  max-width:1780px;
  margin:40px auto;
}

.sobremi-grid{
  display:grid;
  grid-template-columns:1fr 1.1fr 1.15fr;
  gap:55px;
}

.sobremi-column{
  padding:0 25px;
}

.sobremi-column:not(:first-child){
  border-left:1px solid rgba(120,70,40,.22);
}

.sobremi-heading{
  text-align:center;
  margin-bottom:35px;
}

.sobremi-heading h2{
  font-family:'Cinzel', serif;
  font-size:1.0rem;
  text-transform:uppercase;
  letter-spacing:1.5px;
  margin:8px 0 10px;
  font-weight:500;
}

.sobremi-heading p{
  max-width:430px;
  margin:15px auto 0;
  line-height:1.6;
}

.sobremi-lotus,
.sobremi-divider{
  color:#7b1f1b;
}

.sobremi-divider{
  font-size:.7rem;
  letter-spacing:6px;
}

/* Timeline */

.sobremi-timeline-content{
  position:relative;
}

.sobremi-timeline-content::before{
  content:"";
  position:absolute;
  left:245px;
  top:0;
  bottom:0;
  width:1px;
  background:rgba(120,70,40,.35);
}

.sobremi-story-item{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:70px;
  align-items:center;
  position:relative;
  margin-bottom:18px;
}

.sobremi-story-item::after{
  content:"";
  position:absolute;
  left:238px;
  width:13px;
  height:13px;
  background:#7b1f1b;
  border-radius:50%;
}

.sobremi-story-item img{
  width:220px;
  height:160px;
  object-fit:cover;
  border-radius:7px;
}

.sobremi-story-item h3{
  font-family:'Cinzel', serif;
  font-size:1rem;
  text-transform:uppercase;
  letter-spacing:.7px;
  margin-bottom:12px;
}

.sobremi-story-item p{
  font-size:.50rem;
  line-height:1.7;
}

/* Cards */

.sobremi-card-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:35px 25px;
}

.sobremi-card-grid article{
  text-align:center;
}

.sobremi-card-grid img{
  width:100%;
  height:190px;
  object-fit:cover;
   object-position:center 3%;
  border-radius:7px;
}

.sobremi-card-grid h3{
  font-family:'Cinzel', serif;
  font-size:0.8rem;
  text-transform:uppercase;
  margin:14px 0 6px;
}

.sobremi-card-grid p{
  font-size:.60rem;
  line-height:1.55;
  max-width:260px;
  margin:0 auto;
}

/* Inspiración */

.sobremi-inspo-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:70px 10px;
}

.sobremi-inspo-grid img{
  width:100%;
  height:150px;
  object-fit:cover;
  border-radius:7px;
}

.sobremi-inspo-grid p{
  text-align:center;
  font-size:.50rem;
  margin-top:14px;
}

/* CTA */

.sobremi-cta{
  margin-top:50px;

  background:
    url("images/cta-bg.png")
    center center / cover
    no-repeat;

  border-radius:16px;
  padding:15px 90px;

  color:#f7eadf;

  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:40px;

  overflow:hidden;
}

.sobremi-cta h2{
  font-family:'Cinzel', serif;
  text-transform:uppercase;
  letter-spacing:1.5px;
  font-size:1.00rem;
  margin-bottom:8px;
  color:#d8ad70;
}

.sobremi-cta p{
  max-width:650px;
  line-height:1.6;
  font-size:.9rem;
}

.sobremi-cta span{
  color:#d8ad70;
  font-size:2rem;
}

.sobremi-cta a{
  background:#f7eadf;
  color:#40100e;
  text-decoration:none;
  font-family:'Cinzel', serif;
  text-transform:uppercase;
  letter-spacing:1px;
  font-size:.8rem;
  padding:18px 38px;
  border-radius:6px;
  white-space:nowrap;
}

.sobremi-lotus img {
  width:60px;
  height:auto;
  margin:0px 0 0;
  opacity:.8;
}

/* Responsive */

@media(max-width:1200px){
  .sobremi-grid{
    grid-template-columns:1fr;
  }

  .sobremi-column:not(:first-child){
    border-left:none;
    border-top:1px solid rgba(120,70,40,.22);
    padding-top:50px;
  }

  .sobremi-cta{
    flex-direction:column;
    text-align:center;
  }
}

@media(max-width:700px){
  .sobremi-page{
    padding:45px 22px 25px;
  }

  .sobremi-story-item{
    grid-template-columns:1fr;
    gap:18px;
  }

  .sobremi-timeline-content::before,
  .sobremi-story-item::after{
    display:none;
  }

  .sobremi-story-item img{
    width:100%;
    height:220px;
  }

  .sobremi-card-grid,
  .sobremi-inspo-grid{
    grid-template-columns:1fr;
  }

  .sobremi-cta{
    padding:35px 25px;
  }
}
/* ============================= */
/* COMPRA PAGE */
/* ============================= */

.compra-page{
  font-family:'Cormorant Garamond', serif;
  color:#3b2118;
  background:
    url("images/compra-hero.jpg") center top / 100% auto no-repeat,
    #fbf3ea;
}

.compra-wrapper{
  max-width:1550px;
  margin:0 auto;
  padding:0 40px 20px;
  background:linear-gradient(
    to bottom,
    rgba(251,243,234,0) 0%,
    rgba(251,243,234,.45) 180px,
    #fbf3ea 520px
  );
}

.compra-hero{
  min-height:420px;
  background:transparent;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  text-align:center;
  padding:70px 20px 35px;
}

.compra-hero-content h1{
  font-size:3rem;
  font-weight:500;
  margin:2px 0 2px;
}

.compra-lotus{
  color:#8a211c;
  font-size:2rem;
}

.compra-divider{
  color:#c89346;
  display:block;
  margin-bottom:14px;
}

.compra-hero-content p{
  font-family:'Lora', serif;
  font-size:1rem;
  margin:0;
}

.compra-wrapper{
  max-width:1550px;
  margin:0 auto;
  padding:0 40px 20px;
}

.compra-destacado{
  width:75%;
  background:rgba(255,248,239,.88);
  border:2px solid #d99a42;
  border-radius:20px;
  box-shadow:0 10px 25px rgba(120,40,20,.18);
  display:grid;
  grid-template-columns:80px 100px 290px 200px 300px;
  gap:30px;
  align-items:center;
  padding:18px 40px;
  margin: -160px auto 0;
}

.compra-band{
  background:#7f1716;
  color:#f8e7c5;
  text-align:center;
  padding:30px 0px 28px;
  font-size:.55rem;
  letter-spacing:.08em;
  position:relative;
  top:-22px;
}

.compra-icon-main{
  width:92px;
  height:92px;
  border-radius:50%;
  background:#811818;
  color:#dca34c;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:3rem;
  border:3px solid #d39442;
}

.compra-destacado h2{
  color:#7b1b18;
  font-size:1.5rem;
  margin:0;
  letter-spacing:.04em;
}

.compra-destacado h3{
  color:#9b5b22;
  font-size:0.80rem;
  margin:5px 0 12px;
}

.compra-destacado p{
  font-family:'Lora', serif;
  margin:0;
  line-height:1.4;
  font-size:0.80rem;
}

.compra-monto{
  border-left:1px solid rgba(130,70,30,.25);
  border-right:1px solid rgba(130,70,30,.25);
  text-align:center;
  padding:10px 30px;
}

.compra-monto span,
.compra-valor span{
  display:block;
  font-weight:700;
  font-size:.9rem;
}

.compra-monto strong,
.compra-valor strong{
  color:#7b1b18;
  font-size:2.6rem;
  font-weight:500;
}

.compra-btn,
.compra-ayuda a{
  display:block;
  background:linear-gradient(90deg,#761514,#8e1f1b,#681210);
  color:#fff4df;
  text-decoration:none;
  text-align:center;
  padding:18px 28px;
  border-radius:8px;
  font-weight:700;
  letter-spacing:.04em;
}

.compra-pago-btn a {
  display:block;
  width: 180px;  
  background:linear-gradient(90deg,#761514,#8e1f1b,#681210);
  color:#fff4df;
  text-decoration:none;
  text-align:center;
  padding:18px 28px;
  border-radius:8px;
  font-weight:700;
  letter-spacing:.04em;
}


.compra-pago-btn small{
  display:inline-block;
  text-align:center;
  margin-top:12px;
  color:#8d5a28;
}

.compra-seguro{
  display: block;
  text-align:center;
  margin-top:12px;
  color:#8d5a28;
}

.compra-hero img{
  width: 5%;
  height: auto;
}

.compra-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:16px;
  margin-top:24px;
}

.compra-card{
  background:rgba(255,250,244,.82);
  border:1px solid rgba(180,120,60,.35);
  border-radius:14px;
  padding:28px;
  box-shadow:0 8px 22px rgba(100,60,30,.08);
}

.compra-card-title{
  display:flex;
  align-items:center;
  gap:18px;
  border-bottom:1px solid rgba(160,100,50,.25);
  padding-bottom:18px;
  margin-bottom:22px;
}

.compra-card-title span{
  width:64px;
  height:64px;
  border-radius:50%;
  background:#f8ead8;
  color:#c88a3a;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:2rem;
}

.compra-card-title h2{
  color:#711c18;
  font-size:1.35rem;
  letter-spacing:.05em;
  margin:0;
}

.compra-sinpe-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}

.compra-card-title-text p{
  margin:4px 0 0;
  font-size:.9rem;
  color:#8b6b55;
  font-style:italic;
}

.compra-info-box{
  background:rgba(255,255,255,.42);
  border:1px solid rgba(180,120,60,.18);
  border-radius:8px;
  text-align:center;
  padding:18px;
  margin-bottom:18px;
}

.compra-info-box span{
  display:block;
  font-weight:700;
  color:#711c18;
}

.compra-info-box strong{
  font-size:2rem;
  font-weight:500;
}

.compra-importante h3{
  color:#711c18;
  margin:0 0 8px;
}

.compra-importante p,
.compra-importante li,
.compra-bank-data p,
.compra-whatsapp-box p,
.compra-servicio li,
.compra-servicio p,
.compra-steps p{
  font-family:'Lora', serif;
  font-size:.65rem;
  line-height:1.5;
}

.compra-importante ul,
.compra-servicio ul{
  list-style:none;
  padding:0;
  margin:10px 0;
}

.compra-importante li::before,
.compra-servicio li::before{
  content:"✓";
  color:#c58a3f;
  margin-right:8px;
}

.compra-ejemplo,
.compra-whatsapp-box{
  background:rgba(246,230,210,.45);
  border-radius:8px;
  padding:16px;
}

.compra-ejemplo span{
  color:#9a5b23;
  font-weight:700;
}

.compra-bank-data b{
  color:#711c18;
  font-size:.85rem;
}

.compra-whatsapp-box a{
  display:block;
  border:1px solid #8d2d1e;
  color:#711c18;
  text-decoration:none;
  text-align:center;
  padding:13px;
  border-radius:7px;
  font-weight:700;
  margin-top:10px;
}

.compra-servicio-content{
  display:grid;
  grid-template-columns:1.4fr .9fr;
  gap:24px;
  align-items:center;
}

.compra-servicio{
  overflow:hidden;
}

.compra-servicio-content h3{
  color:#7b1b18;
  font-size:1.8rem;
  margin:0 0 14px;
}

.compra-servicio-content img{
  width:150%;
  max-width:none;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:50%;
  object-position:110% center;
  transform:translateX(18%);
}

.compra-valor{
  text-align:center;
  border-top:1px solid rgba(160,100,50,.25);
  margin-top:20px;
  padding-top:18px;
}

.compra-postpago{
  background:rgba(255,250,244,.82);
  border:1px solid rgba(180,120,60,.35);
  border-radius:14px;
  padding:22px 40px;
  margin-top:16px;
}

.compra-postpago h2{
  text-align:center;
  color:#711c18;
  margin:0 0 20px;
  letter-spacing:.06em;
}

.compra-steps{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1.2fr;
  gap:30px;
  align-items:center;
}

/* Solo los tres pasos */
.compra-steps > div:not(.compra-ayuda){
  position:relative;
  padding-left:105px;
  min-height:85px;
}

/* Círculo grande */
.compra-steps > div:not(.compra-ayuda)::before{
  content:"";
  position:absolute;
  left:12px;
  top:8px;
  width:72px;
  height:72px;
  border-radius:50%;
  background:#f8ead8;
  border:1px solid rgba(180,120,60,.25);
}

/* Ícono de Font Awesome */
.compra-step-icon{
  position:absolute;
  left:12px;
  top:8px;
  width:72px;
  height:72px;

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

  color:#c88a3a;
  font-size:2rem;
  z-index:1;
}

/* Número pequeño */
.compra-steps > div:not(.compra-ayuda) > span{
  position:absolute;
  left:0;
  top:0;
  width:30px;
  height:30px;
  border-radius:50%;
  background:#7b1b18;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2;
}

.compra-steps h3{
  margin:0 0 8px;
  font-size:1.05rem;
}

.compra-ayuda{
  border-left:1px solid rgba(160,100,50,.25);
  padding-left:40px !important;
}

.compra-ayuda a{
  background:#2e963f;
  margin-top:18px;
}

/* RESPONSIVE COMPRA */

@media(max-width:1100px){
  .compra-destacado,
  .compra-grid,
  .compra-steps{
    grid-template-columns:1fr;
  }

  .compra-destacado{
    text-align:center;
  }

  .compra-icon-main{
    margin:0 auto;
  }

  .compra-sinpe-layout,
  .compra-servicio-content{
    grid-template-columns:1fr;
  }

  .compra-wrapper{
    padding:0 20px 30px;
  }

  .compra-hero-content h1{
    font-size:2.7rem;
  }
  
    .compra-hero{
    padding-top:50px;
    min-height: 440px;
  }

  .compra-band{
  margin-top:3px;
}

@media (max-width: 600px) {
  .compra-page {
    background-position: center 70px;
    background-size: 100% auto;
  }
}

}
/* =========================================================
   FORMULARIO POSTPAGO — TAO CON SHARON
   Todo está encapsulado con .tcs-form-page
   para evitar choques con el resto del sitio.
========================================================= */

.tcs-form-page{
  --tcs-form-wine:#6f1518;
  --tcs-form-wine-dark:#4c0e12;
  --tcs-form-gold:#c68d3f;
  --tcs-form-gold-soft:#e8c893;
  --tcs-form-cream:#fffaf3;
  --tcs-form-cream-2:#f8ecdd;
  --tcs-form-line:rgba(171,112,53,.25);
  --tcs-form-text:#351c18;
  --tcs-form-muted:#715d52;

  min-height:100vh;
  margin:0;
  overflow-x:hidden;
  color:var(--tcs-form-text);
  font-family:'Lora', serif;

  background:
    linear-gradient(rgba(255,250,244,.78), rgba(255,250,244,.90)),
    url("images/compra-hero.jpg") center top / cover no-repeat fixed;
}

.tcs-form-page,
.tcs-form-page *{
  box-sizing:border-box;
}

.tcs-form-page a{
  color:inherit;
  text-decoration:none;
}

.tcs-form-page button,
.tcs-form-page input,
.tcs-form-page select,
.tcs-form-page textarea{
  font:inherit;
}

/* HEADER */

.tcs-form-header{
  padding:100px 0 8px;
  display:grid;
  align-items:center;
  gap:40px;
}

.tcs-form-logo{
  display:inline-flex;
  width:max-content;
}

.tcs-form-logo img{
  display:block;
  width:155px;
  height:auto;
}

.tcs-form-progress{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
}

.tcs-form-progress-item{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:176px;
}

.tcs-form-progress-circle{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:50%;

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

  background:#e6c28e;
  color:white;
  font-family:'Cinzel', serif;
  font-size:.9rem;
  font-weight:600;
}

.tcs-form-progress-item.is-complete .tcs-form-progress-circle{
  background:var(--tcs-form-gold);
}

.tcs-form-progress-item.is-active .tcs-form-progress-circle{
  background:var(--tcs-form-wine);
}

.tcs-form-progress-item strong{
  display:block;
  margin-bottom:3px;
  font-family:'Cormorant Garamond', serif;
  font-size:1rem;
  font-weight:600;
}

.tcs-form-progress-item small{
  display:block;
  color:#5c4a41;
  font-size:.68rem;
  white-space:nowrap;
}

.tcs-form-progress-line{
  width:34px;
  height:1px;
  background:var(--tcs-form-gold);
  flex:0 0 34px;
}

/* HERO */

.tcs-form-hero{
  max-width:900px;
  margin:8px auto 20px;
  padding:8px 20px 0;
  text-align:center;
}

.tcs-form-hero-symbol{
  width:74px;
  height:74px;
  margin:0 auto 12px;
  border:2px solid var(--tcs-form-gold);
  border-radius:50%;

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

  color:var(--tcs-form-gold);
  font-size:2.3rem;
  background:rgba(255,250,244,.62);
}

.tcs-form-hero h1{
  margin:0;
  color:var(--tcs-form-wine);
  font-family:'Cormorant Garamond', serif;
  font-size:2.8rem;
  line-height:1;
  font-weight:700;
}

.tcs-form-hero h2{
  margin:9px 0 5px;
  color:var(--tcs-form-wine);
  font-family:'Cormorant Garamond', serif;
  font-size:1.25rem;
  font-weight:500;
}

.tcs-form-mini-divider{
  display:block;
  width:190px;
  height:1px;
  margin:9px auto;
  background:linear-gradient(90deg, transparent, var(--tcs-form-gold), transparent);
}

.tcs-form-hero p{
  margin:0;
  font-size:.9rem;
}

/* TARJETA PRINCIPAL */

.tcs-form-card{
  width:min(1480px, calc(100% - 70px));
  margin:0 auto;

  display:grid;
  grid-template-columns:1.32fr .95fr 1fr;
  gap:0;

  position:relative;
  padding:22px 24px 76px;

  background:rgba(255,252,247,.92);
  border:1px solid var(--tcs-form-line);
  border-radius:14px;
  box-shadow:0 18px 55px rgba(76,39,22,.10);
  backdrop-filter:blur(6px);
}

.tcs-form-column{
  min-width:0;
  padding:0 24px;
}

.tcs-form-column + .tcs-form-column{
  border-left:1px solid var(--tcs-form-line);
}

/* TÍTULOS */

.tcs-form-section-title{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:56px;
  margin-bottom:20px;
  padding-bottom:8px;
  border-bottom:1px solid var(--tcs-form-line);
}

.tcs-form-title-icon{
  width:43px;
  height:43px;
  flex:0 0 43px;
  border-radius:50%;

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

  color:var(--tcs-form-gold);
  border:1px solid rgba(198,141,63,.35);
  background:#fff8ef;
  font-size:1.25rem;
}

.tcs-form-section-title h2{
  margin:0;
  color:var(--tcs-form-wine);
  font-family:'Cormorant Garamond', serif;
  font-size:1.18rem;
  line-height:1.2;
  text-transform:uppercase;
  font-weight:700;
}

.tcs-form-section-title h2 small{
  font-size:.82em;
}

/* CAMPOS */

.tcs-form-fields-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px 22px;
}

.tcs-form-field{
  display:block;
  min-width:0;
  margin:0;
  padding:0;
  border:0;
}

.tcs-form-field > span:first-child,
.tcs-form-field legend,
.tcs-form-topic-field legend{
  display:block;
  margin-bottom:8px;
  padding:0;
  color:#321f1b;
  font-size:.73rem;
  font-weight:500;
}

.tcs-form-field b{
  color:#b04747;
  font-weight:500;
}

.tcs-form-input-wrap{
  min-height:38px;
  width:100%;
  padding:0 11px;

  display:flex;
  align-items:center;
  gap:10px;

  border:1px solid var(--tcs-form-line);
  border-radius:6px;
  background:rgba(255,252,247,.76);
}

.tcs-form-input-wrap > i{
  color:var(--tcs-form-gold);
  font-size:.82rem;
}

.tcs-form-input-wrap input,
.tcs-form-input-wrap select{
  width:100%;
  min-width:0;
  height:36px;
  border:0;
  outline:0;
  color:#4e3c34;
  background:transparent;
  font-size:.72rem;
}

.tcs-form-input-wrap input::placeholder,
.tcs-form-textarea-wrap textarea::placeholder{
  color:#9a8b82;
}

.tcs-form-input-wrap select,
.tcs-form-date-grid select,
.tcs-form-time-row select{
  appearance:auto;
  cursor:pointer;
}

/* FECHA Y HORA */

.tcs-form-date-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1.1fr;
  gap:8px;
}

.tcs-form-date-grid select,
.tcs-form-time-row select{
  width:100%;
  height:38px;
  padding:0 9px;
  border:1px solid var(--tcs-form-line);
  border-radius:6px;
  outline:0;
  color:#57453d;
  background:#fffaf4;
  font-size:.7rem;
}

.tcs-form-time-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

/* CHECKBOX */

.tcs-form-checkbox{
  min-height:50px;
  padding-top:22px;

  display:flex;
  align-items:flex-start;
  gap:9px;

  cursor:pointer;
  font-size:.68rem;
  line-height:1.35;
}

.tcs-form-checkbox input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.tcs-form-checkbox-box{
  width:18px;
  height:18px;
  flex:0 0 18px;
  border:1px solid var(--tcs-form-gold);
  border-radius:4px;
  background:#fff;
  position:relative;
}

.tcs-form-checkbox input:checked + .tcs-form-checkbox-box{
  background:var(--tcs-form-wine);
  border-color:var(--tcs-form-wine);
}

.tcs-form-checkbox input:checked + .tcs-form-checkbox-box::after{
  content:"✓";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:.72rem;
}

.tcs-form-checkbox small{
  display:block;
  margin-top:4px;
  color:#6f5a4f;
  font-size:.62rem;
}

.tcs-form-note{
  max-width:380px;
  margin-top:18px;
  padding:10px 15px;

  display:flex;
  align-items:flex-start;
  gap:12px;

  border:1px solid rgba(198,141,63,.18);
  border-radius:6px;
  background:#f8eee1;
}

.tcs-form-note i{
  margin-top:2px;
  color:var(--tcs-form-gold);
}

.tcs-form-note p{
  margin:0;
  font-size:.62rem;
  line-height:1.55;
}

/* TEMAS */

.tcs-form-topic-field{
  margin:0;
  padding:0;
  border:0;
}

.tcs-form-topic-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
}

.tcs-form-topic{
  min-height:58px;
  cursor:pointer;
}

.tcs-form-topic input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.tcs-form-topic span{
  height:100%;
  padding:8px 10px;

  display:flex;
  align-items:center;
  gap:9px;

  border:1px solid var(--tcs-form-line);
  border-radius:6px;
  background:#fffaf4;
  color:#4b362e;
  font-size:.65rem;
  line-height:1.25;
  transition:.2s ease;
}

.tcs-form-topic span i{
  color:var(--tcs-form-gold);
  font-size:1rem;
}

.tcs-form-topic input:checked + span{
  color:var(--tcs-form-wine);
  border-color:var(--tcs-form-gold);
  background:#f9ead8;
  box-shadow:0 0 0 2px rgba(198,141,63,.08);
}

.tcs-form-textarea-field{
  margin-top:25px;
}

.tcs-form-textarea-wrap{
  position:relative;
  display:block;
}

.tcs-form-textarea-wrap textarea{
  width:100%;
  min-height:118px;
  resize:vertical;
  padding:14px 38px 14px 14px;

  border:1px solid var(--tcs-form-line);
  border-radius:6px;
  outline:0;
  background:#fffaf4;
  color:#4e3c34;
  font-size:.7rem;
  line-height:1.55;
}

.tcs-form-textarea-wrap > i{
  position:absolute;
  right:12px;
  bottom:12px;
  color:var(--tcs-form-gold);
}

/* ENTREGA */

.tcs-form-delivery-list{
  display:grid;
  gap:10px;
}

.tcs-form-delivery-option{
  min-height:82px;
  padding:12px;

  display:grid;
  grid-template-columns:58px 1fr 22px;
  align-items:center;
  gap:14px;

  cursor:pointer;
  border:1px solid var(--tcs-form-line);
  border-radius:7px;
  background:rgba(255,250,244,.72);
  transition:.2s ease;
}

.tcs-form-delivery-option input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.tcs-form-delivery-icon{
  width:52px;
  height:52px;
  border-radius:50%;

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

  color:var(--tcs-form-gold);
  border:1px solid rgba(198,141,63,.25);
  background:#fbf0e2;
  font-size:1.25rem;
}

.tcs-form-delivery-text strong{
  display:block;
  margin-bottom:5px;
  font-family:'Cormorant Garamond', serif;
  font-size:1rem;
}

.tcs-form-delivery-text small{
  display:block;
  color:#6b574e;
  font-size:.65rem;
  line-height:1.45;
}

.tcs-form-radio-dot{
  width:21px;
  height:21px;
  border-radius:50%;
  border:1px solid var(--tcs-form-gold-soft);
  background:#fff;
  position:relative;
}

.tcs-form-delivery-option input:checked ~ .tcs-form-radio-dot::after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:50%;
  background:var(--tcs-form-wine);
}

.tcs-form-delivery-option:has(input:checked){
  border-color:var(--tcs-form-gold);
  background:#fbefe2;
}

/* BOTÓN */

.tcs-form-submit-area{
  position:absolute;
  left:50%;
  bottom:-55px;
  transform:translateX(-50%);

  width:min(510px, calc(100% - 40px));
  text-align:center;
}

.tcs-form-submit{
  width:100%;
  min-height:50px;
  padding:14px 24px;

  border:0;
  border-radius:6px;
  cursor:pointer;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;

  color:#fff6e9;
  background:linear-gradient(90deg, #6d1015, #8a191b, #6d1015);
  box-shadow:0 10px 25px rgba(91,18,20,.18);

  font-family:'Cinzel', serif;
  font-size:.9rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.tcs-form-submit i{
  color:var(--tcs-form-gold);
}

.tcs-form-submit:hover{
  filter:brightness(1.06);
}

.tcs-form-security{
  display:block;
  margin-top:12px;
  color:#5f4d44;
  font-size:.66rem;
}

.tcs-form-security i{
  margin-right:7px;
  color:var(--tcs-form-gold);
}

/* BLOQUE INFERIOR */

.tcs-form-bottom-info{
  width:min(1480px, calc(100% - 70px));
  margin:74px auto 20px;
  padding:18px 30px;

  display:grid;
  grid-template-columns:1fr 1.08fr 1.15fr;
  gap:0;

  border:1px solid var(--tcs-form-line);
  border-radius:10px;
  background:rgba(255,249,242,.84);
}

.tcs-form-info-item{
  min-height:64px;
  padding:0 28px;

  display:flex;
  align-items:center;
  gap:18px;
}

.tcs-form-info-item + .tcs-form-info-item{
  border-left:1px solid var(--tcs-form-line);
}

.tcs-form-info-item > span{
  width:54px;
  height:54px;
  flex:0 0 54px;
  border-radius:50%;

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

  color:var(--tcs-form-gold);
  border:1px solid rgba(198,141,63,.28);
  font-size:1.45rem;
}

.tcs-form-info-item p{
  margin:0;
  font-size:.7rem;
  line-height:1.65;
}

.tcs-form-info-whatsapp a{
  margin-left:auto;
  padding:10px 17px;
  border-radius:7px;
  color:#fff;
  background:var(--tcs-form-wine);
  font-size:.72rem;
}

/* FOOTER */

.tcs-form-footer{
  min-height:90px;
  padding:18px 5%;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:35px;

  color:#d6a24e;
  background:
    radial-gradient(circle at center, rgba(152,35,38,.68), transparent 45%),
    linear-gradient(90deg, #4b0d11, #781318, #4b0d11);
}

.tcs-form-footer-brand{
  display:flex;
  align-items:center;
  gap:15px;
  min-width:320px;
}

.tcs-form-footer-brand > i{
  font-size:2.2rem;
}

.tcs-form-footer-brand strong,
.tcs-form-footer-brand small{
  display:block;
}

.tcs-form-footer-brand strong{
  margin-bottom:4px;
  font-family:'Cinzel', serif;
  font-size:.82rem;
  text-transform:uppercase;
}

.tcs-form-footer-brand small{
  color:#c99f68;
  font-size:.68rem;
}

.tcs-form-footer-values{
  flex:1;
  display:grid;
  grid-template-columns:repeat(5, 1fr);
}

.tcs-form-footer-values span{
  min-height:42px;
  padding:0 18px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  border-left:1px solid rgba(214,162,78,.20);

  font-family:'Cinzel', serif;
  font-size:.65rem;
  text-transform:uppercase;
  white-space:nowrap;
}

.tcs-form-footer-values i{
  font-size:1.25rem;
}

/* RESPONSIVE */

@media (max-width:1250px){

  .tcs-form-header{
    grid-template-columns:180px 1fr;
  }

  .tcs-form-progress-item{
    min-width:145px;
  }

  .tcs-form-progress-item small{
    white-space:normal;
  }

  .tcs-form-card{
    grid-template-columns:1fr 1fr;
  }

  .tcs-form-column-delivery{
    grid-column:1 / -1;
    border-left:0 !important;
    border-top:1px solid var(--tcs-form-line);
    margin-top:24px;
    padding-top:24px;
  }

  .tcs-form-delivery-list{
    grid-template-columns:repeat(3, 1fr);
  }

  .tcs-form-delivery-option{
    grid-template-columns:52px 1fr 20px;
  }

  .tcs-form-footer{
    flex-direction:column;
  }

  .tcs-form-footer-brand{
    min-width:0;
  }

  .tcs-form-footer-values{
    width:100%;
  }
}

@media (max-width:900px){

  .tcs-form-header{
    width:min(100% - 34px, 760px);
    grid-template-columns:1fr;
    justify-items:center;
  }

  .tcs-form-progress{
    width:100%;
    overflow-x:auto;
    justify-content:flex-start;
    padding-bottom:8px;
  }

  .tcs-form-hero h1{
    font-size:2.2rem;
  }

  .tcs-form-card{
    width:min(100% - 34px, 760px);
    grid-template-columns:1fr;
    padding-inline:18px;
  }

  .tcs-form-column{
    padding:0;
  }

  .tcs-form-column + .tcs-form-column{
    border-left:0;
    border-top:1px solid var(--tcs-form-line);
    margin-top:24px;
    padding-top:24px;
  }

  .tcs-form-delivery-list{
    grid-template-columns:1fr;
  }

  .tcs-form-bottom-info{
    width:min(100% - 34px, 760px);
    grid-template-columns:1fr;
    padding:8px 20px;
  }

  .tcs-form-info-item{
    padding:16px 0;
  }

  .tcs-form-info-item + .tcs-form-info-item{
    border-left:0;
    border-top:1px solid var(--tcs-form-line);
  }

  .tcs-form-footer-values{
    grid-template-columns:1fr 1fr;
  }

  .tcs-form-footer-values span{
    border:0;
  }
}

@media (max-width:620px){

  .tcs-form-header{
    padding-top:114px;
  }

.tcs-form-progress{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px 12px;
  width:100%;
  overflow:visible;

  padding-left:30px;
  padding-bottom:0;

  box-sizing:border-box;
}


.tcs-form-progress-item{
  width:100%;
  min-width:0;
  justify-content:flex-start;
}


.tcs-form-progress-item small{
  white-space:normal;
}


.tcs-form-progress-line{
  display:none;
}

  .tcs-form-hero{
    margin-top:12px;
  }

  .tcs-form-hero-symbol{
    width:62px;
    height:62px;
    font-size:1.8rem;
  }

  .tcs-form-hero h1{
    font-size:1.85rem;
  }

  .tcs-form-hero h2{
    font-size:1.05rem;
  }

  .tcs-form-fields-grid{
    grid-template-columns:1fr;
  }

  .tcs-form-checkbox{
    padding-top:0;
  }

  .tcs-form-topic-grid{
    grid-template-columns:1fr 1fr;
  }

  .tcs-form-submit-area{
    bottom:-66px;
  }

  .tcs-form-bottom-info{
    margin-top:88px;
  }

  .tcs-form-info-whatsapp{
    flex-wrap:wrap;
  }

  .tcs-form-info-whatsapp a{
    margin-left:72px;
  }

  .tcs-form-footer{
    padding:25px 20px;
  }

  .tcs-form-footer-values{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   TAO CON SHARON - TESTIMONIOS
   TOTALMENTE ENCAPSULADO
========================================================= */

.tao-review-page {
    --tao-bg: #fbf5ed;
    --tao-bg-card: #fffaf4;
    --tao-text: #35221a;
    --tao-text-soft: #6f6259;

    --tao-red: #761b19;
    --tao-red-dark: #5d100f;

    --tao-gold: #c9903c;
    --tao-gold-light: #ddb06b;

    --tao-border: rgba(178, 130, 75, 0.28);

    width: 100%;
    margin: 0;
    padding: 0;

    background:
        linear-gradient(
            180deg,
            #fffaf4 0%,
            #fbf5ed 100%
        );

    color: var(--tao-text);

    font-family:
        "Lora",
        Georgia,
        serif;
}


.tao-review-page *,
.tao-review-page *::before,
.tao-review-page *::after {
    box-sizing: border-box;
}



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

.tao-review-page .tao-review-hero {
    width: 100%;
    min-height: 300px;

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

    position: relative;

    background-image:
        linear-gradient(
            90deg,
            rgba(255, 247, 238, 0.10) 0%,
            rgba(255, 248, 240, 0.78) 36%,
            rgba(255, 248, 240, 0.78) 64%,
            rgba(255, 247, 238, 0.10) 100%
        ),
        url("images/testimonios-hero.jpg");

    background-position: center;
    background-size: cover;

    overflow: hidden;
}


.tao-review-page .tao-review-hero-inner {
    width: min(760px, 92%);

    padding: 24px 20px 27px;

    text-align: center;
        transform: translateY(40px);

}


.tao-review-page .tao-review-lotus-mark {
    width: 30px;
    height: 24px;

    margin: 0 auto 3px;

    position: relative;
}


.tao-review-page .tao-review-lotus-mark::before {
    content: "♢";

    display: block;

    color: var(--tao-red);

    font-size: 28px;

    line-height: 1;
}


.tao-review-page .tao-review-hero h1 {
    margin: 0;

    font-family:
        "Cinzel",
        Georgia,
        serif;

    font-size: clamp(31px, 3vw, 42px);

    font-weight: 500;

    letter-spacing: .015em;

    line-height: 1.1;

    color: #2e1c14;
}


.tao-review-page .tao-review-hero p {
    max-width: 630px;

    margin: 6px auto 0;

    font-family:
        Arial,
        sans-serif;

    font-size: 12px;

    line-height: 1.55;

    color: #463b35;
}



/* =========================================================
   DIVISOR
========================================================= */

.tao-review-page .tao-review-divider {
    display: flex;

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

    gap: 6px;

    margin: 8px auto 6px;
}


.tao-review-page .tao-review-divider span {
    width: 44px;
    height: 1px;

    display: block;

    background:
        rgba(184, 124, 47, .7);
}


.tao-review-page .tao-review-divider i {
    width: 6px;
    height: 6px;

    display: block;

    background:
        var(--tao-gold);

    transform:
        rotate(45deg);
}



/* =========================================================
   CONTENT
========================================================= */

.tao-review-page .tao-review-content {
    width: min(1030px, calc(100% - 36px));

    margin: 0 auto;

    padding: 14px 0 10px;
}


.tao-review-page .tao-review-top-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 2.15fr)
        minmax(280px, 1fr);

    gap: 12px;
}



/* =========================================================
   CARDS
========================================================= */

.tao-review-page .tao-review-form-card,
.tao-review-page .tao-review-benefits {
    border:
        1px solid
        var(--tao-border);

    border-radius: 11px;

    background:
        rgba(255, 252, 247, .87);

    box-shadow:
        0 4px 17px
        rgba(88, 54, 34, .025);
}



/* =========================================================
   FORM CARD
========================================================= */

.tao-review-page .tao-review-form-card {
    padding:
        12px
        25px
        11px;
}


.tao-review-page .tao-review-card-heading {
    display: flex;

    align-items: center;

    gap: 11px;

    margin-bottom: 12px;
}


.tao-review-page .tao-review-card-heading h2 {
    margin: 0;

    font-family:
        "Cinzel",
        Georgia,
        serif;

    font-size: 19px;

    font-weight: 500;

    color: #352219;
}


.tao-review-page .tao-review-round-icon {
    width: 39px;
    height: 39px;

    flex: 0 0 39px;

    display: flex;

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

    border:
        1px solid
        rgba(201, 144, 60, .22);

    border-radius: 50%;

    background:
        #fff3e5;
}


.tao-review-page .tao-review-round-icon svg {
    width: 21px;
    height: 21px;

    fill: none;

    stroke:
        var(--tao-gold);

    stroke-width: 1.6;
}



/* =========================================================
   FORM GENERAL
========================================================= */

.tao-review-page .tao-review-form {
    margin: 0;
    padding: 0;
}


.tao-review-page .tao-review-two-columns {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 18px;
}


.tao-review-page .tao-review-field {
    min-width: 0;

    display: flex;

    flex-direction: column;

    gap: 5px;
}


.tao-review-page .tao-review-field-full {
    margin-top: 12px;
}


.tao-review-page .tao-review-field label,
.tao-review-page .tao-review-rating > label {
    margin: 0;

    font-family:
        Arial,
        sans-serif;

    font-size: 9.5px;

    font-weight: 600;

    color: #312922;
}


.tao-review-page .tao-review-field label b,
.tao-review-page .tao-review-rating label b {
    color: #a6312d;
}



/* =========================================================
   INPUTS
========================================================= */

.tao-review-page .tao-review-input-icon {
    position: relative;
}


.tao-review-page .tao-review-input-icon svg {
    width: 14px;
    height: 14px;

    position: absolute;

    top: 50%;
    left: 10px;

    transform:
        translateY(-50%);

    fill: none;

    stroke:
        var(--tao-gold);

    stroke-width: 1.5;

    pointer-events: none;
}


.tao-review-page input[type="text"],
.tao-review-page input[type="email"],
.tao-review-page select,
.tao-review-page textarea {
    width: 100%;

    margin: 0;

    border:
        1px solid
        rgba(180, 131, 76, .27);

    border-radius: 4px;

    outline: none;

    background:
        rgba(255, 252, 247, .88);

    color: #473a31;

    font-family:
        Arial,
        sans-serif;

    font-size: 9.5px;

    box-shadow: none;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}


.tao-review-page input[type="text"],
.tao-review-page input[type="email"],
.tao-review-page select {
    height: 31px;

    padding:
        0
        10px;
}


.tao-review-page .tao-review-input-icon input {
    padding-left: 30px;
}


.tao-review-page select {
    cursor: pointer;
}


.tao-review-page textarea {
    min-height: 70px;

    padding:
        9px
        10px;

    line-height: 1.4;

    resize: vertical;
}


.tao-review-page input:focus,
.tao-review-page select:focus,
.tao-review-page textarea:focus {
    border-color:
        rgba(199, 137, 55, .8);

    box-shadow:
        0 0 0 2px
        rgba(199, 137, 55, .07);
}


.tao-review-page input::placeholder,
.tao-review-page textarea::placeholder {
    color: #999087;
}


.tao-review-page .tao-review-field small,
.tao-review-page .tao-review-rating small {
    color: #8c8078;

    font-family:
        Arial,
        sans-serif;

    font-size: 8px;
}



/* =========================================================
   EXPERIENCE
========================================================= */

.tao-review-page .tao-review-experience-grid {
    display: grid;

    grid-template-columns:
        .85fr
        1.75fr;

    gap: 15px;

    margin-top: 11px;
}



/* =========================================================
   STARS
========================================================= */

.tao-review-page .tao-review-stars {
    display: flex;

    flex-direction: row-reverse;
    justify-content: flex-end;

    gap: 8px;

    margin:
        6px
        0
        2px;
}


.tao-review-page .tao-review-stars input {
    position: absolute;

    opacity: 0;

    pointer-events: none;
}


.tao-review-page .tao-review-stars label {
    color: transparent;

    font-size: 22px;

    line-height: 1;

    cursor: pointer;

    -webkit-text-stroke:
        1.3px
        var(--tao-gold);

    transition:
        color .15s ease;
}


.tao-review-page .tao-review-stars label:hover,
.tao-review-page .tao-review-stars label:hover ~ label,
.tao-review-page .tao-review-stars input:checked ~ label {
    color:
        var(--tao-gold);
}



/* =========================================================
   RECOMMEND
========================================================= */

.tao-review-page .tao-review-recommend {
    margin:
        11px
        0
        0;

    padding: 0;

    border: 0;
}


.tao-review-page .tao-review-recommend legend {
    margin:
        0
        0
        6px;

    padding: 0;

    font-family:
        Arial,
        sans-serif;

    font-size: 9.5px;

    font-weight: 600;

    color: #312922;
}


.tao-review-page .tao-review-options {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap:
        8px
        25px;
}


.tao-review-page .tao-review-options label {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    margin: 0;

    font-family:
        Arial,
        sans-serif;

    font-size: 8.5px;

    font-weight: 400;

    color: #443a33;

    cursor: pointer;
}


.tao-review-page .tao-review-options input {
    position: absolute;

    opacity: 0;
}


.tao-review-page .tao-review-options label > span {
    width: 12px;
    height: 12px;

    display: inline-block;

    position: relative;

    border:
        1px solid
        var(--tao-gold);

    border-radius: 50%;
}


.tao-review-page
.tao-review-options
input:checked + span {
    border-color:
        var(--tao-red);

    background:
        var(--tao-red);
}


.tao-review-page
.tao-review-options
input:checked + span::after {
    content: "";

    width: 4px;
    height: 4px;

    position: absolute;

    top: 50%;
    left: 50%;

    border-radius: 50%;

    background: white;

    transform:
        translate(-50%, -50%);
}



/* =========================================================
   PERMISSION
========================================================= */

.tao-review-page .tao-review-permission {
    display: flex;

    align-items: flex-start;

    gap: 7px;

    margin-top: 10px;

    font-family:
        Arial,
        sans-serif;

    font-size: 8.5px;

    line-height: 1.45;

    color: #493d35;

    cursor: pointer;
}


.tao-review-page .tao-review-permission input {
    position: absolute;

    opacity: 0;
}


.tao-review-page .tao-review-checkmark {
    width: 12px;
    height: 12px;

    flex: 0 0 12px;

    position: relative;

    margin-top: 1px;

    border:
        1px solid
        var(--tao-red);

    border-radius: 2px;

    background: white;
}


.tao-review-page
.tao-review-permission
input:checked + .tao-review-checkmark {
    background:
        var(--tao-red);
}


.tao-review-page
.tao-review-permission
input:checked + .tao-review-checkmark::after {
    content: "";

    width: 3px;
    height: 6px;

    position: absolute;

    top: 1px;
    left: 4px;

    border:
        solid white;

    border-width:
        0 1.5px 1.5px 0;

    transform:
        rotate(45deg);
}



/* =========================================================
   SUBMIT
========================================================= */

.tao-review-page .tao-review-submit {
    width: 48%;
    height: 32px;

    display: flex;

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

    gap: 8px;

    margin:
        12px
        auto
        0;

    padding:
        0
        18px;

    border: 0;

    border-radius: 4px;

    background:
        linear-gradient(
            90deg,
            #651513,
            #811d19
        );

    color: #fff5e9;

    font-family:
        "Cinzel",
        Georgia,
        serif;

    font-size: 10px;

    font-weight: 500;

    letter-spacing: .03em;

    cursor: pointer;
}


.tao-review-page .tao-review-submit:hover {
    background:
        linear-gradient(
            90deg,
            #711a17,
            #91231f
        );
}


.tao-review-page .tao-review-button-lotus::before {
    content: "♢";

    color:
        var(--tao-gold);

    font-size: 15px;
}


.tao-review-page .tao-review-security {
    display: flex;

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

    gap: 5px;

    margin-top: 7px;

    color: #82776e;

    font-family:
        Arial,
        sans-serif;

    font-size: 8px;
}


.tao-review-page .tao-review-security svg {
    width: 11px;
    height: 11px;

    fill: none;

    stroke:
        var(--tao-gold);

    stroke-width: 1.7;
}



/* =========================================================
   RIGHT PANEL
========================================================= */

.tao-review-page .tao-review-benefits {
    min-height: 100%;
    position: relative;
    overflow: hidden;

    padding:
        18px
        19px
        90px;

    background-image: url("images/testimonios-small-hero.jpg");
    background-repeat: no-repeat;
    background-size: 104% auto;
    background-position: top center;
}

.tao-review-page .tao-review-benefits-header {
    margin-bottom: 17px;

    text-align: center;
}


.tao-review-page .tao-review-lotus-small {
    margin-bottom: 5px;
}


.tao-review-page .tao-review-lotus-small::before {
    content: "♢";

    color:
        var(--tao-gold);

    font-size: 22px;
}


.tao-review-page .tao-review-benefits-header h2 {
    margin: 0;

    font-family:
        "Cinzel",
        Georgia,
        serif;

    font-size: 15px;

    font-weight: 500;

    color: #352219;
}



/* =========================================================
   BENEFIT
========================================================= */

.tao-review-page .tao-review-benefit {
    display: grid;

    grid-template-columns:
        44px
        1fr;

    gap: 11px;

    margin-bottom: 17px;

    align-items: start;
}


.tao-review-page .tao-review-benefit-icon {
    width: 41px;
    height: 41px;

    display: flex;

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

    border:
        1px solid
        rgba(199, 144, 60, .24);

    border-radius: 50%;

    background:
        rgba(255, 250, 243, .65);
}


.tao-review-page .tao-review-benefit-icon svg {
    width: 21px;
    height: 21px;

    fill: none;

    stroke:
        var(--tao-gold);

    stroke-width: 1.5;
}


.tao-review-page .tao-review-benefit h3 {
    margin:
        2px
        0
        4px;

    font-family:
        "Cinzel",
        Georgia,
        serif;

    font-size: 11px;

    font-weight: 500;

    color: #38241a;
}


.tao-review-page .tao-review-benefit p {
    margin: 0;

    font-family:
        Arial,
        sans-serif;

    font-size: 8.3px;

    line-height: 1.55;

    color: #51463f;
}



/* =========================================================
   RIGHT PANEL ART
========================================================= */

.tao-review-page .tao-review-benefits-art {
    width: 100%;
    height: 96px;

    position: absolute;

    right: 0;
    bottom: 0;
}


.tao-review-page .tao-review-benefits-art img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position:
        center bottom;
}



/* =========================================================
   COMMUNITY
========================================================= */

.tao-review-page .tao-review-community {
    padding-top: 9px;
}


.tao-review-page .tao-review-community-title {
    text-align: center;
}


.tao-review-page .tao-review-community-title h2 {
    margin: 0;

    font-family:
        "Cinzel",
        Georgia,
        serif;

    font-size: 14px;

    font-weight: 500;

    color: #332118;
}


.tao-review-page .tao-review-divider-small {
    margin:
        4px
        auto
        7px;
}


.tao-review-page .tao-review-divider-small span {
    width: 27px;
}



/* =========================================================
   TESTIMONIALS GRID
========================================================= */

.tao-review-page .tao-review-testimonials {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 14px;
}


.tao-review-page .tao-review-testimonial-card {
    min-height: 140px;

    display: flex;

    flex-direction: column;

    margin: 0;

    padding:
        12px
        16px
        10px;

    border:
        1px solid
        var(--tao-border);

    border-radius: 9px;

    background:
        rgba(255, 252, 247, .88);
}


.tao-review-page .tao-review-card-stars {
    margin-bottom: 7px;

    color:
        var(--tao-gold);

    font-family:
        Arial,
        sans-serif;

    font-size: 10px;

    letter-spacing: 2px;
}


.tao-review-page .tao-review-testimonial-card p {
    flex: 1;

    margin:
        0
        0
        9px;

    font-family:
        Arial,
        sans-serif;

    font-size: 8.6px;

    line-height: 1.55;

    color: #453a33;
}


.tao-review-page .tao-review-person {
    display: flex;

    align-items: center;

    gap: 8px;
}


.tao-review-page .tao-review-person img {
    width: 33px;
    height: 33px;

    display: block;

    flex: 0 0 33px;

    border-radius: 50%;

    object-fit: cover;
}


.tao-review-page .tao-review-person div {
    display: flex;

    flex-direction: column;

    gap: 1px;
}


.tao-review-page .tao-review-person strong {
    font-family:
        Arial,
        sans-serif;

    font-size: 8.5px;

    color: #362c26;
}


.tao-review-page .tao-review-person span {
    color: #83776f;

    font-family:
        Arial,
        sans-serif;

    font-size: 7.8px;
}



/* =========================================================
   VER MÁS
========================================================= */

.tao-review-page .tao-review-more {
    margin-top: 7px;

    text-align: center;
}


.tao-review-page .tao-review-more a {
    min-width: 168px;
    height: 26px;

    display: inline-flex;

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

    gap: 6px;

    padding:
        0
        13px;

    border:
        1px solid
        var(--tao-red);

    border-radius: 4px;

    background: transparent;

    color:
        var(--tao-red);

    font-family:
        "Cinzel",
        Georgia,
        serif;

    font-size: 8px;

    text-decoration: none;
}


.tao-review-page .tao-review-more a:hover {
    background:
        var(--tao-red);

    color: white;
}


.tao-review-page .tao-review-more svg {
    width: 12px;
    height: 12px;

    fill: none;

    stroke: currentColor;

    stroke-width: 1.5;
}

.tao-review-success {
    display: none;
    text-align: center;
    padding: 50px 30px;
}

.tao-review-success.show {
    display: block;
}

.tao-review-success-icon {
    font-size: 35px;
    margin-bottom: 20px;
}

.tao-review-success h3 {
    font-family: "Cinzel", serif;
    margin-bottom: 15px;
}

.tao-review-success p {
    font-family: "Georgia", serif;
    line-height: 1.7;
}

/* =========================================================
   EXPERIENCIA - RESPONSIVE
========================================================= */


/* TABLET GRANDE */
@media (max-width: 1100px) {

    .tao-review-page .tao-review-content {
        padding-left: 30px;
        padding-right: 30px;
    }

    .tao-review-page .tao-review-top-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .tao-review-page .tao-review-form-card,
    .tao-review-page .tao-review-benefits {
        width: 100%;
        max-width: 100%;
    }

}


/* TABLET */
@media (max-width: 900px) {

    .tao-review-page .tao-review-hero {
        min-height: 330px;
    }

    .tao-review-page .tao-review-hero-inner {
        width: 88%;
        max-width: 650px;
        margin: 0 auto;
        text-align: center;
    }

    .tao-review-page .tao-review-hero h1 {
        font-size: 2rem;
        line-height: 1.25;
    }

    .tao-review-page .tao-review-hero p {
        font-size: 1rem;
        line-height: 1.7;
    }

    .tao-review-page .tao-review-content {
        padding: 45px 24px 55px;
    }

    .tao-review-page .tao-review-experience-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .tao-review-page .tao-review-two-columns {
        grid-template-columns: 1fr;
    }

    .tao-review-page .tao-review-benefits {
        min-height: auto;
        padding: 35px 35px 45px;

        background-image:         linear-gradient(
            rgba(251, 234, 227, 0.82),
            rgba(251, 234, 227, 0.82)
        ),url("images/testimonios-small-hero.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center top;
    }

}


/* CELULAR GRANDE */
@media (max-width: 700px) {

    .tao-review-page .tao-review-hero {
        min-height: 300px;
    }

    .tao-review-page .tao-review-hero-inner {
        width: calc(100% - 40px);
    }

    .tao-review-page .tao-review-hero h1 {
        font-size: 1.65rem;
        line-height: 1.3;
        letter-spacing: 1px;
    }

    .tao-review-page .tao-review-hero p {
        font-size: .95rem;
        line-height: 1.65;
    }

    .tao-review-page .tao-review-content {
        padding: 35px 18px 45px;
    }

    .tao-review-page .tao-review-form-card {
        padding: 28px 22px 35px;
    }

    .tao-review-page .tao-review-card-heading {
        gap: 12px;
    }

    .tao-review-page .tao-review-card-heading h2 {
        font-size: 1.15rem;
        line-height: 1.35;
    }

    .tao-review-page input,
    .tao-review-page select,
    .tao-review-page textarea {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        font-size: 16px;
    }

    .tao-review-page textarea {
        min-height: 150px;
        resize: vertical;
    }

    .tao-review-page .tao-review-stars {
        justify-content: center;
    }

    .tao-review-page .tao-review-stars label {
        font-size: 32px;
    }

    .tao-review-page .tao-review-options {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px 18px;
    }

    .tao-review-page .tao-review-options label {
        width: 100%;
        margin: 0;
        box-sizing: border-box;
    }

    .tao-review-page .tao-review-permission {
        align-items: flex-start;
        line-height: 1.55;
    }

    .tao-review-page .tao-review-submit {
        width: 100%;
        max-width: 100%;
    }

    .tao-review-page .tao-review-benefits {
        padding: 32px 25px 40px;

        background-image: url("images/testimonios-small-hero.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center top;
    }

    .tao-review-page .tao-review-benefits-header {
        margin-bottom: 28px;
    }

    .tao-review-page .tao-review-benefit {
        margin-bottom: 25px;
    }

    .tao-review-page .tao-review-benefit:last-child {
        margin-bottom: 0;
    }

    .tao-review-page .tao-review-more {
        margin-top: 35px;
    }

}


/* CELULAR */
@media (max-width: 520px) {

    .tao-review-page .tao-review-hero {
        min-height: 270px;
    }

    .tao-review-page .tao-review-hero-inner {
        width: calc(100% - 32px);
    }

    .tao-review-page .tao-review-hero h1 {
        font-size: 1.42rem;
        line-height: 1.3;
    }

    .tao-review-page .tao-review-divider {
        margin: 14px auto 17px;
    }

    .tao-review-page .tao-review-hero p {
        font-size: .9rem;
        line-height: 1.6;
    }

    .tao-review-page .tao-review-content {
        padding: 28px 12px 38px;
    }

    .tao-review-page .tao-review-form-card {
        padding: 24px 16px 30px;
    }

    .tao-review-page .tao-review-card-heading {
        align-items: center;
    }

    .tao-review-page .tao-review-card-heading h2 {
        font-size: 1rem;
        line-height: 1.35;
        letter-spacing: .5px;
    }

    .tao-review-page .tao-review-field > label,
    .tao-review-page .tao-review-rating > label,
    .tao-review-page .tao-review-recommend legend {
        font-size: .92rem;
        line-height: 1.4;
    }

    .tao-review-page input,
    .tao-review-page select,
    .tao-review-page textarea {
        font-size: 16px;
    }

    .tao-review-page .tao-review-stars {
        width: 100%;
        justify-content: center;
    }

    .tao-review-page .tao-review-stars label {
        font-size: 34px;
    }

    .tao-review-page .tao-review-options {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .tao-review-page .tao-review-options label {
        display: flex;
        align-items: center;
        width: 100%;
    }

    .tao-review-page .tao-review-permission {
        font-size: .88rem;
    }

    .tao-review-page .tao-review-submit {
        width: 100%;
        min-height: 52px;
        padding: 13px 15px;
        font-size: .9rem;
        line-height: 1.3;
    }

    .tao-review-page .tao-review-security {
        align-items: flex-start;
        font-size: .8rem;
        line-height: 1.45;
    }

    .tao-review-page .tao-review-benefits {
        padding: 28px 18px 35px;

        background-image:         linear-gradient(
            rgba(251, 234, 227, 0.82),
            rgba(251, 234, 227, 0.82)
        ),url("images/testimonios-small-hero.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center top;
    }

    .tao-review-page .tao-review-benefits-header h2 {
        font-size: 1.1rem;
    }

    .tao-review-page .tao-review-benefit {
        gap: 14px;
    }

    .tao-review-page .tao-review-benefit h3 {
        font-size: .95rem;
    }

    .tao-review-page .tao-review-benefit p {
        font-size: .88rem;
        line-height: 1.55;
    }

    .tao-review-page .tao-review-more a {
        font-size: .85rem;
    }

    .tao-review-page .tao-review-success {
        padding: 38px 18px;
    }

    .tao-review-page .tao-review-success h3 {
        font-size: 1.05rem;
        line-height: 1.45;
    }

    .tao-review-page .tao-review-success p {
        font-size: .9rem;
        line-height: 1.65;
    }

}


/* CELULARES MUY PEQUEÑOS */
@media (max-width: 380px) {

    .tao-review-page .tao-review-hero h1 {
        font-size: 1.27rem;
    }

    .tao-review-page .tao-review-content {
        padding-left: 9px;
        padding-right: 9px;
    }

    .tao-review-page .tao-review-form-card {
        padding-left: 13px;
        padding-right: 13px;
    }

    .tao-review-page .tao-review-stars label {
        font-size: 30px;
    }

}
@media (max-width: 520px) {

    html,
    body {
        margin: 0;
        padding: 0;
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
    }

    body {
        position: relative;
    }

    .tao-review-page {
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden;
    }

    .tao-review-page .tao-review-content {
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding-left: 14px;
        padding-right: 14px;
        box-sizing: border-box;
    }

    .tao-review-page .tao-review-top-grid {
        width: 100%;
        max-width: 100%;
        margin: 0;
        grid-template-columns: minmax(0, 1fr);
    }

    .tao-review-page .tao-review-form-card,
    .tao-review-page .tao-review-benefits {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }

    .tao-review-page .tao-review-benefits {
        background-size: cover;
        background-position: center;
    }

    .tao-review-page fieldset,
    .tao-review-page input,
    .tao-review-page select,
    .tao-review-page textarea,
    .tao-review-page button {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .tao-review-page .tao-review-options,
    .tao-review-page .tao-review-experience-grid,
    .tao-review-page .tao-review-two-columns {
        min-width: 0;
        max-width: 100%;
    }

    .about-footer {
        width: 100%;
        max-width: 100%;
        margin: 0;
        box-sizing: border-box;
    }
}

/* ==========================================
   BOTÓN SUSCRÍBETE FLOTANTE - SOLO MÓVIL
========================================== */

.mobile-subscribe{
  display:none;
}

@media(max-width:768px){

  .mobile-subscribe{
    display:flex;

    position:fixed;
    right:18px;
    bottom:18px;

    z-index:9999;

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

    background:#f1e0ce;
    color:#5c3d2d;

    padding:13px 24px;

    border:1px solid rgba(120,70,40,0.20);
    border-radius:999px;

    font-family:'Cinzel', serif;
    font-size:.70rem;
    font-weight:500;
    letter-spacing:1.2px;
    text-transform:uppercase;

    white-space:nowrap;

    box-shadow:0 7px 22px rgba(60,20,10,.18);
  }

  .mobile-subscribe:active{
    transform:scale(.96);
  }

}