/* ============================================================
   Sótano 5 — Web V.2 · Home (index.html)
   Requiere common.css. Aquí solo van las secciones de la home.
   ============================================================ */

.section{padding:88px 0}
.section-light{background:var(--crema-cl)}
.section-hueso{background:var(--hueso)}

/* ===== HERO — arco degradado + hornacina + semillas ===== */
#hero{position:relative;overflow:hidden;padding:132px 0 96px;color:var(--hueso);
  background:linear-gradient(155deg,var(--oliva) 0%,var(--bosque) 74%,var(--bosque-d) 100%)}
#hero .arc-niche{position:absolute;right:-90px;top:-120px;width:520px;height:520px;
  border-radius:50%;background:radial-gradient(circle at 40% 40%,rgba(201,203,180,.20),transparent 62%);pointer-events:none}
.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.hero-inner>*{min-width:0}
#hero h1{overflow-wrap:break-word}
.hero-content .eyebrow{color:#dfe3c6;margin-bottom:18px}
#hero h1{font-family:var(--tit);font-weight:500;font-size:clamp(2.1rem,7vw,3.5rem);line-height:1.06;color:#fff;letter-spacing:-.01em;margin-bottom:16px;overflow-wrap:break-word}
#hero h1 em{font-style:italic;color:var(--arcilla)}
.hero-subtitle{font-family:var(--spartan);font-size:1.15rem;letter-spacing:.5px;color:#eef0e0;margin-bottom:18px}
.hero-desc{font-size:1.05rem;color:#e7e9db;max-width:500px;margin-bottom:30px;line-height:1.7}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:28px}
.hero-trust{display:flex;align-items:center;gap:12px;font-size:.88rem;color:#dfe3c6}
.hero-trust .stars{color:#f0c14b;font-size:1.05rem;letter-spacing:2px}
/* Marco de la foto en forma de arco/hornacina */
.hero-photo{position:relative}
.hero-photo .frame{position:relative;border-radius:230px 230px 22px 22px;overflow:hidden;
  box-shadow:0 30px 70px rgba(20,25,8,.42);border:8px solid rgba(244,241,233,.14)}
.hero-photo .frame img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.hero-photo .badge-float{position:absolute;left:-26px;bottom:34px;background:var(--hueso);color:var(--bosque);
  border-radius:16px;padding:14px 18px;box-shadow:var(--sombra);display:flex;align-items:center;gap:12px;z-index:3}
.hero-photo .badge-float strong{font-family:var(--tit);font-size:1.5rem;color:var(--oliva);line-height:1}
.hero-photo .badge-float span{font-size:.76rem;color:var(--texto);line-height:1.3}
.hero-wave{position:absolute;left:0;right:0;bottom:-1px;z-index:1;line-height:0}
.hero-wave svg{display:block;width:100%;height:52px}

/* ===== PROPUESTA DE VALOR — insignias circulares ===== */
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.value-card{text-align:center;padding:44px 28px;background:#fff;border:1px solid #ece9dd;border-radius:var(--radio);box-shadow:var(--sombra);transition:transform .3s}
.value-card:hover{transform:translateY(-5px)}
.value-card h3{font-family:var(--tit);font-weight:600;font-size:1.3rem;color:var(--bosque);margin-bottom:10px}
.value-card p{color:var(--texto);font-size:.92rem}

/* ===== SERVICIOS ===== */
.services-head{margin-bottom:48px;text-align:center}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.service-card{background:#fff;border:1px solid #ece9dd;border-radius:var(--radio);padding:38px 28px;position:relative;transition:all .3s;overflow:hidden}
.service-card:hover{transform:translateY(-5px);box-shadow:0 14px 40px rgba(45,45,10,.1);border-color:rgba(125,144,8,.3)}
.service-card.featured{background:linear-gradient(160deg,#fefdf8,#f4f1e6);border-color:var(--oliva)}
.service-badge{position:absolute;top:20px;right:20px;background:var(--oliva);color:#fff;font-family:var(--spartan);font-size:.68rem;font-weight:600;letter-spacing:1px;padding:5px 14px;border-radius:999px;text-transform:uppercase}
.service-tag{font-family:var(--spartan);font-size:.7rem;text-transform:uppercase;letter-spacing:2px;color:var(--oliva);font-weight:600;margin-bottom:6px}
.service-card h3{font-family:var(--tit);font-weight:600;font-size:1.45rem;color:var(--bosque);margin-bottom:4px}
.service-claim{font-family:var(--tit);font-style:italic;font-size:1rem;color:var(--terracota);margin-bottom:14px}
.service-card>p{font-size:.92rem;color:var(--texto);margin-bottom:18px;line-height:1.6}
.service-includes{list-style:none;margin-bottom:20px}
.service-includes li{font-size:.86rem;color:#5c5d52;padding:6px 0;display:flex;align-items:center;gap:9px}
.service-includes li i{color:var(--oliva);font-size:.7rem}
.service-price{display:inline-block;background:#eef0e0;color:var(--bosque);font-family:var(--spartan);font-weight:600;font-size:.82rem;padding:8px 16px;border-radius:999px}

/* ===== VISITA IN SITU — banda arco (PASO 6) ===== */
#visita{position:relative;padding:80px 0;color:var(--hueso)}
#visita .container{position:relative;z-index:2}
.visita-head{text-align:center;max-width:820px;margin:0 auto 40px}
.visita-pill{display:inline-block;font-family:var(--spartan);font-weight:600;font-size:.82rem;letter-spacing:3px;
  background:rgba(244,241,233,.16);color:#fff;padding:10px 24px;border-radius:999px;margin-bottom:20px}
#visita h2{font-family:var(--tit);font-weight:500;font-size:clamp(1.9rem,5.5vw,2.5rem);color:#fff;line-height:1.1;margin-bottom:14px}
#visita h2 em{font-style:italic;color:var(--arcilla)}
.visita-lead{color:#eaece0;font-size:1.05rem;max-width:640px;margin:0 auto}
.visita-lead b{color:#fff}
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:40px}
.ben{background:rgba(244,241,233,.1);border:1px solid rgba(244,241,233,.16);border-radius:16px;padding:24px 20px;text-align:center}
.ben .badge{background:rgba(244,241,233,.16);width:72px;height:72px;margin-bottom:14px}
.ben .badge svg{stroke:var(--hueso);width:38px;height:38px;stroke-width:2}
.ben .badge .seed{fill:var(--arcilla)}
.ben p{font-size:.9rem;color:#f2f2e8;line-height:1.4;font-weight:500}
.visita-ctas{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* ===== PROYECTOS destacados ===== */
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.project-card{background:#fff;border-radius:var(--radio);overflow:hidden;cursor:pointer;transition:all .3s;border:1px solid #ece9dd}
.project-card:hover{transform:translateY(-5px);box-shadow:0 14px 36px rgba(45,45,10,.12)}
.project-img{position:relative;overflow:hidden}
.project-photo{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .5s}
.project-card:hover .project-photo{transform:scale(1.05)}
.project-cat{position:absolute;top:12px;left:12px;background:rgba(67,82,26,.92);color:#fff;font-family:var(--spartan);font-size:.66rem;font-weight:600;padding:5px 12px;border-radius:999px;text-transform:uppercase;letter-spacing:1px}
.project-info{padding:22px}
.project-info h3{font-family:var(--tit);font-weight:600;font-size:1.2rem;color:var(--bosque);margin-bottom:8px}
.project-meta{font-size:.78rem;color:var(--gris);margin-bottom:10px}
.project-meta i{margin-right:3px;color:var(--oliva)}
.project-desc{font-size:.86rem;color:var(--texto);line-height:1.55;margin-bottom:14px}
.project-link{font-family:var(--spartan);font-size:.82rem;color:var(--oliva);font-weight:600;display:inline-flex;align-items:center;gap:6px;transition:gap .3s}
.project-link:hover{gap:11px}
.section-more{text-align:center;margin-top:44px}

/* ===== SOBRE MÍ ===== */
#sobre-mi{position:relative;overflow:hidden}
.about-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:60px;align-items:center}
.about-grid>*,.contact-grid>*{min-width:0}
.about-image{position:relative}
.about-image .frame{border-radius:200px 200px 20px 20px;overflow:hidden;box-shadow:var(--sombra);border:6px solid #fff}
.about-image .frame img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}
.about-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}
.stat{text-align:center;background:#fff;border:1px solid #ece9dd;padding:16px 8px;border-radius:14px}
.stat strong{display:block;font-family:var(--tit);font-size:1.6rem;color:var(--oliva)}
.stat span{font-size:.68rem;color:var(--gris);text-transform:uppercase;letter-spacing:1px}
.about-content .section-title{margin-bottom:18px}
.about-lead{font-family:var(--tit);font-style:italic;font-size:1.2rem;color:var(--oliva);margin-bottom:16px;line-height:1.5}
.about-content p{color:var(--texto);margin-bottom:14px;font-size:.95rem}
.about-philosophy{margin-top:28px;padding:26px;background:var(--hueso);border-radius:16px;border:1px solid #ece9dd}
.about-philosophy h3{font-family:var(--tit);font-weight:600;font-size:1.15rem;color:var(--bosque);margin-bottom:16px}
.philosophy-items{display:flex;flex-direction:column;gap:13px}
.phil-item{display:flex;align-items:center;gap:12px;font-size:.9rem;color:var(--texto)}
.phil-item i{color:var(--oliva);font-size:1rem;width:22px;text-align:center}

/* ===== LUJO SILENCIOSO ===== */
.lujo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:48px}
.lujo-card{background:#fff;border:1px solid #ece9dd;border-radius:16px;padding:32px 24px;text-align:center;transition:transform .3s}
.lujo-card:hover{transform:translateY(-5px)}
.lujo-card h3{font-family:var(--tit);font-weight:600;font-size:1.08rem;color:var(--bosque);margin-bottom:10px}
.lujo-card p{font-size:.84rem;color:var(--texto);line-height:1.6}
.lujo-claim{text-align:center;max-width:720px;margin:44px auto 0;font-family:var(--tit);font-style:italic;font-size:1.35rem;color:var(--bosque)}

/* ===== TESTIMONIOS ===== */
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px;margin-bottom:32px}
.testimonial-card{background:#fff;border:1px solid #ece9dd;padding:32px;border-radius:16px;box-shadow:var(--sombra)}
.testimonial-stars{color:#f0c14b;font-size:1.05rem;margin-bottom:14px;letter-spacing:2px}
.testimonial-card>p{font-family:var(--tit);font-style:italic;font-size:1.02rem;color:#4c4d42;line-height:1.6;margin-bottom:20px}
.testimonial-author{display:flex;align-items:center;gap:12px}
.author-avatar{font-size:2.1rem;color:#d4cfbf}
.testimonial-author strong{display:block;font-size:.9rem;color:var(--bosque)}
.testimonial-author span{font-size:.75rem;color:var(--gris)}
.google-review-link{text-align:center}

/* ===== BLOG destacados ===== */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.blog-card{background:#fff;border:1px solid #ece9dd;border-radius:var(--radio);overflow:hidden;cursor:pointer;transition:all .3s}
.blog-card:hover{transform:translateY(-5px);box-shadow:0 14px 36px rgba(45,45,10,.12)}
.blog-photo{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.blog-content{padding:24px}
.blog-date{font-family:var(--spartan);font-size:.72rem;color:var(--oliva);font-weight:600;text-transform:uppercase;letter-spacing:1px}
.blog-content h3{font-family:var(--tit);font-weight:600;font-size:1.15rem;color:var(--bosque);margin:8px 0 10px;line-height:1.25}
.blog-content p{font-size:.88rem;color:var(--texto);margin-bottom:14px}
.blog-link{font-family:var(--spartan);font-size:.82rem;color:var(--oliva);font-weight:600;display:inline-flex;align-items:center;gap:6px;transition:gap .3s}
.blog-link:hover{gap:11px}

/* ===== CONTACTO ===== */
#contacto .section-title{margin-bottom:0}
.contact-cal{display:flex;flex-direction:column;align-items:center;gap:8px;margin:28px 0 34px}
.contact-cal-or{font-size:.82rem;color:var(--gris)}
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:44px}
.contact-form{background:#fff;padding:38px;border-radius:var(--radio);box-shadow:var(--sombra);border:1px solid #ece9dd}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-group{margin-bottom:18px}
.form-group label{display:block;font-size:.82rem;font-weight:600;color:#5a5648;margin-bottom:6px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 16px;border:1px solid #ddd8c8;border-radius:10px;font-size:.9rem;font-family:var(--body);background:#fafaf5;transition:border-color .3s}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--oliva);box-shadow:0 0 0 3px rgba(125,144,8,.1)}
.form-rgpd{background:var(--hueso);border-radius:10px;padding:14px 16px;font-size:.72rem;color:#8a897c;line-height:1.6;margin-bottom:16px}
.form-rgpd strong{color:#6a6a5c}.form-rgpd a{color:var(--oliva);text-decoration:underline}
.form-check{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px;font-size:.8rem;color:var(--texto);line-height:1.5;cursor:pointer}
.form-check input{margin-top:3px;accent-color:var(--oliva);width:16px;height:16px;flex-shrink:0}
.form-check a{color:var(--oliva);font-weight:500;text-decoration:underline}
.form-legal{text-align:center;font-size:.75rem;color:var(--gris);margin-top:14px}
.form-legal i{margin-right:4px}
.contact-info-side{display:flex;flex-direction:column;gap:16px}
.info-card{background:#fff;border:1px solid #ece9dd;padding:22px;border-radius:14px;display:flex;align-items:flex-start;gap:15px}
.info-card>i{font-size:1.15rem;color:var(--oliva);margin-top:3px}
.info-card h3{font-family:var(--tit);font-size:1rem;color:var(--bosque);margin-bottom:3px}
.info-card p{font-size:.85rem;color:var(--texto)}
.info-card a{color:var(--oliva);font-weight:500}
.contact-info-side iframe{border:0;border-radius:14px;display:block}

/* ===== FAQ ===== */
.faq-list{display:flex;flex-direction:column;gap:12px;margin-top:40px}
.faq-item{background:#fff;border:1px solid #ece9dd;border-radius:14px;overflow:hidden}
.faq-question{width:100%;padding:20px 24px;background:none;border:none;font-family:var(--body);font-size:.98rem;font-weight:600;color:var(--bosque);cursor:pointer;display:flex;justify-content:space-between;align-items:center;text-align:left;transition:background .3s;gap:16px}
.faq-question:hover{background:rgba(125,144,8,.05)}
.faq-question i{color:var(--oliva);transition:transform .3s;font-size:.8rem;flex-shrink:0}
.faq-item.open .faq-question i{transform:rotate(180deg)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq-item.open .faq-answer{max-height:260px}
.faq-answer p{padding:0 24px 20px;font-size:.9rem;color:var(--texto);line-height:1.7}

/* ===== RESPONSIVE ===== */
@media(max-width:960px){
  .hero-inner{grid-template-columns:1fr;gap:40px}
  .about-grid{grid-template-columns:1fr;gap:40px}
  .contact-grid{grid-template-columns:1fr}
  .lujo-grid{grid-template-columns:repeat(2,1fr)}
  .benefits{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  #hero{padding:110px 0 70px}
  #hero h1{font-size:2.4rem}
  .value-grid,.services-grid,.projects-grid,.testimonials-grid,.blog-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .lujo-grid{grid-template-columns:1fr}
  .benefits{grid-template-columns:1fr}
}