/* ================= BO HERO BANNER WIDGET — default styling =================
   Scoped under .bo-hero-wrap. Self-contained: does not depend on theme
   globals like .btn/.eyebrow/:root vars, so it renders correctly even
   if the theme's own stylesheet isn't loaded.
   ========================================================================= */

.bo-hero-wrap{
  --hero-navy: #031B39;
  --hero-navy-soft: #0B2A52;
  --hero-accent: #1083E6;
  --hero-slate-light: #8B97A8;
  --hero-line: #E4E8EE;
  --hero-ease: cubic-bezier(.22,1,.36,1);
  --hero-pad-top: 130px;
  --hero-grid-gap: 50px;
  --hero-copy-pad-bottom: 64px;
  font-family:'Roboto', sans-serif;
}

.bo-hero-wrap .hero{
  padding:var(--hero-pad-top) 0 0;
  position:relative;
  overflow:hidden;
  background:var(--hero-navy);
}
.bo-hero-wrap .hero-copy{ padding-bottom:var(--hero-copy-pad-bottom); }

.bo-hero-wrap .hero-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
}
.bo-hero-wrap .hero::before{
  content:'';
  position:absolute;
  top:40%; left:50%;
  transform:translate(-50%,-50%);
  width:900px; height:900px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(16,131,230,.12) 0%, transparent 65%);
  pointer-events:none;
  z-index:1;
}
.bo-hero-wrap .hero::after{
  content:'';
  position:absolute;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");
  opacity:.5;
  pointer-events:none;
  z-index:1;
}
.bo-hero-wrap .hero-grid{
  max-width:1220px; margin:0 auto; padding:0 40px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:var(--hero-grid-gap);
  align-items:end;
  position:relative;
  z-index:2;
}

/* ---------- Eyebrow ---------- */
.bo-hero-wrap .hero-eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--hero-accent);
  font-weight:500;
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:20px;
}
.bo-hero-wrap .hero-eyebrow::before{
  content:'';
  width:18px; height:1px;
  background:var(--hero-accent);
  display:inline-block;
}

/* ---------- Heading ---------- */
.bo-hero-wrap .hero h1{
  font-family:'Roboto Slab', serif;
  font-size:43px;
  font-weight:500;
  margin-bottom:20px;
  letter-spacing:-0.015em;
  line-height:1.12;
  color:#fff;
}
.bo-hero-wrap .hero h1 em{
  font-style:italic;
  font-weight:400;
  color:var(--hero-accent);
  position:relative;
}
.bo-hero-wrap .underline-svg{
  display:block;
  margin-top:-4px;
  width:300px;
  max-width:100%;
}
.bo-hero-wrap .underline-svg path{
  stroke:var(--hero-accent);
  stroke-width:2;
  stroke-linecap:round;
  stroke-dasharray:340;
  stroke-dashoffset:340;
  transition:stroke-dashoffset 1.1s var(--hero-ease) .5s;
}
.bo-hero-wrap .reveal.in .underline-svg path{ stroke-dashoffset:0; }

.bo-hero-wrap .hero p.lede{
  font-size:16.5px;
  max-width:460px;
  margin-bottom:30px;
  color:rgba(255,255,255,.82);
  line-height:1.6;
}

/* ---------- Actions ---------- */
.bo-hero-wrap .hero-actions{
  display:flex;
  align-items:center;
  gap:20px;
  margin-bottom:36px;
  flex-wrap:wrap;
}
.bo-hero-wrap .hero-btn-primary{
  font-family:'Roboto', sans-serif;
  font-weight:600;
  font-size:13.5px;
  padding:11px 22px;
  border-radius:7px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  transition:all .35s var(--hero-ease);
  border:1px solid transparent;
  white-space:nowrap;
  position:relative;
  overflow:hidden;
  background:var(--hero-navy);
  color:#fff;
  text-decoration:none;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset, 0 8px 20px -8px rgba(11,31,58,.45);
}
.bo-hero-wrap .hero-btn-primary::before{
  content:'';
  position:absolute; top:0; left:-100%;
  width:60%; height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.25), transparent);
  transition:left .6s var(--hero-ease);
}
.bo-hero-wrap .hero-btn-primary:hover::before{ left:130%; }
.bo-hero-wrap .hero-btn-primary:hover{
  background:var(--hero-navy-soft);
  transform:translateY(-2px);
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset, 0 14px 26px -8px rgba(11,31,58,.55);
  color:#fff;
}
.bo-hero-wrap .hero-btn-primary svg{ transition:transform .35s var(--hero-ease); }
.bo-hero-wrap .hero-btn-primary:hover svg{ transform:translateX(3px); }

.bo-hero-wrap .link-arrow{
  display:flex;
  align-items:center;
  gap:8px;
  font-family:'Roboto', sans-serif;
  font-size:14px;
  font-weight:600;
  color:rgba(255,255,255,.70);
  text-decoration:none;
  transition:color .25s var(--hero-ease), transform .25s var(--hero-ease);
}
.bo-hero-wrap .link-arrow:hover,
.bo-hero-wrap .link-arrow:focus{ color:#fff; transform:translateX(4px); }
.bo-hero-wrap .link-arrow svg{ transition:transform .3s var(--hero-ease); stroke:currentColor; }
.bo-hero-wrap .link-arrow svg path{ stroke:currentColor; }

/* ---------- Trust row ---------- */
.bo-hero-wrap .trust-row{ display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.bo-hero-wrap .trust-row > span{
  font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.55); font-family:'IBM Plex Mono', monospace;
}
.bo-hero-wrap .trust-logos{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.bo-hero-wrap .trust-logos div{
  font-family:'Roboto Slab', serif; font-weight:600; font-size:15px;
  color:rgba(255,255,255,.72); opacity:.75;
  transition:opacity .3s var(--hero-ease), color .3s var(--hero-ease);
}
.bo-hero-wrap .trust-logos div:hover{ opacity:1; color:#fff; }

/* ---------- Visual ---------- */
.bo-hero-wrap .hero-visual{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:flex-end;
  height:100%;
  align-self:stretch;
}
.bo-hero-wrap .photo-frame{
  width:100%; max-width:640px;
  display:flex; justify-content:center; align-items:flex-end;
  height:100%;
}
.bo-hero-wrap .image-wrap{
  position:relative;
  display:inline-flex;
  width:fit-content;
  max-width:100%;
}
.bo-hero-wrap .image-wrap img{
  display:block;
  width:100%; max-width:640px; height:auto;
  vertical-align:bottom;
  border-radius:0;
}
.bo-hero-wrap .visual-top{ position:absolute; top:12px; right:12px; z-index:10; }
.bo-hero-wrap .visual-badge{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'IBM Plex Mono', monospace; font-size:10px;
  letter-spacing:.08em; text-transform:uppercase;
  color:#fff; padding:7px 14px; border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
}
.bo-hero-wrap .visual-dot{
  width:8px; height:8px; border-radius:50%;
  background:#58D67D; flex-shrink:0;
  box-shadow:0 0 0 3px rgba(88,214,125,.25);
  animation:boHeroPulseDot 2s ease-in-out infinite;
}
@keyframes boHeroPulseDot{
  0%,100%{ box-shadow:0 0 0 3px rgba(88,214,125,.25); }
  50%{ box-shadow:0 0 0 8px rgba(88,214,125,.10); }
}

/* ---------- Floating chips ---------- */
.bo-hero-wrap .float-chip{
  position:absolute; background:#fff; border-radius:10px; padding:9px 13px;
  box-shadow:0 16px 32px -14px rgba(11,31,58,.32); border:1px solid var(--hero-line);
  display:flex; align-items:center; gap:8px; z-index:3;
  animation:boHeroFloaty 5s ease-in-out infinite;
}
.bo-hero-wrap .float-chip svg{ width:14px; height:14px; stroke:var(--hero-accent); flex-shrink:0; }
.bo-hero-wrap .float-chip span{ font-size:11.5px; font-weight:600; color:var(--hero-navy); white-space:nowrap; }
.bo-hero-wrap .chip-1{ top:28%; left:-12%; animation-delay:0s; }
.bo-hero-wrap .chip-2{ bottom:14%; right:-8%; animation-delay:1.4s; }
@keyframes boHeroFloaty{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-9px); } }

/* ---------- Reveal helper (self-contained, no theme JS required) ---------- */
.bo-hero-wrap .reveal{
  opacity:0; transform:translateY(26px);
  transition:opacity .8s var(--hero-ease), transform .8s var(--hero-ease);
}
.bo-hero-wrap .reveal.in{ opacity:1; transform:translateY(0); }

/* ---------- Editor-active safety net ----------
   Elementor adds this class to the preview iframe <body> so plugins can
   force-show scroll-reveal content while editing, independent of any
   JS timing race. */
body.elementor-editor-active .bo-hero-wrap .reveal{
	opacity: 1 !important;
	transform: none !important;
}

@media (prefers-reduced-motion: reduce){
  .bo-hero-wrap .reveal{ opacity:1; transform:none; transition:none; }
  .bo-hero-wrap *{ animation:none !important; }
}

/* ================= RESPONSIVE ================= */
@media (max-width:980px){
  .bo-hero-wrap .hero-grid{ display:flex; flex-direction:column; gap:16px; }
  .bo-hero-wrap .hero-visual{ width:100%; max-width:620px; margin:0 auto; }
  .bo-hero-wrap .photo-frame{ height:auto; }
  .bo-hero-wrap .float-chip{ display:none; }
}
@media (max-width:640px){
  .bo-hero-wrap .hero-grid{ padding:0 20px; }
  .bo-hero-wrap .hero h1{ font-size:30px; }
  .bo-hero-wrap .hero-eyebrow{ font-size:10px; }
  .bo-hero-wrap .hero-visual{ width:100%; }
  .bo-hero-wrap .hero-copy{ padding-bottom:0; }
  .bo-hero-wrap .visual-badge{ padding:6px 10px; font-size:9px; }
  .bo-hero-wrap .photo-frame{ height:auto; }
  .bo-hero-wrap .hero-actions{ flex-wrap:wrap; gap:14px 18px; }
  .bo-hero-wrap .trust-row{ gap:14px; }
  .bo-hero-wrap .trust-logos{ gap:14px; }
  .bo-hero-wrap .trust-logos div{ font-size:13px; }
}