/* Bass Portal UI 0.1.72 — canonical Contact layer.
   Contact hub = compact Site V2 route grid. Contact children = existing form layout.
   Legacy hub split-layout/choice overrides were removed rather than superseded. */
/* Contact hub + child pages must not be clipped by the theme content wrapper.
   Site V2 / Contact V1 already own their own horizontal overflow behavior. */
body.bp-contact-hub .wp-site-blocks,
body.bp-contact-hub main#bp-page-wrap,
body.bp-contact-hub .wp-block-post-content,
body.bp-contact-child .wp-site-blocks,
body.bp-contact-child main#bp-page-wrap,
body.bp-contact-child .wp-block-post-content{overflow:visible!important;clip-path:none!important}
body.bp-contact-hub .wp-block-post-content,
body.bp-contact-child .wp-block-post-content{overflow-x:visible!important}

/* 0.1.71 — Contact child section/footer seam owner. The legacy theme leaves
   page-bottom spacing/background between main and the footer template part.
   Remove that structural gap instead of covering it with another visual layer. */
body.bp-contact-child main#bp-page-wrap,
body.bp-contact-child .wp-block-post-content{margin-bottom:0!important;padding-bottom:0!important;background:#00131c!important}
body.bp-contact-child .wp-site-blocks>main#bp-page-wrap + .wp-block-template-part{margin-block-start:0!important;margin-top:0!important}
body.bp-contact-child .bp-global-footer{margin-top:0!important;border-top:0!important}
body.bp-contact-child .bp-global-footer::before{display:none!important}

/* ---------- Contact V2 hub: layout only; card interaction is shared Site V2 ---------- */
body.bp-contact-hub .bp-contact-v2{
  min-height:0;
  background:
    radial-gradient(circle at 12% 12%,rgba(0,114,194,.12),transparent 28%),
    radial-gradient(circle at 91% 20%,rgba(255,170,28,.045),transparent 24%),
    linear-gradient(180deg,#001d2a 0%,#001722 100%);
}
body.bp-contact-hub .bp-contact-v2-main{padding:clamp(48px,4.2vw,68px) 0 clamp(54px,6vw,84px)}
body.bp-contact-hub .bp-contact-v2-intro{margin:0 0 clamp(26px,3vw,38px)}
body.bp-contact-hub .bp-contact-v2-intro h1{
  max-width:920px;margin:0;color:var(--svc-text);
  font:900 clamp(3.45rem,6.6vw,7.2rem)/.84 var(--bp-ui-font-heading,Arial,sans-serif);
  letter-spacing:-.055em;text-transform:uppercase;
}
body.bp-contact-hub .bp-contact-v2-intro h1>span{font:inherit;line-height:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--svc-blue)}
body.bp-contact-hub .bp-contact-v2-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
body.bp-contact-hub .bp-contact-v2-card{grid-column:span 4;min-height:178px}
body.bp-contact-hub .bp-contact-v2-card--studio{grid-column:span 7;min-height:196px}
body.bp-contact-hub .bp-contact-v2-card--label{grid-column:span 5;min-height:196px}
body.bp-contact-hub .bp-contact-v2-card--studio .bp-route-card-title{font-size:clamp(2rem,2.65vw,3.25rem)}

/* 0.1.72 — Contact hub responsive owner. The previous canonical block defined
   only the 12-column desktop grid; the shared Site V2 mobile collapse targets
   .bp-card-grid, not .bp-contact-v2-grid. The phone therefore kept the 7/5
   desktop spans and squeezed two cards into 375px. Repair the owning grid here. */
@media(max-width:980px){
  body.bp-contact-hub .bp-contact-v2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  body.bp-contact-hub .bp-contact-v2-card,
  body.bp-contact-hub .bp-contact-v2-card--studio,
  body.bp-contact-hub .bp-contact-v2-card--label{grid-column:auto;min-height:190px}
}
@media(max-width:760px){
  body.bp-contact-hub .bp-contact-v2-main{padding:38px 0 50px}
  body.bp-contact-hub .bp-contact-v2-intro{margin-bottom:24px}
  body.bp-contact-hub .bp-contact-v2-intro h1{font-size:clamp(3rem,15vw,4.35rem);line-height:.86}
  body.bp-contact-hub .bp-contact-v2-grid{grid-template-columns:1fr;gap:12px}
  body.bp-contact-hub .bp-contact-v2-card,
  body.bp-contact-hub .bp-contact-v2-card--studio,
  body.bp-contact-hub .bp-contact-v2-card--label{grid-column:1;min-height:188px}
  body.bp-contact-hub .bp-contact-v2-card--studio .bp-route-card-title{font-size:clamp(1.85rem,9.6vw,2.55rem)}
}

/* Exact legacy leaf list only. JS adds/removes this only for old Contact credits.
   The new hub no longer renders the legacy block, but child pages stay protected. */
body.bp-contact-tree ul.bp-contact-legacy-credits{display:none!important}

/* ---------- Contact child pages: canonical Site V2 V1 composition ----------
   One owner only. The old 42/58 image-column rules were removed rather than
   left underneath this layout. Existing page artwork is reused as the ambient
   section background; native field styling is owned by components/native-contact.css. */
body.bp-contact-child .bp-contact-form-layout{
  --bp-contact-v1-position:center center;
  position:relative!important;
  isolation:isolate!important;
  display:grid!important;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)!important;
  align-items:start!important;
  gap:clamp(34px,4.2vw,70px)!important;
  width:100vw!important;
  max-width:none!important;
  min-height:680px!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:0!important;
  padding:clamp(50px,4vw,64px) max(20px,calc((100vw - 1180px)/2)) clamp(58px,5vw,74px)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  background:#00131c!important;
}
@supports(width:100dvw){
  body.bp-contact-child .bp-contact-form-layout{
    width:100dvw!important;
    margin-left:calc(50% - 50dvw)!important;
    padding-inline:max(20px,calc((100dvw - 1180px)/2))!important;
  }
}
body.bp-contact-child .bp-contact-form-layout::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:var(--bp-contact-v1-art,linear-gradient(135deg,#06283a,#00131c)) var(--bp-contact-v1-position)/cover no-repeat}
/* Studio form height changes when package-specific fields appear/disappear.
   Size the artwork from the viewport, not from the changing section height, so the
   photo no longer zooms/jumps when a service option is switched. */
body.bp-contact-studio .bp-contact-form-layout::before{
  background-position:center top!important;
  background-size:100vw auto!important;
  background-color:#00131c!important;
}
@supports(width:100dvw){
  body.bp-contact-studio .bp-contact-form-layout::before{background-size:100dvw auto!important}
}
@media(max-width:760px){
  body.bp-contact-studio .bp-contact-form-layout::before{
    background-position:56% top!important;
    background-size:auto 100svh!important;
  }
}

body.bp-contact-child .bp-contact-form-layout::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,19,28,.91) 0%,rgba(0,19,28,.82) 44%,rgba(0,19,28,.68) 100%),
    linear-gradient(180deg,rgba(0,10,16,.10) 0%,rgba(0,13,20,.18) 50%,rgba(0,19,28,.90) 100%);
}
body.bp-contact-child .bp-contact-form-layout>.wp-block-column{
  min-width:0!important;
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  flex:none!important;
}

/* Existing left-column artwork becomes the ambient full-section media source.
   The source stays in the DOM for graceful no-JS fallback/semantics, but once
   V1 enhancement is mounted only the injected intro remains visually present. */
body.bp-contact-child .bp-contact-artwork{
  position:relative!important;
  z-index:2!important;
  align-self:start!important;
  padding-top:18px!important;
}
body.bp-contact-child .bp-contact-artwork.bp-contact-v1-mounted>:not(.bp-contact-v1-copy){display:none!important}
body.bp-contact-child .bp-contact-v1-copy{max-width:470px;color:var(--bp-ui-text)}
body.bp-contact-child .bp-contact-v1-kicker{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 18px;
  color:var(--bp-ui-amber);
  font:800 11px/1.2 var(--bp-ui-font-body);
  letter-spacing:.08em;
  text-transform:uppercase;
}
body.bp-contact-child .bp-contact-v1-kicker::before{
  content:"";
  width:28px;
  height:2px;
  flex:0 0 28px;
  background:var(--bp-ui-amber);
}
body.bp-contact-child .bp-contact-v1-title{
  margin:0 0 22px;
  max-width:8.5ch;
  color:var(--bp-ui-text);
  font:900 clamp(3.4rem,4.8vw,5.8rem)/.84 var(--bp-ui-font-heading);
  letter-spacing:-.055em;
  text-transform:uppercase;
}
/* Marketing title has two intentionally controlled lines. Never allow a theme
   overflow rule to break MARKETING or PROMOTION inside the word. */
body.bp-contact-child.bp-contact-advertising-promotion .bp-contact-v1-title{
  max-width:12ch;
  font-size:clamp(2.7rem,3.35vw,4.2rem);
  line-height:.9;
  letter-spacing:-.045em;
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
  white-space:normal!important;
}
body.bp-contact-child.bp-contact-advertising-promotion .bp-contact-v1-title .bp-contact-v1-accent{white-space:nowrap}
body.bp-contact-advertising-promotion .bp-marketing-seo-summary{
  max-width:46ch;
  margin:10px 0 0;
  color:#c4d1dd;
  font:400 14px/1.65 var(--bp-ui-font-body);
}
body.bp-contact-child .bp-contact-v1-title .bp-contact-v1-accent{
  color:var(--bp-ui-blue)!important;
  font:inherit!important;
  font-family:inherit!important;
  font-size:inherit!important;
  font-style:inherit!important;
  font-weight:inherit!important;
  line-height:inherit!important;
  letter-spacing:inherit!important;
  text-transform:inherit!important;
}
body.bp-contact-child .bp-contact-v1-lead{
  max-width:43ch;
  margin:0;
  color:#c4d1dd;
  font:400 15px/1.72 var(--bp-ui-font-body);
  letter-spacing:0;
  text-transform:none;
}
body.bp-contact-child .bp-contact-v1-rule{
  width:100%;
  max-width:420px;
  height:1px;
  margin:24px 0 16px;
  background:linear-gradient(90deg,rgba(0,114,194,.68),rgba(238,241,255,.12),transparent);
}
body.bp-contact-child .bp-contact-v1-note{
  max-width:48ch;
  margin:0;
  color:var(--bp-ui-muted);
  font:700 11px/1.55 var(--bp-ui-font-body);
  letter-spacing:.035em;
  text-transform:uppercase;
}

/* Form foreground card. This file owns page composition only;
   first-party form controls are owned by components/native-contact.css. */
body.bp-contact-child .bp-contact-form-layout>.wp-block-column:last-child,
body.bp-contact-child .bp-contact-form-panel{
  position:relative!important;
  z-index:2!important;
  align-self:start!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  align-items:stretch!important;
  min-width:0!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:clamp(28px,2.5vw,36px)!important;
  box-sizing:border-box!important;
  border:1px solid rgba(117,216,255,.20)!important;
  background:linear-gradient(145deg,rgba(4,29,41,.965),rgba(1,17,25,.975))!important;
  box-shadow:0 28px 70px rgba(0,0,0,.26),0 0 38px rgba(0,114,194,.065)!important;
}
body.bp-contact-child .bp-contact-form-panel::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:2px;
  height:54px;
  background:var(--bp-ui-blue);
  pointer-events:none;
}
body.bp-contact-child .bp-contact-form-panel>.wp-block-spacer:first-child,
body.bp-contact-child .bp-contact-form-layout>.wp-block-column:last-child>.wp-block-spacer:first-child{display:none!important}
body.bp-contact-child .bp-contact-form-title{
  margin:0 0 clamp(20px,1.8vw,28px)!important;
  color:var(--bp-ui-blue)!important;
  font:900 clamp(2.2rem,2.8vw,3.35rem)/.92 var(--bp-ui-font-heading)!important;
  letter-spacing:-.035em!important;
  text-transform:uppercase!important;
}
body.bp-contact-child .bp-contact-form-panel :is(.bpui-native-contact,.bpui-native-contact-form),
body.bp-contact-child .bp-contact-form-layout :is(.bpui-native-contact,.bpui-native-contact-form){width:100%!important;max-width:none!important;margin-top:0!important}

/* ---------- Responsive ---------- */
@media(max-width:1040px){
  body.bp-contact-child .bp-contact-form-layout{
    grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr)!important;
    gap:40px!important;
    padding-inline:32px!important;
  }
  body.bp-contact-child .bp-contact-v1-title{font-size:clamp(3rem,6vw,4.7rem)}
}

@media(max-width:820px){
  body.bp-contact-child .bp-contact-form-layout{
    grid-template-columns:1fr!important;
    gap:28px!important;
    min-height:0!important;
    padding:42px 24px 54px!important;
    background:
      linear-gradient(180deg,rgba(0,19,28,.91) 0%,rgba(0,19,28,.96) 45%,#00131c 100%),
      radial-gradient(circle at 50% 12%,rgba(0,114,194,.14),transparent 28%),
      #00131c!important;
  }
  body.bp-contact-child .bp-contact-form-layout::after{
    background:linear-gradient(180deg,rgba(0,19,28,.86) 0%,rgba(0,19,28,.92) 44%,rgba(0,19,28,.97) 100%);
  }
  body.bp-contact-child .bp-contact-artwork{padding-top:0!important}
  body.bp-contact-child .bp-contact-v1-copy{max-width:650px}
  body.bp-contact-child .bp-contact-v1-title{max-width:10ch;font-size:clamp(3rem,10vw,4.6rem)}
  body.bp-contact-child .bp-contact-v1-lead{max-width:58ch}
}

@media(max-width:760px){
  body.bp-contact-child .bp-contact-form-layout{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    padding:34px 18px 46px!important;
    box-sizing:border-box!important;
  }
  @supports(width:100dvw){
    body.bp-contact-child .bp-contact-form-layout{
      width:100dvw!important;
      max-width:100dvw!important;
      margin-left:calc(50% - 50dvw)!important;
    }
  }
  /* Mobile: keep the atmospheric page background, but remove the entire
     desktop intro/artwork column so the form starts directly under the header. */
  body.bp-contact-child .bp-contact-artwork{display:none!important}
  body.bp-contact-child .bp-contact-form-layout{gap:0!important}
  body.bp-contact-child .bp-contact-v1-kicker{font-size:10px;margin-bottom:14px}
  body.bp-contact-child .bp-contact-v1-title{margin-bottom:16px;font-size:clamp(2.75rem,13vw,4rem)}
  body.bp-contact-child .bp-contact-v1-lead{font-size:14px;line-height:1.62}
  body.bp-contact-child .bp-contact-v1-rule{margin:20px 0 14px}
  body.bp-contact-child .bp-contact-v1-note{font-size:10px}
  body.bp-contact-child .bp-contact-form-layout>.wp-block-column:last-child,
  body.bp-contact-child .bp-contact-form-panel{padding:22px 18px 26px!important}
  body.bp-contact-child .bp-contact-form-title{margin-bottom:18px!important;font-size:clamp(2rem,9vw,2.7rem)!important}

  /* Child-theme container padding must not stack with the V1 full-bleed shell. */
  body.bp-contact-tree .wp-block-post-content{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
    overflow-x:visible!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.bp-contact-child .bp-contact-form-panel{scroll-behavior:auto}
}

/* 0.2.16 — canonical post-submit confirmation for all five Contact flows.
   Matches the approved Jobs & Internships success-state language while keeping
   Contact form validation, submission and mail ownership unchanged. */
body.bp-contact-child .bp-contact-post-submit-active .bp-contact-form-title{display:none!important}
body.bp-contact-child .bp-contact-form-panel:has([data-bp-contact-success]) .bp-contact-form-title,
body.bp-contact-child .bp-contact-form-layout>.wp-block-column:last-child:has([data-bp-contact-success]) .bp-contact-form-title{display:none!important}
body.bp-contact-child .bp-contact-success{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  width:100%;
  min-height:250px;
  padding:12px 0 6px;
  color:var(--bp-ui-text);
  outline:0;
}
body.bp-contact-child .bp-contact-success-kicker{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 10px;
  color:var(--bp-ui-amber);
  font:900 12px/1.15 var(--bp-ui-font-heading);
  letter-spacing:.10em;
  text-transform:uppercase;
}
body.bp-contact-child .bp-contact-success-kicker::before{
  content:"";
  width:26px;
  height:1px;
  flex:0 0 26px;
  background:var(--bp-ui-amber);
}
body.bp-contact-child .bp-contact-success h2{
  margin:10px 0 14px!important;
  color:var(--bp-ui-blue)!important;
  font:900 clamp(2.35rem,3.5vw,4rem)/.91 var(--bp-ui-font-heading)!important;
  letter-spacing:-.04em!important;
  text-transform:uppercase!important;
}
body.bp-contact-child .bp-contact-success p{
  max-width:64ch;
  margin:0 0 25px!important;
  color:var(--bp-ui-muted-soft)!important;
  font:400 13px/1.65 var(--bp-ui-font-body)!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
body.bp-contact-child .bp-contact-success-action{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  max-width:280px!important;
  min-height:46px!important;
  margin:3px 0 0!important;
  padding:12px 18px!important;
  box-sizing:border-box!important;
  border:1px solid var(--bp-ui-blue)!important;
  border-radius:0!important;
  background:var(--bp-ui-blue)!important;
  box-shadow:none!important;
  color:#fff!important;
  font:900 12px/1 var(--bp-ui-font-heading)!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  transition:transform .18s ease,background-color .18s ease!important;
}
body.bp-contact-child .bp-contact-success-action:is(:hover,:focus-visible){
  transform:translateY(-2px);
  background:#0a85dc!important;
  color:#fff!important;
  outline:0;
}
@media(max-width:760px){
  body.bp-contact-child .bp-contact-success{min-height:210px;padding:8px 0 4px}
  body.bp-contact-child .bp-contact-success-kicker{font-size:11px}
  body.bp-contact-child .bp-contact-success h2{font-size:clamp(2.15rem,10vw,3rem)!important}
  body.bp-contact-child .bp-contact-success p{font-size:13px!important;line-height:1.6!important}
}
@media(prefers-reduced-motion:reduce){
  body.bp-contact-child .bp-contact-success-action{transition:none!important;transform:none!important}
}