  @font-face{font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/montserrat-600.woff2') format('woff2');}
  @font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/montserrat-700.woff2') format('woff2');}
  @font-face{font-family:'Montserrat';font-style:normal;font-weight:800;font-display:swap;src:url('/fonts/montserrat-800.woff2') format('woff2');}
  @font-face{font-family:'Lato';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/lato-400.woff2') format('woff2');}
  @font-face{font-family:'Lato';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/lato-700.woff2') format('woff2');}

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0;background:var(--blanco);color:var(--navy);font-family:var(--tipo-cuerpo);font-size:var(--t-cuerpo);line-height:var(--lh-cuerpo);-webkit-text-size-adjust:100%;}
  h1,h2,h3,p,ol,ul{margin:0;}
  img{display:block;max-width:100%;}
  a{color:var(--azul);}
  a:hover{color:var(--navy);}
  :focus-visible{outline:var(--foco-ancho) solid var(--foco-claro);outline-offset:var(--foco-offset);}
  .oscuro :focus-visible{outline-color:var(--foco-navy);}
  .ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
  .palomita{width:20px;height:20px;flex:none;margin-top:2px;fill:none;stroke:var(--azul);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}

  /* Contenedor y secciones */
  .caja{max-width:1120px;margin:0 auto;padding:var(--esp-64) var(--esp-24);}
  .claro{background:var(--fondo);}
  .titulo-seccion{font-family:var(--tipo-titulo);font-weight:700;font-size:var(--t-titulo);line-height:var(--lh-titulo);}
  .h3{font-family:var(--tipo-titulo);font-weight:700;font-size:var(--t-seccion);line-height:var(--lh-titulo);}
  .apilar{display:flex;flex-direction:column;}
  .apoyo{font-size:var(--t-apoyo);}
  .caption{font-size:var(--t-caption);color:var(--caption);}
  .gris{color:var(--caption);}

  /* Botones */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--esp-8);min-height:48px;padding:0 var(--esp-24);font-family:var(--tipo-titulo);font-weight:600;font-size:var(--t-boton);line-height:var(--lh-titulo);text-decoration:none;}
  .btn-primario{background:var(--navy);color:var(--blanco);border-radius:var(--radio-14);}
  .btn-primario:hover{color:var(--blanco);}
  .btn-secundario{background:var(--blanco);color:var(--navy);border:1px solid var(--navy);border-radius:var(--radio-12);}
  .btn-secundario:hover{background:var(--hover);color:var(--navy);}
  .botones{display:flex;flex-wrap:wrap;gap:var(--esp-12);}

  /* Cabecera */
  .cabecera{border-bottom:1px solid var(--borde);background:var(--blanco);}
  .cabecera .caja{padding:var(--esp-16) var(--esp-24);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--esp-16);}
  .cabecera .logo{height:48px;width:auto;}
  .nav{display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-24);font-size:var(--t-apoyo);}
  .nav a{color:var(--navy);text-decoration:none;}
  .nav .nav-tel{color:var(--azul);font-family:var(--tipo-titulo);font-weight:700;}
  .nav .btn{min-height:44px;padding:0 var(--esp-16);color:var(--blanco);}

  /* Inicio */
  .inicio .caja{display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-48);}
  .inicio-texto{flex:999 1 480px;min-width:0;gap:var(--esp-24);}
  .inicio h1{font-family:var(--tipo-titulo);font-weight:800;font-size:var(--t-display);line-height:var(--lh-titulo);}
  .inicio-texto>p:first-of-type{max-width:560px;}
  .inicio .tel{font-weight:700;text-decoration:none;}
  .resena{font-weight:700;}
  .tarjeta{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio-14);padding:var(--esp-24);}
  .diagnostico{flex:1 1 340px;min-width:0;gap:var(--esp-16);}
  .lista-palomitas{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--esp-12);}
  .lista-palomitas li{display:flex;gap:var(--esp-12);align-items:flex-start;}

  /* Lo que nos dicen */
  .dicen .caja{gap:40px;}
  .frase-mayor{font-family:var(--tipo-titulo);font-weight:700;font-size:var(--t-display);line-height:var(--lh-titulo);color:var(--azul);max-width:840px;}
  .frases{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--esp-32) var(--esp-48);}
  .frases p{padding-top:var(--esp-16);border-top:1px solid var(--borde);font-size:var(--t-seccion);line-height:1.4;}
  .cierre-seccion{display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-16) var(--esp-24);}

  /* ¿Qué te acaba de pasar? */
  .paso-algo .caja{gap:var(--esp-32);}
  .lista-renglones{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--radio-14);padding:var(--esp-8) var(--esp-32);}
  .renglon{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--esp-8) var(--esp-48);padding:var(--esp-24) 0;}
  .renglon+.renglon{border-top:1px solid var(--borde);}

  /* ¿Cuál es tu caso? */
  .casos{display:flex;flex-wrap:wrap;gap:var(--esp-24);}
  .caso{flex:1 1 460px;min-width:0;background:var(--hover);border:1px solid var(--borde);border-radius:var(--radio-14);padding:var(--esp-24);gap:var(--esp-8);}
  .caso .ico-caso{width:32px;height:32px;margin-bottom:var(--esp-8);fill:none;stroke:var(--azul);stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}

  /* Cómo empezamos */
  .pasos{position:relative;}
  .pasos::before{content:"";position:absolute;top:23px;left:calc(16.666% - 10.67px);right:calc(16.666% - 10.67px);height:2px;background:var(--azul);}
  .pasos ol{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--esp-32);position:relative;}
  .pasos li{display:flex;flex-direction:column;align-items:center;gap:var(--esp-8);text-align:center;}
  .pasos li p{max-width:300px;}
  .numero{width:48px;height:48px;border-radius:50%;background:var(--azul);color:var(--blanco);display:flex;align-items:center;justify-content:center;font-family:var(--tipo-titulo);font-weight:800;font-size:var(--t-seccion);margin-bottom:var(--esp-8);}

  /* Cada mes */
  .beneficios{display:flex;flex-wrap:wrap;gap:var(--esp-24);}
  .beneficio{flex:1 1 240px;min-width:0;gap:var(--esp-8);padding-top:var(--esp-16);border-top:4px solid var(--azul);}

  /* Precios */
  .precios-tarjetas{display:flex;flex-wrap:wrap;gap:var(--esp-24);}
  .precio{flex:1 1 300px;min-width:0;gap:var(--esp-8);}
  .cifra{font-family:var(--tipo-titulo);font-weight:700;font-size:var(--t-titulo);line-height:var(--lh-titulo);color:var(--azul);}

  /* El despacho */
  .despacho .caja{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--esp-48);}
  .despacho-texto{flex:999 1 480px;min-width:0;gap:var(--esp-16);}
  .ficha{flex:1 1 320px;min-width:0;background:var(--hover);border:1px solid var(--borde);border-radius:var(--radio-14);padding:var(--esp-24);gap:var(--esp-16);}
  .ficha>div{display:flex;flex-direction:column;gap:var(--esp-4);}
  .ficha>div+div{padding-top:var(--esp-16);border-top:1px solid var(--borde);}
  .etiqueta{font-size:var(--t-apoyo);color:var(--caption);}

  /* Preguntas */
  .preguntas{max-width:800px;border-top:1px solid var(--frio-2);}
  .preguntas details{border-bottom:1px solid var(--frio-2);}
  .preguntas summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:var(--esp-16);padding:var(--esp-16) 0;font-family:var(--tipo-titulo);font-weight:700;font-size:var(--t-seccion);line-height:var(--lh-titulo);}
  .preguntas summary::-webkit-details-marker{display:none;}
  .preguntas summary svg{width:20px;height:20px;flex:none;fill:none;stroke:var(--azul);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .12s ease;}
  .preguntas details[open]>summary svg{transform:rotate(180deg);}
  .preguntas details p{padding:0 0 var(--esp-16);}

  /* Contacto y pie, sobre navy: nunca --azul aquí (tokens.css, regla dura) */
  .oscuro{background:var(--navy);color:var(--blanco);}
  .contacto .caja{display:flex;flex-direction:column;align-items:center;gap:var(--esp-24);text-align:center;}
  .contacto p{max-width:560px;color:var(--frio-2);}
  .contacto .botones{justify-content:center;}
  .contacto .btn-claro{background:var(--blanco);color:var(--navy);border-radius:var(--radio-14);}
  .contacto .btn-claro:hover{background:var(--hover);color:var(--navy);}
  .contacto .btn-borde{border:1px solid var(--frio-2);color:var(--blanco);border-radius:var(--radio-12);}
  .contacto .btn-borde:hover{border-color:var(--blanco);color:var(--blanco);}
  .pie{color:var(--frio-2);border-top:1px solid var(--caption);}
  .pie .caja{padding:var(--esp-48) var(--esp-24);display:flex;flex-wrap:wrap;gap:var(--esp-48);font-size:var(--t-apoyo);}
  .pie .col{min-width:0;gap:var(--esp-8);}
  .pie .col-1{flex:1 1 280px;gap:var(--esp-16);}
  .pie .col-2,.pie .col-3{flex:1 1 220px;}
  .pie .logo{height:48px;width:auto;align-self:flex-start;}
  .pie a{color:var(--frio-2);text-decoration:none;}
  .pie a:hover{color:var(--blanco);}
  .pie .col-titulo{font-family:var(--tipo-titulo);font-weight:700;color:var(--blanco);}

  /* Barra fija: sólo en celular */
  .barra{display:none;}

  @media (max-width: 767px){
    .caja{padding:40px var(--esp-16);}
    .cabecera .caja{padding:var(--esp-12) var(--esp-16);flex-wrap:nowrap;}
    .cabecera .logo{height:40px;}
    .nav a:not(.nav-precios){display:none;}
    .nav a.nav-precios{padding:var(--esp-12) 0;}
    .inicio .caja{padding-top:var(--esp-32);gap:var(--esp-16);}
    .inicio-texto{gap:var(--esp-16);}
    .inicio h1{font-size:var(--t-titulo);}
    .inicio .botones{flex-direction:column;}
    .btn{width:100%;}
    .nav .btn{width:auto;}
    .tarjeta,.caso,.ficha{padding:var(--esp-16);}
    .diagnostico{gap:var(--esp-12);}
    .dicen .caja{gap:var(--esp-24);}
    .frase-mayor{font-size:var(--t-titulo);}
    .frases{display:flex;flex-direction:column;gap:var(--esp-16);}
    .cierre-seccion{flex-direction:column;align-items:stretch;}
    .paso-algo .caja,.casos-seccion .caja,.empezamos .caja,.cada-mes .caja{gap:var(--esp-24);}
    .lista-renglones{padding:0 var(--esp-16);}
    .renglon{display:flex;flex-direction:column;padding:var(--esp-16) 0;}
    .casos{gap:var(--esp-16);}
    .caso .ico-caso{margin-bottom:0;}
    /* «Cómo empezamos» en vertical, con la línea que une los números */
    .pasos::before{display:none;}
    .pasos ol{display:flex;flex-direction:column;gap:var(--esp-24);}
    .pasos li{flex-direction:row;align-items:flex-start;gap:var(--esp-16);text-align:left;position:relative;}
    .pasos li:not(:last-child)::after{content:"";position:absolute;left:23px;top:48px;bottom:-24px;width:2px;background:var(--azul);}
    .pasos li .numero{flex:none;margin-bottom:0;}
    .pasos li>div:last-child{display:flex;flex-direction:column;gap:var(--esp-4);padding-top:10px;}
    .precios-tarjetas{flex-direction:column;gap:var(--esp-16);}
    /* En columna, la base del flex se vuelve ALTO: sin esto, cada tarjeta mide 300 px */
    .precio{gap:var(--esp-4);flex:none;}
    .despacho .caja{gap:var(--esp-16);}
    .preguntas{max-width:none;}
    .contacto .caja{gap:var(--esp-16);}
    .contacto .botones{flex-direction:column;width:100%;}
    .pie .caja{padding:var(--esp-32) var(--esp-16);flex-direction:column;gap:var(--esp-24);}
    .pie .col{flex:none;}
    .pie .logo{height:40px;}
    .pie .solo-escritorio{display:none;}
    /* La barra y su espacio: sin el padding, tapa el final del pie */
    body{padding-bottom:72px;}
    .barra{display:flex;gap:var(--esp-12);position:fixed;left:0;right:0;bottom:0;z-index:10;background:var(--blanco);border-top:1px solid var(--borde);padding:var(--esp-12) var(--esp-16);}
    .barra .btn{padding:0;}
    .barra .btn-primario{flex:2 1 0;}
    .barra .btn-secundario{flex:1 1 0;}
  }

  /* Páginas de texto (aviso de privacidad) */
  .legal{max-width:760px;}
  .legal h1{font-family:var(--tipo-titulo);font-weight:800;font-size:var(--t-titulo);line-height:var(--lh-titulo);margin-bottom:var(--esp-24);}
  .legal h2{font-family:var(--tipo-titulo);font-weight:700;font-size:var(--t-seccion);line-height:var(--lh-titulo);margin:var(--esp-32) 0 var(--esp-12);}
  .legal p+p{margin-top:var(--esp-12);}
  .legal ul{padding-left:var(--esp-24);margin-top:var(--esp-8);}
  .legal li+li{margin-top:var(--esp-4);}
  .legal .actualizacion{margin-top:var(--esp-48);}
  @media (max-width: 767px){
    body.sin-barra{padding-bottom:0;}
  }
