/* Wiskundetrainer product pages, using the existing JS-Educatie palette. */
.trainer-hero{padding:58px 0 86px}
.trainer-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center;position:relative;z-index:1}
.trainer-hero h1{font-size:clamp(2.45rem,4.25vw,3.6rem);line-height:1.09;letter-spacing:-.045em;overflow-wrap:break-word}
.trainer-hero .hero-copy>p{font-size:1.04rem;line-height:1.8;max-width:530px;margin-bottom:26px}
.trainer-hero .hero-copy>.eyebrow{font-size:.68rem;margin-bottom:22px}
.trainer-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 24px}
.trainer-actions .button{font-size:.875rem;padding:14px 20px;gap:12px}
.trainer-actions .text-action{font-size:.85rem}
.access-note,.trainer-hero .hero-copy>.access-note{font-size:.76rem;line-height:1.7;margin:16px 0 0;color:#526176}
.trainer-preview{margin:0;min-width:0;background:#fff;border:1px solid #d6e1f1;border-radius:18px;overflow:hidden;box-shadow:0 24px 64px -28px #18366355;transform:rotate(1deg)}
.preview-heading{padding:20px 22px;display:flex;align-items:center;gap:8px;background:#fff;font-size:.8rem;flex-wrap:wrap}
.preview-heading .status-dot{margin:0;flex-shrink:0}
.preview-level{color:#6146ac;background:#f2edfc;border-radius:5px;padding:3px 8px;font-size:.65rem;margin-left:auto;white-space:nowrap}
.preview-image-link{display:block;border-block:1px solid #e3e9f2;line-height:0}
.preview-image-link img{display:block;width:100%;height:auto}
.trainer-preview figcaption{padding:18px 22px;display:flex;flex-direction:column;gap:7px;font-size:.8rem;color:var(--muted)}
.trainer-preview figcaption a{font-size:.8rem;font-weight:700;text-decoration:none;color:var(--blue)}
.trainer-preview figcaption a:hover{text-decoration:underline}
.trainer-highlights{border-bottom:1px solid var(--line);background:#fff}
.trainer-highlights>.container{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding-block:24px}
.trainer-highlights span{color:var(--muted);font-size:.8rem;line-height:1.65}
.trainer-highlights strong{display:block;color:var(--ink);font-size:.9rem}
.trainer-highlights span+span{padding-left:28px;border-left:1px solid var(--line)}
.trainer-steps{list-style:none;padding:0;margin:42px 0 28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px}
.trainer-steps li{border-top:2px solid #dce7f9;padding-top:22px}
.step-number{font-size:.8rem;font-weight:750;color:var(--blue);display:block;margin-bottom:18px}
.trainer-steps h3{font-size:1.2rem;line-height:1.35;margin-bottom:12px}
.trainer-steps p{font-size:.94rem;margin-bottom:0}
.trainer-audiences{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.trainer-audience{padding:34px;border:1px solid #ccdef9;border-radius:18px;background:#f0f6ff;display:flex;flex-direction:column;align-items:start}
.trainer-audience>.eyebrow{color:#1d4ed8;font-size:.65rem}
.trainer-audience h3{font-size:1.55rem;line-height:1.25;max-width:380px}
.trainer-audience p{font-size:.96rem}
.trainer-audience>.text-action{margin-top:auto}
.trainer-audience:nth-child(2){background:#eef8f3;border-color:#cbe4d7}
.trainer-audience:nth-child(2) .eyebrow,.trainer-audience:nth-child(2) .text-action{color:#047857}
.trainer-maker{max-width:940px;display:grid;grid-template-columns:160px 1fr;gap:50px;align-items:center}
.maker-portrait img{width:160px;height:194px;object-fit:cover;border-radius:22px;display:block}
.trainer-maker p{font-size:1rem;line-height:1.85}
.personal-support{margin-top:36px;padding-top:28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:24px}
.personal-support p{font-size:.9rem;margin:0}
.personal-support strong{display:block;color:var(--ink)}
.personal-support>.text-action{flex-shrink:0;font-size:.85rem}
.trainer-closing{background:linear-gradient(110deg,#edf5ff,#f4f4fc 65%,#eff9f4)}
.closing-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
.closing-inner h2{margin-bottom:12px}
.closing-inner p{margin-bottom:0}
.closing-inner>div:last-child{flex-shrink:0}
.product-hero{padding-top:24px}
.product-hero .breadcrumb{margin-bottom:36px}
.product-nav{border-bottom:1px solid var(--line);background:#fff}
.product-nav>.container{display:flex;gap:28px;flex-wrap:wrap;padding-block:18px}
.product-nav a{font-size:.83rem;font-weight:650;text-decoration:none;color:var(--muted)}
.product-nav a:hover{color:var(--blue);text-decoration:underline}
.trainer-benefits{display:grid;grid-template-columns:1fr 1fr;gap:44px 64px;margin-top:40px}
.trainer-benefits article{border-top:1px solid #ccd8e8;padding-top:24px}
.benefit-marker{font-size:.65rem;font-weight:750;letter-spacing:.1em;color:var(--blue);display:block;margin-bottom:16px}
.trainer-benefits h3{font-size:1.45rem;line-height:1.3}
.trainer-benefits p{font-size:.96rem;max-width:510px}
.progress-note{margin-top:44px;background:#edf4ff;border-left:3px solid var(--blue);padding:22px 26px;border-radius:0 12px 12px 0}
.progress-note strong{font-size:1rem}
.progress-note p{font-size:.9rem;margin:8px 0 0}
.trainer-guidance{background:#edf6f1}
.guidance-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.guidance-grid>.eyebrow,.guidance-grid>div>.eyebrow{color:#047857}
.guidance-grid h2{max-width:500px}
.guidance-grid .button{margin-top:8px;font-size:.875rem}
.guidance-example{padding:34px;background:#fff;border:1px solid #d4e5da;border-radius:18px}
.guidance-example>.eyebrow{font-size:.64rem}
.guidance-example h3{font-size:1.4rem}
.guidance-example ol{padding-left:20px;margin:0}
.guidance-example li{font-size:.92rem;color:var(--muted);padding-left:7px;margin-bottom:20px}
.guidance-example li::marker{color:#047857;font-weight:700}
.guidance-example li strong{display:block;color:var(--ink)}
.guidance-example .small-copy{padding-top:18px;border-top:1px solid var(--line);margin-bottom:0}
.faq-layout{display:grid;grid-template-columns:1fr 1.6fr;gap:70px}
.trainer-faq details{border-bottom:1px solid #d8e1ed}
.trainer-faq details:first-child{border-top:1px solid #d8e1ed}
.trainer-faq summary{font-size:.95rem;font-weight:650;cursor:pointer;padding:22px 32px 22px 0;position:relative;list-style:none;line-height:1.5}
.trainer-faq summary::-webkit-details-marker{display:none}
.trainer-faq summary::after{content:'+';position:absolute;right:3px;top:20px;font-size:1.2rem;color:var(--blue)}
.trainer-faq details[open]>summary::after{content:'−'}
.trainer-faq p{font-size:.9rem;margin:0;padding:0 20px 24px 0}
@media(max-width:1060px){
  .trainer-hero-grid{gap:30px;grid-template-columns:1fr 1fr}
  .trainer-hero h1{font-size:2.65rem}
  .trainer-hero .hero-copy>p{font-size:.96rem}
  .trainer-hero .hero-copy>.eyebrow{font-size:.6rem}
  .preview-heading{padding:16px;font-size:.73rem}
  .preview-level{display:none}
  .trainer-preview figcaption{padding:16px}
  .trainer-steps{gap:26px}
  .trainer-audience{padding:28px}
  .guidance-grid,.faq-layout{gap:40px}
}
@media(max-width:760px){
  .trainer-hero{padding:38px 0 64px}
  .trainer-hero-grid{grid-template-columns:1fr;gap:32px}
  .trainer-hero h1{font-size:clamp(2.1rem,8.5vw,3.3rem)}
  .trainer-hero .hero-copy>.eyebrow{font-size:.61rem;letter-spacing:.07em;margin-bottom:18px}
  .trainer-hero .hero-copy>p{font-size:1rem;margin-bottom:23px}
  .trainer-actions{gap:18px}
  .trainer-actions .button{font-size:.85rem}
  .trainer-hero .hero-copy>.access-note{font-size:.72rem;margin:14px 0 0}
  .trainer-preview{transform:none;max-width:560px;width:100%;justify-self:center;border-radius:14px}
  .trainer-highlights>.container{grid-template-columns:1fr;gap:12px;padding-block:22px}
  .trainer-highlights span+span{padding:12px 0 0;border-left:0;border-top:1px solid var(--line)}
  .trainer-highlights strong{display:inline;font-size:.85rem;margin-right:4px}
  .trainer-steps{grid-template-columns:1fr;gap:26px;margin:30px 0}
  .trainer-steps li{padding-top:18px}
  .step-number{margin-bottom:10px}
  .trainer-steps h3{margin-bottom:9px}
  .trainer-audiences,.trainer-benefits{grid-template-columns:1fr;gap:26px}
  .trainer-audience{padding:26px}
  .trainer-audience h3{font-size:1.4rem}
  .trainer-maker{grid-template-columns:1fr;gap:26px}
  .maker-portrait img{width:105px;height:128px;border-radius:16px}
  .trainer-maker h2{font-size:1.8rem}
  .personal-support{align-items:start;flex-direction:column;gap:14px}
  .closing-inner{flex-direction:column;align-items:start;gap:24px}
  .closing-inner .access-note{font-size:.75rem;margin-top:12px}
  .product-hero{padding-top:22px}
  .product-hero .breadcrumb{margin-bottom:28px}
  .product-nav>.container{gap:12px 22px;padding-block:18px}
  .product-nav a{font-size:.77rem}
  .trainer-benefits{margin-top:30px}
  .trainer-benefits h3{font-size:1.35rem}
  .progress-note{padding:20px;margin-top:32px}
  .guidance-grid,.faq-layout{grid-template-columns:1fr;gap:30px}
  .guidance-example{padding:26px}
  .guidance-grid .button{font-size:.82rem}
  .trainer-faq summary{font-size:.9rem}
}
@media print{.product-nav,.trainer-preview,.trainer-actions{display:none}.trainer-hero-grid,.guidance-grid,.faq-layout{display:block}}
