/*
  EXTERIX — Gevelreiniging pagina
  Pagina-specifieke styling.
  Dit bestand wordt alleen geladen op gevelreiniging.html.
*/

body.gevel-v132-page{
  background:
    radial-gradient(circle at 12% 10%, rgba(0,168,255,.16), transparent 28%),
    radial-gradient(circle at 86% 16%, rgba(140,198,63,.13), transparent 28%),
    radial-gradient(circle at 80% 78%, rgba(0,210,180,.10), transparent 30%),
    linear-gradient(180deg,#07111d 0%,#081422 38%,#07111b 100%) !important;
}
.gevel-v132-main{
  padding-top:74px;
  padding-bottom:90px;
}
.gevel-v132-main section[id],
.gevel-v132-main #dienst-offerte{
  scroll-margin-top:132px;
}
.gevel-v132-main .gx-hero,
.gevel-v132-main .gx-card,
.gevel-v132-main .gx-step,
.gevel-v132-main .gx-faq details,
.gevel-v132-main .gx-quote-side,
.gevel-v132-main .gx-quote-form,
.gevel-v132-main .gx-process-card,
.gevel-v132-main .gx-zone-card,
.gevel-v132-main .gx-service-card,
.gevel-v132-main .gx-shell,
.gevel-v132-main .gx-compare-box,
.gevel-v132-main .gx-premium-band{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:
    0 22px 68px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.06);
  background:
    linear-gradient(180deg, rgba(8,22,39,.84), rgba(5,15,29,.68)),
    linear-gradient(135deg, rgba(0,168,255,.055), rgba(140,198,63,.038));
}
.gevel-v132-main .gx-card::after,
.gevel-v132-main .gx-step::after,
.gevel-v132-main .gx-faq details::after,
.gevel-v132-main .gx-service-card::after,
.gevel-v132-main .gx-zone-card::after,
.gevel-v132-main .gx-process-card::after,
.gevel-v132-main .gx-shell::after,
.gevel-v132-main .gx-compare-box::after,
.gevel-v132-main .gx-premium-band::after{
  content:"";
  position:absolute;
  inset:-1px;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 0%, rgba(255,255,255,.075) 42%, transparent 62%);
  opacity:0;
  transform:translateX(-18%);
  transition:opacity .28s ease, transform .45s ease;
}
.gevel-v132-main .gx-card:hover::after,
.gevel-v132-main .gx-step:hover::after,
.gevel-v132-main .gx-faq details:hover::after,
.gevel-v132-main .gx-service-card:hover::after,
.gevel-v132-main .gx-zone-card:hover::after,
.gevel-v132-main .gx-process-card:hover::after,
.gevel-v132-main .gx-shell:hover::after,
.gevel-v132-main .gx-compare-box:hover::after,
.gevel-v132-main .gx-premium-band:hover::after{
  opacity:1;
  transform:translateX(18%);
}
.gevel-v132-main .gx-card:hover,
.gevel-v132-main .gx-step:hover,
.gevel-v132-main .gx-service-card:hover,
.gevel-v132-main .gx-zone-card:hover,
.gevel-v132-main .gx-process-card:hover,
.gevel-v132-main .gx-shell:hover,
.gevel-v132-main .gx-compare-box:hover{
  border-color:rgba(140,198,63,.22);
  box-shadow:
    0 26px 76px rgba(0,0,0,.34),
    0 0 28px rgba(140,198,63,.055),
    inset 0 1px 0 rgba(255,255,255,.08);
  transform:translateY(-2px);
}
.gevel-v132-main .gx-card,
.gevel-v132-main .gx-step,
.gevel-v132-main .gx-service-card,
.gevel-v132-main .gx-zone-card,
.gevel-v132-main .gx-process-card,
.gevel-v132-main .gx-shell,
.gevel-v132-main .gx-compare-box{
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.gevel-v132-main .gx-hero{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
  gap:26px;
  padding:26px;
  border-radius:36px;
  margin-bottom:18px;
}
.gevel-v132-main .gx-hero::before{
  content:"";
  position:absolute;
  inset:-18%;
  pointer-events:none;
  filter:blur(28px);
  background:
    radial-gradient(circle at 16% 18%, rgba(0,168,255,.18), transparent 28%),
    radial-gradient(circle at 83% 17%, rgba(140,198,63,.16), transparent 27%),
    radial-gradient(circle at 70% 84%, rgba(0,210,180,.10), transparent 30%);
}
.gevel-v132-main .gx-hero > *{position:relative;z-index:1}
.gevel-v132-main .gx-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 14px;
  border-radius:999px;
  color:#fff;
  font-size:12px;
  font-weight:950;
  letter-spacing:.09em;
  text-transform:uppercase;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.11);
}
.gevel-v132-main .gx-eyebrow::before{
  content:"";
  width:8px;height:8px;border-radius:999px;
  background:linear-gradient(135deg,#00a8ff,#8cc63f);
  box-shadow:0 0 14px rgba(140,198,63,.24);
}
.gevel-v132-main .gx-copy{
  padding:18px 20px 18px 20px;
}
.gevel-v132-main .gx-copy h1{
  margin:16px 0 16px;
  max-width:900px;
  font-size:clamp(42px,5.3vw,82px);
  line-height:.93;
  letter-spacing:-.07em;
}
.gevel-v132-main .gx-copy .lead{
  margin:0;
  max-width:760px;
  color:rgba(236,244,255,.79);
  font-size:18px;
  line-height:1.78;
}
.gevel-v132-main .gx-highlights{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:28px 0 28px;
}
.gevel-v132-main .gx-highlight{
  min-height:58px;
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
  color:#fff;
  font-weight:840;
  line-height:1.45;
}
.gevel-v132-main .gx-highlight small{
  display:block;
  margin-top:4px;
  color:rgba(236,244,255,.60);
  font-weight:760;
}
.gevel-v132-main .gx-hero-side{
  display:grid;
  gap:14px;
  align-content:start;
}
.gevel-v132-main .gx-shell{
  padding:24px;
  border-radius:28px;
}
.gevel-v132-main .gx-shell h3,
.gevel-v132-main h3.gx-title,
.gevel-v132-main .gx-card h3,
.gevel-v132-main .gx-zone-card h3,
.gevel-v132-main .gx-service-card h3,
.gevel-v132-main .gx-process-card h3,
.gevel-v132-main .gx-step h3{
  margin:0 0 10px;
  color:#fff;
  font-size:22px;
  line-height:1.18;
  letter-spacing:-.025em;
}
.gevel-v132-main .gx-shell p,
.gevel-v132-main .gx-shell li,
.gevel-v132-main .gx-card p,
.gevel-v132-main .gx-card li,
.gevel-v132-main .gx-zone-card p,
.gevel-v132-main .gx-zone-card li,
.gevel-v132-main .gx-service-card p,
.gevel-v132-main .gx-service-card li,
.gevel-v132-main .gx-process-card p,
.gevel-v132-main .gx-process-card li,
.gevel-v132-main .gx-step p,
.gevel-v132-main .gx-step li{
  color:rgba(236,244,255,.76);
  line-height:1.72;
}
.gevel-v132-main .gx-shell ul,
.gevel-v132-main .gx-card ul,
.gevel-v132-main .gx-service-card ul,
.gevel-v132-main .gx-zone-card ul,
.gevel-v132-main .gx-process-card ul{
  list-style:none;
  padding:0;
  margin:14px 0 0;
}
.gevel-v132-main .gx-shell li,
.gevel-v132-main .gx-card li,
.gevel-v132-main .gx-service-card li,
.gevel-v132-main .gx-zone-card li,
.gevel-v132-main .gx-process-card li{
  position:relative;
  padding-left:20px;
  margin:9px 0;
}
.gevel-v132-main .gx-shell li::before,
.gevel-v132-main .gx-card li::before,
.gevel-v132-main .gx-service-card li::before,
.gevel-v132-main .gx-zone-card li::before,
.gevel-v132-main .gx-process-card li::before{
  content:"";
  position:absolute;
  left:0; top:.72em;
  width:6px;height:6px;border-radius:999px;
  background:#8cc63f;
}
.gevel-v132-main .gx-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:18px 0 38px;
}
.gevel-v132-main .gx-metric{
  padding:24px 20px;
  border-radius:24px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
}
.gevel-v132-main .gx-metric strong{
  display:block;
  color:#fff;
  font-size:30px;
  line-height:1;
  margin-bottom:8px;
  letter-spacing:-.04em;
}
.gevel-v132-main .gx-metric span{
  color:rgba(236,244,255,.62);
  font-weight:760;
  line-height:1.46;
}
.gevel-v132-main .gx-section{
  margin-top:36px;
}
.gevel-v132-main .gx-head{
  max-width:940px;
  margin-bottom:20px;
}
.gevel-v132-main .gx-head h2{
  margin:10px 0;
  font-size:clamp(32px,3.8vw,56px);
  line-height:1.02;
  letter-spacing:-.055em;
}
.gevel-v132-main .gx-head p{
  color:rgba(236,244,255,.76);
  font-size:16.5px;
  line-height:1.76;
}
.gevel-v132-main .gx-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.gevel-v132-main .gx-grid.two{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.gevel-v132-main .gx-card,
.gevel-v132-main .gx-zone-card,
.gevel-v132-main .gx-service-card,
.gevel-v132-main .gx-process-card{
  padding:26px;
  border-radius:28px;
}
.gevel-v132-main .gx-icon{
  width:46px;height:46px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
  color:#fff;font-weight:950;
  background:rgba(140,198,63,.13);
  border:1px solid rgba(255,255,255,.10);
}
.gevel-v132-main .gx-steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  counter-reset:gxstep;
}
.gevel-v132-main .gx-step{
  counter-increment:gxstep;
  padding:24px;
  border-radius:24px;
  background:rgba(255,255,255,.046);
}
.gevel-v132-main .gx-step::before{
  content:counter(gxstep, decimal-leading-zero);
  display:inline-flex;
  align-items:center;justify-content:center;
  width:48px;height:36px;
  border-radius:999px;
  margin-bottom:16px;
  color:#fff;font-weight:950;
  background:rgba(0,168,255,.13);
  border:1px solid rgba(0,168,255,.25);
}
.gevel-v132-main .gx-compare{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.gevel-v132-main .gx-compare-box{
  padding:28px;
  border-radius:28px;
}
.gevel-v132-main .gx-compare-box.bad{opacity:.84}
.gevel-v132-main .gx-compare-box ul{
  list-style:none;
  padding:0;
  margin:0;
}
.gevel-v132-main .gx-compare-box li{
  position:relative;
  padding-left:24px;
  margin:12px 0;
  color:rgba(236,244,255,.74);
}
.gevel-v132-main .gx-compare-box.good li::before{
  content:"✓";
  position:absolute;left:0;color:#8cc63f;font-weight:950;
}
.gevel-v132-main .gx-compare-box.bad li::before{
  content:"–";
  position:absolute;left:0;color:rgba(236,244,255,.42);font-weight:950;
}
.gevel-v132-main .gx-premium-band{
  margin-top:36px;
  padding:32px;
  border-radius:30px;
  background:
    radial-gradient(circle at 16% 18%, rgba(0,168,255,.14), transparent 30%),
    radial-gradient(circle at 86% 18%, rgba(140,198,63,.13), transparent 28%),
    linear-gradient(180deg, rgba(8,22,39,.88), rgba(5,15,29,.72));
}
.gevel-v132-main .gx-premium-band h2{
  margin:10px 0 12px;
  max-width:860px;
  font-size:clamp(30px,3.4vw,50px);
  line-height:1;
  letter-spacing:-.05em;
}
.gevel-v132-main .gx-premium-band p{
  max-width:760px;
  color:rgba(236,244,255,.76);
  line-height:1.72;
}
.gevel-v132-main .gx-faq{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.gevel-v132-main .gx-faq details{
  border-radius:22px;
}
.gevel-v132-main .gx-faq details[open]{
  border-color:rgba(140,198,63,.28);
}
.gevel-v132-main .gx-faq summary{
  position:relative;
  cursor:pointer;
  padding:18px 20px;
  padding-right:48px;
  color:#fff;
  font-weight:900;
  list-style:none;
}
.gevel-v132-main .gx-faq summary::-webkit-details-marker{display:none}
.gevel-v132-main .gx-faq summary::after{
  content:"+";
  position:absolute;right:20px;top:50%;
  transform:translateY(-50%);
  color:#8cc63f;font-size:22px;font-weight:950;
}
.gevel-v132-main .gx-faq details[open] summary::after{content:"–"}
.gevel-v132-main .gx-faq p{
  margin:0;
  padding:0 20px 20px;
  color:rgba(236,244,255,.76);
  line-height:1.7;
}
.gevel-v132-main .gx-quote{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);
  gap:22px;
  align-items:start;
  margin-top:38px;
}
.gevel-v132-main .gx-quote-side,
.gevel-v132-main .gx-quote-form{
  padding:30px;
  border-radius:30px;
}
.gevel-v132-main .gx-quote-side h2{
  margin:10px 0 12px;
  letter-spacing:-.04em;
}
.gevel-v132-main .gx-quote-side p{
  color:rgba(236,244,255,.76);
  line-height:1.74;
}
@media(max-width:980px){
  .gevel-v132-main .gx-hero,
  .gevel-v132-main .gx-quote,
  .gevel-v132-main .gx-grid,
  .gevel-v132-main .gx-grid.two,
  .gevel-v132-main .gx-metrics,
  .gevel-v132-main .gx-steps,
  .gevel-v132-main .gx-compare,
  .gevel-v132-main .gx-faq,
  .gevel-v132-main .gx-highlights{
    grid-template-columns:1fr;
  }
  .gevel-v132-main .gx-hero,
  .gevel-v132-main .gx-card,
  .gevel-v132-main .gx-step,
  .gevel-v132-main .gx-compare-box,
  .gevel-v132-main .gx-quote-side,
  .gevel-v132-main .gx-quote-form,
  .gevel-v132-main .gx-shell,
  .gevel-v132-main .gx-process-card,
  .gevel-v132-main .gx-service-card,
  .gevel-v132-main .gx-zone-card,
  .gevel-v132-main .gx-premium-band{
    border-radius:24px;
  }
  .gevel-v132-main .gx-copy{padding:8px 2px 8px 2px}
}



/* Verwijdert de globale CSS-tekst onder het offerteformulier op deze pagina. */
.gevel-v132-main .quote-form::after,
.gevel-v131-main .quote-form::after,
.gevel-v129-main .quote-form::after,
.service-v129-main .quote-form::after,
.quote-form::after{
  content:none !important;
  display:none !important;
}

/* Verberg de globale formuliermelding uit styles.css alleen op deze pagina. */
.gevel-v132-main .quote-form::after,
.quote-form::after{
  content:none !important;
  display:none !important;
}


/* ===== v139 super premium polish + local hamburger support ===== */
.gevel-v132-main .gx-super-intro{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.56fr);
  gap:20px;
  align-items:stretch;
  margin:30px 0 8px;
  padding:32px;
  border-radius:32px;
  border:1px solid rgba(255,255,255,.13);
  background:
    radial-gradient(circle at 14% 18%, rgba(0,168,255,.14), transparent 30%),
    radial-gradient(circle at 86% 14%, rgba(140,198,63,.12), transparent 28%),
    linear-gradient(180deg, rgba(8,22,39,.88), rgba(5,15,29,.72));
  box-shadow:0 24px 70px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07);
}
.gevel-v132-main .gx-super-intro::after{
  content:"";
  position:absolute;
  inset:-1px;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 0%, rgba(255,255,255,.07) 42%, transparent 62%);
  opacity:.55;
}
.gevel-v132-main .gx-super-intro > *{
  position:relative;
  z-index:1;
}
.gevel-v132-main .gx-super-intro h2{
  margin:10px 0 12px;
  max-width:840px;
  font-size:clamp(32px,3.6vw,56px);
  line-height:1;
  letter-spacing:-.055em;
}
.gevel-v132-main .gx-super-intro p{
  max-width:780px;
  color:rgba(236,244,255,.77);
  font-size:16.5px;
  line-height:1.76;
}
.gevel-v132-main .gx-super-intro-list{
  display:grid;
  gap:12px;
}
.gevel-v132-main .gx-super-intro-list div{
  padding:18px;
  border-radius:20px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.09);
}
.gevel-v132-main .gx-super-intro-list strong{
  display:block;
  color:#8cc63f;
  font-size:22px;
  letter-spacing:-.035em;
  margin-bottom:6px;
}
.gevel-v132-main .gx-super-intro-list span{
  display:block;
  color:rgba(236,244,255,.74);
  line-height:1.48;
  font-weight:780;
}
.gevel-v132-main .gx-outcome-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.gevel-v132-main .gx-outcome-card{
  position:relative;
  overflow:hidden;
  min-height:245px;
  padding:28px;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.12);
  background:
    linear-gradient(180deg, rgba(8,22,39,.84), rgba(5,15,29,.70)),
    linear-gradient(135deg, rgba(0,168,255,.055), rgba(140,198,63,.04));
  box-shadow:0 22px 64px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.gevel-v132-main .gx-outcome-card::before{
  content:"";
  position:absolute;
  width:160px;
  height:160px;
  right:-60px;
  top:-60px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(140,198,63,.16), transparent 62%);
  pointer-events:none;
}
.gevel-v132-main .gx-outcome-card::after{
  content:"";
  position:absolute;
  inset:-1px;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 0%, rgba(255,255,255,.075) 42%, transparent 62%);
  opacity:0;
  transform:translateX(-18%);
  transition:opacity .28s ease, transform .45s ease;
}
.gevel-v132-main .gx-outcome-card:hover{
  transform:translateY(-3px);
  border-color:rgba(140,198,63,.24);
  box-shadow:0 28px 78px rgba(0,0,0,.34), 0 0 30px rgba(140,198,63,.06), inset 0 1px 0 rgba(255,255,255,.08);
}
.gevel-v132-main .gx-outcome-card:hover::after{
  opacity:1;
  transform:translateX(18%);
}
.gevel-v132-main .gx-outcome-card span{
  position:relative;
  z-index:1;
  display:inline-flex;
  margin-bottom:20px;
  padding:8px 11px;
  border-radius:999px;
  color:#fff;
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
}
.gevel-v132-main .gx-outcome-card h3,
.gevel-v132-main .gx-outcome-card p{
  position:relative;
  z-index:1;
}
.gevel-v132-main .gx-outcome-card h3{
  margin:0 0 12px;
  color:#fff;
  font-size:24px;
  line-height:1.12;
  letter-spacing:-.035em;
}
.gevel-v132-main .gx-outcome-card p{
  color:rgba(236,244,255,.74);
  line-height:1.7;
}
.gevel-v132-page .quote-form::after,
.gevel-v132-main .quote-form::after,
.quote-form::after{
  content:none !important;
  display:none !important;
}

/* Local hamburger fix for gevelreiniging only */
@media(max-width:1100px){
  body.gevel-v132-page header.nav-shell{
    overflow:visible !important;
  }
  body.gevel-v132-page header.nav-shell .nav-toggle{
    display:flex !important;
    position:relative !important;
    z-index:2147483647 !important;
    pointer-events:auto !important;
    cursor:pointer !important;
    touch-action:manipulation !important;
    -webkit-tap-highlight-color:transparent !important;
  }
  body.gevel-v132-page header.nav-shell .nav-toggle span{
    pointer-events:none !important;
  }
  body.gevel-v132-page header.nav-shell .nav-links{
    display:none !important;
    pointer-events:auto !important;
  }
  body.gevel-v132-page header.nav-shell.menu-open .nav-links,
  body.gevel-v132-page header.nav-shell.gevel-menu-open .nav-links{
    display:flex !important;
  }
  body.gevel-v132-page header.nav-shell .nav-dropdown-menu{
    display:none !important;
  }
  body.gevel-v132-page header.nav-shell .nav-dropdown.open .nav-dropdown-menu{
    display:grid !important;
  }
}

@media(max-width:980px){
  .gevel-v132-main .gx-super-intro,
  .gevel-v132-main .gx-outcome-grid{
    grid-template-columns:1fr;
  }
  .gevel-v132-main .gx-super-intro,
  .gevel-v132-main .gx-outcome-card{
    border-radius:24px;
    padding:24px;
  }
}


/* ===== v140 korter, duidelijker, professioneler ===== */
.gevel-v132-main .gx-section{
  margin-top:30px;
}
.gevel-v132-main .gx-head{
  margin-bottom:16px;
}
.gevel-v132-main .gx-head p{
  max-width:760px;
}
.gevel-v132-main .gx-card,
.gevel-v132-main .gx-service-card,
.gevel-v132-main .gx-zone-card,
.gevel-v132-main .gx-process-card,
.gevel-v132-main .gx-outcome-card{
  min-height:auto;
}
.gevel-v132-main .gx-outcome-card{
  min-height:200px;
}
.gevel-v132-main .gx-copy .lead{
  max-width:700px;
}


/* ===== v141 methode-correcties gevelreiniging ===== */
.gevel-v132-main .gx-service-card p,
.gevel-v132-main .gx-process-card p,
.gevel-v132-main .gx-faq p{
  max-width:62ch;
}
.gevel-v132-page .quote-form::after,
.gevel-v132-main .quote-form::after,
.quote-form::after{
  content:none !important;
  display:none !important;
}