/*
Theme Name: Bewaar m
Description: Nederlandstalige onepage voor de bonnenapp Bewaar ’m.
Version: 1.2.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: bewaar-m
*/
:root{--navy:#111a3e;--blue:#2643ad;--ice:#e1f1fa;--wine:#891735;--line:#dce5f2;--muted:#4e5d77}
*{box-sizing:border-box}html{scroll-padding-top:1rem}body{margin:0;background:white;color:var(--navy);font:16px/1.65 Inter,"Segoe UI",system-ui,sans-serif}a{color:var(--blue)}a:focus-visible,summary:focus-visible{outline:3px solid #5277e1;outline-offset:4px}.wrap{width:min(1120px,calc(100% - 40px));margin-inline:auto}.skip{position:absolute;left:-10000px}.skip:focus{left:12px;top:12px;z-index:3;background:#fff;padding:10px}.bar{border-bottom:1px solid var(--line)}.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;padding-block:12px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--navy);font-size:25px;font-weight:750;letter-spacing:-.04em}.brand img{width:47px;height:47px}.nav{display:flex;flex-wrap:wrap;gap:8px 22px}.nav a{color:var(--navy);text-decoration:none;font-weight:650}.nav a:hover{text-decoration:underline}.hero{color:white;background:radial-gradient(ellipse at 58% 15%,#413785,transparent 60%),radial-gradient(ellipse at 0% 125%,#641c37,transparent 45%),linear-gradient(110deg,#111a3e 18%,#202f78 88%,#244d99)}.hero-grid{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:clamp(24px,6vw,84px);padding-block:clamp(50px,8vw,100px)}h1,h2,h3,p{margin-top:0}h1,h2{letter-spacing:-.045em;line-height:1.09}h1{font-size:clamp(42px,6vw,72px);margin-bottom:18px}h2{font-size:clamp(29px,4vw,43px);margin-bottom:18px}h3{line-height:1.24;margin-bottom:8px}.hero p{color:#e4edff;font-size:1.16rem;max-width:38ch}.button{display:inline-block;background:var(--wine);color:white;text-decoration:none;font-weight:700;padding:11px 20px;border-radius:999px}.button:hover{background:#6e112a}.example{color:var(--navy);background:#f5f8ff;border:1px solid #a9bbe9;border-radius:18px;padding:24px;box-shadow:0 18px 50px #0b143c55}.example p{color:var(--muted);font-size:1rem}.example-card{background:white;border:1px solid var(--line);border-radius:10px;padding:14px;margin-top:10px}.example-card small{display:block;color:var(--muted)}.pill{display:inline-block;background:var(--ice);border-radius:6px;padding:3px 8px;margin-top:8px;color:#143774;font-size:.88rem}.band{padding-block:clamp(43px,7vw,76px)}.tint{background:#f2f6fc}.intro{max-width:67ch;color:var(--muted)}.steps{list-style:none;padding:0;margin:24px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:15px;counter-reset:step}.steps li{counter-increment:step;padding:22px;background:white;border:1px solid var(--line);border-radius:13px}.steps li::before{content:counter(step);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--blue);color:white;font-weight:700;margin-bottom:14px}.steps p{margin:0;color:var(--muted)}.split{display:grid;grid-template-columns:1fr 1fr;gap:24px}.split article{border:1px solid var(--line);border-radius:13px;padding:24px}.split p,details p{color:var(--muted);margin-bottom:0}.faq{max-width:800px}details{border-bottom:1px solid var(--line);padding:12px 0}summary{font-weight:700;cursor:pointer}details p{margin-top:8px}.cta{margin-top:28px}footer{border-top:1px solid var(--line);padding-block:20px;color:var(--muted)}@media(max-width:760px){.hero-grid,.steps,.split{grid-template-columns:1fr}.example{max-width:450px}.nav{font-size:.93rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

.steps .step{counter-increment:step;padding:22px;background:white;border:1px solid var(--line);border-radius:13px}
.steps .step::before{content:counter(step);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--blue);color:white;font-weight:700;margin-bottom:14px}
.split>.wp-block-group{border:1px solid var(--line);border-radius:13px;padding:24px}
.example-card h3{font-size:1rem}
.example .example-card p{margin-bottom:0}
.faq>.button{margin-top:28px}
.homepage-content>.wrap{margin-block:2rem}

.subscription-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;background:#f2f6fc;border:1px solid var(--line);border-radius:14px;padding:clamp(20px,4vw,38px)}
.subscription-card p:last-child{margin-bottom:0}
.subscription-price strong{font-size:2rem}
.account-link{margin-top:12px}
@media(max-width:650px){.subscription-card{grid-template-columns:1fr}}