/*
Theme Name: Leeftijd.nl GeneratePress Child
Theme URI: https://leeftijd.nl/
Description: Custom GeneratePress child theme for Leeftijd.nl.
Author: Leeftijd.nl
Template: generatepress
Version: 1.0.0
Text Domain: leeftijd
*/

:root{
  --leeftijd-blue:#1677d2;
  --leeftijd-blue-dark:#0e2f55;
  --leeftijd-light:#edf7ff;
  --leeftijd-cream:#f7f2ec;
  --leeftijd-text:#12304e;
  --leeftijd-muted:#6b7d90;
  --leeftijd-radius:24px;
}

body{color:var(--leeftijd-text);background:#fff;font-family:Inter,Arial,sans-serif;}
a{text-decoration:none;}
.site-header{box-shadow:0 2px 15px rgba(18,48,78,.06);}
.main-navigation .main-nav ul li a{font-weight:600;}

.leeftijd-wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
.leeftijd-hero{background:linear-gradient(90deg,#eaf5ff 0%,#f9fcff 46%,#f6f2ed 100%);padding:48px 0 28px;overflow:hidden;}
.leeftijd-hero-grid{display:grid;grid-template-columns:1.05fr 1.1fr .9fr;gap:32px;align-items:center;}
.leeftijd-kicker{display:inline-flex;padding:7px 12px;border-radius:999px;background:#fff;border:1px solid #dbeaf7;font-size:14px;font-weight:700;color:var(--leeftijd-blue);}
.leeftijd-hero h1{font-size:58px;line-height:.98;letter-spacing:-2px;margin:16px 0 20px;color:#0e2f55;}
.leeftijd-hero p{font-size:19px;line-height:1.6;color:#395b78;max-width:520px;}
.leeftijd-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--leeftijd-blue);color:#fff;border-radius:999px;padding:15px 24px;font-weight:700;border:0;cursor:pointer;}
.leeftijd-btn:hover{background:#0f68bb;color:#fff;}
.leeftijd-note{margin-top:12px;color:#668096;font-size:14px;}

.leeftijd-face{position:relative;min-height:460px;border-radius:32px;overflow:hidden;background:#dfe8ee center/cover no-repeat;box-shadow:0 18px 45px rgba(24,64,102,.15);}
.leeftijd-face:after{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:rgba(255,255,255,.8);}
.leeftijd-face-badge{position:absolute;bottom:20px;padding:9px 13px;background:rgba(255,255,255,.92);border-radius:14px;font-weight:800;font-size:14px;box-shadow:0 8px 20px rgba(0,0,0,.08);}
.leeftijd-face-badge.left{left:24px}.leeftijd-face-badge.right{right:24px}

.leeftijd-upload-card{background:#fff;padding:22px;border-radius:24px;box-shadow:0 18px 45px rgba(24,64,102,.14);}
.leeftijd-dropzone{border:2px dashed #9bc7ee;border-radius:18px;padding:34px 20px;text-align:center;}
.leeftijd-dropzone strong{display:block;font-size:19px;margin:10px 0 5px;}
.leeftijd-dropzone small{display:block;color:#7890a5;margin-bottom:20px;}
.leeftijd-file{display:none;}
.leeftijd-preview{margin-top:16px;display:none;border-radius:16px;overflow:hidden;}
.leeftijd-preview img{display:block;width:100%;height:auto;}

.leeftijd-benefits{padding:28px 0;background:#fff;border-bottom:1px solid #edf1f4;}
.leeftijd-benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.leeftijd-benefit{display:flex;gap:14px;align-items:center;}
.leeftijd-icon{width:52px;height:52px;flex:0 0 52px;border-radius:50%;background:var(--leeftijd-light);display:grid;place-items:center;font-size:22px;}
.leeftijd-benefit strong{display:block;margin-bottom:3px}.leeftijd-benefit span{font-size:14px;color:var(--leeftijd-muted);}

.leeftijd-section{padding:72px 0;}
.leeftijd-section h2{font-size:38px;letter-spacing:-1px;margin:0 0 14px;}
.leeftijd-section .intro{color:var(--leeftijd-muted);font-size:18px;max-width:720px;margin-bottom:34px;}
.leeftijd-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.leeftijd-step{padding:28px;background:#fff;border:1px solid #e8eef3;border-radius:22px;box-shadow:0 10px 30px rgba(20,55,85,.06);}
.leeftijd-step-num{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--leeftijd-light);color:var(--leeftijd-blue);font-weight:800;margin-bottom:16px;}

.leeftijd-analysis-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
.leeftijd-analysis-card{background:#fff;border:1px solid #e8eef3;border-radius:18px;overflow:hidden;}
.leeftijd-analysis-image{height:115px;background:linear-gradient(135deg,#dfeaf2,#f3e5dc);}
.leeftijd-analysis-card div:last-child{padding:14px;}
.leeftijd-analysis-card strong{display:block;margin-bottom:4px;}.leeftijd-analysis-card span{font-size:13px;color:var(--leeftijd-muted);}

.leeftijd-products{background:var(--leeftijd-cream);}
.leeftijd-product-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;}
.leeftijd-product-visual{min-height:300px;border-radius:28px;background:linear-gradient(140deg,#ede4d9,#fff);display:grid;place-items:center;font-size:70px;}

.leeftijd-cta{background:linear-gradient(120deg,#0c2b49,#173f66);color:#fff;padding:48px 0;}
.leeftijd-cta-grid{display:flex;justify-content:space-between;align-items:center;gap:30px;}
.leeftijd-cta h2{margin:0 0 8px;font-size:38px;color:#fff}.leeftijd-cta p{margin:0;color:#d8e6f2;}

.leeftijd-result{display:none;margin-top:20px;padding:18px;border-radius:16px;background:#eef7ff;border:1px solid #cfe5f8;}

@media(max-width:980px){
 .leeftijd-hero-grid{grid-template-columns:1fr 1fr}.leeftijd-upload-card{grid-column:1/-1}.leeftijd-benefit-grid{grid-template-columns:repeat(2,1fr)}
 .leeftijd-analysis-grid{grid-template-columns:repeat(3,1fr)}.leeftijd-hero h1{font-size:48px}
}
@media(max-width:680px){
 .leeftijd-wrap{padding:0 18px}.leeftijd-hero-grid,.leeftijd-product-grid{grid-template-columns:1fr}.leeftijd-hero h1{font-size:42px}.leeftijd-face{min-height:390px}
 .leeftijd-benefit-grid,.leeftijd-steps{grid-template-columns:1fr}.leeftijd-analysis-grid{grid-template-columns:repeat(2,1fr)}.leeftijd-section{padding:52px 0}.leeftijd-cta-grid{align-items:flex-start;flex-direction:column}
}

/* v2: zachte overgang voor de automatische headerfotocarrousel */
.leeftijd-face{transition:opacity .28s ease, transform .28s ease;}
.leeftijd-face.is-changing{opacity:.72;transform:scale(.995);}
@media (prefers-reduced-motion: reduce){.leeftijd-face{transition:none}.leeftijd-face.is-changing{opacity:1;transform:none}}