/* CONNECT IA — Futuristic Theme */
:root{
  --fx-electric:#0b63f6;
  --fx-cyan:#19d4ff;
  --fx-indigo:#5b6cff;
  --fx-violet:#7857ff;
  --fx-deep:#061a35;
  --fx-glass:rgba(255,255,255,.74);
  --fx-line:rgba(114,178,255,.26);
  --fx-glow:0 18px 60px rgba(11,99,246,.12);
}

/* Ambient technological depth */
body.public-landing{
  background:
    radial-gradient(circle at 8% 16%,rgba(25,212,255,.075),transparent 26rem),
    radial-gradient(circle at 92% 28%,rgba(120,87,255,.065),transparent 24rem),
    linear-gradient(180deg,#ffffff 0%,#f8fbff 48%,#ffffff 100%) !important;
}

/* Header with subtle glass */
.public-header{
  background:rgba(255,255,255,.86) !important;
  border-bottom:1px solid rgba(135,188,240,.28) !important;
  box-shadow:0 10px 34px rgba(8,39,77,.055) !important;
  backdrop-filter:blur(22px) saturate(1.25) !important;
}
.ci-brand img{
  filter:drop-shadow(0 5px 14px rgba(11,99,246,.10));
}

/* Futuristic navigation */
.ci-navlinks>a:not(.ci-nav-cta){
  position:relative;
}
.ci-navlinks>a:not(.ci-nav-cta):after{
  content:"";
  position:absolute;
  left:12px;right:12px;bottom:3px;
  height:2px;border-radius:4px;
  background:linear-gradient(90deg,var(--fx-electric),var(--fx-cyan));
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .18s ease;
}
.ci-navlinks>a:not(.ci-nav-cta):hover:after,
.ci-navlinks>a[aria-current="page"]:not(.ci-nav-cta):after{
  transform:scaleX(1);
}
.ci-navlinks .ci-nav-cta{
  background:linear-gradient(135deg,var(--fx-electric),#087dd8 55%,var(--fx-cyan)) !important;
  box-shadow:0 10px 28px rgba(11,99,246,.20);
}

/* Hero with tech grid + glow */
.ci-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 25%,rgba(25,212,255,.12),transparent 18rem),
    radial-gradient(circle at 22% 75%,rgba(91,108,255,.08),transparent 24rem),
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,251,255,.97)) !important;
}
.ci-hero:before{
  content:"";
  position:absolute;inset:0;
  z-index:-2;
  opacity:.28;
  background-image:
    linear-gradient(rgba(11,99,246,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,99,246,.055) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom,black 0%,rgba(0,0,0,.52) 55%,transparent 100%);
}
.ci-hero:after{
  content:"";
  position:absolute;
  width:420px;height:420px;
  right:-140px;top:-120px;
  border-radius:50%;
  z-index:-1;
  background:
    radial-gradient(circle,rgba(25,212,255,.16) 0%,rgba(91,108,255,.07) 38%,transparent 70%);
  filter:blur(10px);
}
.ci-kicker{
  position:relative;
  display:inline-flex !important;
  align-items:center;
  gap:8px;
  width:max-content;
  max-width:100%;
  padding:7px 11px;
  border:1px solid rgba(11,99,246,.14);
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(239,247,255,.86));
  box-shadow:0 8px 24px rgba(11,99,246,.06);
}
.ci-kicker:before{
  content:"";
  width:7px;height:7px;
  border-radius:50%;
  background:var(--fx-cyan);
  box-shadow:0 0 0 5px rgba(25,212,255,.11),0 0 18px rgba(25,212,255,.45);
}
.ci-hero h1{
  background:linear-gradient(110deg,var(--home-navy) 0%,#0b477f 48%,var(--fx-electric) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
}
.ci-hero-card{
  border-color:rgba(114,178,255,.34) !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.88),rgba(242,249,255,.76)) !important;
  box-shadow:
    0 26px 80px rgba(8,56,108,.12),
    inset 0 1px 0 rgba(255,255,255,.90) !important;
  backdrop-filter:blur(16px);
}
.ci-hero-card:before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg,rgba(25,212,255,.50),rgba(91,108,255,.18),transparent 58%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}
.ci-mini{
  border-color:rgba(123,183,238,.28) !important;
  background:rgba(255,255,255,.76) !important;
}

/* Buttons with subtle energy edge */
.ci-button-primary{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,var(--fx-electric),#087fd8 58%,var(--fx-cyan)) !important;
  box-shadow:0 14px 30px rgba(11,99,246,.18);
}
.ci-button-primary:after{
  content:"";
  position:absolute;
  top:-40%;left:-20%;
  width:28%;height:180%;
  transform:rotate(18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.30),transparent);
  transition:left .35s ease;
}
.ci-button-primary:hover:after{left:110%}
.ci-button-secondary{
  background:rgba(255,255,255,.72) !important;
  backdrop-filter:blur(8px);
}

/* Trust cards */
.ci-trustitem{
  position:relative;
  overflow:hidden;
  border-color:rgba(129,183,235,.28) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(248,252,255,.78)) !important;
  box-shadow:0 12px 34px rgba(10,48,92,.055) !important;
}
.ci-trustitem:after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--fx-cyan),var(--fx-indigo),transparent);
  opacity:.42;
}
.ci-iconbox{
  position:relative;
  overflow:hidden;
  border-color:rgba(96,168,235,.30) !important;
  background:
    linear-gradient(145deg,rgba(229,244,255,.96),rgba(247,252,255,.92)) !important;
  color:#095ca3 !important;
  box-shadow:
    0 9px 24px rgba(11,99,246,.09),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}
.ci-iconbox:after{
  content:"";
  position:absolute;
  width:26px;height:26px;
  right:-8px;bottom:-9px;
  border-radius:50%;
  background:rgba(25,212,255,.17);
  filter:blur(5px);
}

/* Feature cards become modular tech panels */
.ci-feature-grid>section{
  position:relative;
  border-color:rgba(126,181,233,.26) !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.92),rgba(247,251,255,.84)) !important;
  box-shadow:0 14px 42px rgba(8,48,90,.065) !important;
}
.ci-feature-grid>section:hover{
  transform:translateY(-4px) !important;
  border-color:rgba(11,99,246,.34) !important;
  box-shadow:0 22px 58px rgba(11,99,246,.11) !important;
}
.ci-feature-grid>section:before{
  content:"";
  display:block !important;
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;height:auto;margin:0;
  border-radius:24px 0 0 24px;
  background:linear-gradient(180deg,var(--fx-cyan),var(--fx-electric),var(--fx-indigo));
  opacity:.72;
}

/* Page navigation as glass control rail */
.ci-page-nav{
  border-color:rgba(123,177,229,.28) !important;
  background:rgba(255,255,255,.78) !important;
  backdrop-filter:blur(14px) saturate(1.18);
  box-shadow:0 10px 30px rgba(7,48,96,.065) !important;
}
.ci-page-nav a:hover{
  background:linear-gradient(180deg,#eef7ff,#e9f4ff) !important;
}

/* FAQ */
.ci-faq{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 0%,rgba(25,212,255,.07),transparent 18rem),
    linear-gradient(180deg,rgba(248,252,255,.96),#fff) !important;
}
.ci-faq:before{
  content:"";
  position:absolute;
  left:0;top:0;right:0;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--fx-electric),var(--fx-cyan),transparent);
  opacity:.55;
}
.ci-faq details{
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.ci-faq details[open]{
  border-color:rgba(11,99,246,.28) !important;
  box-shadow:0 12px 34px rgba(11,99,246,.075) !important;
}

/* Commercial differentiators */
.ci-positioning{
  background:rgba(255,255,255,.78) !important;
  backdrop-filter:blur(12px);
  border-color:rgba(129,183,235,.28) !important;
}

/* Final CTA gets a stronger futuristic feel */
.ci-final-cta{
  background:
    radial-gradient(circle at 90% 20%,rgba(25,212,255,.22),transparent 16rem),
    radial-gradient(circle at 10% 90%,rgba(120,87,255,.15),transparent 18rem),
    linear-gradient(135deg,#061a35 0%,#09386c 48%,#0b63f6 100%) !important;
  box-shadow:0 26px 80px rgba(11,99,246,.18) !important;
}
.ci-final-cta:before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.20;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:28px 28px;
  mask-image:linear-gradient(90deg,black,transparent 70%);
}

/* Manuals */
.manual-step{
  border-color:rgba(127,181,232,.28) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(248,252,255,.88)) !important;
}
.manual-step figure{
  box-shadow:0 12px 34px rgba(10,48,92,.055);
}
.manual-checklist{
  background:
    radial-gradient(circle at 90% 10%,rgba(25,212,255,.18),transparent 14rem),
    linear-gradient(135deg,#061a35,#0b4e93) !important;
}

/* Footer */
.public-footer,.ci-footer{
  background:
    linear-gradient(180deg,#f9fcff,#f5f9ff) !important;
  border-top-color:rgba(133,186,236,.26) !important;
}

/* Mobile: keep effects elegant and light */
@media(max-width:768px){
  .ci-hero{
    background:
      radial-gradient(circle at 90% 10%,rgba(25,212,255,.08),transparent 14rem),
      linear-gradient(180deg,#fff,#f8fbff) !important;
  }
  .ci-hero:before{background-size:30px 30px;opacity:.18}
  .ci-feature-grid>section:hover{transform:none !important}
  .ci-button-primary:after{display:none}
}
@media(max-width:430px){
  .ci-hero-card{box-shadow:0 18px 44px rgba(8,56,108,.09) !important}
  .ci-trustitem{box-shadow:0 8px 24px rgba(10,48,92,.045) !important}
}

/* Respect reduced motion */
@media(prefers-reduced-motion:reduce){
  .ci-button-primary:after{display:none}
  .ci-feature-grid>section:hover{transform:none !important}
}

/* CONNECT IA — Futuristic CTA hotfix */
.ci-final-cta .ci-button-primary{
  background:#ffffff !important;
  border-color:#ffffff !important;
  color:#0b4f9c !important;
  box-shadow:0 12px 30px rgba(0,0,0,.14) !important;
}
.ci-final-cta .ci-button-primary:hover,
.ci-final-cta .ci-button-primary:focus-visible{
  background:#f4f9ff !important;
  color:#073d7b !important;
}
.ci-final-cta .ci-button-primary:after{display:none !important}

.ci-final-cta .ci-button-secondary{
  background:rgba(4,26,53,.34) !important;
  border-color:rgba(255,255,255,.55) !important;
  color:#ffffff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter:blur(10px);
}
.ci-final-cta .ci-button-secondary:hover,
.ci-final-cta .ci-button-secondary:focus-visible{
  background:rgba(4,26,53,.52) !important;
  border-color:rgba(255,255,255,.78) !important;
  color:#ffffff !important;
}

.ci-related h2{
  font-size:clamp(20px,2.4vw,26px) !important;
  line-height:1.18 !important;
  letter-spacing:-.025em;
  text-wrap:balance;
}

@media(max-width:768px){
  .ci-final-cta{
    padding:28px 22px !important;
  }
  .ci-final-cta h2{
    font-size:clamp(27px,7.8vw,34px) !important;
    line-height:1.08 !important;
  }
  .ci-final-cta p{
    font-size:15px;
    line-height:1.55;
  }
  .ci-final-cta .ci-hero-actions{
    gap:10px;
    margin-top:18px;
  }
  .ci-final-cta .ci-button{
    min-height:50px;
    font-size:14px;
    font-weight:850;
  }
  .ci-related{
    margin-top:28px !important;
  }
  .ci-related h2{
    margin-bottom:14px !important;
    font-size:22px !important;
  }
  .ci-back-top{
    width:30px !important;
    height:30px !important;
    right:10px !important;
    bottom:18px !important;
    font-size:12px !important;
    opacity:.78 !important;
  }
}

@media(max-width:430px){
  .ci-final-cta{
    padding:24px 18px !important;
    border-radius:20px !important;
  }
  .ci-final-cta h2{
    font-size:28px !important;
  }
  .ci-final-cta .ci-button{
    min-height:48px;
  }
  .ci-related h2{
    font-size:20px !important;
  }
}