/* 0.1.4 (F-a15): lettertypen uit hetzelfde pad en dezelfde versie als Explore (friskle-kennis/assets/fonts, ?v=1.1) */
/* Friskle Friends-informatiepagina (voorstel t297u, IT 25-10-2026). Basis: Marketing mockup v0.3.4 friends.css (huisstijl v1.2).
   Fonts lokaal (v1.1 met euroteken, zelfde bestanden als Explore). Kop en voet als Explore. Geen externe verzoeken. */
@font-face{font-family:"Friskle Serif";font-style:normal;font-weight:400 900;font-display:swap;src:url("../friskle-kennis/assets/fonts/playfair.woff2?v=1.1") format("woff2")}
@font-face{font-family:"Friskle Serif";font-style:italic;font-weight:400 900;font-display:swap;src:url("../friskle-kennis/assets/fonts/playfair-italic.woff2?v=1.1") format("woff2")}
@font-face{font-family:"Friskle Sans";font-style:normal;font-weight:100 900;font-display:swap;src:url("../friskle-kennis/assets/fonts/inter.woff2?v=1.1") format("woff2")}
:root{--plum:#4A243D;--deep:#351829;--coral:#FF7A6B;--cream:#FAF6F1;--ink:#2B1424;--muted:#6A5462;--tint:#F3ECF0;--line:rgba(74,36,61,.18);
--serif:"Friskle Serif",Georgia,serif;--sans:"Friskle Sans",system-ui,Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font:17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--plum)}
a:focus-visible{outline:2px solid var(--plum);outline-offset:3px}
.skip{position:absolute;left:16px;top:-60px;background:var(--plum);color:var(--cream);padding:8px 16px;border-radius:999px}
.skip:focus{top:12px}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.age{margin:0;padding:8px 20px;text-align:center;font-size:13px;color:var(--cream);background:var(--deep)}
.top{background:var(--cream);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;min-height:76px}
.logo img{display:block;width:132px;height:auto}
.top nav a{margin-left:28px;font-weight:600;font-size:15px;text-decoration:none;color:var(--ink)}
.top nav a:hover{text-decoration:underline}
/* hero: aubergine verloop + stippenraster (gids v1.2 h2, campagnepagina) */
.hero{position:relative;overflow:hidden;color:var(--cream);
 background:radial-gradient(60vmax 60vmax at 88% -10%,rgba(255,122,107,.38),transparent 60%),radial-gradient(50vmax 50vmax at -10% 110%,rgba(255,122,107,.22),transparent 60%),linear-gradient(160deg,#4A243D 0%,#351829 100%)}
.hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(250,246,241,.07) 1px,transparent 1px);background-size:22px 22px;opacity:.5;pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:1.25fr 1fr;gap:64px;align-items:center;padding-top:96px;padding-bottom:104px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.eyebrow::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--coral)}
h1{font:400 clamp(42px,5.4vw,72px)/1.04 var(--serif);letter-spacing:-.015em;margin:0 0 14px;max-width:13ch}
.tagline{font:italic 600 clamp(20px,2vw,26px)/1.3 var(--serif);margin:0 0 24px;opacity:.92}
.lead{font-size:19px;line-height:1.6;max-width:36em;margin:0 0 32px;opacity:.92}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin:0 0 14px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none}
.btn-coral{background:var(--coral);color:var(--ink)}
.btn-coral:hover{background:#ff8f82}
button.btn{border:0;font-family:inherit}
.btn[disabled],.btn[disabled]:hover,.btn[disabled]:active,.btn[aria-disabled="true"],.btn[aria-disabled="true"]:hover{background:transparent;color:rgba(250,246,241,.85);border:2px dashed rgba(250,246,241,.5);cursor:not-allowed;box-shadow:none;font-weight:600;transform:none}
@media (forced-colors:active){.btn[disabled]{color:GrayText;border-color:GrayText}}
.more{color:var(--cream);font-weight:600;text-underline-offset:4px}
.fine{font-size:14px;opacity:.78;margin:0}
.card{background:var(--cream);color:var(--ink);border-radius:22px;padding:40px 40px 32px;box-shadow:0 30px 60px rgba(20,6,15,.45)}
.big{font:400 96px/1 var(--serif);color:var(--plum);margin:0;display:flex;align-items:flex-start;gap:6px}
.big::after{content:"";width:14px;height:14px;border-radius:50%;background:var(--coral);margin-top:14px}
.big-sub{font-size:17px;font-weight:600;color:var(--plum);margin:10px 0 22px;max-width:18em}
.ticks{list-style:none;padding:0;margin:0}
.ticks li{position:relative;padding:10px 0 10px 30px;border-top:1px solid var(--line)}
.ticks li::before{content:"";position:absolute;left:4px;top:19px;width:9px;height:9px;border-radius:50%;background:var(--coral)}
.card-note{margin:-8px 0 20px;font-size:15px;line-height:1.45;color:var(--plum);max-width:20em}
.card-link{margin:18px 0 0;font-size:15px;font-weight:600}
.card-foot{margin:18px 0 0;font-size:14px;line-height:1.45;color:var(--plum);max-width:22em}
.sec{padding:88px 0}
.sec-tint{background:#fff}
h2{font:italic 600 clamp(28px,2.8vw,38px)/1.2 var(--serif);color:var(--plum);margin:0 0 36px;display:flex;align-items:baseline;gap:14px}
h2::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--coral);transform:translateY(-.15em)}
h3{font:650 19px/1.35 var(--sans);color:var(--plum);margin:0 0 10px}
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.steps li{background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px 28px}
.n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--coral);color:var(--ink);font:700 18px var(--sans);margin-bottom:18px}
.steps p{margin:0;font-size:16px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.box{border-radius:18px;padding:32px}
.box ul{margin:0;padding-left:1.2em}.box li{margin:0 0 10px}
.box-yes{background:var(--cream);border:1px solid var(--line)}
.box-yes li::marker{color:var(--coral)}
.box-no{background:var(--tint)}
.box-no li::marker{color:var(--muted)}
.two-wide{grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}
.ticks-dark li{padding-top:14px;padding-bottom:14px}
.ticks-dark li::before{top:23px}
.panel{background:var(--plum);color:var(--cream);border-radius:22px;padding:36px}
.panel h2{color:var(--cream);font-size:28px;margin-bottom:18px}
.panel h3{color:var(--cream);margin-top:24px}
.panel p{margin:0 0 14px}
.label-ex{display:block;background:var(--cream);color:var(--ink);border-left:5px solid var(--coral);border-radius:8px;padding:14px 18px;font-weight:700;font-size:16px}
.small{font-size:14.5px;opacity:.9}
.narrow{max-width:860px}
.faq details{border-top:1px solid var(--line);padding:6px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:16px 0 10px;font-weight:650;font-size:18px;color:var(--plum)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:9px;height:9px;margin-top:7px;border-right:2px solid var(--plum);border-bottom:2px solid var(--plum);transform:rotate(45deg)}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:11px}
.faq p{margin:0 0 16px;max-width:62ch}
.cta{position:relative;overflow:hidden;background:linear-gradient(160deg,#4A243D 0%,#351829 100%);color:var(--cream);text-align:center}
.cta::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:var(--coral);opacity:.22;right:-140px;top:-180px}
.cta-in{position:relative;z-index:1;padding-top:96px;padding-bottom:96px}
.cta h2{justify-content:center;color:var(--cream);font-size:clamp(34px,3.6vw,48px);margin-bottom:16px}
.cta p{margin:0 0 18px}
.cta a:not(.btn){color:var(--cream)}
.foot{border-top:1px solid var(--line)}
.foot-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;padding-top:28px;padding-bottom:32px;font-size:13.5px;color:var(--muted)}
.foot-in img{width:96px;height:auto}
.foot nav a{color:var(--muted);margin-right:20px}
.foot p{margin:0}
@media (max-width:860px){
 body{font-size:16.5px}
 .bar{min-height:64px}.logo img{width:110px}
 .top nav a{margin-left:18px}
 .hero-grid{grid-template-columns:1fr;gap:40px;padding-top:56px;padding-bottom:64px}
 .lead{font-size:17.5px}
 .actions .btn{width:100%}
 .card{padding:28px 24px 20px}
 .big{font-size:76px}
 .sec{padding:60px 0}
 .steps,.two,.two-wide{grid-template-columns:1fr;gap:18px}
 .two-wide{gap:40px}
 .box,.panel{padding:26px 22px}
 .cta-in{padding-top:64px;padding-bottom:64px}
 .cta .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Kop en voet zoals Explore (friskle-explore-los.css), zelfstandig */
.top .bar{gap:16px;flex-wrap:wrap}
.top .logo{display:inline-flex;align-items:center;min-height:44px}
.top .logo img{width:120px}
.top .logo:focus-visible{outline:2px solid var(--plum);outline-offset:3px;border-radius:3px}
.fr-xv-voet{background:var(--plum);color:var(--cream);padding:48px 0 32px;font-size:15px}
.fr-xv-voet a{color:var(--cream)}
.fr-xv-voet a:focus-visible{outline-color:var(--cream)}
.fr-xv-voet p{margin:0 0 12px}
.fr-xv-voet ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 24px}
.fr-xv-voet li a{display:inline-flex;align-items:center;min-height:44px}
.fr-xv-voet .fr-xv-klein{font-size:13.5px;opacity:.85}
button.btn:focus-visible,.more:focus-visible,.cta a:focus-visible{outline-color:var(--cream)}
.faq summary:focus-visible{outline:2px solid var(--plum);outline-offset:3px;border-radius:3px}
@media (max-width:600px){.top .logo img{width:100px}}
.top .fr-menu a{margin-left:0}