/* About page — photo as divider (design/about-page Option C). */
body.page-contact #brx-content > .brxe-section > .brxe-container, body.page-id-12272 #brx-content > .brxe-section > .brxe-container { width: 100%; max-width: 100%; }
.sabt { --sg: clamp(24px, 4vw, 80px); }

.sabt-intro { margin: 0 var(--sg); padding: 56px 0 48px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 40px; align-items: end; }
.sabt-story { grid-column: span 8; display: flex; flex-direction: column; gap: 22px; }
.sabt-story h1 { margin: 0; font-size: 54px; line-height: 62px; font-weight: 400; color: #444; }
.sabt-story p { margin: 0; max-width: 62ch; font-size: 14px; line-height: 24px; color: #0A0A0A; }
.sabt-est { grid-column: span 3 / -1; text-align: right; font-size: 12px; line-height: 17px; letter-spacing: 2px; text-transform: uppercase; color: #A3A3A3; }

.sabt-photo { width: 100%; height: clamp(320px, 37vw, 720px); background: #F1F1F1; }
.sabt-photo-img { width: 100%; height: 100%; object-fit: cover; display: block; }

.sabt-blocks { margin: 0 var(--sg); padding: 48px 0 40px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; }
.sabt-block { display: flex; flex-direction: column; gap: 12px; }
.sabt-label { font-size: 12px; line-height: 17px; letter-spacing: 2px; text-transform: uppercase; color: #A3A3A3; margin-bottom: 2px; }
.sabt-body { font-size: 14px; line-height: 24px; color: #0A0A0A; }
.sabt-link { font-size: 14px; line-height: 24px; color: #0A0A0A; text-decoration: none; }
.sabt-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.sabt-people { display: flex; flex-direction: column; gap: 12px; }
.sabt-person { display: flex; flex-direction: column; gap: 2px; }
.sabt-person-name { font-size: 14px; line-height: 20px; font-weight: 400; color: #444; }
.sabt-person-role { font-size: 12px; line-height: 17px; color: #676767; }

/* Two names on one line, email and button full width beneath. The block is a
   ~300px column in the four-across row, so a single flex row cannot hold three
   fields -- it crushed them to 34px each. */
.sabt-form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.sabt-form input[type="text"], .sabt-form input[type="email"] { min-width: 0; height: 44px; padding: 0 12px; border: 0; border-radius: 0; background: #F1F1F1; font-family: inherit; font-size: 14px; color: #0A0A0A; box-sizing: border-box; }
.sabt-form input[name="FNAME"], .sabt-form input[name="LNAME"] { flex: 1 1 calc(50% - 4px); }
.sabt-form input[name="EMAIL"] { flex: 1 1 100%; }
.sabt-form button { flex: 1 1 100%; }
.sabt-form .sabt-status, .sabt-form .sabt-consent { flex: 1 1 100%; }
.sabt-form input::placeholder { color: #A3A3A3; }
.sabt-form button { height: 44px; padding: 0 20px; border: 0; border-radius: 0; background: #555; color: #fff; font-family: inherit; font-size: 14px; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; }
.sabt-form button:hover { background: #0A0A0A; }
.sabt-hp { position: absolute; left: -5000px; }

@media (min-width: 1600px) {
  .sabt-story h1 { font-size: 62px; line-height: 70px; }
  .sabt-story p { font-size: 15px; line-height: 26px; }
}
@media (max-width: 1199px) {
  .sabt-blocks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .sabt-intro { margin: 0 24px; padding: 28px 0 24px; display: flex; flex-direction: column; gap: 10px; }
  .sabt-story h1 { font-size: 29px; line-height: 36px; }
  .sabt-est { text-align: left; }
  .sabt-photo { height: 48vw; min-height: 180px; }
  .sabt-blocks { margin: 0 24px; grid-template-columns: 1fr; gap: 28px; padding: 24px 0 16px; }
  .sabt-link { min-height: 44px; display: flex; align-items: center; }
}

/* Name fields sit above the email field; consent line closes the form. */
.sabt-consent { margin: 10px 0 0; font-size: 12px; line-height: 1.5; color: #A3A3A3; }

/* Inline signup result. Empty until the script has something to say, so it
   takes no vertical space on a form nobody has touched. */
.sabt-status { margin: 10px 0 0; font-size: 13px; line-height: 1.5; }
.sabt-status:empty { display: none; }
.sabt-status.is-working { color: #A3A3A3; }
.sabt-status.is-success { color: #1e7a45; }
.sabt-status.is-error { color: #b32d2e; }
.sabt-form button[disabled] { opacity: .55; cursor: default; }

/* The bot-trap wrapper is absolutely positioned off-screen; keep it out of the
   flex flow so it cannot claim a row. */
.sabt-hp { position: absolute; left: -5000px; width: 1px; height: 1px; overflow: hidden; }
