/*
 * Landings SEO de pacientes (2026-11-03): /primera-consulta-gratis y
 * /psicologo-en-ingles. Prefijo .lp-, todo cuelga de .lp. Misma marca que
 * /sobre-viving: marino #1A3151, terracota #B75A44 (acción), crema; melocotón,
 * cielo, salvia, arena y lila solo en fondos. Bricolage + giro en Instrument
 * Serif Italic. Plano (guía de diseño): sin blur, sin sombras difusas, sin
 * degradados. Sin JS: las entradas del hero son CSS y se apagan con
 * reduced-motion.
 */
.lp{
  --n:#1A3151;--n2:#24406A;--cta:#B75A44;--cta-h:#9B4532;--acc:#C96A54;
  --cream:#F8F2E8;--melo:#F2CDB9;--cielo:#C9D9EA;--salvia:#B5C9AE;--arena:#EBDDBE;--lila:#DCD3EA;
  --line:#E3DDD4;--t2:#455976;--t3:#5B6F8B;
  --disp:var(--vh-disp,"Bricolage Grotesque",Arial,sans-serif);
  --serif:var(--vh-serif,"Instrument Serif","Times New Roman",serif);
  --ease:cubic-bezier(.2,.7,.2,1);
  color:var(--n)!important;background:var(--cream);overflow-x:clip;font-size:1rem;line-height:1.6;letter-spacing:-.01em
}
.lp *,.lp *::before,.lp *::after{box-sizing:border-box}
.lp-wrap{max-width:1200px;margin:0 auto;padding:0 clamp(16px,4vw,32px);position:relative}
.lp h1,.lp h2,.lp h3{font-family:var(--disp)!important;color:inherit!important;margin:0;text-wrap:balance}
.lp em,.lp-it{font-family:var(--serif)!important;font-style:italic;font-weight:400;letter-spacing:-.01em;padding-right:.05em}
.lp p{margin:0}
.lp ul,.lp ol{margin:0;padding:0;list-style:none}
.lp a{text-decoration:none}
.lp-ico{width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lp-ico--xl{width:56px;height:56px;stroke-width:1.2}
.lp-arr{width:1.1em;height:1.1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease);flex:none}

/* ── Botones y enlaces ───────────────────────────────────────────────── */
.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;font-family:Inter,system-ui,sans-serif;font-weight:600;font-size:1.0625rem;line-height:1;padding:1.05rem 1.6rem;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:background-color .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease);white-space:nowrap}
.lp-btn--lg{padding:1.2rem 1.9rem;font-size:1.125rem}
.lp-btn--sm{padding:.8rem 1.2rem;font-size:.95rem}
.lp-btn--pri{background:var(--cta);color:#fff!important}
.lp-btn--pri:hover{background:var(--cta-h)}
.lp-btn--ghost{background:transparent;color:var(--n)!important;border-color:var(--n)}
.lp-btn--ghost:hover{background:var(--n);color:#fff!important}
.lp-btn--claro{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.6)}
.lp-btn--claro:hover{background:#fff;color:var(--n)!important;border-color:#fff}
.lp-btn:hover .lp-arr,.lp-link:hover .lp-arr{transform:translateX(4px)}
.lp-btn:active{transform:translateY(1px) scale(.99)}
.lp-link{display:inline-flex;align-items:center;gap:.4rem;color:var(--n)!important;font-weight:600;text-decoration:underline!important;text-underline-offset:5px;text-decoration-thickness:1.5px!important;text-decoration-color:var(--acc)!important}
.lp-link--claro{color:#fff!important;text-decoration-color:var(--melo)!important}
.lp-ctas{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;align-items:center;margin-top:2rem}
.lp-ctas--c{justify-content:center}

/* ── Tipografía de sección ───────────────────────────────────────────── */
.lp-sec{padding:clamp(56px,7vw,104px) 0;position:relative}
.lp-sec--blanca{background:#fff}
.lp-sec--navy{background:var(--n);color:#fff!important}
.lp-kick{display:flex;align-items:center;gap:.55rem;font-family:var(--disp);font-weight:600;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cta)!important;margin-bottom:1rem!important}
.lp-kick::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.lp-kick--c{justify-content:center}
.lp-kick--claro{color:var(--melo)!important}
.lp-h2{font-size:clamp(1.9rem,1.1rem + 2.4vw,3.1rem);font-weight:750;line-height:1.05;letter-spacing:-.03em;max-width:920px}
.lp-h2--c{text-align:center;margin:0 auto!important}
.lp-h2 em{color:var(--cta)!important}
.lp-sec--navy .lp-h2 em{color:var(--melo)!important}
.lp-intro{max-width:680px;margin:1.1rem 0 0!important;color:var(--t2)!important;font-size:1.1rem;line-height:1.65}
.lp-intro--c{text-align:center;margin-left:auto!important;margin-right:auto!important}
.lp-sec--navy .lp-intro{color:rgba(255,255,255,.8)!important}

/* ── Hero ────────────────────────────────────────────────────────────── */
.lp-hero{position:relative;padding:clamp(36px,5vw,80px) 0 clamp(48px,6vw,88px);isolation:isolate;overflow:hidden}
.lp-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,5vw,72px);align-items:center}
.lp-circ{position:absolute;border-radius:50%;z-index:-1;pointer-events:none}
.lp-circ--a{width:420px;height:420px;right:-150px;top:-130px;background:var(--melo);opacity:.55}
.lp-circ--b{width:200px;height:200px;left:-80px;bottom:-100px;background:var(--cielo);opacity:.6}
.lp-hero--salvia .lp-circ--a{background:var(--salvia)}
.lp-hero--salvia .lp-circ--b{background:var(--arena)}
.lp-h1{font-size:clamp(2.3rem,1rem + 4vw,4.4rem);font-weight:750;line-height:1;letter-spacing:-.04em}
.lp-h1 .lp-it{color:var(--cta)!important;font-size:1.06em}
.lp-lead{font-size:clamp(1.08rem,1rem + .35vw,1.22rem);color:var(--t2)!important;max-width:580px;margin:1.5rem 0 0!important;line-height:1.6}
.lp-sellos{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.75rem!important}
.lp-sellos li{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .95rem;border-radius:999px;background:#fff;border:2px solid var(--line);font-size:.92rem;font-weight:600;color:var(--n)}
.lp-sellos .lp-ico{color:var(--cta);width:1.1em;height:1.1em;stroke-width:2}
.lp-in{opacity:0;transform:translateY(22px);animation:lpIn .85s calc(var(--d,0) * .09s + .05s) var(--ease) forwards}
@keyframes lpIn{to{opacity:1;transform:none}}

/* Mosaico de caras del hero */
.lp-mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.4vw,16px);transform:rotate(-3deg);margin:16px 0}
.lp-cara{position:relative;display:block;aspect-ratio:1;border-radius:26px;overflow:hidden;background:var(--cielo);border:3px solid #fff}
.lp-cara:nth-child(3n+2){transform:translateY(20px)}
.lp-cara:nth-child(3n+3){transform:translateY(-12px)}
.lp-cara img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.lp-cara:hover img{transform:scale(1.06)}
.lp-cara__ok{position:absolute;right:8px;bottom:8px;width:30px;height:30px;border-radius:50%;background:#fff;color:var(--n);display:grid;place-items:center}
.lp-cara__ok .lp-ico{width:18px;height:18px;stroke-width:2}

/* ── Listado de tarjetas ─────────────────────────────────────────────── */
.lp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px);margin-top:clamp(32px,4vw,52px)!important}
.lp-card{display:flex;flex-direction:column;background:#fff;border:2px solid var(--line);border-radius:28px;padding:1.4rem 1.4rem 1.3rem;transition:transform .35s var(--ease),border-color .35s var(--ease)}
.lp-card:hover{transform:translateY(-4px);border-color:var(--n)}
.lp-card--v{border-color:var(--salvia)}
.lp-card__head{display:flex;gap:1rem;align-items:center}
.lp-card__foto,.lp-card__ini{width:84px;height:84px;border-radius:24px;flex:none;object-fit:cover;display:block;background:var(--cielo)}
.lp-card__ini{display:grid;place-items:center;font-family:var(--disp);font-weight:750;font-size:1.6rem;color:var(--n)}
.lp-card__nombre{font-size:1.2rem;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.lp-card__nombre a{color:var(--n)!important}
.lp-card__nombre a:hover{color:var(--cta)!important}
.lp-card__area{margin-top:.25rem!important;color:var(--t3)!important;font-size:.95rem;line-height:1.35}
.lp-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem!important}
.lp-tags li{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .7rem;border-radius:999px;background:var(--cream);border:1.5px solid var(--line);font-size:.82rem;font-weight:600;color:var(--t2);line-height:1.2}
.lp-tags li.ok{background:var(--salvia);border-color:var(--salvia);color:var(--n)}
.lp-tags li.en{background:var(--cielo);border-color:var(--cielo);color:var(--n)}
.lp-tags li.gratis{background:var(--melo);border-color:var(--melo);color:var(--n)}
.lp-tags .lp-ico{width:1em;height:1em;stroke-width:2.2}
.lp-card__pie{margin-top:auto;padding-top:1.1rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.lp-card__precio{font-size:.9rem;color:var(--t3)!important;line-height:1.3}
.lp-card__precio strong{display:block;font-family:var(--disp);font-size:1.15rem;color:var(--n);letter-spacing:-.02em}
.lp-card__links{display:flex;gap:.9rem;margin-top:.7rem!important;font-size:.88rem}
.lp-vacio{margin-top:2rem!important;padding:1.6rem 1.8rem;border-radius:28px;background:#fff;border:2px solid var(--line);color:var(--t2)!important;font-size:1.05rem}

/* ── Cómo funciona (3 pasos) ─────────────────────────────────────────── */
.lp-pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px);margin-top:clamp(32px,4vw,52px)!important;position:relative}
.lp-pasos::before{content:"";position:absolute;left:36px;right:36px;top:35px;border-top:2px dashed var(--line);z-index:0}
.lp-pasos li{position:relative;z-index:1}
.lp-paso__n{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--n);color:#fff;font-family:var(--disp);font-weight:750;font-size:1.8rem;border:6px solid #fff}
.lp-sec--crema .lp-paso__n{border-color:var(--cream)}
.lp-pasos li:nth-child(2) .lp-paso__n{background:var(--cta)}
.lp-pasos li:nth-child(3) .lp-paso__n{background:var(--n2)}
.lp-pasos h3{margin-top:1.2rem!important;font-size:1.35rem;font-weight:700;letter-spacing:-.02em}
.lp-pasos p{margin-top:.5rem!important;color:var(--t2)!important;font-size:1.02rem;line-height:1.6}

/* ── Baldosas de color ───────────────────────────────────────────────── */
.lp-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,22px);margin-top:clamp(32px,4vw,52px)!important}
.lp-tile{background:var(--c,var(--melo));border-radius:30px;padding:1.9rem 1.7rem;color:var(--n);transition:transform .35s var(--ease)}
.lp-tile:hover{transform:translateY(-4px) rotate(-.4deg)}
.lp-tile .lp-ico--xl{display:block;margin-bottom:1.2rem}
.lp-tile h3{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.lp-tile p{margin-top:.55rem!important;font-size:1.02rem;line-height:1.55;color:var(--n)!important;opacity:.85}

/* ── Aviso honesto / urgencia ────────────────────────────────────────── */
.lp-nota{display:flex;gap:1.2rem;align-items:flex-start;margin-top:clamp(28px,3vw,40px);padding:1.5rem 1.7rem;border-radius:28px;border:2px solid var(--n);background:#fff}
.lp-nota .lp-ico--xl{width:44px;height:44px;color:var(--n);stroke-width:1.5}
.lp-nota p{font-size:1.02rem;line-height:1.65;color:var(--t2)!important}
.lp-nota strong{color:var(--n)}
.lp-nota a{color:var(--cta)!important;text-decoration:underline}
.lp-urg{border-color:var(--cta)}
.lp-urg .lp-ico--xl{color:var(--cta)}

/* ── Chips de ciudades y enlaces ─────────────────────────────────────── */
.lp-chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem!important}
.lp-chips a{display:inline-flex;align-items:center;gap:.45rem;padding:.65rem 1.05rem;border-radius:999px;background:#fff;border:2px solid var(--line);font-weight:600;color:var(--n)!important;font-size:.95rem;transition:border-color .25s var(--ease),background-color .25s var(--ease)}
.lp-chips a:hover{border-color:var(--n)}
.lp-chips a small{font-weight:500;color:var(--t3)}

/* ── FAQ ─────────────────────────────────────────────────────────────── */
.lp-faq{margin-top:clamp(28px,3vw,40px)!important;display:grid;gap:.75rem;max-width:860px}
.lp-faq details{background:#fff;border:2px solid var(--line);border-radius:22px;padding:0 1.4rem}
.lp-faq details[open]{border-color:var(--n)}
.lp-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.1rem 0;font-family:var(--disp);font-weight:700;font-size:1.1rem;letter-spacing:-.015em;color:var(--n)}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";font-weight:400;font-size:1.5rem;line-height:1;color:var(--cta);flex:none;transition:transform .3s var(--ease)}
.lp-faq details[open] summary::after{transform:rotate(45deg)}
.lp-faq details p{padding:0 0 1.2rem;color:var(--t2)!important;font-size:1.02rem;line-height:1.65}
.lp-faq details p a{color:var(--cta)!important;text-decoration:underline}

/* ── Cierre ──────────────────────────────────────────────────────────── */
.lp-fin{background:var(--n);color:#fff;padding:clamp(60px,8vw,112px) 0;text-align:center}
.lp-fin .lp-h2 em{color:var(--melo)!important}
.lp-fin .lp-intro{color:rgba(255,255,255,.8)!important}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width:1024px){
  .lp-grid,.lp-tiles{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .lp-hero__grid{grid-template-columns:1fr}
  .lp-mosaic{max-width:420px;margin:28px auto 0}
  .lp-pasos{grid-template-columns:1fr}
  .lp-pasos::before{left:35px;right:auto;top:36px;bottom:36px;border-top:0;border-left:2px dashed var(--line)}
  .lp-pasos li{padding-left:96px;min-height:72px}
  .lp-paso__n{position:absolute;left:0;top:0}
  .lp-pasos h3{margin-top:.6rem!important}
}
@media (max-width:640px){
  .lp-grid,.lp-tiles{grid-template-columns:1fr}
  .lp-btn{width:100%;font-size:1.04rem}
  .lp-ctas{flex-direction:column;align-items:stretch}
  .lp-card__pie{flex-direction:column;align-items:stretch}
  .lp-nota{flex-direction:column;gap:.8rem}
}
@media (prefers-reduced-motion:reduce){
  .lp-in{opacity:1;transform:none;animation:none}
  .lp *{transition:none!important}
}
