:root{
  --fs:16px;
  --wial-red:#c0152a;
  --wial-navy:#17324d;
  --wial-teal:#00a0b0;
  --wial-gold:#e8a020;
  --bg:#f4f7fa;
  --bg-soft:#eef2f7;
  --card:#fff;
  --text:#17324d;
  --muted:#5a7080;
  --border:#d0dce8;
  --blue:#0072B2;
  --green:#009E73;
  --orange:#E69F00;
  --purple:#7A68A6;
  --red:#D55E00;
  --shadow:0 4px 20px rgba(23,50,77,.09);
  --radius:14px;
}

html.a11y-large{
  --fs:20px;
}

html.a11y-large body{
  font-size:1.125rem;
}

html.a11y-large .site-header,
html.a11y-large .topbar-strip,
html.a11y-large .translate-bar,
html.a11y-large .login-card,
html.a11y-large .dash-top,
html.a11y-large .core-pages-bar,
html.a11y-large .dash-body,
html.a11y-large .sidebar{
  font-size:1.08em;
}

body.a11y-colorblind{
  filter:saturate(0.35) contrast(1.4);
}

body.a11y-highcontrast{
  --text:#000;
  --muted:#111;
  --card:#fff;
  --bg:#e8e8e8;
  --bg-soft:#ddd;
  --border:#444;
  --wial-red:#900010;
  --wial-navy:#000022;
  --blue:#004080;
  --green:#004020;
  filter:contrast(1.5);
}

body.a11y-keyboard *:focus{
  outline:3px solid #ff6600 !important;
  outline-offset:3px !important;
  border-radius:4px;
}

body:not(.a11y-keyboard) *:focus{
  outline:none;
}

*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html{
  font-size:var(--fs);
}

body{
  font-family:Inter,sans-serif;
  font-size:1rem;
  color:var(--text);
  background:var(--bg);
  min-height:100vh;
}

h1,h2,h3,h4{
  margin:0;
}

button,input,select,textarea{
  font:inherit;
}

a{
  color:var(--blue);
  text-decoration:none;
}

.topbar-strip{
  background:var(--wial-red);
  color:white;
  padding:.5rem 2rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
  z-index:200;
}

.tb-social{
  display:flex;
  gap:.75rem;
}

.tb-social a{
  color:rgba(255,255,255,.8);
  font-size:.85rem;
  cursor:pointer;
  text-decoration:none;
}

.tb-social a:hover{
  color:white;
}

.tb-right{
  display:flex;
  gap:.75rem;
  align-items:center;
}

.a11y-btn{
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.3);
  color:white;
  border-radius:999px;
  padding:.25rem .75rem;
  font-size:.75rem;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:.3rem;
}

.a11y-btn:hover{
  background:rgba(255,255,255,.28);
}

.a11y-panel{
  position:absolute;
  top:2.4rem;
  right:2rem;
  background:white;
  border:1px solid var(--border);
  border-radius:12px;
  padding:1rem;
  box-shadow:0 8px 32px rgba(0,0,0,.18);
  z-index:9999;
  min-width:260px;
  display:none;
}

.a11y-panel.open{
  display:block;
}

.a11y-panel h4{
  font-size:.85rem;
  font-weight:800;
  margin-bottom:.75rem;
  padding-bottom:.5rem;
  border-bottom:1px solid var(--border);
}

.a11y-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.5rem 0;
  border-bottom:1px solid var(--border);
}

.a11y-row:last-child{
  border-bottom:none;
}

.a11y-row label{
  font-size:.85rem;
  cursor:pointer;
}

.a11y-row .hint{
  font-size:.7rem;
  color:var(--muted);
  margin-top:.15rem;
}

.toggle{
  position:relative;
  width:42px;
  height:24px;
  background:#ccc;
  border-radius:999px;
  cursor:pointer;
  border:none;
  transition:background .2s;
  flex-shrink:0;
}

.toggle.on{
  background:var(--wial-teal);
}

.toggle::after{
  content:'';
  position:absolute;
  top:3px;
  left:3px;
  width:18px;
  height:18px;
  background:white;
  border-radius:50%;
  transition:left .2s;
  box-shadow:0 1px 4px rgba(0,0,0,.2);
}

.toggle.on::after{
  left:21px;
}

.translate-bar{
  background:#fff8e0;
  border-bottom:1px solid #f1dfb0;
  padding:.5rem 2rem;
  display:none;
  align-items:center;
  justify-content:space-between;
  font-size:.85rem;
  color:#7a5800;
  gap:1rem;
}

.translate-bar.show{
  display:flex;
}

.translate-bar button{
  background:white;
  border:1px solid #f1dfb0;
  border-radius:8px;
  padding:.3rem .8rem;
  font-size:.8rem;
  font-weight:700;
  color:#7a5800;
  cursor:pointer;
}

.site-header{
  background:white;
  border-bottom:3px solid var(--wial-teal);
  display:flex;
  align-items:center;
  padding:0 2rem;
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 2px 12px rgba(23,50,77,.06);
}

.wial-logo-wrap{
  display:flex;
  align-items:center;
  gap:.5rem;
  padding:.7rem 0;
  text-decoration:none;
  flex-shrink:0;
}

.logo-bars{
  display:flex;
  align-items:flex-end;
  gap:3px;
  height:40px;
}

.logo-bars span{
  border-radius:3px 3px 0 0;
  display:block;
}

.logo-text-block{
  line-height:1.1;
}

.logo-text-block .lt1{
  font-size:.6rem;
  letter-spacing:.14em;
  color:var(--wial-navy);
  text-transform:uppercase;
  font-weight:700;
}

.logo-text-block .lt2{
  font-size:.95rem;
  font-weight:800;
  color:var(--wial-red);
  letter-spacing:.02em;
}

.logo-text-block .lt3{
  font-size:.95rem;
  font-weight:800;
  color:var(--wial-navy);
  letter-spacing:.02em;
}

.site-nav{
  display:flex;
  flex:1;
  margin-left:1rem;
  overflow-x:auto;
}

.snav{
  padding:.9rem .9rem;
  font-size:.88rem;
  font-weight:600;
  color:var(--text);
  cursor:pointer;
  border-bottom:3px solid transparent;
  white-space:nowrap;
  background:none;
  border-top:none;
  border-left:none;
  border-right:none;
  transition:all .2s;
}

.snav:hover,
.snav.act{
  color:var(--wial-red);
  border-bottom-color:var(--wial-red);
}

.header-actions{
  margin-left:auto;
  display:flex;
  gap:.6rem;
  align-items:center;
  flex-shrink:0;
}

.header-social{
  display:flex;
  gap:.65rem;
  align-items:center;
  margin-right:.35rem;
}

.header-social a{
  color:var(--wial-navy);
  font-size:.9rem;
  font-weight:700;
  cursor:pointer;
  text-decoration:none;
}

.header-social a:hover{
  color:var(--wial-red);
}

.page-wrap{
  max-width:1180px;
  margin:0 auto;
  padding:0 2rem;
}

.hero{
  background:linear-gradient(135deg,var(--wial-navy),#1e4a6e,var(--wial-teal));
  color:white;
  padding:5rem 4rem;
  display:flex;
  gap:3rem;
  align-items:center;
}

.hero h1{
  font-family:"Playfair Display",serif;
  font-size:3rem;
  line-height:1.1;
  margin-bottom:1rem;
}

.hero p{
  font-size:1.05rem;
  opacity:.85;
  line-height:1.7;
  max-width:520px;
  margin-bottom:1.75rem;
}

.hero-cta{
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
}

.btn-p{
  background:var(--wial-red);
  color:white;
  border:none;
  padding:.85rem 1.75rem;
  border-radius:8px;
  font-weight:700;
  font-size:.95rem;
  cursor:pointer;
}

.btn-p:hover{
  opacity:.88;
}

.btn-o{
  background:transparent;
  color:white;
  border:2px solid rgba(255,255,255,.6);
  padding:.85rem 1.75rem;
  border-radius:8px;
  font-weight:700;
  font-size:.95rem;
  cursor:pointer;
}

.btn-o:hover{
  background:rgba(255,255,255,.1);
}

.hero-stats{
  flex-shrink:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.75rem;
  max-width:300px;
}

.hstat{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.2);
  border-radius:12px;
  padding:1.1rem;
  text-align:center;
}

.hstat .n{
  font-size:2rem;
  font-weight:800;
}

.hstat .l{
  font-size:.75rem;
  opacity:.75;
  margin-top:.2rem;
}

.sec{
  padding:3.5rem 0;
}

.sec-tag{
  font-size:.75rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--wial-red);
  margin-bottom:.5rem;
}

.sec-title{
  font-family:"Playfair Display",serif;
  font-size:2rem;
  color:var(--wial-navy);
  margin-bottom:1rem;
}

.sec-body{
  color:var(--muted);
  font-size:.95rem;
  line-height:1.75;
  max-width:680px;
}

.divider{
  height:1px;
  background:var(--border);
}

.three-col{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.25rem;
  margin-top:2rem;
}

.ic{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.5rem;
  box-shadow:var(--shadow);
}

.ic .ico{
  font-size:2rem;
  margin-bottom:.75rem;
}

.ic h3{
  font-size:1.05rem;
  font-weight:800;
  color:var(--wial-navy);
  margin-bottom:.5rem;
}

.ic p{
  font-size:.88rem;
  color:var(--muted);
  line-height:1.6;
}

.cert-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
  margin-top:1.75rem;
}

.cert-box{
  border-radius:var(--radius);
  padding:1.25rem;
  border:1px solid var(--border);
  text-align:center;
}

.cert-lvl{
  font-size:1.75rem;
  font-weight:800;
  margin-bottom:.3rem;
}

.cert-name{
  font-weight:700;
  font-size:.88rem;
  margin-bottom:.5rem;
}

.cert-desc{
  font-size:.8rem;
  color:var(--muted);
  line-height:1.5;
}

.recert-box{
  margin-top:1.5rem;
  background:#fff0f0;
  border:1px solid #f5c5c5;
  border-radius:var(--radius);
  padding:1.1rem 1.4rem;
}

.recert-box h4{
  color:var(--wial-red);
  font-weight:800;
  margin-bottom:.5rem;
}

.recert-box p{
  font-size:.9rem;
  color:var(--muted);
  line-height:1.7;
}

.dir-filters{
  display:flex;
  gap:.75rem;
  margin-bottom:1.25rem;
  flex-wrap:wrap;
  align-items:center;
}

.dir-filter{
  padding:.65rem 1rem;
  border-radius:10px;
  border:1px solid var(--border);
  background:white;
  font-size:.88rem;
  outline:none;
  cursor:pointer;
}

.dir-search{
  flex:1;
  position:relative;
}

.dir-search input{
  width:100%;
  padding:.75rem 1rem;
  border-radius:10px;
  border:1px solid var(--border);
  font-size:.9rem;
  outline:none;
  padding-right:7rem;
}

.dir-search button{
  position:absolute;
  right:.4rem;
  top:50%;
  transform:translateY(-50%);
  background:var(--wial-red);
  color:white;
  border:none;
  border-radius:8px;
  padding:.5rem 1rem;
  font-size:.82rem;
  font-weight:700;
  cursor:pointer;
}

.dir-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
}

.dcard{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.25rem;
  box-shadow:var(--shadow);
  transition:border-color .2s;
}

.dcard:hover{
  border-color:var(--wial-teal);
}

.dav{
  width:60px;
  height:60px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:white;
  font-weight:800;
  font-size:1.25rem;
  margin-bottom:.75rem;
}

.dname{
  font-size:1.05rem;
  font-weight:800;
  color:var(--wial-navy);
  margin-bottom:.25rem;
}

.dmeta{
  font-size:.82rem;
  color:var(--muted);
  margin-bottom:.6rem;
}

.dbadge{
  display:inline-flex;
  padding:.2rem .6rem;
  border-radius:999px;
  font-size:.7rem;
  font-weight:800;
  margin:.15rem;
}

.dbadge.cert{
  background:#eef7fd;
  color:var(--blue);
  border:1px solid #b8d9f0;
}

.dbadge.gold{
  background:#fff8e0;
  color:#7a5800;
  border:1px solid #f1dfb0;
}

.dbadge.ok{
  background:#e8f8f2;
  color:var(--green);
  border:1px solid #b0e0cc;
}

.dbadge.pend{
  background:#fdf5e0;
  color:var(--orange);
  border:1px solid #f1dfb0;
}

.dbio{
  font-size:.82rem;
  color:var(--muted);
  line-height:1.5;
  margin:.6rem 0;
}

.clients-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:1rem;
  margin-top:1.5rem;
}

.clogob{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1rem;
  text-align:center;
  box-shadow:var(--shadow);
}

.clogob:hover{
  box-shadow:0 8px 24px rgba(0,0,0,.1);
}

.clogo-av{
  width:52px;
  height:52px;
  border-radius:10px;
  display:grid;
  place-items:center;
  color:white;
  font-weight:800;
  font-size:1.1rem;
  margin:0 auto .5rem;
}

.clogo-name{
  font-size:.78rem;
  font-weight:700;
}

.clogo-sec{
  font-size:.72rem;
  color:var(--muted);
}

.res-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  margin-top:1.5rem;
}

.rcard{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.1rem;
  box-shadow:var(--shadow);
}

.rtype{
  font-size:.72rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--wial-teal);
  margin-bottom:.4rem;
}

.rtitle{
  font-size:.95rem;
  font-weight:700;
  color:var(--wial-navy);
  margin-bottom:.4rem;
}

.rdesc{
  font-size:.82rem;
  color:var(--muted);
  line-height:1.5;
  margin-bottom:.75rem;
}

.rdl{
  color:var(--wial-red);
  font-size:.82rem;
  font-weight:700;
  cursor:pointer;
}

.ev-item{
  display:flex;
  gap:1rem;
  align-items:flex-start;
  padding:.9rem;
  border:1px solid var(--border);
  border-radius:12px;
  background:white;
  margin-bottom:.6rem;
}

.ev-date{
  background:var(--wial-red);
  color:white;
  border-radius:10px;
  padding:.45rem .7rem;
  text-align:center;
  min-width:44px;
  flex-shrink:0;
}

.ev-date .d{
  font-size:1.1rem;
  font-weight:800;
  line-height:1;
}

.ev-date .m{
  font-size:.65rem;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.ev-rsvp{
  background:#e8f8f2;
  color:var(--green);
  border:1px solid #b0e0cc;
  border-radius:999px;
  padding:.15rem .5rem;
  font-size:.72rem;
  font-weight:800;
}

.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  margin-top:1.75rem;
}

.contact-block{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.5rem;
  box-shadow:var(--shadow);
}

.contact-block h3{
  font-size:1.1rem;
  font-weight:800;
  color:var(--wial-navy);
  margin-bottom:1rem;
}

.cf-field{
  margin-bottom:.9rem;
}

.cf-field label{
  display:block;
  font-size:.78rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--muted);
  margin-bottom:.4rem;
}

.cf-field input,
.cf-field select,
.cf-field textarea{
  width:100%;
  padding:.7rem .9rem;
  border:1px solid var(--border);
  border-radius:9px;
  font-size:.9rem;
  outline:none;
  background:white;
}

.cf-field input:focus,
.cf-field textarea:focus{
  border-color:var(--wial-teal);
}

.cf-field textarea{
  min-height:90px;
  resize:vertical;
}

.cf-submit{
  background:var(--wial-red);
  color:white;
  border:none;
  border-radius:9px;
  padding:.75rem 1.5rem;
  font-weight:700;
  cursor:pointer;
  font-size:.9rem;
}

.cf-submit:hover{
  opacity:.88;
}

.site-footer{
  background:var(--wial-navy);
  color:white;
  padding:2rem 4rem;
  margin-top:3rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:1rem;
}

#portalPage{
  display:none;
}

.login-wrap{
  min-height:80vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2rem;
}

.login-card{
  width:100%;
  max-width:520px;
  background:white;
  border:1px solid var(--border);
  border-radius:20px;
  padding:2rem;
  box-shadow:var(--shadow);
}

.login-logo-wrap{
  text-align:center;
  margin-bottom:1.5rem;
  padding-bottom:1.25rem;
  border-bottom:1px solid var(--border);
}

.login-badge{
  display:inline-block;
  background:#fff0f0;
  color:var(--wial-red);
  border:1px solid #f5c5c5;
  border-radius:999px;
  padding:.3rem .9rem;
  font-size:.75rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:.6rem;
}

.login-logo-wrap h2{
  font-family:"Playfair Display",serif;
  font-size:1.6rem;
  color:var(--wial-navy);
}

.login-logo-wrap p{
  font-size:.85rem;
  color:var(--muted);
  margin-top:.3rem;
}

.tab-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  background:var(--bg);
  border-radius:10px;
  padding:.25rem;
  margin-bottom:1.25rem;
  gap:.25rem;
}

.tab-btn{
  border:none;
  background:transparent;
  border-radius:8px;
  padding:.65rem;
  font-weight:600;
  color:var(--muted);
  cursor:pointer;
  font-size:.9rem;
}

.tab-btn.act{
  background:white;
  color:var(--text);
  box-shadow:0 2px 8px rgba(23,50,77,.08);
}

.f-field{
  margin-bottom:1rem;
}

.f-field label{
  display:block;
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--muted);
  margin-bottom:.4rem;
}

.f-field input,
.f-field select,
.f-field textarea{
  width:100%;
  background:white;
  color:var(--text);
  border:1px solid var(--border);
  border-radius:9px;
  padding:.8rem .9rem;
  outline:none;
  transition:border-color .2s;
}

.f-field input:focus,
.f-field select:focus{
  border-color:var(--wial-teal);
}

.login-btn{
  width:100%;
  padding:.9rem;
  margin-top:.5rem;
  background:var(--wial-red);
  color:white;
  border:none;
  border-radius:9px;
  font-weight:800;
  font-size:.95rem;
  cursor:pointer;
}

.login-btn:hover{
  opacity:.88;
}

.back-link{
  display:block;
  text-align:center;
  margin-top:.9rem;
  background:none;
  border:none;
  color:var(--muted);
  font-size:.85rem;
  cursor:pointer;
}

#dashPage{
  display:none;
}

#dashPage.show{
  display:flex;
  min-height:100vh;
}

.sidebar{
  width:255px;
  background:var(--wial-navy);
  padding:1.25rem 1rem;
  position:sticky;
  top:0;
  height:100vh;
  overflow-y:auto;
  flex-shrink:0;
}

.s-logo{
  display:flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:1.25rem;
  padding-bottom:1rem;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.s-icon{
  width:36px;
  height:36px;
  border-radius:9px;
  background:var(--wial-red);
  display:grid;
  place-items:center;
  color:white;
  font-weight:800;
  font-size:.9rem;
}

.s-logo span{
  color:white;
  font-weight:800;
  font-size:1.1rem;
}

.s-profile{
  background:rgba(255,255,255,.08);
  border-radius:12px;
  padding:.75rem;
  display:flex;
  gap:.6rem;
  align-items:center;
  margin-bottom:1rem;
}

.s-av{
  width:40px;
  height:40px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:white;
  background:var(--wial-red);
  font-weight:800;
  flex-shrink:0;
  font-size:.9rem;
}

.s-name{
  color:white;
  font-weight:700;
  font-size:.88rem;
}

.s-role{
  color:rgba(255,255,255,.5);
  font-size:.75rem;
  margin-top:.1rem;
}

.nav-lbl{
  font-size:.68rem;
  color:rgba(255,255,255,.4);
  text-transform:uppercase;
  letter-spacing:.1em;
  margin:1rem .5rem .5rem;
  font-weight:700;
}

.ni{
  width:100%;
  border:none;
  background:transparent;
  border-radius:9px;
  padding:.6rem .75rem;
  text-align:left;
  cursor:pointer;
  color:rgba(255,255,255,.7);
  display:flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:.15rem;
  font-size:.88rem;
  transition:all .2s;
}

.ni:hover{
  background:rgba(255,255,255,.08);
  color:white;
}

.ni.act{
  background:var(--wial-red);
  color:white;
}

.ni .ico{
  width:16px;
  text-align:center;
  font-size:.82rem;
}

.s-foot{
  margin-top:auto;
  padding-top:1rem;
  border-top:1px solid rgba(255,255,255,.1);
}

.s-logout{
  width:100%;
  padding:.65rem;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.7);
  border-radius:9px;
  cursor:pointer;
  font-size:.85rem;
  font-weight:600;
}

.s-logout:hover{
  background:rgba(255,255,255,.12);
  color:white;
}

.dash-main{
  flex:1;
  background:var(--bg-soft);
  display:flex;
  flex-direction:column;
}

.dash-top{
  background:white;
  border-bottom:1px solid var(--border);
  padding:1rem 1.75rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  position:sticky;
  top:0;
  z-index:50;
}

.dash-top h2{
  font-size:1.25rem;
  font-weight:800;
  color:var(--wial-navy);
}

.dash-top p{
  font-size:.82rem;
  color:var(--muted);
  margin-top:.15rem;
}

.d-actions{
  display:flex;
  gap:.6rem;
  align-items:center;
}

.d-pill{
  border:1px solid var(--border);
  background:var(--bg);
  padding:.45rem .9rem;
  border-radius:999px;
  font-size:.82rem;
}

.dash-body{
  flex:1;
  padding:1.5rem 1.75rem;
}

.d-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:1rem;
}

.core-pages-bar{
  background:var(--bg);
  border-bottom:1px solid var(--border);
  padding:.5rem 1.75rem;
  display:flex;
  gap:.4rem;
  flex-wrap:wrap;
}

.cpb{
  background:white;
  border:1px solid var(--border);
  border-radius:999px;
  padding:.35rem .9rem;
  font-size:.8rem;
  font-weight:600;
  cursor:pointer;
  color:var(--text);
  transition:all .2s;
}

.cpb:hover,
.cpb.act{
  background:var(--wial-red);
  color:white;
  border-color:var(--wial-red);
}

.core-page-panel{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.5rem;
  box-shadow:var(--shadow);
  grid-column:span 12;
  display:none;
}

.core-page-panel.show{
  display:block;
}

.dc{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.1rem;
  box-shadow:var(--shadow);
}

.s3{
  grid-column:span 3;
}

.s4{
  grid-column:span 4;
}

.s5{
  grid-column:span 5;
}

.s6{
  grid-column:span 6;
}

.s7{
  grid-column:span 7;
}

.s8{
  grid-column:span 8;
}

.s12{
  grid-column:span 12;
}

.dct{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.73rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  margin-bottom:.9rem;
}

.dd{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--wial-red);
}

.dm{
  font-size:2.1rem;
  font-weight:800;
  color:var(--wial-navy);
  line-height:1;
  margin-bottom:.3rem;
}

.dmeta{
  font-size:.85rem;
  color:var(--muted);
}

.dr{
  display:flex;
  justify-content:space-between;
  padding:.55rem .75rem;
  border-radius:9px;
  background:var(--bg);
  font-size:.88rem;
  margin-bottom:.35rem;
  gap:.5rem;
  align-items:flex-start;
}

.dr span{
  color:var(--muted);
}

.dr strong{
  text-align:right;
  color:var(--text);
}

.chip{
  display:inline-flex;
  padding:.2rem .6rem;
  border-radius:999px;
  font-size:.72rem;
  font-weight:800;
}

.chip.b{
  background:#eef7fd;
  color:var(--blue);
}

.chip.g{
  background:#e8f8f2;
  color:var(--green);
}

.chip.o{
  background:#fdf5e0;
  color:var(--orange);
}

.chip.r{
  background:#fdf0e8;
  color:var(--red);
}

.chip.t{
  background:#e0f7fa;
  color:#007b8a;
}

.db{
  border:none;
  border-radius:9px;
  padding:.6rem 1rem;
  font-weight:700;
  cursor:pointer;
  font-size:.85rem;
  transition:opacity .15s;
}

.db:hover{
  opacity:.85;
}

.db.p{
  background:var(--wial-red);
  color:white;
}

.db.s{
  background:var(--green);
  color:white;
}

.db.g{
  background:var(--bg);
  color:var(--text);
}

.db.w{
  background:#fff8e0;
  color:#7a5800;
}

.db.d{
  background:#fff1e9;
  color:var(--red);
}

.brow{
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}

.ib{
  background:#eef7fd;
  border:1px solid #b8d9f0;
  border-radius:9px;
  padding:.6rem .9rem;
  font-size:.82rem;
  color:var(--blue);
  margin-bottom:.75rem;
  line-height:1.55;
}

.pb{
  height:8px;
  background:#e0e8f0;
  border-radius:999px;
  overflow:hidden;
  margin-top:.35rem;
}

.pf{
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--wial-teal),var(--blue));
}

.payment-flow{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  margin-top:1rem;
}

.pf-step{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:12px;
  padding:1rem;
  text-align:center;
}

.pf-step .ps-num{
  width:32px;
  height:32px;
  border-radius:50%;
  background:var(--wial-red);
  color:white;
  display:grid;
  place-items:center;
  font-weight:800;
  font-size:.9rem;
  margin:0 auto .6rem;
}

.pf-step .ps-title{
  font-weight:700;
  font-size:.9rem;
  margin-bottom:.3rem;
}

.pf-step .ps-desc{
  font-size:.78rem;
  color:var(--muted);
  line-height:1.5;
}

.pf-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.5rem;
  color:var(--muted);
}

.map-wrap{
  position:relative;
  background:linear-gradient(180deg,#dbeeff,#eef5fb);
  border-radius:12px;
  overflow:hidden;
}

.map-svg{
  width:100%;
  height:auto;
  display:block;
}

.map-tip{
  position:absolute;
  background:var(--wial-navy);
  color:white;
  padding:.55rem .85rem;
  border-radius:9px;
  font-size:.8rem;
  font-weight:600;
  pointer-events:none;
  display:none;
  z-index:10;
  white-space:nowrap;
  box-shadow:0 4px 16px rgba(0,0,0,.2);
}

.map-tip::after{
  content:'';
  position:absolute;
  bottom:-5px;
  left:50%;
  transform:translateX(-50%);
  border:5px solid transparent;
  border-bottom:none;
  border-top-color:var(--wial-navy);
}

.map-pin{
  cursor:pointer;
}

.map-pin .mo{
  transition:opacity .2s;
}

.map-pin:hover .mo{
  opacity:.7;
}

.map-pin.sel .mi{
  fill:var(--wial-navy)!important;
}

.cl-hero{
  background:linear-gradient(135deg,var(--wial-navy),#1e4a6e,var(--wial-teal));
  border-radius:var(--radius);
  padding:1.75rem 2rem;
  color:white;
  grid-column:span 12;
}

.cl-hero h2{
  font-family:"Playfair Display",serif;
  font-size:1.75rem;
  margin-bottom:.5rem;
}

.cl-hero p{
  opacity:.8;
  font-size:.9rem;
  margin-bottom:1.25rem;
}

.cl-search{
  display:flex;
  gap:.6rem;
  margin-bottom:1rem;
}

.cl-inp{
  flex:1;
  padding:1rem 1.25rem;
  border-radius:10px;
  border:none;
  font-size:.95rem;
  background:rgba(255,255,255,.95);
  color:var(--text);
  outline:none;
}

.cl-btn{
  padding:1rem 1.5rem;
  border-radius:10px;
  background:var(--wial-red);
  color:white;
  border:none;
  font-weight:800;
  font-size:.9rem;
  cursor:pointer;
  white-space:nowrap;
}

.skill-pills{
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}

.sp{
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.3);
  color:white;
  border-radius:999px;
  padding:.4rem .9rem;
  font-size:.78rem;
  cursor:pointer;
  font-weight:600;
  transition:all .2s;
}

.sp:hover,
.sp.on{
  background:white;
  color:var(--wial-navy);
}

.vis-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.75rem;
  grid-column:span 12;
}

.vb{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1rem;
  text-align:center;
  box-shadow:var(--shadow);
}

.vb .vi{
  font-size:1.6rem;
  margin-bottom:.3rem;
}

.vb .vn{
  font-size:1.9rem;
  font-weight:800;
  color:var(--wial-navy);
  line-height:1;
}

.vb .vl{
  font-size:.78rem;
  color:var(--muted);
  margin-top:.2rem;
}

.c-res{
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.1rem;
  margin-bottom:.75rem;
  animation:fi .3s ease;
}

@keyframes fi{
  from{
    opacity:0;
    transform:translateY(6px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.c-res-h{
  display:flex;
  gap:.9rem;
  margin-bottom:.9rem;
}

.cav{
  width:52px;
  height:52px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:white;
  font-weight:800;
  font-size:1.1rem;
  flex-shrink:0;
}

.cname{
  font-size:1.05rem;
  font-weight:800;
  color:var(--wial-navy);
}

.c-badges{
  display:flex;
  flex-wrap:wrap;
  gap:.3rem;
  margin-top:.4rem;
}

.cbg{
  padding:.15rem .6rem;
  border-radius:999px;
  font-size:.7rem;
  font-weight:700;
  background:#fff8e0;
  border:1px solid #f1dfb0;
  color:#7a5800;
}

.cbg.cert{
  background:#eef7fd;
  border-color:#b8d9f0;
  color:var(--blue);
}

.c-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.5rem;
  margin-bottom:.75rem;
}

.cst{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:9px;
  padding:.6rem;
  text-align:center;
}

.cst .cv{
  font-size:1.1rem;
  font-weight:800;
  color:var(--wial-navy);
}

.cst .cl{
  font-size:.68rem;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-top:.1rem;
}

.c-hist{
  background:var(--bg);
  border-radius:9px;
  padding:.7rem;
  font-size:.82rem;
  margin-bottom:.5rem;
}

.c-hist-l{
  font-size:.68rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--muted);
  margin-bottom:.3rem;
}

.ai-why{
  background:#eef7fd;
  border:1px solid #b8d9f0;
  border-radius:9px;
  padding:.6rem .8rem;
  font-size:.82rem;
  color:var(--blue);
  margin-bottom:.6rem;
}

.donut-wrap{
  display:flex;
  gap:1.25rem;
  align-items:center;
}

.dleg{
  display:grid;
  gap:.45rem;
}

.dleg-r{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.85rem;
  color:var(--muted);
}

.dleg-d{
  width:9px;
  height:9px;
  border-radius:50%;
  flex-shrink:0;
}

.bars-wrap{
  display:flex;
  align-items:flex-end;
  gap:.6rem;
  height:110px;
  margin-top:.6rem;
}

.bar-col{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.25rem;
}

.bar-v{
  border-radius:4px 4px 0 0;
  width:100%;
  background:linear-gradient(180deg,var(--wial-teal),var(--blue));
}

.bar-l{
  font-size:.7rem;
  color:var(--muted);
}

.bq-item{
  border:1px solid var(--border);
  border-radius:11px;
  padding:.9rem;
  margin-bottom:.6rem;
  display:flex;
  gap:.9rem;
  align-items:center;
}

.bq-item.pend{
  border-left:4px solid var(--orange);
}

.bq-item.ok{
  border-left:4px solid var(--green);
}

.ce-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:.6rem .75rem;
  border-radius:9px;
  background:var(--bg);
  margin-bottom:.45rem;
}

.sess-item{
  padding:.6rem .75rem;
  border-radius:9px;
  background:var(--bg);
  margin-bottom:.45rem;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:.75rem;
}

.ft{
  border:1px solid var(--border);
  background:var(--bg);
  border-radius:11px;
  padding:.75rem .9rem;
  margin-bottom:.5rem;
}

.ft:hover{
  border-color:var(--wial-teal);
}

.ft-tag{
  background:#eef7fd;
  color:var(--blue);
  border-radius:999px;
  padding:.1rem .5rem;
  font-size:.72rem;
  font-weight:700;
}

.jb{
  border:1px solid var(--border);
  background:var(--bg);
  border-radius:11px;
  padding:.75rem .9rem;
  margin-bottom:.5rem;
}

.jb:hover{
  border-color:var(--green);
}

.etmpl{
  background:white;
  border:1px solid var(--border);
  border-radius:11px;
  padding:.9rem;
  margin-bottom:.6rem;
}

.etmpl-h{
  background:linear-gradient(135deg,var(--wial-navy),var(--blue));
  color:white;
  border-radius:8px;
  padding:.55rem .8rem;
  margin-bottom:.6rem;
  font-weight:700;
  font-size:.85rem;
}

.funnel{
  display:grid;
  gap:.4rem;
  margin-top:.6rem;
}

.fn{
  padding:.7rem .9rem;
  border-radius:10px;
  color:white;
  font-weight:700;
  font-size:.85rem;
}

.tcard{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:11px;
  padding:.9rem;
  margin-bottom:.6rem;
}

.modal{
  position:fixed;
  inset:0;
  background:rgba(23,50,77,.3);
  display:none;
  align-items:center;
  justify-content:center;
  padding:1.25rem;
  z-index:300;
}

.modal.show{
  display:flex;
}

.mbox{
  width:100%;
  max-width:560px;
  background:white;
  border-radius:18px;
  border:1px solid var(--border);
  padding:1.5rem;
  box-shadow:0 24px 64px rgba(23,50,77,.18);
  max-height:90vh;
  overflow-y:auto;
}

.mbox h3{
  font-size:1.25rem;
  font-weight:800;
  color:var(--wial-navy);
  margin-bottom:.4rem;
}

.mbox p{
  font-size:.88rem;
  color:var(--muted);
  margin-bottom:1rem;
}

.chat-w{
  position:fixed;
  bottom:1.5rem;
  right:1.5rem;
  z-index:999;
}

.chat-t{
  width:52px;
  height:52px;
  border-radius:50%;
  background:var(--wial-red);
  color:white;
  border:none;
  font-size:1.3rem;
  cursor:pointer;
  box-shadow:0 6px 20px rgba(192,21,42,.35);
  display:flex;
  align-items:center;
  justify-content:center;
}

.chat-p{
  position:absolute;
  bottom:64px;
  right:0;
  width:330px;
  background:white;
  border-radius:16px;
  border:1px solid var(--border);
  box-shadow:0 16px 48px rgba(0,0,0,.14);
  display:none;
  flex-direction:column;
  overflow:hidden;
  max-height:490px;
}

.chat-p.open{
  display:flex;
}

.ch{
  background:linear-gradient(135deg,var(--wial-navy),var(--wial-teal));
  color:white;
  padding:.9rem 1rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.ch h4{
  margin:0;
  font-size:.9rem;
}

.ch button{
  background:none;
  border:none;
  color:white;
  font-size:1.1rem;
  cursor:pointer;
}

.cms{
  flex:1;
  overflow-y:auto;
  padding:.75rem;
  display:flex;
  flex-direction:column;
  gap:.5rem;
  min-height:200px;
  max-height:280px;
}

.cm{
  padding:.6rem .8rem;
  border-radius:10px;
  font-size:.82rem;
  line-height:1.5;
  max-width:88%;
}

.cm.b{
  background:#eef4f9;
  align-self:flex-start;
  border-bottom-left-radius:3px;
}

.cm.u{
  background:var(--wial-red);
  color:white;
  align-self:flex-end;
  border-bottom-right-radius:3px;
}

.csrow{
  padding:0 .65rem .5rem;
  display:flex;
  flex-wrap:wrap;
  gap:.3rem;
}

.cs{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:999px;
  padding:.3rem .75rem;
  font-size:.75rem;
  cursor:pointer;
  color:var(--text);
}

.cs:hover{
  background:#eef4f9;
}

.cir{
  padding:.6rem;
  border-top:1px solid var(--border);
  display:flex;
  gap:.5rem;
}

.ci{
  flex:1;
  border:1px solid var(--border);
  border-radius:8px;
  padding:.6rem .75rem;
  outline:none;
  font-size:.82rem;
}

.ci:focus{
  border-color:var(--wial-teal);
}

.csend{
  background:var(--wial-red);
  color:white;
  border:none;
  border-radius:8px;
  padding:.6rem .9rem;
  cursor:pointer;
  font-weight:700;
}

.hidden{
  display:none !important;
}

@media(max-width:1100px){
  .d-grid{
    grid-template-columns:repeat(6,minmax(0,1fr));
  }

  .s3,
  .s4,
  .s5,
  .s6,
  .s7,
  .s8,
  .s12{
    grid-column:span 6;
  }

  .cert-grid{
    grid-template-columns:1fr 1fr;
  }

  .three-col,
  .clients-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .dir-grid,
  .res-grid{
    grid-template-columns:1fr 1fr;
  }

  .vis-row{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:768px){
  .hero{
    flex-direction:column;
    padding:3rem 1.5rem;
  }

  .hero h1{
    font-size:2rem;
  }

  .site-nav{
    display:none;
  }

  .page-wrap{
    padding:0 1rem;
  }

  .sec{
    padding:2.5rem 0;
  }

  .dir-grid,
  .cert-grid,
  .res-grid,
  .clients-grid{
    grid-template-columns:1fr;
  }

  .contact-grid{
    grid-template-columns:1fr;
  }

  .payment-flow{
    grid-template-columns:1fr;
  }

  .vis-row{
    grid-template-columns:1fr 1fr;
  }

  #dashPage.show{
    display:block;
  }

  .sidebar{
    width:100%;
    height:auto;
    position:static;
  }
}