:root{--primary:#0f5bd3;--primary-dark:#073b8a;--accent:#08a44b;--bg:#f3f7fc;--text:#0f172a;--muted:#64748b;--border:rgba(148,163,184,.22);--shadow:0 12px 30px rgba(15,23,42,.10);--container:1120px}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,#fbfdff 0%,var(--bg) 100%);color:var(--text);min-height:100vh;padding-bottom:calc(78px + env(safe-area-inset-bottom))}
a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.container{width:min(calc(100% - 28px),var(--container));margin:0 auto}
.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);padding-top:calc(env(safe-area-inset-top) + 18px)}
.topbar-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:12px}.brand-logo{height:50px;width:auto}.brand-text strong{display:block;color:var(--primary-dark);font-size:1.08rem}.brand-text span{color:var(--muted);font-size:.9rem}
.top-social{display:flex;align-items:center;gap:8px}.top-social a{width:42px;height:42px;border-radius:14px;background:#eaf2ff;color:var(--primary-dark);display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:900}
.hero{padding:24px 0 16px}.hero-card{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:22px;background:linear-gradient(135deg,var(--primary-dark),var(--primary) 58%,var(--accent));color:white;border-radius:30px;padding:32px;box-shadow:var(--shadow)}
.badge{display:inline-flex;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);font-weight:700;font-size:.82rem;margin-bottom:14px}.hero h1{font-size:clamp(1.8rem,4vw,3.2rem);line-height:1.05;letter-spacing:-.04em}.hero p{margin-top:14px;line-height:1.65;color:rgba(255,255,255,.92)}
.search-panel{background:white;color:var(--text);border-radius:24px;padding:22px;box-shadow:0 18px 40px rgba(0,0,0,.12)}.search-panel label{display:block;font-weight:900;color:var(--primary-dark);margin-bottom:10px}.search-input-wrap{display:flex;align-items:center;gap:10px;border:1px solid #dbeafe;border-radius:18px;padding:0 14px;background:#f8fbff}.search-input-wrap input{width:100%;height:52px;border:0;background:transparent;outline:none;font-size:16px}.search-panel button{margin-top:10px;width:100%;height:42px;border:0;border-radius:14px;background:#eaf2ff;color:var(--primary-dark);font-weight:800}
.quick{padding:18px 0 34px}.service-section{background:white;border:1px solid var(--border);border-radius:24px;padding:18px;margin-bottom:18px;box-shadow:var(--shadow)}.section-title{text-align:center;margin-bottom:14px}.section-title h2{color:var(--primary-dark);font-size:1.3rem}.section-title p{color:var(--muted);font-size:.9rem;margin-top:4px}.section-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.education-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.service-card{background:linear-gradient(180deg,#fff,#f8fbff);border:1px solid var(--border);border-radius:18px;padding:13px 7px;min-height:112px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:7px;transition:.18s ease}.service-card:active{transform:scale(.98);opacity:.86}.service-card.hidden{display:none!important}
.icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:#eaf2ff;font-size:1.45rem}.service-card strong{color:var(--primary-dark);font-size:.82rem;line-height:1.18}.service-card small{color:var(--muted);line-height:1.3;font-size:.72rem}.service-section.hidden-section{display:none}.no-results{display:none;text-align:center;background:white;border:1px dashed #93c5fd;border-radius:20px;padding:20px;margin-bottom:18px;color:var(--primary-dark);font-weight:800}.no-results.show{display:block}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-top:1px solid var(--border);display:grid;grid-template-columns:repeat(4,1fr);padding:8px 8px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px rgba(15,23,42,.08)}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;border-radius:16px;color:var(--muted);font-weight:800}.nav-item span{font-size:20px}.nav-item small{font-size:11px}.nav-item.active{background:#eaf2ff;color:var(--primary-dark)}
.footer{padding:32px 0 calc(32px + env(safe-area-inset-bottom))}.footer-box{background:linear-gradient(135deg,#073b8a 0%,#0f5bd3 60%,#08a44b 100%);color:#fff;border-radius:22px;padding:24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;text-align:center}.footer-box p{margin:6px 0;color:rgba(255,255,255,.92);line-height:1.55}.footer-box a{color:#fff}
@media(max-width:900px){.hero-card{grid-template-columns:1fr}}
@media(max-width:640px){.container{width:min(calc(100% - 20px),var(--container))}.topbar-inner{min-height:72px}.brand-logo{height:42px}.top-social a{width:38px;height:38px}.hero-card{padding:22px;border-radius:24px}.section-grid{gap:9px}.service-card{min-height:105px;padding:11px 6px;border-radius:16px}.icon{width:42px;height:42px;border-radius:13px;font-size:1.35rem}.service-card strong{font-size:.76rem}.service-card small{display:none}}
@media(max-width:360px){.section-grid{gap:7px}.service-card strong{font-size:.70rem}}

.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.modal-box {
  background: #fff;
  border-radius: 22px;
  padding: 28px;
  max-width: 420px;
  width: 100%;
  text-align: center;
  box-shadow: 0 12px 40px rgba(0,0,0,0.25);
}

.modal-box h2 {
  color: #0b3d91;
  margin-bottom: 12px;
}

.modal-box p {
  color: #555;
  font-size: 16px;
  line-height: 1.5;
}

.modal-box button {
  width: 100%;
  margin-top: 14px;
  padding: 14px;
  border: none;
  border-radius: 14px;
  font-weight: 700;
  font-size: 15px;
  background: #0b3d91;
  color: #fff;
}

.cancel-btn {
  background: #e9eef8 !important;
  color: #0b3d91 !important;
}
