/* headline + body wrapping: never leave a single word alone on the last line */
p,h1,h2,h3,h4,li,figcaption,blockquote{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}
/* Mortgages with Syd — mobile adaptive layer. Desktop styles are inline; these override below 1160px.
   NOTE: React re-serializes inline style attributes with a space after every colon and semicolon
   (e.g. "left:calc(50% - 520px)" becomes "left: calc(50% - 520px)"), and normalizes some values
   (e.g. "repeat(4,minmax(0,1fr))" becomes "repeat(4, minmax(0px, 1fr))"). Attribute selectors below
   are written to match that SERIALIZED form, not the raw source string. Elements needing compound
   (multi-property) or otherwise fragile matches get an explicit class in the template instead. */
.nav-burger{display:none}
@media (max-width:1160px){
  html{overflow-x:clip}
  body{min-width:0!important;overflow-x:clip;max-width:100vw}
  /* --- Nav --- */
  .hb{display:none}
  .mws-footer-links{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px!important;padding-top:40px!important}
  .mws-footer-links>div:first-child{grid-column:1 / -1}
  .nav-desktop{display:none!important}
  .nav-apply-m{display:inline-flex!important;align-items:center;justify-content:center;padding:9px 16px;border:1.5px solid #5F8172;border-radius:999px;background:#5F8172;color:#fff!important;font:400 13.5px 'Google Sans Flex',sans-serif;letter-spacing:.02em;text-decoration:none;white-space:nowrap}
  .nav-burger{display:none!important;align-items:center;justify-content:center;gap:7px;padding:9px 16px;border:none;border-radius:999px;background:#FCFAF5;text-decoration:none}
    .nav-burger span{font:400 13.5px 'Google Sans Flex',sans-serif;letter-spacing:.02em;color:#000}
  .nav-mobile-panel{position:fixed;top:var(--nmp-top,110px);right:14px;left:14px;z-index:39;width:auto;background:#fff;border:1px solid rgba(71,71,71,.12);border-radius:18px;box-shadow:0 24px 50px rgba(71,71,71,.2);padding:12px;display:flex;flex-direction:column;gap:1px;max-height:calc(100vh - 100px);overflow-y:auto;box-sizing:border-box}
  .nav-mobile-panel a{display:block;padding:14px 10px;font:400 17px 'Google Sans Flex',sans-serif;letter-spacing:.02em;text-transform:none;color:#000;text-decoration:none;border-radius:0}
  .nav-mobile-panel>a:not(.nmp-apply){border-bottom:1px solid rgba(71,71,71,.14)}
  .nav-mobile-panel a:active{background:#FCFAF5}
  .nav-mobile-panel a.nmp-row{display:flex!important;align-items:center;gap:11px}
  .nmp-row svg:first-child{flex:none;width:16px;height:16px}
  .nmp-ch{margin-left:auto!important;flex:none;order:99}
  .nmp-sub{display:flex;flex-direction:column;margin:1px 0 4px;background:#FCFAF5;border-radius:0;padding:3px;gap:1px}
  .nav-mobile-panel a.nmp-sub-row{display:flex!important;align-items:center;gap:11px;padding:8px 9px;border-radius:0;text-decoration:none}
  .nmp-sub-row:active{background:#fff}
  .nmp-sub-row svg{flex:none;width:16px;height:16px}
  .nmp-sub-title{display:block;font:400 17px 'Google Sans Flex',sans-serif;letter-spacing:.02em;text-transform:none;color:#000}
  .nmp-sub-desc{display:none!important}
  .nmp-apply{background:#000!important;border-radius:999px!important;margin-top:8px;justify-content:center}
  .nmp-apply .nmp-sub-title{color:#fff!important}
  .nmp-apply .nmp-sub-desc{color:rgba(255,255,255,.75)!important}
  .nmp-apply svg{stroke:#fff!important}
  div[style*="position: fixed"][style*="padding:14px 73px"]{padding:12px 16px!important}
  .mws-nav-bar img{height:22px!important}
  .mws-nav-bar>a:first-child span:first-child{font-size:20px!important}
  .mws-nav-bar>a:first-child span+span{height:22px!important}
  .mws-nav-bar>a:first-child{flex:none!important;white-space:nowrap!important;min-width:0}
  /* hide floating vertical Apply on small screens */
  a[style*="vertical-rl"]{display:none!important}
  .mws-msg-box{max-width:min(230px,calc(100vw - 118px))!important;padding:10px 13px!important}
  .mws-msg-box span[style*="13.5px"]{font-size:12px!important;line-height:1.45!important}
  .mws-msg-box .gicon{font-size:15px!important}
  /* chat + cookie sizing */
  div[style*="right: 28px; bottom: 28px"]{right:18px!important;bottom:18px!important}
  div[style*="left: 28px; bottom: 28px"]{left:14px!important;bottom:14px!important;width:calc(100% - 28px)!important;box-sizing:border-box}
  div[style*="width: 320px"]{width:min(320px,calc(100vw - 28px))!important}
  /* iOS zooms into inputs under 16px on focus; keep the chat textarea at 16px */
  div[style*="width: 320px"] textarea{font-size:16px!important}
  /* --- Generic layout collapses --- */
  div[style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr)!important}
  div[style*="repeat(4, minmax(0px, 1fr))"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
  /* keep grid children from forcing their tracks wider than the viewport */
  div[style*="grid-template-columns"]>*{min-width:0!important}
  div[style*="justify-self: start"],div[style*="justify-self: end"],div[style*="justify-self: center"]{justify-self:center!important}
  x-import[style*="justify-self: start"],x-import[style*="justify-self: end"]{justify-self:center!important}
  /* fixed-width media and cards */
  div[style*="width: 440px"],div[style*="width: 460px"]{width:100%!important;max-width:460px}
  /* pill chips that outgrow the viewport */
  div[style*="inline-flex"][style*="border-radius: 999px"]{max-width:100%;box-sizing:border-box;flex-wrap:wrap;white-space:normal}
  /* footer contact card: padding pushed it past the viewport */
  div[style*="max-width: 400px"]{box-sizing:border-box;padding:32px 24px 28px!important}
  [style*="393px"]{width:100%!important}
  [style*="228px"]{width:48%!important;height:250px!important;order:0}
  [style*="233px"]{width:48%!important;height:250px!important;order:1}
  .mws-secure-card{width:min(300px,86vw)!important;order:2;margin:-170px auto 44px!important;position:relative;z-index:3;height:auto!important;min-height:320px}
  [style*="290px"]{width:min(290px,80vw)!important}
  img[style*="380px"]{width:280px!important;height:280px!important}
  img[style*="400px"]{width:min(320px,85vw)!important;height:auto!important;aspect-ratio:1;object-fit:cover}
  div[style*="height: 520px"]{height:300px!important}
  /* "I'm Sydney" section: kill the dead space between text and cutout photo */
  div[style*="padding-left: 24px"][style*="padding-top: 84px"]{padding-bottom:0!important}
  div[style*="1.1fr"][style*="gap: 70px"]{gap:12px!important}
  div[style*="width: 400px"]{width:min(320px,85vw)!important;max-width:100%!important}
  img[src*="sydney-cutout"]{width:auto!important;height:100%!important;max-width:85vw!important}
  /* --- Home hero (class hooks, added directly in Home.dc.html) --- */
  .mws-hero{grid-template-columns:1fr!important;padding:0}
  .hero-floats{display:none!important}
  .mws-hero-left{min-height:0!important;padding:64px 24px 56px!important}
  .mws-hero .mws-embed{margin-top:30px!important}
  .mws-hero-photo{height:280px!important}
  /* about page: taller portrait crop so Sydney isn't cut off */
  .mws-hero-photo:has(#about-hero-photo){height:440px!important}
  .mws-hero-photo > div{height:100%!important}
  .mws-hero-photo > div[style*="right: 24px; top: 24px"]{width:min(190px,46vw)!important;padding:16px 14px!important}
  .mws-nav-sticker{display:none!important}
  .mws-secure-row{margin:40px 16px 0!important;flex-wrap:wrap;justify-content:center;gap:12px!important}
  div[style*="padding:220px 40px 100px"],div[style*="padding:160px 40px 100px"]{padding:84px 24px 64px!important}
  div[style*="padding:100px 40px 220px"]{padding:64px 24px 84px!important}
  /* horizontal journey strip is too tight on phones; vertical stage cards carry it */
  .mws-journey-h{display:none!important}
  /* full-bleed CTA card */
  .mws-cta-card{width:calc(100% - 40px)!important;box-sizing:border-box;padding:64px 26px 40px!important}
  /* --- How-it-works / process page --- */
  /* the desktop browser mock of the portal is too wide for phones; the phone mock beside it carries it */
  .hiw-desk-mock{display:none!important}
  .mws-trust{margin:-6px 14px 0!important;padding:14px 16px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px 12px!important;justify-items:center!important;border-radius:22px!important}
  .mws-trust>div{gap:6px!important}
  .mws-trust>div:first-child{grid-column:1/-1;justify-self:center}
  .mws-trust svg{width:14px!important;height:14px!important}
  .mws-trust div[style*="Andale Mono"]{font-size:9.5px!important;letter-spacing:.1em!important}
  /* tighten the numbered stage rows + cards */
  div[style*="gap: 26px; align-items: stretch"]{gap:14px!important}
  div[style*="padding:32px 34px"]{padding:28px 22px!important}
  div[style*="padding:60px 50px 52px"]{padding:52px 26px 48px!important}
  /* split headers that rely on row layout */
  div[style*="justify-content: space-between; align-items: center; gap: 40px"]{flex-direction:column;align-items:flex-start!important;gap:28px!important}
  /* footer */
  div[style*="justify-content: space-between; gap: 60px"]{flex-direction:column;gap:36px!important}
  div[style*="display: flex; gap: 70px"]{flex-wrap:wrap;gap:32px 40px!important}
  div[style*="text-align: right"]{text-align:center!important}
  span[style*="letter-spacing"]{white-space:normal}
  /* dense cards */
  div[style*="56px 64px"]{padding:44px 22px!important}
  div[style*="64px 70px"]{padding:48px 24px!important}
  div[style*="52px 52px"],div[style*="48px 50px"],div[style*="56px 58px"],div[style*="50px 50px"],div[style*="76px 64px"]{padding:42px 26px!important}
  /* generous section side padding */
  div[style*="padding:96px 40px"],div[style*="padding:92px 40px"],div[style*="padding:112px 40px"],div[style*="padding:132px 40px"],div[style*="padding:100px 40px"],div[style*="padding:88px 40px"]{padding-left:22px!important;padding-right:22px!important}
  div[style*="padding:84px 44px"],div[style*="padding:88px 44px"],div[style*="padding:28px 44px"]{padding-left:22px!important;padding-right:22px!important}
  div[style*="padding:44px 44px"]{padding:44px 26px!important}
  /* current heading scale: Butler at 60/76px on desktop */
  h1[style*="60px"],h2[style*="60px"],div[style*="60px"][style*="Butler"],div[style*="60px"][style*="Google Sans Flex"]{font-size:42px!important;line-height:1.06!important;letter-spacing:-.03em!important}
  h1[style*="76px"]{font-size:50px!important;line-height:1.1!important}
  h2[style*="52px"][style*="Butler"],h2[style*="52px"][style*="Google Sans Flex"],h2[style*="56px"],h2[style*="58px"]{font-size:38px!important;line-height:1.06!important}
  /* body text a touch smaller on mobile */
  p[style*="20px"]{font-size:16.5px!important;line-height:1.6!important}
  p[style*="19px"]{font-size:16px!important;line-height:1.6!important}
  div[style*="42px/1.25"]{font-size:28px!important}
  /* --- Services hero (absolute card over image) --- */
  .svc-hero{height:auto!important;display:flex;flex-direction:column}
  .svc-hero>.sc-host-x{position:relative!important;inset:auto!important;display:block;width:100%!important;height:220px!important;order:0}
  .svc-hero-card{position:static!important;width:calc(100% - 32px)!important;box-sizing:border-box;margin:-48px auto 0!important;left:auto!important;top:auto!important;order:1;z-index:3}
  /* --- Calculator CTA bands: stack + full-width button --- */
  a[style*="justify-self: end"]{justify-self:center!important;width:100%;box-sizing:border-box;text-align:center}
  div[style*="52px 50px"]{padding:42px 26px!important}
  /* blog post tables: scroll instead of crush on phones */
  article table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  article table thead,article table tbody{display:table;width:100%;min-width:480px}
  article td,article th{font-size:14px!important;padding:8px 10px!important}
  /* apply page: wider form on mobile */
  .apply-hero{padding:24px 14px 80px!important}
  .apply-form-card{padding:28px 16px!important;border-radius:18px!important}
}
@media (max-width:390px){
  div[style*="position: fixed"][style*="padding:22px 73px"]{padding:14px 16px!important;gap:12px!important}
}

/* --- Logo splash: covers the page while the runtime hydrates, on all viewports --- */
html::before{content:"";position:fixed;inset:0;z-index:9999;background:#FCFAF5 url("../img/brx-mortgage.png") center/min(220px,50vw) no-repeat;opacity:1;transition:opacity .45s ease;animation:mws-splash-safety .45s ease 3s forwards}
html.mws-ready::before{opacity:0;pointer-events:none}
@keyframes mws-splash-safety{to{opacity:0;visibility:hidden}}

@media (max-width:560px){
  .mws-nav-bar{gap:8px!important;padding:10px 14px!important}
  .mws-nav-bar img{height:26px!important}
  .nav-m-actions{gap:8px!important}
  .nav-apply-m{padding:8px 12px!important;font-size:12px!important}
  .nav-book-m{padding:8px 12px!important;font-size:12px!important}
  .mws-nav-bar>a:first-child{gap:5px!important}
  .mws-nav-bar img{height:17px!important}
  .nav-brx{display:block!important}
  .nav-brx[style*="width:1px"],span.nav-brx{display:block!important;height:16px!important}
  .mws-nav-spacer{height:62px!important}
}

@media (max-width:1160px){
  .mws-nav-bar{flex-direction:row!important;align-items:center!important;flex-wrap:nowrap!important;gap:10px!important;padding:10px 14px!important}
  .mws-nav-bar>a:first-child img{margin:0!important;height:32px!important}
  .nav-brx{display:none!important}
  span.nav-brx{display:none!important}
  .nav-m-actions{margin-left:auto;display:flex!important;flex-direction:row;align-items:center;gap:8px;flex-wrap:nowrap}
  .nav-apply-m,.nav-book-m{white-space:nowrap;justify-content:center}
  .mws-nav-spacer{height:66px!important}
  .hero-brx{display:block!important}
  .nav-book-m{display:inline-flex!important;align-items:center;justify-content:center;padding:9px 16px;border:1.5px solid #000;border-radius:999px;background:transparent;color:#000!important;font:400 13.5px 'Google Sans Flex',sans-serif;letter-spacing:.02em;text-decoration:none;white-space:nowrap}
  .nav-login-m{display:none!important}
}
@media (max-width:560px){
}


@media (max-width:760px){
  .ct-wrap{padding:0 16px!important;margin-top:44px!important}
  .ct-band-wrap{margin-top:64px!important}
  .ct-card{padding:26px 20px!important;border-radius:18px!important}
  .ct-split{grid-template-columns:minmax(0,1fr)!important;gap:26px!important}
  .ct-band{grid-template-columns:minmax(0,1fr)!important;padding:30px 22px!important;gap:22px!important}
  .ct-band>a{justify-self:stretch!important;text-align:center;justify-content:center}
}

/* ============================================================
   MOBILE GUTTER NORMALIZATION (last block wins)
   One page gutter (16px) and one card inset (22px) everywhere,
   so no two sections sit at different widths on a phone.
   ============================================================ */
@media (max-width:1160px){
  /* --- page-level gutter: 16px each side --- */
  .ct-wrap{padding-left:16px!important;padding-right:16px!important}
  .mws-hero-left{padding-left:16px!important;padding-right:16px!important}
  .apply-hero{padding-left:16px!important;padding-right:16px!important}
  .mws-secure-row{margin-left:16px!important;margin-right:16px!important}
  .mws-trust{margin-left:16px!important;margin-right:16px!important}
  .mws-cta-card{width:calc(100% - 32px)!important}
  .svc-hero-card{width:calc(100% - 32px)!important}
  .nav-mobile-panel{left:16px;right:16px}
  div[style*="padding:220px 40px 100px"],div[style*="padding:160px 40px 100px"],
  div[style*="padding:100px 40px 220px"],
  div[style*="padding:96px 40px"],div[style*="padding:92px 40px"],
  div[style*="padding:112px 40px"],div[style*="padding:132px 40px"],
  div[style*="padding:100px 40px"],div[style*="padding:88px 40px"],
  div[style*="padding:84px 44px"],div[style*="padding:88px 44px"],
  div[style*="padding:28px 44px"]{padding-left:16px!important;padding-right:16px!important}

  /* --- card inset: 22px each side --- */
  .ct-card,.apply-form-card,
  div[style*="padding:44px 44px"],div[style*="56px 64px"],div[style*="64px 70px"],
  div[style*="52px 52px"],div[style*="48px 50px"],div[style*="56px 58px"],
  div[style*="50px 50px"],div[style*="76px 64px"],div[style*="52px 50px"],
  div[style*="padding:32px 34px"],div[style*="padding:60px 50px 52px"]{padding-left:22px!important;padding-right:22px!important}

  /* bare embed blocks on the contact page: no box, page gutter only */
  .ct-embed{background:none!important;box-shadow:none!important;border:0!important;padding:0!important;border-radius:0!important}
}
@media (max-width:760px){
  .ct-wrap{padding-left:16px!important;padding-right:16px!important}
  .ct-next{grid-template-columns:minmax(0,1fr)!important}
  .ct-next-photo{order:-1;min-height:200px!important;height:200px!important}
  .ct-next-body{padding:34px 16px 32px!important;max-width:none!important;justify-self:stretch!important}
  .ct-next-wrap{margin-top:72px!important}
  .ct-card{padding-left:22px!important;padding-right:22px!important}
}
/* footer: match the sitewide 22px page gutter / 22px card inset */
@media (max-width:1160px){
  .mws-footer-cta,.mws-footer-main,.mws-footer-linkwrap,.mws-footer-bar{padding-left:16px!important;padding-right:16px!important}
  .mws-footer-cta{padding-top:80px!important;padding-bottom:72px!important}
  .mws-footer-main{padding-top:64px!important;padding-bottom:52px!important}
  .mws-footer-linkwrap{padding-bottom:84px!important}
}

/* ============================================================
   MOBILE AUDIT PASS
   ============================================================ */
@media (max-width:1160px){
  /* footer sections join the sitewide 16px page gutter */
  .mws-footer-cta,.mws-footer-main,.mws-footer-linkwrap,.mws-footer-bar{padding-left:16px!important;padding-right:16px!important}
  /* nav pills: real 44px tap targets, and never wider than the bar */
  .nav-apply-m,.nav-book-m{min-height:42px!important;padding:11px 14px!important;box-sizing:border-box}
  .nav-m-actions{min-width:0;max-width:calc(100% - 96px)}
  /* chips and filters below the 40px tap floor */
  a[data-cg-tab],a[data-blog-tab]{min-height:42px!important;display:inline-flex!important;align-items:center}
  input[type="range"]{height:30px!important}
  /* absolutely-placed mock bubbles that ran past the viewport */
  div[style*="max-width: 320px"]{max-width:100%!important}
  /* number + label rows inside dark stage cards */
  div[style*="justify-content: space-between; align-items: baseline; gap: 10px"]{flex-wrap:wrap}
  /* hero floats stay off on phones */
  .hero-floats{display:none!important}
  /* the name lockup sits under the headline in scale */
  .hero-name img,.hero-name .sc-host-x,.hero-name > *:first-child{width:30px!important;height:30px!important;flex:none}
  .hero-name span{font-size:15.5px!important}
  .mws-hero-left h1{font-size:46px!important;line-height:1.02!important;letter-spacing:-.035em!important}
}
@media (max-width:430px){
  .mws-nav-bar{gap:6px!important;padding:10px 12px!important}
  .nav-m-actions{gap:6px!important;max-width:calc(100% - 68px)!important}
  .nav-apply-m,.nav-book-m{padding:11px 10px!important;font-size:11.5px!important;letter-spacing:0!important}
  .nav-book-m{display:inline-flex!important}
}

/* mobile nav: both CTAs plus a reachable menu toggle */
@media (max-width:1160px){
  .nav-burger{display:none!important}
}
@media (max-width:430px){
  .mws-nav-bar>a:first-child img{height:24px!important}
  .nav-apply-m,.nav-book-m{padding:11px 9px!important;font-size:11px!important}
  .nav-burger{width:38px;height:38px}
  .nav-m-actions{max-width:calc(100% - 118px)!important}
}

/* the padding selectors above only matched the raw source string; React serializes
   inline styles with spaces, so these spaced twins are the ones that actually hit */
@media (max-width:1160px){
  div[style*="padding: 160px 40px 100px"]{padding:84px 22px 64px!important}
  div[style*="padding: 220px 40px 100px"]{padding:48px 22px 64px!important}
  div[style*="padding: 100px 40px 220px"]{padding:64px 22px 140px!important}
  div[style*="padding: 96px 40px"],div[style*="padding: 92px 40px"],
  div[style*="padding: 112px 40px"],div[style*="padding: 132px 40px"],
  div[style*="padding: 100px 40px"],div[style*="padding: 88px 40px"]{padding-left:22px!important;padding-right:22px!important}
  div[style*="padding: 84px 44px"],div[style*="padding: 88px 44px"],
  div[style*="padding: 28px 44px"]{padding-left:22px!important;padding-right:22px!important}
  div[style*="padding: 44px 44px"]{padding:44px 26px!important}
  /* nav CTAs: shorter on phones */
  .nav-apply-m,.nav-book-m{min-height:36px!important;padding:8px 12px!important}
}
@media (max-width:430px){
  .nav-apply-m,.nav-book-m{min-height:34px!important;padding:8px 9px!important}
}

@media (max-width:1160px){
  .mws-secure-row{margin:-140px 16px 0!important}
}