/* ==========================================================================
   SaniSafe LIFE pass 2026-09-23 — pages, secties, kleuren intensief
   Laadt NA contrast-goud.css. Merk: navy + cyaan (BLUE-REBRAND-20260924).
   ========================================================================== */
:root{
  --ss-glow: rgba(74,168,200,.30);
  --ss-teal: #4aa8c8;
  --ss-sky: #3B9DD9;
  --ss-mint: #2BB673;
  --ss-gold: #4aa8c8;
  --ss-ink: #0f172a;
}

/* Atmosphere */
body{
  background-color:#f4f6fa;
  background-image:
    radial-gradient(1200px 520px at 6% -12%, rgba(74,168,200,.10), transparent 58%),
    radial-gradient(980px 460px at 94% -4%, rgba(74,168,200,.14), transparent 55%),
    radial-gradient(800px 420px at 50% 110%, rgba(59,157,217,.07), transparent 50%);
}

/* Photos: levendiger zonder kitsch */
img:not([src*="logo"]):not(.no-sat):not([class*="icon"]){
  filter: saturate(1.10) contrast(1.04);
}

/* ── Section rhythm: alternating tint bands ── */
.trust-section,
.solutions-section,
.werkwijze-section,
.voordelen-section,
.faq-section,
.reviews-section,
.ba-section,
.projecten-home,
.garantie-section,
.problem-solution-section,
.lead-form-section,
.cta-section,
.extra-cta-section{
  position:relative;
}
.trust-section{ background:linear-gradient(180deg,#fff 0%, #eef3fb 100%); }
.solutions-section{ background:linear-gradient(180deg,#eef3fb 0%, #fff 100%); }
.pricing-block{
  background:linear-gradient(135deg,#202860 0%, #4aa8c8 48%, #4aa8c8 120%)!important;
  box-shadow:0 24px 60px rgba(140,110,70,.28);
}
.werkwijze-section{ background:linear-gradient(180deg,#F7FBFE 0%, #fff 100%); }
.voordelen-section{ background:#fff; }
.ba-section{ background:linear-gradient(180deg,#F3F7FB 0%, #eef3fb 100%); }
.projecten-home{ background:linear-gradient(180deg,#fff 0%, #F5FBF9 100%); }
.faq-section{ background:linear-gradient(180deg,#eef3fb 0%, #fff 100%); }
.reviews-section{ background:linear-gradient(180deg,#F7FBFE 0%, #eef3fb 100%); }
.lead-form-section,
section.lead-form,
.form-section{
  background:linear-gradient(160deg,#161c48 0%, #4aa8c8 40%, #4aa8c8 120%)!important;
  color:#fff;
}
.cta-section,.extra-cta-section{
  background:linear-gradient(135deg,#0f172a 0%, #161c48 55%, #4aa8c8 160%)!important;
}

/* Headers / titles */
.section-header h2,
.ph-head h2,
.ba-section h2,
.solutions-section h2,
.werkwijze-section h2,
.faq-section h2,
.reviews-section h2{
  letter-spacing:-.02em;
}
.section-header h2 em,
.ph-head h2 em,
.hero-highlight,
.section-title span,
.revolutionary-text span{
  background:linear-gradient(90deg,#4aa8c8,#78c8e0,#4aa8c8);
  -webkit-background-clip:text; background-clip:text; color:transparent!important;
}
.ph-eyebrow,
.section-eyebrow,
.pricing-label{
  color:var(--ss-gold)!important;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.78rem;
}

/* Cards: lift + kleurige rand accent */
.solution-card,
.voordeel-card,
.werkwijze-card,
.garantie-card,
.faq-item,
.ph-card,
.ba-project-card,
.extra-card,
.trust-item,
.review-card,
.cta-card{
  border-radius:18px!important;
  transition:transform .28s cubic-bezier(.22,1,.36,1), box-shadow .28s, border-color .28s;
  border:1px solid rgba(140,110,70,.12);
  background:#fff;
  overflow:hidden;
}
.solution-card:hover,
.voordeel-card:hover,
.werkwijze-card:hover,
.garantie-card:hover,
.ph-card:hover,
.ba-project-card:hover,
.extra-card:hover,
.cta-card:hover{
  transform:translateY(-7px);
  box-shadow:0 20px 44px rgba(44,36,32,.14);
  border-color:rgba(74,168,200,.28);
}
.solution-card:nth-child(1){ box-shadow: inset 0 3px 0 0 #4aa8c8, var(--shadow-sm,0 2px 8px rgba(0,0,0,.06)); }
.solution-card:nth-child(2){ box-shadow: inset 0 3px 0 0 #4aa8c8, var(--shadow-sm,0 2px 8px rgba(0,0,0,.06)); }
.solution-card:nth-child(3){ box-shadow: inset 0 3px 0 0 #3B9DD9, var(--shadow-sm,0 2px 8px rgba(0,0,0,.06)); }

.voordeel-card:nth-child(odd){ background:linear-gradient(180deg,#fff 70%, #eef3fb 100%); }
.voordeel-card:nth-child(even){ background:linear-gradient(180deg,#fff 70%, #eef3fb 100%); }

.werkwijze-num,
.werkwijze-icon{
  background:linear-gradient(135deg,#4aa8c8,#4aa8c8)!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(74,168,200,.22);
}
.garantie-section{
  background:linear-gradient(135deg,#161c48 0%, #202860 45%, #1e3a5f 140%)!important;
}
.garantie-badge,
.ph-badge-pair{
  background:linear-gradient(135deg,#4aa8c8,#3B9DD9)!important;
  color:#fff!important;
}
.ph-badge-date{
  background:rgba(22,28,72,.72)!important;
  backdrop-filter:blur(6px);
}
.ph-chip{
  background:#eef3fb!important;
  color:#202860!important;
  border:1px solid rgba(74,168,200,.22)!important;
}

/* Images in cards */
.solution-image img,
.ph-img img,
.ba-project-card img,
.problem-image img,
.gallery img,
.portfolio-grid img{
  transition:transform .55s cubic-bezier(.22,1,.36,1), filter .4s;
}
.solution-card:hover .solution-image img,
.ph-card:hover .ph-img img,
.ba-project-card:hover img{
  transform:scale(1.08);
  filter:saturate(1.18) contrast(1.05)!important;
}

/* Hero punch */
.hero-overlay{
  background:linear-gradient(120deg, rgba(22,28,72,.72) 0%, rgba(74,168,200,.24) 55%, rgba(74,168,200,.35) 100%)!important;
}
.hero .badge,
.hero-badges .badge{
  background:rgba(255,255,255,.16)!important;
  border:1px solid rgba(255,255,255,.28)!important;
  backdrop-filter:blur(10px);
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.hero-cta .btn,
.btn-primary,
.btn-gold,
.cta-button,
.btn.btn-primary{
  background:linear-gradient(135deg,#4aa8c8,#78c8e0)!important;
  border:none!important;
  color:#fff!important;
  box-shadow:0 12px 28px rgba(74,168,200,.35)!important;
  transition:transform .2s, box-shadow .2s!important;
}
.hero-cta .btn:hover,
.btn-primary:hover,
.btn-gold:hover,
.cta-button:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 36px rgba(74,168,200,.45)!important;
  filter:brightness(1.05);
}
.btn-outline,
.btn.btn-outline{
  border:2px solid var(--ss-teal)!important;
  color:var(--ss-teal)!important;
}
.btn-outline:hover,
.btn.btn-outline:hover{
  background:var(--ss-teal)!important;
  color:#fff!important;
}

/* Page headers (inner pages) */
.page-header{
  position:relative;
  isolation:isolate;
  min-height:220px;
  background-size:cover!important;
  background-position:center!important;
}
.page-header:before{
  content:"";
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(125deg, rgba(22,28,72,.68), rgba(74,168,200,.28) 50%, rgba(74,168,200,.40));
}
.page-header > *{ position:relative; z-index:1; }
.page-header h1,
.page-header .page-title{
  text-shadow:0 2px 18px rgba(0,0,0,.35);
}

/* Trust / stats */
.trust-item .trust-icon,
.trust-icon{
  background:linear-gradient(135deg,#eef3fb,#E6F7F6)!important;
  color:#4aa8c8!important;
  border-radius:16px;
}
.trust-stat-line strong,
.trust-content strong{
  color:#4aa8c8!important;
}

/* FAQ */
.faq-item{
  background:linear-gradient(180deg,#fff,#eef3fb)!important;
}
.faq-item:hover{ border-color:rgba(74,168,200,.4); }
.faq-item.active,
.faq-item[open]{
  border-color:var(--ss-teal)!important;
  box-shadow:0 12px 28px rgba(74,168,200,.12);
}

/* Collectie cards already styled — boost wrap */
.ss-col-wrap{
  background:linear-gradient(180deg,#eef3fb 0%, #E8F4FC 40%, #E6F7F6 100%)!important;
}

/* Brands strip */
.brands-section,
.brand-logos{
  background:#fff;
  border-top:1px solid rgba(140,110,70,.1);
  border-bottom:1px solid rgba(140,110,70,.1);
}

/* Footer soft lift */
.site-footer,
footer.footer{
  background:linear-gradient(180deg,#0f172a 0%, #1a1715 100%)!important;
}

/* Lead form on colored band: readable inputs */
.lead-form-section input,
.lead-form-section textarea,
.lead-form-section select,
section.lead-form input,
section.lead-form textarea{
  background:rgba(255,255,255,.95)!important;
  border-radius:12px!important;
  border:1px solid transparent!important;
}
.lead-form-section label,
.lead-form-section h2,
.lead-form-section p,
section.lead-form h2,
section.lead-form p,
section.lead-form label{ color:#fff!important; }

/* Pricing block text crisp */
.pricing-block,
.pricing-block *{ color:#fff!important; }
.pricing-block .btn-white{
  background:#fff!important;
  color:#161c48!important;
  font-weight:700;
  box-shadow:0 10px 28px rgba(0,0,0,.2)!important;
}

/* Mobile polish */
@media (max-width:700px){
  .solution-card:hover,
  .ph-card:hover,
  .voordeel-card:hover{ transform:translateY(-3px); }
  .page-header{ min-height:180px; }
}

/* Reduce motion */
@media (prefers-reduced-motion:reduce){
  *{ transition:none!important; }
}


/* ── Inner pages: page-hero + sections ─────────────────────────────── */
.page-hero{
  background:
    radial-gradient(900px 420px at 10% 0%, rgba(74,168,200,.28), transparent 55%),
    radial-gradient(800px 380px at 90% 20%, rgba(74,168,200,.40), transparent 50%),
    linear-gradient(135deg, #161c48 0%, #202860 40%, #4aa8c8 130%)!important;
  position:relative;
  overflow:hidden;
}
.page-hero:after{
  content:"";
  position:absolute; inset:auto -10% -40% auto;
  width:420px; height:420px;
  background:radial-gradient(circle, rgba(255,255,255,.12), transparent 70%);
  pointer-events:none;
}
.page-hero h1{ text-shadow:0 2px 20px rgba(0,0,0,.25); }
.page-hero p{ color:rgba(255,255,255,.92)!important; }

.about-section,
.offerte-section,
.contact-section,
.solution-detail,
.werkwijze-timeline,
.privacy-section{
  background:linear-gradient(180deg,#fff 0%, #f4f6fa 100%);
}
.values-section{
  background:linear-gradient(180deg,#eef3fb 0%, #eef3fb 100%)!important;
}
.numbers-section{
  background:linear-gradient(135deg,#202860 0%, #4aa8c8 50%, #4aa8c8 120%)!important;
}
.value-card,
.contact-card,
.offerte-trust-box,
.offerte-form-box,
.contact-form-box,
.offerte-contact-box{
  border-radius:18px!important;
  transition:transform .25s, box-shadow .25s, border-color .25s;
  border:1px solid rgba(140,110,70,.12);
}
.value-card:hover,
.contact-card:hover,
.offerte-contact-box:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 40px rgba(44,36,32,.12);
  border-color:rgba(74,168,200,.28);
}
.offerte-form-box,
.contact-form-box{
  box-shadow:0 20px 50px rgba(44,36,32,.10)!important;
  border-top:4px solid transparent;
  border-image:linear-gradient(90deg,#4aa8c8,#4aa8c8) 1;
}
.offerte-trust-box{
  background:linear-gradient(160deg,#eef3fb 0%, #E6F7F6 100%)!important;
}
.timeline-number{
  background:linear-gradient(135deg,#4aa8c8,#4aa8c8)!important;
  box-shadow:0 8px 20px rgba(74,168,200,.24);
}
.timeline::before{
  background:linear-gradient(180deg,#4aa8c8,#4aa8c8)!important;
}
.detail-label{
  background:linear-gradient(135deg,#E6F7F6,#eef3fb)!important;
  color:#202860!important;
}
.detail-price strong{ color:#4aa8c8!important; }
.about-image img,
.detail-image img{
  transition:transform .5s ease, filter .4s;
  filter:saturate(1.1) contrast(1.04);
}
.about-image:hover img,
.detail-image:hover img{ transform:scale(1.04); }

/* Solution detail alternating */
.solution-detail.alt-bg{
  background:linear-gradient(180deg,#F7FBFE 0%, #eef3fb 100%)!important;
}

/* Blog heroes a bit warmer */
.blog-hero__overlay{
  background:linear-gradient(0deg, rgba(22,28,72,.90) 0%, rgba(74,168,200,.28) 55%, transparent 100%)!important;
}

/* Form options selected state */
.form-option:has(input:checked){
  border-color:#4aa8c8!important;
  background:#eef3fb!important;
}
