/* ================= BO CLOSING WIDGET — default styling =================
   Scoped under .bo-closing-wrap. Reproduces .closing exactly, including
   the base .btn / .btn-primary / .btn-ghost styles it depends on (defined
   locally since this widget doesn't share CSS with any other widget).
   ========================================================================= */

.bo-closing-wrap{
  --cl-navy: #031B39;
  --cl-navy-soft: #0B2A52;
  --cl-accent: #1083E6;
  --cl-line-strong: #D6DCE5;
  --cl-ease: cubic-bezier(.22,1,.36,1);
  font-family:'Roboto', sans-serif;
}

.bo-closing-wrap .cl-wrap{ max-width:1220px; margin:0 auto; padding:0 40px; }

.bo-closing-wrap .eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--cl-accent); font-weight:500;
  display:flex; align-items:center; gap:10px;
}
.bo-closing-wrap .eyebrow::before{
  content:''; width:18px; height:1px; background:var(--cl-accent); display:inline-block;
}

.bo-closing-wrap .closing{
  text-align:center; padding:100px 0 90px; position:relative; overflow:hidden;
}
.bo-closing-wrap .closing::before{
  content:''; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:900px; height:500px;
  background:radial-gradient(ellipse, rgba(16,131,230,.10), transparent 70%);
}
.bo-closing-wrap .closing h2{
  font-family:'Roboto Slab', serif;
  font-weight:600; letter-spacing:-0.01em; line-height:1.12;
  color:var(--cl-navy);
  font-size:40px; max-width:660px; margin:0 auto 24px; position:relative;
}
.bo-closing-wrap .closing h2 em{
  color:var(--cl-accent); font-style:italic; font-weight:400;
}
.bo-closing-wrap .closing-actions{
  display:flex; justify-content:center; gap:16px; position:relative; flex-wrap:wrap;
}

/* ---------- Buttons (local, scoped copy) ---------- */
.bo-closing-wrap .btn{
  font-family:'Roboto'; 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(--cl-ease);
  border:1px solid transparent; white-space:nowrap;
  position:relative; overflow:hidden;
  text-decoration:none;
}
.bo-closing-wrap .btn::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(--cl-ease);
}
.bo-closing-wrap .btn:hover::before{ left:130%; }
.bo-closing-wrap .btn-primary{
  background:var(--cl-navy); color:#fff;
  box-shadow: 0 1px 0 rgba(255,255,255,.08) inset, 0 8px 20px -8px rgba(11,31,58,.45);
}
.bo-closing-wrap .btn-primary:hover{
  background:var(--cl-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);
}
.bo-closing-wrap .btn-ghost{
  background:transparent; color:var(--cl-navy); border:1px solid var(--cl-line-strong);
}
.bo-closing-wrap .btn-ghost:hover{
  border-color:var(--cl-navy); background:#fff; transform:translateY(-2px);
}

/* ================= RESPONSIVE ================= */
@media (max-width:640px){
  .bo-closing-wrap .cl-wrap{ padding:0 20px; }
  .bo-closing-wrap .closing{ padding:70px 0 60px; }
  .bo-closing-wrap .closing h2{ font-size:27px; }
  .bo-closing-wrap .closing-actions{ gap:12px; }
  .bo-closing-wrap .btn{ width:100%; justify-content:center; }
}