:root{--bg:#071425;--panel:#102640;--text:#f3f8fc;--muted:#a9bfd3;--cyan:#24d6e8;--cyan2:#7df3ff;--green:#32d583;--orange:#fdb022;--red:#f97066;--line:rgba(255,255,255,.10);--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);background:radial-gradient(circle at 12% -10%,rgba(36,214,232,.16),transparent 31%),linear-gradient(180deg,var(--bg),#08182a 48%,#06111e);line-height:1.6}a{color:inherit;text-decoration:none}.container{width:min(var(--max),calc(100% - 40px));margin:auto}.nav-wrap{position:sticky;top:0;z-index:20;background:rgba(7,20,37,.84);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;font-weight:800}.brand img{width:42px;height:42px}.brand small{display:block;color:var(--muted);font-size:11px;letter-spacing:.08em}.nav-links{display:flex;gap:24px;color:#d7e5f1;font-size:14px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:12px 18px;font-weight:750;border:1px solid transparent}.primary{background:linear-gradient(135deg,var(--cyan),#1fb6ff);color:#04121e}.secondary{border-color:var(--line);background:rgba(255,255,255,.04)}.hero{padding:92px 0 76px}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:54px;align-items:center}.eyebrow{display:inline-flex;gap:8px;align-items:center;border:1px solid rgba(36,214,232,.25);background:rgba(36,214,232,.07);padding:8px 12px;border-radius:999px;color:var(--cyan2);font-size:13px;font-weight:700}.dot{width:8px;height:8px;background:var(--green);border-radius:50%}h1{font-size:clamp(44px,6vw,76px);line-height:1.03;letter-spacing:-.055em;margin:20px 0}.grad{background:linear-gradient(90deg,#fff,var(--cyan2));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p,.muted{color:var(--muted)}.hero p{font-size:19px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}.dashboard,.card,.feature,.price-card,.trust-card,.faq details,.return-card{border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:20px}.dashboard{padding:20px;box-shadow:0 22px 65px rgba(0,0,0,.30)}.dash-top{display:flex;justify-content:space-between;align-items:center}.status{font-size:12px;color:#b8f7d6;background:rgba(50,213,131,.10);padding:7px 10px;border-radius:999px}.score{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.card{padding:18px}.card strong{display:block;font-size:30px}.risk{display:flex;gap:12px;align-items:center;padding:12px}.risk i{width:10px;height:10px;border-radius:50%}.high i{background:var(--red)}.medium i{background:var(--orange)}.safe i{background:var(--green)}.risk span{margin-left:auto;color:var(--muted);font-size:12px}section{padding:74px 0}.kicker{color:var(--cyan2);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:12px}h2{font-size:clamp(32px,4.4vw,52px);line-height:1.08;letter-spacing:-.04em;margin:10px 0 14px}.section-head{max-width:760px;margin-bottom:34px}.section-head p{color:var(--muted);font-size:18px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature,.trust-card{padding:24px}.feature h3,.trust-card h3{margin:0 0 8px}.feature p,.trust-card p{color:var(--muted);margin:0}.icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(36,214,232,.10);color:var(--cyan2);font-weight:900;margin-bottom:18px}.band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.025)}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.step{padding:20px;border:1px solid var(--line);border-radius:18px}.step b{color:var(--cyan2);font-size:13px}.step p{color:var(--muted);font-size:14px}.pricing{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.price-card{padding:24px;display:flex;flex-direction:column}.price-card.popular{border-color:rgba(36,214,232,.5)}.price{font-size:38px;font-weight:900}.price small{font-size:13px;color:var(--muted)}.price-card ul{padding-left:20px;color:#d6e6f2}.price-card .btn{margin-top:auto}.trust-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.faq{display:grid;gap:12px}.faq details{padding:18px 20px}.faq summary{cursor:pointer;font-weight:750}.faq p{color:var(--muted)}.cta{padding:42px;border:1px solid rgba(36,214,232,.25);border-radius:28px;background:linear-gradient(135deg,#102843,#0b2037);display:flex;justify-content:space-between;gap:24px;align-items:center}footer{padding:36px 0;border-top:1px solid var(--line);color:var(--muted);font-size:14px}.footer-grid{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.footer-links{display:flex;gap:18px}.legal{padding:70px 0}.legal .wrap{max-width:860px}.legal h1{font-size:48px}.legal h2{font-size:26px;margin-top:34px}.legal p{color:#c3d4e2}.note{border:1px solid rgba(253,176,34,.25);background:rgba(253,176,34,.07);padding:14px 16px;border-radius:14px;color:#f5d892}.return-card{max-width:720px;margin:90px auto;padding:44px;text-align:center}
@media(max-width:980px){.hero-grid,.trust-grid{grid-template-columns:1fr}.feature-grid,.pricing,.steps{grid-template-columns:1fr 1fr}.nav-links{display:none}}@media(max-width:640px){.container{width:calc(100% - 24px)}.feature-grid,.pricing,.steps{grid-template-columns:1fr}.cta{flex-direction:column;align-items:flex-start}}
/* v1.1 — productuitleg en echte app-screenshots */
.product-intro{padding-top:30px}.product-lead{display:grid;grid-template-columns:.9fr 1.1fr;gap:54px;align-items:center}.phone-stage{display:flex;justify-content:center;position:relative}.phone-stage:before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;background:rgba(36,214,232,.12);filter:blur(35px);top:16%;left:50%;transform:translateX(-50%)}.phone-shot{position:relative;width:min(320px,80vw);border-radius:28px;border:1px solid rgba(125,243,255,.25);box-shadow:0 28px 70px rgba(0,0,0,.42);display:block}.product-copy h3{font-size:30px;margin:0 0 12px;letter-spacing:-.025em}.product-copy p{color:var(--muted);font-size:17px}.product-points{display:grid;gap:12px;margin-top:24px}.product-point{display:flex;gap:13px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:14px}.product-point b{display:block;margin-bottom:2px}.product-point span{color:var(--muted);font-size:14px}.check{width:26px;height:26px;flex:0 0 26px;border-radius:8px;display:grid;place-items:center;background:rgba(50,213,131,.12);color:var(--green);font-weight:900}.showcase{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:52px}.showcase-card{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:24px;padding:26px;display:grid;grid-template-columns:1fr 190px;gap:24px;align-items:center;overflow:hidden}.showcase-card h3{font-size:24px;margin:0 0 8px}.showcase-card p{color:var(--muted);margin:0}.showcase-card img{width:100%;max-height:370px;object-fit:cover;object-position:top;border-radius:18px;border:1px solid var(--line);box-shadow:0 18px 45px rgba(0,0,0,.3)}.screens-section{padding-top:36px}.screen-strip{display:flex;gap:18px;overflow-x:auto;padding:8px 2px 22px;scroll-snap-type:x mandatory;scrollbar-color:rgba(125,243,255,.35) transparent}.screen-item{flex:0 0 230px;scroll-snap-align:start}.screen-item img{width:100%;border-radius:20px;border:1px solid var(--line);display:block;box-shadow:0 16px 40px rgba(0,0,0,.28)}.screen-item p{margin:10px 4px 0;color:var(--muted);font-size:13px}.mini-label{color:var(--cyan2);font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}.nav-links a[href="/#app"]{color:var(--cyan2)}
@media(max-width:980px){.product-lead{grid-template-columns:1fr}.showcase{grid-template-columns:1fr}.phone-stage{order:2}.product-copy{order:1}}
@media(max-width:640px){.showcase-card{grid-template-columns:1fr}.showcase-card img{max-height:none;width:min(250px,100%);margin:auto}.screen-item{flex-basis:205px}.product-copy h3{font-size:26px}}

/* v1.2 — gebruikershandleiding per abonnement */
.active-nav,.nav-links a[href="/handleiding.html"]{color:var(--cyan2)}.plan-guide-link{display:block;margin-top:12px;color:var(--cyan2);font-size:13px;font-weight:750;text-align:center}.guide-hero{padding:82px 0 62px}.guide-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}.guide-hero p{font-size:18px;color:var(--muted)}.guide-preview{display:grid;grid-template-columns:180px 1fr;gap:22px;align-items:center;padding:22px;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:24px}.guide-preview img{width:100%;border-radius:20px;border:1px solid var(--line);box-shadow:0 18px 45px rgba(0,0,0,.28)}.guide-preview b{display:block;font-size:20px;margin-bottom:8px}.guide-preview span{color:var(--muted)}.guide-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.guide-step{padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}.guide-step>span{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(36,214,232,.11);color:var(--cyan2);font-weight:900}.guide-step h3{margin:14px 0 6px;font-size:18px}.guide-step p{margin:0;color:var(--muted);font-size:14px}.guide-plan-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.guide-plan-nav a{padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.03);transition:.2s transform,.2s border-color}.guide-plan-nav a:hover{transform:translateY(-2px);border-color:rgba(36,214,232,.4)}.guide-plan-nav a.popular{border-color:rgba(36,214,232,.52)}.guide-plan-nav b,.guide-plan-nav span{display:block}.guide-plan-nav b{font-size:20px}.guide-plan-nav span{color:var(--muted);font-size:13px;margin-top:3px}.guide-plan-section{scroll-margin-top:84px}.guide-plan-head{display:flex;justify-content:space-between;gap:32px;align-items:flex-start;margin-bottom:30px}.guide-plan-head>div:first-child{max-width:760px}.guide-plan-head h2{font-size:clamp(30px,4vw,46px)}.guide-plan-head p{color:var(--muted);font-size:17px}.plan-badge{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid rgba(36,214,232,.25);background:rgba(36,214,232,.07);color:var(--cyan2);font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase}.plan-badge.featured{background:rgba(36,214,232,.14);border-color:rgba(36,214,232,.5)}.plan-price{font-size:38px;font-weight:900;white-space:nowrap}.plan-price small{display:block;color:var(--muted);font-size:12px;text-align:right;font-weight:600}.guide-two{display:grid;grid-template-columns:1.15fr .85fr;gap:38px;align-items:center}.guide-two.reverse{grid-template-columns:.85fr 1.15fr}.guide-two.compact{margin-top:34px;padding-top:30px;border-top:1px solid var(--line)}.manual-list{padding-left:22px}.manual-list li{margin:0 0 14px;color:#d6e6f2}.manual-list li::marker{color:var(--cyan2);font-weight:900}.manual-list b{color:var(--text)}.guide-shot{padding:18px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.025);text-align:center}.guide-shot img{display:block;max-height:540px;max-width:100%;width:auto;margin:0 auto;border-radius:20px;border:1px solid var(--line);box-shadow:0 18px 45px rgba(0,0,0,.28)}.guide-shot p{color:var(--muted);font-size:13px;margin:12px 0 0}.tip-box{display:flex;gap:14px;align-items:flex-start;margin-top:28px;padding:16px 18px;border:1px solid rgba(50,213,131,.22);background:rgba(50,213,131,.06);border-radius:16px}.tip-box b{white-space:nowrap;color:#b8f7d6}.tip-box span{color:var(--muted)}.question-chips{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.question-chips span{padding:9px 12px;border-radius:999px;background:rgba(36,214,232,.07);border:1px solid rgba(36,214,232,.20);color:#dffcff;font-size:13px}.screen-help-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.screen-help-grid>div{padding:18px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.025)}.screen-help-grid img{width:100%;height:310px;object-fit:cover;object-position:top;border-radius:16px;border:1px solid var(--line)}.screen-help-grid h3{margin:14px 0 4px}.screen-help-grid p{margin:0;color:var(--muted);font-size:14px}
@media(max-width:980px){.guide-hero-grid,.guide-two,.guide-two.reverse{grid-template-columns:1fr}.guide-preview{grid-template-columns:150px 1fr}.guide-steps{grid-template-columns:1fr 1fr}.guide-plan-nav,.screen-help-grid{grid-template-columns:1fr 1fr}.guide-plan-head{flex-direction:column}.plan-price small{text-align:left}}@media(max-width:640px){.guide-preview{grid-template-columns:1fr}.guide-preview img{width:min(220px,100%);margin:auto}.guide-steps,.guide-plan-nav,.screen-help-grid{grid-template-columns:1fr}.tip-box{display:block}.tip-box b{display:block;margin-bottom:4px}.guide-shot img{max-height:none}.guide-hero{padding-top:58px}}

/* v1.3 — secure subscription cancellation administration */
.admin-cancel-wrap{min-height:calc(100vh - 190px);padding:72px 0;display:grid;place-items:center}.admin-cancel-card{width:min(760px,100%);border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:24px;padding:38px;box-shadow:0 24px 70px rgba(0,0,0,.30)}.admin-cancel-card h1{font-size:clamp(34px,5vw,52px);margin:12px 0 10px;letter-spacing:-.04em}.admin-cancel-icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:rgba(36,214,232,.12);color:var(--cyan2);font-weight:900;margin-bottom:18px}.admin-cancel-state{margin-top:28px;padding:18px;border:1px solid var(--line);border-radius:14px;color:var(--muted);background:rgba(255,255,255,.025)}.admin-cancel-summary{display:grid;gap:12px;margin:28px 0}.admin-cancel-summary>div{display:grid;grid-template-columns:180px 1fr;gap:18px;padding:14px 0;border-bottom:1px solid var(--line)}.admin-cancel-summary span{color:var(--muted)}.admin-cancel-summary code{overflow-wrap:anywhere;color:#dffcff}.admin-cancel-note{margin-top:24px}.admin-cancel-actions{margin-top:26px}.admin-cancel-result{margin-top:28px;padding:18px;border-radius:14px}.admin-cancel-result strong{display:block;font-size:20px;margin-bottom:6px}.admin-cancel-result p{margin:0}.admin-cancel-result.success{border:1px solid rgba(50,213,131,.28);background:rgba(50,213,131,.08);color:#c9f8df}.admin-cancel-result.error{border:1px solid rgba(249,112,102,.28);background:rgba(249,112,102,.08);color:#ffd5d1}.admin-cancel-card button:disabled{opacity:.65;cursor:wait}@media(max-width:640px){.admin-cancel-wrap{padding:42px 0}.admin-cancel-card{padding:24px}.admin-cancel-summary>div{grid-template-columns:1fr;gap:4px}.admin-cancel-actions{display:grid}.admin-cancel-actions .btn{width:100%}}

/* v1.4 language selector */
.lang-switch{display:flex;align-items:center;gap:6px;margin-left:auto;margin-right:10px;white-space:nowrap}
.lang-switch a{display:inline-flex;align-items:center;padding:7px 9px;border:1px solid rgba(255,255,255,.14);border-radius:10px;text-decoration:none;font-size:12px;font-weight:700;color:inherit;opacity:.72}
.lang-switch a:hover,.lang-switch a.active{opacity:1;border-color:rgba(57,210,255,.55);background:rgba(57,210,255,.08)}
@media(max-width:900px){.lang-switch{margin-left:0;margin-right:0}.nav{gap:10px;flex-wrap:wrap}.lang-switch a{padding:6px 8px}}

/* v1.5 subscription detail panels */
.plan-details{margin-top:10px}
.plan-details summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border:1px solid rgba(57,210,255,.38);border-radius:12px;font-weight:700;user-select:none}
.plan-details summary::-webkit-details-marker{display:none}
.plan-details summary::after{content:" +";margin-left:6px;font-weight:800}
.plan-details[open] summary::after{content:" −"}
.plan-details-content{margin-top:12px;padding:14px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.035);text-align:left}
.plan-details-content ul{margin:9px 0 0;padding-left:19px}
.plan-details-content li{margin:6px 0;line-height:1.45}

/* v1.6 app-aligned subscription cards */
.app-plan-specs{display:flex;flex-direction:column;gap:8px;text-align:left;margin-bottom:14px}
.app-plan-title{font-size:20px;font-weight:800;letter-spacing:-.01em;color:#f6f8ff}
.app-plan-price{font-size:19px;font-weight:800;color:#42ddff}
.app-plan-vat{font-size:13px;color:rgba(218,228,247,.72);margin-top:-5px}
.app-plan-metrics{display:flex;flex-direction:column;gap:10px;margin:9px 0 4px}
.app-plan-metric{display:grid;grid-template-columns:20px 1fr;gap:8px;align-items:start;font-size:14px;line-height:1.45;color:rgba(218,228,247,.78)}
.app-plan-icon{color:#21ddff;font-weight:900;font-size:17px;line-height:1.2}
.app-plan-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:5px}
.app-plan-tags span{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;background:rgba(0,145,112,.18);color:#35e59b;font-size:12px;font-weight:650;line-height:1.15}
@media(max-width:700px){.app-plan-title{font-size:19px}.app-plan-price{font-size:18px}.app-plan-metric{font-size:13px}}

/* v1.7 real language flag icons */
.lang-switch a{gap:6px}
.lang-switch .lang-flag{width:20px;height:14px;display:block;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.20)}

/* v1.9 subscription guide buttons */
.plan-guide-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  box-sizing:border-box !important;
  margin-top:10px !important;
  padding:10px 14px !important;
  border:1px solid rgba(57,210,255,.38) !important;
  border-radius:12px !important;
  background:transparent !important;
  color:inherit !important;
  text-decoration:none !important;
  font-weight:700 !important;
  text-align:center !important;
  transition:background .15s ease,border-color .15s ease;
}
.plan-guide-btn:hover{
  border-color:rgba(57,210,255,.70) !important;
  background:rgba(57,210,255,.08) !important;
}

/* v1.10 equal-width subscription buttons
   Keep v1.9 design; only make 'Meer informatie' and guide button equal width. */
.plan-details{
  width:100% !important;
  box-sizing:border-box !important;
}
.plan-details summary{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.plan-guide-btn{
  width:100% !important;
  box-sizing:border-box !important;
}

/* v1.11 keep the English About Regentum IT CTA on one line */
.en-about-regentum-nowrap{
  white-space:nowrap !important;
  width:auto !important;
  min-width:max-content !important;
}

/* v1.14 Android download page */
.download-page{padding:90px 0 110px}
.download-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:42px;align-items:center;padding:42px;border:1px solid rgba(57,210,255,.24);border-radius:24px;background:rgba(18,45,72,.62)}
.download-copy h1{margin:10px 0 14px;font-size:clamp(38px,5vw,62px);line-height:1.02}
.download-copy h2{margin:24px 0 8px;font-size:24px}
.download-lead{font-size:18px;max-width:720px}
.download-status{display:inline-flex;align-items:center;gap:8px;margin-top:12px;padding:8px 12px;border-radius:999px;background:rgba(57,210,255,.10);color:#38dcf6;font-size:13px;font-weight:800}
.download-status span{width:8px;height:8px;border-radius:50%;background:#38dcf6}
.download-disabled{margin-top:18px;opacity:.72;cursor:not-allowed}
.download-available{margin-top:18px}
.download-status-live{background:rgba(50,213,131,.10);color:#b8f7d6}
.download-status-live span{background:var(--green)}
.download-qr-card{text-align:center;padding:26px;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(4,22,42,.72)}
.download-qr-card img{display:block;width:min(240px,80%);height:auto;margin:0 auto 18px;border-radius:14px}
.download-qr-card .download-store-logo{max-width:190px;padding:28px 18px;background:#fff;object-fit:contain}
.download-qr-card strong{display:block;font-size:18px;margin-bottom:7px}
.download-qr-card p{font-size:13px;opacity:.72;margin:0 auto;max-width:280px}
@media(max-width:850px){.download-page{padding:50px 0 70px}.download-hero{grid-template-columns:1fr;padding:26px}.download-qr-card{max-width:420px}}

/* v1.16: move app download CTA out of navigation and into homepage hero */
.hero-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.hero-actions .btn{
  margin:0 !important;
}
.app-download-cta{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
}
@media(max-width:640px){
  .hero-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .hero-actions .btn{
    width:100% !important;
    box-sizing:border-box;
    text-align:center;
  }
}

/* v1.18: De app belongs in homepage CTA area, not in header navigation */
.home-cta-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
}
.home-cta-row .btn{
  margin:0 !important;
}
.home-app-cta{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
}
@media(max-width:640px){
  .home-cta-row{
    flex-direction:column;
    align-items:stretch;
  }
  .home-cta-row .btn{
    width:100% !important;
    box-sizing:border-box;
    text-align:center;
  }
}

/* v1.20 iOS App Store preparation block */
.ios-download-block{margin-top:28px}
.platform-label{display:inline-flex;align-items:center;padding:7px 11px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.08em;color:#eef5ff;background:rgba(255,255,255,.05)}
.ios-title{font-size:clamp(30px,4vw,46px) !important;line-height:1.08;margin:14px 0 12px !important}

/* v1.21 stronger homepage sales introduction */
.hero-sales-copy{max-width:820px;margin-top:18px}
.hero-sales-headline{font-size:clamp(21px,2.3vw,30px);line-height:1.18;margin:0 0 14px;color:#f5f8ff}
.hero-sales-copy p{max-width:800px;line-height:1.65;margin:0 0 12px}


/* v1.23 homepage vertical spacing correction */
.hero + section,
.hero + .section {
  margin-top: 0 !important;
  padding-top: 32px !important;
}
@media (max-width: 768px) {
  .hero + section,
  .hero + .section {
    padding-top: 24px !important;
  }
}

/* v1.24 move platform tagline to homepage footer */
.footer-platform-tagline{
  width:100%;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.08);
  color:var(--muted,#aebed0);
  font-size:13px;
  line-height:1.5;
}

/* v1.26 mobile homepage CTA alignment
   Align the three homepage CTA buttons to the same left/right boundaries
   as the app preview card ('Vandaag') below. */
@media (max-width: 768px) {
  .hero .hero-actions,
  .hero .cta-row,
  .hero .actions {
    width: 100%;
    max-width: none;
    align-items: stretch;
  }

  .hero .hero-actions .btn,
  .hero .cta-row .btn,
  .hero .actions .btn {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    justify-content: center;
    text-align: center;
  }
}

/* v1.27 mobile top CTA alignment
   Make 'De app / The app' and 'Bekijk abonnementen / View plans'
   use the same full-width mobile alignment as the other homepage CTA buttons. */
@media (max-width: 768px) {
  .hero .hero-sales-copy + .hero-actions,
  .hero .hero-sales-copy + .cta-row,
  .hero .hero-sales-copy + .actions {
    width:100%;
    max-width:none;
    align-items:stretch;
  }

  .hero .hero-sales-copy + .hero-actions .btn,
  .hero .hero-sales-copy + .cta-row .btn,
  .hero .hero-sales-copy + .actions .btn {
    width:100%;
    max-width:none;
    box-sizing:border-box;
    justify-content:center;
    text-align:center;
  }
}

/* v1.29 mobile CTA layout correction
   All four homepage CTA buttons are stacked vertically, in one column,
   using the same content width. No horizontal overflow. */
@media (max-width: 768px) {
  .hero .hero-actions,
  .hero .cta-row,
  .hero .actions {
    display:flex !important;
    flex-direction:column !important;
    flex-wrap:nowrap !important;
    align-items:stretch !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    gap:12px !important;
  }

  .hero .hero-actions .btn,
  .hero .cta-row .btn,
  .hero .actions .btn {
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    flex:0 0 auto !important;
    box-sizing:border-box !important;
    justify-content:center !important;
    text-align:center !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  html, body {
    max-width:100%;
    overflow-x:hidden;
  }
}

/* v1.31 true fixed mobile navigation */
@media (max-width: 768px) {
  .nav-wrap {
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:99999 !important;
    box-sizing:border-box !important;
    background:#071827 !important;
  }

  body {
    padding-top:76px !important;
  }
}

/* v1.32 responsive mobile language selector
   Keep NL/EN flags on the same top row on narrow phones. */
@media (max-width: 768px) {
  .nav-inner {
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .brand {
    flex:1 1 auto !important;
    min-width:0 !important;
  }

  .lang-switch,
  .language-switch,
  .languages {
    flex:0 0 auto !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:4px !important;
    margin-left:auto !important;
    white-space:nowrap !important;
  }

  .lang-switch a,
  .language-switch a,
  .languages a {
    flex:0 0 auto !important;
    padding:6px 7px !important;
  }

  .lang-switch img,
  .language-switch img,
  .languages img {
    width:20px !important;
    height:auto !important;
  }
}

/* Extra-small phones: compact the brand and language controls further. */
@media (max-width: 390px) {
  .nav-inner {
    gap:6px !important;
  }

  .brand {
    font-size:13px !important;
  }

  .brand img {
    max-width:30px !important;
    height:auto !important;
  }

  .lang-switch,
  .language-switch,
  .languages {
    gap:2px !important;
  }

  .lang-switch a,
  .language-switch a,
  .languages a {
    padding:5px !important;
    font-size:12px !important;
  }

  .lang-switch img,
  .language-switch img,
  .languages img {
    width:18px !important;
  }
}

/* v1.33 planned English app release tile */
.language-release-section{
  padding:24px 0 10px;
}
.language-release-card{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:20px;
  align-items:center;
  padding:24px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  background:rgba(255,255,255,.045);
}
.language-release-card h3{
  margin:5px 0 8px;
}
.language-release-card p{
  margin:0 0 12px;
  max-width:850px;
}
.language-release-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  border-radius:16px;
  font-weight:900;
  letter-spacing:.06em;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
}
.release-status{
  display:inline-flex;
  align-items:center;
  padding:7px 11px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
}
@media(max-width:640px){
  .language-release-card{
    grid-template-columns:1fr;
    gap:14px;
    padding:20px;
  }
  .language-release-icon{
    width:50px;
    height:50px;
  }
}


/* v1.35 Business Guardian Support Chat */
.bg-support-chat{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:100000;
  font-family:inherit;
}
.bg-chat-launcher{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:108px;
  min-height:48px;
  padding:11px 18px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:#08aeca;
  color:#fff;
  font:inherit;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,0,0,.28);
}
.bg-chat-launcher-icon{font-size:18px}
.bg-chat-panel{
  display:none;
  position:absolute;
  right:0;
  bottom:62px;
  width:min(390px, calc(100vw - 28px));
  height:min(590px, calc(100vh - 120px));
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  background:#f7f9fb;
  color:#12283b;
  box-shadow:0 18px 50px rgba(0,0,0,.36);
}
.bg-support-chat.is-open .bg-chat-panel{
  display:flex;
  flex-direction:column;
}
.bg-chat-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 18px;
  background:#08aeca;
  color:#fff;
}
.bg-chat-header div{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.bg-chat-header strong{font-size:16px}
.bg-chat-header span{font-size:12px;opacity:.9}
.bg-chat-close{
  width:36px;
  height:36px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:30px;
  line-height:1;
  cursor:pointer;
}
.bg-chat-body{
  flex:1;
  overflow:auto;
  padding:18px;
  background:#fff;
}
.bg-chat-message{
  width:88%;
  margin:0 0 12px;
  padding:13px 14px;
  border-radius:4px 16px 16px 16px;
  background:#edf3f6;
  color:#18354a;
}
.bg-chat-message strong{font-size:13px}
.bg-chat-message p{
  margin:5px 0 0;
  color:#31495a;
  font-size:14px;
  line-height:1.5;
}
.bg-chat-info{
  background:#e8f8fb;
  border:1px solid rgba(8,174,202,.18);
}
.bg-chat-footer{
  display:grid;
  grid-template-columns:1fr 46px;
  gap:8px;
  padding:12px;
  border-top:1px solid #dce5ea;
  background:#f7f9fb;
}
.bg-chat-footer input{
  width:100%;
  min-width:0;
  padding:12px 13px;
  border:1px solid #d5dee4;
  border-radius:12px;
  background:#eef2f4;
  color:#6b7c88;
  box-sizing:border-box;
}
.bg-chat-footer button{
  border:0;
  border-radius:12px;
  background:#d7e1e6;
  color:#78909c;
}
@media(max-width:640px){
  .bg-support-chat{
    right:12px;
    bottom:12px;
  }
  .bg-chat-launcher{
    min-width:94px;
    min-height:46px;
    padding:10px 15px;
  }
  .bg-chat-panel{
    position:fixed;
    left:10px;
    right:10px;
    bottom:68px;
    width:auto;
    height:min(560px, calc(100dvh - 90px));
    border-radius:16px;
  }
}






/* ===== v1.38 standalone app launch tile =====
   Separate sibling card above the existing dashboard; uses the real /assets/logo.svg.
*/
.app-coming-card{
  position:relative;
  display:grid;
  grid-template-columns:150px minmax(0,1fr) auto;
  gap:20px;
  align-items:center;
  margin:0;
  padding:20px 22px;
  border:1px solid rgba(36,214,232,.62);
  border-radius:20px;
  background:
    radial-gradient(circle at 88% 18%,rgba(36,214,232,.11),transparent 35%),
    rgba(255,255,255,.035);
  box-shadow:0 18px 55px rgba(0,0,0,.20);
}
.app-coming-brand{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
  border-right:1px solid rgba(154,188,209,.15);
}
.app-coming-brand img{
  display:block;
  width:100%;
  max-width:135px;
  height:auto;
}
.app-coming-kicker{color:var(--cyan2);font-size:12px;font-weight:850;margin-bottom:5px}
.app-coming-copy h3{margin:0 0 5px;color:#fff;font-size:clamp(22px,2.2vw,30px);line-height:1.05}
.app-coming-copy p{margin:0;color:var(--muted);font-size:14px;line-height:1.45}
.app-coming-status{
  align-self:start;
  padding:8px 11px;
  border:1px solid rgba(36,214,232,.42);
  border-radius:999px;
  color:#a8f7ff;
  background:rgba(36,214,232,.07);
  font-size:10px;
  font-weight:850;
  white-space:nowrap;
}
.app-live-status{
  border-color:rgba(50,213,131,.55);
  color:#b8f7d6;
  background:rgba(50,213,131,.10);
  transition:transform .16s ease,background .16s ease;
}
.app-live-status:hover{transform:translateY(-1px);background:rgba(50,213,131,.18)}
/* Right hero column: standalone app tile + standalone existing dashboard */
.hero-grid > .app-coming-card{
  grid-column:2;
  grid-row:1;
  align-self:start;
}
.hero-grid > .dashboard{
  grid-column:2;
  grid-row:1;
  margin-top:205px;
  align-self:start;
}
@media(max-width:1180px) and (min-width:981px){
  .app-coming-card{grid-template-columns:120px minmax(0,1fr);padding:17px 18px}
  .app-coming-status{grid-column:2;justify-self:start;margin-top:-7px}
  .hero-grid > .dashboard{margin-top:220px}
}
@media(max-width:980px){
  .hero-grid > .app-coming-card,
  .hero-grid > .dashboard{
    grid-column:1;
    grid-row:auto;
    margin-top:0;
  }
  .app-coming-card{margin-top:24px}
}
@media(max-width:640px){
  .app-coming-card{grid-template-columns:100px minmax(0,1fr);gap:14px;padding:16px}
  .app-coming-status{grid-column:1 / -1;justify-self:start}
  .app-coming-brand{padding:5px 8px}
  .app-coming-copy h3{font-size:22px}
}
@media(max-width:430px){
  .app-coming-card{grid-template-columns:82px minmax(0,1fr);padding:14px 12px}
}


/* ===== v1.39 separation fix =====
   Extra visual gap between the standalone App card and Today dashboard.
*/
@media(min-width:981px){
  .hero-grid > .app-coming-card{z-index:2}
  .hero-grid > .dashboard{z-index:1}
}