/* ============================================================================
   become-a-customer.styles.css — page-specific styling (.bc-*).
   Shared foundation (tokens, fonts, nav, footer, accreditation marquee) comes
   from home.styles.css; the form UI comes from src/shared/forms.css (.jf-*).
   ============================================================================ */

/* ---- scroll reveal (JS only) --------------------------------------------- */
html.js .bc-rev{opacity:0;transform:translateY(20px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1) var(--d,0ms),transform .7s cubic-bezier(.22,.61,.36,1) var(--d,0ms)}
html.js .bc-rev.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html.js .bc-rev{opacity:1;transform:none;transition:none}}

/* ---- HERO (navy) --------------------------------------------------------- */
.bc-hero{position:relative;background:var(--ink,#0A1F4D);color:#fff;overflow:hidden;
  padding:clamp(108px,12vh,140px) 0 clamp(34px,4vw,52px)}
.bc-hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 130% at 90% -14%,rgba(236,184,76,.20),transparent 55%)}
.bc-hero-inner{position:relative;z-index:1}

.bc-crumb{margin:0 0 20px}
.bc-crumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:.5ch;margin:0;padding:0;
  font-family:'PlexMono',ui-monospace,monospace;font-size:.78rem;letter-spacing:.04em;color:rgba(255,255,255,.6)}
.bc-crumb li+li::before{content:"/";opacity:.4;margin-right:.4ch}
.bc-crumb a{color:rgba(255,255,255,.72);text-decoration:none}
.bc-crumb a:hover{color:#fff;text-decoration:underline}
.bc-crumb [aria-current="page"]{color:var(--amber,#ECB84C)}

.bc-hero-copy{max-width:60ch}
.bc-hero .bc-eyebrow .etrack span,.bc-hero .bc-eyebrow .etrack i{color:var(--amber,#ECB84C)}
.bc-hero h1{font-family:'Fraunces',Georgia,serif;font-weight:300;
  font-size:clamp(2.4rem,5.6vw,4rem);line-height:1.02;letter-spacing:-.015em;margin:6px 0 0;color:#fff}
.bc-hero h1 .r{color:var(--amber,#ECB84C)}
.bc-lead{margin:18px 0 0;max-width:64ch;font-size:clamp(1rem,1.5vw,1.16rem);line-height:1.62;color:rgba(255,255,255,.8)}
.bc-trust{list-style:none;display:flex;flex-wrap:wrap;gap:9px;margin:24px 0 0;padding:0}
.bc-trust li{font-family:'PlexMono',ui-monospace,monospace;font-size:.72rem;letter-spacing:.05em;
  text-transform:uppercase;color:rgba(255,255,255,.82);background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:6px 12px}
.bc-hero-contact{display:flex;flex-wrap:wrap;gap:12px 26px;margin:24px 0 0}
.bc-hero-contact a{display:inline-flex;align-items:center;gap:9px;color:#fff;text-decoration:none;
  font-weight:600;font-size:.96rem;border-bottom:1px solid transparent;transition:border-color .18s,color .18s}
.bc-hero-contact a:hover{color:var(--amber,#ECB84C);border-bottom-color:var(--amber,#ECB84C)}
.bc-hero-contact .bc-ci{display:grid;place-items:center;width:18px;height:18px;color:var(--amber,#ECB84C)}
.bc-hero-contact .bc-ci svg{width:18px;height:18px}

/* ---- centred hero (matches the page's centred rhythm) -------------------- */
.bc-hero-copy{max-width:74ch;margin-left:auto;margin-right:auto;text-align:center}
.bc-crumb ol{justify-content:center}
.bc-hero .bc-eyebrow{margin-left:auto;margin-right:auto}
.bc-lead{margin-left:auto;margin-right:auto}
.bc-trust{justify-content:center}
.bc-hero-contact{justify-content:center}

/* ---- FORM SECTION (light-blue) ------------------------------------------- */
.bc-formsec{background:#e3ebf8;padding:clamp(52px,7vw,92px) 0}
.bc-formhead{max-width:920px;margin:0 auto clamp(24px,3.4vw,38px);padding:0 clamp(18px,4vw,24px)}
.bc-formhead .bc-eyebrow.d .etrack span,.bc-formhead .bc-eyebrow.d .etrack i{color:var(--red,#C8102E)}
.bc-formhead h2{font-family:'Manrope',system-ui,sans-serif;font-weight:800;color:#0A1F4D;
  font-size:clamp(1.9rem,3.8vw,2.8rem);line-height:1.06;letter-spacing:-.01em;margin:10px 0 0}
.bc-formhead p{margin:12px 0 0;max-width:60ch;color:#41526d;font-size:clamp(1rem,1.4vw,1.1rem);line-height:1.6}

/* ---- ACCREDITATIONS strip ------------------------------------------------ */
.bc-accred{background:#e3ebf8;padding:clamp(8px,2vw,20px) 0 clamp(34px,5vw,58px)}