/* Kunuku Man Recycle – huisstijl (Branding/kunuku-man-recycle-huisstijl.html) */
:root{
  --turq:#00BFC9; --turq-d:#0097a0; --coral:#FF6B35; --yellow:#FFC72C; --green:#37B24D; --magenta:#E84A9B;
  --ink:#222B2E; --ink-2:#3a464b; --muted:#5d6e72; --line:#dfe9e7; --tint:#f3faf9; --tint-2:#eaf4f2; --white:#fff;
  --display:'Poppins',system-ui,sans-serif; --body:'Figtree','Poppins',system-ui,sans-serif;
  --r:14px; --r-lg:22px; --shadow:0 10px 30px rgba(34,43,46,.08);
  --wrap:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);line-height:1.12;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(32px,4.1vw,50px);font-weight:700}
h2{font-size:clamp(28px,3.4vw,40px);font-weight:700}
h3{font-size:21px;font-weight:600}
h4{font-size:17px;font-weight:600}
p{margin:0 0 1em}
.wrap{width:min(var(--wrap),calc(100% - 40px));margin:0 auto}
.stripe{height:5px;background:linear-gradient(90deg,var(--turq) 0 20%,var(--green) 20% 40%,var(--yellow) 40% 60%,var(--coral) 60% 80%,var(--magenta) 80%)}
.kicker{font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--turq-d);margin:0 0 12px;display:flex;align-items:center;gap:10px}
.kicker::before{content:"";width:26px;height:3px;background:var(--coral);border-radius:2px}
.lead{font-size:19px;color:var(--ink-2);max-width:64ch}
.muted{color:var(--muted)}
.sec{padding:80px 0}
.sec.tint{background:var(--tint)}
.sec.dark{background:var(--ink);color:#fff}
.sec.dark .kicker{color:var(--turq)}
.sec.dark .lead,.sec.dark .muted{color:rgba(255,255,255,.72)}
.sec-h{max-width:760px;margin-bottom:40px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.four{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media(max-width:960px){.two{grid-template-columns:1fr;gap:28px}.three,.four{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.three,.four{grid-template-columns:1fr}}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:15.5px;padding:13px 22px;border-radius:999px;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform .15s,background .15s,color .15s,border-color .15s;line-height:1.2}
.btn:hover{transform:translateY(-1px)}
.btn.pri{background:var(--coral);color:#fff}
.btn.pri:hover{background:#e95a24}
.btn.sec{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.sec:hover{background:var(--ink);color:#fff}
.btn.turq{background:var(--turq);color:#fff}
.btn.turq:hover{background:var(--turq-d)}
.btn.ghost-w{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn.ghost-w:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn svg{width:18px;height:18px}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hdr .in{display:flex;align-items:center;gap:18px;height:74px;width:min(1360px,calc(100% - 40px))}
.hdr .logo{flex:none;display:block}
.hdr .logo img{height:40px;width:auto}
.hdr nav .acts{display:none}
.hdr nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.hdr nav a{font-family:var(--display);font-weight:500;font-size:14.5px;text-decoration:none;padding:9px 10px;border-radius:8px;color:var(--ink-2);white-space:nowrap}
.hdr nav a:hover{background:var(--tint-2);color:var(--ink)}
.hdr nav a.on{color:var(--turq-d)}
.hdr .acts{display:flex;align-items:center;gap:10px;margin-left:8px}
.hdr .acts .btn{padding:10px 18px;font-size:14.5px;white-space:nowrap}
.hdr .login{font-family:var(--display);font-weight:600;font-size:14.5px;text-decoration:none;color:var(--ink);display:inline-flex;align-items:center;gap:7px;padding:9px 12px;white-space:nowrap}
.hdr .login svg{width:17px;height:17px}
.burger{display:none;margin-left:auto;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:.2s}
@media(max-width:1200px){
  .hdr nav{display:none;position:absolute;left:0;right:0;top:74px;background:#fff;flex-direction:column;align-items:stretch;padding:12px 20px 20px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  .hdr nav.open{display:flex}
  .hdr nav a{padding:12px 10px;font-size:17px}
  .hdr .acts{display:none}
  .hdr nav .acts{display:flex;margin:12px 0 0;flex-direction:column;align-items:stretch}
  .burger{display:block}
  .hdr .login{display:none}
  .hdr nav .acts .login{display:inline-flex;justify-content:center}
}

/* hero */
.hero{padding:64px 0 56px;background:linear-gradient(180deg,var(--tint) 0,#fff 100%)}
.hero .two{align-items:center}
.hero h1{margin:14px 0 18px}
.hero .lead{font-size:20px}
.hero .facts{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
.hero .facts b{color:var(--ink);font-weight:600}
.collage{position:relative;aspect-ratio:1/1;width:100%;max-width:560px;margin-left:auto}
.collage img{position:absolute;object-fit:cover;border-radius:var(--r-lg);box-shadow:0 20px 50px rgba(34,43,46,.16)}
.collage .a{width:62%;height:78%;left:0;top:0}
.collage .b{width:48%;height:52%;right:0;bottom:0;border:6px solid #fff}
.collage .tag{position:absolute;right:6%;top:8%;background:#fff;border-radius:12px;padding:12px 16px;box-shadow:var(--shadow);font-size:14px;line-height:1.35;max-width:210px}
.collage .tag b{display:block;font-family:var(--display);font-size:15px}
@media(max-width:960px){.collage{max-width:100%;margin:0}}

/* target strip */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;background:#fff}
.strip .in{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:center;justify-content:center;font-family:var(--display);font-weight:500;font-size:14.5px;color:var(--muted)}
.strip .in span{display:inline-flex;align-items:center;gap:8px}
.strip .in span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--turq)}
.strip .in span:nth-child(2)::before{background:var(--green)}.strip .in span:nth-child(3)::before{background:var(--yellow)}.strip .in span:nth-child(4)::before{background:var(--coral)}.strip .in span:nth-child(5)::before{background:var(--magenta)}.strip .in span:nth-child(6)::before{background:var(--turq)}.strip .in span:nth-child(7)::before{background:var(--green)}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:step}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.step img{aspect-ratio:4/3;object-fit:cover;width:100%}
.step .t{padding:20px 22px 24px}
.step .t h3{font-size:18px;margin:0 0 8px;display:flex;gap:12px;align-items:baseline}
.step .t h3::before{counter-increment:step;content:counter(step,decimal-leading-zero);font-size:13px;color:var(--coral);font-weight:700;letter-spacing:.06em}
.step .t p{margin:0;font-size:15.5px;color:var(--muted)}
@media(max-width:960px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}

/* icon cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 26px 24px}
.card .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--tint-2);margin-bottom:16px}
.card .ic svg{width:24px;height:24px;stroke:var(--turq-d);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.card.c2 .ic{background:#fff2ec}.card.c2 .ic svg{stroke:var(--coral)}
.card.c3 .ic{background:#fff8e0}.card.c3 .ic svg{stroke:#c99a00}
.card.c4 .ic{background:#edf8ef}.card.c4 .ic svg{stroke:var(--green)}
.card.c5 .ic{background:#fdeaf3}.card.c5 .ic svg{stroke:var(--magenta)}
.card h3{font-size:18.5px;margin-bottom:8px}
.card p{margin:0;font-size:15.5px;color:var(--muted)}
.card .who{margin-top:14px;font-size:13.5px;color:var(--ink-2);padding-top:12px;border-top:1px dashed var(--line)}
.card .who b{font-weight:600}
@media(max-width:960px){.cards{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.cards{grid-template-columns:1fr}}

/* plans */
.plans{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 22px;display:flex;flex-direction:column;position:relative;border-top:5px solid var(--c,var(--turq))}
.plan.pop{box-shadow:var(--shadow)}
.plan .badge{position:absolute;top:-13px;right:16px;background:var(--ink);color:#fff;font-family:var(--display);font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:999px}
.plan h3{font-size:22px;margin-bottom:4px}
.plan .tag{font-size:14.5px;color:var(--muted);margin:0 0 14px;min-height:44px}
.plan .for{font-size:13.5px;color:var(--ink-2);background:var(--tint);border-radius:10px;padding:10px 12px;margin-bottom:16px}
.plan ul{list-style:none;margin:0;padding:0;font-size:14.5px;flex:1}
.plan li{padding:7px 0 7px 26px;position:relative;border-top:1px solid var(--line)}
.plan li:first-child{border-top:0}
.plan li::before{content:"";position:absolute;left:2px;top:13px;width:14px;height:14px;border-radius:50%;background:var(--c,var(--turq));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 7'/%3E%3C/svg%3E") center/contain no-repeat}
.plan .cta{margin-top:18px}
.plan .cta a{display:block;text-align:center;font-family:var(--display);font-weight:600;font-size:14.5px;text-decoration:none;padding:11px;border-radius:999px;border:2px solid var(--ink);color:var(--ink)}
.plan .cta a:hover{background:var(--ink);color:#fff}
.plan.pop .cta a{background:var(--coral);border-color:var(--coral);color:#fff}
@media(max-width:1180px){.plans{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.plans{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.plans{grid-template-columns:1fr}}
.note{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-left:5px solid var(--yellow);border-radius:var(--r);padding:18px 22px;margin-top:28px;font-size:15.5px}
.note svg{width:22px;height:22px;flex:none;stroke:var(--ink);fill:none;stroke-width:1.8;margin-top:2px}
.note p{margin:0}

/* feature list with screenshots */
.shot{border-radius:var(--r-lg);overflow:hidden;box-shadow:0 24px 60px rgba(34,43,46,.18);border:1px solid var(--line);background:#fff}
.shot img{width:100%}
.feat{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:34px 0}
.feat.rev .shot{order:2}
.feat h3{font-size:24px;margin-bottom:10px}
.feat p{color:var(--ink-2)}
.feat ul{margin:14px 0 0;padding-left:0;list-style:none}
.feat li{position:relative;padding:6px 0 6px 28px;font-size:16px}
.feat li::before{content:"";position:absolute;left:0;top:11px;width:16px;height:16px;border-radius:50%;background:var(--turq);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 7'/%3E%3C/svg%3E") center/contain no-repeat}
@media(max-width:960px){.feat{grid-template-columns:1fr;gap:26px}.feat.rev .shot{order:0}}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.gallery figure{margin:0}
.gallery figcaption{font-size:14px;color:var(--muted);margin-top:8px}
@media(max-width:800px){.gallery{grid-template-columns:1fr}}

/* value tiles */
.vals{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.val{background:var(--tint);border-radius:var(--r-lg);padding:24px 22px}
.val b{display:block;font-family:var(--display);font-size:17px;margin-bottom:6px}
.val p{margin:0;font-size:15px;color:var(--muted)}
@media(max-width:960px){.vals{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vals{grid-template-columns:1fr}}

/* partnerships */
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tier{border-radius:var(--r-lg);padding:26px 24px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}
.tier .lvl{font-family:var(--display);font-size:12.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:var(--c);display:inline-block;padding:5px 11px;border-radius:6px;margin-bottom:14px;align-self:flex-start}
.tier h3{font-size:22px;margin-bottom:8px}
.tier .one{font-size:15.5px;color:var(--ink-2);margin-bottom:14px}
.tier .for{font-size:13.5px;color:var(--muted);margin-bottom:16px}
.tier ul{margin:0;padding:0;list-style:none;font-size:14.5px;flex:1}
.tier li{padding:6px 0 6px 20px;position:relative}
.tier li::before{content:"";position:absolute;left:0;top:14px;width:9px;height:9px;border-radius:50%;background:var(--c)}
.tier .meta{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.tier .meta b{color:var(--ink);font-weight:600}
@media(max-width:1060px){.tiers{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.tiers{grid-template-columns:1fr}}
.products{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:22px}
.prod{display:grid;grid-template-columns:44px 1fr;gap:16px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.prod .n{width:44px;height:44px;border-radius:10px;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:14px}
.prod b{display:block;font-family:var(--display);font-size:16.5px;margin-bottom:3px}
.prod p{margin:0;font-size:14.5px;color:var(--muted)}
.prod small{display:block;margin-top:6px;font-size:12.5px;color:var(--turq-d);font-weight:600}
@media(max-width:800px){.products{grid-template-columns:1fr}}

/* app */
.phones{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:end}
.phones figure{margin:0;text-align:center}
.phones img{border-radius:34px;box-shadow:0 30px 60px rgba(0,0,0,.35);width:100%;max-width:280px;margin:0 auto}
.phones figcaption{color:rgba(255,255,255,.75);font-size:14px;margin-top:14px}
.phones figure:nth-child(2) img{max-width:300px}
@media(max-width:800px){.phones{grid-template-columns:1fr;gap:34px}}
.app-pts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.app-pt{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);padding:20px 22px}
.app-pt b{display:block;font-family:var(--display);font-size:16.5px;margin-bottom:6px;color:#fff}
.app-pt p{margin:0;font-size:14.5px;color:rgba(255,255,255,.7)}
@media(max-width:800px){.app-pts{grid-template-columns:1fr}}

/* team */
.team{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.member img{aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-lg);width:100%}
.member b{display:block;font-family:var(--display);font-size:16.5px;margin:12px 0 2px}
.member span{font-size:14px;color:var(--muted)}
@media(max-width:960px){.team{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.team{grid-template-columns:1fr 1fr}}
.quote{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:38px 42px;margin-top:40px;display:grid;grid-template-columns:120px 1fr;gap:30px;align-items:center}
.quote img{width:120px;height:120px;border-radius:50%;object-fit:cover;border:4px solid var(--yellow)}
.quote p{font-family:var(--display);font-size:22px;font-weight:500;line-height:1.35;margin:0 0 10px}
.quote small{color:rgba(255,255,255,.7);font-size:14.5px}
@media(max-width:640px){.quote{grid-template-columns:1fr;padding:28px}}

/* photo band */
.band{position:relative;min-height:560px;background:#111 center 30%/cover no-repeat;display:flex;align-items:center;color:#fff}
.band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,26,28,.86) 0,rgba(20,26,28,.72) 38%,rgba(20,26,28,.05) 75%)}
.band .in{position:relative;z-index:1;padding:70px 0;width:min(var(--wrap),calc(100% - 40px));margin:0 auto}
.band h2,.band p{max-width:30ch}
.band h2{max-width:22ch;color:#fff}
.band p{color:rgba(255,255,255,.88);font-size:17px}

/* contact / form */
.contact{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:start}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;box-shadow:var(--shadow)}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form label{display:block;font-family:var(--display);font-size:13.5px;font-weight:600;margin:14px 0 6px}
.form input,.form select,.form textarea{width:100%;font:inherit;font-size:15.5px;padding:11px 13px;border:1px solid #c9d6d3;border-radius:10px;background:#fff;color:var(--ink)}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--turq);border-color:var(--turq)}
.form textarea{min-height:120px;resize:vertical}
.form .chk{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.form .chk label{display:flex;align-items:center;gap:9px;font-weight:500;font-size:14.5px;margin:0;padding:9px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.form .chk input{width:auto;margin:0}
.form .msg{margin-top:14px;font-size:14.5px;min-height:20px}
.form .msg.ok{color:var(--green)}.form .msg.err{color:#c0392b}
.form .hp{position:absolute;left:-9999px}
@media(max-width:960px){.contact{grid-template-columns:1fr}}
@media(max-width:560px){.form .row,.form .chk{grid-template-columns:1fr}}
.cinfo dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 18px;font-size:16px}
.cinfo dt{font-family:var(--display);font-weight:600;color:var(--muted);font-size:14px;padding-top:2px}
.cinfo dd{margin:0}
.cinfo a{color:var(--turq-d);text-decoration:none;font-weight:500}
.cinfo a:hover{text-decoration:underline}

/* footer */
footer{background:var(--ink);color:rgba(255,255,255,.8);padding:56px 0 30px;font-size:15px}
footer .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px}
footer .brand{display:flex;align-items:center;gap:12px;font-family:var(--display);font-weight:600;color:#fff;font-size:17px;text-decoration:none}
footer .brand img{width:40px;height:40px;border-radius:10px;background:#fff;padding:3px}
footer h4{color:#fff;font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin:0 0 9px}
footer a{color:rgba(255,255,255,.8);text-decoration:none}
footer a:hover{color:#fff;text-decoration:underline}
footer .bottom{margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-wrap:wrap;gap:10px 30px;justify-content:space-between;font-size:13.5px;color:rgba(255,255,255,.55)}
@media(max-width:900px){footer .grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){footer .grid{grid-template-columns:1fr}}

/* subpage */
.page-h{padding:56px 0 40px;background:var(--tint);border-bottom:1px solid var(--line)}
.page-h h1{max-width:20ch}
.page-h .lead{margin-top:14px}
.crumbs{font-size:14px;color:var(--muted);margin-bottom:18px}
.crumbs a{text-decoration:none;color:var(--turq-d)}
.prose{max-width:760px}
.prose h2{font-size:26px;margin:44px 0 12px}
.prose h3{font-size:20px;margin:26px 0 8px}
.prose ul{padding-left:22px}
.prose li{margin:5px 0}

/* locations */
.locs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.loc{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;border-top:5px solid var(--c,var(--turq))}
.loc .day{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--c,var(--turq-d))}
.loc h3{font-size:21px;margin:6px 0 4px}
.loc p{margin:0;color:var(--muted);font-size:15px}
.loc .time{margin-top:12px;font-family:var(--display);font-weight:600;font-size:17px;color:var(--ink)}
.loc a{display:inline-block;margin-top:12px;font-size:14px;color:var(--turq-d);font-weight:600;text-decoration:none}
@media(max-width:860px){.locs{grid-template-columns:1fr}}
.rates{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rate{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.rate img{aspect-ratio:4/3;object-fit:cover;width:100%}
.rate .t{padding:18px 22px 22px}
.rate b{font-family:var(--display);font-size:18px;display:block}
.rate .amt{font-family:var(--display);font-weight:700;font-size:26px;color:var(--coral);margin:4px 0 2px}
.rate small{color:var(--muted);font-size:14px}
@media(max-width:800px){.rates{grid-template-columns:1fr}}
.tips{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tip{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;font-size:15.5px}
.tip svg{width:22px;height:22px;flex:none;stroke:var(--turq-d);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
@media(max-width:700px){.tips{grid-template-columns:1fr}}
.rules{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rule{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 26px}
.rule .num{font-family:var(--display);font-weight:700;color:var(--coral);font-size:13px;letter-spacing:.1em}
.rule h3{font-size:19px;margin:6px 0 10px}
.rule p,.rule li{font-size:15.5px;color:var(--ink-2)}
.rule ul{padding-left:20px;margin:6px 0}
.rule.wide{grid-column:1/-1}
.rule table{width:100%;border-collapse:collapse;font-size:15px;margin-top:6px}
.rule td{padding:8px 6px;border-top:1px solid var(--line);vertical-align:top}
.rule td:first-child{font-family:var(--display);font-weight:600;white-space:nowrap}
@media(max-width:800px){.rules{grid-template-columns:1fr}}

/* reveal */
.rv{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ===================== verhaal: scroll-effecten ===================== */
.hdr{position:sticky;top:0}
.hdr .track{position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--turq) 0 20%,var(--green) 20% 40%,var(--yellow) 40% 60%,var(--coral) 60% 80%,var(--magenta) 80%);opacity:.28}
.hdr .fill{position:absolute;left:0;top:0;height:5px;width:var(--sp,0%);background:linear-gradient(90deg,var(--turq) 0 20%,var(--green) 20% 40%,var(--yellow) 40% 60%,var(--coral) 60% 80%,var(--magenta) 80%);background-size:100vw 100%;background-attachment:fixed}
body{--vh:100vh}

/* hoofdstukbalk */
.rail{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:10px}
.rail a{width:10px;height:10px;border-radius:50%;background:#c7d6d2;display:block;position:relative;transition:background .3s,transform .3s}
.rail a span{position:absolute;right:20px;top:50%;transform:translateY(-50%);white-space:nowrap;font-family:var(--display);font-size:12.5px;font-weight:600;background:var(--ink);color:#fff;padding:5px 10px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s}
.rail a:hover span{opacity:1}
.rail a.on{background:var(--coral);transform:scale(1.35)}
.rail.dark a{background:rgba(255,255,255,.35)}.rail.dark a.on{background:var(--yellow)}
@media(max-width:1200px){.rail{display:none}}

/* overgangen */
.dv{position:relative;height:clamp(50px,7vw,100px);overflow:hidden;line-height:0}
.dv svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.dv.fade{height:180px;background:linear-gradient(180deg,#fff 0,var(--ink) 100%)}
.hero{position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-60px;height:120px;background:#fff;border-radius:50% 50% 0 0/100% 100% 0 0}

/* marquee */
.strip{overflow:hidden}
.strip .in{display:flex;gap:46px;width:max-content;justify-content:flex-start;animation:marq 38s linear infinite;padding-left:46px}
.strip .in span{white-space:nowrap}
@keyframes marq{to{transform:translateX(-50%)}}
.strip:hover .in{animation-play-state:paused}

/* parallax via --p (0 = net onder beeld, 1 = net boven beeld) */
.collage .a{transform:translateY(calc((var(--p,.5) - .5) * -60px))}
.collage .b{transform:translateY(calc((var(--p,.5) - .5) * 50px))}
.collage .tag{transform:translateY(calc((var(--p,.5) - .5) * -90px))}
.band{overflow:hidden}
.band .bg{position:absolute;inset:-12% 0;background:center 30%/cover no-repeat;transform:translateY(calc((var(--p,.5) - .5) * 90px))}
.plans .plan{transition:opacity .6s ease,transform .6s ease}
.plans .plan:nth-child(2){transition-delay:.08s}.plans .plan:nth-child(3){transition-delay:.16s}.plans .plan:nth-child(4){transition-delay:.24s}.plans .plan:nth-child(5){transition-delay:.32s}
.phones figure{transform:translateY(calc((1 - min(1, var(--p,0) * 2.2)) * 90px));opacity:min(1, var(--p,0) * 2.6)}
.phones figure:nth-child(2){transform:translateY(calc((1 - min(1, var(--p,0) * 2.2)) * 140px))}
.phones figure:nth-child(3){transform:translateY(calc((1 - min(1, var(--p,0) * 2.2)) * 110px))}
.sec.dark{position:relative;overflow:hidden}
.sec.dark::before{content:"";position:absolute;width:900px;height:900px;border-radius:50%;left:55%;top:calc(var(--p,0) * 100% - 450px);background:radial-gradient(circle,rgba(0,191,201,.28),rgba(0,191,201,0) 60%);pointer-events:none}
.sec.dark .wrap{position:relative}

/* route-tijdlijn (zo werkt het) */
.route{position:relative;padding:20px 0 40px}
.route svg.path{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.route .line{fill:none;stroke:#d5e3df;stroke-width:4;stroke-linecap:round;stroke-dasharray:1 14}
.route .draw{fill:none;stroke:var(--turq);stroke-width:4;stroke-linecap:round}
.route .node{fill:#fff;stroke:#c7d6d2;stroke-width:3;transition:stroke .4s,fill .4s}
.route .node.lit{fill:var(--coral);stroke:#fff}
.route .mover{transition:opacity .3s}
.tl{display:grid;grid-template-columns:1fr 140px 1fr;align-items:center;min-height:300px}
.tl .card{grid-column:1;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:grid;grid-template-columns:200px 1fr;box-shadow:var(--shadow);opacity:.35;transform:translateX(-24px);transition:opacity .6s ease,transform .6s ease,box-shadow .6s}
.tl:nth-child(even) .card{grid-column:3;transform:translateX(24px)}
.tl.lit .card{opacity:1;transform:none}
.tl .card img{width:100%;height:100%;object-fit:cover;min-height:190px}
.tl .card .t{padding:22px 24px}
.tl .card h3{font-size:18.5px;margin:0 0 8px;display:flex;gap:10px;align-items:baseline}
.tl .card h3 b{font-size:12.5px;color:var(--coral);letter-spacing:.08em}
.tl .card p{margin:0;font-size:15px;color:var(--muted)}
.tl .card .chip{display:inline-block;margin-top:12px;font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--turq-d);background:var(--tint-2);padding:4px 9px;border-radius:6px}
@media(max-width:960px){
  .tl{grid-template-columns:56px 1fr;min-height:0;padding:16px 0}
  .tl .card,.tl:nth-child(even) .card{grid-column:2;grid-template-columns:1fr;transform:translateY(18px)}
  .tl .card img{min-height:0;aspect-ratio:16/9}
}

/* zeereis */
.voyage{position:relative;padding:20px 0 0}
.voyage svg{width:100%;height:auto;display:block;overflow:visible}
.voyage .sea{fill:none;stroke:#d5e3df;stroke-width:3;stroke-dasharray:2 12;stroke-linecap:round}
.voyage .wake{fill:none;stroke:var(--turq);stroke-width:3;stroke-linecap:round}
.voyage text{font-family:var(--display);font-size:13px;font-weight:600;fill:var(--ink-2);letter-spacing:.06em;text-transform:uppercase}
.voyage .lbl{font-family:var(--body);font-size:13px;font-weight:400;fill:var(--muted);text-transform:none;letter-spacing:0}
.voyage .cap{max-width:560px;margin:-10px auto 0;text-align:center;color:var(--ink-2);font-size:16px}

/* scrollytelling portaal */
.scrolly{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start;margin-top:10px}
.scrolly .stage{position:sticky;top:110px}
.scrolly .stage .shot{position:relative;aspect-ratio:16/9;background:#fff}
.scrolly .stage .shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transition:opacity .6s ease,transform .6s ease;transform:scale(1.02)}
.scrolly .stage .shot img.on{opacity:1;transform:none}
.scrolly .stage .cap{display:flex;gap:8px;margin-top:14px}
.scrolly .stage .cap i{height:4px;flex:1;border-radius:2px;background:#d5e3df;transition:background .4s}
.scrolly .stage .cap i.on{background:var(--turq)}
.scrolly .txt{padding:16px 0}
.scrolly .blk{min-height:62vh;display:flex;flex-direction:column;justify-content:center;opacity:.28;transition:opacity .5s ease}
.scrolly .blk.on{opacity:1}
.scrolly .blk h3{font-size:24px;margin-bottom:10px}
.scrolly .blk p{color:var(--ink-2)}
.scrolly .blk ul{margin:14px 0 0;padding-left:0;list-style:none}
.scrolly .blk li{position:relative;padding:6px 0 6px 28px;font-size:16px}
.scrolly .blk li::before{content:"";position:absolute;left:0;top:11px;width:16px;height:16px;border-radius:50%;background:var(--turq);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 7'/%3E%3C/svg%3E") center/contain no-repeat}
.scrolly .blk .mshot{display:none}
@media(max-width:960px){
  .scrolly{grid-template-columns:1fr;gap:0}
  .scrolly .stage{display:none}
  .scrolly .blk{min-height:0;opacity:1;padding:26px 0}
  .scrolly .blk .mshot{display:block;margin-bottom:18px}
}

@media(prefers-reduced-motion:reduce){
  .strip .in{animation:none;width:auto;justify-content:center;flex-wrap:wrap;padding-left:0}
  .collage .a,.collage .b,.collage .tag,.band .bg,.phones figure{transform:none!important;opacity:1!important}
  .tl .card{opacity:1;transform:none}
  .scrolly .blk{opacity:1}
}
.band::before{content:"";position:absolute;left:0;right:0;top:0;height:140px;background:linear-gradient(180deg,var(--ink),rgba(34,43,46,0));z-index:1}

@media(max-width:700px){.voyage svg{margin:0 -6%;width:112%}.voyage text{font-size:26px}.voyage .lbl{display:none}.voyage .shipin{transform:scale(2.4)}.voyage .sea,.voyage .wake{stroke-width:5}.voyage circle{r:12}.voyage .cap{font-size:15px;margin-top:6px}}

/* ===================== hero v2 ===================== */
.hero{background:radial-gradient(900px 520px at 8% 0%,rgba(0,191,201,.14),transparent 60%),radial-gradient(700px 480px at 92% 20%,rgba(255,199,44,.18),transparent 60%),linear-gradient(180deg,var(--tint) 0,#fff 100%);padding:56px 0 70px}
.hero .two{align-items:center}
.hero h1 em{font-style:normal;position:relative;white-space:nowrap}
.hero h1 em svg{position:absolute;left:-2%;right:-2%;bottom:-.12em;width:104%;height:.38em;overflow:visible}
.hero h1 em path{fill:none;stroke:var(--coral);stroke-width:7;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:1000;animation:swoosh 1.1s .5s cubic-bezier(.3,.7,.2,1) forwards}
@keyframes swoosh{to{stroke-dashoffset:0}}
.hero .facts{border-top:0;padding-top:0;margin-top:30px;gap:12px}
.hero .facts span{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 14px 8px 10px;font-size:14px}
.hero .facts i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none}
.hero .facts i svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hero .facts i.g{background:var(--green)}.hero .facts i.c{background:var(--coral)}.hero .facts i.t{background:var(--turq)}
.hart{position:relative;width:100%;max-width:580px;aspect-ratio:1/1;margin-left:auto}
.hart .petals{position:absolute;inset:-6%;width:112%;height:112%;animation:spin 90s linear infinite;opacity:.9}
.hart .ph1{position:absolute;left:6%;top:4%;width:66%;height:80%;object-fit:cover;border-radius:46% 54% 42% 58%/56% 44% 56% 44%;box-shadow:0 30px 60px rgba(34,43,46,.18);transform:translateY(calc((var(--p,.5) - .5) * -50px))}
.hart .ph2{position:absolute;right:4%;bottom:6%;width:40%;aspect-ratio:1/1;object-fit:cover;border-radius:50%;border:7px solid #fff;box-shadow:0 20px 44px rgba(34,43,46,.18);transform:translateY(calc((var(--p,.5) - .5) * 60px))}
.hart .ring{position:absolute;right:-2%;bottom:0;width:52%;aspect-ratio:1/1;border-radius:50%;border:3px dashed var(--coral);opacity:.55;transform:translateY(calc((var(--p,.5) - .5) * 60px))}
.hart .card{position:absolute;right:0;top:6%;background:#fff;border-radius:16px;box-shadow:0 18px 44px rgba(34,43,46,.16);padding:16px 18px 14px;width:236px;transform:translateY(calc((var(--p,.5) - .5) * -90px))}
.hart .card b{display:block;font-family:var(--display);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.hart .card div{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:center;font-size:14px;padding:6px 0;border-top:1px solid var(--line)}
.hart .card div:first-of-type{border-top:0}
.hart .card span{width:22px;height:22px;border-radius:7px;display:grid;place-items:center}
.hart .card span svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hart .card small{display:block;color:var(--muted);font-size:12.5px}
@keyframes spin{to{transform:rotate(360deg)}}
.hero .cue{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:4px;z-index:2}
.hero .cue i{width:18px;height:18px;border-right:2px solid var(--coral);border-bottom:2px solid var(--coral);transform:rotate(45deg);animation:cue 1.6s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translateY(0) rotate(45deg);opacity:.5}50%{transform:translateY(6px) rotate(45deg);opacity:1}}
@media(max-width:960px){.hart{max-width:420px;margin:10px auto 0}.hero .cue{display:none}.hart .card{display:none}}
@media(prefers-reduced-motion:reduce){.hart .petals{animation:none}.hero h1 em path{stroke-dashoffset:0;animation:none}.hero .cue i{animation:none}.hart .ph1,.hart .ph2,.hart .ring,.hart .card{transform:none!important}}

/* ===================== glas wordt zand ===================== */
.glas{position:relative;overflow:hidden}
.glas .sec-h{max-width:820px}
.gline{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 18px 10px;box-shadow:var(--shadow);position:relative}
.gline svg{width:100%;height:auto;display:block;overflow:visible}
.gline .st{opacity:.38;transition:opacity .5s}
.gline .st.lit{opacity:1}
.gline .lbl{font-family:var(--display);font-weight:600;font-size:15px;fill:var(--ink)}
.gline .sub{font-family:var(--body);font-size:12.5px;fill:var(--muted)}
.gline .num{font-family:var(--display);font-weight:700;font-size:12px;fill:#fff}
.gline .flowbg{fill:none;stroke:#e3ebe9;stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.gline .flow{fill:none;stroke:url(#gflow);stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.gline .dots{fill:none;stroke:#fff;stroke-width:3;stroke-dasharray:3 16;stroke-linecap:round;animation:belt 1.2s linear infinite;opacity:0;transition:opacity .5s}
.gline.in .dots{opacity:.9}
@keyframes belt{to{stroke-dashoffset:-19}}
.gline .rotor{transform-box:fill-box;transform-origin:center;animation:spin 3s linear infinite;animation-play-state:paused}
.gline.in .rotor{animation-play-state:running}
.gline .shake{animation:shake .25s linear infinite;animation-play-state:paused}
.gline.in .shake{animation-play-state:running}
@keyframes shake{0%,100%{transform:translate(0,0)}50%{transform:translate(0,2px)}}
.gline .grain{transition:opacity .6s;opacity:0}
.gline .grain.lit{opacity:1}
.gline .note{position:absolute;left:22px;top:16px;font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--turq-d);background:var(--tint-2);padding:5px 10px;border-radius:6px}
.gline-m{display:none}
@media(max-width:800px){.gline{display:none}.gline-m{display:grid;gap:12px}.gline-m .s{display:grid;grid-template-columns:40px 1fr;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;align-items:start}.gline-m .s b{display:block;font-family:var(--display);font-size:15.5px}.gline-m .s p{margin:2px 0 0;font-size:14px;color:var(--muted)}.gline-m .s i{width:40px;height:40px;border-radius:10px;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:13px;font-style:normal}}
.sands{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.sand{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.sand .sw{height:150px;position:relative;overflow:hidden}
.sand .sw svg{width:100%;height:100%;display:block}
.sand .sw b{position:absolute;left:16px;bottom:12px;font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;background:rgba(255,255,255,.92);padding:5px 10px;border-radius:6px;color:var(--ink)}
.sand .t{padding:20px 22px 22px}
.sand h3{font-size:20px;margin-bottom:6px}
.sand p{margin:0;font-size:15px;color:var(--muted)}
.sand ul{margin:12px 0 0;padding-left:0;list-style:none;font-size:14.5px}
.sand li{padding:4px 0 4px 22px;position:relative}
.sand li::before{content:"";position:absolute;left:0;top:11px;width:10px;height:10px;border-radius:50%;background:var(--c,var(--turq))}
@media(max-width:860px){.sands{grid-template-columns:1fr}}
.machines{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:18px;margin-top:40px}
.mach{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--ink);min-height:260px;display:flex;align-items:flex-end}
.mach img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;mix-blend-mode:luminosity;transition:transform .8s ease,opacity .5s}
.mach:hover img{transform:scale(1.04);opacity:.7}
.mach::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,191,201,.35) 0,rgba(34,43,46,.15) 40%,rgba(34,43,46,.92) 100%)}
.mach .t{position:relative;padding:22px 22px 20px;color:#fff}
.mach .t b{display:block;font-family:var(--display);font-size:18px;margin-bottom:4px}
.mach .t p{margin:0;font-size:13.5px;color:rgba(255,255,255,.78)}
.mach .t .spec{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.mach .t .spec span{font-family:var(--display);font-size:11.5px;font-weight:600;letter-spacing:.06em;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);padding:4px 8px;border-radius:6px}
.mach.big{grid-row:span 2;min-height:400px}
@media(max-width:960px){.machines{grid-template-columns:1fr 1fr}.mach.big{grid-column:1/-1;grid-row:auto}}
@media(max-width:600px){.machines{grid-template-columns:1fr}}
.glas .foot{margin-top:22px;font-size:13.5px;color:var(--muted)}

/* ===================== financiers ===================== */
.fin{margin-top:40px;border:1px solid var(--line);border-radius:var(--r-lg);padding:34px 38px;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;background:linear-gradient(135deg,#fff 0,#fbf7ee 100%)}
.fin h3{font-size:22px;margin-bottom:8px}
.fin p{margin:0;color:var(--ink-2);font-size:15.5px;max-width:52ch}
.fin .logos{display:flex;gap:44px;align-items:flex-start}
.zl{display:flex;flex-direction:column;align-items:center;text-decoration:none}
.zl img{width:150px;height:auto}
.zl span{margin-top:6px;font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.34em;text-transform:uppercase;padding-left:.34em;background:linear-gradient(90deg,#8a5a24,#e9d48a 50%,#8a5a24);-webkit-background-clip:text;background-clip:text;color:transparent}
@media(max-width:860px){.fin{grid-template-columns:1fr;padding:26px 24px;gap:26px}.fin .logos{justify-content:center;gap:30px}.zl img{width:120px}}
footer .finrow{margin-top:36px;padding-top:26px;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-wrap:wrap;gap:18px 40px;align-items:center}
footer .finrow>b{font-family:var(--display);font-size:12.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6)}
footer .finrow .zl img{width:92px}
footer .finrow .zl span{font-size:10.5px;margin-top:4px}
footer .bottom{margin-top:26px}

/* team v2 */
.team{grid-template-columns:repeat(6,1fr)}
.member .ini{aspect-ratio:1/1;border-radius:var(--r-lg);display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:clamp(40px,5vw,64px);color:#fff;background:linear-gradient(140deg,var(--c),color-mix(in srgb,var(--c) 62%,#222B2E))}
@media(max-width:1100px){.team{grid-template-columns:repeat(4,1fr)}}
@media(max-width:760px){.team{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.team{grid-template-columns:1fr 1fr}}

/* taalkiezer */
.langs{display:flex;gap:2px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:3px;flex:none}
.langs a{font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.06em;text-decoration:none;color:var(--muted);padding:5px 9px;border-radius:999px;line-height:1}
.langs a:hover{color:var(--ink);background:var(--tint-2)}
.langs a.on{background:var(--ink);color:#fff}
@media(max-width:1200px){.langs{margin-left:auto}.burger{margin-left:6px}}
@media(max-width:420px){.hdr .logo img{height:32px}.langs a{padding:5px 7px}}

/* header met taalkiezer: compacter, en per taal op tijd naar het uitklapmenu */
.hdr .in{width:calc(100% - 40px);max-width:1560px}
.hdr nav a{padding:9px 8px}
.hdr>.in>.acts .login{font-size:0;gap:0;padding:9px 8px}
.hdr>.in>.acts .login svg{width:20px;height:20px}
@media(max-width:1430px){
  .hdr nav{display:none;position:absolute;left:0;right:0;top:74px;background:#fff;flex-direction:column;align-items:stretch;padding:12px 20px 20px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  .hdr nav.open{display:flex}
  .hdr nav a{padding:12px 10px;font-size:17px}
  .hdr .acts{display:none}
  .hdr nav .acts{display:flex;margin:12px 0 0;flex-direction:column;align-items:stretch}
  .burger{display:block}
  .hdr .login{display:none}
  .hdr nav .acts .login{display:inline-flex;justify-content:center}
}
@media(max-width:1560px){
  html[lang="pap"] .hdr nav{display:none;position:absolute;left:0;right:0;top:74px;background:#fff;flex-direction:column;align-items:stretch;padding:12px 20px 20px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  html[lang="pap"] .hdr nav.open{display:flex}
  html[lang="pap"] .hdr nav a{padding:12px 10px;font-size:17px}
  html[lang="pap"] .hdr .acts{display:none}
  html[lang="pap"] .hdr nav .acts{display:flex;margin:12px 0 0;flex-direction:column;align-items:stretch}
  html[lang="pap"] .burger{display:block}
  html[lang="pap"] .hdr .login{display:none}
  html[lang="pap"] .hdr nav .acts .login{display:inline-flex;justify-content:center}
}
@media(max-width:1560px){.langs{order:2;margin-left:auto}.burger{order:3;margin-left:4px}}
@media(min-width:1431px){html:not([lang="pap"]) .langs{order:0;margin-left:0}}
@media(max-width:520px){.hdr .in{gap:8px;width:calc(100% - 28px)}.hdr .logo img{height:28px}.langs{padding:2px}.langs a{padding:5px 6px;font-size:11px}}
html,body{overflow-x:clip}