/* Landings NATIVAS: se carga DESPUÉS de home.css y servicio.css.
   (1) temas y estados iniciales por clase (antes de que native.js ponga los data-*),
   (2) utilidades = los estilos inline del prototipo servicio.html,
   (3) reglas del prototipo que dependían del tipo de elemento (a, li, b) para los contenedores/widgets nativos. */

/* (1) temas por clase (native.js añade data-theme para home.js) */
.va-theme-dark{background:var(--bg);color:var(--fg)}
.va-theme-dark2{background:var(--bg2);color:var(--fg)}
.va-theme-light{background:var(--lbg);color:var(--lfg)}
.va-theme-light2{background:var(--lbg2);color:var(--lfg)}
.va-theme-light,.va-theme-light2{--fg:var(--lfg);--fg2:var(--lfg2);--fg3:var(--lfg3);--fg4:var(--lfg4);--line:var(--lline);--line2:rgba(0,0,0,.10);--bg:#f4f2ed;--bg2:#ebe9e3}
.va-theme-light .btn-solid,.va-theme-light2 .btn-solid{background:#0f0f0f;color:#f4f2ed}
.va-theme-light .btn-solid::before,.va-theme-light2 .btn-solid::before{background:#f4f2ed}
.va-theme-light .btn-solid:hover,.va-theme-light2 .btn-solid:hover{color:#0f0f0f}
.va-theme-light blockquote,.va-theme-light2 blockquote{border-color:#0f0f0f}
.va-theme-light .price:hover,.va-theme-light2 .price:hover{color:#f4f2ed}
.va-reveal{opacity:0;transform:translateY(24px)}
.va-img{clip-path:inset(100% 0 0 0)}
.no-js .va-reveal,.no-js .va-img{opacity:1;transform:none;clip-path:none}

/* (2) utilidades (estilos inline del prototipo) */
.h1-land{font-size:clamp(44px,6.2vw,88px)}
.bq-sm{font-size:clamp(20px,1.8vw,24px)}
.h3-sub{font-size:clamp(20px,1.8vw,24px);padding-top:8px;letter-spacing:-.03em;line-height:1.06}
.acc-h5{font-family:var(--va-display);font-size:16px;font-weight:500;margin:0 0 8px;letter-spacing:0;line-height:1.6}
.mw680{max-width:680px}.mw720{max-width:720px}.mw760{max-width:760px}
.mt40{margin-top:40px}.mb40{margin-bottom:40px}.mb48{margin-bottom:48px}
.ai-end{align-items:end}.ai-start{align-items:start}.ai-center{align-items:center}
.gap16{gap:16px}.gap18{gap:18px}.gap20{gap:20px}.pt18{padding-top:18px}
.fs15{font-size:15px}.fs14{font-size:14px}.as-start{align-self:flex-start}
.rel{position:relative}.ov-hidden{overflow:hidden}
.card-t{font-size:19px}.card-d{font-size:13px;line-height:1.5;color:var(--fg3)}
.post-d{font-size:14px;line-height:1.6;color:var(--fg3)}
.star-eyebrow{display:flex;align-items:center;gap:10px;letter-spacing:.12em}
.eyebrow-inherit{color:inherit}
.trail-grid{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center;padding-top:clamp(56px,6vw,88px);padding-bottom:clamp(56px,6vw,88px)}
.bleed-media{position:absolute;top:0;right:0;width:40%;height:100%;opacity:.4}
.bleed-grad{position:absolute;inset:0;background:linear-gradient(90deg,#0e0e0e 0%,#0e0e0e 55%,rgba(14,14,14,.6) 72%,rgba(14,14,14,.2) 100%)}
.blog-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.trail-sec .wrap{padding-left:var(--gutter);padding-right:var(--gutter)}
@media (max-width:820px){.trail-grid{grid-template-columns:1fr}}

/* (3) equivalentes nativos de las reglas por tipo de elemento */
.trust>.e-con{display:flex;align-items:baseline;gap:12px}
.trust .b{font-family:var(--va-display);font-weight:300;font-size:30px;letter-spacing:0;text-transform:none;color:inherit}
.list:hover .item{opacity:.55}
.list .item:hover{opacity:1}
.list .item:hover .t{transform:translateX(8px)}
.list .item:hover .t svg{opacity:1}
.list .item,.card,.posts>.e-con{position:relative}
.list .item .t a,.card .t a,.price .t a,.posts .t a{color:inherit;text-decoration:none}
.list .item .t a::after,.card .t a::after,.price .t a::after,.posts .t a::after{content:"";position:absolute;inset:0}
.card>.elementor-widget-text-editor>.elementor-widget-container,.list .item>.elementor-widget-text-editor>.elementor-widget-container{display:block}
.price .row .b{font-family:var(--va-display);font-weight:300;font-size:32px;letter-spacing:0;text-transform:none}
.posts>.e-con{display:flex;flex-direction:column;gap:14px;padding-top:24px;border-top:1px solid var(--line)}
.posts>.e-con:hover .t{transform:translateX(6px)}
.steps>.e-con{display:grid;grid-template-columns:56px minmax(0,1fr);gap:20px;padding:24px 0;border-top:1px solid transparent;position:relative}
.steps>.e-con:last-child{border-bottom:1px solid transparent}
.steps .t{display:block;margin-bottom:6px}
.acc-btn .e-n-accordion-item-title-text{display:block}
.acc-panel>.e-con>.elementor-widget-text-editor>.elementor-widget-container{display:contents}

/* formulario CF7 con el aspecto del formulario del prototipo (.contact) */
.contact form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 32px;align-items:end}
.contact form>p{margin:0;min-width:0}
.contact form>p:nth-of-type(2){grid-column:1/-1;grid-row:2}
.contact form>p:nth-of-type(3){grid-column:2;grid-row:1}
.contact form>p:nth-of-type(4){grid-column:1/-1}
.contact form>p:nth-of-type(5){grid-column:1;font-size:13px;color:var(--fg3)}
.contact form>p:nth-of-type(6){grid-column:2;justify-self:end}
.contact .wpcf7-form-control-wrap{display:block}
.contact input[type=text],.contact input[type=email],.contact input[type=tel],.contact textarea{width:100%;height:48px;padding:0;background:none;border:0;border-bottom:1px solid var(--line);color:inherit;font:inherit;outline:none;transition:border-color .3s;border-radius:0}
.contact textarea{height:auto;min-height:96px;padding:12px 0;resize:none}
.contact input:focus,.contact textarea:focus{border-color:currentColor}
.contact ::placeholder{color:var(--fg4)}
.contact .wpcf7-list-item{margin:0}
.contact .wpcf7-list-item label{display:flex;align-items:center;gap:12px}
.contact form>p:nth-of-type(5) label{font-size:13px;color:var(--fg3)}
.contact form>p:nth-of-type(5) br{display:none}
.contact form>p:nth-of-type(5)>label>a{display:inline-block;margin-top:6px;color:var(--fg3);text-decoration:underline}
.contact .wpcf7-submit{display:inline-flex;align-items:center;justify-content:center;height:56px;padding:0 32px;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;background:var(--fg);color:#0a0a0a;border:0;border-radius:0;cursor:pointer;font-family:var(--va-body)}
.contact .wpcf7-spinner{display:none}
.contact .wpcf7-response-output,.contact .wpcf7-not-valid-tip{grid-column:1/-1;margin:0;padding:12px 0 0;border:0;font-size:13px;color:var(--fg3)}
@media (max-width:820px){.contact form{grid-template-columns:1fr}.contact form>p{grid-column:auto!important;grid-row:auto!important}}

/* correcciones tras la primera comparación nativa vs referencia HTML */
.elementor-widget-container.crumbs{display:flex}
.bq-sm blockquote{font-size:clamp(20px,1.8vw,24px)}
.card .card-t{font-size:19px}
.card .card-d{font-size:13px;line-height:1.5;color:var(--fg3)}
.posts .post-d{font-size:14px;line-height:1.6;color:var(--fg3)}
.steps>.e-con .ln{position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--line);transform-origin:left;transform:scaleX(0)}
.steps>.e-con:last-child .ln2{position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--line);transform-origin:left;transform:scaleX(0)}
.steps>.e-con>.e-con{display:block}
/* en el prototipo el enlace ERA la tarjeta (.list a / .posts a); aquí el enlace vive dentro del título */
.list .item .t a,.posts .t a{display:inline;flex-direction:row;gap:0;padding:0;border:0;opacity:1}
.steps>.e-con p.d,.steps>.e-con .d p{line-height:25.6px} /* el prototipo maqueta .d como span inline: la línea la marca el strut de 16px del padre */

/* ---- HOME nativa ---- */
.stat .b{display:block;margin-top:0;font-family:var(--va-display);font-weight:300;font-size:clamp(32px,3vw,44px);line-height:1;letter-spacing:-.02em;text-transform:none;color:inherit}
.stat .s{display:block;margin-top:8px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg3)}
.hero .elementor-widget-text-editor>.elementor-widget-container{display:contents}
.mb64{margin-bottom:64px}.mw-none{max-width:none}
.bleed-media44{position:absolute;top:0;right:0;width:44%;height:100%;opacity:.35}
.bleed-grad2{position:absolute;inset:0;background:linear-gradient(90deg,#0e0e0e 0%,#0e0e0e 50%,rgba(14,14,14,.75) 66%,rgba(14,14,14,.25) 100%)}
.media-cutout{height:clamp(360px,44vw,628px);clip-path:none}
.media-cutout img.img-contain,.media img.img-contain{object-fit:contain;object-position:50% 100%;filter:none}
.name30{font-family:var(--va-display);font-size:30px;letter-spacing:-.02em}
.ls12{letter-spacing:.12em}
.cols360{grid-template-columns:minmax(0,360px) minmax(0,1fr)}
.quotes>.elementor-widget-text-editor>.elementor-widget-container{display:contents}
.pricelist .row{position:relative}
.pricelist .row .t a{color:inherit;text-decoration:none}
.pricelist .row .t a::after{content:"";position:absolute;inset:0}
.pricelist .row .p{white-space:nowrap}
.tailor .txt>.elementor-widget-text-editor>.elementor-widget-container{display:contents}
.posts .post{display:flex;flex-direction:column;gap:14px;padding-top:24px;border-top:1px solid var(--line)}
.posts .post .d{font-size:14px;line-height:1.6;color:var(--fg3)}
.elementor-shortcode.contact,.wpcf7.contact{display:block}
@media (max-width:820px){.cols360{grid-template-columns:1fr}}

/* ---- HOME completa ---- */
.list .item .d a,.card .d a,.posts .post .d a{display:inline;flex-direction:row;gap:0;padding:0;border:0;opacity:1;transition:none;position:relative;z-index:1;text-decoration:underline;text-decoration-color:var(--fg4);text-underline-offset:3px}
.list:hover .item .d a{opacity:1}
.pricelist .row h3.t{font-weight:inherit;letter-spacing:inherit;font-size:inherit;line-height:inherit;margin:0}
h3.name30{font-weight:400;line-height:1.6;letter-spacing:-.02em}
.marquee .marquee-label{flex-shrink:0;width:180px;font-family:var(--va-body);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--fg4);line-height:1.6}
.posts .post h3.t{font-weight:300;letter-spacing:0;line-height:1.25;margin:0}
.stat h3.s{font-family:var(--va-body);font-weight:400;letter-spacing:.16em}
@media (max-width:820px){.marquee .marquee-label{display:none}}
/* ---- HOME completa · equipo en dos columnas + partidos judiciales en el footer ---- */
.team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:start}
.team .more-body p{font-size:15px}
@media (max-width:820px){.team{grid-template-columns:1fr}}
footer .served{margin:56px 0 0;max-width:960px;font-size:13px;line-height:1.7;color:#7d7c78}
footer .served a{color:#b5b3ae;text-decoration:underline;text-underline-offset:3px}
/* El scroll suave por CSS del prototipo rompe las medidas de ScrollTrigger tras abrir un «Leer más» o un acordeón (refresh() sube a 0 y la página no llega a tiempo): el suave lo hace native.js con scrollIntoView */
html{scroll-behavior:auto}
/* footer en móvil: una columna (a dos columnas el bloque de contacto se sale por la derecha) */
@media (max-width:600px){footer .cols{grid-template-columns:1fr;gap:36px}footer ul a[href^="mailto"]{word-break:break-all}}

/* ---- Landing «asistencia al detenido»: tablas, línea de tiempo y rejillas ---- */
/* tablas de producción (derechos del art. 520 LECrim, oficio vs confianza) con el lenguaje del prototipo */
.tbl-wrap{margin-top:32px;overflow-x:auto}
.va-table{width:100%;border-collapse:collapse;text-align:left}
.va-table th{padding:0 28px 14px 0;font-family:var(--va-body);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fg4);border-bottom:1px solid var(--line);white-space:nowrap}
.va-table td{padding:20px 28px 20px 0;border-bottom:1px solid var(--line);vertical-align:top;font-size:15px;line-height:1.6;color:var(--fg2)}
.va-table td:first-child{font-family:var(--va-display);font-size:19px;line-height:1.35;letter-spacing:-.01em;color:var(--fg);min-width:190px}
.va-table tbody tr:last-child td{border-bottom:0}
.va-table th:last-child,.va-table td:last-child{padding-right:0}
@media (max-width:860px){.va-table{min-width:660px}}
/* línea de tiempo de plazos (0 h → 72 h) */
.tl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 40px}
.tl>.e-con{display:flex;flex-direction:column;gap:12px;padding:24px 0 28px;border-top:1px solid var(--line)}
.tl .k{font-family:var(--va-display);font-size:20px;line-height:1.25;letter-spacing:-.01em}
.tl .d{font-size:14px;line-height:1.6;color:var(--fg3)}
.tl>.e-con>.elementor-widget-text-editor>.elementor-widget-container{display:contents}
@media (max-width:900px){.tl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.tl{grid-template-columns:1fr}}
/* rejilla de tarjetas a 3 columnas (5 situaciones de detención) */
.cards.cols3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.cards.cols3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cards.cols3{grid-template-columns:1fr}}
/* títulos de lista sin enlace: sin desplazamiento ni flecha */
.list .item .t.no-arrow{cursor:default}
.list:hover .item:has(.t.no-arrow){opacity:1}

/* bloque de conversión de NDE (snippet global «nde-conv», solo en algunas money pages): native.js lo baja al final del
   hero y aquí se le da el lenguaje del diseño (sin dorado Divi ni esquinas redondeadas); el verde de WhatsApp se mantiene */
.page-head .nde-conv{max-width:none;margin:12px 0 0;align-items:flex-start;text-align:left;gap:16px}
.page-head .nde-conv .nde-r{font-family:var(--va-body);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fg3)}
.page-head .nde-conv .nde-r .nde-s{color:var(--fg);font-size:13px}
.page-head .nde-conv .nde-bs{width:auto;justify-content:flex-start;gap:16px}
.page-head .nde-conv a{height:56px;padding:0 28px;border-radius:0;font-family:var(--va-body);font-weight:700;letter-spacing:.06em}
.page-head .nde-conv .nde-tel{background:var(--fg);color:#0a0a0a;font-size:18px}
.page-head .nde-conv .nde-tel svg{fill:#0a0a0a}
.page-head .nde-conv .nde-tel small{font-size:10px;font-weight:600;letter-spacing:.16em;opacity:.6}
.page-head .nde-conv .nde-wa{background:#0a5d00;color:#fff;font-size:16px}
.page-head .nde-conv .nde-m{font-size:13px;color:var(--fg3)}
.page-head .nde-conv .nde-m b{color:var(--fg2);font-weight:600}
/* con el bloque presente, el botón de teléfono del hero sobra (mismo número) */
.page-head .stack:has(.nde-conv) .hero-cta .btn-line[href^="tel"]{display:none}
@media (max-width:820px){.page-head .nde-conv .nde-bs{flex-direction:column;width:100%}.page-head .nde-conv a{width:100%}}

/* enlaces dentro de párrafos de texto: subrayado fino como en los acordeones (coherencia y legibilidad) */
.sec .muted a,.sec .lead a,.page-head .lead a{text-decoration:underline;text-decoration-color:var(--fg4);text-underline-offset:3px}
/* tablas en móvil: formato ficha con la etiqueta de columna (un CSS global del tema las convierte en tarjetas y se comía la primera fila) */
@media (max-width:860px){
  .tbl-wrap{overflow:visible}
  .tbl-wrap .va-table{display:block;min-width:0}
  .tbl-wrap .va-table thead{display:none}
  .tbl-wrap .va-table tbody{display:block}
  .tbl-wrap .va-table tr{display:block!important;padding:20px 0;border-bottom:1px solid var(--line)}
  .tbl-wrap .va-table tr:last-child{border-bottom:0}
  .tbl-wrap .va-table td{display:block;padding:0 0 12px;border:0;min-width:0}
  .tbl-wrap .va-table td:last-child{padding-bottom:0}
  .tbl-wrap .va-table td:first-child{font-size:19px;padding-bottom:14px}
  .tbl-wrap .va-table td[data-l]::before{content:attr(data-l);display:block;margin-bottom:4px;font-family:var(--va-body);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fg4)}
  .tbl-wrap .va-table td:first-child[data-l]::before{content:none}
}
/* botones con texto largo en móvil: que rompan línea en vez de estirar la columna del grid (el «white-space:nowrap»
   del prototipo hacía que «Activar la asistencia ahora · 2.000 €» impusiera 380 px de ancho mínimo) */
@media (max-width:820px){
  .btn,.btn .elementor-button{white-space:normal;height:auto;min-height:56px;padding:16px 24px;line-height:1.35;text-align:center}
  .btn-line,.btn-line .elementor-button{min-height:0;padding:0 0 6px;text-align:left}
  .more-btn{white-space:normal}
}
/* tablas en ficha: sin las cajas que pinta el CSS global del tema */
@media (max-width:860px){
  .tbl-wrap .va-table tr{border:0;border-bottom:1px solid var(--line)!important;background:none!important}
  .tbl-wrap .va-table td{border:0!important;background:none!important}
}
