:root { --navy:#061a3b; --navy-deep:#02132d; --blue:#0769ff; --blue-bright:#1e88ff; --ink:#071b3d; --muted:#5f6f88; --line:#d9e4f2; --ice:#f4f8fd; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--ink); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; }
button,input,select,textarea { font:inherit; }
.site-header { height:104px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,5vw,84px); background:#fff; position:relative; z-index:50; border-bottom:1px solid #edf2f8; }
.brand { width:152px; height:94px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.brand img { width:auto; height:auto!important; max-width:132px; max-height:88px; object-fit:contain; display:block; }
.nav { display:flex; align-items:center; gap:clamp(22px,2.8vw,44px); font-size:15px; font-weight:650; }
.nav>a:not(.button) { position:relative; }
.nav>a:not(.button)::after { content:""; position:absolute; height:2px; left:0; right:100%; bottom:-8px; background:var(--blue); transition:right .25s ease; }
.nav>a:not(.button):hover::after { right:0; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:16px; min-height:56px; padding:0 28px; border:0; border-radius:8px; background:linear-gradient(135deg,#0663f4,#0879ff); color:white; font-weight:720; text-align:center; box-shadow:0 12px 30px rgba(5,100,245,.24); cursor:pointer; transition:transform .2s ease,box-shadow .2s ease; }
.button:hover { transform:translateY(-2px); box-shadow:0 16px 36px rgba(5,100,245,.32); }
.button-small { min-height:46px; padding:0 20px; }
.menu-toggle { display:none; border:0; background:none; padding:8px; }
.menu-toggle span { width:24px; height:2px; background:var(--ink); display:block; margin:5px 0; }

.hero { min-height:720px; padding:72px clamp(24px,5vw,84px) 78px; background:radial-gradient(circle at 76% 30%,rgba(15,100,255,.25),transparent 32%),linear-gradient(125deg,#031a3d 0%,#02142f 62%,#011027 100%); color:white; position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(460px,.94fr); align-items:center; gap:32px; overflow:hidden; }
.hero-grid { position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(46,130,255,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(46,130,255,.25) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(to bottom,transparent,black 20%,black 80%,transparent); transform:perspective(500px) rotateX(55deg) scale(1.8) translateY(20%); }
.hero::after { content:""; position:absolute; left:-4%; right:-4%; bottom:-44px; height:74px; background:#fff; border-radius:50% 50% 0 0 / 100% 100% 0 0; }
.hero-copy,.hero-visual { position:relative; z-index:2; }
.overline { margin:0 0 20px; color:#308aff; font-size:13px; letter-spacing:.2em; text-transform:uppercase; font-weight:800; }
.hero h1 { margin:0; max-width:720px; font-size:clamp(46px,5vw,76px); line-height:1.04; letter-spacing:-.052em; font-weight:770; }
.hero h1 em { color:#1678ff; font-style:normal; }
.hero-lead { max-width:610px; margin:28px 0 0; color:#c3d1e6; font-size:clamp(17px,1.6vw,21px); line-height:1.6; }
.hero-actions { display:flex; align-items:center; gap:32px; margin-top:34px; }
.text-link { display:inline-flex; gap:12px; align-items:center; color:white; font-weight:680; border-bottom:1px solid rgba(255,255,255,.42); padding:12px 0; }
.text-link.dark { color:var(--ink); border-color:#9ab5da; margin-top:20px; }
.hero-badges { display:flex; flex-wrap:wrap; gap:22px; margin-top:44px; color:#cfdbeb; font-size:13px; }
.hero-badges span { display:flex; align-items:center; gap:8px; }
.hero-badges span::before { content:"✓"; display:grid; place-items:center; width:22px; height:22px; border-radius:50%; color:#58a6ff; border:1px solid #2876d9; }
.hero-visual { min-height:530px; display:flex; justify-content:center; align-items:center; }
.hero-visual>img { width:114%; max-width:780px; filter:saturate(1.1) contrast(1.04); mix-blend-mode:screen; mask-image:radial-gradient(ellipse 70% 70% at center,#000 50%,transparent 92%); }
.float-card { position:absolute; right:0; min-width:220px; padding:15px 18px; background:rgba(4,29,67,.78); backdrop-filter:blur(12px); border:1px solid rgba(63,147,255,.45); border-radius:10px; box-shadow:0 14px 35px rgba(0,0,0,.25); }
.float-card strong,.float-card small { display:block; }
.float-card strong { font-size:14px; }
.float-card small { margin-top:4px; color:#86a4cd; font-size:11px; }
.card-one { top:15%; right:4%; }.card-two { top:42%; right:-2%; }.card-three { top:69%; right:8%; }
.scroll-cue { position:absolute; z-index:4; bottom:48px; left:50%; transform:translateX(-50%); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#7796bd; display:flex; gap:10px; align-items:center; }
.scroll-cue span { color:#4b9bff; font-size:20px; }

.trust-strip { max-width:1240px; margin:-2px auto 0; padding:58px 30px 36px; display:grid; grid-template-columns:repeat(3,1fr) 1.5fr; gap:26px; align-items:center; }
.trust-strip>div { display:flex; gap:12px; align-items:center; border-right:1px solid var(--line); }
.trust-strip strong { font-size:36px; color:var(--blue); letter-spacing:-.05em; }
.trust-strip span { max-width:120px; color:var(--muted); font-size:12px; line-height:1.4; }
.trust-strip>p { text-align:right; font-size:20px; font-weight:700; }

.section { padding:110px clamp(24px,6vw,96px); }
.section-heading,.method-heading { max-width:1300px; margin:0 auto 50px; display:grid; grid-template-columns:1.35fr .65fr; align-items:end; gap:80px; }
.section h2 { margin:0; font-size:clamp(36px,4vw,58px); line-height:1.08; letter-spacing:-.045em; }
.section-heading>p,.method-heading>p { color:var(--muted); line-height:1.7; font-size:17px; margin:0; }
.solutions { background:var(--ice); }
.solution-tabs { max-width:1300px; margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); background:white; border:1px solid var(--line); border-radius:14px 14px 0 0; overflow:hidden; }
.solution-tabs button { padding:22px; background:white; color:#64728a; font-size:17px; font-weight:750; text-align:center; border:0; border-right:1px solid var(--line); cursor:pointer; position:relative; }
.solution-tabs button:last-child { border-right:0; }
.solution-tabs button span { font-size:11px; margin-right:10px; color:var(--accent); }
.solution-tabs button.active { color:var(--ink); background:color-mix(in srgb,var(--accent) 5%,white); }
.solution-tabs button.active::after { content:""; position:absolute; left:0; right:0; bottom:0; height:4px; background:var(--accent); }
.solution-panel { max-width:1300px; min-height:430px; margin:0 auto; display:grid; grid-template-columns:1.05fr 1fr .7fr; gap:54px; background:white; border:1px solid var(--line); border-top:0; border-radius:0 0 18px 18px; padding:52px; box-shadow:0 22px 70px rgba(23,57,99,.08); }
.solution-number { font-size:12px; font-weight:800; color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 40%,white); padding:7px 9px; border-radius:50px; display:inline-block; margin-bottom:34px; }
.solution-intro .overline { color:var(--accent); margin-bottom:10px; }
.solution-intro h3 { font-size:42px; letter-spacing:-.04em; margin:0 0 16px; }
.solution-intro>p:last-of-type { color:var(--muted); line-height:1.65; font-size:17px; }
.solution-includes { padding-left:45px; border-left:1px solid var(--line); }
.solution-includes h4 { margin:0 0 22px; text-transform:uppercase; letter-spacing:.12em; font-size:12px; color:var(--accent); }
.solution-includes ul { list-style:none; margin:0; padding:0; display:grid; gap:16px; }
.solution-includes li { display:flex; gap:12px; line-height:1.4; }
.solution-includes li span { flex:0 0 22px; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:color-mix(in srgb,var(--accent) 12%,white); color:var(--accent); font-size:12px; font-weight:900; }
.solution-fit { align-self:stretch; background:color-mix(in srgb,var(--accent) 7%,white); border:1px solid color-mix(in srgb,var(--accent) 22%,white); border-radius:14px; padding:28px; display:flex; flex-direction:column; justify-content:flex-end; }
.solution-fit span { color:var(--accent); text-transform:uppercase; letter-spacing:.12em; font-size:11px; font-weight:850; }
.solution-fit p { font-size:17px; line-height:1.55; margin:12px 0 0; font-weight:650; }

.method { background:white; }
.steps { max-width:1300px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.step { min-height:250px; padding:34px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); position:relative; transition:background .25s ease,transform .25s ease; }
.step:hover { background:var(--ice); transform:translateY(-3px); }
.step>span { color:#1677fa; font-weight:800; font-size:13px; }
.step h3 { margin:48px 0 12px; font-size:24px; letter-spacing:-.03em; }
.step p { color:var(--muted); line-height:1.6; margin:0; }

.department { background:linear-gradient(130deg,#031a3c,#02122c); color:white; display:grid; grid-template-columns:.85fr 1.15fr; gap:90px; align-items:center; }
.department-copy>p:not(.overline) { color:#b7c7dc; line-height:1.75; font-size:18px; margin:24px 0 34px; }
.button-light { background:white; color:var(--navy); box-shadow:none; }
.department-cards { display:grid; gap:16px; }
.department-cards article { padding:28px 30px; background:rgba(9,45,96,.6); border:1px solid rgba(56,135,240,.32); border-radius:14px; display:grid; grid-template-columns:46px 150px 1fr; gap:12px; align-items:center; transition:transform .2s,border-color .2s; }
.department-cards article:hover { transform:translateX(6px); border-color:#227cff; }
.department-cards span { color:#3e96ff; font-size:12px; font-weight:850; }
.department-cards h3 { margin:0; font-size:22px; }
.department-cards p { margin:0; color:#aebfd6; line-height:1.55; }

.audience { background:white; }
.audience-card { max-width:1300px; margin:0 auto; padding:70px; border-radius:26px; background:linear-gradient(135deg,#eef6ff,#f8fbff); border:1px solid #d9e9fb; position:relative; overflow:hidden; }
.audience-card::after { content:"↗"; position:absolute; right:40px; top:0; font-size:220px; line-height:1; color:rgba(14,111,248,.06); font-weight:800; }
.audience-card h2 { max-width:930px; position:relative; z-index:2; }
.audience-list { position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:42px; }
.audience-list span { padding:18px; background:white; border:1px solid var(--line); border-radius:10px; font-size:14px; font-weight:700; }

.about { display:grid; grid-template-columns:.7fr 1.3fr; gap:90px; max-width:1420px; margin:0 auto; align-items:center; }
.about-mark { min-height:360px; background:#fff; border:1px solid var(--line); border-radius:24px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.about-mark img { display:block; width:min(78%,520px); height:auto!important; max-height:260px; object-fit:contain; }
.about-copy>p:not(.overline) { color:var(--muted); line-height:1.75; font-size:18px; max-width:760px; }
.ft2-values { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:30px; }
.ft2-values span { padding:16px 0; border-top:1px solid var(--line); font-weight:700; }

.contact { padding:100px clamp(24px,8vw,130px); background:linear-gradient(135deg,#071f48,#02142f); color:white; display:grid; grid-template-columns:1fr .8fr; gap:100px; align-items:center; }
.contact h2 { margin:0; font-size:clamp(38px,4.6vw,64px); line-height:1.06; letter-spacing:-.05em; }
.contact-copy>p:not(.overline) { color:#b9c9df; font-size:18px; line-height:1.7; max-width:620px; }
.contact-channels { display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }
.contact-channels a { min-width:250px; padding:16px 18px; border:1px solid rgba(255,255,255,.22); border-radius:10px; color:#fff; font-size:14px; font-weight:700; transition:border-color .2s ease,background .2s ease; }
.contact-channels a:hover { border-color:#4a9bff; background:rgba(24,116,255,.1); }
.contact-channels span { display:block; margin-bottom:6px; color:#88a6cd; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.contact-form { background:white; color:var(--ink); border-radius:18px; padding:34px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.contact-form label { display:grid; gap:8px; font-size:12px; font-weight:800; color:#455672; }
.contact-form input,.contact-form select,.contact-form textarea { padding:0 14px; border:1px solid #cfdceb; border-radius:8px; background:#fff; outline:none; color:var(--ink); }
.contact-form input,.contact-form select { height:52px; }
.contact-form textarea { min-height:112px; padding-top:14px; resize:vertical; line-height:1.5; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(7,105,255,.1); }
.contact-form .field-full,.contact-form .button,.contact-form .form-feedback,.contact-form small { grid-column:1/-1; }
.contact-form .button:disabled { cursor:wait; opacity:.72; transform:none; }
.form-honeypot { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; opacity:0!important; pointer-events:none!important; }
.form-feedback { min-height:22px; margin:0; text-align:center; font-size:13px; font-weight:700; line-height:1.5; }
.form-feedback.sending { color:#496b9b; }
.form-feedback.success { color:#168447; }
.form-feedback.error { color:#c23b3b; }
.contact-form small { text-align:center; color:#78869b; line-height:1.5; }

footer { padding:48px clamp(24px,6vw,96px); display:grid; grid-template-columns:1fr auto; align-items:center; gap:34px; border-top:1px solid var(--line); }
.footer-brand img { display:block; width:180px; height:auto!important; object-fit:contain; }
.footer-brand p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.footer-links { display:flex; gap:30px; font-size:14px; font-weight:650; }
.footer-meta { grid-column:1/-1; display:flex; justify-content:space-between; gap:24px; padding-top:22px; border-top:1px solid var(--line); color:#7b899d; font-size:12px; }
.footer-meta a:hover { color:var(--blue); }

.whatsapp-float { position:fixed; right:max(22px,env(safe-area-inset-right)); bottom:max(22px,env(safe-area-inset-bottom)); z-index:90; min-height:58px; padding:0 22px 0 18px; display:inline-flex; align-items:center; justify-content:center; gap:11px; border-radius:999px; background:#25d366; color:#fff; font-size:14px; font-weight:800; line-height:1; text-align:center; box-shadow:0 12px 30px rgba(3,37,20,.28); transition:transform .2s ease,box-shadow .2s ease,background .2s ease; }
.whatsapp-float:hover { transform:translateY(-3px); background:#20bd5a; box-shadow:0 16px 36px rgba(3,37,20,.34); }
.whatsapp-float:focus-visible { outline:3px solid #fff; box-shadow:0 0 0 6px rgba(37,211,102,.5),0 12px 30px rgba(3,37,20,.28); }
.whatsapp-float svg { width:28px; height:28px; flex:0 0 28px; display:block; fill:currentColor; }

@media (max-width:1080px) {
  .hero { grid-template-columns:1fr; padding-top:64px; }
  .hero-copy { max-width:780px; }
  .hero-visual { min-height:400px; width:80%; margin-left:auto; margin-top:-30px; }
  .float-card { right:4%; }
  .trust-strip { grid-template-columns:repeat(3,1fr); }.trust-strip>p { grid-column:1/-1; text-align:left; }
  .section-heading,.method-heading { grid-template-columns:1fr; gap:24px; }
  .solution-panel { grid-template-columns:1fr 1fr; }.solution-fit { grid-column:1/-1; min-height:170px; }
  .department { grid-template-columns:1fr; }.about { grid-template-columns:1fr; }.about-mark { min-height:280px; }
  .contact { grid-template-columns:1fr; gap:50px; }
}

@media (max-width:760px) {
  .site-header { height:84px; padding:0 20px; position:sticky; top:0; }
  .brand { width:116px; height:76px; justify-content:flex-start; }.brand img { width:auto; height:auto!important; max-width:104px; max-height:72px; }
  .menu-toggle { display:block; z-index:52; }
  .nav { display:none; position:absolute; top:84px; left:0; right:0; padding:26px 24px 30px; background:white; flex-direction:column; align-items:stretch; gap:24px; box-shadow:0 20px 40px rgba(5,24,56,.15); }
  .nav.open { display:flex; }.nav .button { width:100%; }
  .hero { min-height:auto; padding:72px 22px 86px; display:block; }
  .hero h1 { font-size:46px; }.hero-lead { font-size:17px; }.hero-actions { flex-direction:column; align-items:stretch; gap:10px; }.hero-actions .text-link { justify-content:center; }
  .hero-badges { gap:12px; margin-top:30px; }
  .hero-visual { width:110%; margin:28px -5% 0; min-height:330px; }.hero-visual>img { width:125%; }.float-card { min-width:170px; padding:11px; }.float-card small { display:none; }.card-one { top:12%; }.card-two { top:43%; }.card-three { top:72%; }
  .scroll-cue { display:none; }
  .trust-strip { padding:44px 22px 30px; grid-template-columns:1fr; gap:14px; }.trust-strip>div { border-right:0; border-bottom:1px solid var(--line); padding-bottom:14px; }.trust-strip>p { font-size:18px; }
  .section { padding:76px 22px; }.section h2 { font-size:39px; }.section-heading,.method-heading { margin-bottom:34px; }
  .solution-tabs { display:flex; overflow-x:auto; border-radius:12px 12px 0 0; }.solution-tabs button { min-width:140px; padding:18px 12px; }
  .solution-panel { grid-template-columns:1fr; padding:30px 24px; gap:36px; }.solution-includes { border-left:0; border-top:1px solid var(--line); padding:30px 0 0; }.solution-fit { grid-column:auto; }.solution-intro h3 { font-size:36px; }
  .steps { grid-template-columns:1fr; }.step { min-height:210px; }.step h3 { margin-top:38px; }
  .department { gap:52px; }.department-cards article { grid-template-columns:40px 1fr; }.department-cards p { grid-column:2; }
  .audience-card { padding:42px 24px; }.audience-list { grid-template-columns:1fr; }
  .about { gap:42px; }.about-mark { min-height:220px; }.ft2-values { grid-template-columns:1fr; }
  .contact { padding:76px 22px; }.contact-form { grid-template-columns:1fr; padding:24px; }.contact-form .field-full,.contact-form .button,.contact-form .form-feedback,.contact-form small { grid-column:auto; }
  footer { grid-template-columns:1fr; }.footer-links { flex-wrap:wrap; }.footer-meta { display:block; }.footer-meta p { margin:8px 0; }
  .whatsapp-float { right:max(16px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); width:58px; height:58px; min-height:58px; padding:0; justify-content:center; }
  .whatsapp-float span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }