/* BienVivir — estilos exclusivos de la landing (front-page.php).
   Aprobado sobre el preview de design-src/preview/landing.html — ver docs/DESIGN_BRIEF.md §5. */

.lead{font-size:clamp(1rem,1.3vw,1.12rem);color:var(--ink);}
.stack>*+*{margin-top:1rem;}
.disclaimer{font-weight:500;}
.disclaimer b{color:var(--agua-texto);}
.center{text-align:center;}
.center p{margin-left:auto;margin-right:auto;}

/* ── Bandas ── */
.band-arena{background:var(--arena);}
.band-g100{background:var(--g100);}
.band-g200{background:var(--g200);}
.band-salvia{background:var(--salvia);}

/* ── Hero ── */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;color:#fff;overflow:hidden;}
.hero .bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;object-position:60% 48%;}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,26,21,.72) 0%,rgba(28,26,21,.45) 45%,rgba(28,26,21,.15) 100%);}
.hero .container{position:relative;}
.hero .overline{color:var(--salvia);}
.hero h1{font-family:var(--fs-serif);font-style:italic;font-weight:400;font-size:clamp(3.2rem,11vw,7rem);line-height:1;margin:.6rem 0 .4rem;color:#fff;}
.hero .tagline{font-family:var(--fs-slab);font-size:clamp(1.1rem,2.4vw,1.6rem);color:#eef1ec;}
.hero .sub{max-width:34rem;margin:1.4rem 0 2rem;color:#e7e6df;font-weight:300;font-size:clamp(1rem,1.4vw,1.12rem);}
.hero .cta{display:flex;flex-wrap:wrap;gap:.9rem;}

/* ── Split (texto + foto) ── */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.split .media{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5;position:relative;}
.split .media img{width:100%;height:100%;object-fit:cover;}
.split .media.circle{aspect-ratio:1;border-radius:50%;max-width:400px;margin-inline:auto;box-shadow:0 12px 40px rgba(20,20,20,.12);}

/* ── Quote ── */
.quote{border-left:3px solid var(--agua);padding-left:1.4rem;margin-top:2.5rem;}
.quote p{font-family:var(--fs-serif);font-style:italic;font-size:clamp(1.4rem,3vw,2rem);line-height:1.3;color:var(--ink);max-width:28ch;}

/* ── ¿Para quién? cards ── */
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:2.5rem;}
.qcard{position:relative;background:var(--charcoal);color:#eceae4;border-radius:var(--r-lg);padding:1.6rem 1.5rem 1.8rem;overflow:hidden;transition:transform .18s;}
.qcard:hover{transform:translateY(-3px);}
.qcard .num{position:absolute;top:.6rem;right:1.1rem;font-family:var(--fs-serif);font-size:3.4rem;color:rgba(255,255,255,.09);}
.qcard .ic{width:44px;height:44px;border-radius:50%;background:#fdfcf8;color:var(--agua);
  display:grid;place-items:center;margin-bottom:2.4rem;}
.qcard .ic svg{height:18px;width:auto;display:block;overflow:visible;}
/* Compensación de peso óptico: reloj y lupa comparten lienzo 16x16 pero la
   lupa deja lugar para el mango y "pesa" menos; personas es más ancho y
   pesa más. Ajuste manual por posición, no por proporción del viewBox. */
.qcard:nth-child(1) .ic svg{height:20px;}
.qcard:nth-child(2) .ic svg{height:19px;}
.qcard:nth-child(3) .ic svg{height:15px;}
.qcard h3{font-family:var(--fs-serif);font-size:1.25rem;margin-bottom:.6rem;color:#fff;}
.qcard p{font-size:.9rem;color:#c9c7c0;font-weight:300;}

/* ── Dimensiones 2x2 ── */
.dims{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:2.5rem;}
.dim{background:var(--surface);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .18s;}
.dim:hover{transform:translateY(-3px);}
.dim .ph{aspect-ratio:16/9;position:relative;overflow:hidden;background:var(--piedra);}
.dim .ph img{width:100%;height:100%;object-fit:cover;}
.dim .body{padding:1.4rem 1.5rem 1.6rem;}
.dim .ic{width:34px;height:34px;margin-bottom:.7rem;color:var(--agua);display:flex;align-items:center;}
.dim .ic svg{height:20px;width:auto;display:block;overflow:visible;}
.dim h3{font-family:var(--fs-serif);font-size:1.3rem;margin-bottom:.5rem;}
.dim p{font-size:.92rem;color:var(--muted);}

/* ── Novedades ── */
.novedades-carrusel{display:flex;gap:1.1rem;margin-top:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-padding-inline:var(--pad-x);padding:1.4rem var(--pad-x) 1.8rem;margin-inline:calc(-1 * var(--pad-x));
  -webkit-overflow-scrolling:touch;}
.novedades-carrusel::-webkit-scrollbar{height:6px;}
.novedades-carrusel::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--r-pill);}
.nov-card{position:relative;flex:0 0 calc(25% - .9rem);aspect-ratio:1;scroll-snap-align:start;
  background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:1.4rem 1.4rem 1.6rem;
  display:flex;flex-direction:column;transition:transform .18s;}
.nov-card:hover{transform:translateY(-3px);}
.nov-card.is-destacada{background:var(--salvia);}
.nov-card .star{position:absolute;top:.9rem;right:1rem;color:var(--agua);font-size:1rem;}
.nov-card h3{font-family:var(--fs-serif);font-size:1.1rem;line-height:1.2;color:var(--azul-d);margin-right:1.6rem;margin-bottom:.5rem;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;overflow:hidden;}
.nov-card p{font-size:.86rem;color:var(--muted);flex:1;
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;line-clamp:4;overflow:hidden;}
.nov-card .nov-links{display:flex;flex-direction:column;gap:.3rem;margin-top:.9rem;}
.nov-card .nov-links a{font-size:.8rem;font-weight:600;color:var(--agua-texto);text-decoration:none;}
.nov-card .nov-links a:hover{text-decoration:underline;}

/* ── Red interdisciplinaria ── */
.enfoques{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:clamp(1.6rem,4vw,2.6rem);margin-top:2.5rem;text-align:left;}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;}
.chip{font-size:.76rem;font-weight:500;padding:.3rem .75rem;border-radius:var(--r-pill);border:1px solid transparent;
  display:inline-block;transition:transform .18s;cursor:default;}
.chip:hover{transform:translateY(-3px);}
.c-mente{background:var(--cat-mente-tint);color:var(--cat-mente-ink);}
.c-cuerpo{background:var(--cat-cuerpo-tint);color:var(--cat-cuerpo-ink);}
.c-trad{background:var(--cat-trad-tint);color:var(--cat-trad-ink);}
.c-nat{background:var(--cat-nat-tint);color:var(--cat-nat-ink);}
.enfoques .cta{margin-top:2rem;text-align:center;}

/* ── Cosmovisión ── */
.cosmo{position:relative;color:#efeee7;text-align:center;overflow:hidden;}
.cosmo .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:.22;}
.cosmo .overlay{position:absolute;inset:0;background:#3f3f38;mix-blend-mode:multiply;}
.cosmo .container{position:relative;}
.cosmo .overline{color:var(--salvia);}
.cosmo h2{color:#fff;margin:.5rem 0 1.3rem;}
.cosmo p{color:#dedcd2;font-weight:300;}
.cosmo .rule{width:min(320px,60%);height:1px;background:rgba(255,255,255,.25);margin:2.2rem auto;}
.cosmo blockquote{font-family:var(--fs-serif);font-style:italic;font-size:clamp(1.4rem,3vw,2rem);line-height:1.3;color:#fff;}

/* ── Bio de Virginia ── */
.bio{display:grid;grid-template-columns:320px 1fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
.bio .photo{width:280px;height:280px;border-radius:50%;background:var(--g200) center/cover no-repeat;justify-self:center;
  display:grid;place-items:center;color:var(--muted);font-size:.75rem;text-align:center;border:1px solid rgba(0,0,0,.06);overflow:hidden;}
.bio .photo img{width:100%;height:100%;object-fit:cover;}
.bio .overline{color:var(--agua-texto);}
.bio h2{margin:.4rem 0 .3rem;}
.bio .role{font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--agua-texto);}
.bio .txt{margin-top:1.1rem;color:#3f3d34;}
.bio .placeholder{color:#6d6a5c;font-style:italic;}
.bio .sig{font-family:var(--fs-serif);font-style:italic;margin-top:1.2rem;color:#3f3d34;line-height:1.35;}

/* ── Instagram ── */
.ig-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:2.2rem auto 1.6rem;max-width:820px;}
.ig-tile{position:relative;aspect-ratio:1;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow);
  display:grid;place-items:center;text-decoration:none;transition:transform .18s;}
.ig-tile:hover{transform:translateY(-3px);}
.ig-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ig-tile .cap{position:relative;z-index:1;font-size:.66rem;font-weight:600;letter-spacing:.08em;
  color:#fff;background:rgba(30,28,22,.32);padding:.28rem .6rem;border-radius:var(--r-pill);}
.ig-tile .cam{position:absolute;top:.6rem;right:.6rem;width:18px;height:18px;border:2px solid rgba(255,255,255,.85);
  border-radius:5px;z-index:1;}
.ig-tile .cam::after{content:"";position:absolute;inset:3px;border:2px solid rgba(255,255,255,.85);border-radius:50%;}
.ig-note{font-size:.72rem;color:var(--muted);font-style:italic;}

/* ── Contacto ── */
.contact{position:relative;color:#efeee7;overflow:hidden;}
.contact .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.7;}
.contact .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,39,34,.55),rgba(40,39,34,.68));}
.contact .container{position:relative;}
.contact .overline{color:var(--salvia);}
.contact h2{color:#fff;margin:.5rem 0 1rem;}
.contact p{color:#dedcd2;font-weight:300;}
.contact .cta{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.8rem 0 1.4rem;}
.contact .links{display:flex;flex-direction:column;gap:.5rem;font-size:.92rem;}
.contact .links .row{color:#eef1ec;display:inline-flex;gap:.5rem;align-items:center;}
.contact .links .row svg{width:15px;height:15px;flex-shrink:0;}
.contact .links a{color:inherit;text-decoration:none;}
.contact .links a:hover{color:#fff;text-decoration:underline;}

/* ── Responsive ── */
@media (max-width:1000px){
  .nov-card{flex-basis:calc(33.333% - .8rem);}
}
@media (max-width:768px){
  .split{grid-template-columns:1fr;}
  .split .media{aspect-ratio:16/10;}
  .split .media.circle{aspect-ratio:1;max-width:320px;}
  .cards3{grid-template-columns:1fr;}
  .dims{grid-template-columns:1fr;}
  .bio{grid-template-columns:1fr;}
  .bio .photo{width:220px;height:220px;}
  .ig-grid{grid-template-columns:1fr 1fr;}
  .hero .overlay{background:linear-gradient(180deg,rgba(28,26,21,.35),rgba(28,26,21,.75));}
  .nov-card{flex-basis:82%;aspect-ratio:16/9;padding:1.1rem 1.2rem 1.3rem;}
  .nov-card h3{-webkit-line-clamp:1;line-clamp:1;}
  .nov-card p{-webkit-line-clamp:2;line-clamp:2;}
  .nov-card .nov-links{margin-top:.5rem;}
}