/* tuprotesis.com — sistema de diseño premium (DESIGN.md). Único CSS del proyecto.
   Paleta: azul profundo + azul eléctrico + blanco/negro. Portal de referencia. */

/* ===== Tokens ===== */
:root{
  /* Azules base */
  --azul-negro:#060B18;
  --azul-900:#0A1226;
  --azul-850:#0B1730;
  --azul-800:#0E1E3D;
  --azul-700:#123162;
  --primario:#1D4ED8;          /* enlaces / texto de marca (AA sobre blanco) */
  --primario-oscuro:#1E3A8A;
  --primario-fuerte:#2563EB;
  --electrico:#2B6BFF;         /* el acento que destaca (glows, bordes, degradados) */
  --electrico-claro:#4C8DFF;
  --cian:#38BDF8;              /* highlight decorativo */
  --primario-suave:#EAF0FF;    /* fondos de respuesta-corta y factbox */
  --primario-suave-borde:#CFDCFB;

  /* Acento de acción = azul eléctrico (compat: se conservan nombres de clase) */
  --color-acento:#1D4ED8;
  --color-acento-claro:#2B6BFF;

  /* Superficies claras */
  --color-fondo:#F4F7FD;
  --color-superficie:#FFFFFF;
  --color-superficie-2:#F8FAFF;
  --color-borde:#E4E9F5;
  --color-borde-fuerte:#D2DBEF;

  /* Tinta */
  --color-tinta:#0B1524;
  --color-tinta-suave:#54617C;

  /* Sobre oscuro */
  --sobre-oscuro:#EAF0FE;
  --sobre-oscuro-suave:#A9BBDE;

  /* Estados */
  --color-exito:#12805C;
  --color-aviso:#B7791F;
  --color-error:#D1332D;
  --color-pro:#0B1730;

  /* Compat tokens antiguos */
  --color-primario:var(--primario);
  --color-primario-oscuro:var(--primario-oscuro);
  --color-primario-suave:var(--primario-suave);

  --radio:14px;
  --radio-sm:10px;
  --radio-lg:22px;
  --sombra:0 1px 2px rgb(11 21 36 / .06), 0 6px 16px -8px rgb(11 21 36 / .12);
  --sombra-md:0 4px 10px -4px rgb(11 21 36 / .12), 0 18px 40px -20px rgb(16 42 92 / .28);
  --sombra-electrica:0 10px 34px -10px rgb(43 107 255 / .55);
  --anillo:0 0 0 3px rgb(43 107 255 / .30);

  --fuente-display:"Space Grotesk","Inter",system-ui,sans-serif;
  --fuente-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fuente-serif:var(--fuente-display); /* compat: headings ahora display sans */
  --grad-electrico:linear-gradient(135deg,#2B6BFF 0%,#1D4ED8 60%,#1E3A8A 100%);
  --grad-oscuro:linear-gradient(160deg,#0C1A38 0%,#0A1226 55%,#070D1C 100%);
  --ancho-max:1200px;
  --ancho-lectura:70ch;
}

/* ===== Reset ligero ===== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--color-fondo);color:var(--color-tinta);
  font-family:var(--fuente-sans);font-size:15px;line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media(min-width:720px){body{font-size:16px}}
img,svg{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--fuente-display);line-height:1.14;color:var(--color-tinta);
  margin:0 0 .5em;font-weight:700;letter-spacing:-.022em}
h1{font-size:clamp(30px,5.2vw,50px);letter-spacing:-.03em}
h2{font-size:clamp(23px,3.2vw,32px)}
h3{font-size:clamp(18px,2.4vw,22px)}
p{margin:0 0 1em}
a{color:var(--primario);text-decoration:none;text-underline-offset:3px;
  transition:color .15s ease}
a:hover{color:var(--primario-fuerte);text-decoration:underline}
strong{font-weight:600}
:focus-visible{outline:none;box-shadow:var(--anillo);border-radius:6px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
table{border-collapse:collapse}
button{font:inherit}
::selection{background:rgb(43 107 255 / .22)}

/* ===== Estructura ===== */
.contenedor{max-width:var(--ancho-max);margin:0 auto;padding:0 20px}
.prosa{max-width:var(--ancho-lectura)}
.prosa h2{margin-top:1.6em}
.prosa p,.prosa li{color:#26324a}
.salto-contenido{position:absolute;left:-9999px;top:0;background:var(--color-superficie);
  padding:12px 16px;z-index:100;border-radius:0 0 var(--radio-sm) 0;box-shadow:var(--sombra-md)}
.salto-contenido:focus{left:0}

/* ===== Header (glass) ===== */
.cabecera{position:sticky;top:0;z-index:40;background:rgb(255 255 255 / .82);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--color-borde)}
.cabecera__inner{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:12px 20px;
  max-width:var(--ancho-max);margin:0 auto}
.logo{font-family:var(--fuente-display);font-size:23px;font-weight:700;color:var(--color-tinta);
  text-decoration:none;letter-spacing:-.04em;display:inline-flex;align-items:center;gap:2px}
.logo:hover{text-decoration:none;color:var(--color-tinta)}
.logo span{background:var(--grad-electrico);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--primario-fuerte)}
.logo::before{content:"";width:11px;height:11px;margin-right:7px;border-radius:3px;
  background:var(--grad-electrico);box-shadow:var(--sombra-electrica);transform:rotate(45deg)}
.nav-principal{margin-left:auto}
.nav-principal ul{display:flex;gap:2px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav-principal a{display:block;padding:8px 12px;border-radius:9px;text-decoration:none;
  color:#33405c;font-size:14px;font-weight:500;transition:background .15s,color .15s}
.nav-principal a:hover,.nav-principal a[aria-current="page"]{background:var(--primario-suave);
  color:var(--primario-oscuro);text-decoration:none}
.cabecera__cta{white-space:nowrap}

/* ===== Footer (oscuro) ===== */
.pie{background:var(--grad-oscuro);color:var(--sobre-oscuro);margin-top:80px;
  padding:56px 0 28px;font-size:14px;position:relative;overflow:hidden}
.pie::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;
  background:linear-gradient(90deg,transparent,rgb(43 107 255 / .6),transparent)}
.pie a{color:var(--sobre-oscuro-suave)}
.pie a:hover{color:#fff}
.pie__cols{display:grid;gap:28px;grid-template-columns:1fr;max-width:var(--ancho-max);margin:0 auto;padding:0 20px}
@media(min-width:720px){.pie__cols{grid-template-columns:2fr 1fr 1fr 1fr}}
.pie h2{color:#fff;font-size:15px;font-family:var(--fuente-sans);font-weight:600;letter-spacing:0;
  text-transform:uppercase;opacity:.75;font-size:12.5px;letter-spacing:.06em}
.pie ul{list-style:none;margin:0;padding:0}
.pie li{margin:0 0 9px}
.pie__legal{border-top:1px solid rgb(255 255 255 / .12);margin-top:32px;padding-top:18px;
  color:var(--sobre-oscuro-suave);font-size:13px;max-width:var(--ancho-max);margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}

/* ===== Componentes ===== */
/* 1. Botones */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 22px;border-radius:12px;border:1px solid transparent;
  font-weight:600;font-size:15px;line-height:1;text-decoration:none;cursor:pointer;text-align:center;
  transition:transform .16s ease,box-shadow .2s ease,background .2s ease;will-change:transform}
.btn:hover{text-decoration:none;transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--primario{background:var(--grad-electrico);color:#fff;box-shadow:var(--sombra-electrica)}
.btn--primario:hover{color:#fff;box-shadow:0 14px 40px -8px rgb(43 107 255 / .7)}
.btn--secundario{background:var(--azul-800);color:#fff;border-color:rgb(255 255 255 / .06)}
.btn--secundario:hover{background:var(--azul-700);color:#fff}
.btn--fantasma{background:#fff;color:var(--primario);border-color:var(--color-borde-fuerte)}
.btn--fantasma:hover{background:var(--primario-suave);border-color:var(--primario-suave-borde);color:var(--primario-oscuro)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
/* Botones sobre fondos oscuros (hero) */
.hero .btn--fantasma{background:rgb(255 255 255 / .06);color:#fff;
  border-color:rgb(255 255 255 / .22);backdrop-filter:blur(6px)}
.hero .btn--fantasma:hover{background:rgb(255 255 255 / .14);color:#fff}

/* 2. Chips */
.chip{display:inline-flex;align-items:center;padding:4px 12px;border-radius:999px;
  background:var(--primario-suave);color:var(--primario-oscuro);font-size:13px;font-weight:600;
  margin:0 6px 6px 0;border:1px solid var(--primario-suave-borde)}

/* 3. Badges */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 11px;border-radius:7px;
  font-size:12.5px;font-weight:700;letter-spacing:.01em;line-height:1.4}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.85}
.badge--verificado{background:#DEF4EA;color:#136647}
.badge--declarado{background:#EEF1F7;color:#4a566f}
.badge--descatalogado{background:#FBEBD6;color:#8a5310}
.badge--demo{background:#E7EDFF;color:#2144b8}

/* 4. Card */
.card{background:var(--color-superficie);border:1px solid var(--color-borde);border-radius:var(--radio);
  box-shadow:var(--sombra);padding:22px;position:relative;overflow:hidden;
  transition:transform .18s ease,box-shadow .22s ease,border-color .18s ease}
.card::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;
  background:var(--grad-electrico);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--sombra-md);border-color:var(--primario-suave-borde)}
.card:hover::before{transform:scaleX(1)}
.card h3{margin-top:0}
.card h3 a{color:var(--color-tinta)}
.card h3 a:hover{color:var(--primario);text-decoration:none}
.card__meta{color:var(--color-tinta-suave);font-size:14px}
.grid-cards{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:640px){.grid-cards{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.grid-cards{grid-template-columns:repeat(3,1fr)}}

/* 5. Tabla de datos */
.tabla-datos{width:100%;background:var(--color-superficie);border:1px solid var(--color-borde);
  border-radius:var(--radio);overflow:hidden;font-variant-numeric:tabular-nums;font-size:14.5px;box-shadow:var(--sombra)}
.tabla-datos caption{text-align:left;font-weight:700;padding:14px 16px;
  background:var(--azul-800);color:#fff;caption-side:top;font-family:var(--fuente-display);letter-spacing:-.01em}
.tabla-datos th,.tabla-datos td{padding:11px 16px;text-align:left;border-top:1px solid var(--color-borde)}
.tabla-datos thead th{background:var(--color-superficie-2);border-top:0;font-family:var(--fuente-sans);
  font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--color-tinta-suave)}
.tabla-datos tbody tr:hover{background:var(--primario-suave)}
.tabla-datos .tabla-datos__fuente td{color:var(--color-tinta-suave);font-size:13px;background:var(--color-superficie-2)}
.tabla-envoltorio{overflow-x:auto;border-radius:var(--radio)}

/* 6. Factbox */
.factbox{background:linear-gradient(180deg,#fff, var(--primario-suave));
  border:1px solid var(--primario-suave-borde);border-radius:var(--radio);
  padding:20px 22px;box-shadow:var(--sombra)}
.factbox h2,.factbox h3{margin-top:0;font-size:17px;font-family:var(--fuente-display);font-weight:700;
  color:var(--primario-oscuro)}
.factbox dl{margin:0;display:grid;grid-template-columns:1fr;gap:8px}
@media(min-width:600px){.factbox dl{grid-template-columns:auto 1fr;column-gap:18px}}
.factbox dt{font-weight:600;color:#2a3853}
.factbox dd{margin:0}
.factbox__fuente{font-size:13px;color:var(--color-tinta-suave);margin-top:12px}

/* 7. Respuesta corta — ELEMENTO FIRMA */
.respuesta-corta{position:relative;background:linear-gradient(120deg,var(--primario-suave),#fff);
  border:1px solid var(--primario-suave-borde);border-left:4px solid var(--electrico);
  border-radius:0 var(--radio) var(--radio) 0;
  padding:20px 24px 20px 52px;margin:20px 0 28px;max-width:var(--ancho-lectura);box-shadow:var(--sombra)}
.respuesta-corta::before{content:"\201C";position:absolute;left:16px;top:10px;
  font-family:var(--fuente-display);font-size:42px;line-height:1;
  background:var(--grad-electrico);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.respuesta-corta p{margin:0;font-size:17px;line-height:1.55}
.respuesta-corta strong{color:var(--primario-oscuro)}

/* 8. FAQ */
details.faq{background:var(--color-superficie);border:1px solid var(--color-borde);
  border-radius:var(--radio-sm);margin:0 0 12px;padding:0;transition:border-color .18s,box-shadow .18s}
details.faq[open]{border-color:var(--primario-suave-borde);box-shadow:var(--sombra)}
details.faq summary{cursor:pointer;font-weight:600;padding:16px 48px 16px 18px;list-style:none;position:relative}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);
  color:#fff;background:var(--grad-electrico);width:26px;height:26px;border-radius:8px;
  display:grid;place-items:center;font-size:18px;line-height:1;box-shadow:var(--sombra-electrica)}
details.faq[open] summary::after{content:"\2212"}
details.faq .faq__cuerpo{padding:0 18px 16px;color:#26324a}

/* 9. Migas */
.migas{font-size:13.5px;color:var(--color-tinta-suave);margin:18px 0}
.migas ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0}
.migas li+li::before{content:"\203A";margin:0 8px;color:var(--color-borde-fuerte)}
.migas a{color:var(--color-tinta-suave)}
.migas a:hover{color:var(--primario)}
.migas [aria-current="page"]{color:var(--color-tinta);font-weight:600}

/* 10. Banner de alerta */
.banner-alerta{display:flex;gap:12px;align-items:flex-start;border-radius:var(--radio);
  padding:16px 18px;margin:0 0 18px;border:1px solid;box-shadow:var(--sombra)}
.banner-alerta strong{display:block}
.banner-alerta--informativa{background:#EAF0FF;border-color:var(--primario-suave-borde);color:#1a3a8f}
.banner-alerta--importante{background:#FBF3E2;border-color:#E5CD9A;color:#6E4A0F}
.banner-alerta--urgente{background:#FBE9E8;border-color:#E7B3B0;color:#8a231e}

/* 11. Formularios */
.campo{margin:0 0 18px;max-width:540px}
.campo label{display:block;font-weight:600;margin-bottom:7px}
.campo input,.campo select,.campo textarea{width:100%;padding:12px 14px;border:1px solid var(--color-borde-fuerte);
  border-radius:11px;background:var(--color-superficie);font:inherit;color:var(--color-tinta);transition:border-color .15s,box-shadow .15s}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--electrico);outline:none;box-shadow:var(--anillo)}
.campo--error input,.campo--error select,.campo--error textarea{border-color:var(--color-error)}
.campo__ayuda{font-size:13px;color:var(--color-tinta-suave);margin-top:5px}
.campo__error{font-size:13.5px;color:var(--color-error);margin-top:5px;font-weight:600}

/* 12. Barra pro */
.barra-pro{background:var(--grad-oscuro);color:var(--sobre-oscuro);font-size:14px;padding:9px 16px;text-align:center;
  border-bottom:1px solid rgb(43 107 255 / .3)}
.barra-pro a{color:#fff;text-decoration:underline}

/* 13. Paginación */
.paginacion ul{display:flex;gap:6px;list-style:none;margin:28px 0;padding:0;flex-wrap:wrap}
.paginacion a,.paginacion [aria-current="page"]{display:block;min-width:42px;text-align:center;
  padding:9px 12px;border:1px solid var(--color-borde-fuerte);border-radius:10px;text-decoration:none;
  background:var(--color-superficie);font-weight:600}
.paginacion a:hover{border-color:var(--electrico);color:var(--primario)}
.paginacion [aria-current="page"]{background:var(--grad-electrico);color:#fff;border-color:transparent;box-shadow:var(--sombra-electrica)}

/* ===== Hero / secciones ===== */
.hero{position:relative;overflow:hidden;background:var(--grad-oscuro);color:var(--sobre-oscuro);
  border-radius:var(--radio-lg);padding:64px 40px 56px;margin:24px auto 8px;
  box-shadow:var(--sombra-md);isolation:isolate}
.hero::before{content:"";position:absolute;z-index:-1;inset:-40% -20% auto auto;width:70%;height:120%;
  background:radial-gradient(closest-side,rgb(43 107 255 / .5),transparent 70%);filter:blur(10px)}
.hero::after{content:"";position:absolute;z-index:-1;inset:auto auto -50% -15%;width:55%;height:110%;
  background:radial-gradient(closest-side,rgb(56 189 248 / .28),transparent 70%)}
.hero h1{color:#fff;max-width:19ch}
.hero h1 .destello{background:linear-gradient(120deg,#8fc0ff,#38BDF8);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent}
.hero p,.hero__sub{color:var(--sobre-oscuro-suave)}
.hero__sub{font-size:clamp(16px,2.1vw,20px);max-width:58ch;line-height:1.55}
.hero .migas,.hero .migas a{color:rgb(233 240 254 / .72)}
.hero .migas [aria-current="page"]{color:#fff}
.hero .respuesta-corta{background:rgb(255 255 255 / .06);border-color:rgb(255 255 255 / .14);
  border-left-color:var(--cian);box-shadow:none}
.hero .respuesta-corta p{color:#eaf0fe}
.hero .respuesta-corta strong{color:#fff}
/* patrón de rejilla sutil sobre el hero */
.hero{background-image:var(--grad-oscuro),
  linear-gradient(rgb(255 255 255 / .035) 1px,transparent 1px),
  linear-gradient(90deg,rgb(255 255 255 / .035) 1px,transparent 1px);
  background-size:auto,44px 44px,44px 44px}

.seccion{padding:44px 0}
.seccion--alterna{background:var(--color-superficie);border-top:1px solid var(--color-borde);
  border-bottom:1px solid var(--color-borde)}
.encabezado-seccion{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:4px}
.encabezado-seccion h2{position:relative;padding-left:16px}
.encabezado-seccion h2::before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:5px;
  border-radius:4px;background:var(--grad-electrico)}
.encabezado-seccion a{font-weight:600}

/* ===== Utilidades (escala 4px) ===== */
.u-mt-8{margin-top:8px}.u-mt-16{margin-top:16px}.u-mt-24{margin-top:24px}.u-mt-32{margin-top:32px}
.u-mt-48{margin-top:48px}.u-mb-8{margin-bottom:8px}.u-mb-16{margin-bottom:16px}.u-mb-24{margin-bottom:24px}
.u-texto-suave{color:var(--color-tinta-suave)}
.u-centrado{text-align:center}
.u-oculto-visual{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Impresión */
@media print{.cabecera,.pie,.barra-pro,.salto-contenido{display:none}body{background:#fff}
  .hero{background:#fff;color:#000;box-shadow:none}.hero h1,.hero p{color:#000}}
.logo--pie{color:#fff}
.logo--pie::before{background:var(--grad-electrico)}
.logo--pie span{-webkit-text-fill-color:#7fb0ff;color:#7fb0ff}

/* ===== Admin (back office: azul sobrio, denso) ===== */
.admin-cuerpo{background:#EEF2FA}
.admin-top{background:var(--grad-oscuro);color:#fff;padding:12px 18px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;
  border-bottom:1px solid rgb(43 107 255 / .3)}
.admin-top a{color:var(--sobre-oscuro-suave);text-decoration:none;font-size:14px}
.admin-top a:hover{color:#fff}
.admin-top .logo{color:#fff;font-size:19px}
.admin-top .logo span{-webkit-text-fill-color:#7fb0ff;color:#7fb0ff}
.admin-main{max-width:1200px;margin:26px auto;padding:0 18px}
.admin-panel{background:#fff;border:1px solid var(--color-borde);border-radius:var(--radio);padding:22px;margin-bottom:22px;box-shadow:var(--sombra)}
.admin-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.admin-kpi{background:linear-gradient(160deg,#fff,var(--color-superficie-2));border:1px solid var(--color-borde);
  border-radius:var(--radio);padding:18px;position:relative;overflow:hidden}
.admin-kpi::after{content:"";position:absolute;right:-20px;top:-20px;width:64px;height:64px;border-radius:50%;
  background:radial-gradient(closest-side,rgb(43 107 255 / .16),transparent)}
.admin-kpi b{font-size:28px;display:block;font-family:var(--fuente-display);color:var(--primario-oscuro);letter-spacing:-.02em}
.admin-tabla{width:100%;font-size:14px;background:#fff}
.admin-tabla th,.admin-tabla td{padding:9px 12px;border-bottom:1px solid var(--color-borde);text-align:left;vertical-align:top}
.admin-tabla thead th{font-size:12.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--color-tinta-suave)}
.admin-form{display:grid;gap:0 22px;grid-template-columns:1fr}
@media(min-width:900px){.admin-form{grid-template-columns:1fr 1fr}.admin-form .campo--ancho{grid-column:1/-1}}
.fila-repetible{display:flex;gap:8px;margin-bottom:8px;align-items:flex-start}
.fila-repetible input,.fila-repetible textarea{flex:1}
.admin-acciones{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:8px}
.btn--peligro{background:var(--color-error);color:#fff}
.btn--peligro:hover{background:#a82823;color:#fff}
.btn--mini{padding:7px 12px;font-size:13px;border-radius:9px}
.aviso-flash{border-radius:11px;padding:12px 16px;margin-bottom:18px;font-size:14.5px;border:1px solid}
.aviso-flash--ok{background:#DEF4EA;color:#136647;border-color:#AEE2C9}
.aviso-flash--error{background:#FBE9E8;color:#8a231e;border-color:#F0C3C0}

.asistente-flotante{position:fixed;right:18px;bottom:18px;z-index:60;background:var(--grad-electrico);color:#fff;
padding:10px 16px;border-radius:999px;font-weight:700;font-size:14px;text-decoration:none;
box-shadow:0 8px 24px -8px rgba(29,78,216,.55)}
.asistente-flotante:hover{filter:brightness(1.08);text-decoration:none}
@media print{.asistente-flotante{display:none}}
