body.page-template-intake .container-bg-photo-halve {
height:2350px

}

@media (min-width: 992px) {
  
  body.page-id-1802 .container-bg-photo-halve {
      height: 1395px;
  }

}

/* === Fluent Forms - Benefit Studio styling === */
/* Toegevoegd 2026-05-14 — knop in Benefit-groen, textarea ruim, inputs full-width */
.fluentform .ff-btn,
.fluentform .ff-btn-submit,
.fluentform button[type="submit"] {
  background-color: #58C97C !important;
  color: #000000 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 12px 28px !important;
  font-family: Muli, "Open Sans", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  cursor: pointer !important;
  transition: background-color .2s ease !important;
  box-shadow: none !important;
}
.fluentform .ff-btn:hover,
.fluentform .ff-btn-submit:hover,
.fluentform button[type="submit"]:hover {
  background-color: #44b369 !important;
  color: #000000 !important;
}

/* Inputs full-width met consistent kader */
.fluentform .ff-el-input--content input[type="text"],
.fluentform .ff-el-input--content input[type="email"],
.fluentform .ff-el-input--content input[type="tel"],
.fluentform .ff-el-input--content input[type="number"],
.fluentform .ff-el-input--content input[type="url"],
.fluentform .ff-el-input--content select,
.fluentform .ff-el-input--content textarea,
.fluentform input.ff-el-form-control,
.fluentform select.ff-el-form-control,
.fluentform textarea.ff-el-form-control {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  font-family: Lato, "Open Sans", sans-serif !important;
  font-size: 16px !important;
  padding: 10px 12px !important;
  border: 1px solid #8a8a8d !important;
  border-radius: 0 !important;
  background-color: #ffffff !important;
}
.fluentform .ff-el-input--content input:focus,
.fluentform .ff-el-input--content select:focus,
.fluentform .ff-el-input--content textarea:focus,
.fluentform input.ff-el-form-control:focus,
.fluentform select.ff-el-form-control:focus,
.fluentform textarea.ff-el-form-control:focus {
  border-color: #58C97C !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(88,201,124,.25) !important;
}

/* Textarea ruim genoeg voor een bericht */
.fluentform textarea,
.fluentform textarea.ff-el-form-control {
  min-height: 160px !important;
  resize: vertical !important;
}

/* Links binnen formulieren altijd onderstreept */
.fluentform a,
.fluentform .ff-el-input--label a,
.fluentform label a {
  text-decoration: underline !important;
}
.fluentform a:hover {
  text-decoration: underline !important;
}

/* GDPR-checkbox: vinkje links, tekst rechts op één regel */
.fluentform .ff-el-form-check.ff-el-tc .ff_tc_label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
}
.fluentform .ff_tc_checkbox {
  flex-shrink: 0 !important;
  margin-top: 3px !important;
}
.fluentform .ff_t_c {
  display: inline !important;
}

/* reCAPTCHA + submit-knop: scheiding + disabled-state */
.fluentform .ff-el-recaptcha,
.fluentform .ff-el-group .g-recaptcha,
.fluentform .ff-el-group:has(.g-recaptcha) {
  margin-bottom: 32px !important;
}
.fluentform button[type="submit"],
.fluentform .ff-btn-submit {
  width: 100% !important;
  padding: 16px 28px !important;
  font-size: 17px !important;
}
.fluentform button[type="submit"]:disabled,
.fluentform .ff-btn-submit:disabled,
.fluentform button[type="submit"][aria-disabled="true"],
.fluentform .ff-btn-submit[aria-disabled="true"] {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  background-color: #b5e3c4 !important;
}

/* Label "reCAPTCHA" boven widget verbergen */
.fluentform .ff-el-group:has(.g-recaptcha) > .ff-el-input--label,
.fluentform .ff-el-group:has(.g-recaptcha) > label {
  display: none !important;
}
/* === einde Fluent Forms - Benefit Studio styling === */


/* === #550 BENEFITSTUDIO diensten.php A1 + A2 — 14-06-2026 === */

/* A1: Witruimte onder ondertitel hero verkleinen (was 80px) */
body.page-id-4886 .diensten-hero {
  padding-bottom: 24px;
}

/* A2: Trainerfuncties altijd zichtbaar i.p.v. alleen op hover */
body.page-id-4886 .diensten-team-slider .image-block-outer a {
  bottom: 0 !important;
}

/* === einde #550 === */

/* === #550 BENEFITSTUDIO PT2026 video-sectie padding — 14-06-2026 === */
body.page-template-pt-pakket-2026 .container-video-info {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}
/* === einde #550 PT2026 video === */
body.page-template-pt-pakket-2026 .container-video-info video {
  background: #ededed !important;
}
@media (max-width: 767px) {
  body.page-template-pt-pakket-2026 .container-video-info {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}

/* #550 PT2026 - eerste blok (hero) wit — 15-06-2026 */
body.page-template-pt-pakket-2026 .pt2026 > div:first-child {
    background-color: #ffffff !important;
}

/* #550 PT2026 - videoblok zichtbaar lichtgrijs — 15-06-2026 */
body.page-template-pt-pakket-2026 .container-video-info {
    background-color: #ededed !important;
}

/* === #550 PT2026 hero foto padding + video centreren — 15-06-2026 v4 === */

/* Hero foto: padding binnen de div, achtergrond krimpt mee binnen het content-gebied.
   background-origin+clip zorgt dat de foto alleen binnen de padding-box wordt getoond.
   Geen margin — dat laat de foto buiten de sectie vallen. */
body.page-template-pt-pakket-2026 .block-bg-photo-halve {
    width: calc(45% - 30px) !important;
    padding: 30px 20px 30px 20px !important;
    background-size: contain !important;
    background-position: center center !important;
    background-origin: content-box !important;
    background-clip: content-box !important;
    background-color: transparent !important;
}

/* Video: gecentreerd */
body.page-template-pt-pakket-2026 .video-wrapper-a {
    display: block !important;
    margin: 0 auto !important;
}

/* === einde #550 v4 === */

/* === #550 Online PT — CSS-snippets geconsolideerd (was #111,#121,#123,#128,#129,#130,#131,#153) — 09-07-2026 === */

/* was #111 — gratis-intake (pagina 404): hero background-position */
body.page-id-404 .block-bg-photo-halve { background-position: center top !important; }
@media (max-width: 991px) {
    body.page-id-404 .block-bg-photo-halve { height: 380px !important; }
}

/* was #121 — online-pt-intake (pagina 4275): hero background-position */
body.page-id-4275 .block-bg-photo-halve { background-position: center top !important; }
@media (max-width: 991px) {
    body.page-id-4275 .block-bg-photo-halve { height: 380px !important; }
}

/* was #123 — categoriepagina (4218): CTA-knop klikbaar op mobiel */
@media (max-width: 767px) {
    body.page-id-4218 .container-cta::before,
    body.page-id-4218 .container-cta::after {
        pointer-events: none;
    }
}

/* was #128 — persona-pagina's (pt-pakket-2026.php): herofoto volle breedte op mobiel */
@media (max-width: 991px) {
    body.page-template-pt-pakket-2026 .block-bg-photo-halve {
        width: 100% !important;
    }
}

/* was #129 — categoriepagina (4218): content boven logopatroon (z-index) */
body.page-id-4218 .container-cta .col-md-5,
body.page-id-4218 .container-cta .col-md-7 {
    position: relative;
    z-index: 1;
}

/* was #130 — categoriepagina (4218): marge tussen knop en foto op mobiel */
@media (max-width: 767px) {
    body.page-id-4218 .container-cta .col-md-7 {
        margin-bottom: 30px;
    }
}

/* was #131 — persona-pagina's (pt-pakket-2026.php): herofoto full-bleed cover op mobiel */
@media (max-width: 991px) {
    body.page-template-pt-pakket-2026 .pt2026 > .container-bg-photo-halve:first-child .block-bg-photo-halve {
        padding: 0 !important;
        background-size: cover !important;
        background-position: center center !important;
    }
}

/* was #153 — categoriepagina (4218): tegelkleuren fitte-professional/mama/super-papa */
body.page-id-4218 .image-block-outer a[href*="fitte-professional"] {
    background-color: #364D45 !important;
    transition: background-color 0.2s ease;
}
body.page-id-4218 .image-block-outer a[href*="fitte-mama"] {
    background-color: #BF8C63 !important;
    transition: background-color 0.2s ease;
}
body.page-id-4218 .image-block-outer a[href*="super-papa"] {
    background-color: #000000 !important;
    transition: background-color 0.2s ease;
}
body.page-id-4218 .image-block-outer a[href*="fitte-professional"]:hover,
body.page-id-4218 .image-block-outer a[href*="fitte-mama"]:hover,
body.page-id-4218 .image-block-outer a[href*="super-papa"]:hover {
    background-color: #916548 !important;
}

/* === einde #550 Online PT CSS-consolidatie === */