/* ===== zintex26-hero ===== */
.z26-hero{
  /* Brand */
  --z-navy:#003366; --z-white:#FFFFFF; --z-yellow:#FFE500; --z-yellow-hover:#F5D800;
  /* Supporting (pending your decision on extra colors) */
  --z-navy-900:#0A1A2E; --z-blue:#1F5FA8; --z-ink:#1B2430; --z-muted:#5B6675;
  --z-line:#DDE3EA; --z-ivory:#FBF8F3; --z-ivory-line:#E7E1D7; --z-error:#B42318;

  position:relative; overflow:hidden;
  font-family:"Open Sans",system-ui,sans-serif; font-weight:500; color:var(--z-ink);
  background:var(--z-white);
}
.z26-hero *,.z26-hero *::before,.z26-hero *::after{box-sizing:border-box}

/* ---------- Base (mobile first) ---------- */
.z26-hero__inner{max-width:1200px; margin:0 auto; padding:24px 16px 48px; display:flex; flex-direction:column; gap:20px}
.z26-hero__eyebrow{margin:0 0 12px; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--z-blue)}
.z26-hero__title{margin:0 0 12px; font-size:clamp(32px,5vw,56px); line-height:1.08; font-weight:800; letter-spacing:-.01em; color:var(--z-navy)}
.z26-hero__sub{margin:0 0 20px; font-size:clamp(17px,1.6vw,20px); line-height:1.5; color:var(--z-muted); max-width:40ch}
.z26-hero__trust{display:flex; flex-wrap:wrap; align-items:center; gap:10px 20px; font-size:14px}
.z26-hero__rating{display:inline-flex; align-items:center; gap:8px}
.z26-hero__rating strong{font-size:22px; font-weight:800; color:var(--z-navy)}
.z26-hero__stars{letter-spacing:2px; color:var(--z-navy)}
.z26-hero__rating-label,.z26-hero__trust-text{color:var(--z-muted)}

.z26-hero__media{position:relative; overflow:hidden; border-radius:14px; aspect-ratio:16/10; background:#C9D3DC}
.z26-hero__img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.z26-hero__scrim{display:none}
.z26-hero__badge{position:absolute; left:12px; bottom:12px; display:flex; flex-direction:column; gap:2px; padding:10px 14px; border-radius:12px; font-size:13px; line-height:1.35}
.z26-hero__badge strong{font-size:15px; font-weight:700}

.z26-hero__card{position:relative; border-radius:24px; padding:24px 20px; background:var(--z-white); box-shadow:0 12px 40px rgba(10,26,46,.18); scroll-margin-top:96px}
.z26-hero__card-title{margin:0 0 6px; font-size:clamp(21px,2vw,24px); line-height:1.25; font-weight:800; color:var(--z-navy)}
.z26-hero__card-intro{margin:0 0 20px; font-size:15px; line-height:1.5; color:var(--z-muted)}
.z26-hero__footnote{margin:12px 0 0; font-size:13px; color:var(--z-muted); text-align:center}
.z26-hero__card .form-title:empty{display:none}

/* ---------- HubSpot form: legacy forms (hs-form) ---------- */
.z26-hero .hs-form fieldset{max-width:none !important}
.z26-hero .hs-form .hs-form-field{margin-bottom:14px}
.z26-hero .hs-form .input{margin-right:0 !important}
.z26-hero .hs-form label:not(.hs-form-booleancheckbox-display):not(.hs-form-checkbox-display):not(.hs-form-radio-display){display:block; margin-bottom:8px; font-size:14px; font-weight:700; color:var(--z-ink)}
.z26-hero .hs-form .hs-input:not([type=checkbox]):not([type=radio]){width:100% !important; height:52px; padding:0 16px; border:1px solid var(--z-line); border-radius:8px; background:var(--z-white); font:500 17px "Open Sans",sans-serif; color:var(--z-ink)}
.z26-hero .hs-form textarea.hs-input{height:auto !important; min-height:104px; padding:12px 16px !important}
.z26-hero .hs-form .hs-input:focus{outline:3px solid var(--z-blue); outline-offset:2px; border-color:var(--z-blue)}
.z26-hero .hs-form .hs-error-msgs{list-style:none; margin:6px 0 0; padding:0}
.z26-hero .hs-form .hs-error-msg,.z26-hero .hs-form .hs-main-font-element{color:var(--z-error); font-size:14px; font-weight:600}
.z26-hero .hs-form .legal-consent-container,.z26-hero .hs-form .legal-consent-container p{font-size:12px; line-height:1.5; color:var(--z-muted)}
.z26-hero .hs-form .hs-submit .actions{margin:0; padding:0}
.z26-hero .hs-form .hs-button{width:100%; min-height:52px; padding:0 24px; border:0; border-radius:999px; background:var(--z-yellow); color:var(--z-navy); font:700 17px "Open Sans",sans-serif; cursor:pointer; transition:background .15s ease, transform .15s ease}
.z26-hero .hs-form .hs-button:hover{background:var(--z-yellow-hover); transform:translateY(-1px)}
.z26-hero .hs-form .hs-button:focus-visible{outline:3px solid var(--z-blue); outline-offset:2px}
.z26-hero .submitted-message{font-size:17px; font-weight:600; color:var(--z-navy)}

/* ---------- HubSpot form: new form editor (hsfc-) ---------- */
.z26-hero .z26-hero__card .hsfc-Renderer,
.z26-hero .z26-hero__card .hsfc-FormWrapper,
.z26-hero .z26-hero__card .hsfc-Form{font-family:"Open Sans",system-ui,sans-serif !important; width:100% !important; max-width:none !important; margin:0 !important; padding:0 !important; background:transparent !important}
.z26-hero .z26-hero__card .hsfc-Step,
.z26-hero .z26-hero__card .hsfc-Step__Content{padding:0 !important; margin:0 !important; background:transparent !important}
.z26-hero .z26-hero__card .hsfc-Row{margin:0 0 14px !important; padding:0 !important; gap:12px}
.z26-hero .z26-hero__card .hsfc-FieldLabel{display:block; margin:0 0 8px !important; font-size:14px !important; font-weight:700 !important; color:var(--z-ink) !important; line-height:1.35}
.z26-hero .z26-hero__card .hsfc-FieldLabel__RequiredIndicator{color:var(--z-error) !important}
.z26-hero .z26-hero__card .hsfc-TextInput,
.z26-hero .z26-hero__card .hsfc-PhoneInput,
.z26-hero .z26-hero__card .hsfc-DropdownInput,
.z26-hero .z26-hero__card .hsfc-TextareaInput{
  width:100% !important; min-height:52px !important; height:auto !important; padding:0 16px !important;
  border:1px solid var(--z-line) !important; border-radius:8px !important; background:var(--z-white) !important;
  font:500 17px "Open Sans",sans-serif !important; color:var(--z-ink) !important; box-shadow:none !important;
}
.z26-hero .z26-hero__card .hsfc-TextareaInput{min-height:104px !important; padding:12px 16px !important}
.z26-hero .z26-hero__card .hsfc-PhoneInput{display:flex !important; align-items:center; gap:8px; padding:0 12px !important}
.z26-hero .z26-hero__card .hsfc-PhoneInput input{border:0 !important; outline:0; background:transparent !important; height:50px; font:500 17px "Open Sans",sans-serif; color:var(--z-ink); flex:1; min-width:0}
.z26-hero .z26-hero__card .hsfc-TextInput:focus,
.z26-hero .z26-hero__card .hsfc-TextareaInput:focus,
.z26-hero .z26-hero__card .hsfc-PhoneInput:focus-within,
.z26-hero .z26-hero__card .hsfc-DropdownInput:focus{outline:3px solid var(--z-blue) !important; outline-offset:2px; border-color:var(--z-blue) !important}
.z26-hero .z26-hero__card .hsfc-ErrorAlert{margin-top:6px !important; font-size:14px !important; font-weight:600 !important; color:var(--z-error) !important}
.z26-hero .z26-hero__card .hsfc-RichText,
.z26-hero .z26-hero__card .hsfc-RichText p{font-size:12px !important; line-height:1.5 !important; color:var(--z-muted) !important}
.z26-hero .z26-hero__card .hsfc-CheckboxField label{font-size:14px !important; font-weight:500 !important; color:var(--z-ink) !important}
.z26-hero .z26-hero__card .hsfc-NavigationRow{margin:4px 0 0 !important; padding:0 !important}
.z26-hero .z26-hero__card .hsfc-NavigationRow__Buttons{display:flex !important; gap:10px; justify-content:stretch !important; width:100%}
.z26-hero .z26-hero__card .hsfc-Button{
  flex:1 1 auto; width:100% !important; min-height:52px !important; padding:0 24px !important;
  border:0 !important; border-radius:999px !important; background:var(--z-yellow) !important; background-image:none !important;
  color:var(--z-navy) !important; font:700 17px "Open Sans",sans-serif !important; box-shadow:none !important; cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
.z26-hero .z26-hero__card .hsfc-Button:hover{background:var(--z-yellow-hover) !important; transform:translateY(-1px)}
.z26-hero .z26-hero__card .hsfc-Button:focus-visible{outline:3px solid var(--z-blue) !important; outline-offset:2px}
/* Multi-step forms: when there are two buttons, the first one is "Back" */
.z26-hero .z26-hero__card .hsfc-NavigationRow__Buttons .hsfc-Button:not(:only-child):first-child{
  flex:0 0 auto; width:auto !important; background:transparent !important; color:var(--z-navy) !important;
  box-shadow:inset 0 0 0 1px var(--z-navy) !important;
}

/* ---------- Style: Clear Glass (mobile & tablet: card sits below the photo, no overlap) ---------- */
.z26-hero--glass .z26-hero__badge{background:rgba(10,26,46,.55); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.14); color:var(--z-white)}
.z26-hero--glass .z26-hero__card{margin:0; background:var(--z-white); border:1px solid var(--z-line); box-shadow:0 6px 20px rgba(10,26,46,.08)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .z26-hero--glass .z26-hero__badge{background:rgba(10,26,46,.92)}
}

/* ---------- Style: Warm & Solid (mobile) ---------- */
/* Warm uses brand colors only: navy text, yellow highlights, white/ivory grounds */
.z26-hero--warm{--z-ink:var(--z-navy); background:var(--z-ivory); color:var(--z-ink)}
.z26-hero--warm .z26-hero__eyebrow{display:inline-block; padding:6px 12px; border-radius:8px; background:var(--z-yellow); color:var(--z-navy); letter-spacing:.02em; text-transform:none; font-size:14px}
.z26-hero--warm .z26-hero__media{border-radius:22px}
.z26-hero--warm .z26-hero__badge{background:var(--z-white); color:var(--z-ink); box-shadow:0 10px 30px rgba(60,45,20,.14)}
.z26-hero--warm .z26-hero__badge strong{color:var(--z-navy)}
.z26-hero--warm .z26-hero__card{border:1px solid var(--z-ivory-line); border-radius:16px; box-shadow:0 6px 20px rgba(60,45,20,.08)}
.z26-hero--warm .hs-form .hs-button{border-radius:12px; background:var(--z-navy); color:var(--z-white)}
.z26-hero--warm .hs-form .hs-button:hover{background:var(--z-navy-900)}
.z26-hero--warm .z26-hero__card .hsfc-Button{border-radius:12px !important; background:var(--z-navy) !important; color:var(--z-white) !important}
.z26-hero--warm .z26-hero__card .hsfc-Button:hover{background:var(--z-navy-900) !important}
.z26-hero--warm .z26-hero__card .hsfc-NavigationRow__Buttons .hsfc-Button:not(:only-child):first-child{background:var(--z-white) !important; color:var(--z-navy) !important}

/* ---------- Tablet ---------- */
@media (min-width:640px){
  .z26-hero__inner{padding:32px 32px 64px}
  .z26-hero--glass .z26-hero__card{padding:28px}
}

/* ---------- Desktop: Clear Glass (frosted card floats over the full-bleed photo) ---------- */
@media (min-width:960px){
  .z26-hero--glass{min-height:640px; display:flex; align-items:center; background:var(--z-navy-900)}
  .z26-hero--glass .z26-hero__inner{position:static; width:100%; flex-direction:row; align-items:center; gap:48px; padding:88px 32px}
  .z26-hero--glass .z26-hero__media{position:absolute; inset:0; border-radius:0; aspect-ratio:auto}
  .z26-hero--glass .z26-hero__scrim{display:block; position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,26,46,.82) 0%,rgba(10,26,46,.55) 42%,rgba(10,26,46,0) 70%)}
  .z26-hero--glass .z26-hero__badge{left:auto; right:24px; bottom:24px}
  .z26-hero--glass .z26-hero__copy,
  .z26-hero--glass .z26-hero__card{position:relative; z-index:1}
  .z26-hero--glass .z26-hero__copy{flex:1 1 auto}
  .z26-hero--glass .z26-hero__eyebrow{color:var(--z-yellow)}
  .z26-hero--glass .z26-hero__title{color:var(--z-white); max-width:16ch}
  .z26-hero--glass .z26-hero__sub{color:rgba(255,255,255,.88)}
  .z26-hero--glass .z26-hero__rating strong,
  .z26-hero--glass .z26-hero__stars{color:var(--z-white)}
  .z26-hero--glass .z26-hero__rating-label,
  .z26-hero--glass .z26-hero__trust-text{color:rgba(255,255,255,.85)}
  .z26-hero--glass .z26-hero__card{
    flex:0 0 400px; margin:0; padding:32px;
    background:rgba(255,255,255,.78); -webkit-backdrop-filter:blur(16px) saturate(140%); backdrop-filter:blur(16px) saturate(140%);
    border:1px solid rgba(255,255,255,.6); box-shadow:0 12px 40px rgba(10,26,46,.18);
  }
}
@media (min-width:960px){
  @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    .z26-hero--glass .z26-hero__card{background:var(--z-white)}
  }
}

/* ---------- Desktop: Warm & Solid ---------- */
@media (min-width:960px){
  .z26-hero--warm .z26-hero__inner{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); grid-template-areas:"copy media" "card media"; column-gap:56px; row-gap:24px; padding:56px 32px 96px}
  .z26-hero--warm .z26-hero__copy{grid-area:copy; align-self:end}
  .z26-hero--warm .z26-hero__media{grid-area:media; aspect-ratio:auto; min-height:540px}
  .z26-hero--warm .z26-hero__badge{left:20px; bottom:24px; padding:16px 20px}
  .z26-hero--warm .z26-hero__card{grid-area:card; align-self:start; max-width:480px; padding:28px}
}

@media (prefers-reduced-motion:reduce){
  .z26-hero .hs-form .hs-button,.z26-hero .z26-hero__card .hsfc-Button{transition:none}
  .z26-hero .hs-form .hs-button:hover,.z26-hero .z26-hero__card .hsfc-Button:hover{transform:none}
}