:root {
  --blue: #111111;
  --blue-2: #2b2b2b;
  --blue-deep: #0d0d0d;
  --blue-dark: #050505;
  --cyan: #7a7a7a;
  --ink: #121722;
  --ink-2: #2e3645;
  --muted: #6e7787;
  --line: #e5e9f0;
  --soft: #f6f8fb;
  --soft-blue: #f1f2f4;
  --white: #fff;
  --green: #25d366;
  --shadow: 0 24px 70px rgba(12, 35, 74, .12);
  --shadow-sm: 0 14px 36px rgba(18, 32, 59, .08);
  --radius: 24px;
  --radius-sm: 16px;
  --container: 1180px;
  --font: "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: var(--font); -webkit-font-smoothing: antialiased; line-height: 1.55; }
body.nav-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
svg { display: block; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 9999; left: 16px; top: -60px; padding: 10px 14px; background: var(--ink); color: #fff; border-radius: 8px; }
.skip-link:focus { top: 16px; }

/* Header */
.site-header { position: fixed; z-index: 1000; inset: 0 0 auto; height: 82px; display: flex; align-items: center; background: rgba(255,255,255,.84); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border-bottom: 1px solid transparent; transition: .25s ease; }
.site-header.is-scrolled { height: 72px; border-color: rgba(13, 38, 78, .08); box-shadow: 0 10px 30px rgba(13, 33, 67, .06); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { width: 178px; flex: 0 0 auto; }
.brand img { width: 100%; height: auto; }
.main-nav { display: flex; align-items: center; gap: 28px; font-size: 14px; font-weight: 650; color: var(--ink-2); }
.main-nav > a:not(.btn) { position: relative; }
.main-nav > a:not(.btn)::after { content:""; position:absolute; left:0; right:100%; bottom:-8px; height:2px; background:var(--blue); transition:.2s ease; }
.main-nav > a:not(.btn):hover::after { right:0; }
.menu-toggle { display:none; width:44px; height:44px; border:0; background:transparent; padding:10px; }
.menu-toggle span { display:block; height:2px; background:var(--ink); margin:6px 0; border-radius:2px; transition:.2s ease; }
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* Buttons */
.btn { min-height: 48px; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding: 0 20px; border-radius: 13px; border:1px solid transparent; font-size:14px; font-weight:750; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn svg { width:18px; height:18px; fill:currentColor; }
.btn-small { min-height:42px; padding-inline:16px; border-radius:11px; }
.btn-lg { min-height:54px; padding-inline:22px; }
.btn-primary { color:#fff; background:linear-gradient(135deg,var(--blue),var(--blue-2)); box-shadow:0 12px 30px rgba(0,0,0,.18); }
.btn-primary:hover { box-shadow:0 16px 34px rgba(0,0,0,.24); }
.btn-ghost { background:#fff; border-color:var(--line); box-shadow:0 8px 26px rgba(14,28,51,.05); }
.btn-ghost:hover { border-color:#cbd4e2; box-shadow:0 12px 26px rgba(14,28,51,.08); }
.btn-whatsapp { background:var(--green); color:#fff; box-shadow:0 10px 25px rgba(37,211,102,.2); }
.btn-white { background:#fff; color:var(--blue-deep); }
.btn-outline-white { border-color:rgba(255,255,255,.45); color:#fff; }
.btn-outline-white:hover { background:rgba(255,255,255,.08); }

/* Typography */
.eyebrow { display:inline-block; margin-bottom:14px; color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.17em; text-transform:uppercase; }
.eyebrow-light { color:#b7b7bb; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:22px; font-size:clamp(42px,6vw,72px); line-height:1.02; letter-spacing:-.048em; font-weight:790; max-width:820px; }
h2 { margin-bottom:18px; font-size:clamp(34px,4.2vw,52px); line-height:1.06; letter-spacing:-.04em; font-weight:780; }
h3 { margin-bottom:10px; font-size:20px; letter-spacing:-.02em; }
p { color:var(--muted); }
.section { padding:110px 0; }
.section-soft { background:var(--soft); }
.section-heading { max-width:760px; margin-bottom:52px; }
.section-heading p { max-width:690px; font-size:18px; }
.section-heading.centered { text-align:center; margin-left:auto; margin-right:auto; }

/* Hero */
.hero { position:relative; min-height:800px; padding:155px 0 80px; overflow:hidden; background:linear-gradient(180deg,#fff 0%,#fbfdff 100%); }
.hero::before { content:""; position:absolute; width:620px; height:620px; border-radius:50%; right:-180px; top:100px; background:radial-gradient(circle,rgba(17,17,17,.10),rgba(17,17,17,0) 68%); pointer-events:none; }
.hero-grid-bg { position:absolute; inset:0; opacity:.45; background-image:linear-gradient(rgba(17,17,17,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(17,17,17,.04) 1px,transparent 1px); background-size:44px 44px; mask-image:linear-gradient(to bottom,black,transparent 78%); }
.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.12fr .88fr; gap:62px; align-items:center; }
.hero-copy { padding-top:16px; }
.hero-copy .eyebrow { margin-bottom:8px; }
.slogan { color:var(--blue); font-weight:700; font-size:18px; margin-bottom:20px; }
.hero-lead { font-size:19px; max-width:710px; line-height:1.7; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:32px; }
.hero-meta { display:flex; gap:22px; flex-wrap:wrap; margin-top:28px; color:var(--ink-2); font-size:14px; font-weight:650; }
.hero-meta span { display:flex; align-items:center; gap:8px; }
.hero-meta i { width:7px; height:7px; border-radius:50%; background:var(--blue); box-shadow:0 0 0 5px rgba(17,17,17,.08); }
.hero-visual { position:relative; display:flex; justify-content:center; }
.portrait-card { position:relative; width:100%; max-width:520px; min-height:560px; display:flex; align-items:flex-end; justify-content:center; padding:36px 24px 24px; border-radius:34px; background:linear-gradient(145deg,#f3f3f3,#e5e5e5); overflow:hidden; box-shadow:var(--shadow); border:1px solid rgba(17,17,17,.10); }
.portrait-card img { position:relative; z-index:2; width:min(100%, clamp(300px, 32vw, 390px)); height:auto; max-width:100%; max-height:none; object-fit:contain; object-position:center bottom; left:auto; bottom:auto; transform:none; margin:0; align-self:flex-end; }
.portrait-grid { position:absolute; inset:0; opacity:.5; background-image:linear-gradient(rgba(17,17,17,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(17,17,17,.06) 1px,transparent 1px); background-size:32px 32px; }
.portrait-orbit { position:absolute; border:1px solid rgba(17,17,17,.14); border-radius:50%; }
.orbit-one { width:420px;height:420px;right:-120px;top:80px; }
.orbit-two { width:280px;height:280px;left:-100px;bottom:80px; }
.floating-badge { position:absolute; z-index:5; display:flex; align-items:center; gap:9px; background:rgba(255,255,255,.92); border:1px solid rgba(17,17,17,.10); backdrop-filter:blur(10px); padding:11px 14px; border-radius:13px; box-shadow:0 12px 32px rgba(14,38,80,.12); font-size:12px; font-weight:750; }
.floating-badge svg { width:16px;height:16px;fill:var(--blue); }
.badge-top { left:18px; top:24px; }
.badge-bottom { right:18px; bottom:22px; }
.pulse { width:8px;height:8px;border-radius:50%;background:#18bd67;box-shadow:0 0 0 5px rgba(24,189,103,.12); }

/* Services */
.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.service-card { padding:26px; min-height:260px; border:1px solid var(--line); border-radius:20px; background:#fff; transition:.25s ease; }
.service-card:hover { transform:translateY(-5px); border-color:#cdd9eb; box-shadow:var(--shadow-sm); }
.icon-box { width:48px;height:48px; display:grid;place-items:center; border-radius:14px; background:var(--soft-blue); color:var(--blue); margin-bottom:24px; }
.icon-box svg { width:23px;height:23px;fill:currentColor; }
.service-card h3 { font-size:18px; }
.service-card p { font-size:14px; line-height:1.65; margin-bottom:0; }
.service-footer { margin-top:26px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 26px; border-radius:17px; background:var(--soft); border:1px solid #e9edf3; }
.service-footer div { display:flex; flex-direction:column; gap:3px; }
.service-footer strong { font-size:15px; }
.service-footer span { color:var(--muted); font-size:14px; }
.service-footer a { color:var(--blue); font-size:14px; font-weight:750; white-space:nowrap; }

/* Issues */
.split-intro { display:grid; grid-template-columns:.85fr 1.15fr; gap:70px; align-items:start; }
.split-intro .section-heading { margin-bottom:0; }
.issue-list { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.issue-list span { position:relative; padding:18px 18px 18px 44px; background:#fff; border:1px solid var(--line); border-radius:14px; color:var(--ink-2); font-weight:650; font-size:14px; }
.issue-list span::before { content:"✓"; position:absolute; left:17px; top:17px; width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:var(--soft-blue);color:var(--blue);font-size:11px;font-weight:900; }

/* Trust */
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.trust-card { position:relative; padding:30px 25px; border-top:2px solid #191919; background:linear-gradient(180deg,#fff,#fbfcff); border-radius:0 0 18px 18px; box-shadow:0 10px 30px rgba(28,45,80,.05); }
.trust-number { color:#b8b8bd; font-size:12px; font-weight:800; letter-spacing:.15em; }
.trust-card h3 { margin-top:24px; }
.trust-card p { font-size:14px; margin-bottom:0; }
.privacy-note { margin-top:34px; display:flex; align-items:center; gap:16px; padding:20px 22px; background:#f4f4f5; border:1px solid #e5e5e7; border-radius:15px; }
.privacy-note svg { flex:0 0 auto; width:28px;height:28px; fill:var(--blue); }
.privacy-note div { display:flex; flex-direction:column; gap:2px; }
.privacy-note span { color:var(--muted); font-size:14px; }

/* Pricing */
.section-darkblue { position:relative; overflow:hidden; background:linear-gradient(145deg,#050505,#131313 62%,#232323); color:#fff; }
.section-darkblue::before { content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:46px 46px; }
.section-darkblue .container { position:relative; z-index:1; }
.section-heading.light h2 { color:#fff; }
.section-heading.light p { color:#b8c8df; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
.price-card { position:relative; display:flex; flex-direction:column; padding:32px; border-radius:22px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(10px); }
.price-card.featured { background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.3); transform:translateY(-10px); box-shadow:0 30px 60px rgba(0,0,0,.16); }
.popular { position:absolute; top:16px; right:16px; padding:6px 9px; border-radius:999px; background:#fff; color:var(--blue-deep); font-size:10px; text-transform:uppercase; letter-spacing:.1em; font-weight:850; }
.price-tag { color:#c9c9cb; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; margin-bottom:18px; }
.price { display:flex; align-items:flex-end; gap:8px; margin-bottom:18px; }
.price span { font-size:37px; line-height:1; font-weight:800; letter-spacing:-.04em; }
.price small { color:#c3c3c6; padding-bottom:3px; }
.price-desc { color:#d3d3d6; min-height:74px; }
.price-card ul { list-style:none; padding:0; margin:5px 0 28px; display:grid; gap:11px; }
.price-card li { position:relative; padding-left:23px; color:#eef5ff; font-size:14px; }
.price-card li::before { content:"✓"; position:absolute; left:0; color:#d6d6d9; font-weight:800; }
.price-card .btn { margin-top:auto; }
.fineprint { display:block; margin-top:12px; color:#b7b7bb; text-align:center; }
.pricing-note { margin:30px auto 0; color:#c1c1c5; text-align:center; font-size:13px; }

/* Steps */
.steps { display:grid; grid-template-columns:1fr 80px 1fr 80px 1fr; align-items:center; }
.step { text-align:center; padding:20px; }
.step > span { width:52px;height:52px;display:grid;place-items:center;margin:0 auto 20px;border-radius:16px;background:var(--soft-blue);color:var(--blue);font-size:18px;font-weight:850; }
.step p { font-size:14px; margin-bottom:0; }
.step-line { height:1px; background:linear-gradient(90deg,#d7deea,#aabbd5,#d7deea); }
.pickup-note { margin:38px auto 0; max-width:760px; padding:18px 22px; display:flex; gap:8px 12px; justify-content:center; flex-wrap:wrap; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 10px 30px rgba(20,35,60,.04); font-size:14px; }
.pickup-note span { color:var(--muted); }

/* Business */
.business-section { padding-top:30px; }
.business-panel { position:relative; overflow:hidden; display:grid; grid-template-columns:1.25fr .75fr; gap:40px; padding:56px; background:linear-gradient(145deg,#fafafa,#f0f0f0); border:1px solid #e3e3e3; border-radius:30px; }
.business-panel::after { content:""; position:absolute; width:360px;height:360px;border:1px solid rgba(17,17,17,.10);border-radius:50%;right:-180px;top:-140px; }
.business-copy { position:relative; z-index:1; }
.business-copy > p { font-size:17px; max-width:710px; }
.business-tags { display:flex; flex-wrap:wrap; gap:9px; margin:26px 0 30px; }
.business-tags span { padding:8px 11px; border-radius:999px; background:#fff; border:1px solid #e4e4e4; font-size:12px; font-weight:700; color:#42516a; }
.business-aside { display:grid; gap:15px; align-content:center; position:relative; z-index:1; }
.aside-card { padding:24px; border-radius:18px; background:rgba(255,255,255,.86); border:1px solid #e4e4e4; box-shadow:0 12px 28px rgba(0,0,0,.05); }
.aside-card > span { color:var(--blue); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
.aside-card strong { display:block; margin:8px 0 4px; font-size:20px; }
.aside-card p { margin:0; font-size:13px; }

/* Webdesign */
.webdesign-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:70px; align-items:center; }
.browser-mockup { border-radius:22px; overflow:hidden; border:1px solid #dfe5ef; background:#fff; box-shadow:var(--shadow); transform:perspective(1100px) rotateY(5deg) rotateX(2deg); }
.browser-bar { height:44px;display:flex;align-items:center;gap:7px;padding:0 13px;background:#eff3f8;border-bottom:1px solid #dfe5ef; }
.browser-bar span { width:9px;height:9px;border-radius:50%;background:#b7b7bb; }
.browser-bar div { margin-left:11px;flex:1;max-width:170px;height:22px;border-radius:7px;background:#fff;display:grid;place-items:center;color:#8f8f94;font-size:9px; }
.mock-content { padding:20px; }
.mock-nav { display:flex;align-items:center;gap:8px;margin-bottom:30px; }
.mock-nav b { width:70px;height:13px;background:#111111;border-radius:3px;margin-right:auto; }
.mock-nav i { width:32px;height:5px;background:#d5d5d7;border-radius:3px; }
.mock-hero { display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:center;padding:24px 6px 34px; }
.mock-hero em { display:block;width:48px;height:6px;background:#202020;border-radius:3px;margin-bottom:13px; }
.mock-hero strong { display:block;width:90%;height:12px;background:#1d1d1f;border-radius:3px;margin-bottom:7px; }
.mock-hero strong.short { width:65%; }
.mock-hero button { width:60px;height:20px;border:0;border-radius:5px;background:#202020;margin-top:12px; }
.mock-hero aside { height:140px;border-radius:14px;background:linear-gradient(135deg,#d8d8d8,#a8a8a8); }
.mock-cards { display:grid;grid-template-columns:repeat(3,1fr);gap:9px; }
.mock-cards span { height:85px;border-radius:10px;background:#f1f4f8;border:1px solid #e1e5ec; }
.webdesign-copy > p { font-size:17px; }
.check-list { list-style:none; padding:0; margin:28px 0; display:grid; gap:11px; }
.check-list li { position:relative; padding-left:28px; color:var(--ink-2); font-weight:600; }
.check-list li::before { content:"✓";position:absolute;left:0;top:1px;width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:var(--soft-blue);color:var(--blue);font-size:11px;font-weight:900; }
.offer-line { display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:8px; }
.offer-line div { display:flex;flex-direction:column; }
.offer-line small { color:var(--muted); }
.offer-line strong { font-size:15px; }

/* About */
.about-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:78px; align-items:center; }
.about-photo { position:relative; display:flex; align-items:flex-end; justify-content:center; padding:24px 20px 20px; min-height:560px; border-radius:28px; overflow:hidden; background:var(--soft); box-shadow:var(--shadow); }
.about-photo img { width:min(100%, clamp(320px, 34vw, 440px)); height:auto; max-width:100%; max-height:none; aspect-ratio:auto; object-fit:contain; object-position:center bottom; }
.experience-badge { position:absolute; right:18px; bottom:18px; display:flex;align-items:center;gap:10px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.94);box-shadow:0 14px 30px rgba(15,37,75,.16); }
.experience-badge strong { font-size:28px;color:var(--blue);line-height:1; }
.experience-badge span { max-width:86px;font-size:11px;font-weight:750;line-height:1.2;color:var(--ink-2); }
.about-copy h2 { margin-bottom:3px; }
.role { color:var(--blue);font-weight:750;margin-bottom:25px; }
.about-lead { font-size:20px;color:var(--ink-2);font-weight:650;line-height:1.55; }
.about-copy > p:not(.role):not(.about-lead) { font-size:16px; line-height:1.75; }
.about-points { display:flex;gap:18px;flex-wrap:wrap;margin-top:28px; }
.about-points span { display:flex;align-items:center;gap:8px;font-size:13px;font-weight:750;color:#465169; }
.about-points b { width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 4px rgba(17,17,17,.08); }

/* Reviews */
.reviews-section { padding:72px 0; }
.review-box { display:flex;align-items:center;justify-content:space-between;gap:30px;padding:38px 42px;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 12px 35px rgba(23,41,73,.05); }
.review-box .eyebrow { margin-bottom:8px; }
.review-box h2 { font-size:30px;margin-bottom:4px; }
.review-box p { margin-bottom:0;font-size:13px; }
.stars { color:#f7b500;letter-spacing:4px;font-size:20px;margin-bottom:5px; }

/* FAQ */
.faq-grid { display:grid;grid-template-columns:.78fr 1.22fr;gap:76px;align-items:start; }
.faq-grid .section-heading { position:sticky;top:115px;margin-bottom:0; }
.text-link { color:var(--blue);font-weight:750;font-size:14px; }
.faq-list { display:grid;gap:10px; }
details { border:1px solid var(--line);border-radius:15px;background:#fff;overflow:hidden; }
summary { position:relative; list-style:none; padding:20px 52px 20px 20px;font-weight:720;cursor:pointer; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:var(--soft);color:var(--blue);font-size:20px;font-weight:400;transition:.2s ease; }
details[open] summary::after { transform:translateY(-50%) rotate(45deg); }
details p { padding:0 20px 20px;margin:0;font-size:14px;line-height:1.7; }

/* Contact */
.contact-section { padding:110px 0; background:linear-gradient(145deg,#050505,#121212 65%,#1f1f1f);color:#fff; }
.contact-grid { display:grid;grid-template-columns:.82fr 1.18fr;gap:72px;align-items:start; }
.contact-copy { padding-top:14px; }
.contact-copy h2 { color:#fff; }
.contact-copy > p { color:#c5c5c8;font-size:17px; }
.response-time { display:inline-flex;padding:9px 12px;border-radius:10px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10);font-size:13px!important; }
.contact-methods { display:grid;gap:12px;margin-top:32px; }
.contact-methods > a { display:flex;align-items:center;gap:14px;padding:15px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);transition:.2s ease; }
.contact-methods > a:hover { background:rgba(255,255,255,.09);transform:translateX(3px); }
.contact-icon { flex:0 0 auto;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.1); }
.contact-icon svg { width:20px;height:20px;fill:#fff; }
.contact-methods div:last-child { display:flex;flex-direction:column; }
.contact-methods small { color:#b8b8bc;font-size:10px;text-transform:uppercase;letter-spacing:.13em;font-weight:800; }
.contact-methods strong { font-size:15px; }
.contact-methods span { color:#c0c0c4;font-size:11px; }
.form-card { padding:34px;background:#fff;border-radius:24px;color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.22); }
.form-row { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.field { margin-bottom:15px; }
.field label { display:flex;gap:6px;align-items:baseline;margin-bottom:7px;font-size:12px;font-weight:750;color:#384153; }
.field label span, .checkbox-row b { color:var(--blue); }
.field label small { font-size:10px;color:#96a0b0;font-weight:600; }
.field input,.field textarea { width:100%;border:1px solid #dce2eb;border-radius:11px;background:#fbfcfe;color:var(--ink);outline:none;padding:12px 13px;font-size:14px;transition:.2s ease; }
.field input { height:46px; }
.field textarea { resize:vertical;min-height:132px; }
.field input:focus,.field textarea:focus { border-color:#7c7c82;box-shadow:0 0 0 4px rgba(17,17,17,.08);background:#fff; }
.honeypot { position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important; }
.upload-box { position:relative;border:1px dashed #cbd5e2;border-radius:12px;background:#f9fbfd;transition:.2s ease; }
.upload-box:hover { border-color:#9db5df;background:#f5f9ff; }
.upload-box input { position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer; }
.upload-box > div { padding:17px;display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;align-items:center;column-gap:10px;pointer-events:none; }
.upload-box svg { grid-row:1/3;width:27px;height:27px;fill:var(--blue); }
.upload-box strong { font-size:13px; }
.upload-box span { font-size:10px;color:var(--muted); }
.file-list { display:flex;flex-wrap:wrap;gap:6px;margin-top:8px; }
.file-list > span { padding:5px 7px;border-radius:7px;background:var(--soft);font-size:10px;color:#536078; }
.file-list small { color:#8c96a6; }
.file-error { color:#b42318!important;background:#fff1f0!important; }
.checkbox-row { display:flex;gap:10px;align-items:flex-start;margin:8px 0 18px;font-size:11px;line-height:1.5;color:#657084; }
.checkbox-row input { margin-top:2px;accent-color:var(--blue); }
.checkbox-row a { color:var(--blue);text-decoration:underline; }
.form-status { display:none;margin:0 0 14px;padding:10px 12px;border-radius:9px;font-size:12px; }
.form-status.success,.form-status.error { display:block; }
.form-status.success { background:#ebf9f0;color:#14733c; }
.form-status.error { background:#fff0ef;color:#a6332b; }
.btn-submit { width:100%; }
.form-privacy { margin:10px 0 0;text-align:center;font-size:10px;color:#9aa3b0; }
.form-success { margin-bottom:22px;padding:16px;border-radius:14px;background:#effaf3;border:1px solid #d4f0df; }
.success-icon { width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#1f9d58;color:#fff;font-weight:900;margin-bottom:10px; }
.form-success h3 { margin-bottom:4px;font-size:17px; }
.form-success p { margin:0;font-size:12px; }

/* Footer */
.site-footer { padding:65px 0 24px;background:#060606;color:#fff; }
.footer-grid { display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:48px;padding-bottom:40px; }
.footer-brand img { width:160px;filter:invert(1);margin-bottom:16px; }
.footer-brand strong,.footer-brand span { display:block; }
.footer-brand strong { font-size:14px; }
.footer-brand span { color:#b1b1b6;font-size:12px; }
.footer-brand p { margin:12px 0 0;color:#9a9aa0;font-size:12px; }
.footer-col { display:flex;flex-direction:column;gap:9px; }
.footer-col h3 { margin:0 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#b1b1b6; }
.footer-col a,.footer-col span { color:#d1d1d5;font-size:12px; }
.footer-col a:hover { color:#fff; }
.footer-bottom { display:flex;justify-content:space-between;gap:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);color:#9a9aa0;font-size:11px; }
.floating-whatsapp { position:fixed;z-index:900;right:22px;bottom:22px;display:flex;align-items:center;gap:8px;padding:13px 15px;border-radius:999px;background:var(--green);color:#fff;font-size:12px;font-weight:800;box-shadow:0 16px 36px rgba(22,126,62,.28);transition:.2s ease; }
.floating-whatsapp:hover { transform:translateY(-3px);box-shadow:0 20px 42px rgba(22,126,62,.34); }
.floating-whatsapp svg { width:21px;height:21px;fill:#fff; }

/* Legal placeholders */
.legal-page { min-height:100vh;background:var(--soft);padding:130px 0 70px; }
.legal-card { max-width:860px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:22px;padding:42px;box-shadow:var(--shadow-sm); }
.legal-card h1 { font-size:42px; }
.legal-notice { padding:14px 16px;border-radius:12px;background:#fff6df;border:1px solid #f0d991;color:#715816;font-size:14px; }
.legal-card .back { display:inline-flex;margin-top:24px;color:var(--blue);font-weight:750; }

/* Reveal */
.reveal { opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.65,.3,1); }
.reveal.is-visible { opacity:1;transform:none; }
.reveal-delay-1 { transition-delay:.08s; }
.reveal-delay-2 { transition-delay:.16s; }
@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.btn,.service-card,.contact-methods>a,.floating-whatsapp{transition:none} }

/* Responsive */
@media (max-width: 1040px) {
  .main-nav { gap:18px; }
  .service-grid { grid-template-columns:repeat(2,1fr); }
  .trust-grid { grid-template-columns:repeat(2,1fr); }
  .hero-grid { gap:38px; }
  .portrait-card { min-height:520px; }
  .business-panel { padding:42px; }
}
@media (max-width: 900px) {
  .site-header,.site-header.is-scrolled { height:70px; }
  .brand { width:145px; }
  .menu-toggle { display:block;position:relative;z-index:1002; }
  .main-nav { position:fixed;z-index:1001;top:0;right:-100%;width:min(88vw,420px);height:100vh;padding:100px 30px 30px;background:#fff;box-shadow:-20px 0 50px rgba(20,34,58,.14);display:flex;flex-direction:column;align-items:stretch;gap:0;transition:right .28s ease; }
  .main-nav.is-open { right:0; }
  .main-nav > a { padding:14px 4px;border-bottom:1px solid var(--line); }
  .main-nav .btn { margin-top:18px;border:0; }
  .hero { min-height:auto;padding-top:125px; }
  .hero-grid { grid-template-columns:1fr; }
  .hero-copy { text-align:center; }
  .hero-copy h1,.hero-lead { margin-left:auto;margin-right:auto; }
  .hero-actions,.hero-meta { justify-content:center; }
  .hero-visual { max-width:560px;width:100%;margin:auto; }
  .portrait-card { min-height:0; }
  .portrait-card img { width:min(100%, 390px); max-height:none; }
  .split-intro,.webdesign-grid,.about-grid,.faq-grid,.contact-grid { grid-template-columns:1fr;gap:42px; }
  .faq-grid .section-heading { position:static; }
  .business-panel { grid-template-columns:1fr; }
  .business-aside { grid-template-columns:1fr 1fr; }
  .pricing-grid { grid-template-columns:1fr;max-width:640px;margin:auto; }
  .price-card.featured { transform:none; }
  .steps { grid-template-columns:1fr; }
  .step-line { width:1px;height:28px;margin:auto; }
  .footer-grid { grid-template-columns:1.2fr 1fr 1fr; }
  .footer-col:last-child { grid-column:2/4; }
}
@media (max-width: 640px) {
  .container { width:min(calc(100% - 28px),var(--container)); }
  .section { padding:78px 0; }
  .section-heading { margin-bottom:36px; }
  .section-heading p,.hero-lead { font-size:16px; }
  h1 { font-size:44px; }
  h2 { font-size:34px; }
  .hero { padding:112px 0 55px; }
  .hero-actions { display:grid;grid-template-columns:1fr; }
  .hero-actions .btn { width:100%; }
  .hero-meta { gap:10px 18px; }
  .portrait-card { min-height:0;border-radius:24px;padding:20px 14px 14px; }
  .portrait-card img { width:min(100%, 290px); max-height:none; }
  .about-photo { padding:18px 14px 14px; min-height:auto; }
  .about-photo img { width:min(100%, 300px); max-height:none; }
  .floating-badge { font-size:10px;padding:9px 10px; }
  .badge-top { left:12px;top:12px; }
  .badge-bottom { right:12px;bottom:12px; }
  .service-grid,.trust-grid,.issue-list { grid-template-columns:1fr; }
  .service-card { min-height:auto; }
  .service-footer { align-items:flex-start;flex-direction:column; }
  .business-panel { padding:30px 22px;border-radius:22px; }
  .business-aside { grid-template-columns:1fr; }
  .browser-mockup { transform:none; }
  .offer-line { align-items:flex-start;flex-direction:column; }
  .about-grid { gap:30px; }
  .about-photo { max-width:430px;margin:auto; min-height:auto; }
  .about-photo img { width:min(100%, 300px); }
  .review-box { align-items:flex-start;flex-direction:column;padding:28px 24px; }
  .form-card { padding:24px 18px; }
  .form-row { grid-template-columns:1fr;gap:0; }
  .contact-section { padding:78px 0; }
  .footer-grid { grid-template-columns:1fr 1fr;gap:32px 22px; }
  .footer-brand { grid-column:1/3; }
  .footer-col:last-child { grid-column:auto; }
  .footer-bottom { flex-direction:column; }
  .floating-whatsapp { width:54px;height:54px;padding:0;justify-content:center;right:14px;bottom:14px; }
  .floating-whatsapp span { display:none; }
  .floating-whatsapp svg { width:26px;height:26px; }
}

/* Legal pages – full version */
.legal-header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid #ededee; }
.legal-header-inner { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.legal-brand { width:165px; flex:0 0 auto; }
.legal-brand img { width:100%; height:auto; }
.legal-home-btn { min-height:42px; }
.legal-page { min-height:calc(100vh - 78px); background:linear-gradient(180deg,#f7f7f8 0%,#efeff0 100%); padding:70px 0 90px; }
.legal-card { max-width:920px; margin:auto; background:#fff; border:1px solid #e2e2e4; border-radius:26px; padding:clamp(30px,5vw,64px); box-shadow:0 24px 70px rgba(0,0,0,.07); }
.legal-card-wide { max-width:980px; }
.legal-content h1 { max-width:none; margin-bottom:14px; font-size:clamp(42px,6vw,64px); }
.legal-intro { max-width:760px; font-size:18px; line-height:1.7; margin-bottom:44px; }
.legal-section { padding:30px 0; border-top:1px solid #ebebed; }
.legal-section:first-of-type { border-top:0; padding-top:8px; }
.legal-section h2 { font-size:24px; letter-spacing:-.025em; margin-bottom:16px; }
.legal-section p { margin-bottom:12px; line-height:1.75; }
.legal-section p:last-child { margin-bottom:0; }
.legal-section address { font-style:normal; line-height:1.75; color:var(--ink-2); }
.legal-section a { color:#111; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.legal-section a:hover { color:#555; }
.legal-muted { margin-top:14px; font-size:13px; color:#86868b; }
.legal-actions { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-top:32px; margin-top:12px; border-top:1px solid #ebebed; }
.legal-version { margin:26px 0 0; font-size:12px; color:#99999e; }
.legal-footer { background:#060606; color:#fff; padding:24px 0; }
.legal-footer-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; color:#9a9aa0; font-size:12px; }
.legal-footer-inner div { display:flex; gap:18px; }
.legal-footer a { color:#d1d1d5; }
.legal-footer a:hover { color:#fff; }
@media (max-width:640px) {
  .legal-header-inner { min-height:68px; }
  .legal-brand { width:135px; }
  .legal-home-btn { min-height:38px; padding-inline:13px; font-size:12px; }
  .legal-page { padding:36px 0 60px; }
  .legal-card { border-radius:20px; padding:28px 20px; }
  .legal-intro { font-size:16px; margin-bottom:30px; }
  .legal-section { padding:24px 0; }
  .legal-section h2 { font-size:21px; }
  .legal-actions { align-items:flex-start; flex-direction:column; }
  .legal-actions .btn { width:100%; }
  .legal-footer-inner { align-items:flex-start; flex-direction:column; }
}