/* Training-led refinement, scoped to the team page.
   The existing site Inter is used consistently for headings and body copy. */

body.team-page  {
  --green: #00b050;
  --team-space: clamp(56px, 6.25vw, 90px);
  --team-rule: #d8dcda;
  caret-color: #00692b;
}

body.team-page h1,
body.team-page h2  {
  font-family: var(--font);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.04;
  text-wrap: balance;
  text-transform: uppercase;
}

body.team-page h3  { letter-spacing: -.025em; }
body.team-page .team-section  { padding-block: var(--team-space); }

body.team-page :is(.team-copy > p, .team-program-heading > p)  {
  font-size: 17px;
  line-height: 1.7;
}
body.team-page .team-copy h2  { margin-bottom: 28px; }
body.team-page :is(a, summary)  { text-underline-offset: .22em; }
body.team-page :is(.button-green, .ff-booking-cta)  {
  background: #00b050 !important;
  color: #062713 !important;
}
body.team-page :is(.button-green, .ff-booking-cta):hover  {
  background: #06c95e !important;
  color: #062713 !important;
}

/* Text and the real training scene share a single opening composition. */
body.team-page .team-hero  {
  position: relative;
  display: block;
  min-height: 680px;
  background: #fff;
  isolation: isolate;
  overflow: hidden;
}
body.team-page .team-hero-copy  {
  position: relative;
  z-index: 1;
  width: min(59%, 875px);
  padding: 76px 0 62px max(var(--gutter), calc((100% - 1440px) / 2 + var(--gutter)));
}
body.team-page .team-hero h1  {
  line-height: 1.06;
  max-width: 760px;
}
body.team-page .team-hero-copy > p.team-hero-intro  {
  max-width: 34ch;
  margin-top: 27px;
  color: #09090b;
  font-size: clamp(22px, 2.05vw, 29px);
  line-height: 1.35;
  letter-spacing: -.02em;
}
body.team-page .team-hero-intro strong  { font-weight: 800; }
body.team-page .team-hero-copy > p.team-hero-followup  {
  max-width: 35ch;
  margin-top: 22px;
  color: #09090b;
  font-size: clamp(18px, 1.65vw, 23px);
  line-height: 1.45;
}
body.team-page .team-actions  {
  max-width: 530px;
  gap: 8px 23px;
  margin-top: 32px;
}
body.team-page .team-actions .button  {
  min-height: 60px;
  padding: 15px 30px;
  font-size: 19px;
  border-radius: 8px;
}
body.team-page .team-actions > a:not(.button)  {
  font-size: 14px;
  line-height: 1.4;
}
body.team-page .team-hero-copy > .team-small  {
  color: #56585a;
  margin-top: 13px;
  font-size: 13px;
}
body.team-page .team-hero-image  {
  position: absolute;
  inset: 0 0 0 auto;
  z-index: -1;
  width: 71%;
  height: 100%;
  min-height: 0;
  max-height: none;
  overflow: hidden;
}
body.team-page .team-hero-image img  {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 67% 50%;
}
body.team-page .team-hero-image::after  {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #fff 0%, #fff 7%, #fffffff5 19%, #ffffffa6 30%, #ffffff00 44%);
  pointer-events: none;
}

/* The venue supports the training story at a deliberately smaller scale. */
body.team-page .team-attention  { padding-block: 64px 66px; }
body.team-page .team-attention-inner  {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr);
  gap: clamp(44px, 5vw, 72px);
  align-items: center;
}
body.team-page .team-attention h2  {
  margin-bottom: 29px;
}
body.team-page .team-attention-copy > p  {
  font-size: clamp(18px, 1.6vw, 22px);
  line-height: 1.48;
  max-width: 46ch;
}
body.team-page .team-venue  { min-width: 0; }
body.team-page .team-venue > img  {
  width: 100%;
  aspect-ratio: 1.78;
  object-fit: cover;
  object-position: center 52%;
}
body.team-page .team-venue h3  {
  margin-top: 19px;
  font-family: var(--font);
  font-weight: 850;
  line-height: 1.2;
  letter-spacing: -.025em;
}
body.team-page .team-venue figcaption > p  {
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.5;
}
body.team-page .team-venue figcaption > span  {
  display: block;
  margin-top: 13px;
  color: #626266;
  font-size: 12px;
  text-align: right;
}

/* Existing deeper content remains in its original sequence and functional. */
body.team-page .team-attention + .team-section  { padding-top: 38px; }
body.team-page .team-split  { gap: clamp(40px, 5vw, 72px); }
body.team-page .team-program-heading  { gap: 64px; }
body.team-page .team-program-heading h2  { max-width: 15ch; }
body.team-page .team-timeline  { margin-top: 48px; }
body.team-page .team-timeline h3  { font-size: 28px; }
body.team-page .team-rating strong  { letter-spacing: -.04em; }

/* One grouped investment, without the old rules and plus signs. */
body.team-page .team-investment  {
  background: #09090b;
  color: #fff;
  padding-block: 72px;
}
body.team-page .team-investment .team-split  {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .95fr);
  gap: clamp(44px, 6vw, 86px);
}
body.team-page .team-investment h2  {
  max-width: 17ch;
  line-height: 1.08;
}
body.team-page .team-investment .team-copy > p.team-investment-intro  {
  margin-top: 18px;
  font-size: 23px;
  color: #fff;
  line-height: 1.45;
}
body.team-page .team-investment .team-copy > p:not(.team-investment-intro)  {
  max-width: 45ch;
  color: #d6dad7;
  font-size: 16px;
}
body.team-page .team-price  {
  border: 0;
  padding-top: 0;
  min-width: 0;
  max-width: none;
}
body.team-page .team-amount  {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px 19px;
  font-size: clamp(60px, 5.6vw, 81px);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.05;
  font-variant-numeric: lining-nums;
}
body.team-page .team-amount span  {
  display: inline;
  margin: 0;
  color: #e4e4e7;
  font-size: 15px;
  letter-spacing: 0;
}
body.team-page .team-price > p:not(.team-amount)  {
  margin-top: 17px;
  font-size: 17px;
  color: #fff;
  line-height: 1.55;
}
body.team-page .team-price ul  { margin: 23px 0 28px; }
body.team-page .team-price li  {
  padding: 4px 0;
  border: 0;
  color: #e0e4e1;
  font-size: 15px;
  line-height: 1.55;
}
body.team-page .team-price li::before  { content: none; }
body.team-page .team-price .button  {
  width: 100%;
  min-height: 60px;
  padding: 16px 22px;
  font-size: 19px;
}
body.team-page .team-cost-example  {
  padding-top: 0;
  border: 0;
  margin-top: 30px;
  max-width: 48ch;
}
body.team-page .team-cost-example > summary  {
  cursor: pointer;
  min-height: 44px;
  padding-block: 12px;
  color: #d6dad7;
  font-size: 14px;
  line-height: 1.45;
  text-decoration: underline;
}
body.team-page .team-cost-example p  {
  margin: 4px 0 0;
  color: #d6dad7;
}



body.team-page :is(input, textarea)  { caret-color: #00692b; }
body.team-page :is(.team-investment, .team-proof, .team-booking) :is(a, summary, button):focus-visible  {
  outline-color: #fff;
}

@media (min-width: 1600px) {
  body.team-page .team-hero  { min-height: 740px; }
  body.team-page .team-hero-copy  { padding-top: 100px; }
  body.team-page .team-hero-image  { width: 69%; }
}

@media (max-width: 1180px) and (min-width: 901px) {
  body.team-page .team-hero  { min-height: 610px; }
  body.team-page .team-hero-copy  { width: 62%; padding-top: 60px; padding-bottom: 48px; }
  
  body.team-page .team-hero-copy > p.team-hero-intro  { font-size: 23px; }
  body.team-page .team-hero-copy > p.team-hero-followup  { font-size: 19px; max-width: 31ch; }
  body.team-page .team-hero-image  { width: 70%; }
  body.team-page .team-hero-image::after  { background: linear-gradient(90deg, #fff 0%, #fff 8%, #fffffff5 22%, #ffffffa6 35%, #ffffff00 52%); }
  body.team-page .team-actions  { max-width: 335px; margin-top: 25px; }
  body.team-page .team-actions .button  { font-size: 17px; min-height: 56px; }
  
  body.team-page .team-attention-inner  { grid-template-columns: 1.1fr .9fr; gap: 44px; }
  body.team-page .team-attention-copy > p  { font-size: 19px; }
  
  body.team-page .team-venue figcaption > p  { font-size: 15px; }
  
  body.team-page .team-amount  { font-size: 64px; }
}

@media (max-width: 900px) {
  body.team-page .team-hero  { display: flex; flex-direction: column; min-height: 0; overflow: visible; }
  body.team-page .team-hero-copy  { width: 100%; padding: 48px var(--gutter) 38px; }
  body.team-page .team-hero h1  { max-width: none; }
  body.team-page .team-hero-copy > p.team-hero-intro  { font-size: 25px; max-width: 36ch; margin-top: 24px; }
  body.team-page .team-hero-copy > p.team-hero-followup  { font-size: 20px; max-width: 47ch; margin-top: 19px; }
  body.team-page .team-actions  { max-width: none; margin-top: 26px; }
  body.team-page .team-actions .button  { font-size: 17px; min-height: 56px; }
  body.team-page .team-hero-image  { position: relative; inset: auto; z-index: 0; width: 100%; height: auto; aspect-ratio: 1.7; }
  body.team-page .team-hero-image img  { object-position: 50% 48%; }
  body.team-page .team-hero-image::after  { content: none; }
  body.team-page .team-attention  { padding-block: 52px; }
  body.team-page .team-attention-inner  { grid-template-columns: 1fr 1fr; gap: 36px; align-items: start; }
  
  body.team-page .team-attention-copy > p  { font-size: 18px; }
  
  body.team-page .team-venue figcaption > p  { font-size: 15px; }
  body.team-page .team-split  { grid-template-columns: 1fr; gap: 38px; }
  body.team-page .team-program-heading  { grid-template-columns: 1fr; gap: 24px; }
  body.team-page .team-program-heading h2  { max-width: none; }
  body.team-page .team-investment .team-split  { grid-template-columns: 1fr 1fr; gap: 42px; }
  
  body.team-page .team-investment .team-copy > p.team-investment-intro  { font-size: 19px; }
  body.team-page .team-amount  { font-size: 58px; gap: 10px 16px; }
  body.team-page .team-price .button  { font-size: 16px; }
  
}

@media (max-width: 600px) {
  body.team-page  { --team-space: 52px; }
  body.team-page .team-hero-copy  { padding-top: 35px; padding-bottom: 29px; }
  body.team-page .team-hero h1  { line-height: 1.08; letter-spacing: -.015em; }
  body.team-page .team-hero-copy > p.team-hero-intro  { font-size: 20px; max-width: 29ch; line-height: 1.4; margin-top: 21px; }
  body.team-page .team-desktop-break  { display: none; }
  body.team-page .team-hero-copy > p.team-hero-followup  { font-size: 17px; max-width: 36ch; line-height: 1.5; margin-top: 17px; }
  body.team-page .team-actions  { gap: 8px 20px; margin-top: 23px; }
  body.team-page .team-actions .button  { min-height: 54px; font-size: 16px; padding-inline: 24px; }
  body.team-page .team-actions > a:not(.button)  { font-size: 13px; }
  body.team-page .team-hero-copy > .team-small  { font-size: 12px; margin-top: 8px; }
  body.team-page .team-hero-image  { aspect-ratio: 1.5; }
  body.team-page .team-attention  { padding-block: 43px 48px; }
  body.team-page .team-attention-inner  { grid-template-columns: 1fr; gap: 30px; }
  body.team-page .team-attention h2  { margin-bottom: 22px; }
  body.team-page .team-attention-copy > p  { font-size: 17px; line-height: 1.6; }
  body.team-page .team-venue  { max-width: 460px; }
  body.team-page .team-venue > img  { aspect-ratio: 1.9; }
  body.team-page .team-venue h3  { margin-top: 16px; }
  body.team-page .team-venue figcaption > p  { font-size: 15px; }
  body.team-page .team-venue figcaption > span  { margin-top: 10px; font-size: 12px; }
  body.team-page .ff-week-preview .cal-event  { font-size: 11px; }
  body.team-page .team-attention + .team-section  { padding-top: 12px; }
  
  body.team-page :is(.team-copy > p, .team-program-heading > p)  { font-size: 16px; }
  body.team-page .team-copy h2  { margin-bottom: 23px; }
  body.team-page .team-timeline  { margin-top: 34px; }
  body.team-page .team-timeline h3  { font-size: 27px; }
  body.team-page .team-investment  { padding-block: 50px; }
  body.team-page .team-investment .team-split  { grid-template-columns: 1fr; gap: 35px; }
  body.team-page .team-investment h2  { max-width: none; }
  body.team-page .team-investment .team-copy > p.team-investment-intro  { font-size: 19px; }
  body.team-page .team-investment .team-copy > p:not(.team-investment-intro)  { font-size: 15px; margin-top: 16px; }
  body.team-page .team-cost-example  { margin-top: 18px; }
  body.team-page .team-amount  { font-size: clamp(58px, 15vw, 78px); }
  body.team-page .team-price > p:not(.team-amount)  { font-size: 16px; margin-top: 14px; }
  body.team-page .team-price ul  { margin-block: 20px 25px; }
  body.team-page .team-price .button  { font-size: 17px; min-height: 56px; }
  
  
}

@media (max-width: 360px) {
  
  body.team-page .team-hero-copy > p.team-hero-intro  { font-size: 18px; }
  body.team-page .team-actions  { display: grid; gap: 2px; justify-items: start; }
  body.team-page .team-actions .button  { padding-inline: 22px; font-size: 15px; }
  
  body.team-page .team-amount  { font-size: 57px; }
}

@media (prefers-reduced-motion: reduce) {
  body.team-page *, body.team-page *::before, body.team-page *::after  {
    scroll-behavior: auto;
    animation-duration: .01ms;
    animation-iteration-count: 1;
    transition-duration: .01ms;
  }
}

/* Inter roles match the existing website hierarchy, with room for real copy. */
body.team-page .team-hero h1 {
  font-size: clamp(47px, 4.9vw, 72px);
  font-weight: 850;
  line-height: 1.02;
  letter-spacing: -.04em;
}
body.team-page :is(.team-copy, .team-program-heading, .team-attention,
  .team-investment, .team-faq, .team-booking, .team-resource) h2 {
  font-size: clamp(38px, 4.15vw, 60px);
  line-height: 1.04;
  letter-spacing: -.035em;
}
body.team-page .team-venue h3 { font-size: 28px; }
@media (max-width: 1150px) {
  body.team-page .team-hero h1 { font-size: clamp(42px, 5.1vw, 62px); }
  body.team-page :is(.team-copy, .team-program-heading, .team-attention,
    .team-investment, .team-faq, .team-booking, .team-resource) h2 { font-size: 45px; }
}
@media (max-width: 900px) {
  body.team-page .team-hero h1 { font-size: clamp(54px, 8.4vw, 75px); }
  body.team-page :is(.team-copy, .team-program-heading, .team-attention,
    .team-investment, .team-faq, .team-booking, .team-resource) h2 { font-size: 48px; }
}
@media (max-width: 600px) {
  body.team-page .team-hero h1 { font-size: clamp(32px, 9vw, 48px); }
  body.team-page :is(.team-copy, .team-program-heading, .team-attention,
    .team-investment, .team-faq, .team-booking, .team-resource) h2 { font-size: 36px; }
  body.team-page .team-venue h3 { font-size: 26px; }
}
@media (max-width: 360px) {
  body.team-page .team-hero h1 { font-size: 31px; }
  body.team-page :is(.team-copy, .team-program-heading, .team-attention,
    .team-investment, .team-faq, .team-booking, .team-resource) h2 { font-size: 32px; }
}


/* Statement, toekomstige resultaatquotes en garantie op de teampagina. */
body.team-page .team-reframe .team-copy {
  max-width: 68ch;
}

body.team-page .team-proof .team-quote-result {
  margin-top: 14px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.6;
}

body.team-page .team-quote figcaption strong,
body.team-page .team-quote figcaption span {
  display: block;
  line-height: 1.7;
}
body.team-page .team-quote figcaption strong { font-size: 13px; }
body.team-page .team-quote figcaption span { font-size: 12px; }

body.team-page .team-price > p.team-guarantee {
  margin: 0 0 24px;
  padding-left: 14px;
  border-left: 3px solid var(--green);
  font-size: 14px;
  line-height: 1.6;
}


/* Teamtraining 2 november 2026: uitkomst, overlegcalculator en doorstuurmail. */
body.team-page .team-investment-link { display: inline-block; margin-left: 14px; font-weight: 650; }
body.team-page .team-investment-heading { margin-bottom: 42px; }
body.team-page .team-investment .team-investment-heading h2 { max-width: 30ch; margin-bottom: 22px; }
body.team-page .team-investment .team-investment-heading > p.team-investment-intro { max-width: 64ch; font-size: 20px; }
body.team-page .team-investment .team-investment-grid { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: clamp(36px,5vw,72px); }
body.team-page .team-calculator h3 { font-size: 28px; line-height: 1.18; margin-bottom: 12px; }
body.team-page .team-calculator > p { font-size: 15px; line-height: 1.65; }
body.team-page .team-calculator-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-block: 25px; }
body.team-page .team-calculator-field { min-width: 0; }
body.team-page .team-calculator-field label { display: block; min-height: 44px; margin-bottom: 7px; font-size: 13px; font-weight: 700; line-height: 1.5; }
body.team-page .team-calculator-field input { display: block; width: 100%; min-width: 0; min-height: 50px; padding: 10px 12px; border: 1px solid var(--team-rule); border-radius: 6px; background: var(--paper); color: var(--ink); font: 650 19px/1.3 var(--font); }
body.team-page .team-calculator-field input:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
body.team-page .team-calculator-field input[aria-invalid="true"] { border-width: 3px; }
body.team-page .team-calculator-field > span { display: block; margin-top: 8px; font-size: 11px; line-height: 1.5; }
body.team-page .team-calculator-results { padding-block: 20px; border-block: 1px solid var(--team-rule); }
body.team-page .team-calculator-formula { font-size: 14px; line-height: 1.6; }
body.team-page .team-calculator-totals { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 20px; margin: 20px 0; }
body.team-page .team-calculator-totals dt { font-size: 13px; line-height: 1.5; }
body.team-page .team-calculator-totals dd { margin: 7px 0 0; color: var(--green); font-size: clamp(29px,3vw,41px); font-weight: 850; line-height: 1.1; letter-spacing: -.035em; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
body.team-page .team-calculator-comparison { font-size: 14px; line-height: 1.6; }
body.team-page .team-calculator > p.team-calculator-note { margin-top: 17px; font-size: 12px; line-height: 1.65; }
body.team-page .team-calculator-error { margin-bottom: 20px; padding-left: 12px; border-left: 3px solid var(--green); }
body.team-page .team-share-link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; margin-top: 20px; color: var(--paper); font-size: 16px; font-weight: 700; text-underline-offset: .25em; }
body.team-page .team-cost-context > p.team-share-help { margin-top: 5px; font-size: 12px; line-height: 1.6; }
body.team-page .team-price > p.team-price-label { margin: 0 0 16px; font-size: 16px; font-weight: 700; }
body.team-page .team-price > p.team-price-explainer { font-size: 14px; line-height: 1.65; }
body.team-page .team-price li:first-child { color: var(--paper); }
@media (max-width: 900px) {
 body.team-page .team-investment .team-investment-grid { grid-template-columns: minmax(0,1fr); gap: 44px; }
 body.team-page .team-calculator, body.team-page .team-cost-context { max-width: 650px; }
 body.team-page .team-calculator-totals dd { font-size: 38px; }
}
@media (max-width: 600px) {
 body.team-page .team-investment-link { display: block; width: fit-content; margin: 8px 0 0; }
 body.team-page .team-investment-heading { margin-bottom: 30px; }
 body.team-page .team-investment .team-investment-heading > p.team-investment-intro { font-size: 17px; }
 body.team-page .team-calculator h3 { font-size: 25px; }
 body.team-page .team-calculator-fields { grid-template-columns: minmax(0,1fr); gap: 18px; }
 body.team-page .team-calculator-field label { min-height: 0; font-size: 14px; }
 body.team-page .team-calculator-field > span { font-size: 12px; }
 body.team-page .team-calculator-totals { gap: 14px; }
 body.team-page .team-calculator-totals dd { font-size: clamp(26px,8vw,35px); }
 body.team-page .team-price > p.team-price-explainer { font-size: 14px; }
 body.team-page .team-share-link { font-size: 15px; }
}


/* Bondige copy, leesbare groene accenten en veilige uitsnede op brede schermen. */
body.team-page .team-emphasis { color: var(--green-text); }
body.team-page :is(.team-program, .team-investment, .team-booking, .team-proof) .team-emphasis { color: var(--green); }
body.team-page .team-hero { max-width: 1920px; margin-inline: auto; }
body.team-page .team-hero .team-hero-image img { object-position: 78% 0%; }
body.team-page .team-calculator-fields { margin-top: 20px; }


/* Eerst de COI, daarna een afzonderlijk investeringsblok. */
body.team-page .team-coi { background: var(--soft); color: var(--ink); }
body.team-page .team-coi-inner,
body.team-page .team-investment-inner { max-width: 1000px; }
body.team-page .team-coi-heading { margin-bottom: 32px; }
body.team-page .team-coi-heading h2 { margin-bottom: 0; max-width: 24ch; }
body.team-page .team-coi .team-calculator-fields { margin-top: 0; }
body.team-page .team-coi .team-calculator-totals dd { color: var(--green-text); font-size: clamp(36px,4vw,56px); }
body.team-page .team-coi .team-calculator-field input:focus-visible { outline-color: var(--green-text); }
body.team-page .team-coi .team-calculator-note { color: var(--muted); }
body.team-page .team-investment .team-investment-inner .team-price { max-width: none; }
body.team-page .team-investment .team-price > p.team-calculator-comparison { max-width: 64ch; margin-block: 20px 24px; font-size: 15px; line-height: 1.6; }
@media (max-width: 600px) {
 body.team-page .team-coi-heading { margin-bottom: 26px; }
 body.team-page .team-coi .team-calculator-totals dd { font-size: clamp(27px,7.5vw,35px); }
 body.team-page .team-investment .team-price > p.team-calculator-comparison { font-size: 14px; }
}


/* Groene vinkjes bij de inbegrepen onderdelen van het teamprogramma. */
body.team-page .team-price > ul[aria-label="Inbegrepen in het complete teamprogramma"] > li {
  position: relative;
  padding-left: 26px;
}
body.team-page .team-price > ul[aria-label="Inbegrepen in het complete teamprogramma"] > li::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 8px;
  width: 7px;
  height: 12px;
  box-sizing: border-box;
  border: solid var(--green);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
