/* FZ premium UI — sticky menu + één rood knoppen-systeem (site-breed). Brand-rood #C8102E. */

/* ============ HEADER: sticky + premium ============ */
.elementor-location-header{
  position:-webkit-sticky;position:sticky;top:0;z-index:999;
  background:#fff;
  transition:box-shadow .25s ease, background-color .25s ease;
}
body.fz-scrolled .elementor-location-header{
  box-shadow:0 10px 30px -16px rgba(16,24,40,.28);
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(1.1) blur(12px);backdrop-filter:saturate(1.1) blur(12px);
}

/* ---- menu-links: crisp donker (premium contrast) + rode hover/actief ---- */
.elementor-nav-menu .elementor-item{color:#1b2026 !important;font-weight:600 !important;transition:color .15s ease;position:relative;}
.elementor-nav-menu .elementor-item .elementor-sub-item{color:#2a2f36 !important;}
.elementor-nav-menu .elementor-item:hover{color:#C8102E !important;}
.elementor-nav-menu .elementor-item.elementor-item-active,
.elementor-nav-menu .current-menu-item > .elementor-item,
.elementor-nav-menu .current_page_item > .elementor-item{color:#C8102E !important;}
.elementor-nav-menu > .menu-item > .elementor-item-active:after,
.elementor-nav-menu > .current-menu-item > .elementor-item:after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2.5px;border-radius:2px;background:#C8102E;
}

/* ---- header-CTA 'Contact' (id 25299a2) -> premium rode pill ---- */
.elementor-element-25299a2 .elementor-button,
.elementor-element-25299a2 .elementor-button:hover{
  background:#C8102E !important;background-image:none !important;color:#fff !important;border:0 !important;
  border-radius:999px !important;font-weight:700 !important;padding:12px 26px !important;
  box-shadow:0 10px 22px -10px rgba(200,16,46,.7) !important;
}

/* ============ KNOPPEN: één premium systeem (site-breed) ============ */
/* Basis op álle Elementor-knoppen (vorm/letter/hover) — kleur-neutraal. */
.elementor-button{
  border-radius:12px !important;font-weight:700 !important;letter-spacing:.01em;
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease, background-color .15s ease !important;
}
.elementor-button:hover{transform:translateY(-2px);filter:brightness(1.05);}
/* Standaard = primair rood. Mijn bewuste uitzonderingen (glas/donker, per element-ID met !important)
   en de hero-knoppen blijven staan dankzij hogere specificiteit. */
.elementor-button{background-color:#C8102E !important;color:#fff !important;border-color:#C8102E !important;}
.elementor-button:hover{background-color:#a50d26 !important;}

/* touch-comfort op mobiel */
@media(max-width:900px){
  .elementor-button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;}
}

/* ============ Kentekenplaat: levendig 'eruit springen' ============ */
@keyframes fz-plate-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.fzsf-plate-wrap, .fz-apk .fz-plate{
  animation:fz-plate-float 3.4s ease-in-out infinite;
  transition:transform .18s ease, box-shadow .18s ease;
  will-change:transform;
}
.fzsf-plate-wrap:hover, .fzsf-plate-wrap:focus-within, .fz-apk .fz-plate:hover{
  animation-play-state:paused;
  transform:translateY(-3px) scale(1.02);
  box-shadow:0 16px 34px -12px rgba(0,0,0,.4);
}
@media(prefers-reduced-motion:reduce){
  .fzsf-plate-wrap, .fz-apk .fz-plate{animation:none;transform:none;}
}

/* ============ Formulier: premium kaart + 2-koloms (saai -> strak) ============ */
.fzsf-form{
  background:#fff;border:1px solid #ececec;border-radius:18px;
  padding:30px 30px 26px;max-width:800px;margin:0 auto;box-sizing:border-box;
  box-shadow:0 2px 4px rgba(16,24,40,.05), 0 30px 64px -42px rgba(16,24,40,.55);
}
.fzsf-form .elementor-form-fields-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;align-items:start;}
.fzsf-form .elementor-field-group{margin:0 !important;}
/* volle breedte: kenteken, RDW-bevestigingskaart, foto's, bericht, verstuurknop */
.fzsf-form .elementor-field-group-kenteken,
.fzsf-form .elementor-field-type-upload,
.fzsf-form .elementor-field-type-textarea,
.fzsf-form .elementor-field-type-submit,
.fzsf-form .fzsf-card,
.fzsf-form [class*="-fotos"]{grid-column:1 / -1;}
/* nette velden met rode focus */
.fzsf-form .elementor-field-textual:not(.fzsf-plate){
  min-height:48px;border-radius:12px !important;border:1.5px solid #e4e6ea !important;background:#fff !important;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.fzsf-form .elementor-field-textual:not(.fzsf-plate):focus{
  border-color:#C8102E !important;box-shadow:0 0 0 3px rgba(200,16,46,.14) !important;outline:none;
}
.fzsf-form .elementor-field-label{font-weight:600 !important;color:#3a3f45 !important;margin-bottom:5px;}
/* verstuurknop = premium rood, vol breed */
.fzsf-form .elementor-field-type-submit .elementor-button{
  width:100% !important;justify-content:center;min-height:54px;font-size:16px !important;border-radius:12px !important;
}
@media(max-width:680px){
  .fzsf-form{padding:22px 18px;}
  .fzsf-form .elementor-form-fields-wrapper{grid-template-columns:1fr;}
}

/* verstuurknop echt vol-breed (beide Elementor-varianten) */
.fzsf-form .e-form__buttons{grid-column:1 / -1;display:flex;}
.fzsf-form .e-form__buttons .elementor-button{width:100% !important;}
.fzsf-form .elementor-field-type-submit{grid-column:1 / -1;}
.fzsf-form .elementor-field-type-submit .elementor-field-subgroup,
.fzsf-form .elementor-field-type-submit > .elementor-button{width:100% !important;}

/* verstuurknop-kolom: Elementor-breedte overrulen -> vol-breed in de kaart */
.fzsf-form .elementor-field-group.elementor-field-type-submit{
  width:auto !important;max-width:none !important;flex-basis:auto !important;grid-column:1 / -1 !important;
}
.fzsf-form .elementor-field-group.elementor-field-type-submit button.elementor-button{width:100% !important;}

/* strak gelijk 2-koloms: elk veld exact 1 kolom; alleen deze vol-breed */
.fzsf-form .elementor-form-fields-wrapper > .elementor-field-group{grid-column:span 1 !important;}
.fzsf-form .elementor-field-group-kenteken,
.fzsf-form .fzsf-card,
.fzsf-form .elementor-field-type-upload,
.fzsf-form [class*="-fotos"],
.fzsf-form [class*="-bericht"],
.fzsf-form [class*="-opmerking"],
.fzsf-form .elementor-field-type-textarea,
.fzsf-form .elementor-field-group.elementor-field-type-submit{grid-column:1 / -1 !important;}
/* inputs altijd vol in hun cel */
.fzsf-form .elementor-field-group .elementor-field{width:100% !important;}