:root {
  --saintec-blue: #0057A8;
  --saintec-blue-dark: #003D7A;
  --saintec-teal: #00B8A9;
  --saintec-green: #36B449;
  --saintec-dark: #172033;
  --saintec-muted: #64748b;
  --saintec-soft: #eef8f8;
  --saintec-border: #dfecef;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--saintec-dark); background: #ffffff; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: var(--saintec-blue); }
.topbar { background: linear-gradient(90deg, var(--saintec-blue-dark), var(--saintec-teal)); color: #fff; font-size: .92rem; }
.topbar a, .topbar span { color: #fff; text-decoration: none; }
.site-header { z-index: 1030; }
.brand-logo { max-height: 58px; max-width: 245px; width: auto; object-fit: contain; }
.brand-text { font-weight: 800; color: var(--saintec-blue); letter-spacing: .04em; }
.nav-link { font-weight: 700; color: #26364d !important; }
.nav-link:hover { color: var(--saintec-teal) !important; }
.btn-saintec { border: 0; background: linear-gradient(135deg, var(--saintec-blue), var(--saintec-teal)); color: #fff; border-radius: 999px; font-weight: 800; padding: .78rem 1.35rem; box-shadow: 0 14px 30px rgba(0, 87, 168, .18); }
.btn-saintec:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 18px 35px rgba(0, 87, 168, .28); }
.btn-outline-saintec { border: 2px solid var(--saintec-teal); color: var(--saintec-blue-dark); border-radius: 999px; font-weight: 800; padding: .7rem 1.25rem; background: #fff; }
.btn-outline-saintec:hover { background: var(--saintec-teal); color: #fff; }
.hero-section { position: relative; overflow: hidden; padding: 90px 0; background: radial-gradient(circle at 12% 20%, rgba(0,184,169,.14), transparent 32%), radial-gradient(circle at 86% 8%, rgba(54,180,73,.14), transparent 32%), linear-gradient(135deg, #f7fcff 0%, #effafa 52%, #ffffff 100%); }
.hero-section:after { content: ""; position: absolute; right: -160px; bottom: -220px; width: 620px; height: 620px; border-radius: 50%; background: linear-gradient(135deg, rgba(0,87,168,.12), rgba(0,184,169,.08)); }
.hero-section .container { position: relative; z-index: 2; }
.eyebrow { display: inline-flex; align-items: center; gap: .5rem; color: var(--saintec-blue); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: .82rem; margin-bottom: 1rem; }
.hero-section h1 { font-size: clamp(2.5rem, 6vw, 5rem); line-height: .98; letter-spacing: -0.055em; font-weight: 900; max-width: 850px; margin-bottom: 1.25rem; color: var(--saintec-dark); }
.hero-copy { font-size: 1.18rem; line-height: 1.75; color: #45556f; max-width: 720px; }
.hero-card { background: rgba(255,255,255,.86); backdrop-filter: blur(14px); border: 1px solid rgba(0,184,169,.18); border-radius: 30px; box-shadow: 0 24px 70px rgba(0, 61, 122, .13); padding: 32px; }
.form-header span, .section-title span { color: var(--saintec-teal); font-weight: 900; text-transform: uppercase; letter-spacing: .12em; font-size: .78rem; }
.form-header h2 { font-weight: 900; letter-spacing: -0.035em; margin: .25rem 0 .3rem; }
.form-control, .form-select { border-radius: 14px; border-color: #d6e5e8; padding: .82rem .95rem; }
.form-control:focus, .form-select:focus { box-shadow: 0 0 0 .25rem rgba(0,184,169,.16); border-color: var(--saintec-teal); }
.hero-trust strong { display: block; font-size: 1.2rem; color: var(--saintec-blue-dark); }
.hero-trust span { color: var(--saintec-muted); font-size: .92rem; }
.section { padding: 90px 0; }
.section-soft { background: var(--saintec-soft); }
.section-title { max-width: 760px; margin-bottom: 46px; }
.section-title h2, .section-heading { font-weight: 900; letter-spacing: -0.04em; line-height: 1.08; color: var(--saintec-dark); }
.section-title h2 { font-size: clamp(2rem, 4vw, 3.3rem); }
.section-title p, .section p { color: #55667d; line-height: 1.75; }
.service-card { height: 100%; padding: 32px; border: 1px solid var(--saintec-border); border-radius: 28px; background: #fff; transition: .25s ease; position: relative; overflow: hidden; }
.service-card:before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,87,168,.08), rgba(0,184,169,.08)); opacity: 0; transition: .25s ease; }
.service-card:hover { transform: translateY(-6px); box-shadow: 0 24px 50px rgba(0,61,122,.11); }
.service-card:hover:before { opacity: 1; }
.service-card > * { position: relative; z-index: 1; }
.service-icon { width: 68px; height: 68px; display: grid; place-items: center; border-radius: 22px; color: #fff; background: linear-gradient(135deg, var(--saintec-blue), var(--saintec-teal)); font-size: 1.8rem; margin-bottom: 22px; }
.service-card h3 { font-weight: 850; font-size: 1.28rem; margin-bottom: .75rem; }
.shadow-soft { box-shadow: 0 24px 55px rgba(0,61,122,.14); }
.mini-card { background: #fff; border: 1px solid var(--saintec-border); border-radius: 20px; padding: 20px; height: 100%; }
.mini-card strong { display: block; color: var(--saintec-blue-dark); font-size: 1.1rem; }
.mini-card span { color: var(--saintec-muted); }
.area-item { height: 100%; display: flex; align-items: flex-start; gap: 12px; padding: 20px; border-radius: 20px; background: #fff; border: 1px solid var(--saintec-border); box-shadow: 0 12px 28px rgba(0,61,122,.06); font-weight: 700; }
.area-item i { color: var(--saintec-green); flex: 0 0 auto; }
.process-band { padding: 70px 0; background: linear-gradient(135deg, var(--saintec-blue-dark), var(--saintec-blue), var(--saintec-teal)); }
.process-card { height: 100%; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.20); border-radius: 26px; padding: 30px; color: #fff; }
.process-card span { color: #aef3e9; font-weight: 900; letter-spacing: .1em; }
.process-card h3 { font-weight: 900; margin: .5rem 0 .8rem; }
.process-card p { color: rgba(255,255,255,.84); margin: 0; }
.cta-section { background: #fff; }
.cta-box { border-radius: 34px; padding: 55px 28px; background: radial-gradient(circle at 10% 20%, rgba(0,184,169,.14), transparent 30%), radial-gradient(circle at 95% 0%, rgba(54,180,73,.14), transparent 30%), #f7fcff; border: 1px solid var(--saintec-border); }
.cta-logo { max-width: 310px; max-height: 100px; object-fit: contain; margin-bottom: 20px; }
.cta-box h2 { font-weight: 900; letter-spacing: -0.04em; }
.footer { background: #101827; color: rgba(255,255,255,.76); padding: 60px 0 24px; }
.footer-logo { max-width: 250px; max-height: 78px; object-fit: contain; background: #fff; border-radius: 14px; padding: 8px; margin-bottom: 18px; }
.footer h4 { color: #fff; font-weight: 850; margin-bottom: 15px; }
.footer a { display: block; color: rgba(255,255,255,.75); text-decoration: none; margin-bottom: 9px; }
.footer a:hover { color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 35px; padding-top: 22px; text-align: center; color: rgba(255,255,255,.55); }
.legal-body { background: #f5fafb; }
.legal-header { background: #fff; border-bottom: 1px solid var(--saintec-border); padding: 16px 0; position: sticky; top: 0; z-index: 1000; }
.legal-card { background: #fff; border-radius: 28px; padding: clamp(24px, 5vw, 54px); box-shadow: 0 22px 55px rgba(0,61,122,.10); }
.legal-card h2, .legal-card h3 { color: var(--saintec-blue-dark); font-weight: 850; margin-top: 28px; }
.legal-card p, .legal-card li { line-height: 1.78; color: #45556f; }
@media (max-width: 991px) {
  .hero-section { padding: 65px 0; }
  .brand-logo { max-width: 205px; }
  .hero-card { padding: 24px; }
  .section { padding: 70px 0; }
}