:root{--ink:#06121d;--panel:#0a1a27;--panel2:#0d2131;--line:rgba(151,203,234,.13);--white:#f4fbff;--muted:#8aa4b6;--blue:#168fff;--sky:#69c8ff;--orange:#ff6a00;--green:#3bd69f;--shadow:0 24px 80px rgba(0,0,0,.28)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--white);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}a{color:inherit}.portal-loading .portal-main{opacity:.72}.portal-body{min-height:100vh;background:radial-gradient(circle at 78% 0,rgba(22,143,255,.12),transparent 32%),radial-gradient(circle at 20% 90%,rgba(255,106,0,.055),transparent 24%),var(--ink)}
.portal-layout{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.portal-sidebar{position:sticky;top:0;height:100vh;padding:30px 22px;border-right:1px solid var(--line);background:rgba(5,16,26,.88);backdrop-filter:blur(18px);display:flex;flex-direction:column}.portal-logo{display:block;width:190px;margin:0 5px 38px}.portal-logo img{width:100%;display:block}.portal-label{margin:0 10px 10px;color:#5e7b8e;font-size:12px;font-weight:850;letter-spacing:1.5px}.portal-nav{display:grid;gap:7px}.portal-nav a{display:flex;gap:12px;align-items:center;padding:12px 13px;border:1px solid transparent;border-radius:12px;color:#8ba7b9;text-decoration:none;font-size:15px;font-weight:700;cursor:pointer}.portal-nav a:hover,.portal-nav a.active{color:#fff;background:rgba(22,143,255,.085);border-color:rgba(22,143,255,.16)}.portal-nav span{width:21px;text-align:center;font-size:16px}.portal-sidebar-bottom{margin-top:auto}.portal-user{padding:14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}.portal-avatar{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),#52bafa);font-weight:900;margin-bottom:10px}.portal-user strong,.portal-user small{display:block;overflow:hidden;text-overflow:ellipsis}.portal-user strong{font-size:14px}.portal-user small{margin-top:4px;color:var(--muted);font-size:12px}.portal-signout{margin-top:10px;padding:0;border:0;background:transparent;color:#7190a4;font:inherit;font-size:13px;cursor:pointer}
.portal-main{min-width:0;padding:32px clamp(22px,4vw,62px) 64px}.portal-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:45px}.portal-mobile-logo{display:none}.portal-secure{display:flex;align-items:center;gap:8px;color:#7191a6;font-size:13px;font-weight:700}.portal-secure i{display:block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(59,214,159,.08)}.portal-site-link{padding:9px 13px;border:1px solid rgba(105,200,255,.28);border-radius:10px;text-decoration:none;color:var(--sky);font-size:13px;font-weight:750;transition:background .15s ease,border-color .15s ease}.portal-site-link:hover{background:rgba(21,143,255,.1);border-color:rgba(105,200,255,.5)}.portal-welcome{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:28px}.portal-eyebrow{margin:0 0 10px;color:var(--sky);font-size:12px;font-weight:900;letter-spacing:1.5px}.portal-welcome h1{margin:0;font-size:clamp(31px,4vw,48px);letter-spacing:-2px;line-height:1}.portal-welcome p{max-width:540px;margin:14px 0 0;color:var(--muted);font-size:16px;line-height:1.7}.portal-primary{display:inline-flex;align-items:center;justify-content:center;padding:12px 17px;border:0;border-radius:11px;background:linear-gradient(110deg,var(--blue),#3aa3ff);color:#fff;text-decoration:none;font-size:14px;font-weight:850;white-space:nowrap;box-shadow:0 11px 30px rgba(21,143,255,.22);transition:filter .15s ease}.portal-primary:hover{filter:brightness(1.07)}
.portal-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-bottom:28px}.portal-stat{padding:18px 19px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.022)}.portal-stat span{display:block;color:#7895a8;font-size:12px;font-weight:800}.portal-stat strong{display:block;margin:8px 0 4px;font-size:24px;letter-spacing:-.8px}.portal-stat small{color:#587488;font-size:12px}.portal-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(290px,.85fr);gap:18px}.portal-panel{border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,rgba(13,33,49,.9),rgba(7,21,32,.96));box-shadow:var(--shadow);overflow:hidden}.portal-panel-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:21px 23px;border-bottom:1px solid var(--line)}.portal-panel-head h2{margin:0;font-size:17px}.portal-panel-head a,.portal-text-button{padding:0;border:0;background:transparent;color:#6fadd3;font:inherit;font-size:13px;text-decoration:none;cursor:pointer}.portal-latest{padding:24px}.portal-order-top{display:flex;align-items:start;justify-content:space-between;gap:18px}.portal-order-top h3{margin:5px 0 0;font-size:23px;letter-spacing:-.7px}.portal-order-top p{margin:8px 0 0;color:var(--muted);font-size:13px}.portal-status{display:inline-flex;padding:7px 10px;border-radius:999px;background:rgba(59,214,159,.09);border:1px solid rgba(59,214,159,.18);color:#83e8c1;font-size:11px;font-weight:600;letter-spacing:.2px}.portal-package{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.portal-package div{padding:12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.018)}.portal-package span{display:block;color:#6f8da1;font-size:11px;margin-bottom:5px}.portal-package strong{font-size:13px}.portal-update{margin-top:18px;padding:13px;border-left:3px solid var(--blue);border-radius:0 10px 10px 0;background:rgba(22,143,255,.055);color:#9cb8c9;font-size:12px;line-height:1.55}.portal-progress-bar{height:7px;margin-top:20px;border-radius:9px;background:#142d3d;overflow:hidden}.portal-progress-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--sky));transition:width .3s}.portal-progress-label{display:flex;justify-content:space-between;margin-top:8px;color:#6c899d;font-size:11px}
.portal-services{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;padding:17px}.portal-service{position:relative;min-height:153px;padding:17px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.018);text-decoration:none;transition:.2s ease}.portal-service:hover{transform:translateY(-2px);border-color:rgba(22,143,255,.3);background:rgba(22,143,255,.05)}.portal-service-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:rgba(22,143,255,.1);color:#62beff;font-size:17px}.portal-service.orange .portal-service-icon{background:rgba(255,106,0,.09);color:#ff9952}.portal-service h3{font-size:14px;margin:14px 0 6px}.portal-service p{margin:0;color:#718ea2;font-size:12px;line-height:1.5}.portal-service small{display:block;margin-top:10px;color:#4f9dcc;font-size:11px;font-weight:800}.portal-section{margin-top:36px}.portal-section-title{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:15px}.portal-section-title h2{margin:0;font-size:21px;letter-spacing:-.5px}.portal-section-title p{margin:5px 0 0;color:var(--muted);font-size:13px}.portal-requests{display:grid;gap:10px}.portal-request{display:grid;grid-template-columns:minmax(180px,1.4fr) 1fr .8fr .7fr;gap:18px;align-items:center;padding:17px 19px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.018);transition:border-color .2s ease,transform .2s ease}.portal-request:hover{border-color:rgba(105,200,255,.28);transform:translateY(-1px)}.portal-request strong,.portal-request span,.portal-request small{display:block}.portal-request strong{font-size:14px}.portal-request small{margin-top:5px;color:#648196;font-size:12px}.portal-request span{color:#9ab5c6;font-size:13px}.portal-request .portal-status{justify-self:end}.portal-empty{padding:25px;border:1px dashed rgba(151,203,234,.18);border-radius:14px;color:var(--muted);text-align:center;font-size:13px}
.portal-lower{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:36px}.portal-chat,.portal-profile{padding:21px}.portal-messages{height:250px;overflow:auto;display:flex;flex-direction:column;gap:9px;padding:4px 3px 15px}.portal-message{max-width:84%;padding:11px 12px;border-radius:13px 13px 13px 3px;background:#102b3e;color:#b6cedc;font-size:13px;line-height:1.55}.portal-message.customer{align-self:end;border-radius:13px 13px 3px 13px;background:rgba(22,143,255,.17);color:#d8f0ff}.portal-message small{display:block;margin-top:6px;color:#64859a;font-size:10px}.portal-chat-form{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:14px}.portal-chat-form textarea{flex:1;min-height:44px;max-height:110px;resize:vertical;border:1px solid var(--line);border-radius:11px;background:#061722;color:#fff;padding:11px;font:inherit;font-size:14px;outline:0}.portal-chat-form button{width:44px;border:0;border-radius:11px;background:var(--blue);color:white;font-size:17px;cursor:pointer}.portal-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.portal-field{display:grid;gap:6px}.portal-field.wide{grid-column:1/-1}.portal-field label{color:#7795a8;font-size:12px;font-weight:800}.portal-field input{width:100%;padding:11px;border:1px solid var(--line);border-radius:9px;background:#061722;color:#fff;font:inherit;font-size:14px;outline:0}.portal-field input:focus,.portal-chat-form textarea:focus{border-color:rgba(22,143,255,.5)}.portal-form-actions{display:flex;align-items:center;gap:12px;margin-top:15px}.portal-save{padding:10px 14px;border:0;border-radius:9px;background:linear-gradient(110deg,var(--blue),#3aa3ff);color:#fff;font-size:13px;font-weight:850;cursor:pointer;box-shadow:0 8px 20px rgba(21,143,255,.18);transition:filter .15s ease}.portal-save:hover{filter:brightness(1.07)}.portal-form-status{color:#76cba9;font-size:12px}
.portal-help{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:36px;padding:24px 27px;border-radius:18px;background:linear-gradient(110deg,rgba(22,143,255,.12),rgba(22,143,255,.035));border:1px solid rgba(22,143,255,.18)}.portal-help h2{margin:0 0 7px;font-size:18px}.portal-help p{margin:0;color:#83a0b3;font-size:13px}.portal-help a{padding:11px 15px;border:1px solid rgba(105,200,255,.3);border-radius:10px;text-decoration:none;color:var(--sky);font-size:13px;font-weight:800;cursor:pointer;transition:background .15s ease,border-color .15s ease}.portal-help a:hover{background:rgba(21,143,255,.1);border-color:rgba(105,200,255,.55)}
.auth-body{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 15% 15%,rgba(22,143,255,.13),transparent 30%),radial-gradient(circle at 90% 90%,rgba(255,106,0,.07),transparent 25%),var(--ink)}.auth-shell{width:min(940px,100%);display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:rgba(8,23,35,.95);box-shadow:var(--shadow)}.auth-story{padding:50px;background:linear-gradient(145deg,rgba(22,143,255,.13),rgba(6,18,29,.45));border-right:1px solid var(--line)}.auth-logo{display:block;width:205px}.auth-story h1{margin:70px 0 16px;font-size:39px;line-height:1.03;letter-spacing:-1.7px}.auth-story p{color:#8faabd;font-size:15px;line-height:1.75}.auth-points{display:grid;gap:13px;margin-top:35px}.auth-point{display:flex;align-items:center;gap:12px;color:#afc4d1;font-size:13px}.auth-point i{width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 5px rgba(22,143,255,.08)}.auth-card{padding:50px}.auth-kicker{color:var(--sky);font-size:11px;font-weight:900;letter-spacing:1.4px}.auth-card h2{margin:9px 0 8px;font-size:28px;letter-spacing:-.8px}.auth-intro{margin:0 0 25px;color:var(--muted);font-size:13px;line-height:1.65}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:22px;padding:4px;border-radius:11px;background:rgba(255,255,255,.025)}.auth-tabs button{padding:10px;border:0;border-radius:8px;background:transparent;color:#708da1;font-size:12px;font-weight:850;cursor:pointer}.auth-tabs button.active{background:#102a3e;color:white}.auth-pane{display:none}.auth-pane.active{display:block}.auth-field{display:grid;gap:7px;margin-bottom:14px}.auth-field label{color:#8ba6b8;font-size:12px;font-weight:850}.auth-field input{width:100%;padding:13px;border:1px solid var(--line);border-radius:10px;background:#061722;color:#fff;outline:0;font-size:14px}.auth-check{display:flex;align-items:center;gap:9px;margin:3px 0 17px;color:#7896aa;font-size:12px}.auth-check input{accent-color:var(--blue)}.auth-button{width:100%;padding:13px;border:0;border-radius:10px;background:linear-gradient(100deg,#168fff,#50b8f6);color:white;font-weight:900;font-size:14px;cursor:pointer}.auth-button:disabled{opacity:.55}.auth-links{display:flex;justify-content:space-between;gap:15px;margin-top:15px}.auth-links a{color:#6fb4df;text-decoration:none;font-size:12px}.auth-status{display:none;margin-top:14px;padding:11px;border-radius:10px;font-size:13px}.auth-status.show{display:block}.auth-status.ok{color:#9ce8c9;background:rgba(59,214,159,.07);border:1px solid rgba(59,214,159,.16)}.auth-status.err{color:#ffc29e;background:rgba(255,106,0,.07);border:1px solid rgba(255,106,0,.17)}.auth-foot{margin-top:25px;padding-top:18px;border-top:1px solid var(--line);color:#5f7d90;font-size:12px}.auth-hp{position:absolute;left:-10000px;width:1px;height:1px;opacity:0}
.topbar-left{display:flex;align-items:center;gap:12px}
.menu-toggle{display:none;flex-direction:column;justify-content:center;gap:4px;width:38px;height:38px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.03);cursor:pointer;padding:0;flex:none}
.menu-toggle span{display:block;width:16px;height:2px;background:#cfe3f0;margin:0 auto;border-radius:2px}
.nav-backdrop{display:none}
@media(max-width:1000px){.portal-layout{grid-template-columns:1fr}.menu-toggle{display:flex}.portal-sidebar{position:fixed;top:0;left:0;height:100vh;width:82vw;max-width:300px;z-index:50;transform:translateX(-100%);transition:transform .25s ease}body.nav-open .portal-sidebar{transform:translateX(0);box-shadow:0 0 50px rgba(0,0,0,.5)}.nav-backdrop{display:block;position:fixed;inset:0;background:rgba(2,8,14,.55);z-index:40;opacity:0;pointer-events:none;transition:opacity .2s ease}body.nav-open .nav-backdrop{opacity:1;pointer-events:auto}.portal-main{padding:22px 18px 50px}.portal-mobile-logo{display:block;width:145px}.portal-topbar{margin-bottom:34px}.portal-grid,.portal-lower{grid-template-columns:1fr}.portal-welcome{align-items:start}.auth-shell{grid-template-columns:1fr;max-width:520px}.auth-story{display:none}.auth-card{padding:35px 28px}.page-head h1{font-size:24px}.portal-panel-head h2{font-size:16px}.portal-nav a{font-size:16px}}
@media(max-width:620px){.portal-welcome{display:block}.portal-primary{margin-top:22px}.portal-stats{grid-template-columns:1fr 1fr}.portal-stat:last-child{grid-column:1/-1}.portal-services{grid-template-columns:1fr}.portal-package{grid-template-columns:1fr}.portal-request{grid-template-columns:1fr}.portal-request .portal-status{justify-self:start}.portal-help{display:block}.portal-help a{display:inline-flex;margin-top:17px}.portal-site-link{display:none}.portal-form-grid{grid-template-columns:1fr}.portal-field.wide{grid-column:auto}.auth-body{padding:12px}.auth-card{padding:30px 21px}.page-head h1{font-size:21px}.page-head p.sub{font-size:14px}.portal-welcome p{font-size:14px}.portal-panel-head h2{font-size:15px}}

/* Rustige, herkenbare standaardtypografie voor het klantendashboard. */
body{font-family:Arial,Helvetica,sans-serif}
.portal-project-overview{margin:0 0 27px}.portal-project-overview .portal-panel{position:relative;overflow:hidden}.portal-project-overview .portal-panel:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange),var(--blue) 55%,var(--sky))}.portal-project-overview .portal-latest{padding:26px}.portal-project-overview .portal-project-meta div{transition:border-color .2s ease,transform .2s ease}.portal-project-overview .portal-project-meta div:hover{border-color:rgba(105,200,255,.3);transform:translateY(-1px)}
.mini-steps-grid{display:grid;margin-top:16px}
.mini-step-col{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;padding:0 2px}
.mini-dot-wrap{position:relative;display:flex;justify-content:center;width:100%}
.mini-dot-wrap:before{content:"";position:absolute;top:3px;right:50%;width:100%;height:2px;background:#1c3247;z-index:0}
.mini-step-col:first-child .mini-dot-wrap:before{display:none}
.mini-dot-wrap.is-line-done:before{background:var(--green)}
.mini-dot{width:8px;height:8px;border-radius:50%;background:#26445f;flex:none;position:relative;z-index:1}
.mini-dot.is-done{background:var(--green)}
.mini-dot.is-current{background:var(--blue);box-shadow:0 0 0 4px rgba(21,143,255,.22)}
.mini-step-label{margin:7px 0 0;font-size:9.5px;line-height:1.35;color:#54687a}
.mini-step-col.is-done .mini-step-label{color:#7fa1b6}
.mini-step-col.is-current .mini-step-label{color:var(--sky);font-weight:800}
@media(max-width:620px){.mini-step-label{font-size:8px}}
.portal-project-overview .portal-order-top{align-items:center}.order-top-main{display:flex;align-items:center;gap:14px;min-width:0}.project-icon{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#1c74d1,#0c4a8c);display:grid;place-items:center;flex:none}.portal-project-overview .portal-order-top h3{margin:3px 0 0;font-size:19px;letter-spacing:-.4px;color:var(--white);font-weight:800}.portal-project-overview .portal-order-top p{margin:3px 0 0;font-size:12px}.portal-project-overview .portal-eyebrow{font-size:11px}.portal-project-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0 14px}.portal-project-meta div{padding:15px 17px;border:1px solid rgba(151,203,234,.16);border-radius:13px;background:rgba(4,18,29,.26)}.portal-project-meta span{display:block;margin-bottom:6px;color:#7fa1b6;font-size:12px;font-weight:700}.portal-project-meta strong{display:block;color:#f4fbff;font-size:17px;letter-spacing:-.25px}.portal-project-progress{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin-top:23px}.portal-project-progress span{color:#7fa1b6;font-size:12px;font-weight:700}.portal-project-progress strong{color:#d9f2ff;font-size:15px}.portal-project-overview .portal-progress-bar{margin-top:10px;height:9px}.portal-project-overview .portal-progress-label{font-size:12px}.portal-project-overview .portal-update{font-size:13px;line-height:1.6}
@media(max-width:620px){.portal-project-meta{grid-template-columns:1fr}.portal-project-overview .portal-latest{padding:21px}.portal-project-progress{display:grid;gap:5px}}

.portal-activity-section{margin-top:36px}.portal-activity{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.portal-activity-item{display:flex;align-items:center;gap:13px;padding:16px 17px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.018);transition:border-color .2s ease,transform .2s ease,background .2s ease}.portal-activity-item:hover{transform:translateY(-2px);border-color:rgba(22,143,255,.42);background:rgba(22,143,255,.06)}.portal-activity-item i{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:rgba(22,143,255,.13);color:#69c8ff;font-style:normal;font-size:15px}.portal-activity-item strong,.portal-activity-item small{display:block}.portal-activity-item strong{font-size:13px}.portal-activity-item small{margin-top:4px;color:#7999ad;font-size:12px}@media(max-width:620px){.portal-activity{grid-template-columns:1fr}}

/* Meerdere pagina's i.p.v. één lange scrollpagina, met uitklapmenu op tablet/mobiel. */
.view{display:none}
.view.active{display:block}
.page-head{margin-bottom:26px}
.page-head p.eyebrow{margin:0 0 8px}
.page-head h1{margin:0;font-size:28px;letter-spacing:-1px}
.page-head p.sub{max-width:520px;margin:10px 0 0;color:var(--muted);font-size:15px;line-height:1.7}
.portal-chat.full{padding:26px}
.portal-chat.full .portal-messages{height:420px}
.portal-profile.full{padding:26px}
.portal-profile.full .portal-form-grid{max-width:620px}
.doc-row{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;padding:15px 19px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.018);margin-bottom:10px;transition:border-color .2s ease,transform .2s ease}
.doc-row:last-child{margin-bottom:0}
.doc-row:hover{border-color:rgba(105,200,255,.28);transform:translateY(-1px)}
.doc-main{display:flex;align-items:center;gap:12px;min-width:0}
.doc-icon{width:36px;height:36px;border-radius:9px;background:linear-gradient(135deg,#e5484d,#a5222a);display:grid;place-items:center;flex:none}
.doc-main strong{display:block;font-size:14px}
.doc-main small{display:block;margin-top:4px;color:#648196;font-size:12px}
.doc-date{color:#9ab5c6;font-size:13px;white-space:nowrap}
.doc-download{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border:1px solid rgba(105,200,255,.28);border-radius:10px;text-decoration:none;color:var(--sky);font-size:13px;font-weight:750;white-space:nowrap;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.doc-download:hover{background:rgba(21,143,255,.1);border-color:rgba(105,200,255,.5)}
@media(max-width:620px){.doc-row{grid-template-columns:1fr}.doc-date{order:2}.doc-download{order:3;justify-self:start}}

/* Projectkop: vaste hiërarchie voor icoon, label, titel en referentie. */
.portal-project-overview .order-top-main{align-items:flex-start}
.portal-project-overview .project-icon{margin-top:3px}
.portal-project-overview .order-top-copy{min-width:0;text-align:left}
.portal-project-overview .order-top-copy .portal-eyebrow{margin:0 0 4px;text-align:left;line-height:1.2}
.portal-project-overview .order-top-copy h3{margin:0;line-height:1.25}
.latest-meta-corner{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
.order-ref-chip{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:10.5px;color:#7fa1b6;background:rgba(151,203,234,.08);border:1px solid rgba(151,203,234,.18);padding:3px 8px;border-radius:6px;white-space:nowrap;letter-spacing:.2px}
@media(max-width:620px){
  .portal-project-overview .portal-order-top{align-items:flex-start}
  .portal-project-overview .project-icon{width:38px;height:38px;margin-top:2px}
  .portal-project-overview .order-top-main{gap:11px}
  .portal-project-overview .order-top-copy h3{font-size:17px}
}

/* Bewegende projectstatus: bewust geen decoratief producticoon. */
.portal-project-overview .project-icon{display:none}
.portal-project-overview .project-signal{position:relative;display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:14px;background:radial-gradient(circle at 50% 50%,rgba(104,205,255,.95) 0 10%,rgba(25,143,255,.46) 23%,rgba(16,78,148,.22) 46%,transparent 70%);overflow:visible}
.portal-project-overview .project-signal:before,.portal-project-overview .project-signal:after{content:"";position:absolute;inset:8px;border:1px solid rgba(95,202,255,.72);border-radius:50%;animation:portalSignalRing 2.8s ease-out infinite}
.portal-project-overview .project-signal:after{animation-delay:1.4s}
.portal-project-overview .project-signal i{position:absolute;width:5px;height:5px;border-radius:50%;background:#bff2ff;box-shadow:0 0 12px #38bfff;animation:portalSignalOrbit 3.6s linear infinite}
.portal-project-overview .project-signal i:nth-child(1){transform:translateX(14px)}
.portal-project-overview .project-signal i:nth-child(2){transform:rotate(120deg) translateX(14px);animation-delay:-1.2s}
.portal-project-overview .project-signal i:nth-child(3){transform:rotate(240deg) translateX(14px);animation-delay:-2.4s}
.portal-project-overview .portal-progress-bar{position:relative}
.portal-project-overview .portal-progress-bar i{position:relative;overflow:hidden}
.portal-project-overview .portal-progress-bar i:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.52) 50%,transparent 80%);transform:translateX(-130%);animation:portalProgressShine 3.8s ease-in-out infinite}
.portal-project-overview .mini-dot.is-current{animation:portalCurrentStep 2.2s ease-in-out infinite}
@keyframes portalSignalRing{0%{opacity:.8;transform:scale(.68)}75%,100%{opacity:0;transform:scale(1.62)}}
@keyframes portalSignalOrbit{to{transform:rotate(360deg) translateX(14px) rotate(-360deg)}}
@keyframes portalProgressShine{0%,30%{transform:translateX(-130%)}65%,100%{transform:translateX(130%)}}
@keyframes portalCurrentStep{0%,100%{box-shadow:0 0 0 4px rgba(21,143,255,.22),0 0 0 0 rgba(86,196,255,.34)}50%{box-shadow:0 0 0 5px rgba(21,143,255,.28),0 0 0 10px rgba(86,196,255,0)}}
@media(max-width:620px){.portal-project-overview .project-signal{width:38px;height:38px;flex-basis:38px}.portal-project-overview .project-signal:before,.portal-project-overview .project-signal:after{inset:7px}}
@media(prefers-reduced-motion:reduce){.portal-project-overview .project-signal:before,.portal-project-overview .project-signal:after,.portal-project-overview .project-signal i,.portal-project-overview .portal-progress-bar i:after,.portal-project-overview .mini-dot.is-current{animation:none}}

/* Lokale moderne portaltypografie. */
@font-face{font-family:"Manrope Portal";font-style:normal;font-weight:400 800;font-display:swap;src:url("fonts/manrope-portal.woff2") format("woff2")}
@font-face{font-family:"Space Grotesk Portal";font-style:normal;font-weight:500 700;font-display:swap;src:url("fonts/space-grotesk-portal.woff2") format("woff2")}
:root{--portal-body:"Manrope Portal",Inter,ui-sans-serif,system-ui,sans-serif;--portal-display:"Space Grotesk Portal","Manrope Portal",Inter,ui-sans-serif,sans-serif}
body{font-family:var(--portal-body);font-feature-settings:"ss01" 1,"cv02" 1}
.portal-welcome h1,.portal-panel-head h2,.portal-section-title h2,.portal-help h2,.auth-story h1,.auth-card h2,.portal-order-top h3,.portal-project-meta strong,.portal-stat strong{font-family:var(--portal-display);letter-spacing:-.045em}
.portal-welcome h1{font-weight:700}.portal-panel-head h2,.portal-section-title h2,.portal-help h2{font-weight:650}.portal-order-top h3,.portal-project-meta strong,.portal-stat strong{font-weight:700}
.portal-label,.portal-eyebrow,.auth-kicker{font-family:var(--portal-display);letter-spacing:.12em}
.portal-nav a,.portal-primary,.portal-site-link,.portal-status,.portal-save,.auth-button{font-family:var(--portal-body)}
