:root{--primary:#374151;--primary-ink:#111827;--muted:#6B7280;--bg:#F3F4F6;--card:#ffffff;--shadow:0 8px 24px rgba(17,24,39,.08);--nav-h:84px;--hero-h:clamp(460px,calc(100svh - var(--nav-h)),900px)}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;color:var(--primary-ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:var(--primary-ink);text-decoration:none}
img{max-width:100%;height:auto;display:block}
:focus-visible{outline:2px solid #4B5563;outline-offset:2px}
#loader{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;background:linear-gradient(135deg,#2f3642,#3a414d)}
#loader::after{content:"";width:56px;height:56px;border-radius:999px;border:4px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
header{position:relative;z-index:1040}
header .navbar{background:transparent;transition:background .25s ease,box-shadow .25s ease,backdrop-filter .25s ease}
header.scrolled .navbar{background:linear-gradient(135deg,#2f3642ee,#3a414dee);backdrop-filter:saturate(140%) blur(8px);box-shadow:0 6px 22px rgba(12,10,24,.25)}
header .navbar .navbar-brand .logo{height:36px;width:auto}
header .navbar .navbar-brand .brand-text{margin-left:.5rem;font-weight:700;color:#fff}
header .navbar .nav-link{color:#fff;padding:.75rem 1rem}
header .navbar .nav-link.active{font-weight:700}
#hero{position:relative;isolation:isolate;min-height:var(--hero-h);padding-top:var(--nav-h);color:#fff;background:#0d1117;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%;filter:contrast(1.03) saturate(1.02)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.50) 0%,rgba(0,0,0,.66) 45%,rgba(0,0,0,.72) 100%),radial-gradient(60% 50% at 50% 38%, rgba(255,255,255,.08), transparent 60%);pointer-events:none}
.hero-effects,.hero-particles{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero-particles .p{position:absolute;width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.22);box-shadow:0 0 22px rgba(255,255,255,.30);animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.p1{left:6%;top:78%;animation:float1 7s infinite}
.p2{left:18%;top:22%;width:8px;height:8px;animation:float2 6.5s infinite}
.p3{right:14%;top:30%;width:12px;height:12px;animation:float3 8s infinite}
.p4{right:28%;bottom:12%;width:9px;height:9px;animation:float2 7.2s infinite}
.p5{left:44%;top:12%;width:11px;height:11px;animation:float1 6.8s infinite}
@keyframes float1{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes float2{0%,100%{transform:translateY(0) translateX(0)}50%{transform:translateY(-12px) translateX(6px)}}
@keyframes float3{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-20px) scale(1.06)}}
.hero-inner{position:relative;z-index:2;min-height:calc(var(--hero-h) - var(--nav-h));display:flex;align-items:center;justify-content:center;padding:24px 16px}
.hero-content{max-width:860px;text-align:center;margin:0 auto}
.hero .topline{letter-spacing:.04em;text-transform:uppercase;color:#E5E7EB}
#hero h1{text-shadow:0 2px 18px rgba(0,0,0,.45)}
#hero .lead{text-shadow:0 1px 12px rgba(0,0,0,.35)}
.hero-cta{display:inline-flex;gap:.6rem;margin-top:.8rem;flex-wrap:wrap}
.hero-metrics{margin-top:1rem;display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.hero-metrics .metric{display:flex;align-items:center;gap:.5rem;padding:.4rem .7rem;border-radius:.6rem;background:rgba(255,255,255,.10);color:#fff;border:1px solid rgba(255,255,255,.14);font-weight:600}
.breadcrumb-wrap{background:linear-gradient(0deg,#eef1f5,#f6f7f9);border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}
.breadcrumb{margin:0;padding:.75rem 0}
.breadcrumb .breadcrumb-item a{color:var(--muted)}
.breadcrumb .breadcrumb-item+.breadcrumb-item::before{color:#c5c9cf}
.breadcrumb .breadcrumb-item.active{color:var(--primary-ink)}
.section-plain{background:var(--bg)}
.section-tint{background:linear-gradient(180deg,#f1f3f6,#eef1f5)}
.section-title{font-weight:800;color:var(--primary-ink);display:flex;align-items:center;gap:.5rem}
.feature-box{background:var(--card);border:1px solid #eceff3;border-radius:1rem;box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease}
.feature-box .icon{color:#374151;display:inline-block;transition:transform .25s ease,filter .25s ease}
.feature-box h5,.feature-box .h5{font-weight:700;color:var(--primary-ink)}
.feature-box p{color:#4B5563}
.feature-box:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(17,24,39,.12);border-color:#e2e6ec;background:#fff}
.feature-box:hover .icon{transform:translateY(-3px) scale(1.03);filter:drop-shadow(0 4px 10px rgba(17,24,39,.15))}
.accordion .accordion-item{border:1px solid #e5e7eb;border-radius:.75rem;overflow:hidden;background:#fff;box-shadow:0 4px 14px rgba(17,24,39,.05)}
.accordion-button{background:linear-gradient(0deg,#ffffff,#fafafa);color:var(--primary-ink);font-weight:700}
.accordion-button:not(.collapsed){background:#f7f9fc}
.cta-section{position:relative;padding:72px 0;text-align:center;background:linear-gradient(180deg,#2f3642 0%,#3a414d 100%);color:#fff}
.cta-section .cta-overlay{position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 40%, rgba(255,255,255,.08), transparent 60%)}
.site-footer{background:#0f1217;color:#b9c2cf;padding:36px 0}
.site-footer a{color:#d7dde6}
.site-footer a:hover{color:#fff}
.site-footer .footer-logo{width:180px;height:180px;object-fit:contain;filter:grayscale(.1) contrast(1.05)}
.site-footer .sep{border-color:rgba(255,255,255,.08)}
.footer-bottom{display:flex;gap:1rem;flex-wrap:wrap;justify-content:space-between;color:#93A1B3}
.social .social-link{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#4b5563,#374151);color:#fff;border:1px solid rgba(255,255,255,.08);transition:transform .2s ease,filter .2s ease}
.social .social-link:hover{transform:translateY(-2px);filter:brightness(1.1)}
main section{padding-top:2.25rem;padding-bottom:2.25rem}
img[loading="lazy"]{opacity:.001;transition:opacity .35s ease}
img.lazyloaded{opacity:1}
@media (max-width:1199.98px){:root{--nav-h:80px}#hero{padding-top:var(--nav-h)}.hero-bg{object-position:50% 40%}}
@media (max-width:991.98px){:root{--nav-h:72px}#hero{padding-top:var(--nav-h)}header .navbar .navbar-collapse{background:#0f1217;border-top:1px solid rgba(255,255,255,.08)}}
@media (max-width:575.98px){:root{--nav-h:68px}.hero-bg{object-position:50% 35%}}
@media (max-width:991.98px){
  #navMenu{position:fixed;top:var(--nav-h);right:-100%;width:82%;height:calc(100vh - var(--nav-h));background:linear-gradient(135deg,#2f3642,#3a414d);padding:14px;border-top-left-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.28);transition:right .25s ease;z-index:1056}
  #navMenu.show{right:0}
  #navMenu .main-nav{flex-direction:column;align-items:stretch;gap:8px}
  #navMenu .nav-link{display:block;color:#fff!important;font-weight:600;padding:12px 10px;border-radius:10px}
  #navMenu .nav-link.active{background:rgba(255,255,255,.14)}
  #navMenu .btn{align-self:flex-start}
}
@media (prefers-reduced-motion:reduce){.feature-box,.hero-particles .p{transition:none!important;animation:none!important}}