/* 2026-10-21 round (footer part: below-the-fold + menu rules; hero rules live in the headers) */
/* Mobile compact bar: no phone icon (Figma 6098:23433); the department-coloured "Kontakt aufnehmen" stays at the bottom of the open menu */
@media (max-width:767px){html body .bn .bn-m .bn-call{display:none!important}}
/* The page ends where the footer ends: the footer template's container and its style/script-only widgets add no space */
html body .elementor-location-footer [data-id="e467336"]{padding:0!important;gap:0!important;row-gap:0!important}
html body .elementor-location-footer [data-id="e467336"] > .elementor-widget-html:not(:has(.bgf)){margin:0!important;padding:0!important;height:0!important;overflow:hidden!important}
/* USP cards (icon + overline + H3 + body), tagged by the script below */
@media (max-width:767px){.br-usp-body{font-size:14px!important;line-height:1.5!important}}
html.bm .br-usp-body{color:#151211!important}
/* Energetische Sanierung: process-card numerals in Sprossen 50% (Figma 3306:9041) */
:is([data-id="13cf2a72"],[data-id="2798e338"],[data-id="62e9ffe7"],[data-id="7ba8f959"]){color:rgba(169,221,118,.5)!important}
/* Tiny fact labels on mobile (S2 facts, house + project cards, Baudoku …), Figma 4695:28199:
   labels spread across the full row width, never closer than 12 px; 8 px between rows; 10 px icon, 4 px to the text; 10 px bold text. Tagged by the script below. */
@media (max-width:767px){
  html body .br-chips{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;justify-content:space-between!important;align-items:center!important;column-gap:12px!important;row-gap:8px!important;width:100%!important;max-width:none!important;padding-inline:0!important}
  html body .br-chip,html body .br-chip :is(.e-con,.e-con-inner,div){gap:4px!important;column-gap:4px!important;align-items:center!important;justify-content:flex-start!important;width:auto!important;min-width:0!important;padding:0!important;margin:0!important;flex-wrap:nowrap!important}
  html body .br-chip :is(p,span,h4,h5,h6){font-size:10px!important;line-height:1.4!important;font-weight:700!important;text-align:left!important;letter-spacing:0!important;white-space:nowrap!important;margin:0!important}
  html body .br-chip :is(svg,img){width:10px!important;height:10px!important;min-width:10px!important;flex:none!important}
  html body .br-chip :is(.e-svg-base,.elementor-icon,.elementor-widget-image,.e-image-base):has(svg,img){width:10px!important;height:10px!important;flex:none!important;display:flex!important}
  /* labels outside cards (S2 facts, Playlist …) read a size larger: 12 px text, 14 px icon */
  html body .br-chips--lg .br-chip :is(p,span,h4,h5,h6){font-size:12px!important}
  html body .br-chips--lg .br-chip :is(svg,img){width:14px!important;height:14px!important;min-width:14px!important}
  html body .br-chips--lg .br-chip :is(.e-svg-base,.elementor-icon,.elementor-widget-image,.e-image-base):has(svg,img){width:14px!important;height:14px!important}
}
/* Schlüsselfertig bauen: house-type open state, one style on every card (Figma 4695:28114) */
.page-id-3821 .hc .hover-content{gap:8px!important;align-items:center!important;text-align:center!important}
.page-id-3821 .hc .hover-content > p{font-size:14px!important;line-height:1.4!important;margin:0!important}
.page-id-3821 .hc .hover-content > p:first-child{color:#5B6765!important;font-weight:400!important}
.page-id-3821 .hc .hover-content > p + p{color:#151211!important;font-weight:800!important}
.page-id-3821 .hc .hover-content .e-button-base{width:auto!important;min-width:160px!important;height:36px!important;min-height:0!important;padding:0 24px!important;margin-top:16px!important;align-self:center!important;justify-content:center!important;font-size:12px!important;font-weight:700!important;letter-spacing:.06em!important;text-transform:uppercase!important}
/* Haustyp pages (Stadtvilla, Einfamilienhaus, Bungalow, Doppelhaus, Mehrfamilienhaus): house grids, Figma 4695:14262 / 4695:13751 */
:is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .hover-content:has(> p)::after{
  content:"Mehr erfahren";display:inline-flex;align-items:center;justify-content:center;align-self:center;min-width:160px;box-sizing:border-box;height:36px;padding:0 24px;margin-top:16px;
  background:#F3B900;color:#151211;font-size:12px;font-weight:700;line-height:1;letter-spacing:.06em;text-transform:uppercase;border-radius:2px}
@media (max-width:767px){
  /* stack every card full width (4 px inset, 4 px apart) instead of a sideways scroller */
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) :is(.custom-scrollbar,div:has(> .hc.sales-big)){display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;overflow:visible!important;gap:4px!important;padding:0 4px!important;width:100%!important;margin:0!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .cjs-scrollbar-wrapper:has(.hc) .cjs-scrollbar-track{display:none!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc:is(.sales-big,.hc-small){width:100%!important;min-width:0!important;max-width:none!important;height:auto!important;border:1px solid #CFD5D4!important;box-sizing:border-box!important}
  /* featured cards (Figma 220): image, title, subtitle, facts — tap opens description + CTA */
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc.sales-big .hc-img{height:320px!important;min-height:320px!important;flex:none!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc.sales-big .hc-content{padding:40px!important;gap:8px!important;align-items:center!important;text-align:center!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc.sales-big .hover-hide{display:none!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc.sales-big .hover-content{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;align-items:center!important;gap:24px!important;width:100%!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc.sales-big .hover-content > p{font-size:12px!important;line-height:1.4!important;text-align:center!important;opacity:1!important;margin:0!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc.sales-big .hover-content > a{width:auto!important;min-width:160px!important;height:36px!important;min-height:0!important;padding:0 24px!important;margin:0!important;align-self:center!important}
  /* small cards (Figma 210): image, title, tag — tap opens description + CTA */
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .hc-img{height:240px!important;min-height:240px!important;width:100%!important;flex:none!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .hc-content{padding:24px!important;gap:8px!important;align-items:flex-start!important;text-align:left!important;width:100%!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .feature-tag{font-size:12px!important;font-weight:800!important;line-height:1.4!important;padding:0!important;margin:0!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .hover-content{display:flex!important;flex-direction:column!important;align-items:flex-start!important;padding:0!important;width:100%!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .hover-content > p{display:block!important;opacity:1!important;max-height:none!important;font-size:10px!important;line-height:1.4!important;color:#5B6765!important;text-align:left!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .hover-content:has(> p)::after{align-self:flex-start;margin-top:16px}
}
/* Haustyp cards on phones + tablets: closed by default, a tap opens description + CTA (the site's .hc tap toggle sets .is-active) */
@media (max-width:1025px){
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc:is(.sales-big,.hc-small) .hover-hide{display:none!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc:is(.sales-big,.hc-small) .hover-content{max-height:0!important;opacity:0!important;overflow:hidden!important;margin-top:0!important;
    transition:max-height .5s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1),margin-top .5s cubic-bezier(.23,1,.32,1)!important}
  :is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) .hc:is(.sales-big,.hc-small).is-active .hover-content{max-height:640px!important;opacity:1!important;margin-top:16px!important}
}
/* Haustyp small cards: tag in sentence case like Figma */
:is(.page-id-2689,.page-id-2772,.page-id-2820,.page-id-2859,.page-id-2881) a.hc.hc-small .feature-tag{text-transform:none!important;letter-spacing:0!important}
/* Energy pages: "Projektbeispiel" video section on mobile, Figma 3306:7706 — text block first (48 px padding, centred),
   stats as a centred 2 × 2 grid between the rules, detail labels left-aligned, video full-bleed below (390 : 583, cover crop) */
@media (max-width:767px){
  html body :is([data-id="598fa67c"],[data-id="1e3e5811"],[data-id="5135409c"]){padding:0!important}
  html body :is([data-id="31325e39"],[data-id="6f564c0"],[data-id="27d11852"]){gap:0!important;width:100%!important}
  html body :is([data-id="4bb44dd1"],[data-id="140ee8d7"],[data-id="6a731dc8"]){padding:48px!important;gap:16px!important;align-items:stretch!important}
  html body :is([data-id="444cd560"],[data-id="74f2cc44"],[data-id="14df0a3a"]){display:grid!important;grid-template-columns:1fr 1fr!important;column-gap:24px!important;row-gap:16px!important;width:100%!important}
  html body :is([data-id="444cd560"],[data-id="74f2cc44"],[data-id="14df0a3a"]) > *{width:auto!important;align-items:center!important;text-align:center!important;gap:4px!important}
  html body :is([data-id="444cd560"],[data-id="74f2cc44"],[data-id="14df0a3a"]) p{text-align:center!important;margin:0!important}
  html body :is([data-id="444cd560"],[data-id="74f2cc44"],[data-id="14df0a3a"]) > * > div{justify-content:center!important}
  html body :is([data-id="1e94620"],[data-id="6cc4b3c2"],[data-id="76e0193a"]){flex-wrap:wrap!important;justify-content:space-between!important;column-gap:12px!important;row-gap:8px!important;width:100%!important}
  html body :is([data-id="1e94620"],[data-id="6cc4b3c2"],[data-id="76e0193a"]) > *{gap:2px!important;margin:0!important}
  html body :is([data-id="1e94620"],[data-id="6cc4b3c2"],[data-id="76e0193a"]) p{font-size:14px!important;line-height:1.4!important}
  html body :is([data-id="625477ab"],[data-id="d925715"],[data-id="17b2dc7e"]){width:100%!important;max-width:none!important;height:auto!important;aspect-ratio:390/583!important;margin:0!important;border-radius:0!important;overflow:hidden!important;animation:none!important;transform:none!important}
  html body :is([data-id="625477ab"],[data-id="d925715"],[data-id="17b2dc7e"]) iframe{position:absolute!important;top:0!important;left:50%!important;height:100%!important;width:auto!important;aspect-ratio:16/9!important;transform:translateX(-50%)!important;max-width:none!important}
}
/* Facility, mobile (Figma 4209:5827): the worker stands below the intro (never over the text), pinned to the bottom of the screen;
   "Warum BRALE Facility" is a layer with a soft shadow that slides over him; its cards stack and snap into place one by one */
@media (max-width:767px){
  .page-id-3914 [data-id="39ee17f"]{padding-bottom:48px!important;overflow:clip!important}
  .page-id-3914 [data-id="f9e1f55"] p{max-width:none!important;width:auto!important}
  .page-id-3914 [data-id="f9e1f55"]{margin-bottom:0!important}
  .page-id-3914 [data-id="0a4001c"]{display:none!important}
  .page-id-3914 .br-worker{position:sticky;top:calc(100svh - 420px);z-index:1;height:420px;margin:16px -24px 0;pointer-events:none;
    background:url("https://brale.de/wp-content/uploads/2026/09/S2-Werker.webp") no-repeat 24px 74px/300px auto,url("https://brale.de/wp-content/uploads/2026/09/vf-bg-1.svg") no-repeat 24px 0/522px auto}
  .page-id-3914 [data-id="56f1597"]{position:relative!important;z-index:3!important;background:#F9F7F5!important;margin-inline:-24px!important;margin-top:0!important;padding:48px 24px 0!important;width:auto!important;max-width:none!important;
    box-shadow:0 -16px 40px rgba(21,18,17,.10)!important}
  .page-id-3914 [data-id="56f1597"] > .stack-card{position:sticky!important;top:96px!important;scroll-snap-align:start;scroll-margin-top:96px;box-shadow:0 -8px 24px rgba(21,18,17,.06)!important}
  .page-id-3914 [data-id="56f1597"] > .stack-card:nth-of-type(3){top:104px!important;scroll-margin-top:104px}
  .page-id-3914 [data-id="56f1597"] > .stack-card:nth-of-type(4){top:112px!important;scroll-margin-top:112px}
  .page-id-3914 [data-id="56f1597"] > .stack-card:nth-of-type(5){top:120px!important;scroll-margin-top:120px}
  html:has(body.page-id-3914){scroll-snap-type:y proximity}
}
/* Facility split section: Putzweiss labels + icons, image darkened for legibility (background still visible) */
.page-id-3914 [data-id="9444068"] .tag-text{color:#F9F7F5!important}
.page-id-3914 [data-id="9444068"] :is(.tag-text,p) ~ :is(svg,.e-svg-base) path,.page-id-3914 [data-id="9444068"] .e-svg-base:has(+ .tag-text) path{fill:#F9F7F5!important}
.page-id-3914 [data-id="9444068"] .split-column:not(.br-plx-col){box-shadow:inset 0 0 0 9999px rgba(31,27,26,.4)}
.page-id-3914 [data-id="9444068"] .br-plx::after{content:"";position:absolute;inset:0;background:rgba(31,27,26,.4)}
/* Facility process cards: scrollbar inset from the screen edges, 20 % white */
.page-id-3914 [data-id="a920223"] .cjs-scrollbar-track{left:24px!important;right:24px!important;width:auto!important;background:transparent!important}
.page-id-3914 [data-id="a920223"] .cjs-scrollbar-thumb{background:rgba(255,255,255,.2)!important}
/* Bau catalogue (BRALE Interieurs) on mobile: 2 × 2 buttons like the Musterhaus pages, layout only */
@media (max-width:767px){
  html.bm body .bm-cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-flow:row!important;grid-auto-columns:auto!important;overflow:visible!important;scroll-snap-type:none!important;width:100%!important;margin:0!important;padding:32px 0 0!important;gap:8px!important}
  html.bm body .bm-cat-grid .slider-nav-card{width:auto!important;min-width:0!important;padding:16px!important;gap:8px!important;scroll-snap-align:none!important}
  html.bm body .bm-cat-grid .slider-nav-card :is(img,svg){width:20px!important;height:20px!important;flex:none!important}
}
/* Split sections everywhere: soft parallax on the background photo (layer built by the script below) */
.br-plx-col{position:relative!important;overflow:hidden!important;isolation:isolate;background-image:none!important;view-timeline-name:--brplx}
.br-plx{position:absolute;inset:-12% 0;z-index:-1;pointer-events:none;will-change:transform}
@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.br-plx{animation:brPlx linear both;animation-timeline:--brplx;animation-range:cover}}}
@keyframes brPlx{from{transform:translateY(-8%)}to{transform:translateY(8%)}}
/* Immobilienzyklus (template 9191): always full width — some page wrappers centred it and left grey bands beside it */
html body .elementor-widget-template:has([data-id="413e576"]){width:100%!important;max-width:none!important;align-self:stretch!important}
html body [data-id="413e576"]{width:100%!important;max-width:none!important}
/* Bau partner logo carousel on phones + tablets: each logo box hugs its logo so the 48 px gaps read evenly */
@media (max-width:1025px){html body .mq-partners .e-svg-base{width:auto!important;max-width:none!important;min-width:0!important}}
/* Musterhäuser: hero trust row rolls (items cloned by the script below) */
.br-mq{overflow:hidden!important;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.br-mq ul{display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;width:max-content!important;gap:0!important;animation:brMq 22s linear infinite}
.br-mq ul > li{flex:none!important;margin:0!important;padding:0 48px 0 0!important;white-space:nowrap!important}
.br-mq ul > li::after{display:none!important}
@keyframes brMq{to{transform:translateX(-50%)}}
/* it keeps its original see-through look on the brown hero (a Putzweiss band would be a thin strip over the map) */
html body.page-id-7730 [data-id="d7a13f5"]{background:transparent!important}
html body.page-id-7730 [data-id="d7a13f5"] :is(p,span,.elementor-icon-list-text){color:#CED4D3!important}
html body.page-id-7730 [data-id="d7a13f5"] svg :is(path,rect,circle,polygon,ellipse,line,polyline):not([fill="none"]){fill:#CFD5D4!important}
@media (prefers-reduced-motion:reduce){.br-mq ul{animation:none}}
/* Geschäftsbüros + Musterhäuser map pins: squares, same Corten, size and pulse */
:is(.page-id-7402,.page-id-7730) .brale-imap__pin,:is(.page-id-7402,.page-id-7730) .brale-imap__pin::before,:is(.page-id-7402,.page-id-7730) .brale-imap__pin::after{border-radius:0!important}
/* Invest hero labels: hover per label (desktop with mouse), anchor lands below the nav */
.br-inv-usp{overflow:visible!important}
.br-inv-usp .br-usp{transform-box:fill-box;transform-origin:center;transition:transform .25s cubic-bezier(.23,1,.32,1);cursor:pointer}
.br-inv-usp .br-usp-hit{fill:transparent;pointer-events:all}
@media (hover:hover) and (pointer:fine) and (min-width:1026px){.br-inv-usp .br-usp:hover{transform:scale(1.08)}}
#trust{scroll-margin-top:96px}