/* =============================================================================
   buyout.css — page-scoped theme for the "June Escape Clause" Fixflo buyout page
   (/fixflo-contract-buyout/). Loaded AFTER the global style.css, so it inherits
   the fixifi.ai brand (Roboto / Roboto Slab / Montserrat fonts + the .btn-epic
   liquid-fill button engine) and only OVERRIDES color/chrome.

   Everything is scoped to `body.buyout-dark`, so the global stylesheet and every
   other page on the site stay on the light ivory theme — nothing here leaks out.

   Palette (brief is authoritative for colour):
     #0E1311 matte charcoal base   |  #141B19 panel   |  #1D2B2E fixifi slate (raised)
     #FFFFFF white headers         |  #C7CECC body     |  #00FF66 neon emerald accent
     #00C24E emerald-deep          |  #FF4D4D regulatory red
   ============================================================================= */

body.buyout-dark {
  --char:    #0E1311;
  --panel:   #141B19;
  --slate:   #1D2B2E;   /* kept from the fixifi brand, demoted to a panel surface */
  --emerald: #00FF66;
  --emerald-dk: #00C24E;
  --ink:     #FFFFFF;
  --muted:   #C7CECC;
  --hair:    rgba(0,255,102,0.18);
  --danger:  #FF4D4D;

  background-color: var(--char);
  color: var(--muted);
}

/* buyout.css is loaded ONLY on this page, so a bare element rule is safe here and
   won't touch other pages. Keep the document dark (global style.css makes html ivory)
   and clip any stray horizontal overflow so the off-screen mobile menu can't bleed in. */
html { background-color: #0E1311; overflow-x: hidden; }

/* The global stylesheet sets img{height:100%;width:100%} — neutralise that for
   our content images so the buyout graphic & figures keep their aspect ratio. */
body.buyout-dark .bo-figure img,
body.buyout-dark img.bo-img { height: auto; width: 100%; display: block; }

/* ----------------------------------------------------------------------------
   Shared chrome recolour: header / nav (logo swapped to the dark-bg variant)
   ---------------------------------------------------------------------------- */
/* NOTE: do NOT use backdrop-filter/filter/transform here — any of them would turn the
   nav into a containing block for the position:fixed off-screen mobile menu (#ham-menu),
   dragging its right:-350px reference onto the nav box and bleeding it on-screen.
   A solid charcoal bar keeps the sticky nav readable without that side effect. */
body.buyout-dark header,
body.buyout-dark nav {
  background: #0E1311 !important;
  border-bottom: 1px solid var(--hair);
}
body.buyout-dark nav img { filter: brightness(0) invert(1); }   /* whiten the black nav logo (keeps its 409x124 sizing) */
body.buyout-dark .get-started-btn { display: none !important; }   /* no top-nav CTA on the buyout page — the page drives its own briefing form */
body.buyout-dark nav ul li a,
body.buyout-dark .mobile-nav-links { color: var(--ink); }
body.buyout-dark nav ul li:before,
body.buyout-dark nav ul li:hover:before { background: var(--emerald) !important; }
body.buyout-dark #ham-menu-btn i,
body.buyout-dark #close-menu-btn i { color: var(--ink); }
body.buyout-dark .offscreen-menu { background: var(--panel); }

/* ----------------------------------------------------------------------------
   Footer recolour + logo swap
   ---------------------------------------------------------------------------- */
body.buyout-dark footer { background: #0B0F0D; border-top: 1px solid var(--hair); }
body.buyout-dark footer h1,
body.buyout-dark footer h4 { color: var(--ink); }
body.buyout-dark footer a,
body.buyout-dark footer p { color: var(--muted); }
body.buyout-dark footer a:hover { color: var(--emerald); }
body.buyout-dark .upper-footer-logo img,
body.buyout-dark .upper-mobile-footer-logo img { filter: brightness(0) invert(1); }   /* whiten footer logo */
/* Social row: label hidden by default, revealed on hover; SVG icon always shown.
   Re-point icons at CSS-relative paths so they resolve regardless of page docroot
   (the global sheet uses root-absolute /assets/… which 404s under /fixflo-contract-buyout/ previews). */
body.buyout-dark .social-icons .item { border-color: var(--hair); color: transparent; }
body.buyout-dark .social-icons .item:hover { color: var(--emerald); border-color: var(--emerald); }
body.buyout-dark .social-icons .item:first-of-type  { background-image: url(../images/facebook-f-brands-solid.svg); }
body.buyout-dark .social-icons .item:nth-of-type(2) { background-image: url(../images/linkedin-in-brands-solid.svg); }
body.buyout-dark .social-icons .item:nth-of-type(3) { background-image: url(../images/x-twitter-brands-solid.svg); }
body.buyout-dark .social-icons .item:nth-of-type(4) { background-image: url(../images/instagram-brands-solid.svg); }
body.buyout-dark .social-icons .item:nth-of-type(5) { background-image: url(../images/tiktok-brands-solid.svg); }
body.buyout-dark .copy-right p,
body.buyout-dark .copy-right-mobile p { color: #7d877f; }

/* ----------------------------------------------------------------------------
   "Get Started" popup recolour
   ---------------------------------------------------------------------------- */
body.buyout-dark .popup { background: var(--panel); border: 1px solid var(--hair); color: var(--ink); }
body.buyout-dark .popup-heading h2 { color: var(--ink); }
body.buyout-dark #user-type-selector {
  background: var(--slate); color: var(--ink); border: 1px solid var(--hair);
}

/* ----------------------------------------------------------------------------
   Ada chatbot — emerald accents over its existing layout
   ---------------------------------------------------------------------------- */
body.buyout-dark #chat-container .chatbot-header { background: var(--slate); }
body.buyout-dark #chat-container .chatbot-toggler { background: var(--emerald); }
/* "Let's chat!" intro: green bubble matching the chat button, white text. Clear the inner
   .incoming p white pill and tint the speech-bubble pointer the same green. */
body.buyout-dark #chat-container #intro-msg { background: var(--emerald); box-shadow: none; }
body.buyout-dark #chat-container #intro-msg::after { border-color: transparent transparent transparent var(--emerald); }
body.buyout-dark #chat-container #intro-msg p { background: transparent; color: #07140D; }

/* ----------------------------------------------------------------------------
   Recoloured CTA: reuse the .btn-epic engine, add a neon-emerald skin.
   (Keeps border-radius 5px, uppercase, 0.05em tracking, hover-flip spans.)
   ---------------------------------------------------------------------------- */
body.buyout-dark .btn-epic.emerald-btn {
  background: var(--emerald-dk);
  border: 1px solid var(--emerald);
  box-shadow: 0 0 18px rgba(0,255,102,0.35);
}
body.buyout-dark .btn-epic.emerald-btn::before { background: var(--emerald); }
body.buyout-dark .btn-epic.emerald-btn::after  { background: var(--emerald-dk); }
/* The hover-flip hides the inactive label with translateY(100%), but the base span is only
   a line tall, so on a 50px button translateY(100%) doesn't clear it and the second label
   peeks. Make each label span fill the FULL button height (flex-centred); now translateY(100%)
   shifts it a whole button-height out and overflow:hidden clips it cleanly — robust at any size. */
body.buyout-dark .btn-epic.emerald-btn span {
  color: #07140D; white-space: nowrap;
  top: 0; left: 0; height: 100%;
  display: flex; align-items: center; justify-content: center;
}
body.buyout-dark .btn-epic.emerald-btn:hover { background: var(--emerald); box-shadow: 0 0 28px rgba(0,255,102,0.6); }

/* Hero CTA + form CTA: explicit width (absolute spans can't size the button), height 50px. */
body.buyout-dark .btn-epic.emerald-btn.bo-cta-lg { width: 420px; max-width: 100%; height: 50px; }
body.buyout-dark .btn-epic.emerald-btn.form-btn  { height: 50px; }

/* ----------------------------------------------------------------------------
   Layout primitives
   ---------------------------------------------------------------------------- */
body.buyout-dark .bo-wrap { max-width: 1280px; margin: 0 auto; padding: 0 6vw; }
body.buyout-dark .bo-section { padding: 92px 0; }
body.buyout-dark .bo-eyebrow {
  font-family: "Montserrat", sans-serif; font-weight: 800; font-size: 13px;
  letter-spacing: 2.4px; text-transform: uppercase; color: var(--emerald);
}
body.buyout-dark .bo-h2 {
  font-family: "Roboto", sans-serif; font-weight: 700; color: var(--ink);
  font-size: clamp(28px, 4vw, 44px); line-height: 1.1; letter-spacing: -0.5px; margin: 14px 0 0;
}
body.buyout-dark .bo-lead { color: var(--muted); font-size: 18px; line-height: 1.6; margin: 16px 0 0; max-width: 720px; }
body.buyout-dark .bo-em { color: var(--emerald); }
body.buyout-dark .bo-center { text-align: center; }
body.buyout-dark .bo-center .bo-lead { margin-left: auto; margin-right: auto; }

/* ----------------------------------------------------------------------------
   #1 Hero (two-column)
   ---------------------------------------------------------------------------- */
body.buyout-dark .bo-hero {
  position: relative; overflow: hidden;
  background:
    radial-gradient(60% 50% at 78% 6%, rgba(0,255,102,0.10), transparent 70%),
    linear-gradient(180deg, #0E1311 0%, #0B100E 100%);
  padding-top: 40px;
}
body.buyout-dark .bo-hero-grid {
  display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 52px; align-items: center;
  padding-bottom: 36px;
}
/* Body copy + CTA, full-width across the page beneath the headline/image row */
body.buyout-dark .bo-hero-below { padding-bottom: 84px; }
body.buyout-dark .bo-kicker-row { text-align: center; margin: 16px 0 4px; }
body.buyout-dark .bo-kicker {
  display: inline-block; margin: 0; font-family: "Montserrat", sans-serif;
  font-weight: 900; font-size: 14px; letter-spacing: 3px; text-transform: uppercase;
  color: #fff; border: 1px solid var(--hair); border-radius: 999px; padding: 7px 16px;
  background: rgba(0,255,102,0.06);
}
body.buyout-dark .bo-hero h1 {
  font-family: "Roboto", sans-serif; font-weight: 700; color: var(--ink);
  font-size: clamp(38px, 5.4vw, 64px); line-height: 1.04; letter-spacing: -1.4px; margin: 20px 0 0;
}
body.buyout-dark .bo-hero .bo-sub { color: var(--muted); font-size: 19px; line-height: 1.62; margin: 0; max-width: none; }
body.buyout-dark .bo-hero .bo-sub strong { color: var(--ink); }
body.buyout-dark .bo-hero-cta { margin-top: 32px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
body.buyout-dark .bo-cta-note { font-size: 13px; color: var(--muted); }
body.buyout-dark .bo-cta-note a { color: var(--emerald); text-decoration: underline; text-underline-offset: 3px; }
body.buyout-dark .bo-prepared {
  display: inline-block; margin: 0 0 4px; font-size: 12.5px; font-weight: 700; letter-spacing: 0.4px;
  color: var(--emerald); text-transform: uppercase; font-family: "Montserrat", sans-serif;
}

/* Hero buyout graphic inside a glowing neon-emerald frame */
body.buyout-dark .bo-hero-figure { position: relative; }
body.buyout-dark .bo-hero-frame {
  position: relative; border-radius: 16px; padding: 10px;
  background: linear-gradient(150deg, rgba(0,255,102,0.5), rgba(0,194,78,0.12) 60%, rgba(0,255,102,0.35));
  box-shadow: 0 0 0 1px var(--hair), 0 24px 70px -30px rgba(0,255,102,0.45);
}
body.buyout-dark .bo-hero-frame img { border-radius: 10px; }
body.buyout-dark .bo-hero-cap { margin: 14px 2px 0; font-style: italic; font-size: 13.5px; color: #9aa39d; text-align: center; }

/* ----------------------------------------------------------------------------
   #2 Regulatory emergency banner (compliance bulletin)
   ---------------------------------------------------------------------------- */
body.buyout-dark .bo-banner {
  border-top: 1px solid rgba(255,77,77,0.4); border-bottom: 1px solid rgba(255,77,77,0.4);
  background: linear-gradient(180deg, rgba(255,77,77,0.10), rgba(255,77,77,0.03));
}
body.buyout-dark .bo-banner-inner { padding-top: 40px; padding-bottom: 40px; text-align: left; }
body.buyout-dark .bo-banner-tag {
  display: inline-flex; align-items: center; gap: 8px; font-family: "Montserrat", sans-serif;
  font-weight: 800; font-size: 12.5px; letter-spacing: 2px; text-transform: uppercase; color: var(--danger);
}
body.buyout-dark .bo-banner h2 {
  font-family: "Roboto", sans-serif; font-weight: 700; color: var(--ink);
  font-size: clamp(22px, 3vw, 32px); line-height: 1.15; margin: 12px 0 0;
}
body.buyout-dark .bo-banner p { color: #e7d6d6; font-size: 17px; line-height: 1.6; margin: 12px 0 0; max-width: 920px; }
body.buyout-dark .bo-fine {
  color: #fff; font-weight: 800; background: var(--danger);
  padding: 1px 8px; border-radius: 5px; white-space: nowrap;
}

/* ----------------------------------------------------------------------------
   #3 Meet the Squad (4-column grid)
   ---------------------------------------------------------------------------- */
body.buyout-dark .bo-squad { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin-top: 50px; }
body.buyout-dark .bo-agent {
  background: linear-gradient(180deg, var(--panel), rgba(20,27,25,0.4));
  border: 1px solid var(--hair); border-radius: 18px; padding: 28px 22px; text-align: center;
  transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
body.buyout-dark .bo-agent:hover { transform: translateY(-6px); border-color: var(--emerald); box-shadow: 0 26px 50px -28px rgba(0,255,102,0.5); }
body.buyout-dark .bo-agent-ava { width: 96px; height: 96px; margin: 0 auto 16px; border-radius: 50%; position: relative; }
body.buyout-dark .bo-agent-ava img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 2px solid var(--hair); background: var(--slate); }
body.buyout-dark .bo-agent-ava::after {
  content: ""; position: absolute; inset: -6px; border-radius: 50%;
  border: 2px solid var(--dot, var(--emerald)); opacity: .55;
}
body.buyout-dark .bo-agent h3 { font-family: "Roboto", sans-serif; color: var(--ink); font-size: 20px; font-weight: 700; margin: 0; }
body.buyout-dark .bo-agent .bo-role {
  font-family: "Montserrat", sans-serif; font-size: 11.5px; letter-spacing: 1px; text-transform: uppercase;
  color: var(--emerald); font-weight: 700; margin: 5px 0 0;
}
body.buyout-dark .bo-agent .bo-blurb { font-size: 14px; line-height: 1.55; color: var(--muted); margin: 13px 0 0; }
body.buyout-dark .bo-agent .bo-tag {
  display: inline-block; margin-top: 14px; font-size: 11.5px; color: var(--muted);
  border: 1px solid var(--hair); border-radius: 999px; padding: 4px 12px;
}

/* ----------------------------------------------------------------------------
   #4 Functional matrix (comparison table)
   ---------------------------------------------------------------------------- */
body.buyout-dark .bo-matrix-scroll { margin-top: 44px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
body.buyout-dark .bo-matrix { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 720px; font-family: "Montserrat", sans-serif; }
body.buyout-dark .bo-matrix th, body.buyout-dark .bo-matrix td { padding: 16px 20px; text-align: left; vertical-align: top; border-bottom: 1px solid rgba(255,255,255,0.06); }
body.buyout-dark .bo-matrix thead th { background: var(--slate); color: var(--ink); font-size: 14px; font-weight: 800; letter-spacing: 0.4px; }
body.buyout-dark .bo-matrix thead th:first-child { border-top-left-radius: 12px; }
body.buyout-dark .bo-matrix thead th:last-child { border-top-right-radius: 12px; }
body.buyout-dark .bo-matrix .bo-col-cap { font-weight: 700; color: var(--ink); width: 26%; }
body.buyout-dark .bo-matrix .bo-col-fixflo { color: #9aa39d; width: 37%; }
body.buyout-dark .bo-matrix .bo-col-fixifi { color: var(--muted); width: 37%; }
body.buyout-dark .bo-matrix thead .bo-col-fixifi { color: #07140D; background: var(--emerald); }
body.buyout-dark .bo-matrix tbody td.bo-col-fixifi { background: rgba(0,255,102,0.05); color: #e8fff1; }
body.buyout-dark .bo-matrix tbody tr:last-child td { border-bottom: 0; }
body.buyout-dark .bo-matrix .bo-x { color: #ff7a7a; font-weight: 800; margin-right: 6px; }
body.buyout-dark .bo-matrix .bo-check { color: var(--emerald); font-weight: 800; margin-right: 6px; }
body.buyout-dark .bo-matrix-cap { margin-top: 14px; font-size: 13px; font-style: italic; color: #828c86; }

/* ----------------------------------------------------------------------------
   #5 June Escape Clause contract hub (framed box)
   ---------------------------------------------------------------------------- */
body.buyout-dark .bo-hub-frame {
  position: relative; border-radius: 22px; padding: 1px;
  background: linear-gradient(150deg, rgba(0,255,102,0.55), rgba(0,194,78,0.10) 55%, rgba(0,255,102,0.4));
  box-shadow: 0 30px 80px -40px rgba(0,255,102,0.45);
}
body.buyout-dark .bo-hub { background: var(--panel); border-radius: 21px; padding: 52px 6%; }
body.buyout-dark .bo-hub h2 { font-family: "Roboto", sans-serif; font-weight: 700; color: var(--ink); font-size: clamp(24px,3.2vw,36px); line-height: 1.12; text-align: center; max-width: 820px; margin: 0 auto; }
body.buyout-dark .bo-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 40px; }
body.buyout-dark .bo-pillar { background: var(--char); border: 1px solid var(--hair); border-radius: 16px; padding: 26px 22px; }
body.buyout-dark .bo-pillar .bo-pillar-ic { width: 44px; height: 44px; border-radius: 11px; display: grid; place-items: center; background: rgba(0,255,102,0.12); color: var(--emerald); font-size: 20px; }
body.buyout-dark .bo-pillar h3 { font-family: "Roboto", sans-serif; color: var(--ink); font-size: 18.5px; font-weight: 700; margin: 16px 0 0; }
body.buyout-dark .bo-pillar p { color: var(--muted); font-size: 15px; line-height: 1.55; margin: 9px 0 0; }

/* ----------------------------------------------------------------------------
   #6 Dual-action conversion block
   ---------------------------------------------------------------------------- */
body.buyout-dark .bo-dual { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 8px; }
body.buyout-dark .bo-card { background: var(--panel); border: 1px solid var(--hair); border-radius: 20px; padding: 38px 34px; }
body.buyout-dark .bo-card h3 { font-family: "Roboto", sans-serif; color: var(--ink); font-size: 23px; font-weight: 700; margin: 0; }
body.buyout-dark .bo-card > p { color: var(--muted); font-size: 16px; line-height: 1.55; margin: 12px 0 22px; }
body.buyout-dark .bo-card.bo-card-emerald { border-color: var(--emerald); box-shadow: 0 0 0 1px var(--hair), 0 26px 60px -34px rgba(0,255,102,0.5); }

/* gated-PDF form: the global .contact-us-form is a white 55%-wide rounded card with 100px
   padding + flex-centring — neutralise all of that so the form sits flat in our dark .bo-card. */
body.buyout-dark .contact-us-form {
  background: transparent; border-radius: 0; padding: 0; width: 100%;
  display: block; gap: 0; box-shadow: none;
}
body.buyout-dark .contact-us-form div { width: 100%; }
body.buyout-dark .contact-us-form .bo-row { margin-bottom: 14px; }
body.buyout-dark .contact-us-form input,
body.buyout-dark .contact-us-form select {
  width: 100%; background: var(--char); border: 1px solid var(--hair); border-radius: 10px;
  box-shadow: none; color: var(--ink); font-family: "Roboto", sans-serif; font-size: 15px;
  padding: 13px 15px; outline: none;
}
body.buyout-dark .contact-us-form input::placeholder { color: #6f7a74; }
body.buyout-dark .contact-us-form input:focus,
body.buyout-dark .contact-us-form select:focus { border-color: var(--emerald); }
body.buyout-dark .contact-us-form select { -webkit-appearance: none; appearance: none; }
/* Agency type-ahead dropdown (suggestions sourced live from the portal agents table) */
body.buyout-dark .bo-agency-field { position: relative; }
body.buyout-dark .bo-agency-suggest {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 30;
  background: var(--char); border: 1px solid var(--hair); border-radius: 10px;
  max-height: 232px; overflow-y: auto; box-shadow: 0 14px 34px rgba(0, 0, 0, .45);
}
body.buyout-dark .bo-agency-suggest.open { display: block; }
body.buyout-dark .bo-agency-opt {
  padding: 11px 15px; font-family: "Roboto", sans-serif; font-size: 14.5px; color: var(--ink);
  cursor: pointer; border-bottom: 1px solid rgba(255, 255, 255, .05);
}
body.buyout-dark .bo-agency-opt:last-child { border-bottom: 0; }
body.buyout-dark .bo-agency-opt:hover,
body.buyout-dark .bo-agency-opt.active { background: rgba(0, 255, 102, .12); color: var(--emerald); }

/* Agency-selector popup (shown on the hero CTA when the agency is unknown) */
body.buyout-dark .bo-agency-modal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; }
body.buyout-dark .bo-agency-modal[hidden] { display: none; }
body.buyout-dark .bo-agency-modal-backdrop { position: absolute; inset: 0; background: rgba(4, 8, 6, .72); backdrop-filter: blur(3px); }
body.buyout-dark .bo-agency-modal-card {
  position: relative; width: 100%; max-width: 460px; background: var(--panel);
  border: 1px solid var(--hair); border-radius: 18px; padding: 34px 30px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .6); animation: bo-modal-in .18s ease-out;
}
@keyframes bo-modal-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
body.buyout-dark .bo-agency-modal-card h2 { font-family: "Roboto", sans-serif; color: var(--ink); font-size: 23px; font-weight: 700; margin: 0 0 8px; }
body.buyout-dark .bo-agency-modal-card > p { color: var(--muted); font-size: 15px; line-height: 1.5; margin: 0 0 20px; }
body.buyout-dark .bo-agency-modal-x {
  position: absolute; top: 14px; right: 16px; background: none; border: 0; cursor: pointer;
  color: var(--muted); font-size: 26px; line-height: 1; padding: 4px 8px;
}
body.buyout-dark .bo-agency-modal-x:hover { color: var(--emerald); }
body.buyout-dark .bo-agency-modal-form .form-agency {
  width: 100%; background: var(--char); border: 1px solid var(--hair); border-radius: 10px;
  color: var(--ink); font-family: "Roboto", sans-serif; font-size: 15px; padding: 13px 15px; outline: none;
}
body.buyout-dark .bo-agency-modal-form .form-agency::placeholder { color: #6f7a74; }
body.buyout-dark .bo-agency-modal-form .form-agency:focus { border-color: var(--emerald); }
body.buyout-dark .bo-agency-modal-form .form-btn { margin-top: 16px; width: 100%; }

body.buyout-dark .contact-us-form .error { color: #ff7a7a; font-size: 12.5px; margin: 5px 2px 0; padding: 0; width: 100%; min-height: 1em; }
body.buyout-dark .contact-us-form .form-btn { margin-top: 8px; }
body.buyout-dark .agent-briefing-msg { text-align: center; padding: 18px 0; }
body.buyout-dark .agent-briefing-msg h2 { color: var(--emerald); font-size: 22px; }
body.buyout-dark .agent-briefing-msg p { color: var(--muted); margin-top: 8px; }
body.buyout-dark .hidden { display: none !important; }

/* Calendly embed surface */
body.buyout-dark .bo-calendly { border-radius: 14px; overflow: hidden; min-height: 560px; background: var(--char); border: 1px solid var(--hair); }
body.buyout-dark .bo-price-line { color: var(--emerald); font-weight: 800; font-family: "Montserrat", sans-serif; letter-spacing: .4px; margin-top: 14px; font-size: 14px; }

/* ----------------------------------------------------------------------------
   Responsive
   ---------------------------------------------------------------------------- */
@media (max-width: 980px) {
  body.buyout-dark .bo-hero-grid { grid-template-columns: 1fr; gap: 36px; padding-bottom: 60px; }
  body.buyout-dark .bo-hero-figure { order: -1; }
  body.buyout-dark .bo-squad { grid-template-columns: repeat(2, 1fr); }
  body.buyout-dark .bo-pillars { grid-template-columns: 1fr; }
  body.buyout-dark .bo-dual { grid-template-columns: 1fr; }
  body.buyout-dark .bo-section { padding: 70px 0; }
}
@media (max-width: 560px) {
  body.buyout-dark .bo-squad { grid-template-columns: 1fr; }
  body.buyout-dark .bo-hero { padding-top: 108px; }
  body.buyout-dark .bo-card { padding: 30px 22px; }
  body.buyout-dark .bo-hub { padding: 38px 22px; }
}

@media (prefers-reduced-motion: reduce) {
  body.buyout-dark .bo-agent { transition: none; }
}