/* Turno24 — estilos de la web. Colores y tipografías de la marca. */
@font-face{font-family:"Inter";src:url("fonts/inter-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url("fonts/inter-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter";src:url("fonts/inter-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url("fonts/space-grotesk-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url("fonts/space-grotesk-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url("fonts/space-grotesk-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}

:root{
  --noche:#0B1220; --noche-2:#131D31; --linea-oscura:#2A3650;
  --senal:#C8F04B; --papel:#F5F4EF; --pizarra:#5B6475; --linea:#DEDCD3;
  --texto-suave-oscuro:#B9C0CC; --blanco:#FFFFFF;
  --titulos:"Space Grotesk",system-ui,sans-serif; --texto:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--texto);color:var(--noche);background:var(--papel);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
img,svg{display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--titulos);letter-spacing:-0.02em;margin:0}
h2{font-size:clamp(32px,4vw,44px);font-weight:600;line-height:1.1}
p{margin:0}
.muted{color:var(--pizarra)}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:14px 24px;border-radius:999px;font-weight:600;font-size:17px;text-decoration:none;border:1px solid transparent;cursor:pointer}
.btn-senal{background:var(--senal);color:var(--noche)}
.btn-senal:hover{filter:brightness(0.95)}
.btn-borde-claro{border-color:#3A4762;color:var(--blanco)}
.btn-borde{border-color:var(--noche);color:var(--noche)}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--senal);outline-offset:3px}

/* Cabecera y portada */
.oscuro{background:var(--noche);color:var(--blanco)}
.nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:20px;padding-bottom:20px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--titulos);font-size:24px;font-weight:600;letter-spacing:-0.02em}
.logo em{font-style:normal;color:var(--senal)}
.nav-links{display:flex;flex-wrap:wrap;align-items:center;gap:24px;font-size:15px}
.nav-links a{color:#D5DAE2;text-decoration:none}
.nav-links a:hover{color:var(--blanco)}
.nav-links .btn{font-size:15px;min-height:44px;padding:10px 18px;color:var(--noche)}
.hero{display:flex;flex-wrap:wrap;align-items:center;gap:56px;padding-top:56px;padding-bottom:96px}
.hero-texto{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:24px}
.etiqueta{align-self:flex-start;border:1px solid var(--linea-oscura);color:var(--senal);font-size:14px;font-weight:500;padding:8px 14px;border-radius:999px}
.hero h1{font-size:clamp(42px,6vw,64px);line-height:1.02;font-weight:600;letter-spacing:-0.03em}
.hero-sub{font-size:20px;color:var(--texto-suave-oscuro);max-width:560px}
.botones{display:flex;flex-wrap:wrap;gap:12px}
.garantias{display:flex;flex-wrap:wrap;gap:24px;font-size:15px;color:var(--texto-suave-oscuro)}
.chat{flex:1 1 340px;min-width:0;background:var(--noche-2);border:1px solid var(--linea-oscura);border-radius:28px;padding:24px;display:flex;flex-direction:column;gap:12px}
.chat-cab{display:flex;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--linea-oscura)}
.avatar{width:40px;height:40px;border-radius:999px;background:var(--senal);color:var(--noche);display:flex;align-items:center;justify-content:center;font-weight:700;font-family:var(--titulos)}
.en-linea{font-size:13px;color:var(--senal)}
.burbuja{max-width:85%;padding:12px 14px;font-size:15px;line-height:1.45}
.burbuja.cliente{align-self:flex-end;background:var(--linea-oscura);border-radius:16px 16px 4px 16px}
.burbuja.ia{align-self:flex-start;background:var(--blanco);color:var(--noche);border-radius:16px 16px 16px 4px}
.chat-pie{font-size:13px;color:#8E98A9;text-align:center;margin-top:4px}

/* Secciones */
.seccion{padding-top:88px;padding-bottom:24px;display:flex;flex-direction:column;gap:36px}
.intro{display:flex;flex-direction:column;gap:12px;max-width:720px}
.intro p{font-size:18px;color:var(--pizarra)}
.rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.tarjeta{background:var(--blanco);border:1px solid var(--linea);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:12px}
.tarjeta h3{font-family:var(--texto);font-size:19px;font-weight:600;letter-spacing:0}
.tarjeta p{font-size:15px;color:var(--pizarra)}
.nota-ia{margin-top:16px;font-size:13px;color:var(--pizarra)}
.persona{display:flex;align-items:center;gap:14px}
.persona img{width:64px;height:64px;border-radius:999px;object-fit:cover;flex:none;box-shadow:0 0 0 3px var(--blanco),0 0 0 5px var(--senal)}
.persona-nombre{display:block;font-family:var(--titulos);font-size:14px;font-weight:600;color:var(--pizarra);letter-spacing:0}
.chat-pie{display:flex;align-items:center;justify-content:center;gap:8px}
.chat-pie img{width:24px;height:24px;border-radius:999px;object-fit:cover}
.ejemplo-casa{display:flex;align-items:center;gap:18px;margin-top:32px;padding:20px 24px;border-radius:20px;background:var(--noche);color:#D5DAE2;font-size:16px}
.ejemplo-casa strong{color:var(--senal)}
.ejemplo-casa img{width:72px;height:72px;border-radius:999px;object-fit:cover;flex:none;box-shadow:0 0 0 3px var(--senal)}
.paso{border-top:2px solid var(--noche);padding-top:20px;display:flex;flex-direction:column;gap:8px}
.paso.ultimo{border-top-color:var(--senal)}
.paso .num{font-family:var(--titulos);font-size:15px;font-weight:600;color:var(--pizarra)}
.paso h3{font-family:var(--texto);font-size:20px;font-weight:600;letter-spacing:0}
.paso p{font-size:15px;color:var(--pizarra)}

/* Precios */
.precios-cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.selector{display:flex;flex-wrap:wrap;gap:4px;background:var(--blanco);border:1px solid var(--linea);border-radius:999px;padding:4px}
.selector button{border:0;cursor:pointer;font:600 15px var(--texto);padding:12px 18px;min-height:44px;border-radius:999px;background:transparent;color:var(--noche)}
.selector button[aria-pressed="true"]{background:var(--noche);color:var(--blanco)}
.selector small{font-weight:500;opacity:.8}
.packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px}
.pack{background:var(--blanco);border:1px solid var(--linea);border-radius:24px;padding:32px;display:flex;flex-direction:column;gap:20px}
.pack.destacado{background:var(--noche);color:var(--blanco);border-color:var(--noche)}
.pack h3{font-size:26px;font-weight:600}
.pack .para{font-size:15px;color:var(--pizarra)}
.pack.destacado .para,.pack.destacado .detalle{color:var(--texto-suave-oscuro)}
.pack-titulo{display:flex;align-items:center;justify-content:space-between;gap:12px}
.chapa{background:var(--senal);color:var(--noche);font-size:13px;font-weight:600;padding:6px 10px;border-radius:999px}
.precio{display:flex;align-items:baseline;gap:6px}
.precio strong{font-family:var(--titulos);font-size:56px;font-weight:600;letter-spacing:-0.03em;line-height:1}
.detalle{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--pizarra)}
.separador{height:1px;background:var(--linea)}
.pack.destacado .separador{background:var(--linea-oscura)}
.pack ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px}
.pack li{padding-left:24px;position:relative}
.pack li::before{content:"";position:absolute;left:0;top:7px;width:12px;height:7px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
.nota{font-size:15px;color:var(--pizarra)}

/* Sectores y FAQ */
.chips{display:flex;flex-wrap:wrap;gap:12px}
.chips span{background:var(--blanco);border:1px solid var(--linea);padding:12px 18px;border-radius:999px;font-size:16px}
details.faq{background:var(--blanco);border:1px solid var(--linea);border-radius:20px;padding:20px 24px}
details.faq summary{cursor:pointer;font-weight:600;font-size:18px;list-style-position:outside}
details.faq p{margin-top:10px;font-size:15px;color:var(--pizarra)}
.faqs{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;align-items:start}

/* Cierre y pie */
.cierre{margin-top:96px}
.cierre-dentro{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px;padding-top:88px;padding-bottom:88px}
.cierre-dentro div{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:12px}
.cierre h2{font-size:clamp(34px,4.5vw,48px)}
.cierre p{font-size:18px;color:var(--texto-suave-oscuro)}
.pie{border-top:1px solid var(--linea-oscura);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px;padding-bottom:24px;font-size:14px;color:#8E98A9}
.pie a{color:#8E98A9}
.pie nav{display:flex;flex-wrap:wrap;gap:16px}

/* Páginas legales */
.legal{max-width:780px;margin:0 auto;padding:56px 24px 96px;display:flex;flex-direction:column;gap:16px}
.legal h1{font-size:40px;font-weight:600}
.legal h2{font-size:22px;margin-top:16px}
.legal p,.legal li{font-size:16px;color:#2B3342}
.aviso-relleno{background:#FFF7D6;border:1px solid #E9D98A;border-radius:12px;padding:12px 16px;font-size:14px}

@media (max-width:640px){
  .hero{padding-top:32px;padding-bottom:64px}
  .seccion{padding-top:64px}
  .pack{padding:24px}
}