/* ===== Chrome de las paginas legales =====
     Se apoya en v4-core.css y pilares.css (.page-hero, .crumbs, .lede).
     Aqui viven solo el sello de fecha, el indice y el cuerpo del documento. */
  .updated{
    display:inline-flex; align-items:center; gap:9px;
    background:#fff; border:1px solid var(--line); color:var(--navy);
    font-size:.88rem; font-weight:600;
    padding:9px 17px; border-radius:100px; box-shadow:var(--shadow-sm);
  }
  .updated i{color:var(--teal-deep);font-size:.86rem;}

  .legal-body{padding:0 0 84px;}
  .legal-card{
    background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
    box-shadow:var(--shadow-sm); padding:clamp(26px,4vw,52px);
    max-width:900px; overflow-wrap:break-word;
  }
  .legal-card .lead{font-size:1.08rem;color:var(--body);}
  .legal-card .lead strong{color:var(--navy);}

  /* Indice: fichas en linea, como los chips del sitio. */
  .toc{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-sm);padding:18px 20px;margin-top:26px;}
  .toc h2{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin:0 0 13px;padding:0;}
  .legal-card .toc h2{padding:0;}
  .legal-card .toc h2::before{display:none;}
  .toc ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;}
  .legal-card .toc li{margin:0;padding:0;}
  .legal-card .toc li::before{display:none;}
  /* Especificidad por encima de .legal-card a: los chips no van subrayados. */
  .legal-card .toc a{
    display:inline-block;font-size:.86rem;font-weight:700;color:var(--navy);
    background:#fff;border:1px solid var(--line);padding:7px 14px;border-radius:100px;
    text-decoration:none;transition:background .2s,color .2s,border-color .2s;
  }
  .legal-card .toc a:hover{background:var(--navy);color:#fff;border-color:var(--navy);text-decoration:none;}

  .legal-card h2{
    position:relative;padding-bottom:11px;margin:38px 0 16px;
    font-size:clamp(1.2rem,2.4vw,1.5rem);font-weight:800;line-height:1.2;
    scroll-margin-top:96px;
  }
  /* Subrayado corto bajo el titulo: el mismo lenguaje del hover de servicios.
     La barra lateral quedo retirada de todo el sitio. */
  .legal-card h2::before{content:"";position:absolute;left:0;bottom:0;width:44px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--teal),var(--yellow));}
  .legal-card h2 .num{color:var(--teal-deep);}
  .legal-card h3{font-size:1.05rem;margin:22px 0 8px;color:var(--navy-deep);}
  .legal-card p{margin:0 0 15px;}
  .legal-card p:last-child{margin-bottom:0;}
  .legal-card ul{margin:6px 0 18px;}
  .legal-card li{position:relative;padding-left:25px;margin-bottom:10px;}
  .legal-card li::before{content:"";position:absolute;left:5px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--teal);}
  .legal-card li strong{color:var(--navy);}
  /* Los .btn quedan fuera: traen su propio color y esta regla (0,1,1) gana a
     .btn-primary (0,1,0), que es como el boton acababa en teal sobre navy. */
  .legal-card a:not(.btn){color:var(--teal-text);font-weight:700;text-decoration:underline;text-underline-offset:2px;}
  .legal-card a:not(.btn):hover{color:var(--navy);}

  .legal-card code{
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em;
    background:var(--cream);border:1px solid var(--line);border-radius:6px;
    padding:1px 6px;color:var(--navy-deep);
  }

  /* Aviso destacado. El acento va en el tinte del fondo y en la ficha del
     icono, no en una barra lateral. */
  .callout{
    position:relative;
    background:rgba(49,175,180,.07);border:1px solid var(--line);
    border-radius:var(--r-sm);padding:18px 20px 18px 62px;margin:18px 0;
  }
  .callout .callout-ic{
    position:absolute;left:19px;top:17px;
    width:30px;height:30px;border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(49,175,180,.16);color:var(--teal-text);font-size:.88rem;
  }
  .callout p:last-child{margin-bottom:0;}
  .callout .btn{margin-top:12px;}
  @media (max-width:560px){
    .callout{padding:52px 18px 18px;}
    .callout .callout-ic{left:18px;top:15px;}
  }
  .btn[disabled]{opacity:.6;box-shadow:none;transform:none;cursor:default;}
  /* Estos botones llevan una direccion de correo entera: sin permitirles
     partir la linea desbordan la pagina a 320px. */
  .legal-card .btn{max-width:100%;white-space:normal;text-align:center;}

  .legal-datos{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0 20px;}
  .legal-dato{
    display:inline-flex;align-items:center;gap:11px;
    font-size:.94rem;font-weight:600;color:var(--navy);
    background:var(--cream);border:1px solid var(--line);
    padding:12px 17px;border-radius:var(--r-sm);
  }
  .legal-dato i,.legal-dato .ico-wa{color:var(--teal-deep);flex-shrink:0;}
  .legal-card .legal-dato a{color:var(--navy);text-decoration:none;}
  .legal-card .legal-dato a:hover{color:var(--teal-text);text-decoration:underline;}

  @media (max-width:560px){
    .legal-body{padding:0 0 60px;}
    .legal-card{border-radius:var(--r-md);}
    .legal-datos{flex-direction:column;align-items:flex-start;}
    .legal-dato{width:100%;}
  }