
/* UFUQNET V2.6 — strong brand palette and reliable contrast */
:root {--bg:#041d31;--panel:#08344d;--panel2:#0b4661;--ink:#f7fdff;--muted:#c4e0ea;--blue:#087ea3;--blue2:#45d5e5;--line:#23627a;--light:#eaf8fb;--dark:#041d31}
html,body{background:#041d31;color:#f7fdff}
.topbar{background:#041d31!important;border-bottom:1px solid #1b617c!important}
.hero{background:linear-gradient(118deg,#041d31 0%,#075274 66%,#0a8aab 100%)!important}
.hero h1,.hero h1 span{color:#fff!important}
.hero h1 span{color:#67e8f2!important}
.hero .lead,.hero .trust span{color:#d9f1f7!important}
.hero-console{background:#06334b!important;border-color:#29849b!important}
.btn{background:#0a9bb6!important;border-color:#0a9bb6!important;color:#fff!important}
.btn:hover{background:#087e9c!important}
.btn.outline{background:transparent!important;border-color:#85dce8!important}
.light,.ecosystem,.veeam-section{background:#eaf8fb!important;color:#08314a!important}
.light h1,.light h2,.light h3,.ecosystem h1,.ecosystem h2,.ecosystem h3{color:#08314a!important}
.light p,.ecosystem p,.light .section-head p,.ecosystem .section-head p{color:#36566a!important}
.cards{background:#badde9!important;border-color:#badde9!important}
.card,.tech-card,.feature{background:#fff!important;color:#082b43!important}
.card h3,.tech-card h3{color:#082b43!important}
.card p,.tech-card p{color:#466479!important}
.card a{color:#087ea3!important}
.band{background:linear-gradient(115deg,#041d31,#075573)!important}
.business-section{background:linear-gradient(125deg,#074563 0%,#087b9b 60%,#0bacc2 100%)!important;color:#fff!important}
.business-section .section-head h2{color:#fff!important;opacity:1!important;filter:none!important}
.business-section .section-head p{color:#effcff!important;opacity:1!important;filter:none!important}
.business-section .showcase-card{background:#063047!important;border:1px solid #3d91a9!important}
.business-section .showcase-card h3{color:#fff!important}
.business-section .showcase-card p{color:#d8eff5!important}
.cta{background:linear-gradient(125deg,#041d31,#064867 75%,#087e9e)!important}
.cta h2,.cta h3,.cta .contact-copy h2{color:#fff!important}
.cta .contact-copy p{color:#d5edf4!important}
.form{background:#062c43!important;border-color:#3c829a!important}
.form label{color:#e8f8fc!important}
.form input,.form select,.form textarea{background:#041c2c!important;border:1px solid #50889b!important;color:#fff!important}
.form input::placeholder,.form textarea::placeholder{color:#aacbd8!important;opacity:1!important}
footer{background:#031725!important;color:#f3fbff!important}
footer .footer-contact h3,footer .footer-title{color:#fff!important}
footer .footer-company,footer a.footer-contact-row{color:#e1f3f9!important}
.footer-contact-icon{background:#0c455b!important;color:#5de0ec!important}
.page-hero{background:linear-gradient(115deg,#041d31,#075274)!important}
.page-hero h1{color:#fff!important}
.portal-shell{background:#041d31!important}
.service-icon:not(.service-brand-icon){background:#e6f7fc!important;border-color:#b7e0eb!important}

/* V2.7 contrast fix — Microsoft section on pale cyan */
section.ecosystem, section.ecosystem .section-head {color:#092e45!important}
section.ecosystem .section-head h2, section.ecosystem h2 {color:#092e45!important;-webkit-text-fill-color:#092e45!important;opacity:1!important;text-shadow:none!important}
section.ecosystem .section-head p {color:#31566b!important;-webkit-text-fill-color:#31566b!important;opacity:1!important}
section.ecosystem .eyebrow {color:#08799b!important}
section.ecosystem .section-head h2::selection,section.ecosystem .section-head p::selection {background:#a5d9f3;color:#082c42}

/* V2.8: Solutions section high-contrast correction */
section#solutions.band{color:#f7fdff!important}
section#solutions.band h2,section#solutions.band .solution h3{color:#ffffff!important;-webkit-text-fill-color:#ffffff!important;opacity:1!important;filter:none!important;text-shadow:none!important}
section#solutions.band .solution p{color:#e3f4fa!important;-webkit-text-fill-color:#e3f4fa!important;opacity:1!important;filter:none!important}
section#solutions.band .eyebrow{color:#66e0f0!important;-webkit-text-fill-color:#66e0f0!important;opacity:1!important}
section#solutions.band .solution{border-top-color:rgba(179,226,239,.32)!important}
section#solutions.band .fade.visible{opacity:1!important}

/* V2.9: Contact heading contrast fix */
section#contact.cta .contact-copy h2,
section#contact.cta .contact-copy h2[data-i18n="ready"] {
 color:#ffffff!important; -webkit-text-fill-color:#ffffff!important;
 opacity:1!important;filter:none!important;mix-blend-mode:normal!important;
 text-shadow:none!important;
}
section#contact.cta .contact-copy p {color:#e5f5fb!important;-webkit-text-fill-color:#e5f5fb!important;opacity:1!important;}
section#contact.cta .contact-copy .eyebrow{color:#6be0f1!important;opacity:1!important;}

/* V3.0: eliminate pale gap between contact section and footer */
html,body,main{background-color:#031725!important}
main{display:flow-root!important;margin:0!important;padding:0!important}
main>section#contact.cta{margin-bottom:0!important;border-bottom:0!important;display:flow-root!important}
main>section#contact.cta::after{content:none!important}
main+footer{margin-top:0!important;border-top:1px solid #21526a!important;background:#031725!important;position:relative!important}
/* Covers the stray pale interstitial strip if produced by older layout rules */
main+footer::before{content:"";position:absolute;bottom:100%;left:0;right:0;height:0;background:#031725;pointer-events:none}

/* V3.1 — explicit high-contrast text for Built for Business */
section.business-section .section-head h2,
section.business-section .section-head h2 *,
section.business-section .section-head p,
section.business-section .section-head p * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  text-shadow: none !important;
}
section.business-section .section-head .eyebrow {
  color: #c5f8ff !important;
  -webkit-text-fill-color: #c5f8ff !important;
  opacity: 1 !important;
}

/* V3.5 — Microsoft products as full-width editorial feature rows */
.ecosystem .microsoft-features{display:flex;flex-direction:column;gap:0;margin-top:2rem}
.ecosystem .microsoft-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr);align-items:center;gap:clamp(2rem,7vw,7rem);padding:clamp(3rem,6vw,5.5rem) 0;border-bottom:1px solid #c5dfe9}
.ecosystem .microsoft-feature:last-child{border-bottom:0}
.ecosystem .microsoft-feature-reverse{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}
.ecosystem .microsoft-feature-reverse .microsoft-feature-logo{order:2}
.ecosystem .microsoft-feature-reverse .microsoft-feature-content{order:1}
.ecosystem .microsoft-feature-logo{display:flex;align-items:center;justify-content:center;min-height:210px;padding:1rem}
.ecosystem .microsoft-feature-logo img{display:block;max-width:min(100%,290px);max-height:185px;width:auto;height:auto;object-fit:contain;filter:none}
.ecosystem .microsoft-feature-content h3{font-size:clamp(2rem,4.1vw,3.7rem);line-height:1.12;letter-spacing:-.045em;color:#082b43!important;margin:.75rem 0 1rem}
.ecosystem .microsoft-feature-content p{font-size:clamp(1rem,1.25vw,1.15rem);line-height:1.85;color:#365b71!important;max-width:670px;margin:0 0 1.4rem}
.ecosystem .microsoft-feature-content .eyebrow{color:#0084a4!important;letter-spacing:.15em}
.ecosystem .microsoft-feature-content .btn{display:inline-flex;text-decoration:none}
.ecosystem .brand-note{margin-top:1.5rem}
/* Preserve the approved white header and readable dark navigation */
.topbar{background:#fff!important;border-bottom:1px solid #dce8ee!important}
.topbar .brand,.topbar .brand span,.topbar .brand-name,.topbar .nav a,.topbar nav a{color:#062b40!important;-webkit-text-fill-color:#062b40!important}
.topbar .btn:not(.outline){background:#087fae!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
@media(max-width:760px){
 .ecosystem .microsoft-feature,.ecosystem .microsoft-feature-reverse{grid-template-columns:1fr;gap:1.5rem;padding:3rem 0}
 .ecosystem .microsoft-feature-reverse .microsoft-feature-logo,.ecosystem .microsoft-feature-reverse .microsoft-feature-content{order:initial}
 .ecosystem .microsoft-feature-logo{min-height:130px;justify-content:flex-start;padding:0}
 .ecosystem .microsoft-feature-logo img{max-width:210px;max-height:120px}
 .ecosystem .microsoft-feature-content h3{font-size:2.25rem}
}

/* UFUQNET v3.6 — ManageEngine feature, matched to Veeam presentation */
.manageengine-section{background:#eaf8fb!important;color:#08314a!important}
.manageengine-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.65fr);gap:clamp(2rem,6vw,6rem);align-items:center;padding-top:clamp(1.5rem,3vw,3rem);padding-bottom:clamp(1.5rem,3vw,3rem)}
.manageengine-logo{display:flex;justify-content:center;align-items:center;min-width:0}
.manageengine-logo img{display:block;width:100%;max-width:370px;height:auto;object-fit:contain}
.manageengine-copy .eyebrow{color:#0084a4!important}
.manageengine-copy h2{color:#082b43!important;font-size:clamp(2rem,4.3vw,3.8rem);line-height:1.1;letter-spacing:-.045em;margin:.7rem 0 1rem}
.manageengine-copy p{color:#365b71!important;font-size:clamp(1rem,1.25vw,1.15rem);line-height:1.8;margin:0 0 1.1rem}
.manageengine-copy .btn{display:inline-flex;margin-top:.5rem;text-decoration:none}
@media(max-width:760px){.manageengine-feature{grid-template-columns:1fr;gap:1.4rem}.manageengine-logo{justify-content:flex-start}.manageengine-logo img{max-width:260px}.manageengine-copy h2{font-size:2.25rem}}

/* UFUQNET v3.7 — Synology editorial section, consistent with Veeam and ManageEngine */
.synology-section{background:#eaf8fb!important;color:#08314a!important}
.synology-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.65fr);gap:clamp(2rem,6vw,6rem);align-items:center;padding-top:clamp(1.5rem,3vw,3rem);padding-bottom:clamp(1.5rem,3vw,3rem)}
.synology-logo{display:flex;justify-content:center;align-items:center;min-width:0}
.synology-logo img{display:block;width:100%;max-width:420px;height:auto;object-fit:contain}
.synology-copy .eyebrow{color:#0084a4!important}
.synology-copy h2{color:#082b43!important;font-size:clamp(2rem,4.3vw,3.8rem);line-height:1.1;letter-spacing:-.045em;margin:.7rem 0 1rem}
.synology-copy p{color:#365b71!important;font-size:clamp(1rem,1.25vw,1.15rem);line-height:1.8;margin:0 0 1.1rem}
.synology-copy .btn{display:inline-flex;margin-top:.5rem;text-decoration:none}
@media(max-width:760px){.synology-feature{grid-template-columns:1fr;gap:1.4rem}.synology-logo{justify-content:flex-start}.synology-logo img{max-width:270px}.synology-copy h2{font-size:2.25rem}}

/* V3.8: four core services in a single desktop row */
#services .cards.services-four-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:stretch}
#services .services-four-grid>.card{min-width:0;display:flex;flex-direction:column}
#services .services-four-grid>.card>a{margin-top:auto}
@media(max-width:980px){#services .cards.services-four-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:560px){#services .cards.services-four-grid{grid-template-columns:1fr!important}}

/* V3.9 cinematic motion hero: text/buttons remain live DOM elements */
.hero.hero-cinematic{position:relative;isolation:isolate;overflow:hidden;background:#041d31!important}
.hero-cinematic>.hero-motion{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#041d31 url('/assets/ufu-hero-poster.webp') center center/cover no-repeat}
.hero-cinematic>.hero-motion video{display:block;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.95}
.hero-cinematic::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(2,22,37,.91) 0%,rgba(3,30,48,.78) 43%,rgba(3,29,46,.43) 100%)}
.hero-cinematic>.container{position:relative;z-index:1}
.hero-cinematic h1,.hero-cinematic .eyebrow{color:#65e6f1!important}
.hero-cinematic .lead{color:#f0fbff!important}
.hero-cinematic .hero-console{background:rgba(4,35,56,.82)!important;backdrop-filter:blur(8px)}
@media(max-width:760px){.hero-cinematic::before{background:linear-gradient(90deg,rgba(2,22,37,.92),rgba(2,26,43,.73))}.hero-cinematic>.hero-motion video{object-position:64% center}}
@media(prefers-reduced-motion:reduce){.hero-cinematic>.hero-motion video{display:none}}
