:root { --ink:#17181b; --paper:#f5f1e9; --blue:#3457f1; --coral:#ff5d45; --lime:#d8f05c; --line:rgba(23,24,27,.13); }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial,Helvetica,sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
.shell { width:min(1240px,calc(100% - 64px)); margin-inline:auto; }
.ambient { position:absolute; border-radius:50%; filter:blur(110px); pointer-events:none; z-index:0; opacity:.42; }
.ambient-one { width:420px; height:420px; background:#aebaff; top:-180px; right:3%; }
.ambient-two { width:330px; height:330px; background:#ffb6a8; top:580px; left:-180px; }
.site-header { height:92px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); position:relative; z-index:10; }
.brand { display:flex; align-items:center; gap:10px; font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.brand-mark { display:grid; place-items:center; width:34px; height:34px; color:white; background:var(--ink); border-radius:50%; font-size:16px; }
nav { display:flex; gap:34px; font-size:12px; font-weight:700; letter-spacing:.09em; }
nav a { transition:opacity .2s; } nav a:hover { opacity:.55; }
.header-cta { display:flex; align-items:center; gap:16px; padding:12px 12px 12px 19px; border:1px solid var(--ink); border-radius:999px; font-size:13px; font-weight:700; }
.header-cta .arrow { display:grid; place-items:center; width:28px; height:28px; color:white; background:var(--ink); border-radius:50%; }
.arrow { display:inline-block; font-size:18px; line-height:1; }
.diagonal { transform:rotate(-45deg); }
.hero { min-height:690px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:64px; position:relative; z-index:2; padding-block:72px 84px; }
.hero-copy { position:relative; z-index:2; }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 22px; font-size:11px; font-weight:800; letter-spacing:.18em; }
.eyebrow span { width:7px; height:7px; background:var(--coral); border-radius:50%; box-shadow:0 0 0 5px rgba(255,93,69,.15); }
h1,h2 { margin:0; font-weight:500; letter-spacing:-.055em; line-height:.94; }
h1 { font-size:clamp(58px,6.3vw,92px); }
h1 em,h2 em { font-family:Georgia,serif; font-weight:400; color:var(--blue); }
.hero-text { max-width:570px; margin:32px 0; font-size:18px; line-height:1.55; color:#56575a; }
.hero-actions { display:flex; align-items:center; gap:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:56px; padding:0 24px; border-radius:999px; font-size:14px; font-weight:700; transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { color:#fff; background:var(--blue); box-shadow:0 14px 30px rgba(52,87,241,.22); }
.button-ghost { border:1px solid var(--line); background:rgba(255,255,255,.38); backdrop-filter:blur(12px); }
.hero-visual { min-height:520px; position:relative; display:grid; place-items:center; }
.glass-card,.floating-card { background:rgba(255,255,255,.52); border:1px solid rgba(255,255,255,.78); box-shadow:0 24px 70px rgba(38,40,56,.13),inset 0 0 0 1px rgba(28,29,32,.04); backdrop-filter:blur(20px); }
.main-card { width:min(460px,88%); min-height:375px; border-radius:36px; padding:26px 30px; position:relative; transform:rotate(-2deg); overflow:hidden; z-index:2; }
.main-card::after { content:""; position:absolute; width:220px; height:220px; border-radius:50%; right:-95px; bottom:-105px; background:var(--blue); opacity:.92; }
.browser-dots { display:flex; gap:6px; padding-bottom:28px; border-bottom:1px solid var(--line); }
.browser-dots i { width:7px; height:7px; background:#b4b2ae; border-radius:50%; }
.mock-label { margin-top:42px; color:#727376; font-size:9px; font-weight:800; letter-spacing:.2em; }
.mock-title { margin-top:12px; font-family:Georgia,serif; font-size:29px; line-height:1.16; letter-spacing:-.035em; }
.mock-title b { font-family:Arial,sans-serif; font-weight:800; }
.mock-lines { display:grid; gap:7px; width:52%; margin-top:24px; }
.mock-lines span { height:5px; border-radius:5px; background:rgba(23,24,27,.12); } .mock-lines span:nth-child(2){width:84%}.mock-lines span:nth-child(3){width:65%}
.mock-button { display:inline-flex; align-items:center; gap:10px; margin-top:28px; padding:11px 17px; border-radius:999px; color:white; background:var(--ink); font-size:11px; font-weight:700; }
.spark-wrap { position:absolute; top:58px; right:44px; width:70px; height:70px; display:grid; place-items:center; color:var(--coral); transform:rotate(10deg); }
.spark { width:55px; }
.floating-card { position:absolute; z-index:4; border-radius:20px; padding:18px 21px; }
.floating-card small { display:block; color:#747578; font-size:9px; font-weight:800; letter-spacing:.14em; }
.floating-card strong { display:block; margin-top:6px; font-size:20px; }
.float-price { top:36px; right:-10px; transform:rotate(4deg); }
.float-seo { left:-6px; bottom:46px; display:flex; align-items:center; gap:12px; transform:rotate(2deg); }
.status-dot { width:13px; height:13px; border-radius:50%; background:#79c56f; box-shadow:0 0 0 6px rgba(121,197,111,.14); }
.float-seo strong { font-size:15px; }
.orbit { position:absolute; border:1px solid rgba(52,87,241,.18); border-radius:50%; z-index:0; }
.orbit-one { width:500px; height:500px; }.orbit-two { width:370px; height:370px; border-color:rgba(255,93,69,.18); }
.trust-line { position:relative; z-index:2; color:white; background:var(--ink); transform:rotate(-1deg) scale(1.02); }
.trust-inner { min-height:58px; display:flex; align-items:center; justify-content:space-around; font-size:10px; font-weight:800; letter-spacing:.18em; }
.trust-inner b { color:var(--lime); font-size:16px; }
.section { padding-block:130px; position:relative; z-index:2; }
.section-heading { display:grid; grid-template-columns:1.3fr .7fr; align-items:end; gap:80px; margin-bottom:60px; }
h2 { font-size:clamp(50px,6vw,78px); }
.section-heading>p { margin:0 0 8px; color:#5f6063; font-size:17px; line-height:1.6; }
.service-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:16px; }
.service-card { min-height:460px; padding:30px; display:flex; flex-direction:column; justify-content:space-between; background:rgba(255,255,255,.46); border:1px solid rgba(255,255,255,.8); border-radius:30px; box-shadow:inset 0 0 0 1px rgba(23,24,27,.05); backdrop-filter:blur(18px); transition:transform .25s,box-shadow .25s; }
.service-card:hover { transform:translateY(-7px); box-shadow:0 24px 50px rgba(23,24,27,.08); }
.service-card.featured { color:white; background:var(--blue); border-color:transparent; box-shadow:0 20px 50px rgba(52,87,241,.24); }
.service-top { display:flex; align-items:start; justify-content:space-between; font-size:11px; font-weight:800; letter-spacing:.15em; }
.service-icon { display:grid; place-items:center; width:54px; height:54px; color:var(--ink); background:var(--lime); border-radius:17px; font-size:24px; }
.service-icon.coral { background:#ffd1c9; color:var(--coral); }.service-icon.lime { font-family:Georgia,serif; background:var(--lime); font-size:18px; }
.service-card h3 { margin:0 0 18px; font-size:31px; line-height:1.05; letter-spacing:-.035em; }
.service-card p { margin:0; color:#646568; font-size:14px; line-height:1.65; }
.service-card.featured p { color:rgba(255,255,255,.72); }
.service-price { padding-top:22px; border-top:1px solid rgba(23,24,27,.12); }
.service-card.featured .service-price { border-color:rgba(255,255,255,.22); }
.service-price small { display:block; margin-bottom:7px; font-size:9px; font-weight:800; letter-spacing:.15em; opacity:.62; }
.service-price strong { font-size:22px; }
@media (max-width:900px) {
  .shell{width:min(100% - 36px,680px)} nav{display:none}.hero{grid-template-columns:1fr;gap:34px;padding-top:70px}.hero-text{max-width:620px}.hero-visual{min-height:500px}.float-price{right:0}.float-seo{left:0}.section-heading{grid-template-columns:1fr;gap:28px}.service-grid{grid-template-columns:1fr 1fr}.service-card.featured{grid-column:span 2;min-height:390px}
}
@media (max-width:580px) {
  .shell{width:calc(100% - 28px)}.site-header{height:76px}.header-cta{padding:10px}.header-cta>span:first-child{display:none}.brand{font-size:11px}.brand-mark{width:31px;height:31px}.hero{min-height:auto;padding-block:62px 70px}h1{font-size:52px}.hero-text{font-size:16px}.hero-actions{flex-direction:column;align-items:stretch}.button{width:100%}.hero-visual{min-height:410px;margin-top:8px}.main-card{width:94%;min-height:330px;padding:23px;border-radius:27px}.mock-title{font-size:24px}.spark-wrap{right:20px}.float-price{top:4px;right:-2px}.float-seo{bottom:8px;left:-2px}.orbit-one{width:390px;height:390px}.orbit-two{width:285px;height:285px}.trust-inner{gap:24px;justify-content:flex-start;overflow:hidden;white-space:nowrap}.section{padding-block:92px}.section-heading{margin-bottom:42px}h2{font-size:49px}.service-grid{grid-template-columns:1fr}.service-card.featured{grid-column:auto}.service-card{min-height:410px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.portfolio-section { padding:125px 0 135px; position:relative; z-index:2; background:#ebe8e0; }
.portfolio-heading { margin-bottom:56px; }
.portfolio-categories { margin:-14px 0 35px; display:flex; gap:9px; flex-wrap:wrap; }
.portfolio-categories button { padding:11px 17px; color:#6b6c70; border:1px solid rgba(23,24,27,.12); border-radius:999px; background:rgba(255,255,255,.28); font:700 11px Arial,sans-serif; cursor:pointer; transition:color .2s,background .2s,transform .2s; }
.portfolio-categories button:hover { transform:translateY(-2px); }.portfolio-categories button:focus-visible { outline:3px solid rgba(52,87,241,.25); outline-offset:3px; }
.portfolio-categories button.active { color:white; background:var(--ink); border-color:var(--ink); }
.portfolio-categories b { margin-left:8px; display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 5px; color:var(--ink); background:var(--lime); border-radius:999px; font-size:9px; }
.portfolio-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.portfolio-card { padding:14px; border:1px solid rgba(255,255,255,.85); border-radius:36px; background:rgba(255,255,255,.48); box-shadow:0 30px 80px rgba(23,24,27,.09),inset 0 0 0 1px rgba(23,24,27,.04); backdrop-filter:blur(18px); }
.portfolio-card.featured-work { grid-column:1/-1; }
.portfolio-image-wrap { width:100%; height:345px; padding:0; position:relative; display:block; overflow:hidden; border:0; border-radius:26px; background:#fff; cursor:zoom-in; }
.featured-work .portfolio-image-wrap { height:min(62vw,720px); }
.portfolio-image-wrap img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.portfolio-image-wrap.contain-art img { object-fit:contain; padding:24px; }
.portfolio-card:hover .portfolio-image-wrap img { transform:scale(1.018); }
.portfolio-zoom { position:absolute; left:18px; bottom:18px; width:42px; height:42px; display:grid; place-items:center; color:white; background:rgba(23,24,27,.83); border:1px solid rgba(255,255,255,.35); border-radius:50%; backdrop-filter:blur(10px); font-size:18px; opacity:0; transform:translateY(6px) rotate(-45deg); transition:opacity .2s,transform .2s; }
.portfolio-image-wrap:hover .portfolio-zoom,.portfolio-image-wrap:focus-visible .portfolio-zoom { opacity:1; transform:translateY(0) rotate(-45deg); }.portfolio-image-wrap:focus-visible{outline:3px solid rgba(52,87,241,.35);outline-offset:3px}
.portfolio-index { position:absolute; top:22px; right:22px; width:54px; height:54px; display:grid; place-items:center; color:white; background:rgba(23,24,27,.86); border:1px solid rgba(255,255,255,.34); border-radius:50%; backdrop-filter:blur(12px); font-size:11px; font-weight:800; letter-spacing:.12em; }
.portfolio-meta { min-height:112px; padding:24px 14px 12px; display:flex; align-items:end; justify-content:space-between; gap:20px; }
.portfolio-meta p { margin:0 0 8px; color:#6f7073; font-size:9px; font-weight:800; letter-spacing:.16em; }
.portfolio-meta h3 { margin:0; font-size:27px; line-height:1; letter-spacing:-.04em; }.featured-work .portfolio-meta h3{font-size:34px}
.portfolio-meta>a { display:flex; align-items:center; gap:14px; padding:11px 13px 11px 18px; border:1px solid var(--ink); border-radius:999px; font-size:12px; font-weight:700; white-space:nowrap; }
.portfolio-meta>a .arrow { display:grid; place-items:center; width:30px; height:30px; color:white; background:var(--ink); border-radius:50%; }
.portfolio-note { margin:28px 0 0; display:flex; align-items:center; gap:12px; color:#68696c; font-size:10px; font-weight:800; letter-spacing:.12em; }
.portfolio-note span { width:28px; height:28px; display:grid; place-items:center; color:white; background:var(--blue); border-radius:50%; font-size:16px; }
.portfolio-more { min-width:210px; height:54px; margin:35px auto 0; padding:0 12px 0 22px; display:flex; align-items:center; justify-content:space-between; gap:22px; color:white; background:var(--blue); border:0; border-radius:999px; box-shadow:0 15px 30px rgba(52,87,241,.2); font:700 13px Arial,sans-serif; cursor:pointer; transition:transform .2s; }
.portfolio-more:hover { transform:translateY(-2px); }.portfolio-more span { width:34px; height:34px; display:grid; place-items:center; color:var(--ink); background:var(--lime); border-radius:50%; font-size:18px; }
.portfolio-lightbox { position:fixed; inset:0; z-index:1000; padding:28px; display:grid; place-items:center; background:rgba(10,10,12,.88); backdrop-filter:blur(18px); animation:lightbox-in .2s ease-out; }
.lightbox-content { width:min(1200px,calc(100vw - 56px)); max-height:calc(100vh - 56px); padding:12px; display:flex; flex-direction:column; background:rgba(255,255,255,.96); border:1px solid rgba(255,255,255,.7); border-radius:28px; box-shadow:0 35px 100px rgba(0,0,0,.45); }
.lightbox-content>img { width:100%; min-height:0; max-height:calc(100vh - 150px); object-fit:contain; border-radius:19px; background:#f6f4ef; }
.lightbox-caption { min-height:64px; padding:13px 10px 3px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.lightbox-caption small { display:block; margin-bottom:4px; color:#717276; font-size:9px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }.lightbox-caption strong{font-size:20px}.lightbox-caption>span{color:#85868a;font-size:10px}
.lightbox-close { position:fixed; top:22px; right:22px; z-index:2; width:48px; height:48px; display:grid; place-items:center; color:white; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.3); border-radius:50%; font-size:30px; line-height:1; cursor:pointer; backdrop-filter:blur(12px); }.lightbox-close:hover{background:var(--coral)}
@keyframes lightbox-in { from{opacity:0} to{opacity:1} }

.process-section { position:relative; z-index:2; color:white; background:var(--ink); padding:125px 0; overflow:hidden; }
.process-section::before { content:""; position:absolute; width:500px; height:500px; left:-220px; top:-220px; border:1px solid rgba(216,240,92,.2); border-radius:50%; box-shadow:0 0 0 80px rgba(216,240,92,.025),0 0 0 160px rgba(216,240,92,.02); }
.process-wrap { display:grid; grid-template-columns:.85fr 1.15fr; gap:110px; position:relative; z-index:1; }
.eyebrow.light { color:rgba(255,255,255,.72); }
.process-intro { position:sticky; top:60px; align-self:start; }
.process-intro h2 em { color:var(--lime); }
.process-intro>p:last-child { max-width:410px; margin:30px 0 0; color:rgba(255,255,255,.55); font-size:16px; line-height:1.65; }
.steps { display:grid; }
.steps article { display:grid; grid-template-columns:65px 1fr; gap:22px; padding:34px 0; border-top:1px solid rgba(255,255,255,.17); }
.steps article:last-child { border-bottom:1px solid rgba(255,255,255,.17); }
.steps>article>span { color:var(--lime); font-size:11px; font-weight:800; letter-spacing:.15em; }
.steps h3 { margin:0 0 10px; font-size:25px; letter-spacing:-.025em; }
.steps p { max-width:500px; margin:0; color:rgba(255,255,255,.52); font-size:14px; line-height:1.6; }
.section-heading.compact { grid-template-columns:1fr; }
.benefit-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; }
.benefit-grid article { min-height:285px; padding:32px; display:flex; flex-direction:column; justify-content:flex-end; border:1px solid rgba(23,24,27,.09); border-radius:29px; background:rgba(255,255,255,.38); position:relative; overflow:hidden; }
.benefit-grid article::after { content:""; position:absolute; width:220px; height:220px; right:-135px; top:-135px; border:1px solid rgba(52,87,241,.22); border-radius:50%; box-shadow:0 0 0 32px rgba(52,87,241,.035); }
.benefit-no { position:absolute; top:30px; left:32px; color:var(--blue); font-size:11px; font-weight:800; letter-spacing:.15em; }
.benefit-grid h3 { margin:0 0 12px; font-size:28px; letter-spacing:-.03em; }
.benefit-grid p { max-width:460px; margin:0; color:#606164; font-size:14px; line-height:1.6; }
.benefit-grid .benefit-accent { justify-content:center; color:white; background:var(--coral); border-color:transparent; }
.benefit-accent p { color:rgba(255,255,255,.75); }.benefit-accent::after { border-color:rgba(255,255,255,.2)!important; }
.mini-spark { position:absolute; top:28px; right:32px; color:var(--lime); font-size:35px; }
.cta-section { min-height:530px; margin-bottom:40px; padding:70px; display:flex; align-items:center; color:white; background:var(--blue); border-radius:42px; position:relative; overflow:hidden; }
.cta-glow { position:absolute; width:470px; height:470px; right:-120px; bottom:-230px; border:1px solid rgba(255,255,255,.25); border-radius:50%; box-shadow:0 0 0 70px rgba(255,255,255,.035),0 0 0 140px rgba(255,255,255,.025); }
.cta-content { max-width:720px; position:relative; z-index:2; }
.cta-content h2 { font-size:clamp(53px,6vw,82px); }.cta-content h2 em { color:var(--lime); }
.cta-content>p { max-width:580px; margin:28px 0; color:rgba(255,255,255,.72); font-size:16px; line-height:1.6; }
.button-light { background:white; color:var(--ink); }
.contact-actions { display:flex; flex-wrap:wrap; gap:11px; }
.button-whatsapp { color:white; border:1px solid rgba(255,255,255,.48); background:rgba(255,255,255,.1); backdrop-filter:blur(12px); }
.cta-content small { display:block; margin-top:16px; color:rgba(255,255,255,.56); font-size:11px; }
.cta-badge { position:absolute; right:70px; top:65px; width:150px; height:150px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--ink); background:var(--lime); border-radius:50%; transform:rotate(9deg); box-shadow:0 20px 35px rgba(0,0,0,.14); }
.cta-badge span { font-size:11px; font-weight:800; }.cta-badge strong { font-size:30px; margin:2px 0; }
footer { min-height:115px; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); font-size:12px; }
footer p { color:#717276; }.footer-links { display:flex; gap:22px; font-weight:700; }
@media (max-width:900px) {
  .process-wrap{grid-template-columns:1fr;gap:55px}.process-intro{position:static}.portfolio-image-wrap{height:250px}.featured-work .portfolio-image-wrap{height:65vw;max-height:560px}.portfolio-meta{align-items:flex-start;flex-direction:column}.cta-badge{right:40px;top:40px;width:120px;height:120px}.cta-section{padding:60px 45px}.cta-content{max-width:580px}
}
@media (max-width:580px) {
  .portfolio-section{padding:90px 0;scroll-margin-top:10px}.portfolio-categories{margin-top:-10px}.portfolio-categories button{flex:1 1 auto}.portfolio-grid{grid-template-columns:1fr}.portfolio-card.mobile-collapsed{display:none}.portfolio-card.featured-work{grid-column:auto}.portfolio-card{padding:8px;border-radius:25px}.portfolio-image-wrap,.featured-work .portfolio-image-wrap{height:68vw;min-height:255px;border-radius:18px}.portfolio-image-wrap.contain-art img{padding:14px}.portfolio-zoom{left:12px;bottom:12px;opacity:1;transform:rotate(-45deg)}.portfolio-index{top:12px;right:12px;width:42px;height:42px}.portfolio-meta{min-height:0;padding:22px 10px 12px;align-items:flex-start;flex-direction:column}.portfolio-meta h3,.featured-work .portfolio-meta h3{font-size:29px}.portfolio-note{line-height:1.5}.portfolio-lightbox{padding:12px}.lightbox-content{width:calc(100vw - 24px);max-height:calc(100vh - 24px);padding:7px;border-radius:20px}.lightbox-content>img{max-height:calc(100vh - 120px);border-radius:14px}.lightbox-caption{min-height:58px;padding:11px 7px 4px}.lightbox-caption>span{display:none}.lightbox-close{top:14px;right:14px;width:44px;height:44px;background:rgba(23,24,27,.8)}.process-section{padding:90px 0}.steps article{grid-template-columns:45px 1fr}.benefit-grid{grid-template-columns:1fr}.benefit-grid article{min-height:260px}.cta-section{min-height:650px;padding:55px 26px;align-items:flex-end;border-radius:30px}.cta-badge{width:110px;height:110px;right:24px;top:28px}.cta-badge strong{font-size:25px}.cta-content h2{font-size:49px}.contact-actions{flex-direction:column}.contact-actions .button{width:100%}footer{padding:35px 0;gap:28px;align-items:flex-start;flex-direction:column}footer p{margin:0}.footer-links{gap:18px;flex-wrap:wrap}
}