/* =========================================================
   LoQuiero — Footer (Premium + Alta legibilidad · Identidad LoQuiero)
   Ubicación: /assets/css/footer/footer.css
   Regla: TODO SCOPED a #loq-footer
   Mejora: títulos + textos MUCHO más visibles (PRESENCIAL/ONLINE como pill)
   Mantiene: glass, sin sombras en imágenes, iconos premium
   ========================================================= */

/* =========================================================
   0) Variables / Tokens
   ========================================================= */
#loq-footer{
  /* base glass */
  --loq-footer-bg: rgba(28,28,30,0.44);
  --loq-footer-border: rgba(255,255,255,.10);

  /* legibilidad */
  --loq-footer-text: rgba(255,255,255,.94);
  --loq-footer-muted: rgba(226,232,240,.72);
  --loq-footer-dim: rgba(226,232,240,.55);

  /* brand LoQuiero */
  --loq-brand-indigo: #5D3CE6;
  --loq-brand-blue:   #4B74FF;
  --loq-brand-cyan:   #46E9FF;
  --loq-brand-ink:    #020617;

  --loq-accent: var(--loq-brand-cyan);
  --loq-accent-gradient: linear-gradient(
    90deg,
    rgba(70,233,255,1) 0%,
    rgba(75,116,255,1) 35%,
    rgba(93,60,230,1) 72%,
    rgba(70,233,255,1) 100%
  );

  /* layout */
  --loq-footer-pad-y: 46px;
  --loq-footer-gap: 26px;

  /* icon chips */
  --loq-ico-size: 38px;
  --loq-ico-bg: rgba(2,6,23,.55);
  --loq-ico-border: rgba(255,255,255,.14);

  /* inputs */
  --loq-field-bg: rgba(2,6,23,.55);
  --loq-field-border: rgba(255,255,255,.14);

  /* pills (PRESENCIAL/ONLINE) */
  --loq-pill-bg: rgba(2,6,23,.35);
  --loq-pill-border: rgba(255,255,255,.16);
}

/* =========================================================
   1) Base + Glass Dark (full width, sin radius)
   ========================================================= */
#loq-footer.site-footer{
  width:100%;
  max-width:none;
  margin:0;
  display:block;
  clear:both;
  position:relative;
  overflow:hidden;

  color: var(--loq-footer-text);
  font-family: inherit;

  background: var(--loq-footer-bg);
  backdrop-filter: blur(26px);
  -webkit-backdrop-filter: blur(26px);

  border-radius: 0;
  border-top: 1px solid var(--loq-footer-border);
  padding: var(--loq-footer-pad-y) 0;
}

/* top hairline brand */
#loq-footer.site-footer::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:2px;
  background: var(--loq-accent-gradient);
  opacity:.34;
  pointer-events:none;
}

#loq-footer .loq-footer-inner{
  position:relative;
  z-index:1;
}

/* Overlay lights */
#loq-footer .loq-footer__lights{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.22;
  background:
    radial-gradient(1100px 420px at 12% -12%, rgba(70,233,255,.40), transparent 60%),
    radial-gradient(900px 380px at 92% 0%, rgba(93,60,230,.28), transparent 58%),
    radial-gradient(900px 520px at 50% 120%, rgba(75,116,255,.20), transparent 62%);
}

/* Links */
#loq-footer a{
  color: inherit;
  text-decoration: none;
  transition: color .15s ease, opacity .15s ease, transform .15s ease, background-color .15s ease, border-color .15s ease;
}
#loq-footer a:hover{
  color: rgba(70,233,255,.95);
}

/* =========================================================
   2) Tipografía (Premium legible)
   ========================================================= */

/* TITULOS de columna: más notorios */
#loq-footer .lq-foot-title{
  margin:0 0 12px 0;
  font-weight: 850;
  letter-spacing: .01em;
  text-transform: none;
  font-size: 15px;                 /* 👈 más grande */
  color: rgba(255,255,255,.98);
}

/* KICKER: ahora es PILL (PRESENCIAL / ONLINE / etc) */
#loq-footer .lq-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 0 10px 0;

  padding: 6px 10px;
  border-radius: 999px;

  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;

  color: rgba(255,255,255,.78);
  background: var(--loq-pill-bg);
  border: 1px solid var(--loq-pill-border);

  /* borde con acento sutil */
  box-shadow: 0 0 0 1px rgba(93,60,230,.10) inset;
}

/* puntito de estado dentro del pill (si lo querés usando :before) */
#loq-footer .lq-kicker::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background: rgba(70,233,255,.85);
  box-shadow: 0 0 0 2px rgba(70,233,255,.16);
}

/* Texto normal: más peso/contraste */
#loq-footer .lq-text{
  margin:0;
  color: rgba(255,255,255,.92);
  line-height:1.55;
  font-size: 14px;
}

/* Texto muted: sube contraste (antes estaba muy apagado) */
#loq-footer .lq-text-muted{
  margin:0;
  color: var(--loq-footer-muted);
  line-height:1.55;
  font-size: 13px;
}

/* Destacados (horarios, dirección, etc) */
#loq-footer .lq-strong{
  font-weight: 800;
  color: rgba(255,255,255,.98);
}

/* Líneas tipo “Martes a Viernes” y horas: un poquito más grandes */
#loq-footer .lq-hrs .lq-text,
#loq-footer .lq-hrs .lq-text-muted{
  font-size: 14.5px;
}
#loq-footer .lq-hrs .lq-strong{
  font-size: 15.5px;
}

/* mini links */
#loq-footer .lq-mini{ margin-top: 10px; }

#loq-footer .lq-mini-link{
  font-size: 12px;
  font-weight: 750;
  color: rgba(226,232,240,.72);
}
#loq-footer .lq-mini-link:hover{
  color: rgba(70,233,255,.95);
  text-decoration: underline;
  text-underline-offset: 3px;
}

#loq-footer .lq-center{ text-align:center; }

#loq-footer .lq-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap: 10px;
}
#loq-footer .lq-item{ margin:0; }

/* =========================================================
   3) Grid principal
   ========================================================= */
#loq-footer .lq-footer-grid{
  display:grid;
  gap: var(--loq-footer-gap);
  grid-template-columns: 1fr;
  align-items:start;
}

@media (min-width: 768px){
  #loq-footer .lq-footer-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (min-width: 1024px){
  #loq-footer .lq-footer-grid{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

/* divisores desktop */
@media (min-width: 1024px){
  #loq-footer .lq-footer-grid .lq-col{
    padding-right:24px;
    margin-right:24px;
    border-right:1px solid rgba(255,255,255,.10);
  }
  #loq-footer .lq-footer-grid .lq-col:last-child{
    border-right:none;
    margin-right:0;
    padding-right:0;
  }
}

/* =========================================================
   4) Contact items + dots (premium)
   ========================================================= */
#loq-footer .contact-item{
  display:flex;
  align-items:flex-start;
  gap:10px;
}

/* si tenés un <span class="ico"> (svg/img) */
#loq-footer .contact-item .ico{
  width:18px;
  min-width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  opacity:.95;
}

/* dot limpio */
#loq-footer .lq-dot{
  width:18px;
  height:18px;
  border-radius:999px;
  background: rgba(70,233,255,.12);
  border: 1px solid rgba(255,255,255,.16);
}

/* =========================================================
   5) Social — ICONOS PREMIUM (chips)
   ========================================================= */
#loq-footer .lq-social-list{
  list-style:none;
  padding:0;
  margin: 10px 0 0;
  display:flex;
  gap: 12px;
  justify-content:flex-start;
  align-items:center;
}

#loq-footer .lq-social-list a{
  width: var(--loq-ico-size);
  height: var(--loq-ico-size);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  background: var(--loq-ico-bg);
  border: 1px solid var(--loq-ico-border);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

#loq-footer .lq-social-list a:hover{
  border-color: rgba(70,233,255,.45);
  transform: translateY(-1px);
}

/* IMÁGENES: SIN SHADOW */
#loq-footer .lq-social-list img{
  width:18px;
  height:18px;
  display:block;
  object-fit:contain;
  opacity:.94;
  filter: none !important;
}
#loq-footer .lq-social-list a:hover img{ opacity:1; }

/* =========================================================
   6) AFIP QR — sin shadow, borde premium
   ========================================================= */
#loq-footer .lq-afip-qr{
  width: 96px;
  max-width: 96px;
  height:auto;
  border-radius: 14px;
  background: rgba(2,6,23,.70);
  border: 1px solid rgba(255,255,255,.16);
  display:block;
  filter:none !important;
  box-shadow:none !important;
}

@media (max-width: 767px){
  #loq-footer .lq-afip-qr{
    margin-left:auto;
    margin-right:auto;
  }
}

/* =========================================================
   7) Newsletter — premium + más legible
   ========================================================= */
#loq-footer .lq-news-frame{
  position:relative;
  border-radius:999px;
  padding:1px;
  background-image: var(--loq-accent-gradient);
  box-shadow:none;
  max-width:360px;
}

#loq-footer .lq-news-form{
  display:flex;
  align-items:stretch;
  border-radius:999px;
  overflow:hidden;
  background: var(--loq-field-bg);
  border: 1px solid rgba(255,255,255,.12);
}

#loq-footer .lq-news-input{
  width:100%;
  min-width:0;
  border:0;
  outline:none;
  padding: 12px 14px;
  font-size: 14px;
  background: transparent;
  color: rgba(255,255,255,.94);
}

#loq-footer .lq-news-input::placeholder{
  color: rgba(226,232,240,.60);
}

#loq-footer .lq-news-button{
  border:0;
  cursor:pointer;
  padding: 12px 18px;
  font-size: 14px;
  font-weight: 850;
  white-space: nowrap;

  background: rgba(93,60,230,.92);
  color: rgba(255,255,255,.98);
  border-left:1px solid rgba(255,255,255,.12);
}
#loq-footer .lq-news-button:hover{
  background: rgba(70,233,255,.92);
  color: rgba(2,6,23,.96);
}

/* =========================================================
   8) Bottom: pagos + legal (sin sombras en imágenes)
   ========================================================= */
#loq-footer .lq-footer-bottom{
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.10);
  text-align:center;
}

#loq-footer .lq-paystrip{
  margin-top: 14px;
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  align-items:center;
  gap: 18px;
}

/* SIN SHADOW */
#loq-footer .lq-paystrip img{
  height: 28px;
  width: auto;
  max-width: 160px;
  object-fit: contain;
  display:block;
  flex: 0 0 auto;
  filter: none !important;
  box-shadow: none !important;
  opacity: .92;
}
#loq-footer .lq-paystrip img:hover{ opacity: 1; }

@media (max-width: 768px){
  #loq-footer .lq-paystrip img{
    height: 24px;
    max-width: 140px;
  }
}
@media (min-width: 1280px){
  #loq-footer .lq-paystrip img{
    height: 32px;
    max-width: 190px;
  }
}

/* legal */
#loq-footer .lq-legal{ margin-top: 14px; }

#loq-footer .lq-legal-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  justify-content:center;
  gap: 14px;
  flex-wrap:wrap;
  font-size: 12px;
  color: rgba(226,232,240,.62);   /* más visible */
}

#loq-footer .lq-copy{
  margin: 14px 0 0;
  font-size: 12px;
  color: rgba(226,232,240,.48);   /* más visible */
}
#loq-footer .lq-copy--sub{ margin-top: 6px; }

/* =========================================================
   9) Mobile layout (2x2 + newsletter full)
   ========================================================= */
@media (max-width: 767px){
  #loq-footer.site-footer{
    padding-bottom: 90px; /* por botón flotante WhatsApp */
  }

  #loq-footer .lq-footer-grid{
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "hrs ctc"
      "social afip"
      "news news";
    gap: 22px;
  }

  #loq-footer .lq-hrs    { grid-area: hrs; text-align:center; }
  #loq-footer .lq-ctc    { grid-area: ctc; text-align:center; }
  #loq-footer .lq-social { grid-area: social; text-align:center; }
  #loq-footer .lq-afip   { grid-area: afip; text-align:center; }
  #loq-footer .lq-news   { grid-area: news; text-align:center; }

  #loq-footer .contact-item{ justify-content:center; }
  #loq-footer .lq-social-list{ justify-content:center; }
  #loq-footer .lq-news-frame{ margin-left:auto; margin-right:auto; }
}

/* Medianos */
@media (min-width:768px) and (max-width:1023px){
  #loq-footer .lq-news-frame{ margin-left:0; }
}

/* =========================================================
   10) Extra: apagado total de sombras en cualquier imagen del footer
   ========================================================= */
#loq-footer img{
  box-shadow:none !important;
  filter:none !important;
}

/* =========================================================
   LoQuiero — Fondo “Glass Blur + Tech Shapes” SOLO con CSS
   Uso recomendado: dentro de #loq-footer (no opaca el contenido)
   ========================================================= */

/* 1) Asegurá que el footer tenga isolation + overflow */
#loq-footer.site-footer{
  position: relative;
  overflow: hidden;
  isolation: isolate; /* 👈 importante para que overlays no afecten afuera */
}

/* 2) Overlay tech (gradientes + shapes sutiles) */
#loq-footer.site-footer::after{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:0;
  pointer-events:none;

  /* Ajustes finos */
  opacity: .42;                /* 👈 baja para que no opaque */
  mix-blend-mode: screen;      /* 👈 hace que sea luminoso, no “gris” */
  filter: blur(0.2px) saturate(1.08);

  /* Capas: luces + hex + grid + líneas “circuit” */
  background:
    /* luces principales */
    radial-gradient(900px 420px at 10% 0%, rgba(70,233,255,.35), transparent 62%),
    radial-gradient(860px 420px at 92% 5%, rgba(93,60,230,.32), transparent 60%),
    radial-gradient(980px 520px at 50% 120%, rgba(75,116,255,.22), transparent 62%),

    /* “hex” tech (pattern suave) */
    radial-gradient(circle at 20px 20px, rgba(255,255,255,.10) 1px, transparent 1.6px),
    radial-gradient(circle at 44px 44px, rgba(70,233,255,.10) 1px, transparent 1.8px),
    radial-gradient(circle at 68px 12px, rgba(93,60,230,.10) 1px, transparent 1.8px),

    /* grid sutil */
    linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.05) 1px, transparent 1px),

    /* “circuit lines” diagonales */
    linear-gradient(135deg, transparent 0 46%, rgba(70,233,255,.11) 47%, transparent 50%),
    linear-gradient(45deg, transparent 0 48%, rgba(93,60,230,.10) 49%, transparent 52%);

  /* TAMAÑOS de cada layer (clave para que se vea pro y sutil) */
  background-size:
    auto,
    auto,
    auto,

    96px 96px,
    96px 96px,
    96px 96px,

    56px 56px,
    56px 56px,

    420px 420px,
    520px 520px;

  /* POSICIONES */
  background-position:
    0% 0%,
    100% 0%,
    50% 120%,

    0 0,
    18px 12px,
    36px 6px,

    0 0,
    0 0,

    20% 10%,
    70% 20%;

  background-repeat: no-repeat, no-repeat, no-repeat, repeat, repeat, repeat, repeat, repeat, repeat, repeat;

  /* Mascara para que el tech sea más fuerte arriba y se disuelva abajo */
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.95), rgba(0,0,0,.55) 55%, rgba(0,0,0,.18));
          mask-image: linear-gradient(to bottom, rgba(0,0,0,.95), rgba(0,0,0,.55) 55%, rgba(0,0,0,.18));
}

/* 3) Asegurá que el contenido del footer quede arriba */
#loq-footer .loq-footer-inner{
  position: relative;
  z-index: 1;
}

/* 4) Opcional: si querés todavía MÁS sutil (no opaca nada) */
#loq-footer.tech-subtle::after{
  opacity: .30;
  filter: saturate(1.05);
}

/* =========================================================
   CONTACTO — iconos alineados (SVG real, estilo WhatsApp)
   ========================================================= */

/* fila */
#loq-footer .lq-ctc .contact-item{
  display:flex;
  align-items:center;
  gap:12px;
}

/* chip (igual WhatsApp) */
#loq-footer .lq-ctc .contact-item .ico{
  width:36px;
  height:36px;
  min-width:36px;
  border-radius:999px;
  display:grid;
  place-items:center;

  background: rgba(2,6,23,.55);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* SVG iconos */
#loq-footer .lq-ctc .contact-item .ico-svg{
  width:18px;
  height:18px;
  fill: var(--loq-brand-cyan); /* 👈 MISMO color que PRESENCIAL */
  display:block;
}

/* WhatsApp SVG o IMG queda igual */
#loq-footer .lq-ctc .contact-item .ico img{
  width:18px;
  height:18px;
  display:block;
}

/* hover premium */
#loq-footer .lq-ctc .contact-item:hover .ico{
  border-color: rgba(70,233,255,.45);
}

/* texto */
#loq-footer .lq-ctc .contact-item p{
  margin:0;
  line-height:1.25;
}

/* =========================================================
   FIX FINAL — Textos legales en BLANCO (premium)
   ========================================================= */

/* Política de privacidad */
#loq-footer .lq-legal-list,
#loq-footer .lq-legal-list a{
  color: rgba(255,255,255,.88) !important;
  font-weight: 600;
}

/* Hover sutil */
#loq-footer .lq-legal-list a:hover{
  color: rgba(70,233,255,.95) !important;
}

/* Copyright */
#loq-footer .lq-copy{
  color: rgba(255,255,255,.80) !important;
  font-weight: 500;
}

/* “Desarrollado por Doctadev Team” */
#loq-footer .lq-copy--sub{
  color: rgba(255,255,255,.72) !important;
}

#loq-footer .lq-copy--sub a{
  color: rgba(255,255,255,.90) !important;
  font-weight: 700;
}

#loq-footer .lq-copy--sub a:hover{
  color: rgba(70,233,255,.95) !important;
}