:root{
  --blue:#1F7FE5; --blue-700:#1462BE; --sky:#8CC8FF; --sky-100:#E6F2FF;
  --yellow:#FFD500; --yellow-600:#F2B900;
  --navy:#0E1B3D; --navy-800:#15264F; --ink:#141A2E; --muted:#5B6478;
  --line:#E3E8F1; --soft:#F4F7FC; --white:#fff;
  --radius:22px; --shadow:0 20px 50px -20px rgba(14,27,61,.25);
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"DM Sans",system-ui,sans-serif;color:var(--ink);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:"Sora",sans-serif;line-height:1.12;letter-spacing:-.02em}
.container{width:min(1200px,100% - 32px);margin-inline:auto}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 .78rem/1 "Sora";letter-spacing:.14em;text-transform:uppercase;color:var(--blue-700)}
.eyebrow::before{content:"";width:14px;height:14px;background:var(--yellow);border-radius:0 100% 0 0}
.section{padding:110px 0}
.section-head{max-width:720px;margin-bottom:56px}
.section-head h2{font-size:clamp(2rem,4vw,3rem);margin:16px 0 14px}
.section-head p{color:var(--muted);font-size:1.12rem}
.center{text-align:center;margin-inline:auto}
.hl{position:relative;white-space:nowrap}
.hl::after{content:"";position:absolute;left:-4px;right:-4px;bottom:.08em;height:.32em;background:var(--yellow);z-index:-1;border-radius:4px;transform-origin:left;transform:scaleX(0);transition:transform 1s .4s var(--ease)}
.is-in .hl::after,.hl.is-in::after{transform:scaleX(1)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:999px;font:700 1rem/1 "DM Sans";border:2px solid transparent;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s,background .3s,color .3s}
.btn svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-primary{background:var(--yellow);color:var(--navy);box-shadow:0 10px 30px -10px rgba(242,185,0,.8)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 36px -10px rgba(242,185,0,.9)}
.btn-ghost{border-color:var(--line);color:var(--navy);background:#fff}
.btn-ghost:hover{border-color:var(--navy)}
.btn-blue{background:var(--blue-700);color:#fff}
.btn-blue:hover{background:var(--navy);transform:translateY(-2px)}

/* Header */
.header{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s,padding .3s;padding:20px 0}
.header.scrolled{background:rgba(255,255,255,.9);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line);padding:12px 0}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:flex;align-items:center;gap:10px;font:800 1.35rem/1 "Sora";letter-spacing:-.02em;color:var(--navy)}
.logo b{color:var(--blue)}
.logo small{display:block;font:500 .62rem/1.2 "DM Sans";color:var(--muted);letter-spacing:.02em;border-left:1px solid var(--line);padding-left:10px;margin-left:2px}
.nav-links{display:flex;gap:32px;list-style:none}
.nav-links a{font-weight:500;color:var(--muted);transition:color .2s;position:relative}
.nav-links a:hover{color:var(--navy)}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--yellow);transform:scaleX(0);transition:transform .3s var(--ease)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav .btn{padding:12px 20px;font-size:.92rem}
.menu-toggle{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer}
.menu-toggle span{display:block;width:24px;height:2px;background:var(--navy);margin:5px auto;transition:.3s}

/* Hero */
.hero{position:relative;padding:150px 0 90px;background:linear-gradient(180deg,var(--soft) 0%,#fff 100%);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}
.badge{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);padding:8px 14px 8px 8px;border-radius:999px;font-size:.88rem;font-weight:500;color:var(--navy);box-shadow:0 6px 20px -12px rgba(14,27,61,.3)}
.badge i{font-style:normal;background:var(--navy);color:var(--yellow);font:700 .72rem/1 "Sora";padding:6px 9px;border-radius:999px}
.hero h1{font-size:clamp(2.4rem,5.2vw,4.1rem);font-weight:800;margin:24px 0 22px;color:var(--navy)}
.hero h1 .blue{color:var(--blue)}
.hero p.lead{font-size:1.18rem;color:var(--muted);max-width:540px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin:34px 0 40px}
.hero-proof{display:flex;gap:34px;flex-wrap:wrap}
.hero-proof div{border-left:3px solid var(--yellow);padding-left:14px}
.hero-proof strong{display:block;font:800 1.7rem/1 "Sora";color:var(--navy)}
.hero-proof span{font-size:.88rem;color:var(--muted)}

/* Mosaic */
.mosaic{position:relative;display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:1fr;gap:0;border-radius:28px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:1/1;grid-auto-flow:dense;transform:perspective(1200px) rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg));transition:transform .6s var(--ease)}
.tile{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--bg,#fff);transition:background .8s var(--ease)}
.tile svg{position:absolute;inset:0;width:100%;height:100%;transition:transform .9s var(--ease),opacity .5s}
.tile svg *{transition:fill .8s var(--ease),stroke .8s var(--ease)}
.mosaic{background:var(--navy)}
.mosaic-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transform:scale(1.1);animation:kenburns 18s ease-in-out infinite alternate}
.mosaic::after{content:"";position:absolute;inset:0;background:linear-gradient(140deg,rgba(14,27,61,.35),rgba(31,127,229,.12) 55%,rgba(14,27,61,.4));z-index:1;pointer-events:none}
.mosaic .tile{z-index:2}
.mosaic .tile.solid{opacity:.94}
@keyframes kenburns{0%{transform:scale(1.1) translate(0,0)}100%{transform:scale(1.22) translate(-3%,-2%)}}
.fc-3{right:-10px;bottom:-22px;animation-delay:-1.2s}
.ai-ic{background:var(--navy);position:relative}
.ai-ic span{font:800 .85rem "Sora";color:var(--yellow);position:relative;z-index:1}
.ai-ic::before{content:"";position:absolute;inset:5px;border:2px solid var(--blue);border-right-color:transparent;border-radius:50%;animation:spin 3s linear infinite}
.logo img{height:42px;width:auto}
.header.scrolled .logo img{height:36px}
.logo-foot{display:inline-flex;background:#fff;padding:10px 16px;border-radius:14px}
.logo-foot img{height:38px;width:auto}
.mosaic .ai-chip{grid-column:1 / span 2;grid-row:5 / span 2;background:var(--navy);display:grid;place-items:center;position:relative;overflow:hidden}
.ai-chip .core{position:relative;width:62%;aspect-ratio:1;display:grid;place-items:center}
.ai-chip .core span{font:800 clamp(1.4rem,3vw,2.4rem)/1 "Sora";color:var(--yellow);z-index:2}
.ai-chip .ring{position:absolute;inset:0;border:2px dashed rgba(140,200,255,.6);border-radius:50%;animation:spin 14s linear infinite}
.ai-chip .ring.r2{inset:16%;border:2px solid var(--blue);border-right-color:transparent;animation-duration:5s;animation-direction:reverse}
.ai-chip .pulse{position:absolute;inset:30%;background:var(--blue);border-radius:50%;animation:pulse 2.4s ease-in-out infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{0%,100%{transform:scale(.85);opacity:.6}50%{transform:scale(1.15);opacity:1}}
.float-card{position:absolute;background:#fff;border-radius:16px;padding:14px 16px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:center;font-size:.86rem;z-index:3;animation:bob 5s ease-in-out infinite}
.float-card .ic{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;flex:none}
.float-card strong{display:block;font:700 .95rem/1.2 "Sora";color:var(--navy)}
.float-card span{color:var(--muted)}
.fc-1{right:-18px;top:12%}
.fc-2{left:-26px;bottom:18%;animation-delay:-2.5s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hero-wrap{position:relative}

/* Marquee */
.clients{padding:34px 0;border-block:1px solid var(--line);background:#fff;overflow:hidden}
.clients p{text-align:center;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:18px;font-weight:500}
.marquee{display:flex;gap:70px;width:max-content;animation:marquee 32s linear infinite}
.clients:hover .marquee{animation-play-state:paused}
.marquee span{font:700 1.3rem/1 "Sora";color:#6B7488;display:flex;align-items:center;gap:70px;white-space:nowrap}
.marquee span::after{content:"";width:12px;height:12px;background:var(--yellow);border-radius:50%}
@keyframes marquee{to{transform:translateX(-50%)}}

/* Pains */
.pains{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.pain-list{display:grid;gap:14px}
.pain{display:flex;gap:16px;align-items:flex-start;padding:18px 20px;border-radius:16px;background:var(--soft);border:1px solid transparent;transition:border .3s,transform .3s var(--ease),background .3s}
.pain:hover{background:#fff;border-color:var(--line);transform:translateX(6px)}
.pain .x{flex:none;width:30px;height:30px;border-radius:50%;background:#FFE7E7;color:#E04848;display:grid;place-items:center;font-weight:700}
.pain strong{display:block;color:var(--navy);font-family:"Sora";font-weight:600}
.pain span{color:var(--muted);font-size:.95rem}
.solution-box{background:var(--navy);color:#fff;border-radius:28px;padding:48px;position:relative;overflow:hidden}
.solution-box h3{font-size:clamp(1.6rem,2.6vw,2.2rem);margin-bottom:16px}
.solution-box p{color:#C3CCE0;margin-bottom:26px}
.solution-box ul{list-style:none;display:grid;gap:12px;margin-bottom:32px}
.solution-box li{display:flex;gap:12px;align-items:center}
.solution-box li::before{content:"";flex:none;width:22px;height:22px;border-radius:50%;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E1B3D' stroke-width='3'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/14px no-repeat}
.deco{position:absolute;pointer-events:none}
.deco-q{width:180px;height:180px;right:-60px;top:-60px;background:var(--blue);border-radius:0 0 0 100%;opacity:.9}
.deco-c{width:90px;height:90px;right:60px;top:70px;border:14px solid var(--yellow);border-radius:50%}

/* Services */
.services{background:var(--soft);position:relative;overflow:hidden}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.svc{position:relative;background:#fff;border-radius:var(--radius);padding:38px;border:1px solid var(--line);overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s;display:flex;flex-direction:column}
.svc:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.svc .corner{position:absolute;right:0;top:0;width:120px;height:120px;transition:transform .7s var(--ease)}
.svc:hover .corner{transform:rotate(90deg) scale(1.1)}
.svc .icon{width:60px;height:60px;border-radius:16px;background:var(--sky-100);display:grid;place-items:center;margin-bottom:24px;color:var(--blue)}
.svc .icon svg{width:30px;height:30px}
.svc h3{font-size:1.45rem;color:var(--navy);margin-bottom:10px;max-width:80%}
.svc p{color:var(--muted);margin-bottom:20px}
.svc ul{list-style:none;display:grid;gap:8px;margin-bottom:28px}
.svc li{display:flex;gap:10px;font-size:.96rem;color:var(--ink)}
.svc li::before{content:"";flex:none;width:8px;height:8px;margin-top:9px;background:var(--blue);border-radius:2px;transform:rotate(45deg)}
.svc .more{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--blue-700)}
.svc .more svg{width:18px;transition:transform .3s var(--ease)}
.svc:hover .more svg{transform:translateX(5px)}
.svc.featured{grid-column:1 / -1;background:var(--navy);color:#fff;border:0;display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}
.svc.featured h3{color:#fff;font-size:clamp(1.7rem,3vw,2.3rem);max-width:none}
.svc.featured p{color:#C3CCE0}
.svc.featured li{color:#E7ECF6}
.svc.featured li::before{background:var(--yellow)}
.svc.featured .icon{background:rgba(255,213,0,.15);color:var(--yellow)}
.svc.featured .tag{display:inline-block;background:var(--yellow);color:var(--navy);font:700 .72rem/1 "Sora";letter-spacing:.1em;text-transform:uppercase;padding:7px 12px;border-radius:999px;margin-bottom:18px}
.svc.featured .media{border-radius:18px;overflow:hidden;aspect-ratio:4/3;position:relative}
.svc.featured .media img{width:100%;height:100%;object-fit:cover}
.svc.featured .media::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(31,127,229,.35),transparent 60%)}

/* AI section */
.ai{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.ai .eyebrow{color:var(--yellow)}
.ai .section-head p{color:#B9C3DA}
.ai-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.usecases{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.uc{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:22px;transition:background .3s,transform .4s var(--ease),border-color .3s}
.uc:hover{background:rgba(31,127,229,.18);border-color:var(--blue);transform:translateY(-4px)}
.uc .n{font:700 .8rem/1 "Sora";color:var(--yellow);margin-bottom:12px;display:block}
.uc h3{font-size:1.05rem;margin-bottom:6px}
.uc p{font-size:.9rem;color:#B9C3DA}
.chat{background:#fff;border-radius:26px;box-shadow:0 40px 80px -30px rgba(0,0,0,.6);overflow:hidden;color:var(--ink);max-width:440px;margin-left:auto;position:relative;z-index:2}
.chat-top{background:var(--blue-700);color:#fff;padding:16px 20px;display:flex;align-items:center;gap:12px}
.chat-top .av{width:40px;height:40px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;color:var(--navy);font:800 .9rem "Sora"}
.chat-top strong{display:block;font-family:"Sora";font-size:.98rem}
.chat-top small{opacity:.85;display:flex;align-items:center;gap:6px}
.chat-top small::before{content:"";width:8px;height:8px;border-radius:50%;background:#5EF08B}
.chat-body{padding:20px;display:flex;flex-direction:column;gap:10px;height:380px;background:var(--soft);overflow:hidden}
.msg{max-width:82%;padding:11px 15px;border-radius:16px;font-size:.92rem;line-height:1.45;opacity:0;transform:translateY(10px);animation:msgIn .45s var(--ease) forwards}
.msg.user{align-self:flex-end;background:var(--navy);color:#fff;border-bottom-right-radius:4px}
.msg.bot{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px}
.msg.bot b{color:var(--blue-700)}
.typing{align-self:flex-start;background:#fff;border:1px solid var(--line);padding:12px 16px;border-radius:16px;display:flex;gap:5px}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:dot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
@keyframes msgIn{to{opacity:1;transform:none}}
.ai-band{position:absolute;inset:auto 0 0 0;height:56px;display:flex;opacity:.9}
.ai-cta{margin-top:40px;display:flex;gap:14px;flex-wrap:wrap}
.ai .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
.ai .btn-ghost:hover{border-color:#fff}

/* Process */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;position:relative}
.steps::before{content:"";position:absolute;top:36px;left:8%;right:8%;height:2px;background:repeating-linear-gradient(90deg,var(--line) 0 10px,transparent 10px 18px)}
.step{position:relative;text-align:left}
.step .num{width:72px;height:72px;display:grid;place-items:center;font:800 1.4rem "Sora";color:var(--navy);position:relative;margin-bottom:22px}
.step .num::before{content:"";position:absolute;inset:0;background:var(--c,var(--yellow));border-radius:var(--r,50%);z-index:-1;transition:transform .6s var(--ease)}
.step:hover .num::before{transform:rotate(90deg)}
.step h3{font-size:1.2rem;color:var(--navy);margin-bottom:8px}
.step p{color:var(--muted);font-size:.96rem}

/* Cases */
.cases{background:var(--soft)}
.case-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:22px}
.case{position:relative;border-radius:var(--radius);overflow:hidden;min-height:300px;color:#fff;display:flex;align-items:flex-end;isolation:isolate}
.case img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s var(--ease)}
.case::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,27,61,0) 30%,rgba(14,27,61,.92));z-index:-1}
.case:hover img{transform:scale(1.07)}
.case .info{padding:28px}
.case .cat{display:inline-block;background:var(--yellow);color:var(--navy);font:700 .7rem/1 "Sora";letter-spacing:.08em;text-transform:uppercase;padding:6px 10px;border-radius:999px;margin-bottom:12px}
.case h3{font-size:1.3rem;margin-bottom:6px}
.case p{font-size:.92rem;color:#D3DAEA;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s var(--ease),opacity .4s}
.case:hover p{max-height:120px;opacity:1}
.c1{grid-column:span 4}.c2{grid-column:span 2}.c3,.c4,.c5{grid-column:span 2}.c6{grid-column:span 6;min-height:220px}

/* Differentials */
.diffs{display:grid;grid-template-columns:1fr 1.2fr;gap:70px;align-items:center}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.stat{padding:30px;border-radius:var(--radius);border:1px solid var(--line);position:relative;overflow:hidden}
.stat strong{display:block;font:800 2.6rem/1 "Sora";color:var(--navy);margin-bottom:8px}
.stat strong em{font-style:normal;color:var(--blue)}
.stat span{color:var(--muted)}
.stat:nth-child(1){background:var(--yellow);border-color:var(--yellow)}
.stat:nth-child(1) span{color:var(--navy)}
.stat:nth-child(4){background:var(--navy);border-color:var(--navy)}
.stat:nth-child(4) strong{color:#fff}.stat:nth-child(4) strong em{color:var(--yellow)}
.stat:nth-child(4) span{color:#C3CCE0}
.diff-list{display:grid;gap:18px;margin-top:30px}
.diff-item{display:flex;gap:16px}
.diff-item .ic{flex:none;width:46px;height:46px;border-radius:12px;background:var(--sky-100);color:var(--blue);display:grid;place-items:center}
.diff-item .ic svg{width:22px;height:22px}
.diff-item strong{display:block;font-family:"Sora";color:var(--navy)}
.diff-item span{color:var(--muted);font-size:.95rem}

/* FAQ */
.faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}
.faq details{border-bottom:1px solid var(--line);padding:22px 0}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;font:600 1.1rem/1.4 "Sora";color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{flex:none;width:30px;height:30px;border-radius:50%;background:var(--soft);position:relative;transition:background .3s,transform .4s var(--ease)}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;background:var(--navy);transform:translate(-50%,-50%)}
.faq summary .pm::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s}
.faq details[open] .pm{background:var(--yellow);transform:rotate(180deg)}
.faq details[open] .pm::after{transform:translate(-50%,-50%) rotate(0)}
.faq details p{color:var(--muted);margin-top:12px;max-width:640px}

/* Contact / CTA */
.contact{position:relative;background:#0F56A8;color:#fff;overflow:hidden}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;position:relative;z-index:2}
.contact h2{font-size:clamp(2.1rem,4.4vw,3.4rem);margin:16px 0 18px}
.contact .eyebrow{color:var(--yellow)}
.contact p.lead{color:#DCEBFF;font-size:1.12rem;margin-bottom:28px}
.contact-points{display:grid;gap:12px;list-style:none}
.contact-points li{display:flex;gap:12px;align-items:center}
.contact-points li::before{content:"";width:10px;height:10px;background:var(--yellow);border-radius:0 100% 0 0}
.form{background:#fff;color:var(--ink);border-radius:26px;padding:36px;box-shadow:0 40px 80px -30px rgba(14,27,61,.6)}
.form h3{color:var(--navy);font-size:1.4rem;margin-bottom:6px}
.form > p{color:var(--muted);font-size:.94rem;margin-bottom:22px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1 / -1}
.field label{font-size:.84rem;font-weight:700;color:var(--navy)}
.field input,.field select,.field textarea{font:inherit;padding:13px 14px;border:1.5px solid #747E92;border-radius:12px;background:var(--soft);transition:border .2s,background .2s;color:var(--ink);width:100%}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);background:#fff}
.field textarea{resize:vertical;min-height:90px}
.form .btn{width:100%;justify-content:center;margin-top:18px}
.form small{display:block;text-align:center;color:var(--muted);margin-top:12px;font-size:.8rem}
.form-ok{display:none;text-align:center;padding:30px 10px}
.form-ok .ok{width:70px;height:70px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;margin:0 auto 18px}
.form-ok h3{margin-bottom:8px}
.form-ok p{color:var(--muted);margin-bottom:20px}
.contact-pattern{position:absolute;inset:0;display:grid;grid-template-columns:repeat(12,1fr);opacity:.1;z-index:1}

/* Footer */
.footer{background:var(--navy);color:#B9C3DA;padding:70px 0 30px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:50px}
.footer .logo{color:#fff}
.footer .logo small{color:#8C97B0;border-color:#2A3A63}
.footer h4,.footer .foot-title{color:#fff;font-size:1rem;margin-bottom:16px}
.footer ul{list-style:none;display:grid;gap:10px}
.footer a:hover{color:var(--yellow)}
.footer p{max-width:320px;margin-top:16px;font-size:.95rem}
.foot-bottom{border-top:1px solid #22325A;padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.88rem}

/* WhatsApp float */
.wa{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;align-items:center;gap:10px}
.wa .bubble{background:#fff;color:var(--navy);padding:10px 16px;border-radius:999px;font-size:.88rem;font-weight:600;box-shadow:var(--shadow);opacity:0;transform:translateX(10px);transition:.4s var(--ease);pointer-events:none}
.wa:hover .bubble,.wa.show-bubble .bubble{opacity:1;transform:none}
.wa .btnw{width:60px;height:60px;border-radius:50%;background:#159447;display:grid;place-items:center;box-shadow:0 14px 30px -10px rgba(37,211,102,.8);position:relative}
.wa .btnw::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #159447;animation:ping 2s infinite}
@keyframes ping{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.6);opacity:0}}
.wa svg{width:30px;height:30px;fill:#fff}

/* Reveal */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}

/* Pattern band */
.band{display:grid;grid-template-columns:repeat(16,1fr);height:auto}
.band .tile{aspect-ratio:1/1}

/* Responsive */
@media (max-width:1000px){
  .hero-grid,.pains,.ai-grid,.diffs,.faq-wrap,.contact-grid{grid-template-columns:1fr;gap:48px}
  .svc.featured{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr;row-gap:40px}.steps::before{display:none}
  .foot-grid{grid-template-columns:1fr 1fr}
  .chat{margin:0 auto}
  .hero-wrap{max-width:560px;margin:0 auto;width:100%}
  .band{grid-template-columns:repeat(8,1fr)}
  .band .tile:nth-child(n+9){display:none}
}
@media (max-width:820px){
  .nav-links,.nav > .btn{display:none}
  .menu-toggle{display:block}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:16px;right:16px;background:#fff;padding:24px;border-radius:18px;box-shadow:var(--shadow);gap:18px}
  .section{padding:80px 0}
  .svc-grid{grid-template-columns:1fr}
  .case-grid{grid-template-columns:1fr}
  .case{grid-column:auto!important;min-height:260px}
  .case p{max-height:none;opacity:1}
  .usecases{grid-template-columns:1fr}
  .fc-1{right:8px;top:-14px}.fc-2{left:8px;bottom:-14px}
}
@media (max-width:560px){
  .fgrid,.stats,.steps,.foot-grid{grid-template-columns:1fr}
  .svc,.solution-box,.form{padding:28px}
  .hero{padding-top:120px}
  .hero-proof{gap:20px}
  .wa .bubble{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}
