:root{
  --blue:#0068BE; --blue-dark:#004E8F; --blue-light:#3B8FDC;
  --grey:#78828C; --grey-dark:#4A525A;
  --ink:#10151C; --ink-2:#161D27;
  --paper:#F6F8FA; --white:#FFFFFF;
  --line:#E2E7EC; --text:#1C2430; --muted:#5B6672; --muted-2:#8A93A0;
  --radius:10px; --ease:cubic-bezier(.22,.7,.3,1);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{margin:0;font-family:'Inter',Arial,sans-serif;color:var(--text);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:'Manrope',Arial,sans-serif;font-weight:800;color:var(--ink);letter-spacing:-.02em;text-wrap:balance;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.container{max-width:1200px;margin:0 auto;padding:0 24px;}
section{padding:96px 0;}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:14px;}
.eyebrow::before{content:'';width:22px;height:2px;background:var(--blue);border-radius:2px;}
.section-title{font-size:clamp(26px,3.2vw,38px);line-height:1.15;}
.section-lead{color:var(--muted);font-size:17px;max-width:620px;margin-top:14px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:52px;padding:0 28px;border-radius:var(--radius);font-weight:700;font-size:15px;border:1.5px solid transparent;cursor:pointer;transition:all .2s var(--ease);white-space:nowrap;}
.btn-primary{background:var(--blue);color:#fff;}
.btn-primary:hover{background:var(--blue-dark);transform:translateY(-1px);}
.btn-outline{background:transparent;border-color:var(--line);color:var(--text);}
.btn-outline:hover{border-color:var(--blue);color:var(--blue);}
.btn-ghost-light{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:#fff;}
.btn-ghost-light:hover{background:rgba(255,255,255,.18);}

/* HEADER */
header#main{position:fixed;top:0;left:0;right:0;z-index:500;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .25s var(--ease), box-shadow .25s var(--ease);}
header#main.scrolled{border-bottom-color:var(--line);box-shadow:0 4px 20px rgba(16,21,28,.04);}
header#main .bar{display:flex;align-items:center;justify-content:space-between;padding:18px 0;}
header#main .logo img{height:30px;}
nav.primary{display:flex;align-items:center;gap:34px;}
nav.primary a{font-size:14.5px;font-weight:600;color:var(--text);}
nav.primary a:hover{color:var(--blue);}
.header-ctas{display:flex;align-items:center;gap:14px;}
.menu-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;}
.menu-toggle span{width:20px;height:2px;background:var(--text);border-radius:2px;}
#mobileMenu{display:none;position:fixed;inset:0;background:#fff;z-index:900;padding:24px;flex-direction:column;}
#mobileMenu.open{display:flex;}
#mobileMenu .top{display:flex;justify-content:space-between;align-items:center;}
#mobileMenu .top img{height:28px;}
#mobileMenu .close{background:none;border:none;font-size:28px;cursor:pointer;color:var(--text);}
#mobileMenu nav{display:flex;flex-direction:column;gap:24px;margin-top:48px;}
#mobileMenu nav a{font-family:'Manrope',sans-serif;font-size:22px;font-weight:700;color:var(--ink);}
#mobileMenu .btn{margin-top:36px;}
@media(max-width:980px){
  nav.primary, .header-ctas .btn-outline{display:none;}
  .menu-toggle{display:flex;}
}

/* HERO */
.hero{position:relative;padding:168px 0 96px;background:linear-gradient(180deg,#F6F8FA 0%, #fff 100%);overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
.hero-grid > *{min-width:0;}
.hero h1{font-size:clamp(32px,4.2vw,52px);line-height:1.1;}
.hero h1 em{font-style:normal;color:var(--blue);}
.hero .lead{font-size:18px;color:var(--muted);max-width:520px;margin-top:20px;}
.hero .cta-row{display:flex;align-items:center;gap:14px;margin-top:34px;flex-wrap:wrap;}
.hero .price-chip{display:inline-flex;align-items:baseline;gap:8px;margin-top:28px;padding:14px 20px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 10px 30px -14px rgba(16,21,28,.12);width:fit-content;}
.hero .price-chip .amount{font-family:'Manrope',sans-serif;font-weight:800;font-size:24px;color:var(--blue);}
.hero .price-chip .period{color:var(--muted);font-size:13.5px;}
.hero .price-chip .tag{font-size:12px;color:var(--muted-2);display:block;margin-top:2px;}
.hero-visual{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(16,21,28,.25);background:#fff;border:1px solid var(--line);}
.browser-bar{display:flex;align-items:center;gap:7px;padding:14px 16px;background:#F0F2F5;border-bottom:1px solid var(--line);}
.browser-bar span{width:9px;height:9px;border-radius:50%;background:#D7DCE2;}
.browser-bar .url{margin-left:10px;height:22px;flex:1;background:#fff;border-radius:6px;border:1px solid var(--line);display:flex;align-items:center;padding:0 12px;font-size:11px;color:var(--muted-2);font-family:'Inter',sans-serif;}
.hero-visual .shot-wrap{max-height:460px;overflow:hidden;}
.hero-visual img{width:100%;display:block;}
.hero-visual .caption{position:absolute;left:16px;bottom:16px;background:rgba(16,21,28,.85);color:#fff;font-size:12.5px;padding:8px 14px;border-radius:8px;backdrop-filter:blur(6px);}
.hero-trust{display:flex;align-items:center;gap:10px;margin-top:30px;font-size:13.5px;color:var(--muted);}
.hero-trust .stars{color:#F5A623;letter-spacing:2px;}

/* SERVICES */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:52px;}
.svc-grid > *{min-width:0;}
.svc-card{background:#fff;padding:36px 30px;transition:background .25s var(--ease);}
.svc-card:hover{background:var(--paper);}
.svc-card .ic{width:44px;height:44px;border-radius:10px;background:rgba(0,104,190,.08);color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.svc-card h3{font-size:18px;margin:0 0 10px;}
.svc-card p{font-size:14.5px;color:var(--muted);line-height:1.65;margin:0 0 16px;}
.svc-card a.more{font-size:13.5px;font-weight:700;color:var(--blue);}
@media(max-width:980px){.svc-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.svc-grid{grid-template-columns:1fr;}}

/* PORTFOLIO */
.bg-off{background:var(--paper);}
.port-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px;}
.port-grid > *{min-width:0;}
.port-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:transform .25s var(--ease), box-shadow .25s var(--ease);}
.port-card:hover{transform:translateY(-4px);box-shadow:0 24px 50px -24px rgba(16,21,28,.2);}
.port-card .shot{aspect-ratio:4/3;overflow:hidden;background:var(--ink);}
.port-card .shot img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.port-card .meta{padding:18px 20px;}
.port-card .meta h3{font-size:15.5px;margin:0 0 4px;}
.port-card .meta p{font-size:13px;color:var(--muted);margin:0;}
@media(max-width:900px){.port-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:600px){.port-grid{grid-template-columns:1fr;}}

/* TESTIMONIALS */
.rev-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:52px;}
.rev-grid > *{min-width:0;}
.rev-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px 24px;}
.rev-card .stars{color:#F5A623;font-size:14px;letter-spacing:2px;margin-bottom:14px;}
.rev-card p{font-size:14.5px;color:var(--text);line-height:1.6;margin:0 0 16px;min-height:72px;}
.rev-card .who{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);font-weight:600;}
.rev-card .who svg{flex:none;}
@media(max-width:980px){.rev-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:600px){.rev-grid{grid-template-columns:1fr;}}

/* FAQ */
.faq-list{max-width:800px;margin:52px auto 0;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{list-style:none;width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4px;font-family:'Manrope',sans-serif;font-weight:700;font-size:16px;color:var(--ink);cursor:pointer;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:4px;}
.faq-item .plus{flex:none;width:22px;height:22px;position:relative;}
.faq-item .plus::before,.faq-item .plus::after{content:'';position:absolute;background:var(--blue);border-radius:2px;transition:transform .25s var(--ease);}
.faq-item .plus::before{top:10px;left:2px;right:2px;height:2px;}
.faq-item .plus::after{left:10px;top:2px;bottom:2px;width:2px;}
.faq-item[open] .plus::after{transform:rotate(90deg);}
.faq-item .a{padding:0 4px 22px;color:var(--muted);font-size:14.5px;line-height:1.7;max-width:680px;}

/* CONTACT CTA */
.cta-band{background:linear-gradient(135deg,var(--ink) 0%, var(--ink-2) 100%);color:#fff;text-align:center;}
.cta-band h2{color:#fff;}
.cta-band p{color:rgba(255,255,255,.65);max-width:560px;margin:14px auto 0;}
.cta-band .cta-row{justify-content:center;margin-top:32px;}

/* FOOTER */
footer{background:var(--ink);color:rgba(255,255,255,.6);padding-top:72px;}
.f-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:56px;border-bottom:1px solid rgba(255,255,255,.1);}
.f-top > *{min-width:0;}
.f-logo img{height:30px;filter:brightness(0) invert(1);margin-bottom:16px;}
.f-top p{font-size:14px;line-height:1.7;max-width:280px;}
.f-col h4{color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 18px;}
.f-col a{display:block;font-size:14px;margin-bottom:12px;color:rgba(255,255,255,.65);}
.f-col a:hover{color:#fff;}
.f-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;font-size:13px;flex-wrap:wrap;gap:12px;}
.f-bottom a{color:rgba(255,255,255,.5);}
@media(max-width:900px){.f-top{grid-template-columns:1fr 1fr;gap:36px;}}
@media(max-width:560px){.f-top{grid-template-columns:1fr;}}

/* WHATSAPP FAB */
#waFloat{position:fixed;right:24px;bottom:24px;z-index:400;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#25D366;box-shadow:0 10px 28px -6px rgba(37,211,102,.5);transition:transform .25s ease;}
#waFloat:hover{transform:scale(1.07);}
@media(max-width:600px){#waFloat{right:16px;bottom:16px;width:52px;height:52px;}}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.reveal.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;transition:none!important;}}

@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-visual{order:-1;max-height:360px;}
}