/* assets/over-ons.css — styles for the Over ons page */

/* Pull quote: geboorte van het platform */
.origin-statement {
  margin: 32px 0;
  padding: 0 0 0 20px;
  border-left: 2px solid var(--accent-2);
  background: none;
  border-radius: 0;
  font-size: clamp(16px, 1.8vw, 18px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--ink-1, #2a3a50);
  letter-spacing: -.01em;
  font-style: normal;
}

/* Hero */
.over-hero{padding:64px 0 80px;position:relative}
.over-hero .eyebrow{display:inline-flex}
.over-hero-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;
  align-items:start;margin-top:18px}
@media (max-width:980px){ .over-hero-grid{grid-template-columns:1fr;gap:40px} }
.over-hero h1{font-size:clamp(44px,5.6vw,72px);margin:14px 0 24px;line-height:1.05;
  font-weight:700;letter-spacing:-.028em}
.over-hero h1 em{font-style:normal;color:var(--accent-ink);font-weight:700}
.over-hero-sub{font-size:18px;line-height:1.55;color:var(--ink-2);max-width:540px;
  margin:0}
.over-hero-photo{aspect-ratio:4/3;border-radius:22px;overflow:hidden;margin:0}
.over-hero-photo img{width:100%;height:100%;object-fit:cover;display:block}

/* Reusable two-column text grid (eyebrow + h2 | body copy) */
.over-text-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;
  align-items:start;margin-bottom:48px}
@media (max-width:900px){
  .over-text-grid{grid-template-columns:1fr;gap:24px;margin-bottom:32px}
}
.over-text-eyebrow h2{font-size:clamp(30px,3.8vw,44px);margin:14px 0 0;
  line-height:1.1;font-weight:700;letter-spacing:-.022em;max-width:420px}
.over-text-body p{font-size:16.5px;color:var(--ink-2);line-height:1.6;
  margin:0 0 18px;max-width:580px}
.over-text-body p:last-child{margin-bottom:0}

/* Founders photo in the 'Hoe het begon' block */
.oprichters-photo{margin:28px 0 0;padding:0;max-width:320px}
.oprichters-photo img{display:block;width:100%;height:auto;border-radius:14px;
  box-shadow:var(--shadow-md)}
.oprichters-photo figcaption{margin-top:12px;font-size:13px;color:var(--ink-3);
  line-height:1.5;max-width:320px}

/* Missie / visie blocks */
.over-missie{background:var(--paper);border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)}
.missie-block{margin-bottom:36px}
.missie-block:last-child{margin-bottom:0}
.missie-label{font-family:var(--font-mono);font-size:11px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink);
  display:inline-block;margin-bottom:14px}

/* Team grid */
.over-team-section{padding-top:96px}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:8px}
@media (max-width:900px){ .team-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .team-grid{grid-template-columns:1fr} }
.team-card{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;
  gap:6px;transition:transform .15s ease, box-shadow .15s ease}
.team-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.team-portrait{width:72px;height:72px;border-radius:999px;margin-bottom:10px;
  background:
    repeating-linear-gradient(135deg, rgba(28,37,32,.08) 0 1px, transparent 1px 8px),
    var(--accent-tint);
  border:1px solid rgba(28,37,32,.10);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:13px;letter-spacing:.04em;
  color:var(--primary);font-weight:500}
.team-portrait img{width:100%;height:100%;border-radius:inherit;object-fit:cover;display:block}
.team-name{font-family:var(--font-display);font-size:17px;font-weight:700;
  letter-spacing:-.015em;line-height:1.2}
.team-role{font-size:13px;color:var(--accent-ink);font-weight:500;margin-bottom:6px}
.team-bio{font-size:14px;color:var(--ink-2);line-height:1.5;margin:0}

/* Aanpak grid */
.aanpak-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:8px}
@media (max-width:900px){ .aanpak-grid{grid-template-columns:1fr} }
.aanpak-item{background:var(--paper);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:36px;
  border-top:3px solid var(--accent-2);
  transition:transform .2s, box-shadow .2s}
.aanpak-item:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(31,46,66,.08)}
.aanpak-n{display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  background:var(--accent-tint);color:var(--accent-ink);
  font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:.04em}
.aanpak-item h3{font-family:var(--font-display);font-size:21px;font-weight:700;
  line-height:1.25;margin:16px 0 12px;letter-spacing:-.02em}
.aanpak-item p{color:var(--ink-2);font-size:15px;line-height:1.55;margin:0}

/* Partners */
.over-partners{padding-top:48px}
.partners-card{background:var(--paper);border:1px solid var(--line);
  border-radius:28px;padding:56px;display:grid;
  grid-template-columns:1.4fr 1fr;gap:48px;align-items:center}
@media (max-width:900px){ .partners-card{grid-template-columns:1fr;padding:36px} }
.partners-text h2{font-size:clamp(28px,3.4vw,38px);margin:12px 0 18px;
  line-height:1.15;font-weight:700;letter-spacing:-.022em;max-width:440px}
.partners-text p{color:var(--ink-2);font-size:16px;line-height:1.55;
  margin:0 0 24px;max-width:520px}
.partners-cta-row{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.partners-logo{aspect-ratio:1/1;border-radius:22px;font-size:12px;text-align:center;
  display:flex;align-items:center;justify-content:center;background:var(--bg);
  border:1px solid var(--line);padding:36px}
.partners-logo img{display:block;max-width:100%;max-height:100%;
  width:auto;height:auto;object-fit:contain}

/* Compliance */
.over-compliance{padding-top:32px;padding-bottom:120px}
.compliance-list{list-style:none;padding:0;margin:18px 0 0;display:flex;
  flex-direction:column;gap:10px}
.compliance-list li{display:flex;align-items:flex-start;gap:12px;font-size:15.5px;
  color:var(--ink);line-height:1.5}
.compliance-list .check{display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:999px;background:var(--accent-tint);
  color:var(--accent-ink);font-weight:700;font-size:13px;flex-shrink:0;margin-top:1px}

/* Compact about-teaser used on homepage */
.about-compact{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;
  align-items:center}
@media (max-width:900px){ .about-compact{grid-template-columns:1fr;gap:32px} }
.about-compact h2{font-size:clamp(30px,3.8vw,44px);margin:14px 0 18px;
  line-height:1.1;font-weight:700;letter-spacing:-.022em;max-width:520px}
.about-compact p{color:var(--ink-2);font-size:16.5px;line-height:1.55;
  margin:0 0 8px;max-width:520px}
.about-compact-photo{aspect-ratio:4/3;border-radius:22px;font-size:13px;
  border:1px dashed rgba(28,37,32,.18);text-align:center}