/* Compatibility layer for older desktop/mobile browsers. Keep after style.css. */
html{scroll-behavior:auto}
body{background:#071426;background-color:#071426;color:#e7efff;font-family:"B Nazanin",Tahoma,Arial,sans-serif}
a{color:inherit}
.topbar,.nav,.nav-actions,.hero-actions,.hero-meta,.section-head,.feature-band,.cta,.footer,.admin-nav,.admin-actions,.inline-form,.footer-links,.support-widget,.floating-support,.support-panel-head{display:flex}
.topbar,.section-head,.cta,.footer{justify-content:space-between}
.topbar,.footer{flex-wrap:wrap}
.topbar{align-items:center}
.brand{display:flex;align-items:center}
.page-shell{width:100%;max-width:1240px;margin:0 auto;padding:30px 24px 70px}
.hero{display:block;padding:40px 0}
.hero-copy,.hero-art{width:100%;max-width:100%}
.hero-art{min-height:300px;margin-top:20px;position:relative}
.grid,.service-grid,.feature-band,.post-grid,.form-layout,.form-grid,.stats-grid,.dash-layout,.two-col{display:flex;flex-wrap:wrap}
.service-card,.feature-card,.post-card,.stat-card{box-sizing:border-box;flex:1 1 260px;min-width:0;margin:7px}
.form-layout>*,.two-col>*{box-sizing:border-box;flex:1 1 300px;min-width:0}
.form-grid>.field{box-sizing:border-box;flex:1 1 220px;min-width:0}
.field.full{flex-basis:100%}
.stats-grid .stat-card{flex:1 1 180px}
.dash-layout>*{min-width:0}
.orbit{width:100%;max-width:420px;height:0;padding-bottom:min(100%,420px);margin:auto;position:relative}
.core,.service-icon,.arrow-btn,.float-icon,.brand-mark,.auth-logo{display:flex;align-items:center;justify-content:center}
.bank-track{display:flex;width:100%;animation:none;overflow-x:auto}
.bank-pill{flex:0 0 auto}
.btn{display:inline-block;text-align:center}
.field input,.field textarea,.field select{box-sizing:border-box;max-width:100%}
.table-wrap{max-width:100%;overflow-x:auto}
.data-table{min-width:650px}
.support-panel{width:370px;max-width:calc(100vw - 28px);height:540px;max-height:calc(100vh - 115px);box-sizing:border-box}
.support-panel[hidden]{display:none!important}
@media screen and (max-width:900px){.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(110px,.65fr);gap:12px;align-items:center}.hero-art{width:100%;min-height:0;margin:0}.orbit{width:100%;max-width:220px;height:auto;padding-bottom:100%}.core{width:34%;height:auto;aspect-ratio:1;font-size:clamp(22px,5vw,38px);border-radius:22%}.float-card{transform:scale(.72);transform-origin:center}.service-card,.post-card{flex-basis:42%}.feature-card{flex-basis:100%}.form-layout{display:block}.form-layout>*{margin-bottom:18px}.dash-layout{display:block}.side-nav{display:flex;flex-wrap:wrap}.stats-grid .stat-card{flex-basis:40%}}
@media screen and (max-width:560px){.hero{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(88px,.6fr);gap:8px;padding:24px 0 28px}.hero h1{font-size:clamp(20px,5.4vw,30px);line-height:1.4;margin:10px 0}.hero p{font-size:12px;line-height:1.8}.hero-art{min-height:0;margin:0}.orbit{width:100%;max-width:150px;padding-bottom:100%}.core{width:36%;font-size:24px;border-radius:22%}.float-card{transform:scale(.58)}.hero-actions{gap:6px;margin-top:12px}.hero-actions .btn{font-size:10px;padding:8px}.hero-meta{gap:8px;flex-wrap:wrap}.topbar{padding:14px 16px}.page-shell{padding:20px 16px 50px}.service-card,.post-card,.feature-card,.stat-card{flex-basis:100%;margin:6px 0}.hero h1{font-size:34px;letter-spacing:normal}.form-grid,.two-col{display:block}.form-grid .field{margin-bottom:12px}.cta,.footer{display:block}.footer>*{margin-bottom:16px}.support-panel{width:calc(100vw - 24px);height:calc(100vh - 95px);max-height:560px;min-height:300px}}
/* IE/older engines ignore unsupported custom properties; set legible base surfaces. */
.panel,.form-card,.stat-card,.feature-card,.service-card,.post-card,.side-nav{background:#0c1b32;border-color:#284465;color:#e7efff}
.field input,.field textarea,.field select,.inline-form select,.inline-form input{background:#071629;color:#fff;border:1px solid #254263}
.page-heading p,.muted,.small-note,.brand small,.footer{color:#a9bdd6}

/* Hero layout fix: keep the N illustration opposite the headline on mobile. */
.hero>div{min-width:0}.hero-art .orbit{box-sizing:border-box}.hero-art .float-card{max-width:145px}