:root{
  --f-blue:#004289;--f-red:#DB2F1C;--f-navy:#002A5A;--f-gray:#A4A3A3;--f-foot:#25356E;--f-nav:#134485;--f-link:#0863AC;--f-green:#47B335;
  --f-ink:#1D2B3A;--f-soft:#5B6B7D;--f-line:#D7DEE8;--f-bg:#F4F6F9;--f-panel:#FFFFFF;
  --f-radius:12px;--f-shadow:0 1px 2px rgba(0,42,90,.06),0 10px 28px -16px rgba(0,42,90,.28);
  --f-font:"Futura PT","Avenir Next",Montserrat,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body.ftp-body{margin:0;padding:0}
body.ftp-body{background:var(--f-bg);color:var(--f-ink);font-family:var(--f-font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
.ftp-body a{color:var(--f-link)}
.ftp-body h1,.ftp-body h2,.ftp-body h3{color:var(--f-navy);font-family:var(--f-font);line-height:1.2}

/* Kop */
.ftp-top{background:#fff;border-bottom:3px solid var(--f-red);position:sticky;top:0;z-index:1000;box-shadow:0 2px 10px -6px rgba(0,42,90,.3)}
.ftp-top-in{max-width:1320px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:20px}
.ftp-brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.ftp-brand img{height:38px;width:auto;display:block}
.ftp-brand-sub{font-weight:700;color:var(--f-red);font-size:15px;letter-spacing:.06em;text-transform:uppercase;border-left:2px solid var(--f-line);padding-left:10px}
.ftp-nav{display:flex;align-items:center;gap:4px;margin-left:auto;flex-wrap:wrap}
.ftp-nav a{color:var(--f-nav);text-decoration:none;font-weight:600;font-size:14px;padding:8px 10px;border-radius:8px}
.ftp-nav a:hover{background:#EEF3FA}
.ftp-nav a.is-active{background:var(--f-blue);color:#fff}
.ftp-user{margin-left:10px;padding-left:12px;border-left:1px solid var(--f-line);font-size:14px;color:var(--f-soft);white-space:nowrap}
.ftp-user a{font-weight:500;padding:6px 8px;color:var(--f-link)}
.ftp-menu-btn{display:none;margin-left:auto;background:none;border:0;padding:8px;cursor:pointer}
.ftp-menu-btn span{display:block;width:22px;height:2px;background:var(--f-navy);margin:4px 0}
@media (max-width:980px){
  .ftp-menu-btn{display:block}
  .ftp-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;align-items:stretch;padding:8px 16px 14px;border-bottom:3px solid var(--f-red)}
  .ftp-nav-open .ftp-nav{display:flex}
  .ftp-user{margin:8px 0 0;padding:8px 0 0;border-left:0;border-top:1px solid var(--f-line)}
}

/* Hoofdinhoud */
.ftp-main{max-width:1320px;margin:0 auto;padding:24px 16px 48px;min-height:70vh}
.ftp-hero{background:linear-gradient(120deg,var(--f-navy),var(--f-blue));color:#fff;border-radius:16px;padding:32px 30px;margin-bottom:24px;position:relative;overflow:hidden}
.ftp-hero:after{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;border-radius:50%;border:28px solid rgba(255,255,255,.07)}
.ftp-hero h1{color:#fff;margin:0 0 6px;font-size:30px}
.ftp-eyebrow{margin:0 0 6px;text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:700;color:#BFD3EA}
.ftp-lead{font-size:17px;color:var(--f-soft);margin:0 0 18px}
.ftp-hero .ftp-lead{color:#DCE7F5;margin:0}
.ftp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.ftp-tile{position:relative;display:flex;flex-direction:column;background:var(--f-panel);border:1px solid var(--f-line);border-radius:var(--f-radius);padding:22px 20px 18px;text-decoration:none;color:var(--f-ink);box-shadow:var(--f-shadow);transition:transform .15s,border-color .15s}
.ftp-tile:hover{transform:translateY(-2px);border-color:var(--f-blue)}
.ftp-tile h2{font-size:19px;margin:12px 0 6px}
.ftp-tile p{margin:0 0 14px;color:var(--f-soft);font-size:14.5px;flex:1}
.ftp-tile-icon{width:46px;height:46px;border-radius:12px;background:#EAF1FA;color:var(--f-blue);display:flex;align-items:center;justify-content:center}
.ftp-tile-go{font-weight:700;color:var(--f-blue);font-size:14px}
.ftp-tile-go:after{content:" \2192"}
.ftp-tag{position:absolute;top:18px;right:18px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:3px 8px;border-radius:20px}
.ftp-tag-live{background:#E6F4E3;color:#2D7A22}
.ftp-tag-nieuw{background:#FCE9E6;color:var(--f-red)}
.ftp-soon{margin-top:28px;background:#fff;border:1px dashed var(--f-line);border-radius:var(--f-radius);padding:18px 22px}
.ftp-soon h2{font-size:17px;margin:0 0 8px}
.ftp-soon ul{margin:0 0 8px;padding-left:18px;color:var(--f-soft)}
.ftp-soon li{margin:4px 0}
.ftp-soon strong{color:var(--f-navy)}
.ftp-muted{color:var(--f-soft);font-size:14px}
.ftp-crumbs{font-size:14px;color:var(--f-soft);margin:0 0 14px}
.ftp-crumbs a{text-decoration:none;font-weight:600}
.ftp-crumbs span{margin:0 6px;color:var(--f-gray)}

/* Formulieren */
.ftp-narrow{max-width:640px;margin:10px auto;background:#fff;border:1px solid var(--f-line);border-radius:var(--f-radius);padding:28px 28px;box-shadow:var(--f-shadow)}
.ftp-narrow h1{margin-top:0}
.ftp-form label{display:block;font-weight:600;color:var(--f-navy);margin:0 0 14px;font-size:15px}
.ftp-form input[type=text],.ftp-form input[type=email],.ftp-form input[type=tel],.ftp-form textarea{display:block;width:100%;margin-top:6px;padding:10px 12px;border:1px solid #C9D3E0;border-radius:8px;font:inherit;font-weight:400;font-size:16px}
.ftp-form input:focus,.ftp-form textarea:focus{outline:2px solid rgba(0,66,137,.25);border-color:var(--f-blue)}
.ftp-form fieldset{border:1px solid var(--f-line);border-radius:8px;margin:0 0 14px;padding:10px 14px}
.ftp-form legend{font-weight:600;color:var(--f-navy);padding:0 6px}
.ftp-form .ftp-check{display:inline-flex;align-items:center;gap:6px;font-weight:400;margin:4px 14px 4px 0;color:var(--f-ink)}
.ftp-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ftp-btn{background:var(--f-blue);color:#fff;border:0;border-radius:8px;padding:11px 20px;font:inherit;font-weight:700;cursor:pointer}
.ftp-btn:hover{background:var(--f-navy)}
.ftp-btn.ftp-btn-red{background:var(--f-red)}
.ftp-btn.ftp-btn-ghost{background:#fff;color:var(--f-blue);border:1.5px solid var(--f-blue)}
.ftp-ok{background:#E9F6E6;border:1px solid #BFE3B7;border-radius:8px;padding:14px 16px;margin:0 0 14px}
.ftp-err{background:#FCEBE8;border:1px solid #F2C1B8;color:#8A1F10;border-radius:8px;padding:12px 14px;margin:0 0 14px}

/* Tools algemeen */
.ftp-tool{background:#fff;border:1px solid var(--f-line);border-radius:var(--f-radius);box-shadow:var(--f-shadow);padding:22px}
.ftp-tool h1{margin:0 0 4px;font-size:26px}
.ftp-tool .ftp-intro{color:var(--f-soft);margin:0 0 18px;max-width:900px}
.ftp-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.ftp-field{display:flex;flex-direction:column;gap:5px;min-width:150px;flex:1}
.ftp-field label,.ftp-lbl{font-size:13px;font-weight:700;color:var(--f-navy)}
.ftp-field input,.ftp-field select{padding:9px 11px;border:1px solid #C9D3E0;border-radius:8px;font:inherit;font-size:15px;background:#fff;color:var(--f-ink);width:100%}
.ftp-field input:focus,.ftp-field select:focus{outline:2px solid rgba(0,66,137,.25);border-color:var(--f-blue)}
.ftp-field small{color:var(--f-soft);font-size:12px}
.ftp-chips{display:flex;flex-wrap:wrap;gap:8px}
.ftp-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--f-line);background:#fff;border-radius:20px;padding:6px 12px;font-size:13.5px;cursor:pointer;user-select:none}
.ftp-chip input{margin:0}
.ftp-chip .dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.ftp-chip b{font-weight:700;color:var(--f-navy)}
.ftp-section{margin-top:22px}
.ftp-section h2{font-size:19px;margin:0 0 10px}
.ftp-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.ftp-card{border:1px solid var(--f-line);border-radius:10px;padding:14px 14px;background:#FAFBFD}
.ftp-card .k{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--f-soft);font-weight:700}
.ftp-card .v{font-size:24px;font-weight:800;color:var(--f-navy);margin-top:4px}
.ftp-card .s{font-size:13px;color:var(--f-soft)}
.ftp-card.good{border-color:#BFE3B7;background:#F2FAF0}
.ftp-card.good .v{color:#2D7A22}
.ftp-card.bad{border-color:#F2C1B8;background:#FDF4F2}
.ftp-card.bad .v{color:var(--f-red)}
.ftp-table-wrap{overflow:auto;border:1px solid var(--f-line);border-radius:10px;max-height:560px}
table.ftp-table{border-collapse:collapse;width:100%;font-size:14px;background:#fff}
.ftp-table th{position:sticky;top:0;background:var(--f-navy);color:#fff;text-align:left;font-weight:600;padding:9px 10px;white-space:nowrap;cursor:pointer}
.ftp-table td{border-top:1px solid #E8EDF3;padding:8px 10px;vertical-align:top}
.ftp-table tr:hover td{background:#F5F8FC}
.ftp-table td.num,.ftp-table th.num{text-align:right;white-space:nowrap}
.ftp-badge{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:12px;white-space:nowrap}
.ftp-yes{background:#E6F4E3;color:#2D7A22}
.ftp-no{background:#F1F3F6;color:var(--f-soft)}
.ftp-note{font-size:13px;color:var(--f-soft);margin-top:10px}
.ftp-status{font-size:14px;color:var(--f-soft);margin:10px 0}
.ftp-status.err{color:var(--f-red)}
.ftp-spin{display:inline-block;width:14px;height:14px;border:2px solid #C9D3E0;border-top-color:var(--f-blue);border-radius:50%;animation:ftpspin .8s linear infinite;vertical-align:-2px;margin-right:6px}
@keyframes ftpspin{to{transform:rotate(360deg)}}

/* Prospectkaart */
.ftp-pk-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
#ftpPkMap{height:520px;border-radius:10px;border:1px solid var(--f-line);z-index:1}
.ftp-pk-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--f-soft);margin-top:8px}
.ftp-pk-legend i{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.ftp-pk-list{position:relative}
.ftp-pk-sugg{position:absolute;z-index:1100;left:0;right:0;top:100%;background:#fff;border:1px solid var(--f-line);border-radius:8px;box-shadow:var(--f-shadow);max-height:300px;overflow:auto;display:none}
.ftp-pk-sugg div{padding:8px 12px;cursor:pointer;font-size:14px;border-bottom:1px solid #F0F3F7}
.ftp-pk-sugg div:hover,.ftp-pk-sugg div.on{background:#EEF3FA}
.ftp-pk-sugg small{color:var(--f-soft)}
.ftp-pk-sel{margin:10px 0 0;font-size:14px}
.ftp-pk-sel strong{color:var(--f-navy)}

/* Rekentools */
.ftp-calc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.ftp-scen{width:100%;border-collapse:collapse;font-size:14px}
.ftp-scen th,.ftp-scen td{padding:8px 10px;border-bottom:1px solid #E8EDF3;text-align:right;white-space:nowrap}
.ftp-scen th:first-child,.ftp-scen td:first-child{text-align:left}
.ftp-scen thead th{background:#EEF3FA;color:var(--f-navy);font-weight:700}
.ftp-scen tr.best td{background:#F2FAF0}
.ftp-bar{height:10px;border-radius:5px;background:var(--f-blue);display:inline-block;vertical-align:middle}
.ftp-slider{display:grid;grid-template-columns:minmax(150px,240px) 1fr 54px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #EEF2F6}
.ftp-slider .t{font-weight:700;color:var(--f-navy);font-size:14.5px}
.ftp-slider .q{display:block;font-weight:400;color:var(--f-soft);font-size:12.5px}
.ftp-slider input[type=range]{width:100%;accent-color:var(--f-blue)}
.ftp-slider output{font-weight:800;color:var(--f-navy);text-align:right}
.ftp-score{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:18px}
.ftp-score-dial{width:130px;height:130px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:conic-gradient(var(--c,#004289) calc(var(--p,0)*1%),#E8EDF3 0)}
.ftp-score-dial span{width:100px;height:100px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:800;color:var(--f-navy)}
.ftp-score-txt h3{margin:0 0 4px;font-size:20px}
.ftp-score-txt p{margin:0;color:var(--f-soft)}
.ftp-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}

/* Voet */
.ftp-foot{background:var(--f-foot);color:#C9D5E8;font-size:13px}
.ftp-foot-in{max-width:1320px;margin:0 auto;padding:16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* Routefinder binnen portaal: geen dubbele kop */
.ftp-content-routefinder #frf-wrapper{margin-top:0}


/* Offerte */
.ftp-of-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.ftp-of-prev{position:sticky;top:84px}
.ftp-of-prev-lbl{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--f-soft);margin-bottom:6px}
.ftp-of-rows input,.ftp-of-rows select{width:100%;min-width:80px;padding:6px 8px;border:1px solid #C9D3E0;border-radius:6px;font:inherit;font-size:14px}
.ftp-of-rows td{vertical-align:top}
.ftp-of-rows select.ofP{min-width:140px}
.ftp-of-rows .ofU{display:block;font-size:11px;color:var(--f-soft)}
.ftp-of-usp{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.ftp-of-usp input[type=text]{flex:1;padding:6px 8px;border:1px solid #C9D3E0;border-radius:6px;font:inherit;font-size:14px}
.ftp-of textarea{width:100%;padding:8px 10px;border:1px solid #C9D3E0;border-radius:8px;font:inherit;font-size:14px}
.ftp-of-doc{background:#fff;border:1px solid var(--f-line);border-radius:6px;box-shadow:var(--f-shadow);padding:34px 36px;font-size:13.5px;color:#1D2B3A;line-height:1.55}
.ftp-of-doc h2{margin:0;font-size:26px;color:var(--f-blue)}
.ftp-of-doc h3{font-size:15px;margin:20px 0 8px;color:var(--f-navy);border-bottom:2px solid var(--f-red);padding-bottom:4px;display:inline-block}
.ftp-of-doc .of-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:4px solid var(--f-blue);padding-bottom:14px;margin-bottom:18px}
.ftp-of-doc .of-head img{height:40px;width:auto}
.ftp-of-doc .of-meta{text-align:right;font-size:12.5px;color:var(--f-soft)}
.ftp-of-doc .of-addr{margin-bottom:18px}
.ftp-of-doc .of-t{width:100%;border-collapse:collapse;font-size:12.5px}
.ftp-of-doc .of-t th{background:var(--f-blue);color:#fff;text-align:left;padding:6px 8px;font-weight:600}
.ftp-of-doc .of-t td{padding:6px 8px;border-bottom:1px solid var(--f-line)}
.ftp-of-doc .num{text-align:right;white-space:nowrap}
.ftp-of-doc .of-kpi{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.ftp-of-doc .of-kpi .k{flex:1 1 140px;border:1px solid var(--f-line);border-left:4px solid var(--f-blue);border-radius:6px;padding:8px 10px}
.ftp-of-doc .of-kpi .k.good{border-left-color:var(--f-green)}
.ftp-of-doc .of-kpi span{display:block;font-size:11.5px;color:var(--f-soft)}
.ftp-of-doc .of-kpi b{font-size:19px;color:var(--f-navy)}
.ftp-of-doc .of-kpi small{display:block;font-size:11px;color:var(--f-soft)}
.ftp-of-doc .of-near{background:#EEF3FA;border-radius:6px;padding:8px 10px}
.ftp-of-doc ul{margin:0;padding-left:18px}
.ftp-of-doc .of-usp li::marker{color:var(--f-red)}
.ftp-of-doc .of-sign{break-inside:avoid;display:flex;gap:30px;justify-content:space-between;margin-top:22px}
.ftp-of-doc .of-akk{border:1px dashed #C9D3E0;border-radius:6px;padding:8px 14px;min-width:220px;line-height:2}
.ftp-of-doc .of-foot{margin-top:24px;border-top:1px solid var(--f-line);padding-top:8px;font-size:11px;color:var(--f-soft);text-align:center}
.ftp-of-doc .of-muted{color:var(--f-soft)}
@media (max-width:1100px){.ftp-of-layout{grid-template-columns:1fr}.ftp-of-prev{position:static}}
@media print{
  body.ftp-offerte #ftpOf>*:not(.ftp-of-layout),body.ftp-offerte .ftp-of-form,body.ftp-offerte .ftp-of-prev-lbl{display:none !important}
  body.ftp-offerte .ftp-of-layout{display:block}
  body.ftp-offerte .ftp-of-prev{position:static}
  body.ftp-offerte #ofDoc{border:0;box-shadow:none;padding:0}
  .ftp-of-doc .of-t th,.ftp-of-doc .of-near,.ftp-of-doc .of-head{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  @page{margin:16mm}
}

/* Overdracht naar offerte */
.ftp-btn-offerte{background:var(--f-red);border-color:var(--f-red)}
.ftp-btn-offerte:hover{background:#B42617}

/* Dashboard: functies en wensen */
.ftp-feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px 24px;margin:0;padding:0;list-style:none}
.ftp-feat li{padding-left:22px;position:relative}
.ftp-feat li:before{content:"";position:absolute;left:2px;top:8px;width:10px;height:10px;border-radius:50%;background:var(--f-green)}
.ftp-wens{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.ftp-wens textarea{flex:1 1 320px;padding:10px;border:1px solid #C9D3E0;border-radius:8px;font:inherit;font-size:15px;min-height:70px}

/* Prospectkaart: reset */
.ftp-pk-sel{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ftp-pk-sel .ftp-chip{font-size:13px}
.ftp-link-btn{background:none;border:0;color:var(--f-link);font:inherit;font-size:13px;cursor:pointer;padding:2px 0;text-decoration:underline}

@media (max-width:640px){
  .ftp-hero{padding:24px 20px}
  .ftp-hero h1{font-size:24px}
  .ftp-tool{padding:16px}
  #ftpPkMap{height:380px}
  .ftp-slider{grid-template-columns:1fr 54px}
  .ftp-slider .t{grid-column:1/-1}
  .ftp-narrow{padding:20px 16px}
}
@media print{
  .ftp-top,.ftp-foot,.ftp-crumbs,.ftp-btns,.ftp-noprint{display:none !important}
  body.ftp-body{background:#fff}
  .ftp-main{padding:0}
  .ftp-tool{box-shadow:none;border:0;padding:0}
  .ftp-table-wrap{max-height:none;overflow:visible}
}
