@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#080d1b;--bg2:#0d1427;--surface:#101a30;--surface2:#141f38;--text:#f4f6ff;--muted:#a4aec4;--line:rgba(190,204,238,.13);--accent:#8d7bff;--accent2:#42d9f5;--white:#fff;--shadow:0 24px 70px rgba(0,0,0,.28);--radius:22px}
body.light{--bg:#f6f7fb;--bg2:#eef0f8;--surface:#fff;--surface2:#f0f2fa;--text:#11172a;--muted:#687187;--line:rgba(22,32,58,.12);--shadow:0 24px 70px rgba(30,42,75,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;line-height:1.6;overflow-x:hidden;transition:background .35s,color .35s}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container{width:min(1160px,calc(100% - 48px));margin:auto}.section-pad{padding:112px 0;position:relative}.page-glow{position:absolute;width:500px;height:500px;border-radius:50%;filter:blur(100px);opacity:.15;pointer-events:none;z-index:-1}.glow-one{background:#6852ff;top:90px;left:-260px}.glow-two{background:#12b9dc;top:520px;right:-300px}.site-header{height:82px;position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav-wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:10px;font:700 19px 'Space Grotesk';letter-spacing:-.8px;line-height:1}.brand-mark{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,#8d7bff,#38d7ef);color:#08101e;font-size:19px}.brand-mark span{color:#fff}.brand-light{font-weight:400}.brand small{display:block;font:600 8px 'DM Sans';letter-spacing:2.2px;color:var(--muted);margin-top:5px}.main-nav{display:flex;gap:32px;margin-left:auto}.main-nav a{font-size:12px;color:var(--muted);font-weight:700;transition:.25s}.main-nav a:hover{color:var(--text)}.nav-actions{display:flex;align-items:center;gap:10px}.lang-toggle,.theme-toggle,.menu-toggle{border:1px solid var(--line);background:var(--surface);color:var(--text);height:38px;min-width:38px;border-radius:50px;cursor:pointer}.lang-toggle{padding:0 12px;font-size:11px;font-weight:700}.theme-toggle{font-size:18px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:15px 21px;border-radius:9px;font-size:12px;font-weight:700;transition:transform .25s,box-shadow .25s,background .25s;border:1px solid transparent;cursor:pointer}.btn:hover{transform:translateY(-3px)}.btn-primary{background:linear-gradient(110deg,#8c7aff,#5b9cff 55%,#42d9ef);color:#08101e;box-shadow:0 9px 28px rgba(112,112,255,.22)}.btn-primary:hover{box-shadow:0 14px 36px rgba(112,112,255,.35)}.btn-small{padding:11px 16px}.btn-ghost,.btn-outline{border-color:var(--line);color:var(--text);background:transparent}.btn-ghost:hover,.btn-outline:hover{background:var(--surface)}.menu-toggle{display:none;padding:10px}.menu-toggle span{display:block;width:16px;height:2px;background:var(--text);margin:4px auto}
.hero{padding-top:100px;padding-bottom:40px;min-height:660px;display:flex;align-items:center}.hero-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:45px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.1px;color:var(--accent2);display:flex;align-items:center;gap:10px;margin-bottom:22px}.pulse-dot,.chip-dot{width:7px;height:7px;border-radius:50%;background:#48e0be;box-shadow:0 0 0 5px rgba(72,224,190,.12)}h1,h2,h3,p{margin-top:0}h1,h2{font-family:'Space Grotesk';letter-spacing:-3.5px;line-height:1.02}h1{font-size:clamp(52px,6vw,82px);margin-bottom:25px}h1 em,h2 em{font-style:normal;background:linear-gradient(100deg,#a18dff,#50d8f1);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-lead{font-size:16px;line-height:1.8;color:var(--muted);max-width:490px;margin-bottom:32px}.hero-actions{display:flex;gap:13px;flex-wrap:wrap}.play-icon{font-size:9px;width:23px;height:23px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center}.hero-proof{display:flex;align-items:center;gap:14px;margin-top:55px}.avatar-stack{display:flex}.avatar-stack span{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#8b7bff,#45d9e9);border:2px solid var(--bg);margin-left:-7px;color:#08101e;font-size:10px;font-weight:700}.avatar-stack span:first-child{margin-left:0}.hero-proof strong,.hero-proof small{display:block}.hero-proof strong{font-size:11px}.hero-proof small{color:var(--muted);font-size:10px;margin-top:2px}
.hero-art{height:470px;position:relative;display:grid;place-items:center}.orbit{position:absolute;border:1px solid rgba(138,126,255,.24);border-radius:50%;transform:rotate(-25deg)}.orbit-a{width:470px;height:300px}.orbit-b{width:390px;height:430px;transform:rotate(40deg);border-color:rgba(66,217,245,.16)}.browser-card{position:relative;width:min(420px,90%);height:300px;background:#f7f8ff;border-radius:15px;box-shadow:0 35px 90px rgba(0,0,0,.45);transform:rotate(-4deg);overflow:hidden;z-index:2;animation:float 6s ease-in-out infinite}.browser-top{height:35px;background:#e8eaf4;display:flex;align-items:center;justify-content:space-between;padding:0 13px;color:#6d7388;font-size:8px}.browser-dots{display:flex;gap:4px}.browser-dots i{width:6px;height:6px;border-radius:50%;background:#b7bfd1}.browser-dots i:first-child{background:#ff8c9a}.browser-dots i:nth-child(2){background:#f5c66a}.browser-dots i:nth-child(3){background:#66d4a4}.browser-content{padding:18px 25px;color:#151a2a}.mini-nav{display:flex;justify-content:space-between;align-items:center;font:700 12px 'Space Grotesk'}.mini-nav b span{color:#8a78ff}.mini-nav div{display:flex;gap:9px}.mini-nav i{width:22px;height:3px;border-radius:3px;background:#cdd1df}.mini-hero{padding:30px 0 20px}.mini-hero small{font-size:6px;letter-spacing:2px;color:#7e8498}.mini-hero strong{display:block;font:700 34px/1 'Space Grotesk';letter-spacing:-2px;margin:9px 0}.mini-hero em{font-style:normal;color:#8472ff}.mini-line{width:95px;height:2px;background:#4bd4e9;margin:13px 0}.mini-button{font-size:7px;background:#181e31;color:white;padding:7px 10px;display:inline-block}.mini-button b{margin-left:15px}.mini-cards{display:flex;gap:8px}.mini-cards i{height:35px;flex:1;background:linear-gradient(120deg,#e6e7ff,#c8eff5);border-radius:4px}.mini-cards i:nth-child(2){background:linear-gradient(120deg,#e9dcff,#c5c9ff)}.floating-chip{position:absolute;z-index:3;top:48px;right:5px;background:var(--surface);border:1px solid var(--line);border-radius:50px;padding:10px 14px;font-size:8px;letter-spacing:1.2px;box-shadow:var(--shadow);display:flex;align-items:center;gap:9px}.floating-card{position:absolute;z-index:4;background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:13px 15px;display:flex;gap:10px;align-items:center;box-shadow:var(--shadow);animation:float 5s ease-in-out infinite}.floating-card b,.floating-card small{display:block}.floating-card b{font-size:10px}.floating-card small{font-size:8px;color:var(--muted);margin-top:3px}.float-icon,.code-symbol{width:30px;height:30px;display:grid;place-items:center;background:rgba(141,123,255,.16);color:#a99aff;border-radius:9px}.code-symbol{font:700 12px monospace;color:#4bd8ed;background:rgba(66,217,245,.12)}.card-speed{left:-5px;bottom:90px}.card-code{right:0;bottom:45px;animation-delay:-2s}.hero-stamp{position:absolute;right:12%;top:18%;font:700 22px 'Space Grotesk';color:rgba(255,255,255,.12);z-index:1}.hero-stamp span{color:rgba(120,214,245,.3)}.hero-bottom{display:flex;align-items:center;gap:15px;color:var(--muted);font-size:8px;letter-spacing:1.5px;margin-top:40px}.scroll-line{height:1px;width:75px;background:linear-gradient(90deg,var(--accent),transparent)}.hero-bottom span:last-child{margin-left:auto}
.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0}.trust-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}.trust-inner>span{font-size:9px;letter-spacing:1.5px;color:var(--muted);font-weight:700}.trust-tags{display:flex;gap:27px;flex-wrap:wrap}.trust-tags b{font:700 9px 'Space Grotesk';letter-spacing:1.3px;color:var(--muted);opacity:.75}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:52px}.section-heading h2,.process-intro h2,.contact-copy h2,.about-box h2{font-size:clamp(40px,5vw,62px);margin:0}.section-heading>p{max-width:380px;color:var(--muted);font-size:13px;line-height:1.9;margin-bottom:5px}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.service-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:27px;min-height:250px;transition:transform .3s,border-color .3s,background .3s}.service-card:hover{transform:translateY(-7px);border-color:rgba(141,123,255,.5);background:var(--surface2)}.service-top{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:10px}.service-icon{font-size:24px;color:#a392ff}.service-card h3{font:600 19px 'Space Grotesk';margin:30px 0 10px}.service-card p{font-size:12px;line-height:1.8;color:var(--muted);min-height:44px}.text-link{font-size:10px;color:var(--accent2);font-weight:700}
.work-section{background:var(--bg2)}.work-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:30px}.project-large{grid-row:span 2}.project-visual{height:255px;border-radius:16px;overflow:hidden;position:relative;display:grid;place-items:center}.project-large .project-visual{height:560px}.visual-fashion{background:linear-gradient(135deg,#f1e6dc,#d4b6a6)}.mock-browser{width:75%;height:78%;background:#fbf7f1;box-shadow:0 20px 50px rgba(50,35,25,.2);padding:20px;color:#332b27;transform:rotate(-3deg)}.mock-head{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;border-bottom:1px solid #ddd1c6;padding-bottom:12px}.fashion-layout{display:flex;align-items:center;justify-content:space-between;height:85%}.fashion-layout small{font-size:7px;letter-spacing:2px}.fashion-layout strong{display:block;font:700 45px/.95 'Space Grotesk';letter-spacing:-2px;margin:12px 0}.fashion-layout i{font-style:normal;color:#ad7762}.mock-cta{font-size:7px;letter-spacing:1px;border-bottom:1px solid;padding-bottom:5px}.fashion-shape{width:45%;height:75%;border-radius:48% 48% 8px 8px;background:linear-gradient(145deg,#c18c75,#e5c6b4 50%,#866154);position:relative}.fashion-shape:after{content:"";position:absolute;inset:14% 20%;border-radius:50% 50% 5px 5px;background:linear-gradient(135deg,#e8c7b4,#9e6f5d)}.visual-tech{background:linear-gradient(135deg,#182e55,#4d4b9e);padding:20px}.tech-window{width:80%;height:85%;border:1px solid rgba(255,255,255,.3);background:linear-gradient(120deg,rgba(10,20,42,.88),rgba(25,30,73,.7));padding:24px;color:white;position:relative;overflow:hidden}.tech-window small,.cafe-window small{font-size:7px;letter-spacing:2px}.tech-window strong{display:block;font:700 30px/1 'Space Grotesk';letter-spacing:-1px;margin-top:17px;position:relative;z-index:1}.tech-window em{font-style:normal;color:#72e7f6}.tech-window span,.cafe-window span{font-size:7px;letter-spacing:1px;position:absolute;bottom:18px}.tech-orb{position:absolute;width:130px;height:130px;border-radius:50%;right:-10px;bottom:-20px;background:radial-gradient(circle at 30% 30%,#b9a2ff,#5668d8 40%,#14294d 70%);box-shadow:0 0 60px #6d68ff}.visual-cafe{background:linear-gradient(135deg,#d5dfc7,#a9b89b);padding:20px}.cafe-window{width:80%;height:85%;background:#f8f2e8;color:#2e392c;padding:23px;position:relative;overflow:hidden}.cafe-window strong{display:block;font:700 32px/1 'Space Grotesk';margin-top:16px;letter-spacing:-1px;position:relative;z-index:2}.cafe-window i{font-family:Georgia;color:#9c6b43}.coffee-cup{position:absolute;right:15px;bottom:10px;font-size:70px;filter:drop-shadow(0 8px 5px #b5b5a0)}.project-meta{display:flex;justify-content:space-between;align-items:center;padding:15px 2px 8px}.project-meta h3{font:600 14px 'Space Grotesk';margin:0 0 3px}.project-meta span{font-size:9px;color:var(--muted)}.project-arrow{font-size:20px!important;color:var(--text)!important}
.process-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.process-intro p{font-size:13px;color:var(--muted);line-height:1.9;max-width:340px;margin:23px 0 28px}.steps{border-top:1px solid var(--line)}.step{display:grid;grid-template-columns:45px 1fr 20px;gap:20px;padding:25px 0;border-bottom:1px solid var(--line);align-items:start}.step>span{font-size:10px;color:var(--accent2);padding-top:4px}.step h3{font:600 17px 'Space Grotesk';margin:0 0 7px}.step p{font-size:11px;color:var(--muted);margin:0;line-height:1.8}.step>b{font-size:17px;color:var(--muted)}
.pricing-section{background:var(--bg2)}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;align-items:stretch}.price-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:30px;position:relative;display:flex;flex-direction:column}.price-card.featured{border-color:#8275ff;box-shadow:0 15px 55px rgba(113,101,255,.13);transform:translateY(-9px)}.popular-tag{position:absolute;right:20px;top:20px;font-size:7px;letter-spacing:1px;color:#a99aff;background:rgba(141,123,255,.13);padding:6px 9px;border-radius:30px}.plan-label{font-size:9px;letter-spacing:2px;color:var(--accent2);font-weight:700}.price-card h3{font:600 23px 'Space Grotesk';margin:13px 0 7px}.price-card>p{font-size:11px;line-height:1.8;color:var(--muted);min-height:42px}.price{font:700 30px 'Space Grotesk';letter-spacing:-1px;margin:20px 0}.price span{font:400 10px 'DM Sans';letter-spacing:0;color:var(--muted)}.price-card ul{list-style:none;padding:0;margin:0 0 25px;flex:1}.price-card li{font-size:11px;color:var(--muted);padding:8px 0;border-bottom:1px solid var(--line)}.price-card .btn{width:100%;font-size:10px}.pricing-note{font-size:9px;color:var(--muted);margin-top:22px}
.about-band{padding-top:20px;padding-bottom:20px}.about-box{border:1px solid var(--line);border-radius:24px;padding:50px;display:grid;grid-template-columns:100px 1fr 170px;gap:35px;align-items:center;background:linear-gradient(120deg,var(--surface),var(--bg2))}.about-symbol{font:700 28px 'Space Grotesk';color:rgba(153,137,255,.5);border:1px solid rgba(153,137,255,.3);border-radius:22px;width:90px;height:90px;display:grid;place-items:center;transform:rotate(-8deg)}.about-symbol span{color:var(--accent2)}.about-box .eyebrow{margin-bottom:15px}.about-box h2{font-size:clamp(30px,3.5vw,44px)}.about-box p{font-size:11px;color:var(--muted);line-height:1.9;max-width:520px;margin:15px 0 0}.about-side{display:flex;flex-direction:column;gap:12px}.about-side span{font-size:8px;letter-spacing:1px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:10px}
.contact-section{background:var(--bg2)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start}.contact-copy>p{color:var(--muted);font-size:14px;margin:24px 0 42px}.contact-direct{display:flex;align-items:center;gap:15px;margin:23px 0}.contact-icon{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;color:var(--accent2);font-size:18px}.contact-direct small{display:block;font-size:8px;letter-spacing:1.4px;color:var(--muted);margin-bottom:4px}.contact-direct a{font-size:13px;font-weight:700}.email-note{font-size:8px!important;letter-spacing:0!important}.contact-form{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:30px}.form-title{display:flex;justify-content:space-between;font:600 17px 'Space Grotesk';margin-bottom:25px}.form-title span{color:var(--accent2)}.contact-form label{display:block;margin-bottom:16px}.contact-form label>span{display:block;font-size:9px;font-weight:700;color:var(--muted);margin-bottom:7px}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid var(--line);border-radius:8px;background:var(--bg2);color:var(--text);padding:12px 13px;font-size:11px;outline:none;transition:border .2s}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--accent)}.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--muted);opacity:.7}.contact-form select option{background:var(--surface);color:var(--text)}.contact-form textarea{resize:vertical}.form-submit{width:100%;margin-top:5px}.form-submit b{margin-left:auto}.form-foot{display:block;text-align:center;color:var(--muted);font-size:8px;margin-top:12px}
.site-footer{padding:35px 0 20px}.footer-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:28px;border-bottom:1px solid var(--line)}.footer-top p{margin:0;color:var(--muted);font-size:11px}.back-top{font-size:8px;letter-spacing:1.3px;font-weight:700}.footer-bottom{display:flex;justify-content:space-between;gap:15px;padding-top:18px;color:var(--muted);font-size:8px;letter-spacing:1px}.footer-bottom b{color:var(--accent2)}.whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:90;display:flex;align-items:center;gap:9px;background:#20c76a;color:#062616;padding:12px 17px;border-radius:50px;box-shadow:0 8px 30px rgba(32,199,106,.3);font-size:11px;font-weight:700;transition:.25s}.whatsapp-float:hover{transform:translateY(-4px)}.whatsapp-float span{font-size:17px}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:translateY(0)}@keyframes float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(-2deg)}}.floating-card.card-speed{animation-name:floatCard}.floating-card.card-code{animation-name:floatCard;animation-delay:-2s}@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
body.light .browser-card{box-shadow:0 35px 90px rgba(30,42,75,.22)}body.light .avatar-stack span{border-color:var(--bg)}body.light .trust-strip{background:#f1f2f8}body.light .floating-card{box-shadow:0 15px 35px rgba(30,42,75,.12)}
@media(max-width:900px){.main-nav{gap:17px}.main-nav a{font-size:11px}.hero-grid{gap:20px}.hero-art{transform:scale(.9)}.process-layout{gap:50px}.contact-grid{gap:45px}.about-box{grid-template-columns:70px 1fr}.about-symbol{width:65px;height:65px}.about-side{grid-column:2;flex-direction:row;flex-wrap:wrap}.about-side span{border:0;padding:0}.section-pad{padding:85px 0}}
@media(max-width:720px){.container{width:min(100% - 34px,540px)}.site-header{height:70px}.main-nav{display:none;position:absolute;top:69px;left:0;right:0;background:var(--surface);border-bottom:1px solid var(--line);padding:20px 25px 25px;flex-direction:column;gap:18px}.main-nav.open{display:flex}.main-nav a{font-size:13px}.nav-actions{gap:7px}.nav-cta{display:none}.menu-toggle{display:block}.brand{font-size:17px}.brand-mark{width:35px;height:35px}.hero{padding-top:70px;min-height:0}.hero-grid{grid-template-columns:1fr;gap:15px}.hero-copy{position:relative;z-index:2}.hero h1{font-size:clamp(52px,14vw,72px)}.hero-lead{font-size:14px;max-width:420px}.hero-proof{margin-top:35px}.hero-art{height:370px;transform:none;margin-top:10px}.browser-card{width:min(390px,88%);height:265px}.orbit-a{width:350px;height:240px}.orbit-b{width:310px;height:350px}.floating-chip{top:18px;right:0;font-size:7px}.card-speed{left:0;bottom:55px}.card-code{right:0;bottom:25px}.hero-bottom{margin-top:25px}.trust-inner{display:block}.trust-inner>span{display:block;margin-bottom:15px}.trust-tags{gap:15px}.section-pad{padding:75px 0}.section-heading{display:block;margin-bottom:35px}.section-heading h2,.process-intro h2,.contact-copy h2{font-size:48px}.section-heading>p{margin-top:20px;font-size:12px}.services-grid{grid-template-columns:1fr 1fr;gap:10px}.service-card{padding:19px;min-height:235px}.service-card h3{font-size:16px;margin-top:25px}.service-card p{font-size:10px}.work-grid{grid-template-columns:1fr;gap:20px}.project-large{grid-row:auto}.project-large .project-visual{height:390px}.project-visual{height:245px}.process-layout{grid-template-columns:1fr;gap:45px}.steps{margin-top:0}.pricing-grid{grid-template-columns:1fr;gap:15px}.price-card.featured{transform:none}.price-card>p{min-height:0}.about-band{padding:10px 0}.about-box{padding:28px;grid-template-columns:1fr;gap:22px}.about-symbol{width:60px;height:60px;font-size:20px}.about-side{grid-column:auto}.contact-grid{grid-template-columns:1fr;gap:35px}.contact-copy>p{margin:20px 0 28px}.contact-form{padding:22px}.footer-top{flex-wrap:wrap;gap:18px}.footer-top p{order:3;width:100%}.footer-bottom{flex-direction:column;gap:8px}.whatsapp-float{right:14px;bottom:14px;padding:11px 14px}.trust-tags b{font-size:8px}}
@media(max-width:390px){.services-grid{grid-template-columns:1fr}.service-card{min-height:0}.hero-actions .btn{padding:13px 15px}.hero-art{height:330px}.browser-card{height:235px}.mini-hero strong{font-size:29px}.floating-card{padding:10px}.card-speed{left:-5px}.card-code{right:-5px}.section-heading h2,.process-intro h2,.contact-copy h2{font-size:42px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}


/* WEBNOVA responsive refinement — mobile-first safeguards */
html{width:100%;max-width:100%;overflow-x:clip;scroll-padding-top:82px}
body{width:100%;max-width:100%;overflow-x:clip}
*,*::before,*::after{box-sizing:border-box}
img,svg,video,canvas{max-width:100%;height:auto}
.container{min-width:0}
.hero-grid>*,.contact-grid>*,.process-layout>*,.about-box>*,.service-card,.price-card{min-width:0}
.contact-direct a,.footer-bottom a{overflow-wrap:anywhere;word-break:break-word}
.contact-form input,.contact-form select,.contact-form textarea{min-width:0;max-width:100%;font:inherit;font-size:14px}
.menu-toggle{flex:0 0 auto;min-width:42px;min-height:42px;align-items:center;justify-content:center}
.lang-toggle,.theme-toggle{min-width:38px;min-height:38px}

@media(max-width:720px){
  html,body{overflow-x:clip}
  .container{width:calc(100% - 32px);max-width:560px;margin-inline:auto}
  .site-header{height:66px;padding:0;}
  .nav-wrap{height:66px;gap:8px}
  .brand{font-size:15px;gap:8px;white-space:nowrap}
  .brand small{font-size:7px;letter-spacing:1.4px}
  .brand-mark{width:33px;height:33px;flex:0 0 33px}
  .nav-actions{margin-left:auto;gap:5px}
  .main-nav{z-index:120;top:65px;left:0;right:0;width:100%;padding:18px 22px 22px;box-shadow:0 18px 35px rgba(0,0,0,.18)}
  .main-nav.open{display:flex}
  .main-nav a{display:block;width:100%;padding:7px 0;font-size:14px}
  .menu-toggle{display:flex;padding:8px;background:transparent;border:0}
  .hero{padding-top:52px;padding-bottom:42px;min-height:0}
  .hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
  .hero-copy{width:100%;min-width:0}
  .hero h1{font-size:clamp(43px,12.5vw,64px);line-height:.99;overflow-wrap:anywhere}
  .hero-lead{font-size:14px;line-height:1.75}
  .hero-actions{display:flex;flex-wrap:wrap;gap:10px}
  .hero-actions .btn{min-height:46px;justify-content:center}
  .hero-art{width:100%;max-width:470px;height:330px;margin:12px auto 0;position:relative;transform:none}
  .browser-card{width:min(86%,370px);height:235px;left:50%;transform:translateX(-50%);top:40px}
  .orbit-a,.orbit-b{max-width:100%;left:50%;transform:translateX(-50%)}
  .floating-chip{right:0;top:8px;max-width:72%;font-size:7px}
  .floating-card{max-width:57%;gap:8px;padding:10px}
  .floating-card b{font-size:10px}.floating-card small{font-size:8px}
  .card-speed{left:0;bottom:28px}.card-code{right:0;bottom:8px}
  .hero-stamp{right:8px;bottom:0}
  .hero-bottom{margin-top:14px}
  .trust-inner{padding-block:24px}
  .trust-tags{display:flex;flex-wrap:wrap;gap:10px 16px}
  .section-pad{padding:62px 0}
  .section-heading h2,.process-intro h2,.contact-copy h2{font-size:clamp(36px,10vw,48px);line-height:1.05}
  .services-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .service-card{padding:16px;min-height:0;overflow-wrap:anywhere}
  .service-card h3{font-size:15px;line-height:1.25}
  .service-card p{font-size:11px;line-height:1.65}
  .service-card .text-link{font-size:10px}
  .work-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .project-visual,.project-large .project-visual{height:auto;aspect-ratio:1.35/1}
  .process-layout{grid-template-columns:minmax(0,1fr);gap:32px}
  .step{grid-template-columns:30px minmax(0,1fr) 16px;gap:12px}
  .pricing-grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .price-card{padding:24px}
  .price-card.featured{transform:none}
  .about-box{grid-template-columns:minmax(0,1fr);padding:24px;gap:18px}
  .about-side{grid-column:auto;display:flex;flex-wrap:wrap;gap:10px 16px}
  .contact-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .contact-copy>p{font-size:13px;margin:16px 0 24px}
  .contact-direct{gap:11px;align-items:flex-start}
  .contact-direct>div{min-width:0}
  .contact-direct a{font-size:12px}
  .contact-form{width:100%;padding:20px}
  .contact-form label>span{font-size:10px}
  .contact-form input,.contact-form select,.contact-form textarea{padding:13px;font-size:14px}
  .form-submit{min-height:48px}
  .footer-top{align-items:flex-start;gap:14px}
  .footer-top p{width:100%;order:3}
  .footer-bottom{display:flex;flex-direction:column;gap:9px;line-height:1.5;overflow-wrap:anywhere}
  .whatsapp-float{right:12px;bottom:12px;padding:11px 14px;min-height:44px}
}
@media(max-width:420px){
  .container{width:calc(100% - 28px)}
  .nav-wrap{gap:5px}
  .brand{font-size:13px;gap:6px}
  .brand small{font-size:6px}
  .brand-mark{width:30px;height:30px;flex-basis:30px}
  .lang-toggle{font-size:11px;padding:5px}
  .theme-toggle{width:34px;height:34px}
  .hero{padding-top:42px}
  .hero h1{font-size:clamp(40px,12vw,52px)}
  .hero-art{height:295px}
  .browser-card{height:210px;top:38px}
  .browser-content{padding:13px}
  .mini-hero strong{font-size:27px}
  .floating-card{max-width:59%;padding:8px}
  .services-grid{grid-template-columns:minmax(0,1fr)}
  .service-card{padding:19px}
  .service-card h3{font-size:17px}
  .service-card p{font-size:12px}
  .project-visual,.project-large .project-visual{aspect-ratio:1.15/1}
  .price{font-size:28px}
  .contact-form{padding:17px}
  .whatsapp-float b{font-size:10px}
}
@media(max-width:340px){
  .container{width:calc(100% - 22px)}
  .brand{font-size:12px}
  .nav-actions{gap:2px}
  .hero-actions .btn{width:100%}
  .hero-art{height:270px}
  .browser-card{height:195px}
  .floating-card{max-width:62%}
}


/* WEBNOVA 2026 premium motion + mobile layout polish */
:root { scroll-behavior:smooth; }
.scroll-progress{
  position:fixed;left:0;top:0;height:3px;width:0;z-index:9999;
  background:linear-gradient(90deg,#8d7bff,#38d7ef,#9dffcf);
  box-shadow:0 0 16px rgba(56,215,239,.55);
}
.hero-copy .eyebrow{animation:fadeSlide .8s both}
.hero h1 em,.section-heading h2 em,.process-intro h2 em,.contact-copy h2 em{
  background:linear-gradient(100deg,#a99cff 5%,#5edcf0 48%,#a6f5d0 90%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  background-size:180% auto;animation:gradientFlow 7s ease-in-out infinite;
}
.page-glow{animation:glowDrift 15s ease-in-out infinite alternate}
.glow-two{animation-delay:-7s}
.hero-art .orbit{animation:orbitSpin 24s linear infinite}
.hero-art .orbit-b{animation-direction:reverse;animation-duration:32s}
.browser-card{animation:cardFloat 7s ease-in-out infinite}
.service-card,.project-card,.price-card{transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s}
.service-card:hover,.project-card:hover,.price-card:hover{
  transform:translateY(-8px);border-color:rgba(119,155,255,.48);
  box-shadow:0 22px 55px rgba(0,0,0,.18)
}
.btn,.text-link,.contact-direct a{transition:all .25s ease}
.btn:active{transform:translateY(0) scale(.98)}
.trust-tags b{transition:color .25s,transform .25s}
.trust-tags b:hover{color:var(--accent2);transform:translateY(-3px)}
.menu-toggle{position:relative}
.menu-toggle span{transition:transform .25s,opacity .2s}
.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3px) rotate(-45deg)}
.contact-form{box-shadow:0 18px 60px rgba(0,0,0,.10)}
.contact-form input,.contact-form select,.contact-form textarea{font-size:16px}
:focus-visible{outline:2px solid #66d9ed;outline-offset:3px}
@keyframes fadeSlide{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes gradientFlow{0%,100%{background-position:0% center}50%{background-position:100% center}}
@keyframes glowDrift{0%{transform:translate3d(0,0,0) scale(.9)}100%{transform:translate3d(50px,35px,0) scale(1.12)}}
@keyframes orbitSpin{to{rotate:360deg}}
@keyframes cardFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}

@media (max-width: 720px){
  html,body{max-width:100%;overflow-x:hidden}
  .container{width:calc(100% - 30px);max-width:560px}
  .site-header{height:64px}
  .nav-wrap{height:64px;gap:5px}
  .brand{font-size:14px;gap:7px;min-width:0}
  .brand-mark{width:32px;height:32px;flex:0 0 32px}
  .brand small{font-size:6px;letter-spacing:1.3px}
  .nav-actions{gap:4px;flex:0 0 auto}
  .lang-toggle{padding:0 8px;min-width:35px;font-size:10px}
  .theme-toggle{width:35px;min-width:35px;height:35px}
  .menu-toggle{width:38px;min-width:38px;height:38px;padding:7px}
  .nav-cta{display:none}
  .main-nav{position:absolute;top:63px;left:10px;right:10px;width:auto;display:none;
    padding:12px 18px 18px;border:1px solid var(--line);border-radius:0 0 16px 16px;
    background:var(--surface);box-shadow:0 22px 45px rgba(0,0,0,.25);gap:0}
  .main-nav.open{display:flex;flex-direction:column}
  .main-nav a{padding:12px 2px;border-bottom:1px solid var(--line);font-size:14px}
  .main-nav a:last-child{border:0}
  .hero{padding:45px 0 34px;min-height:auto}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:8px}
  .hero-copy,.hero-art{min-width:0;width:100%}
  .hero h1{font-size:clamp(42px,11.8vw,62px);line-height:1.02;letter-spacing:-2px}
  .hero-lead{max-width:100%;font-size:14px;line-height:1.7}
  .hero-actions{gap:9px}
  .hero-actions .btn{min-height:46px;padding:12px 15px;gap:10px;font-size:11px}
  .hero-proof{margin-top:24px}
  .hero-art{height:300px;margin:10px auto 0;transform:none;overflow:visible}
  .browser-card{width:min(82%,350px);height:215px;top:38px}
  .orbit-a,.orbit-b{max-width:94%;left:50%;transform:translateX(-50%)}
  .floating-chip{top:4px;right:0;max-width:76%;white-space:nowrap}
  .floating-card{max-width:58%;padding:9px;gap:7px}
  .floating-card b{font-size:10px}.floating-card small{font-size:8px}
  .card-speed{left:0;bottom:17px}.card-code{right:0;bottom:0}
  .hero-stamp{right:5px;bottom:-5px}
  .hero-bottom{margin-top:7px}
  .trust-inner{padding:22px 0}
  .trust-tags{flex-wrap:wrap;gap:9px 14px}
  .section-pad{padding:60px 0}
  .section-heading{display:block;margin-bottom:28px}
  .section-heading h2,.process-intro h2,.contact-copy h2{font-size:clamp(35px,9.5vw,47px);line-height:1.06}
  .section-heading>p{font-size:13px;line-height:1.7;margin-top:14px}
  .services-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .service-card{padding:15px;min-height:0;overflow-wrap:anywhere}
  .service-card h3{font-size:14px;line-height:1.3;margin-top:18px}
  .service-card p{font-size:11px;line-height:1.6}
  .service-card .text-link{font-size:10px}
  .work-grid,.process-layout,.pricing-grid,.contact-grid{grid-template-columns:minmax(0,1fr)}
  .work-grid{gap:15px}
  .project-visual,.project-large .project-visual{height:auto;aspect-ratio:1.35/1}
  .process-layout{gap:28px}
  .pricing-grid{gap:13px}
  .price-card,.price-card.featured{transform:none;padding:22px}
  .about-box{grid-template-columns:minmax(0,1fr);padding:22px;gap:15px}
  .about-side{grid-column:auto;display:flex;flex-wrap:wrap;gap:8px 14px}
  .contact-grid{gap:25px}
  .contact-form{padding:18px;width:100%;min-width:0}
  .contact-form label{min-width:0}
  .contact-form input,.contact-form select,.contact-form textarea{width:100%;min-width:0;font-size:16px;padding:13px}
  .contact-direct{align-items:flex-start;gap:10px}
  .contact-direct>div{min-width:0;max-width:calc(100% - 55px)}
  .contact-direct a{font-size:12px;overflow-wrap:anywhere;word-break:break-word}
  .footer-top{display:flex;flex-wrap:wrap;gap:14px}
  .footer-top p{order:3;width:100%;margin:0}
  .footer-bottom{display:flex;flex-direction:column;gap:7px;overflow-wrap:anywhere}
  .whatsapp-float{right:12px;bottom:12px;z-index:90}
}
@media(max-width:420px){
  .container{width:calc(100% - 26px)}
  .brand{font-size:12px;gap:6px}
  .brand-mark{width:29px;height:29px;flex-basis:29px}
  .brand small{font-size:5.5px;letter-spacing:1px}
  .nav-actions{gap:3px}
  .lang-toggle{font-size:9px;padding:0 6px;min-width:32px}
  .theme-toggle{width:32px;min-width:32px;height:32px}
  .menu-toggle{width:34px;min-width:34px;height:34px}
  .hero h1{font-size:clamp(39px,11.5vw,49px)}
  .hero-art{height:275px}
  .browser-card{height:198px;top:36px}
  .browser-content{padding:12px}
  .mini-hero strong{font-size:26px}
  .services-grid{grid-template-columns:minmax(0,1fr)}
  .service-card{padding:18px}
  .service-card h3{font-size:16px}
  .service-card p{font-size:12px}
  .service-card .text-link{font-size:11px}
  .contact-form{padding:15px}
}
@media(max-width:340px){
  .brand{font-size:11px}
  .nav-actions{gap:2px}
  .hero-actions .btn{width:100%}
  .hero-art{height:250px}
  .browser-card{height:180px}
}
@media(prefers-reduced-motion:reduce){
  .page-glow,.hero-art .orbit,.browser-card,.hero-copy .eyebrow,.hero h1 em,
  .section-heading h2 em,.process-intro h2 em,.contact-copy h2 em{animation:none!important}
  .service-card:hover,.project-card:hover,.price-card:hover{transform:none}
}


/* FINAL VIEWPORT WIDTH FIX — prevent a narrow page canvas on phones */
html, body {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
}
body { overflow-x: hidden !important; }
.site-header, main, .trust-strip, .site-footer {
  width: 100% !important;
  max-width: 100% !important;
}
.container {
  width: min(1160px, calc(100% - 48px)) !important;
  max-width: 1160px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.hero, #services, #work, #process, #pricing, #contact,
.about-band, .trust-strip, .site-footer {
  min-width: 0 !important;
}
.hero-grid, .services-grid, .work-grid, .process-layout,
.pricing-grid, .contact-grid {
  min-width: 0 !important;
}
.hero-grid > *, .services-grid > *, .work-grid > *,
.process-layout > *, .pricing-grid > *, .contact-grid > * {
  min-width: 0 !important;
  max-width: 100%;
}
img, svg, video, canvas { max-width: 100%; }
@media screen and (max-width: 900px) {
  .container {
    width: calc(100% - 40px) !important;
    max-width: 720px !important;
  }
}
@media screen and (max-width: 720px) {
  html, body { width: 100% !important; overflow-x: hidden !important; }
  .site-header { width: 100vw !important; }
  .nav-wrap {
    width: calc(100% - 28px) !important;
    max-width: none !important;
    margin: 0 auto !important;
  }
  .container {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .hero { width: 100% !important; padding: 54px 0 32px !important; }
  .hero-grid {
    width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
  }
  .hero-copy { width: 100% !important; max-width: 100% !important; }
  .hero h1 {
    max-width: 100% !important;
    font-size: clamp(44px, 12vw, 64px) !important;
    line-height: 1.04 !important;
    letter-spacing: -2.4px !important;
    overflow-wrap: normal !important;
  }
  .hero-lead { max-width: 100% !important; }
  .hero-art {
    display: grid !important;
    width: 100% !important;
    max-width: 100% !important;
    height: clamp(270px, 78vw, 340px) !important;
    margin: 12px auto 0 !important;
    transform: none !important;
  }
  .orbit-a { width: min(88vw, 360px) !important; height: min(62vw, 250px) !important; }
  .orbit-b { width: min(78vw, 320px) !important; height: min(88vw, 350px) !important; }
  .browser-card { width: min(82%, 360px) !important; max-width: 100% !important; }
  .floating-chip { max-width: 80% !important; white-space: normal !important; }
  .trust-inner { width: calc(100% - 32px) !important; }
  .services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .service-card { min-width: 0 !important; }
  .work-grid, .process-layout, .pricing-grid, .contact-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .contact-form { width: 100% !important; max-width: 100% !important; }
  .contact-form input, .contact-form select, .contact-form textarea {
    width: 100% !important; max-width: 100% !important; min-width: 0 !important;
  }
  .footer-top, .footer-bottom { width: calc(100% - 32px) !important; }
}
@media screen and (max-width: 420px) {
  .container, .trust-inner, .footer-top, .footer-bottom {
    width: calc(100% - 26px) !important;
  }
  .services-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .hero h1 { font-size: clamp(40px, 11.4vw, 50px) !important; }
  .nav-wrap { width: calc(100% - 24px) !important; }
}