:root{
  --navy:#071a3a;--navy2:#0c2855;--blue:#1268e8;--blue2:#59a5ff;
  --gold:#bd861a;--gold2:#e3b34e;--ink:#101d37;--muted:#66748d;
  --paper:#f7f6f2;--white:#fff;--line:#e7e3da;--green:#159a5a;
  --shadow:0 24px 70px rgba(9,28,65,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.6;overflow-x:hidden}
body.no-scroll{overflow:hidden}
a{text-decoration:none;color:inherit}
button,input,textarea{font:inherit}
.container{width:min(1180px,calc(100% - 40px));margin:auto}
.progress-bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--gold2));z-index:1000;width:0}
.header{height:80px;position:sticky;top:0;z-index:100;background:rgba(247,246,242,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(231,227,218,.75);transition:.25s}
.header.scrolled{box-shadow:0 8px 35px rgba(9,28,65,.08)}
.nav{height:80px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand img{width:205px;display:block}
.nav-links{display:flex;align-items:center;gap:29px;font-size:13px;font-weight:750}
.nav-links>a{padding:28px 0;position:relative}
.nav-links>a:not(.nav-cta):after{content:"";position:absolute;bottom:18px;left:0;right:100%;height:2px;background:var(--gold2);transition:.25s}
.nav-links>a:hover:after,.nav-links>a.active:after{right:0}
.nav-cta{background:var(--navy);color:#fff!important;padding:12px 18px!important;border-radius:10px;box-shadow:0 10px 22px rgba(7,26,58,.16)}
.nav-cta b{color:var(--gold2);margin-left:7px}
.menu-btn{display:none;border:0;background:transparent;width:40px;height:40px;padding:7px}
.menu-btn span{height:2px;background:var(--navy);display:block;margin:6px 0}

/* HERO */
.hero{position:relative;min-height:700px;padding:72px 0 35px;overflow:hidden;background:linear-gradient(125deg,#f7f6f2 0%,#fff 45%,#eaf3ff 100%)}
.grid-lines{position:absolute;inset:0;opacity:.25;background-image:linear-gradient(rgba(17,103,232,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(17,103,232,.08) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.hero-orb{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}
.orb-a{width:550px;height:550px;right:-260px;top:-300px;background:rgba(17,103,232,.08)}
.orb-b{width:350px;height:350px;left:-220px;bottom:-200px;background:rgba(227,179,78,.09)}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:35px;position:relative;z-index:2}
.eyebrow{font-size:10px;letter-spacing:.23em;font-weight:900;color:var(--navy);margin-bottom:12px}
.eyebrow.blue{color:var(--blue)}
.eyebrow i{display:inline-block;width:22px;height:2px;background:var(--gold2);vertical-align:middle;margin-right:8px}
.hero-kicker{font-size:10px;letter-spacing:.2em;color:var(--gold);font-weight:800;margin-bottom:18px}
.hero h1{font-size:clamp(56px,6vw,84px);line-height:.96;letter-spacing:-.06em;margin:0 0 26px;font-weight:850}
.hero h1 span,.split-heading h2 span,.about-copy h2 span,.final-content h2 span,.solution-copy h2 span,.section-top h2 span{color:var(--gold)}
.hero-lead{font-size:17px;color:var(--muted);max-width:570px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:29px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:13px 20px;border-radius:10px;font-weight:800;border:1px solid transparent;transition:.25s;cursor:pointer}
.btn:hover{transform:translateY(-3px);box-shadow:0 13px 28px rgba(7,26,58,.13)}
.btn-dark{background:var(--navy);color:#fff}
.btn-dark span{color:var(--gold2)}
.btn-light{background:#fff;border-color:#dcd8cf}
.btn-gold{background:var(--gold2);color:var(--navy)}
.trust-line{display:flex;gap:20px;margin-top:30px;color:#738098;font-size:11px}
.trust-line b{color:var(--gold);margin-right:5px}
.hero-visual{height:490px;display:grid;place-items:center;position:relative}
.logo-podium{width:min(410px,78%);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;position:relative;background:radial-gradient(circle,#fff 0,#faf7ef 50%,#dfeeff 100%);box-shadow:0 35px 85px rgba(14,56,115,.16),inset 0 0 0 2px #efe4cc;animation:pulseStage 5s ease-in-out infinite}
.logo-podium:after{content:"";position:absolute;width:80%;height:28px;bottom:34px;background:rgba(17,103,232,.25);filter:blur(18px);border-radius:50%}
.logo-podium img{width:67%;position:relative;z-index:2;filter:drop-shadow(0 25px 25px rgba(0,0,0,.22));animation:float 5s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-10px)}}@keyframes pulseStage{50%{box-shadow:0 35px 95px rgba(14,56,115,.22),inset 0 0 0 2px #efe4cc}}
.visual-ring{position:absolute;border:1px solid rgba(17,103,232,.2);border-radius:50%;animation:spin 16s linear infinite}
.ring-1{width:94%;height:48%;transform:rotate(-15deg)}.ring-2{width:76%;height:40%;transform:rotate(25deg);animation-direction:reverse}.ring-3{width:110%;height:30%;transform:rotate(-34deg);border-color:rgba(189,134,26,.18)}
@keyframes spin{to{transform:rotate(345deg)}}
.floating-chip{position:absolute;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);border:1px solid rgba(226,220,207,.95);border-radius:10px;padding:10px 13px;font-size:8px;letter-spacing:.12em;line-height:1.35;box-shadow:0 14px 30px rgba(8,26,58,.09);z-index:3}
.floating-chip b{font-size:9px;color:var(--navy)}.chip-one{top:10%;left:3%;animation:chipFloat 4.5s ease-in-out infinite}.chip-two{right:0;top:32%;animation:chipFloat 5.2s .3s ease-in-out infinite}.chip-three{bottom:8%;left:10%;animation:chipFloat 4.8s .6s ease-in-out infinite}
@keyframes chipFloat{50%{transform:translateY(-8px)}}
.stats{position:relative;z-index:5;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow);overflow:hidden;margin-top:25px}
.stats>div{padding:21px 25px;border-right:1px solid var(--line)}.stats>div:last-child{border:0}
.stats strong{font-size:29px;line-height:1;color:var(--navy);display:block}.stats strong:after{content:"+"}.stats>div:last-child strong:after{content:"%"}
.stats small{font-size:11px;color:var(--muted)}

/* TICKER */
.ticker{overflow:hidden;background:var(--navy);color:#fff;padding:11px 0;white-space:nowrap}
.ticker-track{display:inline-flex;align-items:center;gap:30px;animation:ticker 24s linear infinite;font-size:10px;font-weight:900;letter-spacing:.25em}
.ticker i{font-style:normal;color:var(--gold2);font-size:8px}
@keyframes ticker{to{transform:translateX(-33.333%)}}

/* GENERAL */
.section{padding:92px 0}
.split-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:40px;margin-bottom:38px}
.split-heading h2,.section-top h2{font-size:43px;line-height:1.05;letter-spacing:-.045em;margin:0}
.split-heading p{color:var(--muted);max-width:530px;margin:0}
.value-section{background:#fff}
.value-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.value-card{min-height:315px;border:1px solid var(--line);border-radius:17px;padding:25px;background:#fff;position:relative;overflow:hidden;transition:.3s;box-shadow:0 8px 25px rgba(8,26,58,.04)}
.value-card:hover{border-color:#d6c18f;box-shadow:0 25px 55px rgba(8,26,58,.10)}
.value-card:before{content:"";position:absolute;inset:auto -40px -60px auto;width:170px;height:170px;background:radial-gradient(circle,rgba(17,103,232,.08),transparent 68%);border-radius:50%}
.value-number{font-size:10px;font-weight:900;letter-spacing:.15em;color:#9aa5b7}.value-icon{margin-top:50px;width:48px;height:48px;border-radius:12px;background:#f3f6fb;color:var(--blue);display:grid;place-items:center;font-size:22px}.value-icon.gold{color:var(--gold);background:#faf5e9}
.value-card h3{font-size:20px;margin:17px 0 7px}.value-card p{font-size:12px;color:var(--muted)}.value-card>a{position:absolute;bottom:25px;font-size:11px;font-weight:900}.value-card>a span{color:var(--gold);margin-left:6px}
.dark-card{background:var(--navy);color:#fff;border-color:var(--navy)}.dark-card p{color:#aebbd0}.dark-card .value-number{color:#71819c}.dark-card:before{background:radial-gradient(circle,rgba(227,179,78,.13),transparent 68%)}

/* PRODUCTS */
.products-section{background:#f5f4f0}
.section-top{display:flex;justify-content:space-between;align-items:end;gap:20px}
.section-intro{color:var(--muted);margin:0 0 28px}
.carousel-controls{display:flex;gap:8px}.carousel-controls button{width:43px;height:43px;border:1px solid #d8d4ca;border-radius:10px;background:#fff;cursor:pointer;font-size:17px;transition:.2s}.carousel-controls button:hover{background:var(--navy);color:#fff;transform:translateY(-2px)}
.product-carousel{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:5px 2px 20px;scrollbar-width:none}
.product-carousel::-webkit-scrollbar{display:none}
.product-slide{min-width:350px;height:355px;scroll-snap-align:start;border-radius:18px;padding:24px;position:relative;overflow:hidden;color:#fff;transition:.35s;box-shadow:0 20px 45px rgba(8,26,58,.10)}
.product-slide:before{content:"";position:absolute;width:250px;height:250px;border-radius:50%;right:-100px;bottom:-100px;background:rgba(255,255,255,.08)}
.product-slide:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 45%,rgba(255,255,255,.10) 50%,transparent 55%);transform:translateX(-120%);transition:.7s}
.product-slide:hover:after{transform:translateX(120%)}
.product-slide.orange{background:linear-gradient(145deg,#e58d08,#b45c00)}.product-slide.green{background:linear-gradient(145deg,#1fa765,#087145)}.product-slide.blue-card{background:linear-gradient(145deg,#1167e8,#073c9e)}.product-slide.purple{background:linear-gradient(145deg,#7746ec,#4821a5)}.product-slide.pink{background:linear-gradient(145deg,#e53e7b,#a51f53)}.product-slide.gold{background:linear-gradient(145deg,#d39b2b,#93620d)}
.product-top{display:flex;justify-content:space-between;position:relative;z-index:2}.product-badge{font-size:8px;letter-spacing:.16em;font-weight:900;opacity:.82}.arrow{font-size:21px}.product-symbol{font-size:58px;margin-top:45px;line-height:1;filter:drop-shadow(0 8px 10px rgba(0,0,0,.16));position:relative;z-index:2}
.product-slide h3{font-size:33px;letter-spacing:-.04em;margin:15px 0 0;position:relative;z-index:2}.product-slide h3 span{font-weight:500}.product-slide>p{margin:0;opacity:.86;font-size:13px;position:relative;z-index:2}.product-bottom{position:absolute;bottom:24px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid rgba(255,255,255,.25);padding-top:14px;z-index:2}.product-bottom span{font-size:9px;opacity:.76}.product-bottom a{font-size:10px;font-weight:900;white-space:nowrap}.carousel-dots{display:flex;justify-content:center;gap:6px;margin-top:3px}.carousel-dots button{width:7px;height:7px;border-radius:50%;border:0;background:#cbd1dc;padding:0}.carousel-dots button.active{width:22px;border-radius:8px;background:var(--gold2)}

/* SOLUTIONS */
.solutions-section{background:#fff}
.solution-hero{min-height:450px;background:linear-gradient(115deg,#071a3a,#10336b);border-radius:22px;color:#fff;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;position:relative;box-shadow:0 30px 80px rgba(7,26,58,.18)}
.solution-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:65px 65px}
.solution-copy{padding:65px;position:relative;z-index:2}.solution-copy .eyebrow{color:#b9c8df}.solution-copy h2{font-size:55px;line-height:.98;letter-spacing:-.05em;margin:0 0 22px}.solution-copy p{max-width:480px;color:#b7c4d9;font-size:14px}.solution-copy .btn{margin-top:16px}
.solution-visual{position:relative;min-height:450px;display:grid;place-items:center}.stack-card{position:absolute;border-radius:18px;border:1px solid rgba(255,255,255,.16);box-shadow:0 30px 60px rgba(0,0,0,.25)}.card-back{width:310px;height:205px;background:rgba(48,121,232,.15);transform:rotate(-12deg) translate(-20px,-10px)}.card-mid{width:340px;height:225px;background:rgba(255,255,255,.06);transform:rotate(6deg) translate(20px,15px)}.card-front{width:330px;height:215px;background:linear-gradient(145deg,#fff,#e9f1ff);padding:20px;color:var(--navy);transform:rotate(-2deg)}.mini-window{display:flex;gap:5px}.mini-window span{width:6px;height:6px;background:#ccd7e8;border-radius:50%}.mini-line{height:10px;background:#d8e5f7;border-radius:5px;margin-top:24px;width:70%}.mini-line.short{width:43%;margin-top:9px}.mini-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:23px}.mini-grid i{height:50px;border-radius:7px;background:#edf4fd}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:18px}.service-card{border:1px solid var(--line);border-radius:15px;padding:25px;background:#fff;transition:.3s;min-height:190px}.service-card:hover{transform:translateY(-6px);box-shadow:0 22px 45px rgba(8,26,58,.08);border-color:#d9c28c}.service-card>span{font-size:9px;color:var(--gold);font-weight:900;letter-spacing:.15em}.service-card b{display:block;font-size:18px;margin-top:30px}.service-card p{font-size:12px;color:var(--muted)}.service-card a{font-size:10px;font-weight:900}.service-card em{font-style:normal;color:var(--gold);margin-left:6px}

/* PROCESS */
.process-section{background:#f5f4f0}.process-line{display:grid;grid-template-columns:repeat(5,1fr);position:relative}.process-line:before{content:"";position:absolute;top:31px;left:8%;right:8%;height:1px;background:linear-gradient(90deg,var(--gold2),#bfc8d5,var(--gold2));z-index:0}.process-step{text-align:center;position:relative;z-index:1}.process-step i{width:62px;height:62px;background:#fff;border:1px solid #ddd4bf;border-radius:50%;display:grid;place-items:center;margin:0 auto 16px;font-style:normal;font-weight:900;color:var(--gold);box-shadow:0 7px 20px rgba(8,26,58,.06)}.process-step b{display:block;font-size:14px}.process-step small{font-size:10px;color:var(--muted)}

/* ABOUT */
.about-section{background:#fff}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.about-copy{padding:55px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg,#fff,#f7f9fd)}.about-copy h2{font-size:46px;line-height:1;letter-spacing:-.05em;margin:0 0 20px}.about-copy p{color:var(--muted);max-width:530px}.text-link{font-size:12px;font-weight:900}.text-link span{color:var(--gold);margin-left:7px}.about-quote{border-radius:20px;background:var(--navy);color:#fff;padding:55px;position:relative;overflow:hidden}.about-quote:before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;right:-130px;bottom:-140px;background:rgba(227,179,78,.10)}.quote-mark{font-size:70px;color:var(--gold2);line-height:.6}.about-quote p{font-size:30px;line-height:1.2;letter-spacing:-.025em;max-width:500px;position:relative}.about-quote span{color:#aab7cc;font-size:11px}

/* FINAL CTA */
.final-cta{background:linear-gradient(135deg,#f0f5fd,#fffaf0);padding:105px 0;position:relative;overflow:hidden;text-align:center}
.final-orbit{position:absolute;width:700px;height:700px;border:1px solid rgba(17,103,232,.10);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 100px rgba(17,103,232,.025),0 0 0 200px rgba(189,134,26,.018)}
.final-content{position:relative;z-index:2}.final-content h2{font-size:65px;line-height:.98;letter-spacing:-.055em;margin:0 0 20px}.final-content p{color:var(--muted);margin-bottom:28px}

/* FOOTER */
.footer{background:#071936;color:#fff;padding:65px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:45px}.footer-brand img{width:190px;filter:brightness(0) invert(1)}.footer p{color:#9eacc3;font-size:12px;max-width:330px}.footer h4{font-size:13px;margin-top:0}.footer-grid>div:not(:first-child) a{display:block;color:#9eacc3;font-size:11px;margin:8px 0}.socials{display:flex;gap:7px;margin-top:18px}.socials a{width:30px;height:30px;border:1px solid #2b4266;border-radius:50%;display:grid;place-items:center;font-size:10px}.footer-bottom{border-top:1px solid #263a5d;margin-top:42px;padding-top:17px;display:flex;justify-content:space-between;color:#71829d;font-size:10px}

/* INNER PAGE COMMON */
.page-hero{padding:105px 0 85px;background:linear-gradient(120deg,#f7f6f2,#eef5ff);border-bottom:1px solid var(--line);position:relative;overflow:hidden}.page-hero:after{content:"";position:absolute;width:500px;height:500px;border-radius:50%;right:-180px;top:-200px;background:rgba(17,103,232,.07)}.page-hero h1{font-size:65px;line-height:1;letter-spacing:-.055em;margin:0 0 20px}.page-hero p{max-width:680px;color:var(--muted);font-size:17px}.inner-section{padding:85px 0}.inner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.inner-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:28px;transition:.25s}.inner-card:hover{transform:translateY(-5px);box-shadow:0 20px 45px rgba(8,26,58,.08);border-color:#d9c28c}.inner-card .num{font-size:10px;font-weight:900;color:var(--gold);letter-spacing:.15em}.inner-card h3{font-size:20px;margin:22px 0 8px}.inner-card p{font-size:13px;color:var(--muted)}.inner-card a{font-size:10px;font-weight:900;color:var(--blue)}
.product-detail{background:#f7f6f2}.product-detail-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px}.product-name{font-size:75px;line-height:.95;letter-spacing:-.06em;margin:0 0 13px}.product-name span{color:var(--gold);font-weight:500}.product-tag{font-size:25px;line-height:1.2;margin:0 0 18px}.product-desc{color:var(--muted);max-width:540px}.product-dashboard{min-height:390px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:0 30px 75px rgba(8,26,58,.13);overflow:hidden;transform:rotate(1.5deg)}.dashbar{height:48px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 16px;gap:6px}.dashbar i{width:7px;height:7px;border-radius:50%;background:#d5dbe5}.dashbar b{margin-left:auto;font-size:10px}.dashbody{display:flex;height:340px}.dashside{width:23%;background:var(--navy)}.dashmain{flex:1;padding:22px}.dashmain .line{height:12px;background:#e6eef8;border-radius:5px;width:72%;margin-bottom:9px}.dashmain .line.short{width:43%}.dashcards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:23px 0}.dashcards i{height:58px;border-radius:8px;background:#edf4fd}.dashchart{height:120px;border-radius:10px;background:linear-gradient(180deg,#eef5ff,#fff);border-bottom:3px solid var(--blue)}
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}.contact-info-box{background:var(--navy);color:#fff;border-radius:20px;padding:45px}.contact-info-box h2{font-size:40px;line-height:1;margin:0 0 17px}.contact-info-box p{color:#aebbd0}.contact-details{margin-top:35px;display:grid;gap:15px}.contact-details b{display:block;font-size:12px}.contact-details span{font-size:12px;color:#aebbd0}.form-box{background:#fff;border:1px solid var(--line);border-radius:20px;padding:32px;box-shadow:var(--shadow)}.form-box label{font-size:11px;font-weight:800;display:block;margin-bottom:14px}.form-box input,.form-box textarea{width:100%;display:block;border:1px solid #ddd9d0;border-radius:9px;padding:12px;margin-top:6px;outline:none}.form-box input:focus,.form-box textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(17,103,232,.08)}
.jobs{display:grid;gap:13px}.job{background:#fff;border:1px solid var(--line);border-radius:14px;padding:21px 24px;display:flex;justify-content:space-between;align-items:center}.job h3{margin:0;font-size:18px}.job small{color:var(--muted)}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.blog-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.25s}.blog-card:hover{transform:translateY(-6px);box-shadow:0 20px 45px rgba(8,26,58,.08)}.blog-image{height:180px;display:grid;place-items:center;color:#fff;font-size:48px;font-weight:900}.blog-image.blue{background:linear-gradient(135deg,#0e57be,#65a7ff)}.blog-image.gold{background:linear-gradient(135deg,#93620d,#e8bc5d)}.blog-image.navy{background:linear-gradient(135deg,#071a3a,#2c62b2)}.blog-body{padding:23px}.blog-body small{font-size:9px;letter-spacing:.13em;color:var(--gold);font-weight:900}.blog-body h3{line-height:1.2}.blog-body p{font-size:12px;color:var(--muted)}.blog-body a{font-size:10px;font-weight:900;color:var(--blue)}
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.price-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:31px;position:relative}.price-card.featured{border:2px solid var(--gold);transform:translateY(-7px)}.price-card .popular{position:absolute;right:17px;top:17px;background:var(--gold2);padding:4px 8px;border-radius:20px;font-size:8px;font-weight:900}.price-card small{color:var(--muted);font-weight:900;letter-spacing:.12em}.price-card h3{font-size:27px;margin:7px 0}.price-card strong{font-size:31px}.price-card p{color:var(--muted);font-size:12px}.price-card ul{padding-left:18px;color:var(--muted);font-size:12px;min-height:145px}
.success{background:#eaf8f0;color:#147a47;border:1px solid #bce5cf;padding:11px;border-radius:8px;font-size:12px;margin-bottom:15px}

/* REVEAL */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}

/* RESPONSIVE */
@media(max-width:1050px){
  .nav-links{gap:17px}.value-grid{grid-template-columns:repeat(2,1fr)}.product-slide{min-width:330px}
}
@media(max-width:800px){
  .container{width:min(100% - 28px,650px)}
  .menu-btn{display:block}.nav-links{display:none;position:absolute;top:80px;left:14px;right:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}.nav-links.open{display:flex}.nav-links>a{padding:12px}.nav-links>a:not(.nav-cta):after{display:none}.nav-cta{text-align:center;margin-top:4px}
  .hero-grid,.solution-hero,.about-grid,.contact-layout,.product-detail-grid{grid-template-columns:1fr}.hero{padding-top:48px}.hero-visual{order:-1;height:350px}.hero h1{font-size:55px}.stats{grid-template-columns:repeat(2,1fr)}.stats>div:nth-child(2){border-right:0}
  .split-heading{grid-template-columns:1fr}.value-grid{grid-template-columns:1fr 1fr}.product-slide{min-width:82vw}.solution-copy{padding:45px 30px}.solution-copy h2{font-size:48px}.solution-visual{min-height:350px}.service-grid{grid-template-columns:1fr 1fr}.process-line{grid-template-columns:1fr;gap:25px}.process-line:before{top:30px;bottom:30px;left:31px;width:1px;height:auto;right:auto}.process-step{text-align:left;padding-left:80px}.process-step i{position:absolute;left:0;top:0;margin:0}.final-content h2{font-size:51px}.footer-grid{grid-template-columns:1fr 1fr}.page-hero h1{font-size:50px}.inner-grid,.blog-grid,.pricing{grid-template-columns:1fr 1fr}.price-card.featured{transform:none}
}
@media(max-width:520px){
  .brand img{width:175px}.hero h1{font-size:46px}.hero-lead{font-size:15px}.trust-line{flex-direction:column;gap:7px}.hero-visual{height:300px}.floating-chip{font-size:7px}.stats{grid-template-columns:1fr 1fr}.stats>div{padding:17px}.stats strong{font-size:24px}.features{grid-template-columns:1fr}
  .value-grid,.service-grid,.inner-grid,.blog-grid,.pricing{grid-template-columns:1fr}.section{padding:70px 0}.split-heading h2,.section-top h2{font-size:35px}.product-slide{min-width:88vw}.solution-copy h2{font-size:42px}.about-copy,.about-quote{padding:35px}.about-copy h2{font-size:39px}.final-content h2{font-size:44px}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:8px}.product-name{font-size:55px}.product-tag{font-size:21px}
}


/* =========================================================
   DFI V3.6 — APPROVED HERO DIRECTION
   ========================================================= */
.header .nav{min-height:76px!important}
.brand{display:flex!important;align-items:center!important;gap:12px!important;width:auto!important;height:58px!important;flex:0 0 auto!important;text-decoration:none!important}
.brand-mark{width:46px!important;height:50px!important;object-fit:contain!important;display:block!important;flex:0 0 46px!important;filter:drop-shadow(0 4px 8px rgba(7,26,58,.12))}
.brand-copy{display:flex!important;flex-direction:column!important;justify-content:center!important;line-height:1!important;white-space:nowrap!important}
.brand-name{display:block!important;font-size:19px!important;line-height:1!important;letter-spacing:.145em!important;font-weight:950!important;color:#071a3a!important}
.brand-sub{display:block!important;margin-top:5px!important;padding-left:2px!important;font-size:7px!important;line-height:1!important;letter-spacing:.30em!important;font-weight:850!important;color:#c38c20!important}
.nav-links{gap:27px!important}
@media(max-width:720px){.brand-copy{display:none!important}.brand-mark{width:42px!important;height:46px!important;flex-basis:42px!important}}

.dfi-hero-v36{
  min-height:700px!important;
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 90% 8%,rgba(92,151,245,.16),transparent 28%),
    radial-gradient(circle at 2% 88%,rgba(236,188,76,.10),transparent 18%),
    linear-gradient(120deg,#fff 0%,#fbfcfe 48%,#eef5ff 100%)!important;
}
.dfi-hero-grid{
  position:absolute;inset:0;opacity:.34;pointer-events:none;
  background-image:linear-gradient(rgba(7,26,58,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(7,26,58,.055) 1px,transparent 1px);
  background-size:57px 57px;
  mask-image:linear-gradient(90deg,black 0%,black 75%,transparent 100%);
}
.dfi-hero-v36:before{
  content:"";position:absolute;right:-220px;top:-280px;width:620px;height:620px;border-radius:50%;
  background:rgba(84,143,239,.10);filter:blur(1px)
}
.dfi-hero-inner{
  min-height:660px;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:25px;
  position:relative;z-index:2;padding-top:30px;padding-bottom:80px
}
.dfi-hero-copy{padding-top:18px}
.dfi-eyebrow{font-size:12px;letter-spacing:.22em;font-weight:900;color:#0a2147;display:flex;align-items:center;gap:13px;margin-bottom:20px}
.dfi-eyebrow span{display:inline-block;width:32px;height:3px;background:#d7a32e}
.dfi-kicker{font-size:12px;letter-spacing:.24em;font-weight:900;color:#c48c18;margin-bottom:34px}
.dfi-kicker b{font-weight:900;color:#d4a23d;padding:0 4px}
.dfi-hero-copy h1{
  font-size:clamp(65px,6.6vw,105px)!important;line-height:.90!important;letter-spacing:-.065em!important;
  margin:0 0 30px!important;color:#071a3a!important;font-weight:950!important
}
.dfi-hero-copy h1 em{font-style:normal;color:#c58d1d}
.dfi-hero-description{
  max-width:650px!important;font-size:18px!important;line-height:1.65!important;color:#5c718e!important;margin:0 0 31px!important
}
.dfi-actions{display:flex;gap:14px;flex-wrap:wrap}
.dfi-actions .btn{min-height:54px;padding:0 27px}
.dfi-trust{display:flex;align-items:center;gap:11px;margin-top:33px;color:#61718a;font-size:11px;font-weight:700}
.dfi-trust-icon{width:25px;height:25px;border:2px solid #d5a12e;color:#d5a12e;border-radius:8px;display:grid;place-items:center;font-weight:950}
.dfi-trust i{height:26px;width:1px;background:#cfd6df;margin:0 4px}
.dfi-trust-stat b{color:#0a2147;font-size:18px;margin-right:4px}

.dfi-hero-visual{height:570px;position:relative;display:grid;place-items:center;perspective:1000px}
.dfi-logo-stage{position:relative;width:370px;height:370px;display:grid;place-items:center}
.dfi-logo-halo{
  position:absolute;inset:-12px;border-radius:50%;
  border:2px solid rgba(211,163,48,.27);
  box-shadow:0 0 70px rgba(43,117,223,.11),inset 0 0 50px rgba(211,163,48,.07)
}
.dfi-logo-halo:before,.dfi-logo-halo:after{
  content:"";position:absolute;border-radius:50%;inset:34px;border:1px dashed rgba(211,163,48,.22)
}
.dfi-logo-halo:after{inset:-38px;border:1px solid rgba(55,129,232,.16)}
.dfi-hero-mark{
  position:relative;width:300px;height:300px;object-fit:contain;
  filter:drop-shadow(0 28px 28px rgba(7,26,58,.24));
  animation:dfiFloat 5s ease-in-out infinite
}
@keyframes dfiFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.dfi-orbit{position:absolute;border:1px solid rgba(52,125,226,.20);border-radius:50%;transform:rotate(-22deg)}
.dfi-orbit-1{width:580px;height:210px}
.dfi-orbit-2{width:640px;height:245px;transform:rotate(28deg);border-color:rgba(198,147,31,.18)}
.dfi-orbit-3{width:470px;height:470px;border-color:rgba(198,147,31,.14)}
.dfi-orbit-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:#e1ae3b;box-shadow:0 0 14px rgba(225,174,59,.45)}
.dot-1{top:92px;right:95px}.dot-2{bottom:90px;left:115px;background:#5b9ff2}.dot-3{top:180px;left:22px;background:#d9a536}

.dfi-float-card{
  position:absolute;background:rgba(255,255,255,.96);border:1px solid #e1e4e9;border-radius:13px;
  padding:14px 18px;box-shadow:0 18px 42px rgba(7,26,58,.12);display:flex;flex-direction:column;
  gap:5px;z-index:5;animation:dfiCardFloat 4.5s ease-in-out infinite
}
.dfi-float-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:13px 0 0 13px;background:#d5a02e}
.dfi-float-card small{font-size:8px;letter-spacing:.15em;color:#60718a}.dfi-float-card strong{font-size:12px;letter-spacing:.04em;color:#0a2147}
.card-software{left:25px;top:85px}.card-product{right:0;top:205px}.card-digital{left:70px;bottom:70px}.card-tech{right:35px;bottom:80px}
@keyframes dfiCardFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.card-product{animation-delay:.8s}.card-digital{animation-delay:1.5s}.card-tech{animation-delay:2.1s}

.dfi-hero-bottom{
  position:absolute;bottom:0;left:0;right:0;background:#071d42;color:#fff;z-index:7;height:40px;
  display:flex;align-items:center;overflow:hidden
}
.dfi-bottom-inner{display:flex;align-items:center;justify-content:space-between;white-space:nowrap;font-size:8px;letter-spacing:.23em;font-weight:900;opacity:.95}
.dfi-bottom-inner b{color:#d7a32e}

@media(max-width:1000px){
 .dfi-hero-inner{grid-template-columns:1fr;text-align:center;padding-top:70px}
 .dfi-eyebrow,.dfi-trust{justify-content:center}.dfi-actions{justify-content:center}
 .dfi-hero-description{margin-left:auto!important;margin-right:auto!important}
 .dfi-hero-visual{height:500px}
}
@media(max-width:600px){
 .dfi-hero-v36{min-height:auto!important}.dfi-hero-inner{padding-top:55px;padding-bottom:60px}
 .dfi-hero-copy h1{font-size:54px!important}.dfi-kicker{font-size:9px}
 .dfi-hero-description{font-size:15px!important}.dfi-hero-visual{height:420px}
 .dfi-logo-stage{width:260px;height:260px}.dfi-hero-mark{width:210px;height:210px}
 .dfi-orbit-1{width:380px;height:145px}.dfi-orbit-2{width:420px;height:170px}.dfi-orbit-3{width:330px;height:330px}
 .dfi-float-card{padding:9px 11px}.dfi-float-card strong{font-size:9px}.dfi-float-card small{font-size:6px}
 .card-software{left:0;top:45px}.card-product{right:0;top:130px}.card-digital{left:20px;bottom:35px}.card-tech{right:0;bottom:45px}
 .dfi-trust{font-size:9px}
}


/* =========================================================
   DFI V3.7 — FIRST VIEWPORT FIT
   Designed for a 1366x768 / 1280x720 class desktop viewport.
   Keeps the V3.6 composition, but makes the complete hero
   visible without needing to scroll.
   ========================================================= */

html{scroll-behavior:smooth}
.header .nav{min-height:68px!important;height:68px!important}
.header{height:68px!important}

.dfi-hero-v36{
  min-height:calc(100vh - 68px)!important;
  height:calc(100vh - 68px)!important;
  max-height:none!important;
}
.dfi-hero-inner{
  min-height:calc(100vh - 108px)!important;
  height:calc(100vh - 108px)!important;
  padding-top:16px!important;
  padding-bottom:58px!important;
  gap:10px!important;
}
.dfi-hero-copy{padding-top:0!important}
.dfi-eyebrow{margin-bottom:13px!important;font-size:11px!important}
.dfi-kicker{margin-bottom:22px!important;font-size:10px!important}
.dfi-hero-copy h1{
  font-size:clamp(54px,5.45vw,76px)!important;
  line-height:.89!important;
  margin-bottom:20px!important;
}
.dfi-hero-description{
  font-size:15px!important;
  line-height:1.5!important;
  max-width:570px!important;
  margin-bottom:20px!important;
}
.dfi-actions .btn{
  min-height:47px!important;
  padding:0 22px!important;
  font-size:13px!important;
}
.dfi-trust{margin-top:20px!important;font-size:10px!important}
.dfi-trust-icon{width:22px!important;height:22px!important}

.dfi-hero-visual{
  height:500px!important;
  transform:translateY(-2px) scale(.91);
  transform-origin:center center;
}
.dfi-logo-stage{width:330px!important;height:330px!important}
.dfi-hero-mark{width:265px!important;height:265px!important}
.dfi-orbit-1{width:520px!important;height:195px!important}
.dfi-orbit-2{width:570px!important;height:220px!important}
.dfi-orbit-3{width:420px!important;height:420px!important}
.dfi-float-card{padding:11px 14px!important}
.dfi-float-card strong{font-size:11px!important}
.dfi-float-card small{font-size:7px!important}
.card-software{left:15px!important;top:70px!important}
.card-product{right:0!important;top:185px!important}
.card-digital{left:45px!important;bottom:58px!important}
.card-tech{right:25px!important;bottom:68px!important}

.dfi-hero-bottom{height:34px!important}
.dfi-bottom-inner{font-size:7px!important}

/* 1440/900 and similar screens: retain comfortable scale */
@media (min-height:820px){
  .dfi-hero-inner{
    padding-top:28px!important;
    padding-bottom:64px!important;
  }
  .dfi-hero-copy h1{font-size:clamp(60px,5.5vw,84px)!important}
  .dfi-hero-description{font-size:16px!important}
  .dfi-hero-visual{transform:scale(.96)}
}

/* Short laptop / browser viewport like the supplied screenshot */
@media (max-height:760px) and (min-width:901px){
  .dfi-hero-inner{
    grid-template-columns:1fr .95fr!important;
    padding-top:8px!important;
    padding-bottom:45px!important;
  }
  .dfi-hero-copy h1{
    font-size:clamp(52px,5vw,70px)!important;
    margin-bottom:17px!important;
  }
  .dfi-kicker{margin-bottom:18px!important}
  .dfi-hero-description{font-size:14px!important;margin-bottom:16px!important}
  .dfi-actions .btn{min-height:44px!important}
  .dfi-trust{margin-top:14px!important}
  .dfi-hero-visual{
    height:450px!important;
    transform:translateY(-8px) scale(.82)!important;
  }
}

/* Very small laptop widths */
@media (max-width:1100px) and (min-width:901px){
  .dfi-hero-copy h1{font-size:clamp(48px,5vw,64px)!important}
  .dfi-hero-description{max-width:500px!important}
  .dfi-hero-visual{transform:scale(.78)!important}
}

/* Mobile should scroll naturally rather than forcing a viewport lock. */
@media(max-width:900px){
  .header,.header .nav{height:auto!important;min-height:64px!important}
  .dfi-hero-v36{height:auto!important;min-height:0!important}
  .dfi-hero-inner{
    height:auto!important;min-height:0!important;
    padding-top:55px!important;padding-bottom:70px!important;
  }
  .dfi-hero-visual{transform:none!important;height:420px!important}
}


/* =========================================================
   DFI V3.8 — UNIFIED VISUAL SYSTEM
   One brand/header/layout language across every page.
   ========================================================= */

/* --- GLOBAL BRAND HEADER --- */
.header{
  height:76px!important;
  background:#061a3a!important;
  border-bottom:1px solid rgba(227,179,78,.18)!important;
  box-shadow:0 10px 35px rgba(5,20,45,.13)!important;
}
.header.scrolled{
  background:rgba(6,26,58,.96)!important;
  box-shadow:0 12px 38px rgba(5,20,45,.20)!important;
}
.nav{height:76px!important}
.brand{
  display:flex!important;align-items:center!important;gap:12px!important;
  width:auto!important;height:58px!important;flex:0 0 auto!important;
  text-decoration:none!important;
}
.brand-mark{
  width:47px!important;height:51px!important;object-fit:contain!important;
  display:block!important;flex:0 0 47px!important;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.24))!important;
}
.brand-copy{display:flex!important;flex-direction:column!important;justify-content:center!important;line-height:1!important;white-space:nowrap!important}
.brand-name{
  display:block!important;font-size:20px!important;line-height:1!important;
  letter-spacing:.145em!important;font-weight:950!important;color:#fff!important;
}
.brand-sub{
  display:block!important;margin-top:5px!important;padding-left:2px!important;
  font-size:8px!important;line-height:1!important;letter-spacing:.29em!important;
  font-weight:900!important;color:#e3b34e!important;
}
.nav-links{gap:30px!important;color:#fff!important}
.nav-links>a{
  color:#f7f9fd!important;padding:28px 0!important;font-weight:780!important;
}
.nav-links>a:not(.nav-cta):after{
  background:#e3b34e!important;bottom:18px!important;height:2px!important;
}
.nav-links>a:hover,.nav-links>a.active{color:#e3b34e!important}
.nav-cta{
  background:#e3b34e!important;color:#071a3a!important;
  padding:13px 20px!important;border-radius:12px!important;
  box-shadow:0 10px 25px rgba(227,179,78,.20)!important;
}
.nav-cta b{color:#071a3a!important}
.menu-btn span{background:#fff!important}

/* --- INNER PAGE HERO: same visual language as home --- */
.page-hero{
  min-height:365px!important;
  padding:82px 0 70px!important;
  background:
    radial-gradient(circle at 92% 0%,rgba(91,151,241,.16),transparent 28%),
    radial-gradient(circle at 0% 100%,rgba(227,179,78,.08),transparent 22%),
    linear-gradient(120deg,#fff 0%,#f8fbff 52%,#eef5ff 100%)!important;
  border-bottom:1px solid #e4e9f0!important;
  position:relative!important;overflow:hidden!important;
}
.page-hero:before{
  content:"";position:absolute;inset:0;opacity:.35;pointer-events:none;
  background-image:linear-gradient(rgba(7,26,58,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(7,26,58,.045) 1px,transparent 1px);
  background-size:56px 56px;
}
.page-hero:after{
  width:520px!important;height:520px!important;right:-190px!important;top:-270px!important;
  background:rgba(76,138,232,.10)!important;
}
.page-hero .container{position:relative;z-index:2}
.page-hero h1{
  font-size:clamp(52px,5.4vw,78px)!important;
  line-height:.94!important;letter-spacing:-.055em!important;
  color:#071a3a!important;margin:0 0 20px!important;
}
.page-hero h1 span{color:#c58d1d!important}
.page-hero p{max-width:680px!important;color:#5f728e!important;font-size:17px!important;line-height:1.65!important}
.eyebrow.blue{color:#c58d1d!important;letter-spacing:.20em!important;font-weight:900!important}
.eyebrow.blue:before{background:#c58d1d!important}

/* --- CONSISTENT INNER SECTION WIDTH / RHYTHM --- */
.inner-section{padding:78px 0!important;background:#f7f8fa!important}
.inner-section:nth-of-type(even){background:#fff!important}
.inner-section .container,.section .container{max-width:1180px!important}
.inner-card,.blog-card,.value-card,.price-card,.form-box,.about-copy{
  border-color:#e2e7ee!important;
  box-shadow:0 14px 42px rgba(7,26,58,.055)!important;
}
.inner-card:hover,.blog-card:hover{box-shadow:0 24px 55px rgba(7,26,58,.10)!important}

/* Product detail gets the same light-blue canvas and spacing. */
.product-detail{
  min-height:calc(100vh - 76px)!important;
  padding:84px 0!important;
  background:
    radial-gradient(circle at 90% 10%,rgba(91,151,241,.13),transparent 30%),
    linear-gradient(120deg,#fff,#f4f8fd)!important;
}

/* Contact page: same hero + aligned content. */
.contact-layout{align-items:stretch!important}
.contact-info-box{border-radius:20px!important}
.form-box{border-radius:20px!important}

/* Footer is shared visual anchor. */
.footer{background:#061a3a!important}

/* Home anchors should land exactly below sticky header. */
#home,#solutions,#products,#about{scroll-margin-top:76px}

/* Desktop nav spacing */
@media(max-width:1000px){
  .nav-links{gap:20px!important}
  .nav-links>a{font-size:12px!important}
}
@media(max-width:800px){
  .header,.nav{height:68px!important}
  .brand-mark{width:42px!important;height:46px!important;flex-basis:42px!important}
  .brand-name{font-size:17px!important}
  .brand-sub{font-size:6px!important}
  .nav-links{background:#061a3a!important}
  .nav-links>a{color:#fff!important}
}
@media(max-width:600px){
  .brand-copy{display:none!important}
  .page-hero{min-height:300px!important;padding:62px 0 55px!important}
  .page-hero h1{font-size:48px!important}
  .inner-section{padding:58px 0!important}
}

/* =========================================================
   DFI V3.9 — GLOBAL HEADER CTA REFINEMENT
   Compact, premium, aligned consistently on every page.
   ========================================================= */
.nav-links .nav-cta{
  height:48px!important;
  min-height:48px!important;
  width:auto!important;
  min-width:198px!important;
  padding:0 15px 0 20px!important;
  margin:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:13px!important;
  box-sizing:border-box!important;
  border-radius:11px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:visible!important;
  background:linear-gradient(135deg,#e8b83f 0%,#dca72c 100%)!important;
  color:#071a3a!important;
  border:1px solid rgba(255,255,255,.28)!important;
  box-shadow:0 8px 22px rgba(7,26,58,.18),inset 0 1px 0 rgba(255,255,255,.38)!important;
  transform:none!important;
}
.nav-links .nav-cta span{
  display:block!important;
  font-size:13px!important;
  font-weight:850!important;
  letter-spacing:-.01em!important;
}
.nav-links .nav-cta b{
  width:27px!important;
  height:27px!important;
  flex:0 0 27px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  margin:0!important;
  background:#071a3a!important;
  color:#e8b83f!important;
  font-size:15px!important;
  font-weight:900!important;
  line-height:1!important;
  transition:transform .25s ease,background .25s ease,color .25s ease!important;
}
.nav-links .nav-cta:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 12px 28px rgba(7,26,58,.24),inset 0 1px 0 rgba(255,255,255,.45)!important;
}
.nav-links .nav-cta:hover b{
  transform:translate(2px,-2px)!important;
}
.nav-links .nav-cta:after{display:none!important}

@media(max-width:900px){
  .nav-links .nav-cta{
    width:100%!important;
    min-width:0!important;
    height:48px!important;
    margin-top:6px!important;
  }
}


/* =========================================================
   DFI V4.0 — HOME SHOWCASE + AUTO PRODUCT CAROUSEL
   ========================================================= */
.dfi-showcase{
  padding:92px 0 105px;
  background:linear-gradient(180deg,#f7f8f7 0%,#fff 100%);
  overflow:hidden;
}
.dfi-showcase-head{
  display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px
}
.dfi-showcase-head h2{margin:8px 0 0;font-size:48px;letter-spacing:-.055em;color:#071a3a}
.dfi-showcase-head h2 span{color:#c58d1d}
.dfi-showcase-controls{display:flex;gap:9px}
.dfi-showcase-controls button{
  width:45px;height:45px;border-radius:50%;border:1px solid #d9dee6;background:#fff;
  color:#071a3a;font-size:18px;cursor:pointer;transition:.25s
}
.dfi-showcase-controls button:hover{background:#071a3a;color:#e4ad36;transform:translateY(-2px)}
.dfi-showcase-viewport{overflow:hidden;border-radius:24px}
.dfi-showcase-track{display:flex;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.dfi-showcase-slide{
  flex:0 0 100%;min-height:500px;border-radius:24px;padding:54px 58px;
  display:grid;grid-template-columns:.85fr 1.15fr;gap:30px;align-items:center;
  position:relative;overflow:hidden
}
.dfi-showcase-slide:before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:42px 42px
}
.dfi-showcase-slide.ecosystem{background:linear-gradient(135deg,#0a2147,#123d73)}
.dfi-showcase-slide.platform{background:linear-gradient(135deg,#071a3a,#0d315f)}
.dfi-showcase-slide.custom{background:linear-gradient(135deg,#102b54,#174a78)}
.showcase-copy{position:relative;z-index:3;color:#fff;max-width:480px}
.showcase-index{font-size:10px;letter-spacing:.18em;font-weight:900;color:#e2b345}
.showcase-copy h3{font-size:48px;line-height:.98;letter-spacing:-.055em;margin:18px 0 18px}
.showcase-copy h3 strong{color:#e6b23c}
.showcase-copy p{font-size:15px;line-height:1.7;color:rgba(255,255,255,.74);margin:0 0 25px}
.showcase-link{display:inline-flex;align-items:center;gap:10px;color:#fff;font-weight:850;font-size:13px}
.showcase-link span{color:#e7b53f;font-size:18px}
.showcase-art{position:relative;height:390px;display:grid;place-items:center;z-index:2}
.product-art{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;transform:rotate(-4deg) perspective(900px) rotateY(-4deg)}
.mini-product-card{
  min-height:135px;border-radius:14px;padding:18px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;
  box-shadow:0 18px 40px rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.16);
  transition:transform .35s
}
.mini-product-card:hover{transform:translateY(-8px) rotate(1deg)}
.mini-product-card b{font-size:18px}.mini-product-card small{font-size:7px;letter-spacing:.15em;margin:7px 0;opacity:.75}.mini-product-card span{font-size:8px;opacity:.78}
.mini-product-card.dine{background:linear-gradient(145deg,#ed9306,#b75b00)}.mini-product-card.hr{background:linear-gradient(145deg,#1fa966,#087344)}
.mini-product-card.remit{background:linear-gradient(145deg,#176be8,#0a3d9e)}.mini-product-card.booking{background:linear-gradient(145deg,#7749e9,#45209e)}
.mini-product-card.mart{background:linear-gradient(145deg,#e34278,#9e2050)}.mini-product-card.gst{background:linear-gradient(145deg,#d8a12f,#8d5f0c)}

.dashboard-art{perspective:1200px}
.dash-window{
  width:min(650px,100%);height:315px;border-radius:18px;background:#fff;
  box-shadow:0 35px 70px rgba(0,0,0,.27);transform:rotateX(5deg) rotateY(-8deg);
  overflow:hidden;border:1px solid rgba(255,255,255,.5)
}
.dash-top{height:38px;display:flex;align-items:center;gap:6px;padding:0 14px;border-bottom:1px solid #e7ebf1}
.dash-top span{width:7px;height:7px;border-radius:50%;background:#d3dae4}.dash-top b{margin-left:auto;font-size:8px;letter-spacing:.12em;color:#63738a}
.dash-body{display:grid;grid-template-columns:75px 1fr;height:calc(100% - 38px)}
.dash-body aside{background:#071a3a;padding:20px 14px}.dash-body aside i{display:block;height:7px;border-radius:4px;background:rgba(255,255,255,.2);margin-bottom:16px}.dash-body aside i:first-child{background:#e4ae37}
.dash-body main{padding:25px;background:#f7f9fc}.dash-title{font-size:16px;font-weight:900;color:#0a2147}.dash-title small{font-size:8px;color:#1da365;margin-left:8px}
.dash-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.dash-metrics b{background:#fff;padding:14px;border-radius:10px;font-size:18px;color:#0a2147}.dash-metrics small{display:block;font-size:7px;color:#7b8ba0;margin-top:5px;font-weight:600}
.dash-chart{height:90px;background:#fff;border-radius:10px;margin-top:12px;display:flex;align-items:end;gap:8px;padding:15px}.dash-chart i{flex:1;background:linear-gradient(#3c91ec,#0e58b5);border-radius:4px 4px 0 0}.dash-chart i:nth-child(1){height:30%}.dash-chart i:nth-child(2){height:50%}.dash-chart i:nth-child(3){height:40%}.dash-chart i:nth-child(4){height:72%}.dash-chart i:nth-child(5){height:58%}.dash-chart i:nth-child(6){height:85%}.dash-chart i:nth-child(7){height:72%}
.float-chip{position:absolute;background:#fff;color:#0a2147;border-radius:9px;padding:10px 14px;font-size:8px;font-weight:900;letter-spacing:.1em;box-shadow:0 15px 30px rgba(0,0,0,.2)}.chip-a{right:0;top:50px}.chip-b{left:20px;bottom:45px;color:#c38c20}

.architecture-art{height:390px}
.arch-node{position:absolute;background:rgba(255,255,255,.97);color:#0a2147;border-radius:12px;padding:13px 17px;font-size:10px;font-weight:900;letter-spacing:.08em;box-shadow:0 15px 30px rgba(0,0,0,.18);z-index:3}
.arch-node.n1{left:2%;top:8%}.arch-node.n2{right:6%;top:15%}.arch-node.n3{left:8%;bottom:16%}.arch-node.n4{right:8%;bottom:12%}.arch-node.n5{left:42%;top:5%}
.arch-core{width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.4);display:grid;place-items:center;box-shadow:0 0 70px rgba(79,157,255,.3)}
.arch-core img{width:78px;height:78px;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.25))}
.connector{position:absolute;height:1px;background:linear-gradient(90deg,#e2b23e,rgba(255,255,255,.2));transform-origin:left center;width:170px}.c1{left:20%;top:30%;transform:rotate(-18deg)}.c2{left:25%;bottom:30%;transform:rotate(18deg)}.c3{right:20%;top:33%;transform:rotate(15deg)}.c4{right:24%;bottom:30%;transform:rotate(-15deg)}

.dfi-showcase-dots{display:flex;justify-content:center;gap:7px;margin-top:18px}.dfi-showcase-dots button{width:8px;height:8px;border:0;border-radius:50%;padding:0;background:#cbd3df;cursor:pointer;transition:.3s}.dfi-showcase-dots button.active{width:26px;border-radius:8px;background:#dba834}

.product-carousel{scroll-behavior:smooth}
@media(max-width:900px){
 .dfi-showcase{padding:70px 0}.dfi-showcase-head h2{font-size:38px}.dfi-showcase-slide{grid-template-columns:1fr;min-height:720px;padding:38px 28px}.showcase-copy h3{font-size:40px}.showcase-art{height:340px}.product-art{transform:scale(.88) rotate(-3deg)}.dash-window{width:100%}
}
@media(max-width:600px){
 .dfi-showcase-slide{min-height:680px}.showcase-copy h3{font-size:34px}.product-art{grid-template-columns:repeat(2,1fr);gap:9px;transform:none}.mini-product-card{min-height:105px;padding:13px}.mini-product-card b{font-size:14px}.mini-product-card span{font-size:7px}.dash-body{grid-template-columns:48px 1fr}.dash-metrics b{font-size:12px;padding:9px}.arch-node{font-size:7px;padding:9px}.arch-core{width:90px;height:90px}.arch-core img{width:60px;height:60px}
}

/* =========================================================
   DFI V4.1 — CAROUSEL RELIABILITY FIX
   ========================================================= */
.product-carousel{
  display:flex!important;
  gap:16px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory!important;
  scroll-behavior:smooth!important;
  overscroll-behavior-x:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
  padding:5px 2px 22px!important;
}
.product-carousel::-webkit-scrollbar{display:none!important}
.product-slide{
  flex:0 0 350px!important;
  min-width:350px!important;
  scroll-snap-align:start!important;
}
@media(max-width:600px){
  .product-slide{flex-basis:calc(100vw - 40px)!important;min-width:calc(100vw - 40px)!important}
}
.dfi-showcase-viewport{overflow:hidden!important}
.dfi-showcase-track{display:flex!important;width:100%!important}
.dfi-showcase-slide{flex:0 0 100%!important;box-sizing:border-box!important}


/* =========================================================
   DFI V4.2 — CINEMATIC MULTI-SLIDE MAIN HERO
   ========================================================= */
.dfi-hero-slider{
  position:relative;
  width:100%;
  height:calc(100% - 34px);
  overflow:hidden;
}
.dfi-hero-track{
  display:flex;
  width:100%;
  height:100%;
  transform:translateX(0);
}
.dfi-hero-slide{
  flex:0 0 100%;
  width:100%;
  height:100%;
  min-height:0;
  position:relative;
}
.dfi-hero-slide > .dfi-hero-inner{
  height:100%!important;
  min-height:100%!important;
}
.dfi-hero-slide .dfi-hero-copy,
.dfi-hero-slide .dfi-hero-visual{
  opacity:.35;
  transform:translateY(10px);
  transition:opacity .75s ease,transform .9s cubic-bezier(.2,.8,.2,1);
}
.dfi-hero-slide.is-active .dfi-hero-copy,
.dfi-hero-slide.is-active .dfi-hero-visual{
  opacity:1;
  transform:none;
}
.hero-slide-products{
  background:
    radial-gradient(circle at 78% 45%,rgba(226,177,57,.12),transparent 28%),
    radial-gradient(circle at 95% 15%,rgba(89,150,235,.16),transparent 30%);
}
.hero-slide-custom{
  background:
    radial-gradient(circle at 78% 50%,rgba(44,119,214,.13),transparent 31%),
    radial-gradient(circle at 15% 90%,rgba(224,176,56,.09),transparent 25%);
}

/* Slide 2 product composition */
.dfi-product-hero-visual{position:relative;min-height:500px}
.product-hero-ring{position:absolute;border:1px solid rgba(201,151,38,.24);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}
.product-hero-ring.ring-a{width:520px;height:520px}
.product-hero-ring.ring-b{width:410px;height:410px;border-color:rgba(40,120,218,.22)}
.product-hero-ring.ring-c{width:290px;height:290px;border-color:rgba(201,151,38,.35)}
.hero-product-stack{
  width:610px;max-width:100%;height:390px;position:relative;z-index:2;
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  transform:rotate(-4deg) perspective(1000px) rotateY(-4deg);
}
.hero-product-tile{
  min-height:125px;border-radius:15px;padding:17px;color:#fff;
  display:flex;flex-direction:column;justify-content:flex-end;
  box-shadow:0 22px 45px rgba(8,25,55,.18);
  border:1px solid rgba(255,255,255,.25);
  transition:transform .35s ease,box-shadow .35s ease;
}
.hero-product-tile:hover{transform:translateY(-9px) scale(1.02);box-shadow:0 30px 60px rgba(8,25,55,.26)}
.hero-product-tile small{font-size:7px;letter-spacing:.13em;opacity:.78;margin-bottom:auto}
.hero-product-tile strong{font-size:19px;letter-spacing:-.03em}
.hero-product-tile span{font-size:8px;margin-top:6px;opacity:.8}
.tile-dine{background:linear-gradient(145deg,#ef9b0a,#b95c00)}.tile-hr{background:linear-gradient(145deg,#1eaa68,#087344)}
.tile-remit{background:linear-gradient(145deg,#1d70e9,#0b429f)}.tile-booking{background:linear-gradient(145deg,#7d4de8,#45209c)}
.tile-mart{background:linear-gradient(145deg,#e34b7e,#a22051)}.tile-gst{background:linear-gradient(145deg,#d9a22f,#8d5f0b)}
.hero-product-center{
  position:absolute;left:50%;top:50%;width:130px;height:130px;transform:translate(-50%,-50%);
  border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.84);
  border:1px solid rgba(216,168,49,.35);box-shadow:0 18px 50px rgba(10,30,65,.18);z-index:4;
}
.hero-product-center img{width:90px;height:90px;object-fit:contain;filter:drop-shadow(0 10px 16px rgba(0,0,0,.18))}

/* Slide 3 custom engineering flow */
.custom-hero-visual{position:relative;min-height:500px}
.custom-orbit{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid rgba(51,126,218,.2);border-radius:50%}
.custom-orbit.orbit-one{width:520px;height:300px;transform:translate(-50%,-50%) rotate(17deg)}
.custom-orbit.orbit-two{width:520px;height:300px;transform:translate(-50%,-50%) rotate(-17deg);border-color:rgba(214,168,52,.28)}
.custom-orbit.orbit-three{width:350px;height:350px;border-color:rgba(51,126,218,.16)}
.custom-flow{position:relative;width:610px;height:430px;max-width:100%;margin:auto}
.flow-node{
  position:absolute;width:145px;padding:15px 16px;border-radius:14px;background:#fff;
  border:1px solid #dfe5ee;box-shadow:0 18px 40px rgba(8,25,55,.13);z-index:3;
}
.flow-node small{display:block;font-size:7px;letter-spacing:.16em;color:#c99322;font-weight:900;margin-bottom:8px}
.flow-node b{display:block;color:#071a3a;font-size:11px}.flow-node span{font-size:8px;color:#73849b;display:block;margin-top:5px}
.flow-node.n-idea{left:0;top:30px}.flow-node.n-design{right:0;top:30px}
.flow-node.n-build{left:0;bottom:35px}.flow-node.n-live{right:0;bottom:35px}
.flow-node.n-design:before,.flow-node.n-live:before{border-color:#d5a634}
.flow-core{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:150px;height:150px;
  border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.82);
  border:1px solid rgba(205,156,39,.38);box-shadow:0 0 0 18px rgba(255,255,255,.32),0 30px 70px rgba(8,25,55,.18);z-index:4
}
.flow-core img{width:98px;height:98px;object-fit:contain}
.custom-flow:after,.custom-flow:before{content:"";position:absolute;left:50%;top:50%;width:210px;height:1px;background:linear-gradient(90deg,transparent,#d9a638,transparent);transform-origin:center;z-index:1}
.custom-flow:after{transform:translate(-50%,-50%) rotate(28deg)}
.custom-flow:before{transform:translate(-50%,-50%) rotate(-28deg)}

@media(max-width:900px){
  .dfi-hero-slider{height:auto!important;min-height:0!important}
  .dfi-hero-track{height:auto}
  .dfi-hero-slide{height:auto;min-height:calc(100vh - 68px)}
  .dfi-hero-slide > .dfi-hero-inner{height:auto!important;min-height:calc(100vh - 68px)!important}
  .hero-product-stack{grid-template-columns:repeat(2,1fr);height:330px;transform:rotate(-2deg);padding:10px}
  .hero-product-tile{min-height:95px}
  .hero-product-center{width:105px;height:105px}.hero-product-center img{width:72px;height:72px}
  .custom-flow{height:350px}.flow-node{width:115px}.flow-core{width:110px;height:110px}.flow-core img{width:72px;height:72px}
}
@media(max-width:600px){
  .hero-product-stack{gap:8px;height:280px}.hero-product-tile{padding:11px}.hero-product-tile strong{font-size:14px}.hero-product-tile span{font-size:7px}
  .product-hero-ring.ring-a{width:370px;height:370px}.product-hero-ring.ring-b{width:290px;height:290px}.product-hero-ring.ring-c{width:220px;height:220px}
  .custom-orbit.orbit-one,.custom-orbit.orbit-two{width:390px;height:220px}.custom-orbit.orbit-three{width:260px;height:260px}
  .custom-flow{height:300px}.flow-node{width:98px;padding:11px}.flow-node b{font-size:9px}.flow-node span{font-size:7px}.flow-core{width:92px;height:92px}
}


/* =========================================================
   DFI V4.3 — HERO REBALANCE
   Software firm first. Products as one capability, not the identity.
   ========================================================= */
.dfi-hero-slider{height:calc(100% - 34px)!important}
.dfi-hero-track{height:100%!important;will-change:transform}
.dfi-hero-slide{height:100%!important;box-sizing:border-box}
.dfi-hero-slide > .dfi-hero-inner{
  min-height:660px!important;
  height:100%!important;
  box-sizing:border-box;
}
.hero-slide-main .dfi-hero-visual{opacity:1!important;transform:none!important}
.dfi-hero-slide.is-active .dfi-hero-copy,
.dfi-hero-slide.is-active .dfi-hero-visual{animation:heroEnter .72s both}
@keyframes heroEnter{
  from{opacity:0;transform:translateY(14px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.dfi-hero-controls{
  position:absolute;right:48px;bottom:52px;z-index:15;
  display:flex;align-items:center;gap:10px;padding:7px 9px;
  border:1px solid rgba(7,26,58,.10);border-radius:30px;
  background:rgba(255,255,255,.84);backdrop-filter:blur(12px);
  box-shadow:0 10px 30px rgba(7,26,58,.10)
}
.dfi-hero-controls>button{
  width:28px;height:28px;border:0;border-radius:50%;background:#071a3a;color:#fff;
  cursor:pointer;font-size:12px;transition:.2s
}
.dfi-hero-controls>button:hover{background:#c89220;transform:translateY(-1px)}
.dfi-hero-dots{display:flex;align-items:center;gap:6px}
.dfi-hero-dots button{
  width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#c7d0dc;cursor:pointer;transition:.3s
}
.dfi-hero-dots button.active{width:25px;border-radius:8px;background:#d39c25}
.hero-slide-main{background:transparent!important}
.hero-slide-products{background:
  radial-gradient(circle at 82% 50%,rgba(63,137,229,.10),transparent 32%),
  radial-gradient(circle at 14% 85%,rgba(221,174,53,.08),transparent 25%)}

/* Custom software workspace — intentionally dominant over product imagery. */
.dfi-custom-workspace{position:relative;min-height:500px;display:grid;place-items:center;perspective:1200px}
.workspace-glow{position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(70,142,235,.16),transparent 65%)}
.workspace-window{
  width:610px;max-width:94%;height:350px;border-radius:18px;background:#fff;
  border:1px solid rgba(255,255,255,.8);box-shadow:0 35px 70px rgba(7,26,58,.20);
  transform:rotateY(-8deg) rotateX(4deg);overflow:hidden;position:relative;z-index:3
}
.workspace-top{height:39px;display:flex;align-items:center;gap:6px;padding:0 15px;border-bottom:1px solid #e7ebf2}
.workspace-top span{width:7px;height:7px;border-radius:50%;background:#cbd3df}
.workspace-top b{margin-left:auto;font-size:8px;letter-spacing:.12em;color:#70819a}
.workspace-body{height:calc(100% - 39px);display:grid;grid-template-columns:72px 1fr}
.workspace-body aside{background:#071a3a;padding:20px 13px}.workspace-body aside i{display:block;height:7px;border-radius:4px;background:rgba(255,255,255,.18);margin-bottom:17px}.workspace-body aside i:first-child{background:#e1ae39}
.workspace-body main{background:#f7f9fc;padding:23px}
.workspace-header{display:flex;justify-content:space-between;align-items:end}.workspace-header small{display:block;font-size:7px;letter-spacing:.14em;color:#7d8da3;font-weight:800}.workspace-header strong{display:block;color:#071a3a;font-size:17px;margin-top:5px}.workspace-header em{font-size:7px;font-style:normal;color:#168e5b;font-weight:900;background:#e7f7ef;padding:6px 8px;border-radius:8px}
.workspace-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:18px}.workspace-cards div{background:#fff;border-radius:10px;padding:12px;box-shadow:0 5px 15px rgba(7,26,58,.04)}.workspace-cards small{display:block;font-size:6px;color:#8a98aa;font-weight:800;letter-spacing:.08em}.workspace-cards b{display:block;font-size:19px;color:#071a3a;margin-top:6px}.workspace-cards span{font-size:7px;color:#8a98aa}
.workspace-chart{background:#fff;border-radius:10px;margin-top:10px;padding:13px}.chart-label{display:flex;justify-content:space-between;font-size:7px;color:#7b8ba0}.chart-label b{color:#263b59}.chart-line{height:1px;background:#e9edf3;margin:14px 0}.chart-bars{height:70px;display:flex;align-items:end;gap:7px}.chart-bars i{flex:1;background:linear-gradient(#3f90ea,#0d5ab6);border-radius:3px 3px 0 0}.chart-bars i:nth-child(1){height:28%}.chart-bars i:nth-child(2){height:48%}.chart-bars i:nth-child(3){height:40%}.chart-bars i:nth-child(4){height:68%}.chart-bars i:nth-child(5){height:55%}.chart-bars i:nth-child(6){height:83%}.chart-bars i:nth-child(7){height:74%}.chart-bars i:nth-child(8){height:92%}
.workspace-chip{position:absolute;background:#fff;border-radius:10px;padding:10px 14px;font-size:8px;font-weight:900;letter-spacing:.1em;color:#071a3a;box-shadow:0 14px 28px rgba(7,26,58,.14);z-index:5}.chip-api{right:0;top:60px}.chip-cloud{left:8px;bottom:80px;color:#c28d20}.chip-ux{right:30px;bottom:45px}

/* Product slide: small, secondary ecosystem. */
.ecosystem-hero-visual{position:relative;min-height:500px;display:grid;place-items:center}
.eco-backdrop{position:absolute;width:480px;height:480px;border-radius:50%;border:1px solid rgba(205,158,45,.2);box-shadow:0 0 80px rgba(61,130,221,.08)}
.eco-card{position:absolute;width:170px;min-height:92px;padding:14px;border-radius:13px;background:#fff;border:1px solid #e0e5ec;box-shadow:0 15px 32px rgba(7,26,58,.11);z-index:3}.eco-card small{font-size:6px;letter-spacing:.13em;color:#8491a2}.eco-card b{display:block;font-size:14px;color:#071a3a;margin-top:7px}.eco-card span{font-size:7px;color:#8491a2}.eco-card.ec1{left:3%;top:8%;border-left:4px solid #df8c08}.eco-card.ec2{right:4%;top:9%;border-left:4px solid #19a365}.eco-card.ec3{left:0;bottom:13%;border-left:4px solid #1767dc}.eco-card.ec4{right:0;bottom:12%;border-left:4px solid #7145dc}.eco-card.ec5{left:27%;bottom:0;border-left:4px solid #d83f72}.eco-card.ec6{right:27%;top:0;border-left:4px solid #c89727}.eco-core{width:125px;height:125px;border-radius:50%;background:rgba(255,255,255,.88);border:1px solid rgba(205,158,45,.4);display:grid;place-items:center;z-index:5;box-shadow:0 0 0 18px rgba(255,255,255,.35),0 25px 55px rgba(7,26,58,.15)}.eco-core img{width:86px;height:86px;object-fit:contain}

@media(max-width:900px){
  .dfi-hero-slider{height:auto!important}.dfi-hero-track{height:auto}.dfi-hero-slide{height:auto!important;min-height:calc(100vh - 68px)}.dfi-hero-slide>.dfi-hero-inner{height:auto!important;min-height:calc(100vh - 68px)!important}
  .dfi-hero-controls{right:50%;transform:translateX(50%);bottom:18px}
  .workspace-window{transform:none}.workspace-chip{display:none}
  .eco-card{width:135px}.eco-card.ec5{left:18%;bottom:3%}.eco-card.ec6{right:18%;top:3%}
}
@media(max-width:600px){
  .dfi-hero-controls{bottom:12px}.eco-backdrop{width:330px;height:330px}.eco-card{width:112px;min-height:70px;padding:9px}.eco-card b{font-size:10px}.eco-card span{font-size:6px}.eco-core{width:90px;height:90px}.eco-core img{width:62px;height:62px}
}


/* =========================================================
   DFI V4.4 — HERO POLISH
   Full mark visibility + individual slide motion systems.
   ========================================================= */

/* Never allow the hero to crop the primary DFI mark. */
.dfi-hero-slider{
  overflow:hidden!important;
  isolation:isolate;
}
.dfi-hero-track{
  width:100%!important;
  height:100%!important;
}
.dfi-hero-slide{
  flex:0 0 100%!important;
  width:100%!important;
  min-width:100%!important;
  max-width:100%!important;
  overflow:visible!important;
}
.dfi-hero-slide > .dfi-hero-inner{
  overflow:visible!important;
}

/* The supplied laptop viewport is short. Scale the brand visual as one
   complete composition instead of letting its lower half disappear. */
.hero-slide-main .dfi-hero-visual{
  height:455px!important;
  transform:scale(.78)!important;
  transform-origin:center center!important;
}
.hero-slide-main .dfi-logo-stage{
  width:315px!important;
  height:315px!important;
}
.hero-slide-main .dfi-hero-mark{
  width:245px!important;
  height:245px!important;
  object-fit:contain!important;
  display:block!important;
}
.hero-slide-main .dfi-logo-halo{
  width:330px!important;
  height:330px!important;
}
.hero-slide-main .dfi-orbit-1{width:500px!important;height:185px!important}
.hero-slide-main .dfi-orbit-2{width:545px!important;height:210px!important}
.hero-slide-main .dfi-orbit-3{width:405px!important;height:405px!important}

/* On taller displays, give the composition a little more breathing room. */
@media (min-height:820px) and (min-width:901px){
  .hero-slide-main .dfi-hero-visual{
    height:500px!important;
    transform:scale(.84)!important;
  }
}

/* ---------------- Slide 01: brand reveal ---------------- */
.hero-slide-main.is-active .dfi-logo-stage{
  animation: dfiMarkFloat 5.8s ease-in-out .25s infinite;
}
.hero-slide-main.is-active .dfi-logo-halo{
  animation: dfiHaloPulse 3.8s ease-in-out .2s infinite;
}
.hero-slide-main.is-active .dfi-orbit-1{
  animation: dfiOrbitA 16s linear infinite;
}
.hero-slide-main.is-active .dfi-orbit-2{
  animation: dfiOrbitB 20s linear infinite;
}
.hero-slide-main.is-active .dfi-orbit-3{
  animation: dfiOrbitC 24s linear infinite;
}
.hero-slide-main.is-active .dfi-orbit-dot{
  animation: dfiDotPulse 2.2s ease-in-out infinite;
}
.hero-slide-main.is-active .dot-1{animation-delay:.1s}
.hero-slide-main.is-active .dot-2{animation-delay:.7s}
.hero-slide-main.is-active .dot-3{animation-delay:1.3s}

.hero-slide-main.is-active .dfi-float-card{
  animation: dfiCardFloat 4.5s ease-in-out infinite;
}
.hero-slide-main.is-active .card-product{animation-delay:.7s}
.hero-slide-main.is-active .card-digital{animation-delay:1.2s}
.hero-slide-main.is-active .card-tech{animation-delay:1.7s}

@keyframes dfiMarkFloat{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-8px) scale(1.012)}
}
@keyframes dfiHaloPulse{
  0%,100%{opacity:.75;transform:scale(1)}
  50%{opacity:1;transform:scale(1.035)}
}
@keyframes dfiOrbitA{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes dfiOrbitB{to{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes dfiOrbitC{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes dfiDotPulse{
  0%,100%{transform:scale(1);opacity:.55}
  50%{transform:scale(1.5);opacity:1}
}
@keyframes dfiCardFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}

/* ---------------- Slide 02: software workspace ---------------- */
.hero-slide-products.is-active .workspace-window{
  animation: workspaceEnter .9s cubic-bezier(.2,.8,.2,1) both,
             workspaceFloat 5.5s ease-in-out 1s infinite;
}
.hero-slide-products.is-active .workspace-glow{
  animation: workspaceGlow 3.6s ease-in-out infinite;
}
.hero-slide-products.is-active .workspace-chip{
  animation: chipFloat 4s ease-in-out infinite;
}
.hero-slide-products.is-active .chip-cloud{animation-delay:.5s}
.hero-slide-products.is-active .chip-ux{animation-delay:1s}
.hero-slide-products.is-active .chart-bars i{
  animation: chartRise .7s cubic-bezier(.2,.8,.2,1) both;
}
.hero-slide-products.is-active .chart-bars i:nth-child(2){animation-delay:.08s}
.hero-slide-products.is-active .chart-bars i:nth-child(3){animation-delay:.16s}
.hero-slide-products.is-active .chart-bars i:nth-child(4){animation-delay:.24s}
.hero-slide-products.is-active .chart-bars i:nth-child(5){animation-delay:.32s}
.hero-slide-products.is-active .chart-bars i:nth-child(6){animation-delay:.40s}
.hero-slide-products.is-active .chart-bars i:nth-child(7){animation-delay:.48s}
.hero-slide-products.is-active .chart-bars i:nth-child(8){animation-delay:.56s}

@keyframes workspaceEnter{
  from{opacity:0;transform:translateX(35px) rotateY(-14deg) rotateX(7deg)}
  to{opacity:1;transform:rotateY(-8deg) rotateX(4deg)}
}
@keyframes workspaceFloat{
  0%,100%{transform:rotateY(-8deg) rotateX(4deg) translateY(0)}
  50%{transform:rotateY(-6deg) rotateX(3deg) translateY(-7px)}
}
@keyframes workspaceGlow{
  0%,100%{opacity:.65;transform:scale(1)}
  50%{opacity:1;transform:scale(1.08)}
}
@keyframes chipFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}
@keyframes chartRise{
  from{transform:scaleY(.2);transform-origin:bottom}
  to{transform:scaleY(1);transform-origin:bottom}
}

/* ---------------- Slide 03: engineering flow ---------------- */
.hero-slide-custom.is-active .custom-orbit{
  animation: customOrbit 18s linear infinite;
}
.hero-slide-custom.is-active .orbit-two{
  animation-direction:reverse;
  animation-duration:22s;
}
.hero-slide-custom.is-active .flow-core{
  animation: coreBreath 4s ease-in-out infinite;
}
.hero-slide-custom.is-active .flow-node{
  animation: nodeFloat 4s ease-in-out infinite;
}
.hero-slide-custom.is-active .n-design{animation-delay:.45s}
.hero-slide-custom.is-active .n-build{animation-delay:.9s}
.hero-slide-custom.is-active .n-live{animation-delay:1.35s}

@keyframes customOrbit{
  from{transform:translate(-50%,-50%) rotate(0)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes coreBreath{
  0%,100%{transform:translate(-50%,-50%) scale(1)}
  50%{transform:translate(-50%,-50%) scale(1.035)}
}
@keyframes nodeFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}

/* ---------------- Slide 04: products as secondary capability ---------------- */
.hero-slide-products .eco-card{
  transition:transform .3s ease,box-shadow .3s ease;
}
.hero-slide-products.is-active .eco-card{
  animation: ecoCardIn .65s cubic-bezier(.2,.8,.2,1) both;
}
.hero-slide-products.is-active .ec1{animation-delay:.05s}
.hero-slide-products.is-active .ec2{animation-delay:.12s}
.hero-slide-products.is-active .ec3{animation-delay:.19s}
.hero-slide-products.is-active .ec4{animation-delay:.26s}
.hero-slide-products.is-active .ec5{animation-delay:.33s}
.hero-slide-products.is-active .ec6{animation-delay:.40s}
.hero-slide-products.is-active .eco-core{
  animation: coreBreath 4.2s ease-in-out .6s infinite;
}
@keyframes ecoCardIn{
  from{opacity:0;transform:translateY(14px) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

/* Slider controls: compact but clearly interactive. */
.dfi-hero-controls{
  transition:transform .25s ease,box-shadow .25s ease!important;
}
.dfi-hero-controls:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 14px 34px rgba(7,26,58,.14)!important;
}

/* Accessibility: honor reduced motion. */
@media (prefers-reduced-motion:reduce){
  .dfi-hero-slide *,
  .dfi-hero-slide::before,
  .dfi-hero-slide::after{
    animation:none!important;
    transition:none!important;
  }
}

/* Mobile: keep the entire DFI mark inside the visible hero. */
@media(max-width:900px){
  .hero-slide-main .dfi-hero-visual{
    height:390px!important;
    transform:scale(.72)!important;
  }
  .hero-slide-main .dfi-logo-stage{width:290px!important;height:290px!important}
  .hero-slide-main .dfi-hero-mark{width:225px!important;height:225px!important}
}


/* =========================================================
   DFI V4.5 — HERO RIGHT VISUAL POSITION
   Move the complete right-side DFI visual upward so the
   mark sits comfortably inside the first viewport.
   ========================================================= */

/* Desktop/laptop viewport: raise the entire visual composition,
   not individual pieces, so the orbit system stays aligned. */
.hero-slide-main .dfi-hero-visual{
  transform:translateY(-58px) scale(.78)!important;
}

/* Taller screens need a smaller correction because there is more room. */
@media (min-height:820px) and (min-width:901px){
  .hero-slide-main .dfi-hero-visual{
    transform:translateY(-28px) scale(.84)!important;
  }
}

/* Keep the slide's entrance animation from resetting the corrected
   position after the slide becomes active. */
.hero-slide-main.is-active .dfi-hero-visual{
  animation:heroMainVisualEnter .72s cubic-bezier(.2,.8,.2,1) both!important;
}

@keyframes heroMainVisualEnter{
  from{
    opacity:0;
    transform:translateY(-42px) scale(.74);
  }
  to{
    opacity:1;
    transform:translateY(-58px) scale(.78);
  }
}

@media (min-height:820px) and (min-width:901px){
  @keyframes heroMainVisualEnter{
    from{
      opacity:0;
      transform:translateY(-15px) scale(.80);
    }
    to{
      opacity:1;
      transform:translateY(-28px) scale(.84);
    }
  }
}

@media(max-width:900px){
  .hero-slide-main .dfi-hero-visual{
    transform:translateY(-30px) scale(.72)!important;
  }
  .hero-slide-main.is-active .dfi-hero-visual{
    animation:heroMainVisualEnterMobile .72s cubic-bezier(.2,.8,.2,1) both!important;
  }
  @keyframes heroMainVisualEnterMobile{
    from{opacity:0;transform:translateY(-18px) scale(.69)}
    to{opacity:1;transform:translateY(-30px) scale(.72)}
  }
}


/* =========================================================
   DFI V4.6 — HERO VERTICAL BALANCE
   The previous hero had excessive whitespace between the
   navigation and the actual hero content. Move the complete
   hero composition upward as one unit.
   ========================================================= */

/* Main desktop/laptop correction:
   - removes the large dead area below the navigation
   - brings copy + visual into the primary viewing zone
   - keeps the bottom ticker visible */
@media (min-width:901px){
  .dfi-hero-slide > .dfi-hero-inner{
    transform:translateY(-108px)!important;
  }

  .hero-slide-main .dfi-hero-visual{
    transform:translateY(-68px) scale(.78)!important;
  }

  .hero-slide-main.is-active .dfi-hero-visual{
    animation:heroMainVisualEnterV46 .72s cubic-bezier(.2,.8,.2,1) both!important;
  }

  @keyframes heroMainVisualEnterV46{
    from{
      opacity:0;
      transform:translateY(-50px) scale(.74);
    }
    to{
      opacity:1;
      transform:translateY(-68px) scale(.78);
    }
  }
}

/* Taller desktop screens: use a gentler correction. */
@media (min-width:901px) and (min-height:820px){
  .dfi-hero-slide > .dfi-hero-inner{
    transform:translateY(-72px)!important;
  }

  .hero-slide-main .dfi-hero-visual{
    transform:translateY(-38px) scale(.84)!important;
  }

  @keyframes heroMainVisualEnterV46{
    from{
      opacity:0;
      transform:translateY(-22px) scale(.80);
    }
    to{
      opacity:1;
      transform:translateY(-38px) scale(.84);
    }
  }
}

/* Keep the mobile layout natural; only trim its oversized top gap. */
@media(max-width:900px){
  .dfi-hero-slide > .dfi-hero-inner{
    transform:translateY(-28px)!important;
  }

  .hero-slide-main .dfi-hero-visual{
    transform:translateY(-30px) scale(.72)!important;
  }
}

/* The hero should never visually collide with the bottom ticker. */
.dfi-hero-slider{
  overflow:hidden!important;
}


/* =========================================================
   DFI V4.7 — FOOTER BRAND MARK
   Replace the empty white footer square with the actual DFI
   gold/blue symbol. The full company name remains live HTML
   elsewhere for clear branding and SEO.
   ========================================================= */

.footer-brand .footer-logo-box{
  width:190px;
  height:190px;
  border-radius:18px;
  background:linear-gradient(145deg,#0b2349,#06162f);
  border:1px solid rgba(255,255,255,.12);
  display:grid;
  place-items:center;
  overflow:hidden;
  margin-bottom:22px;
  box-shadow:
    0 18px 40px rgba(0,0,0,.18),
    inset 0 0 0 1px rgba(232,181,60,.06);
}

.footer-brand .footer-logo-box img{
  width:138px!important;
  height:138px!important;
  object-fit:contain!important;
  display:block!important;
  filter:none!important;
  transition:transform .35s ease,filter .35s ease;
}

.footer-brand .footer-logo-box:hover img{
  transform:scale(1.055) translateY(-2px);
  filter:drop-shadow(0 8px 15px rgba(232,181,60,.16))!important;
}

@media(max-width:520px){
  .footer-brand .footer-logo-box{
    width:155px;
    height:155px;
  }
  .footer-brand .footer-logo-box img{
    width:112px!important;
    height:112px!important;
  }
}


/* =========================================================
   DFI V4.8 — CONTENT & VISUAL HIERARCHY
   More distinctive copy, stronger color hierarchy and a
   unique software-system visual instead of a repeated graph.
   ========================================================= */

/* Service cards: stop every line from looking the same weight/color. */
.service-card{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 100%,rgba(215,166,54,.07),transparent 35%),
    #fff!important;
}
.service-card>span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--gold)!important;
}
.service-card b{
  color:var(--navy)!important;
  letter-spacing:-.025em;
  transition:color .25s ease,transform .25s ease;
}
.service-card p{
  color:#627695!important;
  line-height:1.7;
}
.service-card a{
  color:var(--blue)!important;
  transition:color .2s ease,transform .2s ease;
}
.service-card a em{
  color:var(--gold)!important;
}
.service-card:hover b{
  color:var(--blue)!important;
  transform:translateX(2px);
}
.service-card:hover a{
  color:var(--navy)!important;
  transform:translateX(3px);
}

/* Solutions page cards: gold label, navy title, blue body/CTA. */
.inner-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,#fff 0%,#fbfcff 72%,#f4f7fc 100%)!important;
}
.inner-card:after{
  content:"";
  position:absolute;
  width:120px;
  height:120px;
  right:-55px;
  bottom:-55px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(220,171,65,.13),transparent 70%);
  pointer-events:none;
}
.inner-card .num{
  color:var(--gold)!important;
}
.inner-card h3{
  color:var(--navy)!important;
  letter-spacing:-.025em;
  transition:transform .25s ease,color .25s ease;
}
.inner-card p{
  color:#667995!important;
  line-height:1.75;
}
.inner-card a{
  color:var(--blue)!important;
  font-weight:900;
  transition:transform .2s ease,color .2s ease;
}
.inner-card:hover h3{
  color:#0e57c8!important;
  transform:translateX(2px);
}
.inner-card:hover a{
  color:var(--gold)!important;
  transform:translateX(3px);
}

/* Value cards: slightly more expressive hierarchy. */
.value-card h3{color:var(--navy)!important}
.value-card p{color:#667995!important;line-height:1.7}
.value-card>a{color:var(--blue)!important}
.value-card>a span{color:var(--gold)!important}

/* Replacement for the repeated graph in the custom software hero. */
.workspace-modules{
  margin-top:15px;
  border:1px solid #dfe6f0;
  border-radius:12px;
  padding:13px 14px;
  background:linear-gradient(180deg,#fbfdff,#f3f7fc);
  box-shadow:0 8px 20px rgba(8,26,58,.05);
}
.module-label{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}
.module-label b{
  font-size:8px;
  letter-spacing:.12em;
  color:var(--navy);
}
.module-label span{
  font-size:7px;
  letter-spacing:.08em;
  color:#8090a9;
}
.module-flow{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr;
  gap:7px;
  align-items:center;
}
.module-flow>i{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:9px 8px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  font-style:normal;
  box-shadow:0 4px 12px rgba(8,26,58,.04);
}
.module-flow>i span{
  font-size:8px;
  font-weight:900;
  color:#0e57c8;
  letter-spacing:.06em;
}
.module-flow>i em{
  font-size:7px;
  color:#7787a0;
  font-style:normal;
}
.module-flow>b{
  font-size:11px;
  color:var(--gold);
}
.module-status{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid #e3e8f0;
  font-size:7px;
  color:#7787a0;
}
.module-status span:first-child{
  color:#157a54;
  font-weight:900;
}
.module-status i{
  display:inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#22a66b;
  margin-right:4px;
  box-shadow:0 0 0 3px rgba(34,166,107,.10);
}

/* Give the hero module visual a tiny independent motion. */
.hero-slide-products.is-active .workspace-modules{
  animation:moduleBoardIn .7s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes moduleBoardIn{
  from{opacity:0;transform:translateY(8px) scale(.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}


/* =========================================================
   DFI V4.9 — NAVIGATION, FOOTER & BRAND CONTENT
   ========================================================= */

/* Make every navigation state unambiguous. */
.nav-links a.active{
  color:var(--gold)!important;
}
.nav-links a.active:not(.nav-cta):after{
  transform:scaleX(1)!important;
  opacity:1!important;
}
.nav-links a:not(.nav-cta){
  position:relative;
}
.nav-links a:not(.nav-cta):after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-14px;
  height:2px;
  background:var(--gold);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .25s ease;
}

/* Hero buttons must remain clickable above visual layers. */
.dfi-actions{position:relative;z-index:30}
.dfi-actions .btn{position:relative;z-index:31;pointer-events:auto}

/* Stronger value-section hierarchy. */
.value-section .split-heading h2{
  letter-spacing:-.045em;
}
.value-section .split-heading h2 span{
  color:var(--gold);
}
.value-section .split-heading>p{
  color:#607493;
  max-width:620px;
  line-height:1.75;
}

/* Solutions intro: give the service grid a real editorial opening. */
.section-intro-v49{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);
  gap:50px;
  align-items:end;
  margin-bottom:38px;
}
.section-intro-v49 h2{
  margin:8px 0 0;
  color:var(--navy);
  font-size:clamp(34px,4vw,56px);
  line-height:.98;
  letter-spacing:-.045em;
}
.section-intro-v49 h2 span{color:var(--gold)}
.section-intro-v49 p{
  margin:0;
  max-width:560px;
  color:#667995;
  font-size:16px;
  line-height:1.75;
}

/* Footer now carries real company information instead of empty space. */
.footer-grid-v49{
  grid-template-columns:1.35fr 1.05fr .7fr .9fr .9fr;
  gap:44px;
}
.footer-logo-box{
  background:transparent!important;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:110px!important;
  height:86px!important;
}
.footer-logo-box img{
  width:86px!important;
  height:86px!important;
  object-fit:contain;
}
.footer-brand>p{
  max-width:330px;
}
.footer-contact{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin:16px 0 18px;
}
.footer-contact a{
  color:#9fb0ca!important;
  text-decoration:none;
  font-size:13px;
}
.footer-contact a:hover{color:#fff!important}
.footer-address p{
  margin:0;
  color:#9fb0ca;
  font-size:13px;
  line-height:1.85;
}
.footer-address strong{color:#fff}
.footer-socials a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.footer-socials .social-icon{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  font-size:11px;
  font-weight:900;
  color:#dce5f4;
  text-transform:none;
}
.footer-socials a:hover .social-icon{
  border-color:var(--gold);
  color:var(--gold);
  transform:translateY(-2px);
}

/* Slightly tighten the footer so contact information feels intentional. */
.footer-grid-v49>div>h4{
  color:#fff;
  margin-bottom:17px;
}
.footer-grid-v49>div>a{
  transition:color .2s ease,transform .2s ease;
}
.footer-grid-v49>div>a:hover{
  color:var(--gold)!important;
  transform:translateX(3px);
}

/* Make the repeated slogan ticker feel like part of the engineering brand. */
.ticker-track span{
  letter-spacing:.18em;
}
.ticker-track i{
  color:var(--gold);
}

/* Mobile */
@media(max-width:900px){
  .section-intro-v49{grid-template-columns:1fr;gap:18px}
  .footer-grid-v49{grid-template-columns:1fr 1fr;gap:34px}
}
@media(max-width:620px){
  .footer-grid-v49{grid-template-columns:1fr}
  .footer-address{order:2}
}


/* =========================================================
   DFI V5.0 — COMPLETE NAVIGATION / CONTACT / COPY POLISH
   ========================================================= */

/* Navigation: identical geometry and state on every page. */
.header{
  background:rgba(7,26,58,.97);
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#fff;
}
.header.scrolled{box-shadow:0 10px 35px rgba(4,17,40,.22)}
.nav-links{color:#fff}
.nav-links>a:not(.nav-cta):after{background:var(--gold2)}
.nav-links>a:hover,.nav-links>a.active{color:var(--gold2)!important}
.nav-cta{
  background:var(--gold2)!important;
  color:var(--navy)!important;
  border:1px solid rgba(255,255,255,.16);
  border-radius:13px!important;
  padding:14px 20px!important;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.nav-cta b{color:var(--navy)!important;background:rgba(7,26,58,.96);color:#fff!important;width:27px;height:27px;border-radius:50%;display:inline-grid;place-items:center;margin-left:8px}
.menu-btn span{background:#fff}

/* Home hero CTAs sit above every decorative visual layer and remain clickable. */
.dfi-hero-copy .hero-actions a{
  position:relative;
  z-index:50;
  pointer-events:auto;
}
.dfi-hero-copy{position:relative;z-index:30}

/* Make the secondary CTA visibly interactive. */
.dfi-hero-copy .btn-light{
  color:var(--navy);
  background:rgba(255,255,255,.96);
}
.dfi-hero-copy .btn-light:hover{
  border-color:#cfa646;
  background:#fff;
}

/* Solutions page cards: stronger hierarchy instead of same-weight text. */
.section-intro-v49 p{max-width:760px;color:#687995;font-size:16px;line-height:1.75}
.inner-card{
  min-height:305px;
  display:flex;
  flex-direction:column;
  background:linear-gradient(145deg,#fff 0%,#fbfcfe 100%);
}
.inner-card .num{font-size:10px;color:var(--gold);font-weight:950;letter-spacing:.18em}
.inner-card h3{font-size:24px;line-height:1.12;letter-spacing:-.025em;color:var(--navy);margin:22px 0 12px}
.inner-card p{font-size:14px;line-height:1.7;color:#647693;margin-bottom:20px}
.inner-card a{margin-top:auto;font-size:12px;color:var(--blue);font-weight:900}

/* Contact */
.contact-hero h1 span{color:var(--gold)}
.contact-section{padding-top:72px}
.contact-info-box{box-shadow:0 28px 70px rgba(7,26,58,.15)}
.contact-info-box>p{max-width:470px}
.contact-details-rich{gap:0;margin-top:28px}
.contact-detail-row{
  display:flex;align-items:flex-start;gap:13px;
  padding:15px 0;
  border-top:1px solid rgba(255,255,255,.12);
  color:#fff;
}
.contact-detail-row:last-child{border-bottom:1px solid rgba(255,255,255,.12)}
.contact-detail-row>span:last-child{display:block}
.contact-detail-row b{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#dce5f4}
.contact-detail-row em{display:block;font-style:normal;font-size:13px;color:#aebbd0;margin-top:2px;line-height:1.65}
.contact-icon{
  width:34px;height:34px;flex:0 0 34px;border-radius:10px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.08);color:var(--gold2);
  font-size:15px;
}
.whatsapp-icon{color:#62d98c}
.whatsapp-icon svg{width:18px;height:18px;fill:currentColor}
.address-row{align-items:flex-start}
.form-heading h3{font-size:30px;line-height:1.1;margin:5px 0 7px;color:var(--navy)}
.form-heading p{margin:0 0 25px;color:var(--muted);font-size:13px}
.contact-note{background:#f0f5fb}
.contact-note-inner{display:flex;justify-content:space-between;align-items:center;gap:40px}
.contact-note-inner h2{font-size:38px;letter-spacing:-.04em;margin:7px 0 0}
.contact-note-inner p{max-width:450px;color:var(--muted);font-size:15px}

/* Footer: no blank square, real DFI mark + searchable company name. */
.footer-grid-v50{
  grid-template-columns:1.45fr 1.15fr .7fr 1fr .9fr;
  gap:42px;
}
.footer-brand-lockup{
  display:inline-flex;align-items:center;gap:13px;margin-bottom:18px;
}
.footer-mark{
  width:58px;height:58px;display:grid;place-items:center;
  border-radius:12px;background:linear-gradient(145deg,#0d2a55,#06162f);
  border:1px solid rgba(227,179,78,.28);
}
.footer-mark img{width:45px;height:45px;object-fit:contain}
.footer-brand-lockup>span:last-child{display:flex;flex-direction:column}
.footer-brand-lockup strong{font-size:21px;letter-spacing:.13em;color:#fff;line-height:1}
.footer-brand-lockup small{font-size:9px;letter-spacing:.26em;color:var(--gold2);font-weight:900;margin-top:6px}
.footer-grid-v50 .footer-contact a{
  display:flex;align-items:center;gap:8px;
}
.footer-contact-icon{
  width:20px;height:20px;display:inline-grid;place-items:center;
  border-radius:50%;color:var(--gold2);font-size:10px;
  border:1px solid rgba(227,179,78,.35);
}
.footer-grid-v50 .footer-address p{font-size:13px}
.footer-grid-v50>div>h4{color:#fff}
.footer-grid-v50>div>a{display:block;color:#9fb0ca;margin:7px 0;font-size:13px}
.footer-grid-v50>div>a:hover{color:var(--gold)!important}
.footer-socials .social-placeholder{display:inline-flex!important;width:auto!important;margin-right:8px!important}
.footer-socials .social-icon{
  transition:.25s;
}
.footer-socials .social-placeholder:hover .social-icon{
  background:var(--gold2);color:var(--navy);border-color:var(--gold2);
}

/* Remove any legacy blank footer logo styling from earlier patch. */
.footer-grid-v49{grid-template-columns:1.45fr 1.15fr .7fr 1fr .9fr}
.footer-grid-v49 .footer-logo-box{display:none!important}

/* Responsive */
@media(max-width:900px){
  .nav-links{background:var(--navy)!important}
  .nav-links>a:not(.nav-cta){color:#fff}
  .footer-grid-v50{grid-template-columns:1fr 1fr}
  .contact-note-inner{display:block}
  .contact-note-inner p{margin-top:18px}
}
@media(max-width:620px){
  .footer-grid-v50{grid-template-columns:1fr}
  .contact-layout{grid-template-columns:1fr}
  .contact-note-inner h2{font-size:30px}
}

/* =========================================================
   DFI LEGAL TYPOGRAPHY + FOOTER LOGO CONSISTENCY
   Typography-only refinement for policy pages. No layout,
   section-position or component-structure changes.
   ========================================================= */
.footer-brand-lockup .footer-mark img{
  filter:none!important;
}

.legal-copy{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
.legal-copy h2{
  font-size:25px!important;
  line-height:1.28!important;
  letter-spacing:-.025em!important;
  margin:30px 0 10px!important;
  font-weight:800!important;
  color:var(--navy)!important;
}
.legal-copy p{
  max-width:none!important;
  font-size:14px!important;
  line-height:1.78!important;
  color:#586b87!important;
  margin:0 0 13px!important;
}
.legal-copy p.legal-effective{
  font-size:12px!important;
  color:#70809a!important;
  margin-bottom:24px!important;
}
.legal-copy a{
  color:#0e61d8;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
}
@media(max-width:800px){
  .legal-copy h2{font-size:22px!important;}
  .legal-copy p{font-size:13.5px!important;}
}


/* =========================================================
   DFI HOME HERO — SLIDE 01 REFINEMENT
   Scope: first hero slide only. No global layout changes.
   ========================================================= */
@media (min-width: 901px) {
  .hero-slide-main > .dfi-hero-inner {
    grid-template-columns: 1.12fr .88fr !important;
    gap: 28px !important;
    padding-top: 24px !important;
    padding-bottom: 62px !important;
  }

  .hero-slide-main .dfi-hero-copy {
    max-width: 690px;
    align-self: center;
  }

  .hero-slide-main .dfi-eyebrow {
    margin-bottom: 10px !important;
    font-size: 10px !important;
    letter-spacing: .20em !important;
  }

  .hero-slide-main .dfi-kicker {
    margin-bottom: 22px !important;
    font-size: 10px !important;
    letter-spacing: .18em !important;
  }

  .hero-slide-main .dfi-hero-copy h1 {
    max-width: 680px;
    font-size: clamp(50px, 4.55vw, 66px) !important;
    line-height: .96 !important;
    letter-spacing: -.052em !important;
    margin-bottom: 23px !important;
  }

  .hero-slide-main .dfi-hero-copy h1 em {
    display: inline-block;
  }

  .hero-slide-main .dfi-hero-description {
    max-width: 650px !important;
    font-size: 15px !important;
    line-height: 1.62 !important;
    margin-bottom: 24px !important;
  }

  .hero-slide-main .dfi-actions {
    gap: 12px !important;
  }

  .hero-slide-main .dfi-actions .btn {
    min-height: 48px !important;
    padding: 0 22px !important;
  }

  .hero-slide-main .dfi-trust {
    margin-top: 18px !important;
    font-size: 10.5px !important;
    letter-spacing: .02em;
  }

  .hero-slide-main .dfi-hero-visual {
    height: 440px !important;
    transform: translate(18px,-6px) scale(.72) !important;
    transform-origin: center center !important;
  }

  .hero-slide-main .dfi-logo-stage {
    width: 320px !important;
    height: 320px !important;
  }

  .hero-slide-main .dfi-hero-mark {
    width: 238px !important;
    height: 238px !important;
  }

  .hero-slide-main .dfi-float-card {
    min-width: 126px;
    padding: 12px 15px !important;
  }

  .hero-slide-main .dfi-float-card small {
    font-size: 7px !important;
    letter-spacing: .12em;
  }

  .hero-slide-main .dfi-float-card strong {
    font-size: 10.5px !important;
    letter-spacing: .025em;
  }

  .hero-slide-main .card-software { left: -2px !important; top: 58px !important; }
  .hero-slide-main .card-product  { right: -8px !important; top: 166px !important; }
  .hero-slide-main .card-digital  { left: 22px !important; bottom: 66px !important; }
  .hero-slide-main .card-tech     { right: 16px !important; bottom: 54px !important; }
}

@media (max-width: 900px) {
  .hero-slide-main .dfi-hero-copy h1 {
    font-size: clamp(46px, 10.5vw, 62px) !important;
    line-height: .96 !important;
  }
  .hero-slide-main .dfi-hero-description {
    max-width: 620px !important;
    line-height: 1.58 !important;
  }
}


/* =========================================================
   DFI V5.1 — DESKTOP HERO VIEWPORT FIT
   Goal: complete hero frame visible at 100% browser zoom.
   Geometry-only correction. No content or page redesign.
   ========================================================= */
@media (min-width: 901px) {

  /* Compact but premium desktop header. */
  .header,
  .nav,
  .header .nav{
    height:66px!important;
    min-height:66px!important;
  }
  .brand{
    height:52px!important;
  }
  .brand-mark{
    width:42px!important;
    height:46px!important;
    flex-basis:42px!important;
  }
  .brand-name{
    font-size:18px!important;
  }
  .brand-sub{
    font-size:7px!important;
    margin-top:4px!important;
  }
  .nav-links>a{
    padding:22px 0!important;
  }
  .nav-links>a:not(.nav-cta):after{
    bottom:13px!important;
  }
  .nav-cta{
    padding:10px 17px!important;
  }

  /* Header + hero + technical ticker = one viewport. */
  .dfi-hero-v36{
    height:calc(100svh - 100px)!important;
    min-height:480px!important;
    max-height:620px!important;
  }
  .dfi-hero-slider{
    height:calc(100% - 32px)!important;
    min-height:0!important;
  }
  .dfi-hero-track,
  .dfi-hero-slide{
    height:100%!important;
    min-height:0!important;
  }

  /* Cancel old upward translations which clipped slide headings. */
  .dfi-hero-slide > .dfi-hero-inner{
    height:100%!important;
    min-height:0!important;
    transform:none!important;
    grid-template-columns:1.08fr .92fr!important;
    align-items:center!important;
    gap:24px!important;
    padding:14px 0 18px!important;
  }

  .dfi-hero-copy{
    padding-top:0!important;
    align-self:center!important;
  }

  .dfi-eyebrow{
    font-size:9px!important;
    letter-spacing:.18em!important;
    margin-bottom:7px!important;
  }
  .dfi-eyebrow span{
    width:25px!important;
    height:2px!important;
  }
  .dfi-kicker{
    font-size:9px!important;
    letter-spacing:.18em!important;
    margin-bottom:12px!important;
  }

  .dfi-hero-copy h1,
  .hero-slide-main .dfi-hero-copy h1{
    font-size:clamp(43px,4.15vw,58px)!important;
    line-height:.94!important;
    letter-spacing:-.052em!important;
    margin:0 0 15px!important;
    max-width:650px!important;
  }

  .dfi-hero-description,
  .hero-slide-main .dfi-hero-description{
    font-size:13.5px!important;
    line-height:1.48!important;
    max-width:610px!important;
    margin:0 0 16px!important;
  }

  .dfi-actions{
    gap:10px!important;
  }
  .dfi-actions .btn,
  .hero-slide-main .dfi-actions .btn{
    min-height:42px!important;
    padding:0 18px!important;
    font-size:12px!important;
    border-radius:9px!important;
  }

  .dfi-trust,
  .hero-slide-main .dfi-trust{
    margin-top:12px!important;
    font-size:9.5px!important;
  }
  .dfi-trust-icon{
    width:20px!important;
    height:20px!important;
    border-radius:6px!important;
  }

  /* First slide visual: no transform stacking, no crop. */
  .hero-slide-main .dfi-hero-visual,
  .hero-slide-main.is-active .dfi-hero-visual{
    height:360px!important;
    min-height:0!important;
    transform:scale(.70)!important;
    transform-origin:center center!important;
    animation:none!important;
  }
  .hero-slide-main .dfi-logo-stage{
    width:315px!important;
    height:315px!important;
  }
  .hero-slide-main .dfi-hero-mark{
    width:235px!important;
    height:235px!important;
  }

  /* Other hero visuals fit the same available frame. */
  .dfi-custom-workspace,
  .custom-hero-visual,
  .ecosystem-hero-visual{
    height:370px!important;
    min-height:0!important;
    max-height:370px!important;
    align-self:center!important;
  }
  .dfi-custom-workspace{
    transform:scale(.82)!important;
    transform-origin:center center!important;
  }
  .custom-hero-visual{
    transform:scale(.80)!important;
    transform-origin:center center!important;
  }
  .ecosystem-hero-visual{
    transform:scale(.82)!important;
    transform-origin:center center!important;
  }

  /* Keep slide controls clear of the bottom capability strip. */
  .dfi-hero-controls{
    right:38px!important;
    bottom:41px!important;
    padding:5px 7px!important;
  }

  .dfi-hero-bottom{
    height:32px!important;
  }
  .dfi-bottom-inner{
    font-size:6.8px!important;
    letter-spacing:.18em!important;
  }

  /* Secondary technical ticker stays visible within the same viewport. */
  .ticker{
    height:34px!important;
    padding:7px 0!important;
    display:flex!important;
    align-items:center!important;
  }
  .ticker-track{
    font-size:8px!important;
    gap:24px!important;
    letter-spacing:.20em!important;
  }
}

/* Extra compression for short laptop browser viewports. */
@media (min-width: 901px) and (max-height: 720px){
  .header,
  .nav,
  .header .nav{
    height:62px!important;
    min-height:62px!important;
  }
  .brand-mark{width:39px!important;height:43px!important;flex-basis:39px!important}
  .brand-name{font-size:17px!important}
  .nav-links>a{padding:20px 0!important}

  .dfi-hero-v36{
    height:calc(100svh - 94px)!important;
    min-height:445px!important;
  }
  .dfi-hero-slide > .dfi-hero-inner{
    padding:8px 0 12px!important;
  }
  .dfi-hero-copy h1,
  .hero-slide-main .dfi-hero-copy h1{
    font-size:clamp(40px,3.9vw,53px)!important;
    margin-bottom:12px!important;
  }
  .dfi-hero-description,
  .hero-slide-main .dfi-hero-description{
    font-size:12.5px!important;
    line-height:1.43!important;
    margin-bottom:12px!important;
  }
  .dfi-eyebrow{margin-bottom:5px!important}
  .dfi-kicker{margin-bottom:9px!important}
  .dfi-actions .btn,
  .hero-slide-main .dfi-actions .btn{
    min-height:39px!important;
    padding:0 16px!important;
    font-size:11.5px!important;
  }
  .dfi-trust,
  .hero-slide-main .dfi-trust{
    margin-top:8px!important;
  }

  .hero-slide-main .dfi-hero-visual,
  .hero-slide-main.is-active .dfi-hero-visual{
    height:330px!important;
    transform:scale(.64)!important;
  }
  .dfi-custom-workspace,
  .custom-hero-visual,
  .ecosystem-hero-visual{
    height:330px!important;
    max-height:330px!important;
  }
  .dfi-custom-workspace{transform:scale(.74)!important}
  .custom-hero-visual{transform:scale(.72)!important}
  .ecosystem-hero-visual{transform:scale(.75)!important}

  .dfi-hero-controls{
    bottom:38px!important;
  }
}


/* =========================================================
   DFI V5.2 — HERO SLIDE 01 POLISH
   Final visual hierarchy refinement for desktop.
   ========================================================= */
@media (min-width: 901px) {

  /* With the redundant second ticker removed, hero can breathe slightly more. */
  .dfi-hero-v36{
    height:calc(100svh - 66px)!important;
    min-height:500px!important;
    max-height:640px!important;
  }

  .dfi-hero-slider{
    height:calc(100% - 34px)!important;
  }

  .hero-slide-main > .dfi-hero-inner{
    grid-template-columns:1.03fr .97fr!important;
    gap:34px!important;
    padding:18px 0 22px!important;
  }

  .hero-slide-main .dfi-hero-copy{
    max-width:640px!important;
  }

  .hero-slide-main .dfi-eyebrow{
    font-size:9px!important;
    letter-spacing:.19em!important;
    margin-bottom:7px!important;
  }

  .hero-slide-main .dfi-kicker{
    font-size:9px!important;
    letter-spacing:.16em!important;
    margin-bottom:15px!important;
    white-space:nowrap;
  }

  .hero-slide-main .dfi-hero-copy h1{
    font-size:clamp(39px,3.75vw,52px)!important;
    line-height:.98!important;
    letter-spacing:-.047em!important;
    max-width:620px!important;
    margin-bottom:17px!important;
  }

  .hero-slide-main .dfi-hero-description{
    max-width:610px!important;
    font-size:14px!important;
    line-height:1.56!important;
    margin-bottom:20px!important;
  }

  .hero-slide-main .dfi-actions{
    gap:12px!important;
  }

  .hero-slide-main .dfi-actions .btn{
    min-height:43px!important;
    padding:0 19px!important;
    font-size:11.8px!important;
  }

  .hero-slide-main .dfi-trust{
    margin-top:13px!important;
    font-size:9.6px!important;
  }

  /* Slightly stronger visual presence on the right, without crowding. */
  .hero-slide-main .dfi-hero-visual,
  .hero-slide-main.is-active .dfi-hero-visual{
    height:390px!important;
    transform:scale(.78)!important;
    transform-origin:center center!important;
  }

  .hero-slide-main .dfi-logo-stage{
    width:330px!important;
    height:330px!important;
  }

  .hero-slide-main .dfi-hero-mark{
    width:250px!important;
    height:250px!important;
  }

  /* Pull floating labels closer to the core visual. */
  .hero-slide-main .card-software{
    left:32px!important;
    top:68px!important;
  }
  .hero-slide-main .card-product{
    right:24px!important;
    top:151px!important;
  }
  .hero-slide-main .card-digital{
    left:52px!important;
    bottom:82px!important;
  }
  .hero-slide-main .card-tech{
    right:36px!important;
    bottom:72px!important;
  }

  .hero-slide-main .dfi-float-card{
    min-width:118px!important;
    padding:10px 13px!important;
    border-radius:10px!important;
  }

  .hero-slide-main .dfi-float-card small{
    font-size:6.8px!important;
    letter-spacing:.11em!important;
  }

  .hero-slide-main .dfi-float-card strong{
    font-size:10px!important;
  }

  /* Single capability strip only. */
  .dfi-hero-bottom{
    height:34px!important;
  }

  .dfi-bottom-inner{
    font-size:7.2px!important;
    letter-spacing:.17em!important;
    white-space:nowrap!important;
  }

  .dfi-hero-controls{
    bottom:42px!important;
  }
}

/* Short laptop viewports: keep the complete hero visible at 100% zoom. */
@media (min-width: 901px) and (max-height: 720px){

  .dfi-hero-v36{
    height:calc(100svh - 62px)!important;
    min-height:475px!important;
  }

  .hero-slide-main > .dfi-hero-inner{
    gap:26px!important;
    padding:10px 0 15px!important;
  }

  .hero-slide-main .dfi-kicker{
    margin-bottom:10px!important;
  }

  .hero-slide-main .dfi-hero-copy h1{
    font-size:clamp(37px,3.5vw,48px)!important;
    margin-bottom:12px!important;
  }

  .hero-slide-main .dfi-hero-description{
    font-size:13px!important;
    line-height:1.47!important;
    margin-bottom:14px!important;
  }

  .hero-slide-main .dfi-actions .btn{
    min-height:40px!important;
    padding:0 17px!important;
    font-size:11.2px!important;
  }

  .hero-slide-main .dfi-trust{
    margin-top:8px!important;
  }

  .hero-slide-main .dfi-hero-visual,
  .hero-slide-main.is-active .dfi-hero-visual{
    height:350px!important;
    transform:scale(.70)!important;
  }

  .hero-slide-main .card-software{left:28px!important;top:64px!important}
  .hero-slide-main .card-product{right:22px!important;top:140px!important}
  .hero-slide-main .card-digital{left:48px!important;bottom:72px!important}
  .hero-slide-main .card-tech{right:34px!important;bottom:64px!important}

  .dfi-hero-controls{
    bottom:40px!important;
  }
}


/* =========================================================
   DFI V5.3 — HERO VISUAL + SLIDE 02 + DELIVERY MODEL
   Scoped refinement only.
   ========================================================= */
@media (min-width: 901px) {

  /* Slide 01: stronger right-side visual presence. */
  .hero-slide-main > .dfi-hero-inner{
    grid-template-columns:1.01fr .99fr!important;
    gap:28px!important;
  }

  .hero-slide-main .dfi-hero-visual,
  .hero-slide-main.is-active .dfi-hero-visual{
    height:420px!important;
    transform:scale(.88)!important;
    transform-origin:center center!important;
  }

  .hero-slide-main .dfi-logo-stage{
    width:360px!important;
    height:360px!important;
  }

  .hero-slide-main .dfi-hero-mark{
    width:282px!important;
    height:282px!important;
  }

  .hero-slide-main .dfi-float-card{
    min-width:132px!important;
    padding:12px 15px!important;
    border-radius:10px!important;
  }

  .hero-slide-main .dfi-float-card small{
    font-size:7.5px!important;
    line-height:1.2!important;
    letter-spacing:.10em!important;
  }

  .hero-slide-main .dfi-float-card strong{
    font-size:11.5px!important;
    line-height:1.2!important;
    margin-top:3px!important;
  }

  .hero-slide-main .card-software{left:22px!important;top:58px!important}
  .hero-slide-main .card-product{right:12px!important;top:145px!important}
  .hero-slide-main .card-digital{left:42px!important;bottom:76px!important}
  .hero-slide-main .card-tech{right:22px!important;bottom:66px!important}

  /* Slide 02: bring the product-platform visual and copy into the same premium hierarchy. */
  .hero-slide-products > .dfi-hero-inner{
    grid-template-columns:1.02fr .98fr!important;
    gap:30px!important;
  }

  .hero-slide-products .dfi-hero-copy h1{
    font-size:clamp(39px,3.65vw,51px)!important;
    line-height:.98!important;
    letter-spacing:-.045em!important;
    max-width:625px!important;
    margin-bottom:17px!important;
  }

  .hero-slide-products .dfi-hero-description{
    max-width:610px!important;
    font-size:14px!important;
    line-height:1.56!important;
    margin-bottom:20px!important;
  }

  .hero-slide-products .dfi-kicker{
    font-size:9px!important;
    letter-spacing:.15em!important;
    margin-bottom:15px!important;
  }

  .hero-slide-products .dfi-custom-workspace{
    height:390px!important;
    max-height:390px!important;
    transform:scale(.86)!important;
    transform-origin:center center!important;
  }

  .hero-slide-products .workspace-header strong{
    font-size:17px!important;
  }

  .hero-slide-products .workspace-header small,
  .hero-slide-products .workspace-cards small,
  .hero-slide-products .module-label{
    font-size:8px!important;
  }

  .hero-slide-products .workspace-cards b{
    font-size:17px!important;
  }

  .hero-slide-products .workspace-cards span,
  .hero-slide-products .module-flow em,
  .hero-slide-products .module-status{
    font-size:8.5px!important;
  }

  .hero-slide-products .workspace-chip{
    font-size:8px!important;
    letter-spacing:.08em!important;
    padding:9px 12px!important;
  }

  /* Delivery model: stop five descriptions from visually running into each other. */
  .process-section .split-heading{
    grid-template-columns:1fr .92fr!important;
    gap:72px!important;
    align-items:end!important;
  }

  .process-section .split-heading h2{
    max-width:650px!important;
    font-size:clamp(39px,3.7vw,54px)!important;
    line-height:1.02!important;
  }

  .process-section .split-heading > p{
    max-width:560px!important;
    font-size:15px!important;
    line-height:1.7!important;
  }

  .process-section .process-line{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:24px!important;
    align-items:start!important;
    margin-top:38px!important;
  }

  .process-section .process-step{
    min-width:0!important;
    text-align:center!important;
    padding:0 8px!important;
  }

  .process-section .process-step b{
    display:block!important;
    margin-top:14px!important;
    font-size:15px!important;
    line-height:1.25!important;
  }

  .process-section .process-step small{
    display:block!important;
    max-width:205px!important;
    margin:9px auto 0!important;
    font-size:10.5px!important;
    line-height:1.52!important;
    white-space:normal!important;
  }
}

@media (min-width: 901px) and (max-height: 720px){
  .hero-slide-main .dfi-hero-visual,
  .hero-slide-main.is-active .dfi-hero-visual{
    height:375px!important;
    transform:scale(.80)!important;
  }

  .hero-slide-main .dfi-logo-stage{
    width:335px!important;
    height:335px!important;
  }

  .hero-slide-main .dfi-hero-mark{
    width:262px!important;
    height:262px!important;
  }

  .hero-slide-products .dfi-custom-workspace{
    height:350px!important;
    max-height:350px!important;
    transform:scale(.78)!important;
  }
}

@media (max-width: 900px){
  .process-section .process-line{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:22px!important;
  }
  .process-section .process-step small{
    max-width:420px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}


/* =========================================================
   DFI V5.4 — VALUE CARD CONTRAST FIX
   Fixes dark card readability overridden by later global rules.
   ========================================================= */
.value-card.dark-card{
  background:linear-gradient(145deg,#0b2448 0%,#123866 100%)!important;
  border-color:#244d79!important;
  box-shadow:0 16px 36px rgba(8,26,58,.13)!important;
}

.value-card.dark-card h3{
  color:#ffffff!important;
}

.value-card.dark-card p{
  color:#d6e0ec!important;
  opacity:1!important;
}

.value-card.dark-card .value-number{
  color:#b8c8db!important;
}

.value-card.dark-card .value-icon{
  background:#fffaf0!important;
  color:#c99316!important;
}

.value-card.dark-card>a{
  color:#f1bd3f!important;
}

.value-card.dark-card>a span{
  color:#f1bd3f!important;
}

.value-card.dark-card:before{
  background:radial-gradient(circle,rgba(241,189,63,.16),transparent 70%)!important;
}

.value-card.dark-card:hover{
  border-color:#d2a43b!important;
  box-shadow:0 24px 48px rgba(8,26,58,.18)!important;
}


/* =========================================================
   DFI V5.5 — SHOWCASE CAROUSEL IN-PANEL NAVIGATION
   Puts previous / dots / next together like the hero carousel.
   ========================================================= */
.dfi-showcase-viewport{
  position:relative!important;
}

.dfi-showcase-head{
  margin-bottom:28px!important;
}

.dfi-showcase-nav{
  position:absolute;
  right:24px;
  bottom:22px;
  z-index:12;
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(7,26,58,.10);
  box-shadow:0 12px 30px rgba(4,22,50,.18);
  backdrop-filter:blur(10px);
}

.dfi-showcase-nav > button{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#071a3a;
  color:#fff;
  font-size:17px;
  line-height:1;
  font-weight:800;
  cursor:pointer;
  transition:transform .2s ease,background .2s ease,color .2s ease;
}

.dfi-showcase-nav > button:hover{
  transform:translateY(-1px);
  background:#0f3769;
  color:#efb93c;
}

.dfi-showcase-nav > button:focus-visible{
  outline:3px solid rgba(239,185,60,.42);
  outline-offset:2px;
}

.dfi-showcase-nav .dfi-showcase-dots{
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin:0!important;
  min-width:54px;
}

.dfi-showcase-nav .dfi-showcase-dots button{
  width:7px;
  height:7px;
  border:0;
  border-radius:50%;
  padding:0;
  background:#ccd4df;
  cursor:pointer;
  transition:width .25s ease,background .25s ease;
}

.dfi-showcase-nav .dfi-showcase-dots button.active{
  width:25px;
  border-radius:999px;
  background:#dfa72c;
}

@media(max-width:900px){
  .dfi-showcase-nav{
    right:16px;
    bottom:15px;
  }
}

@media(max-width:600px){
  .dfi-showcase-nav{
    right:12px;
    bottom:12px;
    gap:7px;
    padding:6px 7px;
  }
  .dfi-showcase-nav > button{
    width:31px;
    height:31px;
    flex-basis:31px;
    font-size:15px;
  }
}


/* =========================================================
   DFI V5.6 — HERO SLIDE 02 REFINEMENT
   ========================================================= */
@media (min-width:901px){
  .hero-slide-products > .dfi-hero-inner{
    grid-template-columns:1.04fr .96fr!important;
    gap:34px!important;
  }

  .hero-slide-products .dfi-hero-copy{
    max-width:640px!important;
  }

  .hero-slide-products .dfi-eyebrow{
    margin-bottom:8px!important;
    font-size:9px!important;
    letter-spacing:.18em!important;
  }

  .hero-slide-products .dfi-kicker{
    margin-bottom:14px!important;
    font-size:9px!important;
    letter-spacing:.15em!important;
  }

  .hero-slide-products .dfi-hero-copy h1{
    max-width:610px!important;
    font-size:clamp(38px,3.55vw,50px)!important;
    line-height:.98!important;
    letter-spacing:-.045em!important;
    margin-bottom:18px!important;
  }

  .hero-slide-products .dfi-hero-copy h1 em{
    display:inline-block!important;
  }

  .hero-slide-products .dfi-hero-description{
    max-width:610px!important;
    font-size:14px!important;
    line-height:1.58!important;
    margin-bottom:20px!important;
  }

  .hero-slide-products .dfi-trust{
    margin-top:13px!important;
    font-size:9.8px!important;
    letter-spacing:.02em!important;
  }

  /* Make platform visual more substantial and less badge-heavy. */
  .hero-slide-products .dfi-custom-workspace{
    height:410px!important;
    max-height:410px!important;
    transform:scale(.91)!important;
    transform-origin:center center!important;
  }

  .hero-slide-products .workspace-window{
    box-shadow:0 24px 60px rgba(8,36,78,.18)!important;
  }

  .hero-slide-products .workspace-header strong{
    font-size:18px!important;
  }

  .hero-slide-products .workspace-header small{
    font-size:7.8px!important;
    letter-spacing:.10em!important;
  }

  .hero-slide-products .workspace-header em{
    font-size:8px!important;
    padding:5px 8px!important;
  }

  .hero-slide-products .workspace-cards b{
    font-size:15px!important;
  }

  .hero-slide-products .workspace-cards small{
    font-size:7px!important;
  }

  .hero-slide-products .workspace-cards span{
    font-size:8px!important;
  }

  .hero-slide-products .module-flow i span{
    font-size:9px!important;
  }

  .hero-slide-products .module-flow i em{
    font-size:7.5px!important;
  }

  .hero-slide-products .module-status{
    font-size:7.5px!important;
  }

  .hero-slide-products .workspace-chip{
    font-size:7.5px!important;
    padding:8px 10px!important;
    letter-spacing:.08em!important;
  }

  .hero-slide-products .chip-api{
    right:12px!important;
    top:50px!important;
  }

  .hero-slide-products .chip-cloud{
    left:-5px!important;
    bottom:54px!important;
  }

  .hero-slide-products .chip-ux{
    right:14px!important;
    bottom:45px!important;
  }
}

@media (min-width:901px) and (max-height:720px){
  .hero-slide-products .dfi-custom-workspace{
    height:360px!important;
    max-height:360px!important;
    transform:scale(.82)!important;
  }
  .hero-slide-products .dfi-hero-copy h1{
    font-size:clamp(36px,3.3vw,46px)!important;
  }
  .hero-slide-products .dfi-hero-description{
    font-size:13px!important;
    line-height:1.48!important;
  }
}


/* =========================================================
   DFI V5.7 — SLIDE 02 FINAL VIEWPORT FIT
   Guarantees CTA + trust line visibility at 100% zoom.
   ========================================================= */
@media (min-width:901px){
  .hero-slide-products > .dfi-hero-inner{
    align-items:center!important;
    padding-top:4px!important;
    padding-bottom:48px!important;
  }

  .hero-slide-products .dfi-hero-copy{
    transform:translateY(-8px)!important;
  }

  .hero-slide-products .dfi-eyebrow{
    margin-bottom:5px!important;
  }

  .hero-slide-products .dfi-kicker{
    margin-bottom:9px!important;
  }

  .hero-slide-products .dfi-hero-copy h1{
    font-size:clamp(36px,3.35vw,47px)!important;
    line-height:.97!important;
    margin-bottom:12px!important;
  }

  .hero-slide-products .dfi-hero-description{
    font-size:13px!important;
    line-height:1.48!important;
    margin-bottom:14px!important;
    max-width:595px!important;
  }

  .hero-slide-products .dfi-actions{
    margin-top:0!important;
    gap:10px!important;
  }

  .hero-slide-products .dfi-actions .btn{
    min-height:39px!important;
    height:39px!important;
    padding:0 16px!important;
    font-size:11px!important;
  }

  .hero-slide-products .dfi-trust{
    margin-top:8px!important;
    min-height:20px!important;
    font-size:9px!important;
  }

  .hero-slide-products .dfi-custom-workspace{
    height:345px!important;
    max-height:345px!important;
    transform:scale(.80)!important;
    transform-origin:center center!important;
  }
}

@media (min-width:901px) and (max-height:760px){
  .hero-slide-products > .dfi-hero-inner{
    padding-top:0!important;
    padding-bottom:44px!important;
  }

  .hero-slide-products .dfi-hero-copy{
    transform:translateY(-12px)!important;
  }

  .hero-slide-products .dfi-eyebrow{
    margin-bottom:4px!important;
  }

  .hero-slide-products .dfi-kicker{
    margin-bottom:7px!important;
  }

  .hero-slide-products .dfi-hero-copy h1{
    font-size:clamp(34px,3.15vw,44px)!important;
    margin-bottom:9px!important;
  }

  .hero-slide-products .dfi-hero-description{
    font-size:12.5px!important;
    line-height:1.42!important;
    margin-bottom:11px!important;
  }

  .hero-slide-products .dfi-actions .btn{
    min-height:37px!important;
    height:37px!important;
  }

  .hero-slide-products .dfi-trust{
    margin-top:6px!important;
  }

  .hero-slide-products .dfi-custom-workspace{
    height:325px!important;
    max-height:325px!important;
    transform:scale(.76)!important;
  }
}


/* =========================================================
   DFI V5.8 — PRODUCT CAROUSEL NAVIGATION
   Matches the compact previous / dots / next pattern used
   by the hero and showcase carousels.
   ========================================================= */
.product-carousel-shell{
  position:relative;
  padding-bottom:54px;
}

.product-carousel-shell .product-carousel{
  padding-bottom:18px!important;
}

.product-carousel-nav{
  position:absolute;
  right:0;
  bottom:0;
  z-index:12;
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.97);
  border:1px solid rgba(7,26,58,.10);
  box-shadow:0 12px 30px rgba(4,22,50,.14);
  backdrop-filter:blur(10px);
}

.product-carousel-nav > button{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#071a3a;
  color:#fff;
  font-size:17px;
  line-height:1;
  font-weight:800;
  cursor:pointer;
  transition:transform .2s ease,background .2s ease,color .2s ease;
}

.product-carousel-nav > button:hover{
  transform:translateY(-1px);
  background:#10386c;
  color:#efb93c;
}

.product-carousel-nav > button:focus-visible{
  outline:3px solid rgba(239,185,60,.42);
  outline-offset:2px;
}

.product-carousel-nav .carousel-dots{
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin:0!important;
  min-width:78px;
}

.product-carousel-nav .carousel-dots button{
  width:7px;
  height:7px;
  border:0;
  border-radius:50%;
  padding:0;
  background:#cbd3df;
  cursor:pointer;
  transition:width .25s ease,background .25s ease;
}

.product-carousel-nav .carousel-dots button.active{
  width:25px;
  border-radius:999px;
  background:#dfa72c;
}

@media(max-width:900px){
  .product-carousel-shell{
    padding-bottom:50px;
  }
  .product-carousel-nav{
    right:0;
    bottom:0;
  }
}

@media(max-width:600px){
  .product-carousel-nav{
    gap:7px;
    padding:6px 7px;
  }
  .product-carousel-nav > button{
    width:31px;
    height:31px;
    flex-basis:31px;
    font-size:15px;
  }
  .product-carousel-nav .carousel-dots{
    min-width:64px;
  }
}