/* ============================================================
   LAPAROSCOPIA · página dedicada (lp2-*)  — mismo nivel que el Home
   Depende de site.css (variables, header, footer, botones, flotantes)
   ============================================================ */

.lp2-wrap{max-width:1240px;margin:0 auto;padding:0 clamp(1.4rem,5vw,3rem)}

/* ---------- 01 · HERO ---------- */
.lp2-hero{position:relative;min-height:100svh;background:#050505;overflow:hidden;display:flex;align-items:center}
.lp2-hero-media{position:absolute;inset:0 0 0 34%;background-size:cover;background-position:center 30%;filter:saturate(.85) contrast(1.06)}
.lp2-hero-media::after{content:'';position:absolute;inset:0;background:
  linear-gradient(90deg,#050505 0%,rgba(5,5,5,.88) 15%,rgba(5,5,5,.3) 46%,rgba(5,5,5,.1) 70%,rgba(5,5,5,.5) 100%),
  linear-gradient(180deg,rgba(5,5,5,.3),rgba(5,5,5,0) 30%,rgba(5,5,5,.72) 100%)}
.lp2-hero-inner{position:relative;z-index:3;width:100%;max-width:1320px;margin:0 auto;padding:0 clamp(1.4rem,5vw,4rem)}
.lp2-hero-copy{max-width:min(52%,600px)}
.lp2-hero-copy .eyebrow{color:var(--steel-lt);margin-bottom:1.1rem}
.lp2-hero-copy h1{font-family:var(--sans);font-weight:800;letter-spacing:-.035em;line-height:.98;font-size:clamp(2.4rem,4.5vw,4.5rem);color:#fff;margin:0 0 1.2rem;text-shadow:0 18px 48px rgba(0,0,0,.5)}
.lp2-hero-copy p{font-size:clamp(15px,1.3vw,18px);line-height:1.7;color:rgba(255,255,255,.82);max-width:520px;margin:0 0 1.8rem}
.lp2-watermark{position:absolute;left:0;right:0;bottom:1.5%;text-align:center;white-space:nowrap;pointer-events:none;z-index:1;font-family:var(--sans);font-weight:800;letter-spacing:.015em;line-height:.8;font-size:min(10.6vw,11.5rem);color:rgba(255,255,255,.05)}
.lp2-hero .lp2-hero-scroll{top:auto;bottom:1.8rem}

/* ---------- 02 · ¿QUÉ ES? (blanco) ---------- */
.lp2-what{background:#fff;padding:clamp(3.8rem,7vw,7rem) 0}
.lp2-what-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,4.5vw,4.5rem);align-items:center}
.lp2-what-media{margin:0;border-radius:20px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 30px 70px rgba(7,17,29,.14)}
.lp2-what-media img{width:100%;height:100%;object-fit:cover;object-position:center 55%;display:block}
.lp2-what-copy .eyebrow{color:var(--blue-dark);margin-bottom:1rem}
.lp2-what-copy h2{font-family:var(--sans);font-weight:800;letter-spacing:-.035em;line-height:1.02;font-size:clamp(1.9rem,3.4vw,3.1rem);color:#07111D;margin:0 0 1.1rem}
.lp2-what-copy>p{font-size:clamp(14.5px,1.15vw,16px);line-height:1.75;color:#3C4856;max-width:560px;margin:0 0 1.9rem}
.lp2-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.lp2-fact{border-top:2px solid rgba(44,120,150,.3);padding-top:.9rem}
.lp2-fact .k{display:block;font-family:var(--sans);font-weight:800;font-size:clamp(15px,1.4vw,19px);color:var(--blue-dark);letter-spacing:-.01em;margin-bottom:.3rem}
.lp2-fact .v{display:block;font-size:12.5px;line-height:1.45;color:#5B6875}

/* ---------- 03 · COMPARATIVA (BLACK real) ---------- */
.lp2-vs{background:#050505;color:#fff;padding:clamp(3.8rem,7vw,7rem) 0}
.lp2-vs-head{margin-bottom:clamp(2rem,4vw,3.2rem);max-width:840px}
.lp2-vs-head .eyebrow{color:var(--surgical);margin-bottom:1rem}
.lp2-vs-head h2{font-family:var(--sans);font-weight:800;letter-spacing:-.035em;line-height:1.02;font-size:clamp(2rem,4vw,3.5rem);color:#fff;margin:0}
.lp2-vs-head h2 .vs{color:var(--surgical)}
.lp2-vs-table{border-top:1px solid rgba(255,255,255,.12)}
.lp2-vs-legend,.lp2-vs-row{display:grid;grid-template-columns:minmax(150px,1.15fr) minmax(0,1fr) 54px minmax(0,1fr);gap:clamp(1rem,2.4vw,2.2rem);align-items:center}
.lp2-vs-legend{padding:1rem 0 .1rem}
.lp2-vs-legend span{font-family:var(--sans);font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.lp2-vs-legend .c2{color:rgba(255,255,255,.5)}
.lp2-vs-legend .c4{color:var(--surgical)}
.lp2-vs-row{padding:clamp(1.1rem,2vw,1.55rem) 0;border-top:1px solid rgba(255,255,255,.1)}
.lp2-vs-row .cat{font-family:var(--sans);font-weight:700;font-size:clamp(13px,1.2vw,15.5px);color:#fff;letter-spacing:-.01em}
.lp2-vs-row .open{font-size:clamp(13px,1.15vw,15px);color:rgba(255,255,255,.55)}
.lp2-vs-row .arrow{display:flex;justify-content:center;color:var(--surgical);font-size:20px}
.lp2-vs-row .lap{font-size:clamp(13.5px,1.2vw,16px);font-weight:600;color:#EAF1FB}
.lp2-vs-row .lap .sub{display:block;font-weight:400;font-size:12px;color:rgba(234,241,251,.6);margin-top:2px}

/* ---------- 04 · PROCEDIMIENTOS (off-white · mosaico foto) ---------- */
.lp2-procs{background:#F2F5F4;padding:clamp(3.8rem,7vw,7rem) 0}
.lp2-procs-head{max-width:760px;margin:0 0 clamp(1.8rem,3.4vw,2.8rem)}
.lp2-procs-head .eyebrow{color:var(--blue-dark);margin-bottom:1rem}
.lp2-procs-head h2{font-family:var(--sans);font-weight:800;letter-spacing:-.035em;line-height:1.04;font-size:clamp(1.9rem,3.6vw,3.3rem);color:#07111D;margin:0}
.lp2-proc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lp2-proc{position:relative;min-height:300px;border-radius:14px;overflow:hidden;background-size:cover;background-position:center;display:flex;align-items:flex-end;text-decoration:none;box-shadow:0 18px 44px rgba(7,17,29,.12);transition:box-shadow .3s ease,transform .3s ease}
.lp2-proc::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,7,10,.06) 0%,rgba(5,7,10,.28) 46%,rgba(5,7,10,.8) 100%);transition:background .35s ease}
.lp2-proc:hover{transform:translateY(-4px);box-shadow:0 26px 62px rgba(7,17,29,.22)}
.lp2-proc:hover::before{background:linear-gradient(180deg,rgba(5,7,10,.34) 0%,rgba(5,7,10,.5) 48%,rgba(5,7,10,.9) 100%)}
.lp2-proc-ar{position:absolute;top:clamp(1.2rem,1.8vw,1.6rem);right:clamp(1.2rem,1.8vw,1.6rem);z-index:2;font-size:22px;color:#fff;transition:transform .3s ease}
.lp2-proc:hover .lp2-proc-ar{transform:translate(4px,-4px)}
.lp2-proc-in{position:relative;z-index:1;width:100%;padding:clamp(1.3rem,2vw,1.8rem)}
.lp2-proc-in h3{font-family:var(--sans);font-weight:800;font-size:clamp(1.15rem,1.7vw,1.6rem);line-height:1.1;letter-spacing:-.02em;color:#fff;margin:0;text-shadow:0 2px 16px rgba(0,0,0,.45)}
.lp2-proc-in h3 span{display:block;font-weight:600;font-size:.62em;color:rgba(255,255,255,.82);margin-top:3px;letter-spacing:0}
.lp2-proc-d{margin:0;max-height:0;opacity:0;overflow:hidden;color:rgba(255,255,255,.9);font-size:13px;line-height:1.5;text-shadow:0 2px 12px rgba(0,0,0,.5);transition:max-height .38s ease,opacity .32s ease,margin-top .38s ease}
.lp2-proc:hover .lp2-proc-d{max-height:90px;opacity:1;margin-top:.55rem}

/* ---------- 05 · TECNOLOGÍA (cinemático) ---------- */
.lp2-tech{position:relative;min-height:72vh;display:flex;align-items:center;overflow:hidden;background:#050505}
.lp2-tech-bg{position:absolute;inset:0;background-size:cover;background-position:center 42%;filter:saturate(.8) contrast(1.08)}
.lp2-tech-bg::after{content:'';position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(5,5,5,.5),rgba(5,5,5,.5)),
  linear-gradient(90deg,rgba(5,5,5,.62),rgba(5,5,5,.24) 58%,rgba(5,5,5,.5))}
.lp2-tech-copy{position:relative;z-index:2;max-width:1000px;margin:0 auto;padding:clamp(4rem,8vw,7rem) clamp(1.4rem,5vw,3rem);text-align:center}
.lp2-tech-copy .eyebrow{justify-content:center;color:var(--surgical);margin-bottom:1.2rem}
.lp2-tech-copy h2{font-family:var(--sans);font-weight:800;line-height:1.04;font-size:clamp(1.95rem,4.2vw,3.7rem);color:#fff;margin:0 0 1.1rem;letter-spacing:-.035em;text-shadow:0 18px 50px rgba(0,0,0,.45)}
.lp2-tech-copy p{font-size:clamp(14.5px,1.2vw,16.5px);line-height:1.7;color:rgba(255,255,255,.78);max-width:620px;margin:0 auto}

/* ---------- 06 · VALORACIÓN (cápsula) ---------- */
.lp2-cta{background:#fff;padding:clamp(3.8rem,7vw,7rem) clamp(1.4rem,5vw,3rem)}
.lp2-cta-cap{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);border-radius:24px;overflow:hidden;background:linear-gradient(135deg,#07111D,#050505 62%,#0B2035);box-shadow:0 34px 84px rgba(7,17,29,.22);min-height:420px}
.lp2-cta-photo{margin:0;position:relative;min-height:100%}
.lp2-cta-photo img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block}
.lp2-cta-copy{padding:clamp(2.4rem,4vw,4rem);display:flex;flex-direction:column;justify-content:center}
.lp2-cta-copy .eyebrow{color:var(--steel-lt);margin-bottom:1rem}
.lp2-cta-copy h2{font-family:var(--sans);font-weight:800;letter-spacing:-.035em;line-height:1.02;font-size:clamp(1.9rem,3.4vw,3.1rem);color:#fff;margin:0 0 1rem}
.lp2-cta-copy p{font-size:clamp(14.5px,1.2vw,16px);line-height:1.7;color:rgba(255,255,255,.74);max-width:440px;margin:0 0 1.7rem}
.lp2-cta-copy .btn-primary{align-self:flex-start}

/* ---------- 07 · FAQ (dark) ---------- */
.lp2-faq{background:#050505;padding:clamp(3.8rem,7vw,6.5rem) 0}
.lp2-faq-head{max-width:760px;margin:0 0 clamp(1.8rem,3.4vw,2.6rem)}
.lp2-faq-head .eyebrow{color:var(--surgical);margin-bottom:1rem}
.lp2-faq-head h2{font-family:var(--sans);font-weight:800;letter-spacing:-.035em;line-height:1.02;font-size:clamp(1.9rem,3.6vw,3.2rem);color:#fff;margin:0}
.lp2-acc{max-width:860px;display:flex;flex-direction:column;gap:12px}
.lp2-acc-item{border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.03);overflow:hidden;transition:border-color .25s ease,background .25s ease}
.lp2-acc-item.open{border-color:rgba(47,104,216,.4);background:rgba(47,104,216,.07)}
.lp2-acc-q{width:100%;text-align:left;background:none;border:0;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.15rem 1.35rem;font-family:var(--sans);font-weight:700;font-size:clamp(14.5px,1.2vw,16.5px);color:#fff;transition:color .2s}
.lp2-acc-q .ic{flex:none;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.08);color:var(--surgical);font-size:18px;transition:transform .3s ease,background .25s ease}
.lp2-acc-item.open .lp2-acc-q .ic{transform:rotate(45deg);background:rgba(47,104,216,.22)}
.lp2-acc-a{max-height:0;overflow:hidden;transition:max-height .32s ease,opacity .3s;opacity:0}
.lp2-acc-item.open .lp2-acc-a{opacity:1}
.lp2-acc-a p{font-size:14.5px;line-height:1.7;color:rgba(255,255,255,.66);margin:0;padding:.1rem 1.35rem 1.35rem}
.lp2-faq-cta{margin-top:1.6rem;max-width:860px;display:flex;align-items:center;gap:.9rem;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:1rem 1.25rem;text-decoration:none;transition:background .25s ease,border-color .25s ease}
.lp2-faq-cta:hover{background:rgba(47,104,216,.1);border-color:rgba(47,104,216,.34)}
.lp2-faq-cta .faq-cta-ic{font-size:24px;color:#25D366;flex:none}
.lp2-faq-cta .faq-cta-tx{font-size:14px;color:rgba(255,255,255,.72);line-height:1.4}
.lp2-faq-cta .faq-cta-tx strong{color:#fff;font-weight:700}
.lp2-faq-cta .faq-cta-ar{margin-left:auto;font-size:18px;color:var(--surgical);flex:none;transition:transform .25s ease}
.lp2-faq-cta:hover .faq-cta-ar{transform:translateX(4px)}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1024px){
  .lp2-hero-copy{max-width:min(60%,560px)}
  .lp2-cta-cap{grid-template-columns:1fr}
  .lp2-cta-photo{min-height:0;aspect-ratio:16/10}
}
@media(max-width:860px){
  .lp2-hero-media{inset:0;background-position:center 26%}
  .lp2-hero-media::after{background:
    linear-gradient(180deg,rgba(5,5,5,.32),rgba(5,5,5,.18) 32%,rgba(5,5,5,.9) 92%),
    linear-gradient(90deg,rgba(5,5,5,.6),rgba(5,5,5,.28))}
  .lp2-hero-copy{max-width:660px}
  .lp2-what-grid{grid-template-columns:1fr;gap:2rem}
  .lp2-what-media{aspect-ratio:16/10}
}
@media(max-width:760px){
  .lp2-proc-grid{grid-template-columns:1fr}
  .lp2-proc{min-height:224px}
  /* Comparativa apilada: categoria + abierta + laparoscopia */
  .lp2-vs-legend{display:none}
  .lp2-vs-row{grid-template-columns:1fr;gap:.35rem;padding:1.15rem 0}
  .lp2-vs-row .cat{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--surgical);margin-bottom:.2rem}
  .lp2-vs-row .arrow{display:none}
  .lp2-vs-row .open::before{content:'Abierta · ';color:rgba(255,255,255,.4);font-weight:700;font-size:11px}
  .lp2-vs-row .lap::before{content:'Laparoscopia · ';color:var(--surgical);font-weight:700;font-size:11px}
}
@media(max-width:600px){
  .lp2-hero{min-height:92svh}
  .lp2-hero-copy{max-width:100%}
  .lp2-hero-copy h1{font-size:clamp(2.1rem,8.6vw,3rem)}
  .lp2-hero .hero-btns{flex-direction:column;align-items:stretch}
  .lp2-hero .hero-btns .btn{justify-content:center}
  .lp2-facts{grid-template-columns:1fr;gap:.9rem}
  .lp2-fact{border-top:0;border-left:2px solid rgba(44,120,150,.32);padding:.15rem 0 .15rem .8rem}
  .lp2-fact .k{margin-bottom:1px}
  .lp2-tech{min-height:auto}
}

/* Táctil (sin hover): mostrar descripción y degradado legible siempre */
@media(hover:none){
  .lp2-proc::before{background:linear-gradient(180deg,rgba(5,7,10,.2) 0%,rgba(5,7,10,.42) 46%,rgba(5,7,10,.9) 100%)}
  .lp2-proc-d{max-height:90px;opacity:1;margin-top:.55rem}
}