
/*
  IngSoft V84.63 — Laboratorio Celso-AQ microcirugía visual premium.
  Objetivo: pulir logo, título, dashboard derecho y botones 3D del catálogo
  sin tocar motores funcionales.
*/

html body.page-laboratorio{
  --aq63-deep:#020914;
  --aq63-navy:#06152A;
  --aq63-panel:#071D3A;
  --aq63-cyan:#22D8FF;
  --aq63-blue:#0B73D9;
  --aq63-blue2:#4F8FE8;
  --aq63-ice:#EAF8FF;
  --aq63-red:#E3262E;
}

/* 1) Logo oficial Celso-AQ con fondo blanco, integrado naturalmente */
html body.page-laboratorio .celsoaq-v8461-logo{
  display:block!important;
  width:min(520px,100%)!important;
  height:auto!important;
  max-height:148px!important;
  object-fit:contain!important;
  opacity:.91!important;
  padding:.72rem 1rem!important;
  border-radius:28px!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.78),rgba(236,247,255,.66))!important;
  border:1px solid rgba(255,255,255,.46)!important;
  box-shadow:
    0 22px 56px rgba(0,0,0,.30),
    0 0 42px rgba(34,216,255,.14),
    inset 0 1px 0 rgba(255,255,255,.74)!important;
  backdrop-filter:blur(16px) saturate(1.08)!important;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.22))!important;
  transform:translateZ(0)!important;
}

/* La marca no debe parecer pegada: halo técnico muy sutil */
html body.page-laboratorio .celsoaq-v8461-left{
  position:relative!important;
}
html body.page-laboratorio .celsoaq-v8461-left::before{
  content:""!important;
  position:absolute!important;
  left:-4%!important;
  top:3.5rem!important;
  width:min(620px,88vw)!important;
  height:210px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(34,216,255,.12),transparent 68%)!important;
  filter:blur(18px)!important;
  pointer-events:none!important;
  z-index:-1!important;
}

/* 2) La palabra Celso-AQ en el título se acerca al carácter del logo */
html body.page-laboratorio .celsoaq-v8461-hero h1 span,
html body.page-laboratorio #celsoaq-v8461-title span{
  display:inline-block!important;
  font-family:"Eurostile Extended","Bank Gothic","Orbitron","Montserrat","Segoe UI",system-ui,sans-serif!important;
  font-weight:900!important;
  font-style:italic!important;
  letter-spacing:.015em!important;
  transform:skewX(-7deg) translateY(.035em)!important;
  transform-origin:left center!important;
  color:#4F8FE8!important;
  -webkit-text-fill-color:transparent!important;
  background:linear-gradient(92deg,#EAF8FF 0%,#78B7FF 28%,#4F8FE8 56%,#0B73D9 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  text-shadow:
    0 0 20px rgba(79,143,232,.38),
    0 18px 45px rgba(0,0,0,.50)!important;
}

html body.page-laboratorio #celsoaq-v8461-title{
  text-wrap:balance!important;
}

/* 3) Dashboard derecho: aprovechar la columna completa con lectura científica */
html body.page-laboratorio .celsoaq-v8461-panel{
  min-height:clamp(520px,58vh,680px)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  gap:.72rem!important;
  padding:clamp(1rem,1.45vw,1.35rem)!important;
  background:
    radial-gradient(circle at 88% 10%,rgba(34,216,255,.18),transparent 27%),
    radial-gradient(circle at 12% 74%,rgba(79,143,232,.13),transparent 26%),
    linear-gradient(180deg,rgba(5,22,48,.94),rgba(3,13,29,.96))!important;
  box-shadow:
    0 32px 78px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.055),
    0 0 44px rgba(34,216,255,.08)!important;
}

html body.page-laboratorio .celsoaq-v8461-panel h2{
  margin:.25rem 0 .45rem!important;
  font-size:clamp(1.55rem,2vw,2.12rem)!important;
  line-height:1.02!important;
  letter-spacing:-.035em!important;
}

html body.page-laboratorio .celsoaq-v8461-param{
  min-height:42px!important;
  border-radius:16px!important;
  background:rgba(10,38,74,.72)!important;
  border:1px solid rgba(139,212,255,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}

html body.page-laboratorio .celsoaq-v8461-readouts{
  gap:.5rem!important;
}

html body.page-laboratorio .celsoaq-v8461-readouts div{
  background:linear-gradient(145deg,rgba(9,39,76,.86),rgba(6,27,55,.92))!important;
  border:1px solid rgba(139,212,255,.22)!important;
  box-shadow:0 14px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04)!important;
}

html body.page-laboratorio .celsoaq-v8461-chart{
  min-height:118px!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 72% 15%,rgba(34,216,255,.11),transparent 28%),
    rgba(4,16,35,.76)!important;
  border:1px solid rgba(139,212,255,.20)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}

/* Acciones rápidas, decididas como panel de operación IA */
html body.page-laboratorio .celsoaq-v8463-panel-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:.48rem!important;
  margin-top:.1rem!important;
}

html body.page-laboratorio .celsoaq-v8463-panel-actions a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:40px!important;
  padding:.62rem .62rem!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,#0B73D9 0%,#22D8FF 100%)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  color:#FFFFFF!important;
  -webkit-text-fill-color:#FFFFFF!important;
  text-decoration:none!important;
  text-align:center!important;
  font-size:.74rem!important;
  line-height:1.08!important;
  font-weight:1000!important;
  letter-spacing:.015em!important;
  box-shadow:
    0 12px 24px rgba(11,115,217,.30),
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -3px 0 rgba(0,44,96,.18)!important;
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease!important;
}

html body.page-laboratorio .celsoaq-v8463-panel-actions a:hover{
  transform:translateY(-2px)!important;
  filter:saturate(1.08) brightness(1.05)!important;
  box-shadow:
    0 18px 34px rgba(11,115,217,.38),
    0 0 24px rgba(34,216,255,.12),
    inset 0 1px 0 rgba(255,255,255,.35),
    inset 0 -3px 0 rgba(0,44,96,.18)!important;
}

html body.page-laboratorio .celsoaq-v8463-ai-dashboard{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:.5rem!important;
  margin-top:.18rem!important;
}

html body.page-laboratorio .celsoaq-v8463-ai-dashboard div{
  border-radius:17px!important;
  padding:.72rem .76rem!important;
  background:
    radial-gradient(circle at 90% 16%,rgba(34,216,255,.14),transparent 30%),
    linear-gradient(145deg,rgba(8,36,70,.78),rgba(4,18,38,.92))!important;
  border:1px solid rgba(139,212,255,.20)!important;
  box-shadow:0 12px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.035)!important;
}

html body.page-laboratorio .celsoaq-v8463-ai-dashboard span{
  display:block!important;
  color:#86E6FF!important;
  -webkit-text-fill-color:#86E6FF!important;
  font-size:.67rem!important;
  line-height:1.1!important;
  font-weight:1000!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
}

html body.page-laboratorio .celsoaq-v8463-ai-dashboard strong{
  display:block!important;
  margin-top:.32rem!important;
  color:#FFFFFF!important;
  -webkit-text-fill-color:#FFFFFF!important;
  font-size:.78rem!important;
  line-height:1.28!important;
  font-weight:850!important;
}

/* 4) Módulos/accesos del hero: más profundidad y lectura */
html body.page-laboratorio .celsoaq-v8461-modules a,
html body.page-laboratorio .celsoaq-v8461-dashboard > section,
html body.page-laboratorio .celsoaq-v8461-dashboard article{
  box-shadow:
    0 22px 52px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.045),
    0 0 28px rgba(34,216,255,.06)!important;
}

html body.page-laboratorio .celsoaq-v8461-modules a{
  border-color:rgba(139,212,255,.28)!important;
}
html body.page-laboratorio .celsoaq-v8461-modules a:hover{
  transform:translateY(-3px)!important;
  border-color:rgba(34,216,255,.55)!important;
  background:
    radial-gradient(circle at 86% 18%,rgba(34,216,255,.20),transparent 32%),
    linear-gradient(145deg,rgba(9,43,82,.92),rgba(5,24,50,.94))!important;
}

/* 5) Botones del catálogo científico: 3D reales, llamativos y premium */
html body.page-laboratorio .lab84-sim{
  background:
    linear-gradient(145deg,rgba(9,42,82,.96),rgba(5,22,48,.98))!important;
  border:1px solid rgba(139,212,255,.32)!important;
  box-shadow:
    0 24px 0 rgba(0,6,16,.10),
    0 26px 58px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -10px 22px rgba(0,0,0,.16)!important;
  transform:translateZ(0)!important;
}

html body.page-laboratorio .lab84-sim:hover{
  transform:translateY(-4px) scale(1.012)!important;
  border-color:rgba(34,216,255,.68)!important;
  box-shadow:
    0 30px 0 rgba(0,6,16,.10),
    0 36px 78px rgba(0,0,0,.42),
    0 0 30px rgba(34,216,255,.14),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -10px 22px rgba(0,0,0,.16)!important;
}

html body.page-laboratorio .lab84-sim-title{
  font-size:1.12rem!important;
  letter-spacing:-.018em!important;
}

html body.page-laboratorio .lab84-sim em{
  position:relative!important;
  isolation:isolate!important;
  width:100%!important;
  min-height:44px!important;
  margin-top:auto!important;
  padding:.78rem .85rem!important;
  border-radius:16px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.22),transparent 35%),
    linear-gradient(135deg,#0B73D9 0%,#22D8FF 100%)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  color:#FFFFFF!important;
  -webkit-text-fill-color:#FFFFFF!important;
  text-transform:uppercase!important;
  font-size:.76rem!important;
  letter-spacing:.08em!important;
  box-shadow:
    0 14px 26px rgba(11,115,217,.34),
    inset 0 1px 0 rgba(255,255,255,.35),
    inset 0 -4px 0 rgba(0,45,96,.22)!important;
  overflow:hidden!important;
}

html body.page-laboratorio .lab84-sim em::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  background:linear-gradient(110deg,transparent 0 30%,rgba(255,255,255,.34) 42%,transparent 55% 100%)!important;
  transform:translateX(-120%)!important;
  transition:transform .55s ease!important;
}

html body.page-laboratorio .lab84-sim:hover em::before{
  transform:translateX(120%)!important;
}

/* 6) Microcirugía de contraste y espaciado general */
html body.page-laboratorio .lab84-section,
html body.page-laboratorio .v91-section.surface-dark{
  margin-top:clamp(1.45rem,2.4vw,2.6rem)!important;
  margin-bottom:clamp(1.45rem,2.4vw,2.6rem)!important;
}

html body.page-laboratorio .lab84-lead,
html body.page-laboratorio .lab84-panel-copy{
  max-width:1100px!important;
}

html body.page-laboratorio a:focus-visible,
html body.page-laboratorio button:focus-visible{
  outline:3px solid rgba(34,216,255,.86)!important;
  outline-offset:4px!important;
}

/* Responsive */
@media (max-width:1280px){
  html body.page-laboratorio .celsoaq-v8463-ai-dashboard{
    grid-template-columns:1fr!important;
  }
  html body.page-laboratorio .celsoaq-v8463-panel-actions{
    grid-template-columns:1fr!important;
  }
  html body.page-laboratorio .celsoaq-v8461-panel{
    min-height:auto!important;
  }
}

@media (max-width:760px){
  html body.page-laboratorio .celsoaq-v8461-logo{
    width:100%!important;
    max-height:120px!important;
    padding:.52rem .7rem!important;
    border-radius:20px!important;
    opacity:.94!important;
  }
  html body.page-laboratorio #celsoaq-v8461-title span{
    transform:skewX(-5deg)!important;
  }
}
