:root{--green:#064638;--green2:#0e684b;--cream:#f8f5ee;--paper:#fff;--orange:#f47a00;--orangeSoft:#fff3e8;--ink:#14281f;--muted:#64746c;--line:#d8e0db;--blue:#eaf3f8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff}a{text-decoration:none;color:inherit}.container{width:min(1420px,calc(100% - 34px));margin:auto}.hidden{display:none!important}.testbar{height:27px;background:#fff3c7;color:#6f5905;display:grid;place-items:center;font-size:11px;font-weight:700}.siteheader{background:var(--green);color:#fff;position:sticky;top:0;z-index:30}.nav{min-height:70px;display:flex;align-items:center;gap:25px}.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:800}.brand img{width:38px;height:43px}.nav nav{margin-left:auto;display:flex;gap:27px;font-size:14px}.loginBtn{border:1.5px solid #fff8;padding:10px 17px;border-radius:9px;font-weight:700}.trialBtn,.primary{background:var(--orange);color:#fff;padding:12px 18px;border-radius:9px;font-weight:800}.eyebrow{font-size:11px;font-weight:900;letter-spacing:.12em;color:var(--green2)}h1{font-size:50px;line-height:1.04;color:var(--green);margin:10px 0 15px}h2{font-size:31px;color:var(--green);margin:8px 0 13px}p{color:var(--muted);line-height:1.55}.hero{background:var(--cream);padding:37px 0 20px}.heroGrid{display:grid;grid-template-columns:.88fr 1.12fr;gap:32px;align-items:center}.heroCopy p{font-size:17px;max-width:620px}.ctaRow{display:flex;gap:12px;margin-top:22px}.secondary{background:#fff;border:1.5px solid var(--green);color:var(--green);padding:11px 18px;border-radius:9px;font-weight:800}.heroMedia img{width:100%;height:325px;object-fit:cover;border-radius:20px;display:block;box-shadow:0 14px 32px #0002}.homePlanning{padding:24px 0 30px}.sectionLine{display:flex;justify-content:space-between;align-items:end;gap:20px}.textLink{font-size:12px;color:var(--green);font-weight:800}.demoCarousel{display:grid;grid-template-columns:40px 1fr 40px;gap:8px;align-items:center;margin-top:12px}.carouselArrow{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--green);font-size:24px}.demoCards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.demoDay{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;box-shadow:0 4px 12px #0000000a}.demoDay.weekend{border-color:#8db9a2;background:#fffefa}.dayHead{display:flex;justify-content:space-between;align-items:flex-start}.dayHead small{font-size:9px;color:var(--muted);font-weight:800}.dayHead h3{font-size:17px;margin:3px 0 7px}.badges{display:flex;gap:4px;flex-wrap:wrap}.badges span{font-size:8px;background:#e8f4ec;color:var(--green2);padding:4px 6px;border-radius:999px}.badges .kitchen{background:var(--blue);color:#315e82}.hours{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:9px 0}.hours span{font-size:8px;text-align:center;border:1px solid var(--line);border-radius:6px;padding:4px 2px}.demoShift{border-top:1px solid #e9eeeb;padding-top:8px;margin-top:8px;display:grid;gap:3px}.demoShift b{font-size:10px}.demoShift small,.demoShift p{font-size:8px;margin:0;color:#5a6b62}.demoShift em{font-size:8px;font-style:normal;font-weight:800;text-align:center;border-radius:6px;padding:5px}.demoShift .full{background:#e8f4ec;color:var(--green2)}.demoShift .open{background:#fff;border:1px solid var(--orange);color:#d96b00}.benefits{background:#f7f8f5;border-top:1px solid #edf0ee;border-bottom:1px solid #edf0ee;padding:17px 0}.benefitGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.benefitGrid>div{display:grid;grid-template-columns:auto 1fr;column-gap:8px}.benefitGrid small{grid-column:2;color:var(--muted)}.widgetPriceSection{background:#f5f2eb;padding:34px 0}.widgetPriceGrid{display:grid;grid-template-columns:1fr 1.1fr .72fr;gap:22px;align-items:center}.widgetIntro h2{font-size:31px}.widgetMock,.priceCard{background:#fff;border:1px solid var(--line);border-radius:15px;padding:15px;box-shadow:0 6px 18px #0000000c}.widgetHeader{display:flex;justify-content:space-between;align-items:center;background:var(--green);color:#fff;padding:10px;border-radius:9px;margin-bottom:10px}.widgetHeader span{font-size:8px;background:#2d875f;padding:4px 6px;border-radius:999px}.widgetMock h3{font-size:15px;margin:8px 0}.widgetRow{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #edf0ee}.widgetRow div{display:grid}.widgetRow b{font-size:10px}.widgetRow small{font-size:8px;color:var(--muted)}.widgetRow em{font-size:8px;font-style:normal;font-weight:800;color:#d96b00;background:var(--orangeSoft);padding:4px 6px;border-radius:999px;height:max-content}.widgetMock>a{display:block;background:var(--green);color:#fff;text-align:center;margin-top:10px;padding:9px;border-radius:8px;font-size:10px;font-weight:800}.powered{display:block;text-align:center;margin-top:5px;font-size:7px;color:#7d8983}.priceCard{text-align:center}.priceCard h2{font-size:46px;margin:0}.priceCard>b{display:block;margin-bottom:13px}.priceCard ul{text-align:left;padding-left:20px;font-size:11px}.priceCard li{margin:7px 0}.priceCard>a{display:block;background:var(--orange);color:#fff;padding:10px;border-radius:8px;font-weight:800}.priceCard>small{display:block;margin-top:7px;font-size:8px;color:var(--muted)}.claimSection{padding:36px 0}.claimGrid{display:grid;grid-template-columns:1fr .85fr;gap:30px;align-items:center}.claimGrid form{border:1px solid var(--line);border-radius:14px;background:#fff;padding:16px}.claimGrid label{display:block;font-size:10px;font-weight:800;margin-bottom:4px}.claimGrid input,.signup input,.signup textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px}.slug{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;padding-left:10px}.slug input{border:0;margin:0}.claimGrid button,.signup>#confirm{width:100%;border:0;background:var(--orange);color:#fff;padding:10px;border-radius:8px;font-weight:800}.clubHero{background:var(--cream);padding:31px 0}.clubHeroGrid{display:grid;grid-template-columns:1fr .65fr;gap:22px;align-items:center}.clubMeta{display:flex;gap:8px;flex-wrap:wrap}.clubMeta span{border:1px solid var(--line);background:#fff;padding:7px 9px;border-radius:999px;font-size:10px}.clubActionCard{border:1px solid var(--line);background:#fff;border-radius:14px;padding:16px}.clubActionCard a{font-weight:800;color:var(--green)}.planningSection{padding:28px 0}.planningHeader{display:flex;justify-content:space-between;align-items:end;gap:15px}.toolbar{display:flex;gap:7px;flex-wrap:wrap}.toolbar>*{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 9px;font-size:10px}.datePick{display:block;margin:8px 0 0 auto}.carouselWrap{display:grid;grid-template-columns:40px 1fr 40px;gap:8px;align-items:center}.roundArrow{width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:50%;font-size:24px;color:var(--green)}#carousel{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:4px 0 10px}#carousel::-webkit-scrollbar{display:none}.day{flex:0 0 245px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px;max-height:640px;overflow:hidden}.day.weekend{border-color:#8db9a2}.day.min{flex-basis:52px;min-height:500px;padding:6px;background:#f0efeb}.day.min .full{display:none}.day:not(.min) .mini{display:none}.mini{height:100%;display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;font-weight:800}.head{border-bottom:1px solid var(--line);padding-bottom:8px}.head h3{font-size:18px;margin:3px 0}.head small{font-size:9px;color:var(--green2)}.pill{display:inline-block;font-size:8px;background:#e8f4ec;color:var(--green2);padding:4px 6px;border-radius:999px}.pill.kitchen{background:var(--blue);color:#315e82}.shift{border-top:1px solid #e9eeeb;padding-top:9px;margin-top:9px}.shiftHeading{display:flex;justify-content:space-between;font-size:11px}.serviceTimeline{display:grid;grid-template-columns:42px 1fr 42px;gap:6px;align-items:center;margin:8px 0}.timelineTrack{position:relative;height:34px;background:#e5f1e9;border:1px solid #8fbaa3;border-radius:8px;overflow:visible}.barSegment{position:absolute;inset:0;display:grid;place-items:center;color:var(--green2);font-size:10px;font-weight:800}.kitchenSegment{position:absolute;top:-8px;height:7px;background:var(--orange);border-radius:999px;z-index:2}.kitchenSegment span{position:absolute;top:-20px;left:50%;transform:translateX(-50%);font-size:7px;background:#fff;color:#d96b00;border:1px solid #f0aa69;border-radius:999px;padding:2px 5px;white-space:nowrap}.timelineStart,.timelineEnd{font-size:9px;font-weight:800}.meta{display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}.people{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}.person{font-size:9px}.person:before{content:'✓ ';color:var(--green2);font-weight:800}.open,.fullbtn,.pastbtn{width:100%;margin-top:7px;padding:6px;border-radius:7px;text-align:center;font-size:9px;font-weight:800}.open{background:#fff;border:1px solid var(--orange);color:#d96b00}.fullbtn{background:#e8f4ec;color:var(--green2)}.pastbtn{background:#f0f1ef;color:#7b8680}.thankYou{margin-top:9px;font-size:9px;color:#68766e}.publicMatches{padding:25px 0;background:#f7f8f5}.publicMatchList{display:grid;gap:8px}.publicMatchCard{display:grid;grid-template-columns:.5fr 1.5fr .6fr 1fr;gap:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;font-size:10px}.clubWidgetSection{padding:28px 0;background:#f5f2eb}.liveWidget{width:100%;height:220px;border:0;border-radius:14px;background:#fff}.modal{position:fixed;inset:0;background:#002016aa;display:flex;align-items:center;justify-content:center;z-index:50}.signup{width:min(420px,92vw);background:#fff;border-radius:15px;padding:19px;position:relative}.signup>#close{position:absolute;right:9px;top:9px;width:36px;height:36px;border:0;border-radius:50%;font-size:20px}footer{background:var(--green);color:#fff;padding:24px 0}.footerGrid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:26px;align-items:center}.footerBrand{display:flex;gap:9px;align-items:center}.footerBrand img{width:34px}.footerBrand div{display:grid}.footerBrand small,footer p{color:#d1ded8}.footerLinks{display:flex;justify-content:flex-end;gap:16px;flex-wrap:wrap;font-size:11px}@media(max-width:1100px){.nav nav{display:none}.demoCards{grid-template-columns:repeat(3,1fr)}.demoDay:nth-child(n+4){display:none}.widgetPriceGrid{grid-template-columns:1fr 1fr}.priceCard{grid-column:1/-1}.heroGrid,.clubHeroGrid,.claimGrid{grid-template-columns:1fr}.heroMedia img{height:290px}}@media(max-width:700px){.container{width:min(100% - 22px,1420px)}.testbar{height:auto;min-height:27px;padding:5px;text-align:center}.nav{min-height:64px}.brand{font-size:19px}.brand img{width:32px}.loginBtn{margin-left:auto}.trialBtn{display:none}h1{font-size:36px}h2{font-size:26px}.ctaRow{flex-direction:column}.demoCarousel{grid-template-columns:1fr}.carouselArrow{display:none}.demoCards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}.demoDay{flex:0 0 88vw;scroll-snap-align:center}.demoDay:nth-child(n+4){display:block}.benefitGrid,.widgetPriceGrid,.footerGrid{grid-template-columns:1fr}.widgetPriceSection{padding:25px 0}.planningHeader{display:grid}.toolbar{display:grid;grid-template-columns:1fr 1fr}.toolbar label{grid-column:1/-1}.day{flex-basis:86vw}.day.min{flex-basis:58px}.publicMatchCard{grid-template-columns:1fr 1fr}.heroMedia img{height:220px}.footerLinks{justify-content:flex-start}}
/* V17 verification UI only */
.signup textarea{width:100%;box-sizing:border-box;border:1px solid #c8d2cc;border-radius:9px;padding:10px;margin-bottom:10px;font:inherit;resize:vertical}
.verifyHelp{font-size:12px;line-height:1.45;color:#5e6e66;background:#f1f6f3;border:1px solid #d7e4dc;border-radius:9px;padding:11px;margin:2px 0 10px}
.pendingConfirm{margin-top:6px;border:1px solid #b7d7c3;background:#f2faf5;border-radius:14px;padding:20px;text-align:center;color:#173d2e}
.pendingIcon{width:52px;height:52px;margin:0 auto 8px;border-radius:50%;display:grid;place-items:center;background:#dfeee5;color:#0b5a42;font-size:25px}
.pendingConfirm h3{font-size:23px;color:#0b5a42;margin:5px 0 8px}
.pendingConfirm p{font-size:13px;line-height:1.5;color:#50635a;margin:7px 0}
.pendingConfirm .pendingStrong{font-size:16px;font-weight:900;color:#173d2e}
.pendingConfirm button{width:100%;margin-top:12px;border:0;border-radius:9px;padding:12px 14px;background:#0b5a42;color:#fff;font-weight:900;cursor:pointer}


/* V17.1 – mobiele planning binnen scherm */
@media(max-width:700px){
  .planningSection .container{
    width:calc(100% - 20px);
    max-width:100%;
  }
  .carouselWrap{
    display:block;
    position:relative;
    width:100%;
    min-width:0;
  }
  #carousel{
    width:100%;
    max-width:100%;
    min-width:0;
    gap:8px;
    padding:4px 0 10px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
  }
  #carousel .day:not(.min){
    flex:0 0 100%;
    width:100%;
    max-width:100%;
    min-width:0;
    scroll-snap-align:start;
  }
  #carousel .day.min{
    flex:0 0 48px;
    width:48px;
    min-width:48px;
  }
  .roundArrow{
    position:absolute;
    top:45%;
    z-index:8;
    width:38px;
    height:38px;
    background:rgba(255,255,255,.96);
    box-shadow:0 2px 8px rgba(0,0,0,.08);
  }
  #prev{left:-5px}
  #next{right:-5px}
  .serviceTimeline{
    grid-template-columns:54px minmax(0,1fr) 54px;
    width:100%;
    min-width:0;
  }
  .timelineTrack{
    min-width:0;
    width:100%;
  }
  .shiftHeading,
  .meta{
    min-width:0;
  }
  .head h3{
    overflow-wrap:anywhere;
  }
}


/* V17.5 – mobiele aanmeldknop altijd klikbaar */
#carousel .shift{position:relative}
#carousel button.open{
  position:relative;
  z-index:20;
  pointer-events:auto!important;
  touch-action:manipulation;
  cursor:pointer;
  -webkit-tap-highlight-color:rgba(242,138,19,.15);
}
#carousel .serviceTimeline,
#carousel .meta,
#carousel .people{
  position:relative;
  z-index:1;
}

/* V17.7 desktop + mobiel klikfix */
#carousel button.open{
 display:block!important;width:100%!important;min-height:52px!important;position:relative!important;z-index:100!important;pointer-events:auto!important;touch-action:manipulation!important;cursor:pointer!important;
}
#carousel .shift{position:relative!important;overflow:visible!important}


/* V17.8 – duidelijke status + echte aanmeldknop */
.needInfo{
  margin-top:10px;
  padding:10px 12px;
  border:2px solid #f28a13;
  border-radius:10px;
  text-align:center;
  color:#c76608;
  background:#fff;
  font-weight:800;
  pointer-events:none;
}
.helpBtn{
  display:block!important;
  width:100%!important;
  min-height:50px!important;
  margin-top:8px!important;
  padding:12px 16px!important;
  border:0!important;
  border-radius:10px!important;
  background:#f28a13!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:900!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  position:relative!important;
  z-index:50!important;
}
.helpBtn:hover{background:#dd780c!important}


/* V17.9 – modal boven rooster + echte Aanmelden-knop */
.modal{
  z-index:1000!important;
}
.signup{
  z-index:1001!important;
}
.signup #close{
  z-index:1002!important;
}

/* De roosterknop mag nooit boven het geopende formulier liggen */
#carousel .helpBtn,
#carousel button.open{
  z-index:20!important;
}

/* Aanmelden staat nu binnen #signupFormFields, dus niet meer alleen als direct child */
.signup #confirm{
  display:block!important;
  width:100%!important;
  min-height:50px!important;
  margin-top:10px!important;
  padding:12px 16px!important;
  border:0!important;
  border-radius:10px!important;
  background:#f28a13!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:900!important;
  cursor:pointer!important;
  opacity:1!important;
}
.signup #confirm:disabled{
  opacity:.65!important;
  cursor:wait!important;
}

/* Op mobiel altijd volledig binnen het modalvenster */
@media(max-width:700px){
  .signup{
    width:min(94vw,440px)!important;
    max-height:88vh!important;
    overflow-y:auto!important;
  }
}


/* V18.2 – openbare clubpagina rustiger en compacter */
.clubPlanningOnly #carousel{
  align-items:flex-start;
}
.clubPlanningOnly .day{
  flex:0 0 310px;
  height:auto;
  min-height:0;
  max-height:none;
  align-self:flex-start;
}
.clubPlanningOnly .carouselWrap{
  align-items:start;
}
.clubPlanningOnly .roundArrow{
  margin-top:105px;
}
.clubPlanningOnly .planningHeader{
  align-items:center;
}
@media(max-width:700px){
  .clubPlanningOnly #carousel{
    align-items:flex-start;
  }
  .clubPlanningOnly #carousel .day{
    flex:0 0 100%;
    width:100%;
    min-height:0!important;
    height:auto!important;
  }
  .clubPlanningOnly .roundArrow{
    margin-top:0;
  }
}

/* V19.3 – Basis + Plus */
.pricePlans{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.planCard{position:relative;height:100%}
.planCard h2{margin:10px 0 2px;font-size:42px;color:var(--green)}
.planLabel{display:inline-block;padding:5px 9px;border-radius:999px;background:#edf4f0;color:var(--green2);font-size:10px;font-weight:900;letter-spacing:.08em}
.planLabel.plus{background:#fff0df;color:#d66a00}
.plusPlan{border:2px solid #f2a04c;box-shadow:0 10px 30px #0002}
.plusPlan:before{content:"MEEST COMPLEET";position:absolute;right:14px;top:14px;font-size:9px;font-weight:900;color:#d66a00}
.planCard strong{font-size:inherit;color:inherit}
@media(max-width:760px){.pricePlans{grid-template-columns:1fr}}

/* V19.5 – geldigheid extra WhatsApp-bundels */
.plusPlan .bundleValidity{
  margin:10px 0 12px 20px;
  padding:0;
  font-size:11px;
  line-height:1.35;
  font-weight:900;
  color:var(--green);
  text-align:left;
}


/* V19.6 – nette prijskaarten desktop + mobiel */
.pricePlans{
  align-items:stretch;
}
.planCard{
  padding:22px;
  text-align:left;
  overflow:hidden;
}
.planCard h2{
  margin:12px 0 2px;
  font-size:46px;
  line-height:1;
}
.planCard>b{
  display:block;
  margin-bottom:16px;
  font-size:12px;
  color:var(--muted);
}
.planCard ul{
  list-style:none;
  padding:0;
  margin:16px 0 14px;
  font-size:12px;
}
.planCard li{
  position:relative;
  padding-left:30px;
  margin:10px 0;
  line-height:1.35;
}
.planCard li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:-1px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#159447;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:900;
}
.planCard>a{
  margin-top:16px;
  text-align:center;
}
.plusPlan{
  padding-top:28px;
}
.plusPlan:before{
  content:"MEEST COMPLEET";
  position:absolute;
  right:18px;
  top:18px;
  padding:5px 9px;
  border-radius:999px;
  background:var(--orange);
  color:#fff;
  font-size:9px;
  line-height:1;
  font-weight:900;
  letter-spacing:.03em;
}
.plusPlan .planLabel.plus{
  margin-top:0;
}
.plusPlan .bundleValidity{
  margin:12px 0 14px 30px;
  padding:0;
  font-size:12px;
  line-height:1.4;
  font-weight:900;
  color:var(--green);
  text-align:left;
}

@media(max-width:760px){
  .pricePlans{
    grid-template-columns:1fr;
    gap:18px;
  }
  .planCard{
    width:100%;
    max-width:none;
    padding:22px 18px 20px;
    border-radius:16px;
  }
  .planCard h2{
    font-size:42px;
  }
  .planCard>b{
    font-size:12px;
  }
  .planCard ul{
    font-size:13px;
  }
  .planCard li{
    padding-left:32px;
    margin:11px 0;
    line-height:1.35;
  }
  .planCard li::before{
    width:22px;
    height:22px;
    font-size:13px;
  }
  .plusPlan{
    padding-top:54px;
  }
  .plusPlan:before{
    top:16px;
    left:18px;
    right:auto;
  }
  .plusPlan .bundleValidity{
    margin-left:32px;
    margin-right:4px;
    font-size:13px;
  }
}


/* V19.8 – definitieve homepage-indeling: Basis | Plus | clubwidget */
.priceWidgetSection{
  background:#f7f8f5;
  padding:34px 0 28px;
}
.priceWidgetRow{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.08fr) minmax(0,1.08fr);
  gap:18px;
  align-items:stretch;
}
.priceWidgetRow .planCard,
.clubWidgetExample{
  min-width:0;
  height:100%;
}
.priceWidgetRow .planCard{
  display:flex;
  flex-direction:column;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:22px;
  box-shadow:0 8px 24px rgba(0,0,0,.04);
}
.priceWidgetRow .planCard h2{
  display:flex;
  align-items:baseline;
  gap:8px;
  margin:12px 0 3px;
  font-size:42px;
  line-height:1;
}
.priceWidgetRow .planCard h2 small{
  font-size:14px;
  font-weight:700;
  color:var(--green);
}
.priceWidgetRow .planCard>b{
  color:var(--muted);
  font-size:11px;
  margin-bottom:15px;
}
.priceWidgetRow .planCard ul{
  list-style:none;
  padding:0;
  margin:8px 0 16px;
  text-align:left;
  font-size:12px;
}
.priceWidgetRow .planCard li{
  position:relative;
  margin:10px 0;
  padding-left:30px;
  line-height:1.35;
}
.priceWidgetRow .planCard li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:-1px;
  width:20px;
  height:20px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#159447;
  color:#fff;
  font-size:12px;
  font-weight:900;
}
.priceWidgetRow .planCard>a{
  display:block;
  margin-top:auto;
  padding:11px 14px;
  border-radius:9px;
  text-align:center;
  font-weight:900;
  text-decoration:none;
}
.basisPlan .basisCta{
  background:#fff;
  color:var(--green);
  border:1px solid var(--green);
}
.plusPlan{
  position:relative;
  border:2px solid var(--orange)!important;
  padding-top:28px!important;
}
.plusPlan::before{
  display:none!important;
}
.mostChosen{
  position:absolute;
  top:-14px;
  right:18px;
  background:var(--orange);
  color:#fff;
  padding:7px 12px;
  border-radius:9px;
  font-size:10px;
  font-weight:900;
}
.plusPlan .plusCta{
  background:var(--orange);
  color:#fff;
  border:1px solid var(--orange);
}
.plusPlan .bundleValidity{
  margin:0 0 14px 30px;
  font-size:12px;
  line-height:1.35;
  font-weight:900;
  color:var(--green);
  text-align:left;
}

.clubWidgetExample{
  display:flex;
  flex-direction:column;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 8px 24px rgba(0,0,0,.04);
}
.clubWidgetTitle{
  background:linear-gradient(135deg,var(--green),#0b7454);
  color:#fff;
  padding:16px 18px;
}
.clubWidgetTitle strong{
  display:block;
  font-size:17px;
  line-height:1.2;
}
.clubWidgetTitle span{
  display:block;
  margin-top:4px;
  font-size:11px;
  opacity:.92;
}
.widgetMockExample{
  border:0;
  border-radius:0;
  box-shadow:none;
  flex:1;
  padding:15px;
}
.widgetMockExample .widgetHeader{
  margin-top:0;
}

/* Direct eronder: Maak jullie unieke club-URL */
.priceWidgetSection + .claimSection{
  padding-top:28px;
}

/* Verwijder elke oude geforceerde prijs-grid van eerdere versies binnen deze nieuwe sectie */
.priceWidgetRow .pricePlans{
  display:contents;
}

@media(max-width:1050px){
  .priceWidgetRow{
    grid-template-columns:1fr 1fr;
  }
  .clubWidgetExample{
    grid-column:1 / -1;
  }
}
@media(max-width:760px){
  .priceWidgetSection{
    padding-top:28px;
  }
  .priceWidgetRow{
    grid-template-columns:1fr;
    gap:18px;
  }
  .clubWidgetExample{
    grid-column:auto;
  }
  .priceWidgetRow .planCard h2{
    font-size:40px;
  }
  .mostChosen{
    top:-12px;
    right:16px;
  }
}


/* V19.9 – exact afgesproken design uit foto 1 */
.agreedPricingSection{background:#fff;padding:26px 0 34px}
.agreedPricingRow{display:grid;grid-template-columns:1fr 1.06fr 1.08fr;gap:14px;align-items:stretch}
.agreedPlanCard,.agreedWidgetCard{background:#fff;border:1px solid #dfe7e2;border-radius:10px;padding:16px;box-shadow:0 3px 12px rgba(15,55,38,.03);min-width:0}
.agreedPlanCard{display:flex;flex-direction:column}
.agreedPlanLabel{font-size:15px;font-weight:900;color:#0b5a42;margin-bottom:6px}
.agreedPrice{font-size:31px;line-height:1;font-weight:900;color:#0b5a42}
.agreedPrice small{font-size:12px;font-weight:700}
.agreedSub{margin-top:5px;font-size:11px;color:#627269}
.agreedBenefits{list-style:none;padding:0;margin:14px 0 14px}
.agreedBenefits li{position:relative;padding-left:28px;margin:8px 0;font-size:11px;line-height:1.3;color:#32463d}
.agreedBenefits li::before{content:"✓";position:absolute;left:0;top:-1px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#17ad64;color:#fff;font-size:11px;font-weight:900}
.agreedBtn{display:block;margin-top:auto;padding:10px;border-radius:6px;text-align:center;text-decoration:none;font-weight:900;font-size:12px}
.agreedBtnOutline{border:1px solid #0b5a42;color:#0b5a42;background:#fff}
.agreedPlusCard{position:relative;border:1.5px solid #ff6d00}
.agreedBadge{position:absolute;top:-13px;right:28px;background:#ff6d00;color:#fff;padding:6px 10px;border-radius:5px;font-size:10px;font-weight:900}
.agreedBtnOrange{background:#ff6d00;color:#fff}
.agreedBundleNote{font-size:10px;font-weight:900;color:#0b5a42;margin:0 0 12px 28px}
.agreedWidgetCard{padding:0;overflow:hidden}
.agreedWidgetHead{background:#0b6a4e;color:#fff;padding:13px 15px}
.agreedWidgetHead strong{display:block;font-size:15px}
.agreedWidgetHead span{display:block;font-size:10px;margin-top:2px}
.agreedWidgetBody{padding:10px}
.agreedWidgetBar{background:#0b5a42;color:#fff;border-radius:6px;padding:8px 10px;display:flex;justify-content:space-between;align-items:center;font-size:11px}
.agreedWidgetBar em{font-style:normal;background:#15bd70;padding:3px 6px;border-radius:999px;font-size:8px}
.agreedWidgetBody h3{font-size:12px;margin:10px 0 5px}
.agreedWidgetRow{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid #e8eeeb}
.agreedWidgetRow b,.agreedWidgetRow span{display:block}
.agreedWidgetRow b{font-size:10px}.agreedWidgetRow span{font-size:9px;color:#65776e;margin-top:2px}
.agreedWidgetRow>strong{font-size:9px;color:#ff6d00;background:#fff3e6;padding:5px 6px;border-radius:5px;align-self:center}
.agreedWidgetButton{display:block;margin-top:8px;background:#0b5a42;color:#fff!important;text-decoration:none;text-align:center;padding:9px;border-radius:6px;font-size:10px;font-weight:900}

.agreedClaimBox{margin-top:18px;background:#f4faf7;border:1px solid #d8e9df;border-radius:9px;padding:20px;display:grid;grid-template-columns:1.1fr 1.3fr;gap:28px;align-items:center}
.agreedClaimIntro{display:flex;gap:16px;align-items:flex-start}
.agreedClaimIcon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#d9f3e5;font-size:23px}
.agreedClaimIntro h2{margin:0 0 6px;font-size:21px;color:#0b5a42}
.agreedClaimIntro p{margin:0;color:#5f7168;font-size:11px;line-height:1.45}
.agreedClaimForm{background:#fff;border:1px solid #dce6e1;border-radius:8px;padding:14px;display:grid;grid-template-columns:1fr 145px;gap:7px 12px}
.agreedClaimForm label{grid-column:1/-1;font-size:9px;font-weight:900;color:#45574e}
.agreedClaimForm>input,.agreedSlug{grid-column:1/2}
.agreedClaimForm input{width:100%;box-sizing:border-box;border:1px solid #ccd9d2;border-radius:6px;padding:9px;font:inherit;font-size:10px}
.agreedSlug{display:flex;align-items:center;border:1px solid #ccd9d2;border-radius:6px;overflow:hidden;background:#fff}
.agreedSlug span{padding-left:9px;font-size:10px;color:#566b61;white-space:nowrap}
.agreedSlug input{border:0!important;padding-left:4px}
.agreedAddress{grid-column:1/2;background:#e9f7f0;border-radius:6px;padding:8px;font-size:9px;color:#335247}
.agreedClaimForm button{grid-column:2/3;grid-row:2/6;background:#ff6d00;color:#fff;border:0;border-radius:6px;font-weight:900;font-size:11px;cursor:pointer}
.agreedClaimForm small{grid-column:2/3;text-align:center;font-size:8px;color:#829088}
#claimMsg{grid-column:1/-1;font-size:9px}

.agreedBenefitsBar{margin-top:12px;background:#f4faf7;border-radius:8px;display:grid;grid-template-columns:1fr 1fr 1fr 1.1fr;align-items:center;padding:14px 18px;gap:12px}
.agreedBenefitsBar>div:not(.agreedTagline){display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:8px}
.agreedBenefitsBar span{grid-row:1/3;font-size:24px;color:#0b5a42}
.agreedBenefitsBar b{font-size:10px;color:#0b5a42}
.agreedBenefitsBar small{font-size:9px;color:#65776e}
.agreedTagline{text-align:center;font-style:italic;color:#0b7c50;font-weight:900;font-size:14px;line-height:1.15}

@media(max-width:1000px){
 .agreedPricingRow{grid-template-columns:1fr 1fr}
 .agreedWidgetCard{grid-column:1/-1}
 .agreedClaimBox{grid-template-columns:1fr}
}
@media(max-width:700px){
 .agreedPricingRow{grid-template-columns:1fr}
 .agreedWidgetCard{grid-column:auto}
 .agreedClaimForm{grid-template-columns:1fr}
 .agreedClaimForm>input,.agreedSlug,.agreedAddress,.agreedClaimForm button,.agreedClaimForm small{grid-column:1}
 .agreedClaimForm button{grid-row:auto;padding:11px}
 .agreedBenefitsBar{grid-template-columns:1fr 1fr}
}


/* V19.10 – gekozen abonnement direct meenemen in aanmeldformulier */
.selectedPlanField{
  grid-column:1/2;
}
.selectedPlanField input{
  background:#edf7f1!important;
  border-color:#bcdccb!important;
  color:#0b5a42!important;
  font-weight:900!important;
}
.planChoiceBtn.selectedPlanChoice{
  box-shadow:0 0 0 3px rgba(21,148,71,.15);
}
.agreedPlusCard .planChoiceBtn.selectedPlanChoice{
  box-shadow:0 0 0 3px rgba(255,109,0,.18);
}
@media(max-width:700px){
  .selectedPlanField{grid-column:1}
}


/* V19.11 – Yamiro Holding footer */
.yamiroFooterLink{
  display:flex;
  align-items:center;
  gap:10px;
  width:max-content;
  max-width:100%;
  text-decoration:none;
  color:inherit;
  margin-bottom:8px;
}
.yamiroFooterLink img{
  width:54px;
  height:38px;
  object-fit:contain;
  border-radius:7px;
  background:#fff;
  padding:3px;
  box-sizing:border-box;
}
.yamiroFooterLink span{
  display:grid;
  gap:2px;
}
.yamiroFooterLink strong{
  font-size:13px;
  color:inherit;
}
.yamiroFooterLink small{
  font-size:10px;
  color:var(--muted);
}
.yamiroFooter p{margin:6px 0 0}
.publicEventName{margin-top:7px;color:#174f37;font-size:13px;font-weight:900}.publicEventNote{margin-top:6px;padding:7px 8px;border-radius:8px;background:#f1f4f1;color:#5e6d65;font-size:10px;line-height:1.4}

/* V20.2 – vrijwilligerspool op de homepage */
.volunteerPower{padding:42px 0;background:#fff}.volunteerPowerGrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:34px;align-items:center}.volunteerPowerIntro h2{max-width:620px}.volunteerPowerIntro p{max-width:680px}.volunteerPromise{padding:14px 16px;border-left:4px solid #f28a13;background:#fff7ed;border-radius:0 11px 11px 0;color:#5a4937}.volunteerSteps{display:grid;gap:11px}.volunteerSteps article{display:grid;grid-template-columns:42px 1fr;gap:13px;align-items:start;padding:16px;border:1px solid #d8e3dc;border-radius:14px;background:#f8fbf9;box-shadow:0 6px 18px rgba(16,67,44,.05)}.volunteerSteps article>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#176243;color:#fff;font-weight:900}.volunteerSteps article div{display:grid;gap:5px}.volunteerSteps b{color:#184a35;font-size:15px}.volunteerSteps small{color:#68786f;line-height:1.5;font-size:11px}

/* V20.2 – elke functie direct herkenbaar aan kleur, icoon en knop */
#carousel .barSegment{display:flex;align-items:center;justify-content:center;gap:5px;padding:0 5px;text-align:center}#carousel .barSegment i{font-style:normal;font-size:13px}.shift.role-bar .timelineTrack{background:#e7f3eb;border-color:#7fae90}.shift.role-bar .barSegment{color:#176243}.shift.role-bar .needInfo{border-color:#2b7d57;color:#176243;background:#f8fcf9}.shift.role-bar .helpBtn{background:#176243!important}.shift.role-bar .helpBtn:hover{background:#0f5136!important}.shift.role-keuken .timelineTrack{background:#fff0df;border-color:#e4a15f}.shift.role-keuken .barSegment{color:#a95512}.shift.role-keuken .needInfo{border-color:#df812b;color:#a95512;background:#fffaf5}.shift.role-keuken .helpBtn{background:#df7c24!important}.shift.role-keuken .helpBtn:hover{background:#c96817!important}.shift.role-kassa .timelineTrack{background:#e9f3fb;border-color:#72a7cc}.shift.role-kassa .barSegment{color:#28668f}.shift.role-kassa .needInfo{border-color:#4d91bf;color:#28668f;background:#f7fbfe}.shift.role-kassa .helpBtn{background:#347da9!important}.shift.role-kassa .helpBtn:hover{background:#28668f!important}.shift.role-extra .timelineTrack{background:#f1edf8;border-color:#aa98c6}.shift.role-extra .barSegment{color:#62517e}.shift.role-extra .needInfo{border-color:#8974a8;color:#62517e;background:#fbf9fd}.shift.role-extra .helpBtn{background:#725d91!important}.shift.role-extra .helpBtn:hover{background:#5d4a7a!important}
@media(max-width:760px){
  .yamiroFooterLink img{width:48px;height:34px}
  .volunteerPower{padding:30px 0}.volunteerPowerGrid{grid-template-columns:1fr;gap:20px}.volunteerSteps article{padding:13px}.volunteerPowerIntro h2{font-size:27px}
}
/* V20.25 – diensten van één openbare clubdag horizontaal op desktop */
@media(min-width:701px){
  .clubPlanningOnly .carouselWrap{
    grid-template-columns:40px minmax(0,1fr) 40px;
    width:100%;
  }
  .clubPlanningOnly #carousel{
    width:100%;
    min-width:0;
    align-items:flex-start;
  }
  .clubPlanningOnly #carousel .day{
    flex:0 0 100%;
    width:100%;
    max-width:none;
    padding:16px;
  }
  .clubPlanningOnly .dayShifts{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(185px,1fr));
    gap:12px;
    align-items:start;
    margin-top:12px;
  }
  .clubPlanningOnly .dayShifts .shift{
    min-width:0;
    height:100%;
    margin:0;
    padding:12px;
    border:1px solid #dfe8e2;
    border-radius:12px;
    background:#fff;
    box-shadow:0 4px 14px rgba(20,65,43,.04);
  }
  .clubPlanningOnly .dayShifts .shiftHeading{
    min-height:30px;
    gap:8px;
  }
  .clubPlanningOnly .dayShifts .serviceTimeline{
    grid-template-columns:34px minmax(0,1fr) 34px;
    gap:5px;
  }
  .clubPlanningOnly .dayShifts .timelineStart,
  .clubPlanningOnly .dayShifts .timelineEnd{
    font-size:8px;
  }
  .clubPlanningOnly .dayShifts .needInfo{
    padding:8px 7px;
    font-size:13px;
  }
  .clubPlanningOnly .dayShifts .helpBtn{
    min-height:44px!important;
    padding:9px 8px!important;
    font-size:13px!important;
  }
  .clubPlanningOnly .dayShifts .people{
    min-height:18px;
  }
}
@media(max-width:700px){
  .clubPlanningOnly .dayShifts{display:block}
}

/* V20.15 – gratis product en prepaid WhatsApp-bundels */
.creditBundleGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.creditBundleGrid div{display:flex;flex-direction:column;align-items:center;padding:13px 8px;border:1px solid #dce8e1;border-radius:13px;background:#fff}.creditBundleGrid .popular{border:2px solid #f28a13;background:#fff8ef}.creditBundleGrid b{font-size:20px;color:#0b5a42}.creditBundleGrid span{font-size:12px;color:#6b7971}.creditBundleGrid strong{font-size:19px;margin-top:6px;color:#17231d}.whatsappCreditCard{grid-column:span 2;background:linear-gradient(135deg,#0b5a42,#174d3d)!important;color:#fff}.whatsappCreditCard h2,.whatsappCreditCard p{color:#fff}.creditCardTop,.creditMeta{display:flex;justify-content:space-between;gap:14px}.creditStatus{height:max-content;padding:6px 10px;border-radius:999px;background:#d8f4e8;color:#07583d;font-size:12px;font-weight:800}.creditStatus.low{background:#fff0dc;color:#9a4b08}.creditCounter{display:flex;align-items:baseline;gap:10px;margin:18px 0 12px}.creditCounter strong{font-size:48px;line-height:1}.creditCounter span{opacity:.86}.creditMeter{height:10px;background:rgba(255,255,255,.2);border-radius:999px;overflow:hidden}.creditMeter i{display:block;height:100%;background:#f4a340;border-radius:999px}.creditMeta{font-size:13px;margin:8px 0 18px;opacity:.82}.creditBuyBtn{background:#f28a13!important;color:#fff!important;text-align:center}.creditPage{max-width:980px}.creditHero{background:linear-gradient(135deg,#0b5a42,#174d3d);color:#fff;border-radius:22px;padding:30px;margin-bottom:22px}.creditHero h1,.creditHero p{color:#fff}.creditPageCounter strong{font-size:54px}.purchaseGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.purchaseCard{position:relative;background:#fff;border:1px solid #dbe6df;border-radius:18px;padding:24px;box-shadow:0 10px 28px rgba(25,55,42,.08)}.purchaseCard.featured{border:2px solid #f28a13}.purchaseCard .tag{position:absolute;top:-12px;right:16px;background:#f28a13;color:#fff;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:800}.purchaseCard h2{font-size:28px}.purchasePrice{font-size:34px;font-weight:900;color:#0b5a42}.purchasePrice small{font-size:13px;font-weight:600;color:#718078}.purchaseCard a{display:block;margin-top:20px;text-align:center}.purchaseNotice{margin-top:20px;padding:16px;border-radius:12px;background:#edf5f0;color:#385146}@media(max-width:760px){.creditBundleGrid,.purchaseGrid{grid-template-columns:1fr}.whatsappCreditCard{grid-column:span 1}}