/* Herramientas gratis de laIA food (automatiza.vip/herramientas).
   Outfit en logo y titulares, Inter en el texto; tinta casi negra y el degradado del «IA». */
:root{
  /* laIA food: tinta casi negra, degradado azul → violeta → magenta del «IA».
     --verde se conserva de nombre (lo usan todas las páginas) y ahora es el violeta de acento. */
  --tinta:#0E1022; --tinta2:#23264A; --verde:#5B3DF5; --gris:#565B70; --gris2:#6C7088;
  --papel:#FAFAFD; --suave:#F3F3FA; --linea:#E3E2EE; --linea2:#EDEDF5; --blanco:#fff;
  --ok:#2F6B3A; --okfondo:#EAF3EA; --aviso:#8A5A00; --avisofondo:#FFF6E0;
  --mal:#A3261C; --malfondo:#FBECEA;
  --ia:linear-gradient(100deg,#1668FF 0%,#5A4BFF 48%,#C83CF6 100%);
  --r:14px; --sombra:0 24px 60px -32px rgba(35,28,110,.22);
  --titulo:'Outfit','Inter',ui-sans-serif,system-ui,sans-serif;
}
*{box-sizing:border-box}
html{font-family:'Inter',ui-sans-serif,system-ui,sans-serif;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--tinta);line-height:1.5;font-size:16px}
a{color:var(--verde)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--verde);outline-offset:2px}
.tnum{font-variant-numeric:tabular-nums}
.envoltura{max-width:1120px;margin:0 auto;padding:0 20px}

/* Barra */
.barra{position:sticky;top:0;z-index:20;background:rgba(250,250,253,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--linea2)}
.barra .envoltura{display:flex;align-items:center;justify-content:space-between;height:60px;gap:12px}
.marca{display:inline-flex;align-items:baseline;gap:10px;color:var(--tinta);text-decoration:none}
.logo{font-family:var(--titulo);font-weight:600;font-size:23px;letter-spacing:-.03em;line-height:1;display:inline-flex;align-items:baseline;color:var(--tinta)}
.logo b{font-weight:600;background:var(--ia);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:1.14em;letter-spacing:-.02em;padding-right:.02em}
.logo .ola{width:.95em;height:.5em;margin:0 .06em 0 .04em;align-self:center;transform:translateY(.02em)}
.marca-sub{font-size:14px;font-weight:500;color:var(--gris2);border-left:1px solid var(--linea);padding-left:10px}
@media(max-width:400px){.marca-sub{display:none}}
.barra nav{display:flex;gap:6px;align-items:center}
.barra nav a{font-size:14px;text-decoration:none;color:var(--gris);padding:8px 10px;border-radius:8px}
.barra nav a:hover{background:var(--suave);color:var(--tinta)}
.barra nav a.cta{background:var(--tinta);color:#fff}
.barra nav a.cta:hover{background:var(--tinta2)}
@media(max-width:560px){.barra nav a.oc{display:none}}

/* Cabecera de herramienta */
.cabeza{padding:40px 0 24px}
.antetitulo{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--verde);margin:0 0 10px}
h1{font-family:var(--titulo);font-size:clamp(32px,6.2vw,56px);line-height:1.04;letter-spacing:-.03em;font-weight:600;margin:0 0 14px;max-width:18ch}
.entradilla{font-size:18px;color:var(--gris);margin:0;max-width:60ch}
h2{font-family:var(--titulo);font-size:21px;font-weight:600;letter-spacing:-.015em;margin:0 0 4px}
.ia{background:var(--ia);-webkit-background-clip:text;background-clip:text;color:transparent}
.nota{font-size:13px;color:var(--gris2)}

/* Piezas */
.panel{background:var(--blanco);border:1px solid var(--linea2);border-radius:var(--r);box-shadow:var(--sombra)}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label,.etq{font-size:14px;font-weight:500;color:var(--tinta)}
.campo small{font-size:12.5px;color:var(--gris2)}
input,select,textarea{font:inherit;color:var(--tinta);background:#fff;border:1px solid var(--linea);border-radius:10px;padding:10px 12px;min-height:44px;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--verde)}
input[type=number]{font-variant-numeric:tabular-nums}
textarea{min-height:90px;resize:vertical}
.btn{font:inherit;font-size:15px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:10px;border:1px solid var(--linea);background:#fff;color:var(--tinta);cursor:pointer;text-decoration:none;transition:background .14s,border-color .14s}
.btn:hover{background:var(--suave)}
.btn.primario{background:var(--tinta);border-color:var(--tinta);color:#fff}
.btn.ia-btn{background:var(--ia);border:0;color:#fff}
.btn.primario:hover{background:var(--tinta2)}
.btn.fantasma{border-color:transparent;background:transparent;color:var(--verde);padding-left:8px;padding-right:8px}
.btn.fantasma:hover{background:var(--suave)}
.btn.peq{min-height:40px;padding:6px 12px;font-size:14px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.icono{width:18px;height:18px;flex:none}

/* Tarjeta de LIA al final del resultado */
.lia{margin:28px 0 0;background:radial-gradient(90% 140% at 100% 0%,rgba(200,60,246,.34),transparent 58%),radial-gradient(80% 130% at 0% 100%,rgba(22,104,255,.32),transparent 62%),var(--tinta);color:#fff;border-radius:var(--r);padding:24px;display:grid;gap:14px}
.lia p{margin:0;color:#D9DBEA}
.lia strong{color:#fff}
.lia .titular{font-family:var(--titulo);font-size:22px;font-weight:600;color:#fff;letter-spacing:-.01em}
.lia .acciones{display:flex;flex-wrap:wrap;gap:10px}
.lia .btn{border-color:#fff;background:#fff;color:var(--tinta)}
.lia .btn:hover{background:#ECEBFA}
.lia .btn.sec{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.lia .btn.sec:hover{background:rgba(255,255,255,.08)}

/* Ventana del correo */
.velo{position:fixed;inset:0;background:rgba(14,16,34,.5);display:flex;align-items:flex-end;justify-content:center;z-index:100;padding:0}
@media(min-width:640px){.velo{align-items:center;padding:20px}}
.ventana{background:#fff;width:100%;max-width:460px;border-radius:18px 18px 0 0;padding:26px 22px calc(22px + env(safe-area-inset-bottom));box-shadow:0 30px 80px -20px rgba(0,0,0,.35);animation:sube .2s ease-out}
@media(min-width:640px){.ventana{border-radius:18px}}
@keyframes sube{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
.ventana h3{font-size:21px;font-weight:600;letter-spacing:-.01em;margin:0 0 6px}
.ventana p{margin:0 0 16px;color:var(--gris)}
.ventana form{display:grid;gap:12px}
.ventana .consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--gris)}
.ventana .consent input{width:18px;min-height:18px;height:18px;margin-top:2px;flex:none}
.ventana .error{color:var(--mal);font-size:13.5px;min-height:1em;margin:0}
.ventana .cerrar{float:right;border:0;background:none;font-size:24px;line-height:1;color:var(--gris2);cursor:pointer;padding:4px 8px;margin:-8px -8px 0 0}

.pie{border-top:1px solid var(--linea2);margin-top:56px;padding:24px 0 40px;font-size:13.5px;color:var(--gris2)}
.pie .envoltura{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}
.pie a{color:var(--gris);text-decoration:none}
.pie a:hover{text-decoration:underline}

@media(prefers-reduced-motion:reduce){.ventana{animation:none}*{transition:none!important}}

/* ---------- Motor de calculadoras (calc.js) ---------- */
.rejilla-c{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:900px){.rejilla-c{grid-template-columns:1.05fr .95fr;align-items:start}}
.datos-c{padding:22px;display:grid;gap:22px;min-width:0}
.grupo-c{border:0;margin:0;padding:0;display:grid;gap:14px;min-width:0}
.grupo-c legend{font-size:17px;font-weight:600;padding:0;margin-bottom:12px;letter-spacing:-.01em}
.rej-c{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:420px){.rej-c{grid-template-columns:1fr}}
.fila-c{display:grid;gap:8px}
.fila-c small{font-size:12.5px;color:var(--gris2)}
.cab-c{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.cab-c output{font-weight:600;font-size:17px;font-variant-numeric:tabular-nums;white-space:nowrap}
input[type=range]{padding:0;min-height:28px;border:0;accent-color:var(--verde);background:transparent}
.con-suf{position:relative;display:flex;align-items:center}
.con-suf input{padding-right:34px}
.con-suf span{position:absolute;right:12px;color:var(--gris2);font-size:14px;pointer-events:none}
.tabla-ed{display:grid;gap:6px;min-width:0}
.te-cab,.te-fila{display:grid;gap:6px;align-items:center}
.te-cab span{font-size:12px;color:var(--gris2);font-weight:500}
.te-fila input{min-height:40px;padding:8px 10px;font-size:15px;min-width:0}
.te-quitar{width:40px;height:40px;border:0;background:none;color:var(--gris2);font-size:20px;cursor:pointer;border-radius:8px}
.te-quitar:hover{background:var(--malfondo);color:var(--mal)}
.tabla-ed .btn{justify-self:start}
.res-c{padding:24px;position:sticky;top:80px;display:grid;gap:16px;min-width:0}
.res-c h2{margin:0}
.grande-c{font-family:var(--titulo);font-size:clamp(40px,8vw,64px);font-weight:600;letter-spacing:-.03em;line-height:1;margin:4px 0 0}
.grande-c.mal{color:var(--mal)}.grande-c.ok{color:var(--ok)}.grande-c.aviso{color:var(--aviso)}
.grande-t{margin:-6px 0 0;color:var(--gris);font-size:16px}
.cifras-c{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.cifras-c div{background:var(--suave);border-radius:12px;padding:14px}
.cifras-c b{display:block;font-size:22px;font-weight:600}
.cifras-c span{font-size:13px;color:var(--gris)}
.aviso-c{border-radius:12px;padding:14px 16px;font-size:15px;background:var(--suave)}
.aviso-c.ok{background:var(--okfondo);color:#1F4D29}.aviso-c.aviso{background:var(--avisofondo);color:#6B4700}.aviso-c.mal{background:var(--malfondo);color:#7A1C14}
.lineas-c{display:grid;gap:0}
.lineas-c div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--linea2);font-size:15px}
.lineas-c div:first-child{border-top:0}
.lineas-c .fuerte{font-weight:600}
.lineas-c b{font-weight:600;white-space:nowrap}
.tabla-c-w{overflow-x:auto}
.tabla-c{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.tabla-c th{text-align:left;font-weight:500;color:var(--gris2);font-size:12.5px;padding:6px 8px 6px 0;border-bottom:1px solid var(--linea)}
.tabla-c td{padding:8px 8px 8px 0;border-bottom:1px solid var(--linea2)}
.acciones-res{display:flex;flex-wrap:wrap;gap:10px}
.explica{margin-top:36px;display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:760px){.explica{grid-template-columns:repeat(3,1fr)}}
.explica>div{padding:20px}
.explica h3{margin:0 0 6px;font-size:16px;font-weight:600}
.explica p{margin:0;color:var(--gris);font-size:15px}

/* Otras herramientas */
.otras{margin-top:36px}
.otras h2{font-size:17px;margin-bottom:12px}
.otras-lista{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:760px){.otras-lista{grid-template-columns:repeat(3,1fr)}}
.otras-lista a{display:block;padding:16px 18px;text-decoration:none;color:var(--tinta)}
.otras-lista a b{display:block;font-weight:600;margin-bottom:4px}
.otras-lista a span{font-size:14px;color:var(--gris)}
.otras-lista a:hover b{color:var(--verde)}

/* Informe imprimible común */
#informe{display:none}
@media print{
  body>*:not(#informe){display:none!important}
  body{background:#fff}
  #informe{display:block;padding:8mm;font-size:11pt;color:#000}
  #informe h1{font-size:22pt;max-width:none;margin:0 0 3mm}
  #informe h2{font-size:13pt;margin:6mm 0 2mm}
  #informe .fecha{color:#555;margin:0 0 5mm}
  #informe table{width:100%;border-collapse:collapse;margin:2mm 0}
  #informe td,#informe th{border-bottom:1px solid #ccc;padding:6px 4px;text-align:left}
  #informe td:last-child{text-align:right}
  #informe .pie-i{margin-top:10mm;font-size:9pt;color:#666;border-top:1px solid #ccc;padding-top:3mm}
  @page{margin:10mm}
}
@media(max-width:899px){.res-c{position:static}}

[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Franja de guardado bajo la cabecera */
.franja{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;justify-content:center;padding:8px 16px;font-size:13.5px;background:var(--suave);color:var(--gris);border-bottom:1px solid var(--linea2);text-align:center}
.franja b{color:var(--tinta);font-weight:600}
.franja a{color:var(--verde);font-weight:500;text-decoration:none;white-space:nowrap}
.franja a:hover{text-decoration:underline}
.franja.ok{background:#EFF6F0}
.franja.aviso{background:var(--avisofondo)}
@media print{.franja{display:none!important}}

/* Barra fija de resultado en móvil (calc.js) */
.barra-res{display:none}
@media(max-width:899px){
  .barra-res{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--tinta);color:#fff;box-shadow:0 -10px 30px -12px rgba(0,0,0,.35);transition:transform .2s}
  .barra-res span{font-size:13px;color:#C9CCE0;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .barra-res b{font-family:var(--titulo);font-size:20px;font-weight:600;white-space:nowrap}
  .barra-res b.mal{color:#FF9C92}.barra-res b.ok{color:#9BE3AE}
  .barra-res button{font:inherit;font-size:14px;font-weight:500;background:#fff;color:var(--tinta);border:0;border-radius:8px;min-height:40px;padding:6px 14px}
  .barra-res.oculta{transform:translateY(110%)}
  body.con-barra-res{padding-bottom:70px}
}
@media print{.barra-res{display:none!important}}
@media(prefers-reduced-motion:reduce){.barra-res{transition:none}}

/* Caja «Guárdalo gratis» */
.guardar-f{display:grid;gap:12px}
.guardar-ok{padding:14px 16px;border-radius:12px;background:var(--okfondo);color:#1F4D29}
.guardar-ok a{font-weight:600}
.error{color:var(--mal);font-size:14px;min-height:1em;margin:0}

/* casilla de consentimiento (global) */
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--gris);line-height:1.4}
.consent input{width:18px;height:18px;min-height:18px;margin:2px 0 0;padding:0;flex:none;accent-color:var(--verde)}

/* ---------- Revisión responsive 29-09 ---------- */
.barra nav{gap:4px}
.barra nav a{display:inline-flex;align-items:center;min-height:44px}
.marca{min-height:44px;align-items:center}
@media(max-width:380px){
  .barra .envoltura{padding:0 12px;gap:8px}
  .barra nav a{padding:8px 8px;font-size:13.5px}
  .logo{font-size:21px}
}
.franja a{display:inline-flex;align-items:center;min-height:40px}
summary{padding-top:10px;padding-bottom:10px}
.consent{min-height:40px;align-items:center;padding:4px 0}
.consent input{margin-top:0}
/* Ventana de registro: cabe siempre y se desplaza si hace falta (móvil, apaisado) */
.velo{overflow-y:auto;-webkit-overflow-scrolling:touch}
.ventana{max-height:calc(100dvh - 12px);overflow-y:auto;margin:auto 0 0}
@media(min-width:640px){.ventana{margin:auto}}
@media(max-height:500px){.velo{align-items:flex-start;padding:6px}.ventana{border-radius:14px;padding:18px 18px 16px}.ventana h3{font-size:18px}.ventana p{margin-bottom:10px}.guardar-f{gap:8px}}

@media(max-width:380px){body.con-barra-res{padding-bottom:84px}}
