/* MassTaxway \2014 mobile-first. Base = phone (<=480). min-width queries ADD complexity. */
:root{--royal:#1B3FA0;--royal-dark:#122C73;--royal-tint:#EAEFFB;--green:#1C8A57;--green-tint:#E4F5EC;--amber:#B9791E;--amber-tint:#FBF1E0;--red:#C33B3B;--red-tint:#FBEAEA;--ink:#14161C;--ink-soft:#5B5F6B;--paper:#F5F6FA;--white:#fff;--border:rgba(20,22,28,.12);--border-strong:rgba(20,22,28,.22);--topbar-h:60px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Public Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--royal);text-decoration:none}a:hover{color:var(--royal-dark)}
h1,h2,h3{font-family:'Spectral',Georgia,serif;font-weight:600;margin:0 0 .4em;color:var(--ink);line-height:1.2}
h1{font-size:28px}h2{font-size:22px}h3{font-size:18px}
p{margin:0 0 1em}
.muted{color:var(--ink-soft)}.small{font-size:14px}.caption{font-size:12px;color:var(--ink-soft)}.center{text-align:center}
.lead{font-size:17px;color:var(--ink-soft)}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}
.section{padding:32px 0}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:999}
/* buttons: 44px touch targets */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border-radius:8px;font:600 15px 'Public Sans',sans-serif;border:1px solid var(--border-strong);background:var(--white);color:var(--ink);cursor:pointer;text-align:center}
.btn-primary{background:var(--royal);border-color:var(--royal);color:#fff}.btn-primary:hover{background:var(--royal-dark);color:#fff}
.btn-accent{background:var(--green);border-color:var(--green);color:#fff}.btn-accent:hover{background:#156E45;color:#fff}
.btn-danger{background:var(--red-tint);border-color:var(--red);color:#9A2E2E}
.btn-ok{background:var(--green-tint);border-color:var(--green);color:#0F6B3E}
.btn-outline-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn-sm{min-height:44px;padding:8px 14px;font-size:14px}
.btn-block{width:100%}
.inline-form{display:inline-block;margin:0}
.actions{display:flex;flex-wrap:wrap;gap:8px}
.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.badge-royal{background:var(--royal-tint);color:var(--royal-dark)}.badge-green{background:var(--green-tint);color:#0F6B3E}
.badge-amber{background:var(--amber-tint);color:#8A5A14}.badge-red{background:var(--red-tint);color:#9A2E2E}.badge-gray{background:#EEEFF3;color:var(--ink-soft)}
.card{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:18px;margin-bottom:16px}
.card.empty{color:var(--ink-soft);text-align:center}
.card-flat{margin-bottom:0}
.grid{display:grid;gap:16px;grid-template-columns:1fr}
/* forms: single column, full width, 16px font avoids iOS zoom */
.field{margin-bottom:16px}
label.label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.input,.select,.textarea{width:100%;min-height:44px;padding:11px 14px;border-radius:8px;border:1px solid var(--border-strong);font:16px 'Public Sans',sans-serif;color:var(--ink);background:#fff}
.textarea{min-height:100px;resize:vertical}
.input:focus,.select:focus,.textarea:focus{outline:2px solid var(--royal);outline-offset:1px}
.toggle-wrap{display:flex;gap:10px}
.toggle-btn{flex:1;min-height:48px;border-radius:8px;border:1px solid var(--border-strong);background:#fff;font:600 15px 'Public Sans',sans-serif;color:var(--ink-soft);cursor:pointer}
.toggle-btn.active,.toggle-btn:has(input:checked){background:var(--royal-tint);border-color:var(--royal);color:var(--royal-dark)}
.toggle-btn input{position:absolute;opacity:0;pointer-events:none}
.toggle-btn{position:relative;display:flex;align-items:center;justify-content:center}
.upload-box{border:1.5px dashed var(--border-strong);border-radius:10px;padding:18px;background:#FAFBFD;font-size:14px;color:var(--ink-soft)}
.flash{padding:12px 16px;border-radius:8px;margin:12px 0;font-size:14px}
.flash-success{background:var(--green-tint);color:#0F6B3E}.flash-error{background:var(--red-tint);color:#9A2E2E}.flash-info{background:var(--royal-tint);color:var(--royal-dark)}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
/* ---------- public header / nav ---------- */
.site-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.nav-bar{display:flex;align-items:center;justify-content:space-between;min-height:var(--topbar-h);gap:12px}
.logo{display:flex;align-items:center;gap:10px;font:700 21px 'Spectral',serif;color:var(--ink)}
.logo span{color:var(--green)}
.logo-mark{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,var(--royal),var(--green));flex-shrink:0}
.burger{width:44px;height:44px;border:1px solid var(--border-strong);border-radius:8px;background:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger i{display:block;width:20px;height:2px;background:var(--ink)}
.nav-panel{position:fixed;inset:var(--topbar-h) 0 0 0;background:#fff;padding:16px;overflow-y:auto;transform:translateY(-120%);visibility:hidden;transition:transform .25s,visibility .25s;z-index:49;display:flex;flex-direction:column;gap:4px}
.nav-panel.open{transform:none;visibility:visible}
.nav-panel a.nl{display:flex;align-items:center;min-height:48px;padding:0 8px;font-size:17px;font-weight:500;color:var(--ink);border-bottom:1px solid var(--border)}
.nav-panel .nav-cta{display:flex;flex-direction:column;gap:10px;margin-top:16px}
/* services dropdown: accordion in the mobile panel, mega-menu on desktop */
.has-dd{border-bottom:1px solid var(--border)}
.dd-toggle{width:100%;background:none;border:0;font:inherit;cursor:pointer;justify-content:space-between;text-align:left}
.nav-panel .has-dd .dd-toggle{display:flex;align-items:center;min-height:48px;padding:0 8px;font-size:17px;font-weight:500;color:var(--ink)}
.dd{display:none;padding:4px 0 10px 8px}
.has-dd.open .dd{display:block}
.dd-all{display:flex;align-items:center;min-height:44px;font-weight:600}
.dd-col{border-top:1px solid var(--border)}
.dd-col summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600;color:var(--ink);list-style:none}
.dd-col summary::-webkit-details-marker{display:none}
.dd-col summary:after{content:"+";margin-left:auto;font-size:20px;color:var(--ink-soft)}
.dd-col[open] summary:after{content:"\2013"}
.dd-col ul{list-style:none;margin:0;padding:0 0 8px 10px}
.dd-col li a{display:flex;align-items:center;min-height:40px;font-size:15px;color:var(--ink-soft)}
.dd-col li a:hover{color:var(--royal)}
.dd-cat{font-weight:600;color:var(--royal)!important}
/* ---------- hero / banners ---------- */
.hero{background:linear-gradient(135deg,var(--royal),var(--royal-dark));color:#fff;position:relative}
.slide{display:none;padding:40px 0 48px;background-size:cover;background-position:center}
.slide.active{display:block}
.slide[data-img]{background-image:linear-gradient(90deg,rgba(18,44,115,.92) 0%,rgba(18,44,115,.75) 55%,rgba(18,44,115,.35) 100%),var(--bg-m);background-size:cover;background-position:center}
.slide-copy{max-width:620px}
.hero{position:relative}
.dots{position:absolute;left:0;right:0;bottom:6px;padding:0}
.cat-strip{background:#fff;border-bottom:1px solid var(--border);padding:14px 0}
.cat-strip .chips{margin:0;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.cat-strip .chips::-webkit-scrollbar{display:none}
.cat-strip .chip{background:var(--royal-tint);border-color:transparent;color:var(--royal-dark);white-space:nowrap;font-weight:500}
.cat-strip .chip:hover{background:var(--royal);color:#fff}
.cat-strip .chip-more{background:#fff;border-color:var(--border-strong);font-weight:600}
@media(min-width:769px){
  /* height follows the photo's 1520x500 ratio (so it is never over-cropped), capped for very wide screens */
  .slide[data-img]{background-image:linear-gradient(90deg,rgba(18,44,115,.9) 0%,rgba(18,44,115,.6) 42%,rgba(18,44,115,0) 68%),var(--bg);background-position:right 18%;width:100%;aspect-ratio:1520/500;min-height:360px;max-height:540px;padding:0}
  .slide[data-img].active{display:flex;align-items:center}
  .cat-strip .chips{flex-wrap:wrap;overflow:visible}
}
@media(max-width:768px){.slide{padding-bottom:56px}}
@media(min-width:769px) and (max-width:1024px){.slide-copy{max-width:470px}.slide h1{font-size:34px}.slide .lead{font-size:16px}}
.slide h1{color:#fff;font-size:30px}.slide .lead{color:#D7E0FA}
.slide-actions{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.dots{display:flex;gap:4px;justify-content:center;padding-bottom:16px}
.dots button{width:44px;height:24px;border:0;background:none;cursor:pointer;position:relative}
.dots button:after{content:"";position:absolute;left:12px;right:12px;top:10px;height:4px;border-radius:4px;background:rgba(255,255,255,.4)}
.dots button.active:after{background:#fff}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.1);color:#fff;font-size:14px}
.stat{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px}
.stat .num{font:700 28px 'Spectral',serif;color:var(--royal-dark)}
.catcard{display:flex;gap:14px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px;color:var(--ink);min-height:44px}
.catcard:hover{border-color:var(--royal)}
.catnum{width:40px;height:40px;border-radius:10px;background:var(--royal-tint);color:var(--royal-dark);display:flex;align-items:center;justify-content:center;font:700 16px 'Spectral',serif;flex-shrink:0}
.svc-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px 16px;min-height:56px;color:var(--ink)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin:16px 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tab{padding:12px 14px;font-size:14px;font-weight:600;color:var(--ink-soft);border-bottom:2px solid transparent;white-space:nowrap;min-height:44px;display:flex;align-items:center}
.tab.active{color:var(--royal-dark);border-color:var(--royal)}
.list-check{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.list-check li{display:flex;gap:10px}.list-check li:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);margin-top:9px;flex-shrink:0}
.pstep{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--border)}.pstep:last-child{border:0}
.pnum{width:34px;height:34px;border-radius:50%;background:var(--royal);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}
.pstep.team .pnum{background:var(--green)}
.doc-row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid var(--border)}.doc-row:last-child{border:0}
.faq{border-bottom:1px solid var(--border);padding:8px 0}.faq summary{cursor:pointer;font-weight:600;min-height:44px;display:flex;align-items:center}
.crumbs{font-size:13px;color:var(--ink-soft);margin-bottom:12px}.crumbs a{color:var(--ink-soft)}
.cta-band{background:linear-gradient(135deg,var(--green-tint),var(--royal-tint));border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:14px}
.stars{color:var(--amber)}
.prose img{max-width:100%}
.map iframe{width:100%;height:320px;border:0;border-radius:12px}
/* ---------- footer + floaters ---------- */
.footer{background:var(--ink);color:#C9CCD6;padding:32px 0 96px;margin-top:24px}
.footer a{color:#C9CCD6;display:inline-flex;align-items:center;min-height:44px}.footer a:hover{color:#fff}
.footer h4{color:#fff;margin:0 0 8px;font-size:15px}
.footer .logo{color:#fff}
.news-form{display:flex;flex-direction:column;gap:10px}
.floaters{position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px;z-index:60}
.fab{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.25);border:0;cursor:pointer;font-size:22px}
.fab-wa{background:#25D366}.fab-call{background:var(--royal)}.fab-top{background:var(--ink);opacity:0;pointer-events:none;transition:opacity .2s}.fab-top.show{opacity:1;pointer-events:auto}
/* WhatsApp: official green + glyph, bottom-left, expanding "wave" rings */
.wa-float{position:fixed;left:20px;bottom:calc(24px + env(safe-area-inset-bottom));width:48px;height:48px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;z-index:60;box-shadow:0 4px 12px rgba(0,0,0,.28);transition:transform .2s}
.wa-float:hover{transform:scale(1.08)}
.wa-float:before,.wa-float:after{content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;opacity:.55;z-index:-1;animation:wa-wave 2.4s ease-out infinite}
.wa-float:after{animation-delay:1.2s}
.wa-float svg{width:26px;height:26px}
@media(max-width:480px){.wa-float{left:16px;bottom:calc(20px + env(safe-area-inset-bottom))}}
@keyframes wa-wave{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.9);opacity:0}}
@media(prefers-reduced-motion:reduce){.wa-float:before,.wa-float:after{animation:none;opacity:0}}
body.kbd .wa-float,body.kbd .floaters{display:none}  /* hide while a field is focused so they never cover the keyboard/input */
/* ---------- auth ---------- */
.auth{min-height:100vh;display:flex;flex-direction:column}
.auth-left{background:linear-gradient(135deg,var(--royal),var(--royal-dark));color:#fff;padding:24px 16px}
.auth-left .logo,.auth-left h1{color:#fff}.auth-left .list-check{display:none}
.auth-right{flex:1;padding:24px 16px;display:flex;justify-content:center}
.loginbox{width:100%;max-width:400px}
.roletabs{display:flex;gap:6px;background:#F0F1F5;border-radius:10px;padding:4px;margin-bottom:20px}
.roletab{flex:1;min-height:44px;border:0;border-radius:7px;background:transparent;font:600 14px 'Public Sans',sans-serif;color:var(--ink-soft);cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center}
.roletab input{position:absolute;opacity:0}
.roletab.active{background:#fff;color:var(--royal-dark);box-shadow:0 1px 3px rgba(0,0,0,.12)}
/* ---------- portal shell: drawer on <=1024 ---------- */
.shell{min-height:100vh}
.topbar{position:sticky;top:0;z-index:40;height:var(--topbar-h);background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 12px;gap:8px}
.topbar .t-left{display:flex;align-items:center;gap:10px;min-width:0}
.topbar .t-title{font:600 17px 'Spectral',serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .t-right{display:flex;align-items:center;gap:10px}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--royal-tint);color:var(--royal-dark);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}
.bell{position:relative;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;font-size:20px}
.bell b{position:absolute;top:6px;right:4px;background:var(--red);color:#fff;border-radius:999px;font-size:11px;padding:0 5px}
.sidebar{position:fixed;top:0;bottom:0;left:0;width:280px;max-width:85vw;background:var(--royal-dark);color:#DCE4FA;padding:20px 14px;display:flex;flex-direction:column;gap:4px;transform:translateX(-105%);transition:transform .25s;z-index:70;overflow-y:auto}
.sidebar.open{transform:none}
.staff-skin .sidebar{background:#1F2430}.admin-skin .sidebar{background:#14161C}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:65;display:none}.scrim.open{display:block}
.sb-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding:0 6px}
.sb-brand{font:700 19px 'Spectral',serif;color:#fff}.sb-brand span{color:#7FD9A8}
.sb-close{width:44px;height:44px;background:none;border:0;color:#fff;font-size:24px;cursor:pointer}
.sb-role{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#8B90A0;padding:0 10px;margin:-8px 0 12px}
.sidebar a.sl{display:flex;align-items:center;min-height:46px;padding:0 14px;border-radius:8px;font-size:15px;font-weight:500;color:#C6D1F2}
.sidebar a.sl:hover{background:rgba(255,255,255,.08);color:#fff}
.sidebar a.sl.active{background:#fff;color:var(--royal-dark);font-weight:700}
.admin-skin .sidebar a.sl.active,.staff-skin .sidebar a.sl.active{color:#14161C}
.sb-bottom{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.12)}
.sb-bottom button{width:100%;text-align:left;background:none;border:0;cursor:pointer;font:inherit}
.main{padding:16px 12px 32px;min-width:0}
.page-head{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.notice{background:var(--royal-tint);border:1px solid rgba(27,63,160,.2);border-radius:10px;padding:12px 14px;margin-bottom:16px;font-size:13px;color:var(--royal-dark)}
.stat-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:20px}
.steps{display:flex;flex-direction:column;gap:2px}
.step{display:flex;align-items:center;gap:10px;padding:8px 0}
.step-dot{width:28px;height:28px;border-radius:50%;background:#EEEFF3;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0}
.step.done .step-dot{background:var(--green);color:#fff}.step.active .step-dot{background:var(--royal);color:#fff}
.msg{display:flex;gap:10px;margin-bottom:12px}.msg-bubble{background:#F0F1F5;border-radius:10px;padding:10px 14px;font-size:14px;max-width:85%}
.msg.team .msg-bubble{background:var(--royal-tint)}.msg.me{flex-direction:row-reverse}.msg.me .msg-bubble{background:var(--green-tint)}
.bar-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:13px}.bar-label{width:92px;flex-shrink:0}
.bar-track{flex:1;height:10px;background:#EEEFF3;border-radius:999px;overflow:hidden}.bar-fill{height:100%;background:var(--royal);border-radius:999px}
.switch-row{display:flex;justify-content:space-between;align-items:center;min-height:48px;border-bottom:1px solid var(--border)}
.switch-row input{width:24px;height:24px}
.perm-table{width:100%;border-collapse:collapse;font-size:13px}.perm-table th,.perm-table td{padding:10px 8px;border-bottom:1px solid var(--border);text-align:center}
.perm-table th:first-child,.perm-table td:first-child{text-align:left}
.pager{display:flex;gap:6px;flex-wrap:wrap;margin:16px 0}.pager a{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-strong);border-radius:8px;background:#fff}.pager a.active{background:var(--royal);color:#fff;border-color:var(--royal)}
.filters{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.modal-full{position:fixed;inset:0;background:#fff;z-index:90;overflow:auto;padding:16px;display:none}.modal-full.open{display:block}
/* ---------- tables: stacked cards on phone/small tablet ---------- */
.table-wrap{border:0;background:none}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table thead{display:none}
.table tr{display:block;background:#fff;border:1px solid var(--border);border-radius:12px;padding:6px 14px;margin-bottom:12px}
.table td{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);text-align:right}
.table td:last-child{border-bottom:0}
.table td:before{content:attr(data-label);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);text-align:left;flex-shrink:0}
.table td.actions{justify-content:flex-start;flex-wrap:wrap}.table td.actions:before{display:none}
.table td.actions .btn{flex:1 1 auto}

/* ================= >=481px ================= */
@media(min-width:481px){
  h1{font-size:32px}.container{padding:0 24px}.main{padding:20px 20px 40px}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:repeat(2,1fr)}
  .slide-actions{flex-direction:row}
}
/* ================= >=769px ================= */
@media(min-width:769px){
  .section{padding:48px 0}
  .grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(4,1fr)}
  .page-head{flex-direction:row;align-items:center;justify-content:space-between}
  .cta-band{flex-direction:row;align-items:center;justify-content:space-between;padding:24px}
  .news-form{flex-direction:row}
  .steps{flex-direction:row;flex-wrap:wrap}.step{padding-right:18px}
  .filters{flex-direction:row;align-items:center}
  .slide h1{font-size:44px}
  .auth{flex-direction:row}.auth-left{flex:1;padding:56px;display:flex;flex-direction:column;justify-content:center;gap:20px}.auth-left .list-check{display:flex}
  .auth-left .list-check li{color:#E3E9FB}
  .auth-right{flex:1;align-items:center;padding:56px 32px}
  /* tables become real tables at tablet width, scrolling inside their own wrapper if needed */
  .table-wrap{border:1px solid var(--border);border-radius:12px;background:#fff;overflow-x:auto}
  .table thead{display:table-header-group}
  .table tr{display:table-row;background:none;border:0;border-radius:0;padding:0;margin:0}
  .table th{text-align:left;padding:12px 14px;color:var(--ink-soft);font-size:12px;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border);white-space:nowrap}
  .table td{display:table-cell;padding:12px 14px;border-bottom:1px solid var(--border);text-align:left}
  .table td:before{display:none}
  .table td.actions{display:table-cell}
  .table td.actions .btn,.table td.actions .inline-form{margin-right:6px;flex:none}
  .table-wrap .table{min-width:640px}
}
/* ================= >=1025px ================= */
@media(min-width:1025px){
  .burger.only-mobile{display:none}
  .nav-panel{position:static;transform:none;visibility:visible;flex-direction:row;align-items:center;padding:0;overflow:visible;gap:24px;flex:1;justify-content:space-between;background:none}
  .nav-panel .links{display:flex;gap:28px;margin-left:32px}
  .nav-panel a.nl{border:0;min-height:44px;padding:0;font-size:15px;color:var(--ink-soft)}.nav-panel a.nl:hover{color:var(--royal)}
  .nav-panel .nav-cta{flex-direction:row;margin:0}
  .burger{display:none}
  .has-dd{position:relative;border:0}
  .nav-panel .has-dd .dd-toggle{width:auto;min-height:44px;padding:0;font-size:15px;color:var(--ink-soft);gap:6px}
  .nav-panel .has-dd .dd-toggle:hover,.has-dd.open .dd-toggle{color:var(--royal)}
  .dd{position:absolute;left:-24px;top:100%;width:min(860px,92vw);background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 32px rgba(20,22,28,.14);padding:16px 20px;z-index:80}
  .has-dd:hover .dd,.has-dd:focus-within .dd,.has-dd.open .dd{display:block}
  .dd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 24px;max-height:70vh;overflow-y:auto}
  .dd-col{border:0}
  .dd-col summary{pointer-events:none;color:var(--royal-dark);border-bottom:1px solid var(--border);margin-bottom:4px;min-height:36px}
  .dd-col summary:after{display:none}
  .dd-col li a{min-height:34px;font-size:14px}
  .shell{display:flex}
  .sidebar{position:sticky;top:0;height:100vh;transform:none;flex:0 0 260px;width:260px;z-index:1}
  .sb-close,.shell .menu-btn{display:none}
  .scrim{display:none!important}
  .shell-body{flex:1;min-width:0}
  .main{padding:28px 36px 48px}
  .stat-grid{grid-template-columns:repeat(4,1fr)}
  .stat-grid.three{grid-template-columns:repeat(3,1fr)}
  .container{padding:0 32px}
  .hero .slide{padding:72px 0}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.floaters,.sidebar,.topbar,.site-header,.footer{display:none}}

.logo-img{height:34px;width:auto;flex-shrink:0;display:block}.logo-on-dark .logo-img,.logo-img.on-white{background:#fff;border-radius:8px;padding:3px 5px}.sb-brand{display:flex;align-items:center;gap:8px}

/* ================= carousel animation: crossfade + Ken Burns zoom + staggered text + progress dots ================= */
.hero{display:grid}
.hero .slide{display:flex;align-items:center;grid-area:1/1;position:relative;overflow:hidden;opacity:0;visibility:hidden;will-change:opacity;transition:opacity 1s cubic-bezier(.45,0,.25,1),visibility 0s linear 1s}
.hero .slide.active{opacity:1;visibility:visible;z-index:2;transition:opacity 1s cubic-bezier(.45,0,.25,1)}
.hero .slide.leaving{opacity:1;visibility:visible;z-index:1;transition:none}
.hero .slide[data-img]{background-image:none}
.hero .slide[data-img]::before{content:"";position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  background-image:linear-gradient(90deg,rgba(18,44,115,.92) 0%,rgba(18,44,115,.75) 55%,rgba(18,44,115,.35) 100%),var(--bg-m)}
.hero .slide[data-img]::before{will-change:transform;transform:translate3d(0,0,0) scale(1);backface-visibility:hidden}
.hero .slide.active::before,.hero .slide.leaving::before{animation:kenburns 7s linear both}
@media(min-width:769px){.hero .slide[data-img]::before{background-position:right 18%;
  background-image:linear-gradient(90deg,rgba(18,44,115,.9) 0%,rgba(18,44,115,.6) 42%,rgba(18,44,115,0) 68%),var(--bg)}}
.hero .slide .container{position:relative;z-index:1}
.hero .slide.active .slide-copy>*{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.hero .slide.active .slide-copy>:nth-child(1){animation-delay:.3s}
.hero .slide.active .slide-copy>:nth-child(2){animation-delay:.45s}
.hero .slide.active .slide-copy>:nth-child(3){animation-delay:.6s}
.hero.paused .slide.active::before,.hero.paused .dots button.active:before{animation-play-state:paused}
.dots{z-index:3}
.dots button:before{content:"";position:absolute;left:12px;right:12px;top:10px;height:4px;border-radius:4px;background:#fff;transform:scaleX(0);transform-origin:left;z-index:1}
.dots button.active:after{background:rgba(255,255,255,.4)}
.dots button.active:before{animation:dotfill 6s linear forwards}
@keyframes kenburns{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(0,0,0) scale(1.06)}}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes dotfill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.hero .slide.active::before,.hero .slide.leaving::before,.hero .slide.active .slide-copy>*{animation:none}.dots button.active:before{animation:none;transform:scaleX(1)}}

/* hover/focus contrast fixes: a:hover must never override button text colours */
.btn-outline-dark:hover,.btn-outline-dark:focus-visible{background:#fff;border-color:#fff;color:var(--royal-dark)}
a.btn-primary:hover,a.btn-primary:focus-visible,a.btn-accent:hover,a.btn-accent:focus-visible{color:#fff}
a.btn-ok:hover{color:#0F6B3E;background:#d3eedf}a.btn-danger:hover{color:#9A2E2E;background:#f6d9d9}
a.btn:not(.btn-primary):not(.btn-accent):not(.btn-outline-dark):not(.btn-ok):not(.btn-danger):hover{background:var(--royal-tint);border-color:var(--royal);color:var(--royal-dark)}
.chip:hover{color:var(--royal-dark)}
.hero .chip:hover{background:#fff;color:var(--royal-dark)}
.btn{transition:background .2s,color .2s,border-color .2s,transform .2s}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible,.chip:focus-visible,.dots button:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}

/* stat cards: hover colour change + lift */
/* cards: see "premium cards" rules below */


.stat .num,.stat .muted{transition:color .25s}
.stat .num{font-variant-numeric:tabular-nums}

/* index: stock-photo cards, about split, photo CTA */
.card-img{padding:0;overflow:hidden;display:flex;flex-direction:column;color:inherit;transition:transform .25s,box-shadow .25s,border-color .25s}
.card-img:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(20,22,28,.12);border-color:var(--royal);color:inherit}
.card-photo{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--royal-tint)}
.card-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.card-img:hover .card-photo img{transform:scale(1.07)}
.card-photo .badge{position:absolute;left:12px;top:12px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.card-body{padding:18px;display:flex;flex-direction:column;gap:6px;flex:1}
.card-body h3{margin:0}.card-body p{margin:0}
.card-body .more{margin-top:auto;padding-top:10px;font-weight:600;color:var(--royal)}
.split{display:grid;gap:24px;align-items:center}
.split-img{border-radius:14px;overflow:hidden;aspect-ratio:3/2;box-shadow:0 10px 30px rgba(20,22,28,.12)}
.split-img img{width:100%;height:100%;object-fit:cover;display:block}
@media(min-width:769px){.split{grid-template-columns:1fr 1fr;gap:48px}}
.cta-photo{position:relative;overflow:hidden;color:#fff;background:linear-gradient(90deg,rgba(18,44,115,.9),rgba(18,44,115,.45)),var(--cta) center/cover;border:0}
.cta-photo h3,.cta-photo p{color:#fff}
.cta-photo .btn-primary{background:#fff;color:var(--royal-dark);border-color:#fff}
.cta-photo .btn-primary:hover,.cta-photo a.btn-primary:hover{background:var(--green);border-color:var(--green);color:#fff}

/* inner-page photo hero */
.page-hero{position:relative;color:#fff;padding:36px 0 40px;background:linear-gradient(90deg,rgba(18,44,115,.93) 0%,rgba(18,44,115,.78) 55%,rgba(18,44,115,.45) 100%),var(--ph) center/cover;overflow:hidden}
.page-hero h1{color:#fff;margin:10px 0 8px;font-size:30px;max-width:760px}
.page-hero .lead{color:#E3EAFB;max-width:680px;margin:0 0 4px}
.page-hero .crumbs,.page-hero .crumbs a{color:#C9D6F5;margin-bottom:6px}
.page-hero .crumbs a:hover{color:#fff}
.page-hero .slide-actions{margin-top:18px}
.page-hero .badge-royal{background:rgba(255,255,255,.18);color:#fff}
.page-hero .container>*{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.page-hero .container>:nth-child(2){animation-delay:.1s}.page-hero .container>:nth-child(3){animation-delay:.2s}.page-hero .container>:nth-child(4){animation-delay:.3s}
@media(min-width:769px){.page-hero{padding:64px 0 68px}.page-hero h1{font-size:40px}}
@media(prefers-reduced-motion:reduce){.page-hero .container>*{animation:none}}
.auth-left{background:linear-gradient(135deg,rgba(7,14,38,.88) 0%,rgba(12,28,78,.82) 55%,rgba(18,44,115,.74) 100%),var(--auth-img,none) center/cover}
.thumb-card{display:block;border-radius:12px;overflow:hidden;background:#fff;border:1px solid var(--border);color:inherit;transition:transform .25s,box-shadow .25s,border-color .25s}
.thumb-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,22,28,.12);border-color:var(--royal);color:inherit}
.thumb-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.thumb-card .tc-body{padding:14px 16px}
.side-photo{width:100%;border-radius:12px;aspect-ratio:4/3;object-fit:cover;display:block;margin-bottom:14px}

/* container.section must keep vertical padding (.container resets padding shorthand) */
.container.section{padding-top:32px;padding-bottom:32px}
@media(min-width:769px){.container.section{padding-top:48px;padding-bottom:48px}}

/* services: icon cards, 1 col phone / 2 col tablet / 4 col desktop */
.svc-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:481px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1025px){.svc-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}}
.svc-card{display:flex;flex-direction:column;gap:8px;color:var(--ink);min-width:0}
.svc-card h3{margin:6px 0 0;font-size:18px;overflow-wrap:anywhere}
.svc-card p{margin:0;font-size:14px;color:var(--ink-soft);flex:1}
.svc-icon{width:56px;height:56px;border-radius:14px;background:var(--royal-tint);color:var(--royal);display:flex;align-items:center;justify-content:center;transition:background .25s,color .25s,transform .25s}
.svc-meta{margin-top:8px;font-size:13px;font-weight:600;color:var(--royal);display:flex;align-items:center;gap:6px}
.svc-card:hover{color:var(--ink)}
.svc-card:hover .svc-icon{background:var(--royal);color:#fff;transform:scale(1.06)}
.svc-card:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}

/* .section (769+) shorthand was zeroing .container side padding on tablets */
@media(min-width:769px){.container.section{padding-left:24px;padding-right:24px}}
@media(min-width:1025px){.container.section{padding-left:32px;padding-right:32px}}

/* service detail: equal-height cards with icon headers */
.grid.equal{align-items:stretch}
.grid.equal>.card{margin-bottom:0}
.info-card{display:flex;flex-direction:column;gap:14px;height:100%}
.ic-head{display:flex;align-items:center;gap:12px}
.ic-head h3{margin:0}
.ic{width:46px;height:46px;border-radius:12px;background:var(--royal-tint);color:var(--royal);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.card-link{margin-top:auto;font-weight:600;padding-top:6px}
.card-push{margin-top:auto}
.big-val{font:700 22px 'Spectral',serif}
.mini-steps .pstep{padding:9px 0;align-items:center}
.info-card .list-check{flex:0 0 auto}

.grid.equal{margin-bottom:20px}

/* FAQ page: banner + centered title + bordered accordion cards with +/- box (as on masstaxway.org/faq.html) */
.page-hero--center{background:linear-gradient(rgba(10,22,40,.55),rgba(10,22,40,.62)),var(--ph) center/cover;text-align:center;padding:56px 0}
.page-hero--center h1{margin:0 auto 8px;font-size:38px;text-transform:lowercase}
.page-hero--center .crumbs{margin:0 0 8px}
.page-hero--center .crumbs a:after{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#fff;margin:0 10px 2px}
.page-hero--center .crumbs{font-size:17px;color:#fff}
.page-hero--center .crumbs{font-size:0}.page-hero--center .crumbs a,.page-hero--center .crumbs{font-size:17px}
@media(min-width:769px){.page-hero--center{padding:84px 0}.page-hero--center h1{font-size:46px}}
.faq-area{padding:44px 0 56px}
.sec-title.center{text-align:center;margin-bottom:28px}
.sec-title span{display:block;color:var(--royal);font-weight:600;font-size:14px;margin-bottom:6px}
.sec-title h2{font-size:28px;margin:0;font-weight:700}
@media(min-width:769px){.faq-area{padding:64px 0 76px}.sec-title h2{font-size:38px}}
.faq-acc{display:flex;flex-direction:column;gap:16px}
.faq-item{background:#fff;border:1px solid var(--border-strong);border-radius:10px;transition:box-shadow .25s,border-color .25s}
.faq-item[open]{border-color:var(--royal);box-shadow:0 6px 18px rgba(27,63,160,.08)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;padding:16px 18px;min-height:64px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-ico{position:relative;width:40px;height:40px;border-radius:6px;background:#EEF0F4;flex-shrink:0;transition:background .25s}
.faq-ico:before,.faq-ico:after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:var(--ink);transform:translate(-50%,-50%);transition:transform .25s,background .25s}
.faq-ico:after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-item[open] .faq-ico{background:var(--royal)}
.faq-item[open] .faq-ico:before,.faq-item[open] .faq-ico:after{background:#fff}
.faq-item[open] .faq-ico:after{transform:translate(-50%,-50%) rotate(0)}
.faq-q{font-size:17px;font-weight:500;color:var(--ink);line-height:1.4}
.faq-item[open] .faq-q{color:var(--royal-dark)}
.faq-a{padding:0 18px 20px 76px;color:var(--ink-soft);font-size:15px;line-height:1.7;animation:faqin .3s ease}
.faq-a p{margin:0}
@keyframes faqin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media(max-width:480px){.faq-item summary{gap:12px;padding:14px}.faq-a{padding:0 16px 18px 16px}.faq-q{font-size:16px}}

.page-hero--center h1{font-family:'Public Sans',system-ui,sans-serif;font-weight:700}
.hero-crumbs{list-style:none;margin:0;padding:0;display:flex;justify-content:center;gap:0;font-size:17px;color:#fff}
.hero-crumbs li{position:relative;margin:0 10px}
.hero-crumbs li:not(:last-child):after{content:"";position:absolute;right:-15px;top:50%;width:5px;height:5px;margin-top:-2px;border-radius:50%;background:#fff}
.hero-crumbs a{color:#fff}.hero-crumbs a:hover{color:#BFD2FF}
.faq-area .sec-title h2{font-family:'Public Sans',system-ui,sans-serif;font-weight:700}

/* contact: equal-width action buttons; WhatsApp in official green with reversed hover */
.btn-row{display:flex;gap:12px;flex-wrap:wrap}
.btn-row .btn{flex:1 1 180px;min-width:0}
.btn-wa{background:#25D366;border-color:#25D366;color:#fff}
.btn-wa:hover,a.btn-wa:hover,.btn-wa:focus-visible{background:#fff;border-color:#25D366;color:#25D366}

/* .section shorthand had zeroed .container side padding on phones: restore at every width */
.container.section{padding-left:16px;padding-right:16px}
@media(min-width:481px){.container.section{padding-left:24px;padding-right:24px}}
/* appointment page: right column fills the same height as the form */
.appt-wrap{max-width:1040px}
.appt-grid>.card,.appt-aside{min-width:0}
.appt-aside{display:flex;flex-direction:column;gap:16px}
.appt-aside .side-photo{width:100%;height:220px;aspect-ratio:auto;object-fit:cover;border-radius:12px;margin:0}
.appt-aside .card{margin:0}
@media(min-width:769px){
  .appt-aside .side-photo{flex:1 1 auto;height:auto;min-height:220px}
  .appt-aside .card{flex:0 0 auto}
}
@media(max-width:480px){.appt-grid .card{padding:16px}}

/* appointment: info column on the left, form on the right (desktop); form stays first on phones */
@media(min-width:769px){.appt-aside{order:-1}}
@media(max-width:768px){.appt-aside{order:2}.appt-grid>form{order:1}}

/* ===== book-appointment: professional two-column layout ===== */
.appt-wrap{max-width:1120px}
.appt-grid{display:grid;gap:22px;grid-template-columns:1fr;align-items:stretch}
@media(min-width:900px){.appt-grid{grid-template-columns:5fr 6fr;gap:28px}.appt-aside{order:-1}}
@media(max-width:899px){.appt-aside{order:2}.appt-form{order:1}}
.appt-form{background:#fff;border:1px solid var(--border);border-top:4px solid var(--royal);border-radius:16px;padding:22px 18px;box-shadow:0 10px 30px rgba(20,22,28,.07);min-width:0}
@media(min-width:481px){.appt-form{padding:30px 30px 26px}}
.appt-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--border)}
.appt-head h2{margin:0 0 2px;font-size:22px}.appt-head p{margin:0;font-size:14px;color:var(--ink-soft)}
.ah-ico{width:48px;height:48px;border-radius:12px;background:var(--royal-tint);color:var(--royal);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.appt-form .frow{display:grid;grid-template-columns:1fr;gap:0 16px}
@media(min-width:600px){.appt-form .frow{grid-template-columns:1fr 1fr}}
.appt-form .label b{color:var(--red)}
.appt-form .label .opt{font-weight:400;color:var(--ink-soft)}
.appt-form .input,.appt-form .select,.appt-form .textarea{background:#FAFBFD;transition:border-color .2s,box-shadow .2s,background .2s}
.appt-form .input:hover,.appt-form .select:hover,.appt-form .textarea:hover{border-color:#9aa6c9}
.appt-form .input:focus,.appt-form .select:focus,.appt-form .textarea:focus{outline:0;background:#fff;border-color:var(--royal);box-shadow:0 0 0 4px rgba(27,63,160,.14)}
.btn-lg{min-height:52px;font-size:16px}
.appt-note{display:flex;align-items:center;gap:8px;margin:14px 0 0;font-size:13px;color:var(--ink-soft)}
.appt-note svg{width:16px;height:16px;flex-shrink:0;color:var(--green)}
.appt-aside{display:flex;flex-direction:column;gap:16px;min-width:0}
.appt-panel{position:relative;flex:1 1 auto;border-radius:16px;overflow:hidden;color:#fff;padding:26px 22px;background:linear-gradient(160deg,rgba(18,44,115,.94),rgba(27,63,160,.86)),var(--pimg) center/cover;box-shadow:0 10px 30px rgba(18,44,115,.22)}
@media(min-width:481px){.appt-panel{padding:32px 30px}}
.appt-panel h2{color:#fff;font-size:26px;margin:8px 0 20px}
.appt-kicker{display:inline-block;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);padding:4px 12px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.appt-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.appt-points li{display:flex;gap:14px;align-items:flex-start}
.appt-points .pi{width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.appt-points strong{display:block;font-size:16px;margin-bottom:2px}
.appt-points span:not(.pi){display:block;font-size:14px;color:#D7E0FA;line-height:1.5}
.appt-tiles{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:481px){.appt-tiles{grid-template-columns:1fr 1fr}}
.appt-tile{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px 16px;color:var(--ink);min-width:0;transition:transform .2s,box-shadow .2s,border-color .2s}
.appt-tile:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(20,22,28,.1);border-color:var(--royal);color:var(--ink)}
.appt-tile small{display:block;font-size:12px;color:var(--ink-soft)}
.appt-tile strong{display:block;font-size:15px;overflow-wrap:anywhere}
.ti{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ti-call{background:var(--royal-tint);color:var(--royal)}.ti-wa{background:#E7F9EE;color:#25D366}
.appt-panel{display:flex;flex-direction:column}
.appt-stats{margin-top:auto;padding-top:22px;display:flex;gap:32px;border-top:1px solid rgba(255,255,255,.22)}
.appt-points{margin-bottom:28px}
.appt-stats strong{display:block;font:700 28px 'Spectral',serif;color:#fff}
.appt-stats span{font-size:13px;color:#D7E0FA}

.appt-kicker{align-self:flex-start}

/* appointment info panel: solid blue-to-green gradient (no photo) */
.appt-panel{background:linear-gradient(145deg,#1B3FA0 0%,#14509A 45%,#1C8A57 100%)}
.appt-points span:not(.pi),.appt-stats span{color:rgba(255,255,255,.9)}
.appt-points .pi{background:rgba(255,255,255,.18)}

/* appointment info panel: blue-green gradient at 90% opacity (10% transparent) over the photo */
.appt-panel{background:linear-gradient(150deg,rgba(255,255,255,.93) 0%,rgba(255,255,255,.88) 100%),var(--pimg) center/cover;color:var(--ink);border:1px solid var(--border);border-top:4px solid var(--royal);box-shadow:0 10px 30px rgba(20,22,28,.08)}
/* translucent white panel (not the hero's royal blue) so it stands apart from the banner above it; dark text, royal-blue accents */
.appt-panel h2{color:var(--royal-dark)}
.appt-panel .appt-kicker{background:var(--royal-tint);border-color:rgba(27,63,160,.25);color:var(--royal)}
.appt-panel .appt-points .pi{background:var(--royal);color:#fff;box-shadow:0 4px 10px rgba(27,63,160,.25)}
.appt-panel .appt-points strong{color:var(--ink)}
.appt-panel .appt-points span:not(.pi),.appt-panel .appt-stats span{color:#434957}
.appt-panel .appt-stats{border-top-color:var(--border)}
.appt-panel .appt-stats strong{color:var(--royal)}

/* footer: standard compact link spacing on desktop; 44px touch targets kept on phones/tablets */
.footer h4{margin:0 0 10px}
.footer a{min-height:0;padding:5px 0;line-height:1.5}
.footer .grid a{font-size:14px}
@media(max-width:1024px){.footer a{min-height:44px;padding:0}}

/* footer bottom bar: credit on the left, legal links on the right */
.footer-bottom{margin-top:24px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:12px;font-size:13px;color:#9CA0AC}
.fb-left{display:flex;flex-direction:column;gap:4px}
.fb-credit strong{color:#fff;font-weight:600}
.fb-links{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px}
.fb-links a{font-size:13px}
.fb-links span{color:#5d6272}
@media(min-width:900px){.footer-bottom{flex-direction:row;justify-content:space-between;align-items:center}.fb-links{justify-content:flex-end;text-align:right}}

/* floating actions: identical 48px buttons on one baseline - WhatsApp bottom-left, Call + To-Top bottom-right */
:root{--fab:48px;--fab-x:20px;--fab-y:24px}
.wa-float{width:var(--fab);height:var(--fab);left:var(--fab-x);bottom:calc(var(--fab-y) + env(safe-area-inset-bottom))}
.floaters{right:var(--fab-x);bottom:calc(var(--fab-y) + env(safe-area-inset-bottom));gap:12px;flex-direction:column-reverse;align-items:center}
.fab{width:var(--fab);height:var(--fab);flex:0 0 var(--fab);font-size:0;transition:transform .2s,background .2s,opacity .2s}
.fab:hover{transform:translateY(-2px)}
.fab-call{background:var(--royal)}.fab-call:hover{background:var(--royal-dark);color:#fff}
.fab-top{background:var(--ink);color:#fff;position:absolute;right:0;bottom:calc(var(--fab) + 12px)}
.fab-top.show{opacity:1}
.fab svg{display:block}
@media(max-width:480px){:root{--fab-x:14px;--fab-y:18px}}

/* Call button stacked directly above WhatsApp (bottom-left); To Top alone at bottom-right */
.fab-call{position:fixed;left:var(--fab-x);bottom:calc(var(--fab-y) + var(--fab) + 14px + env(safe-area-inset-bottom))}
.fab-top{position:fixed;right:var(--fab-x);bottom:calc(var(--fab-y) + env(safe-area-inset-bottom))}

.fab-top{background:var(--royal);color:#fff}.fab-top:hover{background:var(--royal-dark);color:#fff}

/* header logo: full MASS Taxway Services lockup */
.logo-brand{padding:6px 0}
.logo-full{height:44px;width:auto;display:block;max-width:60vw}
@media(max-width:480px){.logo-full{height:38px}}
.logo-full{height:50px}
@media(max-width:480px){.logo-full{height:42px}}

/* bottom-left stack: WhatsApp on top, Call at the bottom */
.fab-call{bottom:calc(var(--fab-y) + env(safe-area-inset-bottom))}
.wa-float{bottom:calc(var(--fab-y) + var(--fab) + 30px + env(safe-area-inset-bottom))}   /* gap > the WhatsApp pulse ring (grows ~22px) so it never touches the call button */

/* call button: same pulsing wave as WhatsApp, in royal blue */
/* call button: static, no pulse animation */

/* service page: full-width "Continue to Apply" card with gradient + soft decorative shapes */
.apply-card{position:relative;overflow:hidden;margin-top:24px;border-radius:18px;padding:28px 22px;color:#fff;display:flex;flex-direction:column;gap:20px;
  background:linear-gradient(135deg,#1B3FA0 0%,#14509A 50%,#1C8A57 100%);box-shadow:0 14px 34px rgba(18,44,115,.22)}
.apply-card:before,.apply-card:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.08);pointer-events:none}
.apply-card:before{width:260px;height:260px;right:-70px;top:-110px}
.apply-card:after{width:180px;height:180px;left:38%;bottom:-120px;background:rgba(255,255,255,.06)}
.apply-card>*{position:relative;z-index:1}
.ac-kicker{display:inline-block;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);padding:3px 12px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.apply-card h3{color:#fff;font-size:24px;margin:10px 0 6px}
.apply-card p{margin:0;color:rgba(255,255,255,.9);max-width:620px}
.ac-actions{display:flex;flex-direction:column;gap:12px}
.apply-card .btn-accent{background:#fff;border-color:#fff;color:var(--royal-dark)}
.apply-card .btn-accent:hover,.apply-card a.btn-accent:hover{background:var(--green);border-color:var(--green);color:#fff}
@media(min-width:600px){.ac-actions{flex-direction:row;flex-wrap:wrap}}
@media(min-width:900px){.apply-card{flex-direction:row;align-items:center;justify-content:space-between;padding:36px 40px}.ac-actions{flex-shrink:0;justify-content:flex-end}.apply-card h3{font-size:28px}}

/* apply card: light gradient + coloured border (no dark colours) */
.apply-card{background:linear-gradient(135deg,#EAEFFB 0%,#F2F7F8 50%,#E4F5EC 100%);color:var(--ink);border:2px solid var(--royal);box-shadow:0 8px 24px rgba(27,63,160,.10)}
.apply-card:before{background:rgba(27,63,160,.07)}
.apply-card:after{background:rgba(28,138,87,.09)}
.apply-card:hover{border-color:var(--green)}
.apply-card h3{color:var(--royal-dark)}
.apply-card p{color:var(--ink-soft)}
.ac-kicker{background:#fff;border:1px solid var(--royal);color:var(--royal)}
.apply-card .btn-accent{background:var(--green);border-color:var(--green);color:#fff}
.apply-card .btn-accent:hover,.apply-card a.btn-accent:hover{background:#156E45;border-color:#156E45;color:#fff}
.apply-card .btn-outline-dark{background:#fff;color:var(--royal);border-color:var(--royal)}
.apply-card .btn-outline-dark:hover,.apply-card a.btn-outline-dark:hover{background:var(--royal);color:#fff;border-color:var(--royal)}

/* login: header logo on a white tile so the black wordmark is readable on the blue panel */
.auth-logo{align-self:flex-start;display:inline-flex;background:#fff;border-radius:12px;padding:8px 14px;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.auth-logo img{height:50px;width:auto;display:block}
@media(max-width:480px){.auth-logo img{height:42px}}

.auth-left .auth-logo{margin-bottom:18px}
@media(min-width:769px){.auth-left .auth-logo{margin-bottom:0}}

/* ===== logos everywhere ===== */
.footer-logo{display:inline-flex;background:#fff;border-radius:12px;padding:8px 14px;margin-bottom:12px;min-height:0!important}
.footer-logo img{height:46px;width:auto;display:block}
.sidebar .sb-logo{display:inline-flex;align-self:flex-start;background:#fff;border-radius:10px;padding:6px 10px}
.sidebar .sb-logo img{height:40px;width:auto;display:block}
.sb-head{align-items:center}
.t-logo{display:flex;align-items:center;flex-shrink:0}
.t-logo img{height:34px;width:auto;display:block}
@media(min-width:1025px){.t-logo{display:none}}
@media(max-width:599px){.topbar .t-title{display:none}}

/* ===== Tools dropdown (compact list) ===== */
.dd-list{list-style:none;margin:0;padding:0}
.dd-list li a{display:flex;align-items:center;gap:10px;min-height:44px;font-size:15px;color:var(--ink-soft)}
.dd-list li a:hover{color:var(--royal)}
.dd-ic{width:30px;height:30px;border-radius:8px;background:var(--royal-tint);color:var(--royal);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.dd-list .dd-all{font-weight:600;color:var(--royal);padding-left:0}
@media(min-width:1025px){
  .dd.dd-sm{width:270px;left:-12px;padding:10px 12px}
  .dd-list li a{min-height:40px;padding:0 8px;border-radius:8px}
  .dd-list li a:hover{background:var(--royal-tint)}
}

/* ===== calculators ===== */
.calc-grid{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:900px){.calc-grid{grid-template-columns:1fr 1fr;gap:28px;align-items:stretch}}
.calc-card,.calc-result{background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px;box-shadow:0 8px 24px rgba(20,22,28,.06);min-width:0}
.calc-card{border-top:4px solid var(--royal)}.calc-result{border-top:4px solid var(--green)}
.calc-card h2,.calc-result h2{font-size:20px;margin:0 0 16px}
.frow2{display:grid;grid-template-columns:2fr 1fr;gap:14px}
.cr-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--border);font-size:15px}
.cr-row:last-child{border-bottom:0}
.cr-row.sub{padding-left:14px;font-size:14px;color:var(--ink-soft)}
.cr-row.big{font-size:18px;color:var(--royal-dark)}.cr-row.big strong{font:700 22px 'Spectral',serif}
.cr-bar{height:12px;border-radius:999px;background:var(--green);margin-top:18px;overflow:hidden}
.cr-bar span{display:block;height:100%;background:var(--royal)}
.cr-legend{display:flex;gap:18px;margin-top:8px;font-size:13px;color:var(--ink-soft)}
.cr-legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}.cr-legend .d1{background:var(--royal)}.cr-legend .d2{background:var(--green)}
.cr-reg{border:1px solid var(--border);border-radius:12px;padding:6px 16px 8px;margin-bottom:14px}
.cr-reg.win{border-color:var(--green);background:#F6FCF9}
.cr-reg h3{font-size:17px;margin:10px 0 4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cr-note{margin:4px 0 0;padding:12px 14px;background:var(--royal-tint);border-radius:10px;font-size:14px;color:var(--royal-dark)}
.field>span.label,.field>.label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}
.dd-list .dd-all{padding:0 8px!important}

/* ===== profile dropdown in portal top bar ===== */
.avatar-img{border-radius:50%;object-fit:cover;display:block;flex-shrink:0;border:2px solid var(--royal-tint)}
.profile-menu{position:relative}
.pm-btn{display:flex;align-items:center;gap:8px;background:none;border:1px solid transparent;border-radius:999px;padding:3px 8px 3px 3px;cursor:pointer;font:inherit;color:var(--ink);min-height:44px;transition:background .2s,border-color .2s}
.pm-btn:hover,.profile-menu.open .pm-btn{background:var(--royal-tint);border-color:var(--border)}
.pm-name{font-size:14px;font-weight:600;display:none}
.pm-caret{font-size:12px;color:var(--ink-soft)}
@media(min-width:600px){.pm-name{display:inline}}
.pm-panel{display:none;position:absolute;right:0;top:calc(100% + 8px);width:270px;max-width:calc(100vw - 24px);background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 14px 36px rgba(20,22,28,.18);padding:8px;z-index:90}
.profile-menu.open .pm-panel{display:block;animation:pmin .18s ease}
@keyframes pmin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.pm-head{display:flex;align-items:center;gap:12px;padding:10px 10px 12px;border-bottom:1px solid var(--border);margin-bottom:6px}
.pm-head div{min-width:0}
.pm-head strong{display:block;font-size:15px}
.pm-head span{display:block;font-size:12px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pm-head em{display:inline-block;margin-top:4px;font-style:normal;font-size:11px;font-weight:600;background:var(--royal-tint);color:var(--royal-dark);padding:2px 8px;border-radius:999px}
.pm-panel a,.pm-logout{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:0 12px;border-radius:9px;font:500 15px 'Public Sans',sans-serif;color:var(--ink);background:none;border:0;cursor:pointer;text-align:left}
.pm-panel a:hover,.pm-logout:hover{background:var(--royal-tint);color:var(--royal-dark)}
.pm-logout{color:#9A2E2E;margin-top:4px;border-top:1px solid var(--border);border-radius:0 0 9px 9px}
.pm-logout:hover{background:var(--red-tint);color:#9A2E2E}
.pm-panel svg{flex-shrink:0;color:var(--ink-soft)}
.pm-logout svg{color:#9A2E2E}
/* account pages */
.acct-card{background:#fff;border:1px solid var(--border);border-top:4px solid var(--royal);border-radius:16px;padding:22px;box-shadow:0 8px 24px rgba(20,22,28,.06);max-width:820px}
.acct-photo{display:flex;gap:18px;align-items:flex-start;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.frow2e{display:grid;grid-template-columns:1fr;gap:0 18px}
@media(min-width:700px){.frow2e{grid-template-columns:1fr 1fr}}
.opt{font-weight:400;color:var(--ink-soft)}
@media(max-width:480px){.acct-card{padding:16px}}

/* profile menu header: avatar must not inherit the text-line rules */
.pm-head div span{display:block;font-size:12px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pm-head>.avatar,.pm-head>.avatar-img{display:flex}
.pm-head span.avatar{display:flex;white-space:normal;overflow:visible;color:var(--royal-dark)}

/* ===== Georgia everywhere ===== */
:root{--font:Georgia,'Times New Roman',Times,serif}
html,body,*,*::before,*::after{font-family:var(--font)!important}
body{letter-spacing:0}
.btn,.input,.select,.textarea{font-family:var(--font)!important}

/* ===== Segoe UI everywhere (replaces Georgia) ===== */
:root{--font:'Segoe UI',-apple-system,BlinkMacSystemFont,'Helvetica Neue',Roboto,Arial,sans-serif}
html,body,*,*::before,*::after{font-family:var(--font)!important}
.btn,.input,.select,.textarea{font-family:var(--font)!important}

/* ===== Useful Links cards ===== */
.link-grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:600px){.link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1025px){.link-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}
.link-card{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--border);border-left:4px solid var(--lc,var(--royal));border-radius:12px;padding:16px;color:var(--ink);min-width:0;min-height:76px;transition:transform .2s,box-shadow .2s,border-color .2s}
.link-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,22,28,.1);border-color:var(--lc);color:var(--ink)}
.lc-ico{width:46px;height:46px;border-radius:12px;background:color-mix(in srgb,var(--lc) 12%,#fff);color:var(--lc);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;flex-shrink:0}
.lc-body{display:flex;flex-direction:column;min-width:0;flex:1}
.lc-body strong{font-size:15px;line-height:1.35;overflow-wrap:anywhere}
.lc-body small{font-size:12px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lc-go{color:var(--ink-soft);display:flex;transition:color .2s,transform .2s}
.link-card:hover .lc-go{color:var(--lc);transform:translate(2px,-2px)}
.link-card:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}
/* generic CMS pages (about, privacy, terms\2026) */
.prose{font-size:16px;line-height:1.75}
.prose h2{font-size:22px;margin:28px 0 8px;color:var(--royal-dark)}
.prose a{color:var(--royal);text-decoration:underline;text-underline-offset:3px}.prose a:hover{color:var(--royal-dark)}
.prose ul,.prose ol{padding-left:22px}.prose li{margin:6px 0}
.lc-ico{font-size:16px;letter-spacing:.02em}

/* ===== cookie consent bar + cookie settings page (blue buttons) ===== */
.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:200;background:#fff;border-top:3px solid var(--royal);box-shadow:0 -8px 28px rgba(20,22,28,.16);padding:16px;display:flex;flex-direction:column;gap:14px;max-height:80vh;overflow-y:auto}
.cookie-bar[hidden]{display:none}
.cb-text strong{display:block;font-size:16px;margin-bottom:4px;color:var(--ink)}
.cb-text span{font-size:14px;line-height:1.55;color:var(--ink-soft)}
.cb-text a{color:var(--royal);text-decoration:underline}
.cb-actions{display:flex;flex-direction:column;gap:10px}
.btn-ck{background:#fff;color:var(--royal);border:2px solid var(--royal);text-transform:uppercase;letter-spacing:.03em;font-size:13px;font-weight:700;min-height:46px;padding:10px 18px}
.btn-ck:hover,a.btn-ck:hover{background:var(--royal-tint);color:var(--royal-dark);border-color:var(--royal-dark)}
.btn-ck-solid,a.btn-ck-solid{background:var(--royal);color:#fff}
.btn-ck-solid:hover,a.btn-ck-solid:hover{background:var(--royal-dark);color:#fff;border-color:var(--royal-dark)}
@media(min-width:900px){.cookie-bar{flex-direction:row;align-items:center;justify-content:space-between;gap:28px;padding:18px 32px}.cb-text{flex:1}.cb-actions{flex-direction:row;flex-shrink:0}}
body.has-cookie-bar .wa-float,body.has-cookie-bar .fab-call,body.has-cookie-bar .fab-top{display:none}
.ck-h{font-size:22px;margin:30px 0 12px}
.ck-card{display:flex;gap:20px;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px 20px;margin-bottom:16px;flex-wrap:wrap}
.ck-text{flex:1 1 380px;min-width:0}.ck-text h3{font-size:17px;margin:0 0 6px}.ck-text p{margin:0 0 8px;font-size:15px;color:var(--ink-soft)}
.ck-switch{display:inline-flex;align-items:center;gap:10px;position:relative;cursor:pointer;font-size:14px;color:var(--ink);min-height:44px}
.ck-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;left:0;top:0}
.ck-switch i{width:52px;height:30px;border-radius:999px;background:#C9CDD8;position:relative;transition:background .2s;flex-shrink:0}
.ck-switch i:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .2s}
.ck-switch input:checked~i{background:var(--royal)}.ck-switch input:checked~i:after{transform:translateX(22px)}
.ck-switch input:focus-visible~i{outline:3px solid #7FB0FF;outline-offset:2px}
.ck-locked{cursor:not-allowed}.ck-locked input{cursor:not-allowed}.ck-locked i{opacity:.75}.ck-locked .ck-state{font-weight:600;color:var(--royal-dark)}
.ck-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.ck-saved{margin:14px 0 0;padding:12px 16px;background:var(--green-tint);color:#0F6B3E;border-radius:10px;font-weight:600}
.ck-saved[hidden]{display:none}
code{background:#EEF0F4;padding:1px 6px;border-radius:5px;font-size:.9em;font-family:Consolas,monospace!important}

/* white-text logo sits directly on dark backgrounds (no tile) */
.footer-logo{background:none;padding:0;border-radius:0;box-shadow:none}
.footer-logo img{height:52px}
.sidebar .sb-logo.sb-logo-dark{background:none;padding:0 4px;border-radius:0}
.sidebar .sb-logo.sb-logo-dark img{height:44px}

/* login: white logo sits directly on the blue panel (no tile) */
.auth-logo{background:none;box-shadow:none;padding:0;border-radius:0}
.auth-logo img{height:56px}
@media(max-width:480px){.auth-logo img{height:46px}}

.auth-logo img{filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}

/* footer: no empty band under the last (legal links) row */
.footer{padding-bottom:20px;margin-bottom:0}
.footer-bottom{padding-bottom:0}
body{margin-bottom:0}
/* on narrower screens the fixed WhatsApp/Call buttons would sit on top of the last row, so keep room for them there only */
@media(max-width:1199px){.footer{padding-bottom:124px}}

/* ===== premium cards: thin outline, soft outer shadow, 5px royal-blue accent inside the bottom edge ===== */
.stat,.svc-card,.hover-cards>.card{position:relative;overflow:hidden;background:#fff;border:1px solid #E3E6EE;border-radius:12px;box-shadow:0 2px 8px rgba(20,22,28,.06);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.stat{padding:16px 16px 21px}.svc-card{padding:22px 22px 27px}.hover-cards>.card{padding:18px 18px 23px}  /* room for the hover accent line */
.stat::after,.svc-card::after,.hover-cards>.card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;border-radius:0;background:var(--acc,#0b37af);opacity:0;transform:scaleX(.6);transition:opacity .3s ease,transform .3s ease;pointer-events:none}
.stat:hover,.svc-card:hover,.hover-cards>.card:hover{transform:translateY(-5px);border-color:#C3CCE8;box-shadow:0 12px 28px rgba(11,55,175,.14)}
.stat:hover::after,.svc-card:hover::after,.hover-cards>.card:hover::after,.svc-card:focus-visible::after{opacity:1;transform:scaleX(1)}
/* a different accent colour per card */
.stat,.svc-card,.hover-cards>.card{--acc:#0b37af}
.stat:nth-child(6n+2),.svc-card:nth-child(6n+2),.hover-cards>.card:nth-child(6n+2){--acc:#1C8A57}
.stat:nth-child(6n+3),.svc-card:nth-child(6n+3),.hover-cards>.card:nth-child(6n+3){--acc:#B9791E}
.stat:nth-child(6n+4),.svc-card:nth-child(6n+4),.hover-cards>.card:nth-child(6n+4){--acc:#7A3FA0}
.stat:nth-child(6n+5),.svc-card:nth-child(6n+5),.hover-cards>.card:nth-child(6n+5){--acc:#C33B3B}
.stat:nth-child(6n),.svc-card:nth-child(6n),.hover-cards>.card:nth-child(6n){--acc:#0F7C90}
.stat:hover,.svc-card:hover,.hover-cards>.card:hover{border-color:var(--acc)}
.svc-card:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}
@media(hover:none){.stat:hover,.svc-card:hover,.hover-cards>.card:hover{transform:none;box-shadow:0 2px 8px rgba(20,22,28,.06);border-color:#E3E6EE}}
@media(prefers-reduced-motion:reduce){.stat,.svc-card,.hover-cards>.card,.stat::after,.svc-card::after,.hover-cards>.card::after{transition:none}.stat:hover,.svc-card:hover,.hover-cards>.card:hover{transform:none}}

/* stat cards: icon on the left, number + label on the right; icon takes the card's accent colour */
.stat-ic{display:flex;align-items:center;gap:14px}
.st-ico{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--acc,#0b37af);background:color-mix(in srgb,var(--acc,#0b37af) 12%,#fff);transition:background .3s ease,color .3s ease,transform .3s ease}
.st-body{min-width:0}
.stat-ic:hover .st-ico{background:var(--acc,#0b37af);color:#fff}
@media(prefers-reduced-motion:reduce){.st-ico{transition:none}}

/* stat cards: soft accent-tinted border + matching faded icon tile; number sits directly beside the icon */
.stat-ic{border-color:color-mix(in srgb,var(--acc,#0b37af) 30%,#fff);padding:18px 18px 23px;gap:16px}
.stat-ic:hover{border-color:var(--acc)}
.st-ico{width:60px;height:60px;border-radius:14px;background:color-mix(in srgb,var(--acc,#0b37af) 14%,#fff)}
.st-ico svg{width:28px;height:28px}
.st-body{display:flex;flex-direction:column;justify-content:center;gap:2px}
.stat-ic .num{font-size:32px;line-height:1.1}
.stat-ic .muted{font-size:14px}

/* ===== shared "tinted card" system: faded accent border + faded icon tile, used project-wide ===== */
.svc-card,.hover-cards>.card,.info-card,.link-card{border-color:color-mix(in srgb,var(--acc,var(--lc,#0b37af)) 28%,#fff)}
.svc-card:hover,.hover-cards>.card:hover,.info-card:hover{border-color:var(--acc)}
.svc-icon,.ic{color:var(--acc,#0b37af);background:color-mix(in srgb,var(--acc,#0b37af) 14%,#fff)}
.svc-card:hover .svc-icon{background:var(--acc);color:#fff}
.hover-cards>.card:hover .st-ico,.info-card:hover .ic{background:var(--acc);color:#fff}
.ic-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.hover-cards>.card .st-ico{width:56px;height:56px;color:var(--acc,#0b37af);background:color-mix(in srgb,var(--acc,#0b37af) 14%,#fff)}
.hover-cards>.card .badge{background:color-mix(in srgb,var(--acc,#0b37af) 12%,#fff);color:var(--acc)}
.info-card{--acc:#0b37af;position:relative;overflow:hidden;box-shadow:0 2px 8px rgba(20,22,28,.06);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.info-card:nth-child(4n+2){--acc:#1C8A57}.info-card:nth-child(4n+3){--acc:#B9791E}.info-card:nth-child(4n+4){--acc:#7A3FA0}
.info-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--acc);opacity:0;transform:scaleX(.6);transition:opacity .3s ease,transform .3s ease;pointer-events:none}
.info-card:hover{transform:translateY(-5px);box-shadow:0 12px 28px rgba(11,55,175,.14)}
.info-card:hover::after{opacity:1;transform:scaleX(1)}
@media(hover:none){.info-card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.info-card,.info-card::after{transition:none}.info-card:hover{transform:none}}

/* ===== testimonials: slow, smooth right-to-left marquee ===== */
.t-marquee{overflow:hidden;padding:18px 0 22px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.t-track{display:flex;gap:20px;width:max-content;animation:t-move var(--dur,60s) linear infinite;will-change:transform}
.t-track>.card{flex:0 0 min(360px,82vw);margin:0;display:flex;flex-direction:column}
.t-track>.card p{flex:1}
.t-marquee:hover .t-track,.t-marquee:focus-within .t-track{animation-play-state:paused}
@keyframes t-move{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 10px))}}
@media(prefers-reduced-motion:reduce){.t-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.t-track{animation:none}.t-track>.card[aria-hidden="true"]{display:none}}

/* testimonials page: equal-height cards, text fills so the bottom accent sits level */
.hover-cards>.card.card-flat{display:flex;flex-direction:column}.hover-cards>.card.card-flat p{flex:1}

/* login role tabs: icon above the label (stacked) so all three fit on a phone */
.roletab{flex-direction:column;gap:2px;padding:8px 4px;min-height:58px;font-size:13px}
.roletab .rt-ico{display:flex;color:var(--ink-soft);transition:color .2s}
.roletab.active .rt-ico,.roletab:hover .rt-ico{color:var(--royal)}
.roletab:hover:not(.active){background:rgba(255,255,255,.6)}

/* login: "Back to website" as an outlined ghost button with a back arrow */
.btn-back{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:44px;padding:0 18px;border:1.5px solid rgba(255,255,255,.7);border-radius:8px;background:transparent;color:#fff;font-weight:600;font-size:14px;transition:background .25s ease,color .25s ease,border-color .25s ease}
.btn-back svg{transition:transform .25s ease}
.btn-back:hover,.btn-back:focus-visible{background:#fff;color:var(--royal-dark);border-color:#fff}
.btn-back:hover svg{transform:translateX(-3px)}
.btn-back:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.btn-back,.btn-back svg{transition:none}}
.calc-card,.calc-result{display:flex;flex-direction:column}
.calc-card form,.calc-card>*:last-child{margin-bottom:0}

/* "Need expert help?" band with the expert photo (transparent PNG) standing on the card's bottom edge */
.expert-band{position:relative;margin-top:28px;border:1px solid color-mix(in srgb,var(--royal) 28%,#fff);border-radius:16px;background:linear-gradient(135deg,#EAEFFB 0%,#F4F8FB 55%,#E4F5EC 100%);box-shadow:0 2px 8px rgba(20,22,28,.06);overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px 20px 0;text-align:center}
.expert-band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:linear-gradient(90deg,#0b37af,#1C8A57)}
.eb-img{width:150px;height:auto;display:block;margin-top:4px;order:3;position:relative;z-index:1;margin-bottom:5px}
.eb-kicker{display:inline-block;background:#fff;border:1px solid var(--royal);color:var(--royal);padding:3px 12px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.eb-text h3{margin:10px 0 6px;font-size:24px;color:var(--royal-dark)}.eb-text p{margin:0;color:var(--ink-soft);max-width:520px}
.eb-actions{display:flex;flex-direction:column;gap:10px;width:100%;max-width:320px}
.btn-eb{background:#fff;color:var(--royal);border-color:var(--royal)}
.btn-eb:hover,a.btn-eb:hover{background:var(--royal);color:#fff}
@media(min-width:900px){
  .expert-band{flex-direction:row;text-align:left;align-items:center;gap:32px;padding:0 40px 0 24px;min-height:210px}
  .eb-img{order:0;width:190px;margin:0 0 5px;align-self:flex-end}
  .eb-text{flex:1}.eb-text h3{font-size:28px}
  .eb-actions{width:auto;flex-shrink:0;max-width:none}
}

/* expert band v2: compact card, expert photo taller than the card (pops out of the top edge) */
.expert-band{overflow:visible;margin-top:96px;padding:0 20px 22px;gap:10px;min-height:0;border-radius:16px}
.expert-band::after{border-radius:0 0 15px 15px}
.eb-img{order:-1;width:150px;height:auto;margin:-72px 0 0;align-self:center;filter:drop-shadow(0 8px 10px rgba(20,22,28,.14));pointer-events:none}
.eb-text h3{margin:8px 0 4px;font-size:22px}
.eb-text p{font-size:14px}
@media(min-width:900px){
  .expert-band{margin-top:84px;flex-direction:row;align-items:center;text-align:left;gap:28px;min-height:124px;padding:18px 36px 22px 238px}
  .eb-img{position:absolute;left:28px;bottom:5px;order:0;width:190px;margin:0;align-self:auto}
  .eb-text{flex:1}.eb-text h3{font-size:24px}
  .eb-actions{flex-direction:row;gap:12px}
  .eb-actions .btn{min-height:46px;white-space:nowrap}
}
@media(min-width:900px) and (max-width:1100px){.eb-actions{flex-direction:column}}
/* accent line drawn as a background layer so it is clipped to the card's inner rounded edge (never outside the border) */
.expert-band{background:linear-gradient(90deg,#0b37af,#1C8A57) left bottom/100% 5px no-repeat,linear-gradient(135deg,#EAEFFB 0%,#F4F8FB 55%,#E4F5EC 100%)}
.expert-band::after{display:none}
.eb-img{bottom:5px}

/* testimonial author: round photo (cropped to the face) beside name + company */
.t-by{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:6px}
.t-photo{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 18%;flex-shrink:0;border:2px solid color-mix(in srgb,var(--acc,#0b37af) 35%,#fff);background:#fff}
.t-initials{display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--acc,#0b37af);background:color-mix(in srgb,var(--acc,#0b37af) 14%,#fff)}
.t-by strong{display:block;line-height:1.25}

/* testimonial photo = full circle where the icon tile used to be; small quote mark moves beside the stars */
.t-avatar{width:68px;height:68px;border-radius:50%;object-fit:cover;object-position:50% 20%;flex-shrink:0;border:3px solid #fff;box-shadow:0 0 0 2px var(--acc,#0b37af),0 4px 10px rgba(20,22,28,.15);background:#fff;transition:transform .3s ease}
.t-avatar.t-initials{display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;color:var(--acc,#0b37af);background:color-mix(in srgb,var(--acc,#0b37af) 14%,#fff)}
.hover-cards>.card:hover .t-avatar{transform:scale(1.05)}
.ic-row .t-quote{display:flex;color:color-mix(in srgb,var(--acc,#0b37af) 35%,#fff);margin-left:auto;margin-right:10px}
.ic-row .t-quote+.stars{margin-left:0}
.ic-row:has(.t-avatar){margin-bottom:10px}
@media(prefers-reduced-motion:reduce){.t-avatar{transition:none}}
.ic-row .t-quote svg{width:22px;height:22px}

/* ===== Our Clients: logo cards in a slow, smooth marquee ===== */
.sec-head{text-align:center;margin-bottom:22px}
.sec-kicker{display:block;color:var(--royal);font-weight:600;font-size:14px;margin-bottom:4px;letter-spacing:.04em;text-transform:uppercase}
.sec-head h2{margin:0;font-size:28px}
@media(min-width:769px){.sec-head h2{font-size:34px}}
.clients-sec{background:#fff;border-block:1px solid var(--border)}
.logo-marquee{overflow:hidden;padding:6px 0 10px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logo-track{display:flex;gap:20px;width:max-content;animation:t-move var(--dur,40s) linear infinite;will-change:transform}
.logo-marquee:hover .logo-track{animation-play-state:paused}
.logo-item{flex:0 0 min(220px,56vw);height:104px;border:1px solid #E3E6EE;border-radius:12px;background:#fff;box-shadow:0 2px 8px rgba(20,22,28,.06);overflow:hidden;display:flex;align-items:center;justify-content:center;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.logo-item img{width:100%;height:100%;object-fit:contain;display:block;filter:grayscale(.55);transition:filter .3s ease,transform .3s ease}
.logo-item:hover{transform:translateY(-5px);border-color:#C3CCE8;box-shadow:0 12px 28px rgba(11,55,175,.14)}
.logo-item:hover img{filter:none;transform:scale(1.03)}
@media(hover:none){.logo-item:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.logo-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.logo-track{animation:none}.logo-item[aria-hidden="true"]{display:none}.logo-item,.logo-item img{transition:none}}

/* ===== Our Clients carousel: 5 logos at a time (3 tablet / 2 phone), arrows, auto-advance ===== */
.cc{position:relative;padding:0 52px}
.cc-viewport{overflow:hidden;padding:8px 2px 14px;margin:0 -2px}
.cc-track{display:flex;gap:16px;will-change:transform}
.cc-item{height:92px;border:1px solid #E3E6EE;border-radius:12px;background:#fff;box-shadow:0 2px 8px rgba(20,22,28,.06);overflow:hidden;display:flex;align-items:center;justify-content:center;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;user-select:none}
.cc-item img{width:100%;height:100%;object-fit:contain;display:block;filter:grayscale(.5);transition:filter .3s ease}
.cc-item:hover{transform:translateY(-4px);border-color:#C3CCE8;box-shadow:0 10px 24px rgba(11,55,175,.14)}
.cc-item:hover img{filter:none}
.cc-btn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid var(--border-strong);background:#fff;color:var(--royal);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(20,22,28,.12);transition:background .2s,color .2s,border-color .2s,transform .2s;z-index:2}
.cc-btn:hover{background:var(--royal);color:#fff;border-color:var(--royal)}
.cc-btn:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}
.cc-prev{left:0}.cc-next{right:0}
@media(max-width:699px){.cc{padding:0 40px}.cc-btn{width:36px;height:36px}.cc-item{height:80px}}
@media(hover:none){.cc-item:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.cc-track{transition:none!important}.cc-item,.cc-item img{transition:none}}

/* testimonial cards inside the carousel: natural height, equal within a row, content pinned top/bottom */
.cc-cards .cc-item{height:auto;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;overflow:hidden;padding:18px 18px 23px;margin:0;user-select:text}
.cc-cards .cc-item p{flex:1;margin:0 0 14px}
.cc-cards .cc-track{align-items:stretch}
.cc-cards .cc-viewport{padding:10px 2px 18px}
.cc-cards .cc-item:hover{transform:translateY(-5px)}
.cc-cards .cc-prev,.cc-cards .cc-next{top:calc(50% - 4px)}

/* logo-image rules must not touch the avatars inside testimonial cards */
.cc-cards .cc-item img.t-avatar{width:68px;height:68px;max-width:none;object-fit:cover;object-position:50% 20%;filter:none;flex-shrink:0}
.cc-cards .cc-item:hover img.t-avatar{filter:none}
.cc-cards .cc-item{height:auto}

/* testimonials carousel runs wider than the page container so each card keeps its earlier ~330px width */
.cc-wide{max-width:1520px;margin:0 auto;padding:0 8px}
.cc-cards{padding:0 56px}
.cc-cards .cc-prev{left:4px}.cc-cards .cc-next{right:4px}
.cc-cards .cc-item{padding:18px 18px 23px}
@media(max-width:699px){.cc-cards{padding:0 44px}}

/* ===== testimonial card: stars + quote mark on top, quote text, author footer (photo + name + company) ===== */
.t-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.t-top .stars{font-size:17px;letter-spacing:2px;color:#E0A100}
.t-top .t-quote{display:flex;color:color-mix(in srgb,var(--acc,#0b37af) 30%,#fff)}
.t-top .t-quote svg{width:34px;height:34px}
.hover-cards>.card p,.cc-cards .cc-item p{font-size:15px;line-height:1.65;color:var(--ink)}
.t-foot{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:14px;border-top:1px solid #E7E9F0}
.t-foot .t-avatar{width:52px;height:52px;border:2px solid #fff;box-shadow:0 0 0 2px var(--acc,#0b37af)}
.cc-cards .cc-item img.t-avatar{width:52px;height:52px}
.t-foot strong{display:block;font-size:15px;line-height:1.3;color:var(--ink)}
.t-foot .caption{font-size:13px;color:var(--ink-soft);margin-top:1px}
.hover-cards>.card:hover .t-foot .t-avatar{transform:none}

/* testimonial: big, clearly visible quote mark top-left, stars top-right; photo + name live in the footer only */
.t-top{flex-direction:row-reverse;margin-bottom:6px}
.t-top .t-quote{color:var(--acc,#0b37af);opacity:.85}
.t-top .t-quote svg{width:56px;height:56px}
.t-top .stars{font-size:18px}
.cc-cards .cc-item p,.hover-cards>.card .t-top+p{margin-top:0}

/* footer social icons */
.social{margin-top:14px}
.social-label{display:block;font-size:14px;font-weight:600;color:#fff;margin-bottom:10px}
.social-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.footer .social-btn{width:40px;height:40px;min-height:0;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;transition:background .25s ease,border-color .25s ease,transform .25s ease,color .25s ease}
.footer .social-btn:hover{transform:translateY(-3px);color:#fff;border-color:transparent}
.footer .social-facebook:hover{background:#1877F2}
.footer .social-instagram:hover{background:linear-gradient(45deg,#F9CE34,#EE2A7B 50%,#6228D7)}
.footer .social-youtube:hover{background:#FF0000}
.footer .social-twitter:hover{background:#1DA1F2}
.footer .social-linkedin:hover{background:#0A66C2}
.footer .social-btn:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.footer .social-btn{transition:none}.footer .social-btn:hover{transform:none}}

/* ===== HTML sitemap page ===== */
.sm-jump{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.sm-jump a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;background:var(--royal-tint);color:var(--royal-dark);font-size:14px;font-weight:600}
.sm-jump a:hover{background:var(--royal);color:#fff}
.sm-grid{display:grid;gap:18px;grid-template-columns:1fr}
@media(min-width:700px){.sm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1025px){.sm-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.sm-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sm-card{--acc:#0b37af;position:relative;overflow:hidden;background:#fff;border:1px solid color-mix(in srgb,var(--acc) 28%,#fff);border-radius:12px;padding:20px 20px 25px;box-shadow:0 2px 8px rgba(20,22,28,.06);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;scroll-margin-top:80px}
.sm-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--acc);opacity:0;transform:scaleX(.6);transition:opacity .3s ease,transform .3s ease}
.sm-card:hover{transform:translateY(-5px);border-color:var(--acc);box-shadow:0 12px 28px rgba(11,55,175,.14)}
.sm-card:hover::after{opacity:1;transform:scaleX(1)}
.sm-card h2,.sm-card h3{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-size:19px}
.sm-card h3{font-size:17px;color:var(--acc)}
.sm-ico{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--acc);background:color-mix(in srgb,var(--acc) 14%,#fff)}
.sm-card ul{list-style:none;margin:0;padding:0}
.sm-card li a{display:flex;align-items:center;gap:8px;min-height:38px;padding:4px 0;color:var(--ink);font-size:15px;border-bottom:1px dashed #E7E9F0}
.sm-card li:last-child a{border-bottom:0}
.sm-card li a::before{content:"\203A";color:var(--acc);font-weight:700}
.sm-card li a:hover{color:var(--acc);padding-left:4px}
.sm-card li a{transition:padding .2s ease,color .2s ease}
.sm-h{margin:34px 0 14px;font-size:24px;scroll-margin-top:80px}
@media(hover:none){.sm-card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.sm-card,.sm-card::after,.sm-card li a{transition:none}}

.sm-grid{align-items:start}

/* clickable dashboard stat cards */
.stat-link{color:inherit;cursor:pointer;text-decoration:none}
.stat-link:hover{color:inherit}
.stat-link .st-go{margin-left:auto;align-self:flex-end;font-size:12px;font-weight:600;color:var(--acc,#0b37af);opacity:0;transform:translateX(-4px);transition:opacity .25s ease,transform .25s ease;white-space:nowrap}
.stat-link:hover .st-go,.stat-link:focus-visible .st-go{opacity:1;transform:none}
.stat-link:focus-visible{outline:3px solid #7FB0FF;outline-offset:2px}
@media(hover:none){.stat-link .st-go{opacity:1;transform:none}}
.stat-links .stat .num{font-size:26px}
@media(prefers-reduced-motion:reduce){.stat-link .st-go{transition:none}}
.filter-notice{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--royal-tint);border:1px solid color-mix(in srgb,var(--royal) 30%,#fff);border-radius:10px;padding:10px 14px;margin:0 0 16px;font-size:14px;color:var(--royal-dark)}

/* logout confirmation dialog (centred card on desktop, bottom sheet on phones) */
.lo-overlay{position:fixed;inset:0;z-index:300;background:rgba(15,20,35,.55);display:flex;align-items:center;justify-content:center;padding:16px;animation:lo-fade .2s ease}
.lo-overlay[hidden]{display:none}
.lo-dialog{width:100%;max-width:400px;background:#fff;border-radius:16px;padding:28px 24px 22px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.35);border-top:5px solid #C33B3B;animation:lo-pop .25s cubic-bezier(.2,.8,.2,1);outline:none}
.lo-ico{width:60px;height:60px;border-radius:50%;background:var(--red-tint);color:#C33B3B;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.lo-dialog h2{font-size:20px;margin:0 0 8px;color:var(--ink)}
.lo-dialog p{margin:0 0 20px;color:var(--ink-soft);font-size:15px}
.lo-actions{display:flex;flex-direction:column-reverse;gap:10px}
.btn-lo-cancel{background:#fff;color:var(--royal);border:2px solid var(--royal);font-weight:700}
.btn-lo-cancel:hover{background:var(--royal-tint)}
.btn-lo-ok{background:#C33B3B;color:#fff;border:2px solid #C33B3B;font-weight:700}
.btn-lo-ok:hover{background:#9A2E2E;border-color:#9A2E2E;color:#fff}
@media(min-width:480px){.lo-actions{flex-direction:row}.lo-actions .btn{flex:1}}
@media(max-width:479px){.lo-overlay{align-items:flex-end;padding:0}.lo-dialog{max-width:none;border-radius:16px 16px 0 0;padding-bottom:calc(22px + env(safe-area-inset-bottom));animation:lo-sheet .25s ease}}
@keyframes lo-fade{from{opacity:0}to{opacity:1}}
@keyframes lo-pop{from{opacity:0;transform:scale(.94) translateY(8px)}to{opacity:1;transform:none}}
@keyframes lo-sheet{from{transform:translateY(100%)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.lo-overlay,.lo-dialog{animation:none}}

/* "Stay logged in": green outline */
.btn-lo-cancel{color:#0F6B3E;border-color:var(--green)}
.btn-lo-cancel:hover{background:var(--green-tint);color:#0F6B3E;border-color:#156E45}
.btn-lo-cancel:focus-visible{outline:3px solid #8FD9B0;outline-offset:2px}

/* ===== admin top-bar search ===== */
.tb-search{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--border);padding:10px 12px;display:none;align-items:center;gap:8px;box-shadow:0 8px 16px rgba(20,22,28,.08);z-index:35}
.tb-search.open{display:flex}
.tb-search svg{position:absolute;left:24px;color:var(--ink-soft);pointer-events:none}
.tb-search input{flex:1;min-width:0;height:44px;padding:0 14px 0 40px;border:1px solid var(--border-strong);border-radius:10px;background:#F7F8FB;font:15px var(--font);color:var(--ink)}
.tb-search input:focus{outline:0;background:#fff;border-color:var(--royal);box-shadow:0 0 0 4px rgba(27,63,160,.14)}
.tb-go{display:none}
.tb-search-toggle{width:44px;height:44px;border-radius:50%;border:1px solid transparent;background:none;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer}
.tb-search-toggle:hover{background:var(--royal-tint);color:var(--royal)}
.topbar{position:sticky}
@media(min-width:769px){
  .tb-search{position:static;display:flex;flex:1;max-width:460px;margin:0 16px;padding:0;background:none;border:0;box-shadow:none;position:relative}
  .tb-search svg{left:14px}
  .tb-search input{height:42px;border-radius:999px;padding-left:42px}
  .tb-go{display:none}
  .tb-search-toggle{display:none}
}
.big-search{position:relative;display:flex;gap:10px;margin:0 0 20px;max-width:720px}
.big-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--ink-soft)}
.big-search .input{padding-left:42px}
.sr-grid{display:grid;gap:18px;grid-template-columns:1fr;align-items:start}
@media(min-width:1025px){.sr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.sr-card{--acc:#0b37af;position:relative;overflow:hidden;background:#fff;border:1px solid color-mix(in srgb,var(--acc) 28%,#fff);border-radius:12px;padding:18px 18px 23px;box-shadow:0 2px 8px rgba(20,22,28,.06)}
.sr-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--acc);opacity:.85}
.sr-card h2{font-size:18px;margin:0 0 8px;display:flex;align-items:center;gap:10px;color:var(--acc)}
.sr-count{background:color-mix(in srgb,var(--acc) 14%,#fff);color:var(--acc);border-radius:999px;font-size:12px;font-weight:700;padding:2px 9px}
.sr-card ul{list-style:none;margin:0;padding:0}
.sr-card li a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 6px;border-bottom:1px dashed #E7E9F0;color:var(--ink);min-height:52px;border-radius:8px;transition:background .2s}
.sr-card li:last-child a{border-bottom:0}
.sr-card li a:hover{background:color-mix(in srgb,var(--acc) 8%,#fff)}
.sr-main{display:flex;flex-direction:column;min-width:0}
.sr-main strong{font-size:15px;overflow-wrap:anywhere}.sr-main small{color:var(--ink-soft);font-size:13px;overflow-wrap:anywhere}

/* sidebar menu: icon + label */
.sidebar a.sl,.sidebar .sb-bottom button.sl{gap:12px}
.sl-ico{flex-shrink:0;opacity:.85;transition:opacity .2s,transform .2s}
.sidebar a.sl:hover .sl-ico{opacity:1;transform:translateX(1px)}
.sidebar a.sl.active .sl-ico{opacity:1;color:var(--royal)}
.admin-skin .sidebar a.sl.active .sl-ico,.staff-skin .sidebar a.sl.active .sl-ico{color:var(--royal)}
.sb-bottom button.sl{width:100%;text-align:left;background:none;border:0;cursor:pointer;color:#C6D1F2;font:500 15px var(--font);border-radius:8px;min-height:46px;padding:0 14px;display:flex;align-items:center}
.sb-bottom button.sl:hover{background:rgba(255,255,255,.08);color:#fff}
@media(prefers-reduced-motion:reduce){.sl-ico{transition:none}}
@media(min-width:769px){.tb-search{position:relative;top:auto;left:auto;right:auto}}

/* sidebar menu search */
.sb-search{position:sticky;top:-20px;z-index:2;display:flex;align-items:center;margin:0 0 8px;padding:8px 0 8px;background:inherit}
.sidebar{--sb-bg:var(--royal-dark)}.staff-skin .sidebar{--sb-bg:#1F2430}.admin-skin .sidebar{--sb-bg:#14161C}
.sb-search{background:var(--sb-bg)}
.sb-search svg{position:absolute;left:12px;color:#8DA0D6;pointer-events:none}
.sb-search input{width:100%;height:40px;padding:0 34px 0 36px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);color:#fff;font:14px var(--font)}
.sb-search input::placeholder{color:#9FB0DD;opacity:1}
.sb-search input:focus{outline:0;background:rgba(255,255,255,.12);border-color:#7FB0FF;box-shadow:0 0 0 3px rgba(127,176,255,.25)}
.sb-search input::-webkit-search-cancel-button{display:none}
.sb-clear{position:absolute;right:6px;width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:18px;line-height:1;cursor:pointer}
.sb-clear:hover{background:rgba(255,255,255,.22)}
.sb-nav{display:flex;flex-direction:column;gap:4px}
.sb-nav a.sl[hidden]{display:none}
.sb-empty{margin:8px 10px;font-size:13px;color:#9FB0DD}

/* serial-number column in CMS tables */
.sn{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:var(--royal-tint);color:var(--royal-dark);font-size:13px;font-weight:700}
@media(min-width:769px){.table.rt th:first-child{width:72px}}

/* table row actions: one tidy row of equal-size icon buttons, cell stays a real table cell */
.row-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.row-actions .inline-form{display:inline-flex;margin:0}
.row-actions .btn{margin:0;gap:6px}
.btn-edit{background:#fff;color:var(--royal);border-color:color-mix(in srgb,var(--royal) 35%,#fff)}
.btn-edit:hover,a.btn-edit:hover{background:var(--royal);color:#fff;border-color:var(--royal)}
.btn-del{background:var(--red-tint);color:#9A2E2E;border-color:color-mix(in srgb,var(--red) 40%,#fff)}
.btn-del:hover{background:var(--red);color:#fff;border-color:var(--red)}
@media(min-width:769px){
  .table td.actions{display:table-cell;white-space:nowrap}
  .table td.actions .row-actions{flex-wrap:nowrap}
}
@media(hover:hover) and (min-width:769px){.row-actions .btn{min-height:38px;padding:6px 14px}}
@media(max-width:768px){.table td.actions .row-actions{width:100%}.table td.actions .row-actions>*{flex:1}.table td.actions .row-actions .btn,.table td.actions .row-actions .inline-form{width:100%;justify-content:center}}

/* desktop tables: the last cell (Actions) was losing its row divider because the phone-card rule `td:last-child{border-bottom:0}` out-ranked it */
@media(min-width:769px){
  .table td:last-child{border-bottom:1px solid var(--border)}
  .table tbody tr:last-child td{border-bottom:0}
  .table td.actions{vertical-align:middle}
}

/* ===== toast messages: fixed, floating, auto-dismiss; they no longer take space above the hero ===== */
.toast-wrap{position:fixed;top:76px;left:50%;transform:translateX(-50%);z-index:250;display:flex;flex-direction:column;gap:10px;width:min(92vw,460px);pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--border);border-left:5px solid var(--royal);border-radius:10px;padding:12px 12px 12px 14px;box-shadow:0 12px 30px rgba(20,22,28,.2);font-size:14px;color:var(--ink);animation:toast-in .35s cubic-bezier(.2,.8,.2,1)}
.toast.out{opacity:0;transform:translateY(-8px);transition:opacity .3s,transform .3s}
.toast-success{border-left-color:var(--green)}.toast-error{border-left-color:var(--red)}.toast-info{border-left-color:var(--royal)}
.toast-ico{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:13px;font-weight:700;color:#fff;background:var(--royal)}
.toast-success .toast-ico{background:var(--green)}.toast-error .toast-ico{background:var(--red)}
.toast-msg{flex:1;line-height:1.4}
.toast-x{width:32px;height:32px;border:0;border-radius:50%;background:none;color:var(--ink-soft);font-size:20px;line-height:1;cursor:pointer;flex-shrink:0}
.toast-x:hover{background:#EEF0F4;color:var(--ink)}
@keyframes toast-in{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.toast{animation:none}.toast.out{transition:none}}
@media(print){.toast-wrap{display:none}}
@media(min-width:769px){.toast-wrap{left:auto;right:24px;transform:none;width:min(92vw,400px)}}

/* "I'm not a robot" checkbox: no outer frame; ticked = solid green box with white tick */
.human-check{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap;margin:4px 0 16px;padding:0;background:none;border:0}
.hc-box{position:relative;display:inline-flex;align-items:center;gap:12px;cursor:pointer;min-height:44px;font-weight:600;color:var(--ink,#1a2233)}
.hc-input{position:absolute;left:0;top:50%;width:24px;height:24px;margin:-12px 0 0;opacity:0;cursor:pointer}
.hc-tick{flex:0 0 24px;width:24px;height:24px;box-sizing:border-box;border:2px solid #8b97b1;border-radius:5px;background:#fff;position:relative;transition:background .2s,border-color .2s}
.hc-input:focus-visible+.hc-tick{outline:3px solid rgba(28,138,87,.4);outline-offset:2px}
.hc-input:checked+.hc-tick{background:#1C8A57;border-color:#1C8A57}
.hc-input:checked+.hc-tick:after{content:"";position:absolute;left:6px;top:1px;width:6px;height:12px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.is-busy .hc-input:checked+.hc-tick{background:#fff;border-color:#c9d1e3;border-top-color:#1C8A57;border-radius:50%;animation:hc-spin .8s linear infinite}
.is-busy .hc-input:checked+.hc-tick:after{display:none}
.is-ok .hc-input:checked+.hc-tick{animation:none;border-radius:5px;background:#1C8A57;border-color:#1C8A57}
.is-ok .hc-input:checked+.hc-tick:after{display:block}
.hc-state{font-size:13px;color:#5a6682}
.is-ok .hc-state{color:#1C8A57}.is-error .hc-tick{border-color:#C33B3B}.is-error .hc-state{color:#C33B3B}
.human-check--sm{margin:2px 0 6px}.human-check--sm .hc-box{min-height:36px;font-size:14px;color:#fff}
.human-check--sm .hc-tick{border-color:#a9b4cf;background:transparent}
.human-check--sm .hc-state{color:#c6d1f2}.human-check--sm.is-ok .hc-state{color:#7ee2ae}.human-check--sm.is-error .hc-state{color:#ff9d9d}
@keyframes hc-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.is-busy .hc-input:checked+.hc-tick{animation:none}}

/* footer newsletter: email + button share one row, "I'm not a robot" sits underneath, status text below that */
.news-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 12px;align-items:stretch;margin-top:14px;flex-direction:initial}
.news-form .input{grid-row:1;grid-column:1 / -1;width:100%;min-width:0;height:46px;margin:0}
.news-form .human-check{grid-row:2;grid-column:1;align-self:center;margin:0;gap:2px 12px}
.news-form .btn{grid-row:2;grid-column:2;align-self:center;height:44px;min-height:44px;padding:0 20px;white-space:nowrap}
.news-form .hc-state:empty{display:none}
.news-title{margin:14px 0 0;font-size:14px;font-weight:600;color:#fff}
.news-title+.news-form{margin-top:8px}
/* ---- Rich file upload control (upload.js) ---- */
.dz{position:relative;display:block;width:100%;min-width:0;border:2px dashed #b9c4de;border-radius:12px;background:#f8faff;transition:border-color .2s,background .2s,box-shadow .2s}
.dz:hover{border-color:var(--royal,#1B3FA0);background:#f2f6ff}
.dz.is-drag{border-color:#1C8A57;background:#eaf8f1;box-shadow:0 0 0 4px rgba(28,138,87,.12)}
.dz.is-focus{box-shadow:0 0 0 3px rgba(27,63,160,.3)}
.dz.has-file{border-style:solid;border-color:#bfe3cf;background:#f4fbf7}
.dz.is-bad{border-color:#C33B3B;background:#fff6f6}
.dz-input{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer;z-index:1;font-size:0}
.dz-idle,.dz-file{display:flex;align-items:center;gap:14px;padding:16px 18px;pointer-events:none}
.dz-ico{flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:#e4ebfb;color:var(--royal,#1B3FA0);display:flex;align-items:center;justify-content:center;transition:transform .2s,background .2s}
.dz:hover .dz-ico,.dz.is-drag .dz-ico{transform:translateY(-2px);background:#d5e1fa}
.dz.is-drag .dz-ico{background:#cdeedd;color:#1C8A57}
.dz-txt{display:flex;flex-direction:column;gap:2px;font-size:14px;color:var(--ink-soft,#5a6682);line-height:1.35}
.dz-txt strong{color:var(--royal,#1B3FA0);font-size:15px;display:inline}
.dz-txt .dz-or{display:inline}
.dz-txt small{display:block;font-size:12px;color:#7a869f;margin-top:2px}
.dz-file{pointer-events:none}
.dz-thumb{flex:0 0 48px;width:48px;height:48px;border-radius:10px;background:#e9eef9 center/cover no-repeat;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;letter-spacing:.03em;color:#fff}
.dz-thumb.is-doc{background:#6b7a99}
.dz-thumb.ext-pdf{background:#d64545}.dz-thumb.ext-doc,.dz-thumb.ext-docx{background:#2b6cd4}.dz-thumb.ext-xls,.dz-thumb.ext-xlsx{background:#1C8A57}
.dz-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.dz-name{font-size:14px;color:var(--ink,#1a2233);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dz-size{font-size:12px;color:#1C8A57;font-weight:600}
.dz-x{position:relative;z-index:2;pointer-events:auto;flex:0 0 32px;width:32px;height:32px;border:0;border-radius:50%;background:#fde4e4;color:#C33B3B;font-size:20px;line-height:1;cursor:pointer;transition:background .2s}
.dz-x:hover{background:#C33B3B;color:#fff}
.dz-err{padding:0 18px 12px;font-size:13px;color:#C33B3B;font-weight:600}
.dz-err[hidden],.dz-file[hidden],.dz-idle[hidden]{display:none}
.dz--compact .dz-idle,.dz--compact .dz-file{padding:8px 12px;gap:10px}
.dz--compact .dz-ico{flex-basis:32px;width:32px;height:32px}.dz--compact .dz-ico svg{width:18px;height:18px}
.dz--compact .dz-txt small,.dz--compact .dz-or{display:none}
.dz--compact .dz-thumb{flex-basis:34px;width:34px;height:34px;font-size:9px;border-radius:8px}
.dz--compact .dz-err{padding:0 12px 8px;font-size:12px}
@media(max-width:480px){.dz-idle,.dz-file{padding:14px}.dz-or{display:none!important}}
/* apply form: group of document drop zones */
.upload-box{border:1px solid var(--border,#e3e8f4);border-radius:14px;padding:18px;background:#fff}
.upload-box .field .label{font-weight:600;margin-bottom:6px}
@media(prefers-reduced-motion:reduce){.dz,.dz-ico{transition:none}}
.dz--compact{flex:1 1 220px}
.stat.stat-danger:nth-child(n){--acc:#C33B3B;border-color:#efc3c3;background:#fffafa}
.stat-grid.rep-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:900px){.stat-grid.rep-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1200px){.stat-grid.rep-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:480px){.stat-grid.rep-grid{grid-template-columns:minmax(0,1fr)}}
.stat-grid.rep-grid{gap:10px}
@media(min-width:900px) and (max-width:1499px){.stat-grid.rep-grid.six{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1500px){.stat-grid.rep-grid.six{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(min-width:1200px){.stat-grid.rep-grid.five{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(min-width:769px){
  .nowrap-table .table{font-size:13px}
  .nowrap-table .table th{font-size:11px;letter-spacing:.02em}
  .nowrap-table .table th,.nowrap-table .table td{white-space:nowrap;padding-left:7px;padding-right:7px}
  .nowrap-table .table td .btn-sm{padding:6px 10px;min-height:38px;gap:6px}
  .nowrap-table .table td .btn-icon{width:38px;height:38px;min-height:38px;padding:0;flex:0 0 38px}
  .nowrap-table .table td .doc-actions{gap:6px}
  .nowrap-table .table .caption{display:inline}
}
.sel-cell{display:inline-flex;align-items:center;gap:8px;cursor:pointer;margin:0}
.sel-cell input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:#C33B3B;cursor:pointer;flex:0 0 18px;border-radius:4px}
.sel-cell input[type=checkbox]:disabled{cursor:not-allowed;opacity:.35}
tr.row-selected td{background:#fff5f5}
.bulk-bar{position:sticky;bottom:18px;z-index:40;display:flex;align-items:center;gap:12px;flex-wrap:wrap;width:max-content;max-width:calc(100% - 8px);margin:16px auto 0;padding:10px 14px;background:#1b2440;color:#fff;border-radius:14px;box-shadow:0 12px 32px rgba(10,18,40,.35);animation:bulkin .2s ease}
.bulk-bar[hidden]{display:none}
.bulk-count{font-size:15px}.bulk-count strong{font-size:18px}
.bulk-bar .btn{min-height:40px}
.btn.btn-del-solid{background:#C33B3B;border-color:#C33B3B;color:#fff;font-weight:700}
.btn.btn-del-solid:hover{background:#9A2E2E;border-color:#9A2E2E;color:#fff}
@keyframes bulkin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.btn.btn-del{color:#C33B3B;border-color:#f0c4c4;background:#fff}
.btn.btn-del:hover{background:#C33B3B;border-color:#C33B3B;color:#fff}
.btn.btn-del.is-disabled{color:#c3cadb;border-color:#e3e8f4;background:#f6f7fb;cursor:not-allowed;display:inline-flex;align-items:center;justify-content:center}
.btn.btn-del.is-disabled:hover{background:#f6f7fb;color:#c3cadb;border-color:#e3e8f4}
.nowrap-table .table td .doc-actions .inline-form{display:inline-flex;margin:0}
.btn.btn-cancel-inv{color:#C33B3B;border-color:#f0c4c4;background:#fff}
.btn.btn-cancel-inv:hover{background:#C33B3B;border-color:#C33B3B;color:#fff}
.cancel-pill{display:inline-flex;align-items:center;gap:6px;padding:0 12px;min-height:30px;border-radius:99px;background:#eef0f5;color:#6b7a99;font:700 13px 'Public Sans',sans-serif;border:1px solid #d7dce8}
.pay-status{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.pay-toggle{display:inline-flex;align-items:stretch;border:1.5px solid #cdd5e6;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 1px 2px rgba(20,22,28,.05)}
.pay-toggle>*+*{border-left:1.5px solid #cdd5e6}
.pay-toggle .inline-form{display:flex;margin:0}
.pt-opt{display:inline-flex;align-items:center;gap:6px;padding:0 14px;min-height:36px;font:700 13px 'Public Sans',sans-serif;border:0;background:#fff;color:#7a869f;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}
.pt-opt svg{flex:0 0 auto}
.pt-opt.is-on{cursor:default}
.pt-opt.pt-unpaid.is-on{background:#C33B3B;color:#fff}
.pt-opt.pt-paid.is-on{background:#1C8A57;color:#fff}
button.pt-opt.pt-paid:hover,button.pt-opt.pt-paid:focus-visible{background:#e3f4ea;color:#1C8A57}
button.pt-opt.pt-unpaid:hover,button.pt-opt.pt-unpaid:focus-visible{background:#fdeaea;color:#C33B3B}
.pt-opt.is-lock{color:#b3bccd;background:#f6f7fb;cursor:not-allowed}
.pay-sw{display:inline-flex;align-items:center;gap:10px;margin:0}
.sw{position:relative;flex:0 0 auto;width:48px;height:26px;padding:0;border:0;border-radius:99px;background:#C33B3B;cursor:pointer;transition:background .2s,box-shadow .2s;box-shadow:inset 0 1px 3px rgba(0,0,0,.25)}
.sw.is-paid{background:#1C8A57}
.sw-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.35);transition:transform .22s cubic-bezier(.2,.8,.2,1)}
.sw.is-paid .sw-knob{transform:translateX(22px)}
button.sw:hover{box-shadow:inset 0 1px 3px rgba(0,0,0,.25),0 0 0 4px rgba(195,59,59,.16)}
button.sw.is-paid:hover{box-shadow:inset 0 1px 3px rgba(0,0,0,.25),0 0 0 4px rgba(28,138,87,.18)}
button.sw:focus-visible{outline:3px solid rgba(27,63,160,.45);outline-offset:2px}
.sw.is-lock{background:#8fcdaa;cursor:not-allowed}.sw.is-lock .sw-knob svg{color:#1C8A57;width:12px;height:12px}
.sw-text{font:700 13px 'Public Sans',sans-serif;color:#C33B3B;min-width:46px}
.sw-text.is-paid{color:#1C8A57}
@media(prefers-reduced-motion:reduce){.sw,.sw-knob{transition:none}}
.btn.btn-paid{background:#1C8A57;border-color:#1C8A57;color:#fff;font-weight:700}
.btn.btn-paid:hover{background:#156E45;border-color:#156E45;color:#fff}
.btn.btn-unpaid{background:#C33B3B;border-color:#C33B3B;color:#fff;font-weight:700}
.btn.btn-unpaid:hover{background:#9A2E2E;border-color:#9A2E2E;color:#fff}
.cd-overlay{z-index:350}
.cd-dialog{max-width:420px}
.cd-dialog.cd-success{border-top-color:#1C8A57}.cd-dialog.cd-success .lo-ico{background:#e6f5ec;color:#1C8A57}
.cd-dialog.cd-success .btn-lo-ok{background:#1C8A57;border-color:#1C8A57}.cd-dialog.cd-success .btn-lo-ok:hover{background:#156E45;border-color:#156E45}
.cd-dialog.cd-warn{border-top-color:#B9791E}.cd-dialog.cd-warn .lo-ico{background:#fbf0dc;color:#B9791E}
.cd-dialog.cd-warn .btn-lo-ok{background:#B9791E;border-color:#B9791E}.cd-dialog.cd-warn .btn-lo-ok:hover{background:#946014;border-color:#946014}
.cd-dialog p strong{color:var(--ink)}
.doc-actions.act-row{flex-wrap:nowrap;align-items:center}
.doc-actions.act-row .inline-form{display:inline-flex;margin:0}
.doc-actions.act-row .btn{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.doc-prog{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.doc-prog .bar{width:54px;height:6px;border-radius:99px;background:#e3e8f4;overflow:hidden;display:inline-block}
.doc-prog .bar i{display:block;height:100%;background:#1C8A57;border-radius:99px}
.card.act-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:14px}
.act-filters .input[type=search]{flex:2 1 220px;min-width:0}
.act-filters .select{flex:1 1 170px;min-width:0}
.act-filters .input[type=date]{flex:1 1 150px;min-width:0}
.act-filters .btn{flex:0 0 auto}
.act-filters .act-btns{display:flex;flex-wrap:nowrap;gap:10px;flex:0 0 auto;align-items:center}
.stat.stat-tone .num{color:var(--acc)}
.stat.stat-tone:hover{border-color:var(--acc)}
.rep-grid .stat.stat-ic{padding:10px 12px 14px;gap:10px;align-items:center;border-radius:10px}
.rep-grid .stat .st-ico{width:40px;height:40px;border-radius:10px}.rep-grid .stat .st-ico svg{width:20px;height:20px}
.rep-grid .stat .st-body{min-width:0}
.rep-grid .stat .num{font-size:22px;line-height:1.1}
.rep-grid .stat .small.muted{font-size:12px;line-height:1.3;margin-top:1px}.rep-grid .stat .small.muted strong{font-size:13px;font-weight:600}
.rep-grid .stat::after{height:3px}
.rep-grid .stat .st-go{top:6px;right:6px;width:24px;height:24px;border-radius:6px}.rep-grid .stat .st-go svg{width:13px;height:13px}
.filters .small.muted{align-self:center}
.stat.stat-success:nth-child(n){--acc:#1C8A57;border-color:#bfe3cf;background:#f8fdfa}
.stat.stat-success .num{color:#1C8A57}
.stat.stat-success .small.muted{color:#17724a}
.stat.stat-success:nth-child(n):hover,.stat.stat-success:nth-child(n):focus-visible{border-color:#1C8A57;background:#f1faf5;box-shadow:0 12px 28px rgba(28,138,87,.20)}
.stat.stat-success:hover .st-ico,.stat.stat-success:focus-visible .st-ico{background:#1C8A57;color:#fff}
.stat.stat-success:hover .num{color:#156E45}
.stat.stat-success:hover .st-go{background:#dff3e8;color:#1C8A57}
.stat.stat-danger .num{color:#C33B3B}
.stat.stat-danger:nth-child(n):hover,.stat.stat-danger:nth-child(n):focus-visible{border-color:#C33B3B;background:#fff5f5;box-shadow:0 12px 28px rgba(195,59,59,.20)}
.stat.stat-danger:hover .st-ico,.stat.stat-danger:focus-visible .st-ico{background:#C33B3B;color:#fff}
.stat.stat-danger:hover .num,.stat.stat-danger:focus-visible .num{color:#B02A2A}
.stat.stat-danger:hover .st-go{background:#fde4e4;color:#C33B3B}
.stat.stat-danger .small.muted,.stat.stat-danger .small.muted a{color:#a63232}
.stat-link.is-active{border-color:var(--acc,#0b37af)}
.stat-link.is-active::after{opacity:1;transform:scaleX(1)}
.stat-link .st-go{position:absolute;top:10px;right:10px;margin:0;align-self:auto;width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--acc,#0b37af) 12%,#fff);color:var(--acc,#0b37af);opacity:0;transform:translate(-4px,4px) scale(.9)}
.stat-link:hover .st-go,.stat-link:focus-visible .st-go{opacity:1;transform:none}
@media(hover:none){.stat-link .st-go{opacity:1;transform:none}}
.svc-cat{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit;margin-bottom:0;transition:transform .2s,box-shadow .2s,border-color .2s}
.svc-cat:hover{transform:translateY(-3px);border-color:var(--royal);box-shadow:0 10px 24px rgba(27,63,160,.12)}
.svc-cat h3{margin:0;color:var(--royal-dark)}.svc-cat p{margin:0;flex:1}
.svc-count{font-size:13px;font-weight:700;color:var(--royal);margin-top:6px}
.svc-item{display:flex;flex-direction:column;gap:8px;margin-bottom:0}.svc-item h3{margin:0}.svc-item h3 a{color:var(--royal-dark);text-decoration:none}.svc-item p{margin:0;flex:1}
.svc-meta{display:flex;gap:8px;flex-wrap:wrap}.svc-actions{display:flex;gap:10px;margin-top:6px}
.wz-steps{list-style:none;margin:0 0 26px;padding:0;display:flex;align-items:flex-start;gap:0;counter-reset:wz}
.wz-step{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;cursor:default;min-width:0}
.wz-step:not(:first-child):before{content:"";position:absolute;top:17px;right:50%;width:100%;height:3px;background:#dfe5f3;z-index:0}
.wz-dot{position:relative;z-index:1;width:36px;height:36px;border-radius:50%;background:#fff;border:2px solid #c3cde4;color:#7a869f;font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .25s}
.wz-label{font-size:13px;font-weight:600;color:#7a869f;line-height:1.25;padding:0 4px}
.wz-step.is-active .wz-dot{background:var(--royal,#1B3FA0);border-color:var(--royal,#1B3FA0);color:#fff;box-shadow:0 0 0 5px rgba(27,63,160,.14)}
.wz-step.is-active .wz-label{color:var(--royal-dark,#122c73)}
.wz-step.is-done .wz-dot{background:#1C8A57;border-color:#1C8A57;color:transparent;position:relative}
.wz-step.is-done .wz-dot:after{content:"";position:absolute;left:12px;top:6px;width:7px;height:14px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.wz-step.is-done .wz-label{color:#1C8A57}
.wz-step.is-done:before,.wz-step.is-active:before{background:#1C8A57}
.wz-on .wz-step.is-done{cursor:pointer}
.wz-title{font-size:20px;margin:0 0 14px;color:var(--royal-dark,#122c73)}
.wz-on .wz-panel{display:none}.wz-on .wz-panel.is-active{display:block;animation:wzin .28s ease}
@keyframes wzin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.wz-nav{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-top:24px;padding-top:20px;border-top:1px solid var(--border,#e3e8f4)}
.wz-nav .btn{min-width:140px}.wz-nav .wz-back{margin-right:auto}.wz-nav .wz-next,.wz-nav .wz-submit{margin-left:auto}
.wz-nav [hidden]{display:none}
.wz-list{margin:0 0 18px;border:1px solid var(--border,#e3e8f4);border-radius:12px;overflow:hidden;background:#fafbff}
.wz-row{display:grid;grid-template-columns:130px 1fr;gap:12px;padding:10px 16px;border-bottom:1px solid var(--border,#e3e8f4);font-size:14px}
.wz-row:last-child{border-bottom:0}.wz-row dt{color:#7a869f;font-weight:600}.wz-row dd{margin:0;color:var(--ink,#1a2233);word-break:break-word}
.input.is-invalid{border-color:#C33B3B;background:#fff8f8}.wz-err{color:#C33B3B;font-size:13px;font-weight:600;margin-top:6px}
@media(max-width:560px){.wz-label{font-size:11px}.wz-row{grid-template-columns:1fr;gap:2px}.wz-nav .btn{min-width:0;flex:1}}
@media(prefers-reduced-motion:reduce){.wz-on .wz-panel.is-active{animation:none}}
.container.apply-wrap{max-width:980px;padding-top:36px;padding-bottom:56px}
.apply-wrap>form.card{padding:22px;margin-bottom:0}
@media(min-width:769px){.apply-wrap>form.card{padding:32px 36px}.container.apply-wrap{padding-top:48px;padding-bottom:72px}}
.apply-summary{background:var(--royal-tint);border-radius:14px;padding:18px 22px;margin-bottom:24px;display:flex;flex-direction:column;gap:6px}
.apply-summary .caption{color:var(--royal-dark);font-weight:700;letter-spacing:.04em}
.apply-summary h3{color:var(--royal-dark);margin:0 0 4px}
.apply-summary .list-check{margin:0 0 8px}
.apply-summary .badge{align-self:flex-start}
@media(min-width:769px){.apply-summary{padding:24px 36px;margin-bottom:28px}}
.dz{max-width:100%;overflow:hidden}.dz-file{min-width:0}.dz-meta{min-width:0;overflow:hidden}.dz-name{display:block;width:0;min-width:100%}
.otp-resend{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 4px;font-size:14px;color:var(--ink-soft,#5a6682)}
.otp-timer b{color:var(--royal,#1B3FA0);font-variant-numeric:tabular-nums}
.otp-resend-btn{background:none;border:0;padding:8px 0;min-height:44px;font:inherit;font-weight:700;color:var(--royal,#1B3FA0);cursor:pointer;text-decoration:underline}
.otp-resend-btn:disabled{color:#a3adc4;cursor:not-allowed;text-decoration:none}
.dv-overlay{position:fixed;inset:0;z-index:400;background:rgba(10,18,40,.62);display:flex;align-items:center;justify-content:center;padding:20px;animation:dvfade .18s ease}
.dv-overlay[hidden]{display:none}
.dv-dialog{background:#fff;border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.4);width:min(960px,100%);height:min(86vh,820px);display:flex;flex-direction:column;overflow:hidden;outline:0}
.dv-head{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border,#e3e8f4)}
.dv-title{flex:1;min-width:0;margin:0;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dv-dl{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.dv-close{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border-strong);border-radius:8px;background:var(--white);font-size:26px;line-height:1;cursor:pointer;color:var(--ink);transition:background .2s,color .2s,border-color .2s}
.dv-close:hover{background:#C33B3B;border-color:#C33B3B;color:#fff}
.dv-close:focus-visible{outline:3px solid rgba(27,63,160,.35);outline-offset:2px}
.dv-body{flex:1;min-height:0;background:#eef1f8;display:flex;align-items:center;justify-content:center;position:relative;overflow:auto}
.dv-body iframe{width:100%;height:100%;border:0;background:#fff}
.dv-body img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.dv-loading{position:absolute;color:#5a6682;font-size:14px}
.dv-nopreview{text-align:center;padding:24px;max-width:380px}
body.dv-lock{overflow:hidden}
@keyframes dvfade{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.dv-overlay{padding:0}.dv-dialog{height:100%;border-radius:0}.dv-dl{padding:0 10px}}
.doc-actions{display:inline-flex;gap:8px;flex-wrap:wrap}.doc-actions .btn{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}

/* dashboard donut charts */
.dn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 22px}
.dn-card{padding:18px}
.dn-wrap{display:flex;flex-direction:column;align-items:center;gap:16px}
.dn-chart{position:relative;width:170px;height:170px;flex:none}
.dn-chart svg{width:100%;height:100%;transform:none}
.dn-seg{transition:stroke-width .15s}
.dn-seg:hover{stroke-width:8}
.dn-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;padding:0 38px}
.dn-center strong{font-size:22px;line-height:1.1}
.dn-center span{font-size:11px;color:var(--muted,#6b7280);margin-top:2px;line-height:1.2}
.dn-legend{list-style:none;margin:0;padding:0;width:100%}
.dn-legend a{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;color:inherit;text-decoration:none;font-size:14px}
.dn-legend a:hover{background:rgba(0,0,0,.05)}
.dn-legend i{width:11px;height:11px;border-radius:3px;flex:none}
.dn-legend .dn-l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dn-legend em{font-style:normal;color:var(--muted,#6b7280);font-size:12px;min-width:34px;text-align:right}
@media(max-width:1100px){.dn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.dn-grid{grid-template-columns:1fr}}
.fb-credit a{color:#fff;text-decoration:none}
.fb-credit a:hover strong{text-decoration:underline}

/* admin category cards: highlight the active filter */
.stat-link.is-active{transform:translateY(-5px);border-color:var(--acc,#1B3FA0);box-shadow:0 12px 28px rgba(11,55,175,.14);background:#fff}
.stat-link.is-active::after{opacity:1;transform:scaleX(1)}
.stat-link.is-active .st-ico{background:var(--acc,#0b37af);color:#fff}
.stat-link.is-active .st-go{opacity:1;transform:none}

/* admin Services: 8 compact category cards per row (icon on top, count + name below) */
@media(min-width:1280px){.stat-grid.rep-grid.eight{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}}
.rep-grid.eight .stat.stat-ic{flex-direction:column;align-items:flex-start;gap:6px;padding:10px 10px 12px}
.rep-grid.eight .stat .st-ico{width:32px;height:32px;border-radius:8px}.rep-grid.eight .stat .st-ico svg{width:17px;height:17px}
.rep-grid.eight .stat .num{font-size:20px}
.rep-grid.eight .stat .small.muted{font-size:11.5px;line-height:1.25}
.rep-grid.eight .stat .st-go{display:none}
.rep-grid.eight .stat .st-body{width:100%}

/* admin Services cards, compact: [icon] [number] on the first line, category name on the second */
.rep-grid.eight .stat.stat-ic{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 8px;padding:8px 10px 10px}
.rep-grid.eight .stat .st-ico{width:28px;height:28px;border-radius:8px}.rep-grid.eight .stat .st-ico svg{width:15px;height:15px}
.rep-grid.eight .stat .st-body{display:contents}
.rep-grid.eight .stat .num{font-size:20px;line-height:1;grid-column:2;grid-row:1}
.rep-grid.eight .stat .small.muted{grid-column:1/-1;grid-row:2;font-size:11.5px;line-height:1.2;margin:0}

/* admin Services: the selected category card is reversed (solid colour, white text) so it reads as "active" */
.rep-grid.eight .stat.is-active{background:var(--acc);border-color:var(--acc);box-shadow:0 6px 16px rgba(20,22,28,.22)}
.rep-grid.eight .stat.is-active .num,.rep-grid.eight .stat.is-active .small,.rep-grid.eight .stat.is-active .small.muted,.rep-grid.eight .stat.is-active .caption{color:#fff}
.rep-grid.eight .stat.is-active .st-ico{background:rgba(255,255,255,.22);color:#fff}
.rep-grid.eight .stat.is-active::after{background:rgba(255,255,255,.55)}

/* ===== One common rule for every clickable card: after a click (pressed / focused) it keeps exactly the same colour + effects as on hover ===== */
.stat:is(:focus,:focus-visible,:active),.svc-card:is(:focus,:focus-visible,:active),.hover-cards>.card:is(:focus,:focus-visible,:active),.info-card:is(:focus,:focus-visible,:active),.sm-card:is(:focus,:focus-visible,:active){transform:translateY(-5px);border-color:var(--acc,#C3CCE8);box-shadow:0 12px 28px rgba(11,55,175,.14);color:inherit}
.stat:is(:focus,:focus-visible,:active)::after,.svc-card:is(:focus,:focus-visible,:active)::after,.hover-cards>.card:is(:focus,:focus-visible,:active)::after,.info-card:is(:focus,:focus-visible,:active)::after,.sm-card:is(:focus,:focus-visible,:active)::after{opacity:1;transform:scaleX(1)}
.stat-ic:is(:focus,:focus-visible,:active) .st-ico,.hover-cards>.card:is(:focus,:focus-visible,:active) .st-ico,.info-card:is(:focus,:focus-visible,:active) .ic{background:var(--acc,#0b37af);color:#fff}
.svc-card:is(:focus,:focus-visible,:active) .svc-icon{background:var(--acc,var(--royal));color:#fff;transform:scale(1.06)}
.stat-link:is(:focus,:focus-visible,:active) .st-go{opacity:1;transform:none}
.card-img:is(:focus,:focus-visible,:active){transform:translateY(-4px);box-shadow:0 12px 28px rgba(20,22,28,.12);border-color:var(--royal);color:inherit}
.card-img:is(:focus,:focus-visible,:active) .card-photo img{transform:scale(1.07)}
.thumb-card:is(:focus,:focus-visible,:active){transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,22,28,.12);border-color:var(--royal);color:inherit}
.link-card:is(:focus,:focus-visible,:active){transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,22,28,.1);border-color:var(--lc);color:var(--ink)}
.link-card:is(:focus,:focus-visible,:active) .lc-go{color:var(--lc);transform:translate(2px,-2px)}
.appt-tile:is(:focus,:focus-visible,:active){transform:translateY(-2px);box-shadow:0 8px 20px rgba(20,22,28,.1);border-color:var(--royal);color:var(--ink)}
.cc-item:is(:focus,:focus-visible,:active),.logo-item:is(:focus,:focus-visible,:active){transform:translateY(-4px);border-color:#C3CCE8;box-shadow:0 10px 24px rgba(11,55,175,.14)}
.cc-item:is(:focus,:focus-visible,:active) img,.logo-item:is(:focus,:focus-visible,:active) img{filter:none}
.apply-card:is(:focus,:focus-visible,:active),.catcard:is(:focus,:focus-visible,:active){border-color:var(--green)}
.catcard:is(:focus,:focus-visible,:active){border-color:var(--royal)}

/* clicked cards: no blue focus ring / tap flash - the hover look (above) is the "selected" feedback, including the coloured tone cards */
.stat-link,.svc-card,.link-card,.card-img,.thumb-card,.appt-tile,.sm-card,.info-card,.cc-item{-webkit-tap-highlight-color:transparent}
.stat-link:is(:focus,:focus-visible),.svc-card:is(:focus,:focus-visible),.link-card:is(:focus,:focus-visible),.card-img:is(:focus,:focus-visible),.thumb-card:is(:focus,:focus-visible),.appt-tile:is(:focus,:focus-visible),.sm-card:is(:focus,:focus-visible){outline:0}
.stat.stat-success:nth-child(n):is(:focus,:focus-visible,:active){border-color:#1C8A57;background:#f1faf5;box-shadow:0 12px 28px rgba(28,138,87,.20)}
.stat.stat-success:is(:focus,:focus-visible,:active) .st-ico{background:#1C8A57;color:#fff}
.stat.stat-success:is(:focus,:focus-visible,:active) .num{color:#156E45}
.stat.stat-success:is(:focus,:focus-visible,:active) .st-go{background:#dff3e8;color:#1C8A57}
.stat.stat-danger:nth-child(n):is(:focus,:focus-visible,:active){border-color:#C33B3B;background:#fff5f5;box-shadow:0 12px 28px rgba(195,59,59,.20)}
.stat.stat-danger:is(:focus,:focus-visible,:active) .st-ico{background:#C33B3B;color:#fff}
.stat.stat-danger:is(:focus,:focus-visible,:active) .num{color:#B02A2A}
.stat.stat-danger:is(:focus,:focus-visible,:active) .st-go{background:#fde4e4;color:#C33B3B}
.stat.stat-success.is-active:nth-child(n){border-color:#1C8A57;background:#f1faf5;box-shadow:0 12px 28px rgba(28,138,87,.20)}
.stat.stat-success.is-active .st-ico{background:#1C8A57;color:#fff}.stat.stat-success.is-active .num{color:#156E45}
.stat.stat-danger.is-active:nth-child(n){border-color:#C33B3B;background:#fff5f5;box-shadow:0 12px 28px rgba(195,59,59,.20)}
.stat.stat-danger.is-active .st-ico{background:#C33B3B;color:#fff}.stat.stat-danger.is-active .num{color:#B02A2A}

/* admin: one-time generated customer password */
.genpw-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.genpw-code{font:700 22px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.14em;background:var(--green-tint);color:#0F6B3E;border:1px dashed #1C8A57;border-radius:10px;padding:12px 16px;user-select:all}
.genpw-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}

/* pagination: Prev / numbers with ellipsis / Next */
.pager{align-items:center;justify-content:center;gap:6px;margin:18px 0}
.pager a,.pager .pg-nav,.pager .pg-gap{min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:0 10px;border-radius:10px;font-weight:600;font-size:14px}
.pager a,.pager .pg-nav{border:1px solid var(--border-strong);background:#fff;color:var(--ink);transition:background .15s,border-color .15s,color .15s}
.pager a:hover{background:var(--royal-tint);border-color:var(--royal);color:var(--royal-dark)}
.pager a.active{background:var(--royal);color:#fff;border-color:var(--royal)}
.pager .pg-gap{border:0;color:var(--ink-soft);min-width:24px;padding:0}
.pager .pg-nav.is-off{opacity:.45;background:#f6f7fb;border-color:var(--border)}
@media(max-width:520px){.pager .pg-nav span{display:none}.pager a,.pager .pg-nav{min-width:36px;padding:0 8px}}

/* customers table: 4 icon actions (view, edit, key, delete) must fit at 1366px without a horizontal scrollbar */
@media(min-width:769px){
  .cust-tbl .table th,.cust-tbl .table td{padding-left:6px;padding-right:6px}
  .cust-tbl .table td .btn-icon{width:34px;height:34px;min-height:34px;flex:0 0 34px}
  .cust-tbl .table td .doc-actions{gap:4px}
}

.cust-tbl abbr{text-decoration:none;cursor:help}


/* home: advertisement band (same size as the CTA band it replaces) with a small "Ad" label */
.cta-ad .ad-tag{position:absolute;top:8px;right:10px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.45);border-radius:6px;padding:1px 7px;line-height:1.5}

/* home ad band, desktop: larger and more prominent */
@media(min-width:769px){
  .cta-ad{padding:28px 52px 32px;min-height:128px;border-radius:16px;gap:32px;box-shadow:0 14px 34px rgba(18,44,115,.22);background:linear-gradient(90deg,rgba(14,34,92,.94) 0%,rgba(18,44,115,.78) 55%,rgba(18,44,115,.4) 100%),var(--cta) center/cover}
  .cta-ad h3{font-size:30px;line-height:1.15;margin:0 0 6px!important;letter-spacing:-.01em}
  .cta-ad p{font-size:17px!important;line-height:1.4;color:#E3EAFB;max-width:640px}
  .cta-ad .btn{min-height:50px;padding:0 30px;font-size:17px;font-weight:700;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.22);white-space:nowrap}
  .cta-ad .ad-tag{top:12px;right:16px;font-size:11px;padding:2px 9px}
}

/* home promo band carousel: slides stacked in one grid cell, crossfade; dots centred at the bottom */
.ad-rot{position:relative;display:grid}
.ad-rot .ad-slide{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s linear .8s}
.ad-rot .ad-slide.is-on{opacity:1;visibility:visible;transition:opacity .8s ease}
.ad-dots{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;gap:8px;z-index:3}
.ad-dots button{width:26px;height:6px;padding:0;border:0;border-radius:6px;background:rgba(255,255,255,.4);cursor:pointer;transition:background .2s,width .2s;position:relative}
.ad-dots button::after{content:"";position:absolute;inset:-12px -4px}
.ad-dots button.is-on{background:#fff;width:34px}
@media(prefers-reduced-motion:reduce){.ad-rot .ad-slide,.ad-rot .ad-slide.is-on{transition:none}}

/* login left panel: transparent black over the photo (was blue) */
.auth-left{background:linear-gradient(135deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.66) 55%,rgba(0,0,0,.55) 100%),var(--auth-img,none) center/cover}

/* hero slides after the first use <h2> (single H1 per page for SEO) but look exactly like the H1 */
.slide h2{color:#fff;font-size:30px}
@media(min-width:769px){.slide h2{font-size:44px}}

/* default-password warning for admin/staff */
.dpw-banner{margin:0 0 16px;padding:12px 16px;border-radius:10px;background:#FFF4CC;border:1px solid #F2C94C;color:#5c4400;font-size:14px}
.dpw-banner a{color:#7a2e00;font-weight:700;text-decoration:underline}

/* customers: bulk import dialog + result banner */
.imp-banner{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 12px;padding:12px 16px;border-left:4px solid var(--green)}
.imp-dialog{border:0;border-radius:16px;padding:0;width:min(560px,calc(100vw - 32px));box-shadow:0 24px 60px rgba(0,0,0,.35);color:var(--ink)}
.imp-dialog::backdrop{background:rgba(10,18,40,.55)}
.imp-dialog form{padding:22px 24px 20px}
.imp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.imp-head h3{margin:0;font-size:20px}
.imp-x{width:36px;height:36px;border-radius:10px;border:1px solid var(--border-strong);background:#fff;font-size:22px;line-height:1;cursor:pointer}
.imp-steps{margin:0 0 14px;padding-left:20px;font-size:14px;color:var(--ink-soft);display:grid;gap:6px}
.imp-check{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:14px;cursor:pointer}
/* four controls (Filter, Clear, Import, Export) must stay on one row next to the inputs on desktop */
@media(min-width:1100px){.cust-filters .input[type=search]{flex:2 1 150px}.cust-filters .input[type=date]{flex:1 1 118px}.cust-filters .act-btns{gap:8px}}

/* import dialog: template preview + column confirmation */
.imp-lead{margin:0 0 8px;font-size:14px;color:var(--ink-soft)}
.imp-tpl{overflow-x:auto;border:1px solid var(--border);border-radius:10px;margin-bottom:10px}
.imp-tpl table,.imp-prev{border-collapse:collapse;width:100%;font-size:12.5px}
.imp-tpl th,.imp-tpl td,.imp-prev th,.imp-prev td{padding:7px 10px;text-align:left;white-space:nowrap;border-bottom:1px solid var(--border)}
.imp-tpl th{background:var(--royal-tint);color:var(--royal-dark);font-weight:700}
.imp-tpl tr:last-child td,.imp-prev tr:last-child td{border-bottom:0}
.imp-tpl b.req,.imp-tpl b.opt{display:block;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.imp-tpl b.req{color:var(--red)}.imp-tpl b.opt{color:var(--ink-soft)}
.imp-dl{margin-bottom:10px}
.imp-notes{margin:0 0 14px;padding-left:18px;font-size:13px;color:var(--ink-soft);display:grid;gap:4px}
.imp-check-box{margin-top:10px;padding:10px 12px;border-radius:10px;font-size:13px;overflow-x:auto}
.imp-check-box.good{background:var(--green-tint);border:1px solid #9AD3B4;color:#0F6B3E}
.imp-check-box.bad{background:var(--red-tint);border:1px solid #E6A8A8;color:#8E2B2B}
.imp-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.imp-chips span{padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;background:#fff;border:1px solid var(--border)}
.imp-chips .chip-ok{color:#0F6B3E;border-color:#9AD3B4}.imp-chips .chip-miss{color:#8E2B2B;border-color:#E6A8A8}.imp-chips .chip-na{color:var(--ink-soft)}
.imp-prev{margin-top:6px;background:#fff;border-radius:8px}
.imp-dialog{width:min(680px,calc(100vw - 32px))}
