:root { --aqua:#00d3c7; --teal:#028d86; --ink:#1f2b33; --paper:#ffffff; --mist:#eef4f3; --line:rgba(31,43,51,.15); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; font-size:16px; line-height:1.55; }
a { color:inherit; }
.site-header { background:rgba(255,255,255,.60); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50; backdrop-filter:blur(5px); }
.navbar { min-height:76px; }
.navbar-brand img { display:block; height:34px; width:auto; }
.navbar-toggler { border:0; box-shadow:none!important; padding:.4rem; }
.navbar-toggler-icon { background-image:none; border-bottom:2px solid var(--ink); border-top:2px solid var(--ink); height:14px; position:relative; width:22px; }
.navbar-toggler-icon::after { background:var(--ink); content:""; height:2px; left:0; position:absolute; top:5px; width:100%; }
.nav-link { color:var(--ink)!important; font-size:.86rem; font-weight:700; padding:.55rem .9rem!important; }
.nav-link:hover { color:var(--teal)!important; }
.btn { border-radius:999px; font-size:.86rem; font-weight:700; padding:.78rem 1.2rem; }
.btn-primary { background:var(--ink); border-color:var(--ink); color:#fff; }
.btn-primary:hover,.btn-primary:focus { background:var(--teal); border-color:var(--teal); color:#fff; }
.hero { align-items:center; background-color:var(--ink); background-image:linear-gradient(180deg,rgba(8,20,27,.47) 0%,rgba(8,20,27,.60) 46%,rgba(8,20,27,.82) 100%),var(--hero-image); background-position:center; background-size:cover; background-attachment:fixed; display:flex; min-height:calc(100svh - 77px); padding:4rem 0; position:relative; }
.hero .container { align-items:center; display:flex; position:relative; z-index:1; }
.hero-copy { color:#fff; margin:0 auto; max-width:900px; text-align:center; }
.eyebrow { color:var(--aqua); font-size:.72rem; font-weight:800; letter-spacing:.14em; margin-bottom:1.4rem; text-transform:uppercase; }
.hero h1 { font-size:clamp(3.1rem,6.7vw,6.4rem); font-weight:700; letter-spacing:-.065em; line-height:.95; margin:0 auto; max-width:14ch; }
.hero .lead { color:rgba(255,255,255,.9); font-size:clamp(1.05rem,1.8vw,1.28rem); line-height:1.55; margin:2rem auto 2.25rem; max-width:41rem; }
.hero .btn-primary { background:var(--aqua); border-color:var(--aqua); color:var(--ink); }
.hero .btn-primary:hover,.hero .btn-primary:focus { background:#fff; border-color:#fff; color:var(--ink); }
.section { padding:clamp(4.5rem,9vw,8rem) 0; }
.section-solutions { padding-top:clamp(3rem,5vw,4.75rem); }
.section-examples { padding-top:clamp(3rem,5vw,4.75rem); }
.section-proof { padding-top:clamp(3.5rem,6vw,5.5rem); }
.section-proof .section-head { margin-bottom:2.4rem; }
.section-faq { padding-top:clamp(3.5rem,6vw,5.5rem); }
.section-faq .section-head { margin-bottom:2.4rem; }
.section-contact { padding-top:clamp(3.5rem,6vw,5.5rem); }
.section-mist { background:var(--mist); }
.section-resolved { background-color:var(--ink); background-image:linear-gradient(180deg,rgba(8,20,27,.75),rgba(8,20,27,.82)),var(--resolved-image); background-attachment:fixed; background-position:center; background-size:cover; padding-top:clamp(3.5rem,6vw,5.5rem); position:relative; }
.section-resolved .section-head { margin-bottom:2.4rem; }
.section-resolved .section-kicker { color:var(--aqua); }
.section-resolved h2 { color:#fff; }
.section-dark { background:var(--ink); color:#fff; }
.section-head { align-items:end; display:flex; gap:2rem; justify-content:space-between; margin-bottom:3.5rem; }
.challenge-intro,.examples-intro { align-items:end; display:grid; gap:3rem; grid-template-columns:1fr minmax(260px, .72fr); margin-bottom:3.5rem; }
.section-media { border-radius:3px; margin:0; overflow:hidden; }
.section-media img { display:block; height:260px; object-fit:cover; width:100%; }
.examples-media { transform:rotate(-2deg); }
.section-kicker { color:var(--teal); font-size:.75rem; font-weight:800; letter-spacing:.12em; margin-bottom:.8rem; text-transform:uppercase; }
.section-dark .section-kicker { color:var(--aqua); }
.section h2 { font-size:clamp(2.1rem,4.5vw,4.5rem); font-weight:700; letter-spacing:-.055em; line-height:.98; margin:0; max-width:13ch; }
.section-intro { color:#607077; margin:0; max-width:28rem; }
.solution-list { border-top:1px solid var(--line); }
.solution-row { align-items:center; border-bottom:1px solid var(--line); display:grid; gap:1.5rem; grid-template-columns:70px minmax(180px,1.1fr) 1.5fr; padding:1.55rem 0; }
.solution-row i { align-items:center; background:var(--ink); border-radius:50%; color:var(--teal); display:flex; font-size:1.2rem; height:48px; justify-content:center; width:48px; }
.solution-row h3,.case-card h3,.proof-card h3 { font-size:1.2rem; font-weight:700; letter-spacing:-.025em; margin:0; }
.solution-row p,.case-card p,.proof-card p { color:#607077; margin:0; }
.pain-grid { display:grid; gap:1rem; grid-template-columns:repeat(4,1fr); }
.pain-card { background:rgba(255,255,255,.97); border-radius:18px; min-height:250px; padding:1.7rem; }
.pain-card i { color:var(--teal); font-size:1.55rem; }
.pain-card h3 { font-size:1.13rem; font-weight:700; letter-spacing:-.025em; margin:1.35rem 0 .7rem; }
.pain-card p { color:#607077; font-size:.92rem; margin:0; }
.process-grid { display:grid; grid-template-columns:repeat(5,1fr); }
.process-step { border-left:1px solid rgba(255,255,255,.27); min-height:220px; padding:0 1.25rem; }
.process-step:first-child { border:0; padding-left:0; }
.process-step span { color:var(--aqua); display:block; font-size:.74rem; font-weight:800; letter-spacing:.1em; margin-bottom:3rem; text-transform:uppercase; }
.process-step p { color:rgba(255,255,255,.72); font-size:.93rem; margin:0; }
.cases { display:grid; gap:1.25rem; grid-template-columns:repeat(2,1fr); }
.case-card { border:1px solid var(--line); border-radius:18px; padding:2rem; }
.case-card:first-child { background:var(--ink); border-color:var(--ink); color:#fff; }
.case-card:first-child p { color:rgba(255,255,255,.7); }
.case-index { color:var(--teal); font-size:.76rem; font-weight:800; letter-spacing:.1em; margin-bottom:3.5rem; }
.proof-grid { display:grid; gap:1rem; grid-template-columns:repeat(3,1fr); }
.proof-card { background:rgba(255,255,255,.07); border-radius:18px; min-height:250px; padding:1.8rem; }
.proof-card i { color:var(--aqua); font-size:1.55rem; }
.proof-card h3 { margin:1.35rem 0 .7rem; }
.proof-card p { color:rgba(255,255,255,.68); }
.faq { border-top:1px solid var(--line); }
.accordion-item { border:0; border-bottom:1px solid var(--line); border-radius:0!important; }
.accordion-button { background:transparent!important; box-shadow:none!important; color:var(--ink)!important; font-size:clamp(1rem,2vw,1.22rem); font-weight:700; padding:1.35rem 0; }
.accordion-button::after { background-size:1rem; }
.accordion-body { color:#607077; max-width:52rem; padding:0 2.5rem 1.5rem 0; }
.cta-panel { background:var(--ink); border-radius:24px; color:var(--aqua); padding:clamp(2rem,5vw,4rem); text-align:center; }
.cta-panel h2 { margin-left:auto; margin-right:auto; max-width:13ch; }
.cta-panel p { color:#fff; font-size:1.08rem; margin:1rem auto 0; max-width:none; white-space:nowrap; }
.cta-panel .btn { background:var(--aqua); border-color:var(--aqua); box-shadow:0 12px 26px rgba(0,211,199,.22); color:var(--ink); font-size:.98rem; margin-top:2rem; padding:1rem 1.55rem; }
.cta-panel .btn:hover,.cta-panel .btn:focus { background:#fff; border-color:#fff; color:var(--ink); }
.cta-panel .social-links a { border-color:rgba(0,211,199,.5); color:var(--aqua); }
.cta-panel .social-links a:hover { background:var(--aqua); color:var(--ink); }
.social-links { display:flex; gap:.75rem; justify-content:center; margin-top:2.25rem; }
.social-links a { align-items:center; border:1px solid var(--line); border-radius:50%; display:flex; height:42px; justify-content:center; text-decoration:none; width:42px; }
.social-links a:hover { background:var(--ink); color:#fff; }
.site-footer { border-top:1px solid var(--line); color:#607077; font-size:.8rem; padding:1.75rem 0; }
.whatsapp-float { align-items:center; background:#25d366; border-radius:50%; bottom:1.25rem; box-shadow:0 8px 25px rgba(0,0,0,.18); color:#fff; display:flex; font-size:1.55rem; height:54px; justify-content:center; position:fixed; right:1.25rem; text-decoration:none; width:54px; z-index:60; }
@media (max-width:991px) { .pain-grid { grid-template-columns:repeat(2,1fr); } .process-grid { grid-template-columns:repeat(2,1fr); gap:2rem; } .process-step,.process-step:first-child { border-left:1px solid rgba(255,255,255,.27); padding-left:1.25rem; } .process-step span { margin-bottom:1rem; } }
@media (max-width:767px) { .hero,.section-resolved { background-attachment:scroll; } .hero { background-position:58% center; min-height:calc(100svh - 77px); padding:3.5rem 0; } .hero h1 { font-size:clamp(3rem,14vw,4.6rem); } .cta-panel p { white-space:normal; } .section-head { align-items:start; display:block; margin-bottom:2.4rem; } .challenge-intro,.examples-intro { display:block; margin-bottom:2.4rem; } .section-media { margin-top:1.7rem; } .section-media img { height:58vw; min-height:230px; } .section-intro { margin-top:1rem; } .solution-row { grid-template-columns:48px 1fr; } .solution-row p { grid-column:2; } .pain-grid,.cases,.proof-grid { grid-template-columns:1fr; } .pain-card,.proof-card { min-height:0; } .process-grid { grid-template-columns:1fr; } .process-step,.process-step:first-child { min-height:0; } }
@media (prefers-reduced-motion:reduce) { *,html { scroll-behavior:auto!important; transition:none!important; } }