:root { --navy:#0a263d; --navy-2:#103a59; --blue:#1674ae; --cyan:#42c5d0; --cyan-soft:#dff5f5; --paper:#f7faf9; --ink:#102c43; --muted:#637b8c; --line:#dce7e8; --green:#43c99a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:94px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,"Segoe UI",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.site-header-shell { position:fixed; inset:0 0 auto; z-index:100; background:rgba(247,250,249,.94); border-bottom:1px solid rgba(16,58,89,.1); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.site-header { height:82px; max-width:1240px; margin:auto; padding:0 28px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; }
.brand img { display:block; width:62px; height:62px; object-fit:contain; }
.site-header nav { display:flex; gap:38px; color:#496779; font-size:13px; font-weight:700; }
.site-header nav a { position:relative; padding:30px 0; }
.site-header nav a:after { content:""; position:absolute; left:0; right:100%; bottom:20px; height:2px; background:var(--cyan); transition:.25s; }
.site-header nav a:hover { color:var(--navy); }.site-header nav a:hover:after { right:0; }
.login-button { justify-self:end; min-height:44px; display:flex; align-items:center; gap:20px; padding:0 17px 0 20px; border-radius:8px; background:var(--navy); color:white; font-size:12px; font-weight:800; transition:.2s; }
.login-button span { color:var(--cyan); font-size:17px; }.login-button:hover { background:var(--blue); transform:translateY(-1px); }
main { padding-top:82px; }
.hero { max-width:1240px; min-height:660px; margin:auto; padding:66px 28px 72px; display:grid; grid-template-columns:.9fr 1.1fr; gap:54px; align-items:center; overflow:hidden; }
.hero-copy { position:relative; z-index:2; }
.kicker { display:inline-flex; align-items:center; gap:10px; color:var(--blue); font-size:11px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }
.kicker i { display:block; width:24px; height:2px; background:var(--cyan); }.kicker.light { color:#b6edf0; }
h1 { margin:23px 0 26px; font-size:clamp(54px,5.5vw,76px); line-height:.95; letter-spacing:-.06em; font-weight:850; }
h1 em { color:var(--blue); font-style:normal; font-weight:400; }
.hero-copy>p { max-width:535px; margin:0; color:var(--muted); font-size:18px; line-height:1.7; }
.hero-actions { margin-top:34px; display:flex; align-items:center; gap:28px; }
.button { min-height:54px; padding:0 22px; display:inline-flex; justify-content:center; align-items:center; gap:28px; border-radius:8px; font-size:13px; font-weight:850; transition:.2s; }
.button.primary { color:white; background:var(--blue); box-shadow:0 14px 28px rgba(22,116,174,.17); }.button.primary:hover { background:var(--navy); transform:translateY(-2px); }.button span { font-size:18px; }
.text-link { display:flex; align-items:center; gap:13px; color:var(--navy); font-size:13px; font-weight:800; }.text-link span { color:var(--blue); font-size:18px; }.text-link:hover { color:var(--blue); }
.hero-assurances { margin-top:52px; padding-top:24px; border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,1fr); max-width:550px; }
.hero-assurances span { display:grid; gap:5px; padding-right:18px; }.hero-assurances b { font-size:12px; }.hero-assurances small { color:#8499a6; font-size:9px; }
.hero-visual { position:relative; min-height:520px; }
.visual-grid { position:absolute; inset:10px 0; border-radius:50%; background-image:linear-gradient(rgba(23,116,174,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(23,116,174,.07) 1px,transparent 1px); background-size:34px 34px; mask-image:radial-gradient(circle,#000 15%,transparent 70%); }
.orbit { position:absolute; left:50%; top:50%; border:1px solid rgba(22,116,174,.18); border-radius:50%; transform:translate(-50%,-50%); }.orbit:before,.orbit:after { content:""; position:absolute; width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 5px rgba(66,197,208,.12); }.orbit-one { width:355px; height:355px; }.orbit-one:before { left:40px; top:51px; }.orbit-one:after { right:25px; bottom:85px; }.orbit-two { width:480px; height:480px; }.orbit-two:before { right:80px; top:29px; }.orbit-two:after { left:18px; bottom:155px; }
.core-card { position:absolute; z-index:3; left:50%; top:50%; width:172px; height:172px; transform:translate(-50%,-50%); border-radius:24px; background:linear-gradient(145deg,var(--navy-2),var(--navy)); color:white; box-shadow:0 27px 55px rgba(10,38,61,.28); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.core-mark { width:42px; height:42px; border-radius:11px; background:var(--cyan); display:grid; place-items:center; color:var(--navy); font-weight:950; margin-bottom:12px; }.core-card>span { color:#a9c7d5; font-size:8px; text-transform:uppercase; letter-spacing:.15em; }.core-card strong { font-size:15px; margin:5px 0; }.core-card small { color:#70d7df; font-size:8px; }
.system-card { position:absolute; z-index:4; width:225px; min-height:70px; padding:12px; border:1px solid #dce8e9; border-radius:12px; background:rgba(255,255,255,.94); box-shadow:0 15px 35px rgba(20,62,86,.12); display:grid; grid-template-columns:39px 1fr auto; align-items:center; gap:10px; }
.system-card>i { width:38px; height:38px; border-radius:9px; background:#e5f4f5; color:var(--blue); display:grid; place-items:center; font-size:10px; font-style:normal; font-weight:900; }.system-card>span { display:grid; gap:4px; }.system-card b { font-size:10px; }.system-card small { color:#8499a5; font-size:7px; }.system-card em { color:#2d9f77; background:#e3f6ee; padding:4px 6px; border-radius:99px; font-size:6px; font-style:normal; font-weight:850; }.card-sefaz { left:5px; top:67px; }.card-nfse { right:-5px; top:112px; }.card-tax { left:25px; bottom:76px; }
.status-card { position:absolute; z-index:4; right:0; bottom:32px; width:255px; padding:15px; border-radius:12px; background:white; border:1px solid #dce8e9; box-shadow:0 15px 35px rgba(20,62,86,.12); display:grid; grid-template-columns:10px 1fr auto; align-items:center; gap:10px; }.status-dot { width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 5px #e0f7ef; }.status-card div { display:grid; gap:4px; }.status-card b { font-size:9px; }.status-card small { color:#8599a5; font-size:7px; }.status-card>strong { color:#279572; font-size:13px; }
.signal-bar { min-height:76px; padding:20px 28px; background:var(--navy); color:#d9ebf2; display:flex; align-items:center; justify-content:center; gap:35px; text-transform:uppercase; letter-spacing:.11em; font-size:10px; font-weight:850; }.signal-bar i { width:4px; height:4px; background:var(--cyan); border-radius:50%; }
.section { max-width:1184px; margin:auto; padding:92px 28px; }
.section-heading { display:grid; grid-template-columns:1.1fr .7fr; gap:72px; align-items:end; margin-bottom:48px; }.section-heading h2 { max-width:680px; }.section-heading>p { color:var(--muted); font-size:16px; line-height:1.72; margin:0 0 7px; }
h2 { margin:20px 0 0; font-size:clamp(38px,4.1vw,53px); line-height:1.08; letter-spacing:-.042em; }
.product-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }.product-card { min-height:310px; padding:31px; background:white; border:1px solid var(--line); border-radius:12px; position:relative; overflow:hidden; transition:.25s; }.product-card:after { content:""; position:absolute; width:150px; height:150px; right:-75px; top:-75px; border-radius:50%; background:var(--cyan-soft); transition:.25s; }.product-card:hover { transform:translateY(-3px); box-shadow:0 20px 50px rgba(22,66,90,.08); }.product-card:hover:after { transform:scale(1.3); }.product-number { color:var(--cyan); font-size:12px; font-weight:900; }.product-category { display:block; margin-top:30px; color:#78909f; text-transform:uppercase; letter-spacing:.12em; font-size:10px; font-weight:900; }.product-card h3 { margin:9px 0 23px; font-size:23px; letter-spacing:-.03em; }.product-card ul { list-style:none; padding:0; margin:0; display:grid; gap:12px; }.product-card li { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:13px; }.product-card li i { width:19px; height:19px; border-radius:50%; display:grid; place-items:center; background:#e3f6ef; color:#29956f; font-size:8px; font-style:normal; font-weight:900; }
.integrations { background:var(--navy); color:white; }.integrations-inner { max-width:1240px; }.dark-heading>p { color:#a9c0cd; }.integration-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(255,255,255,.13); border-left:1px solid rgba(255,255,255,.13); }.integration-card { min-height:260px; padding:26px; border-right:1px solid rgba(255,255,255,.13); border-bottom:1px solid rgba(255,255,255,.13); transition:.22s; }.integration-card:hover { background:rgba(66,197,208,.08); }.integration-top { display:flex; justify-content:space-between; align-items:center; }.integration-top span { color:#74dbe1; font-size:9px; letter-spacing:.14em; font-weight:900; }.integration-top i { color:#4e7790; font-style:normal; }.integration-card h3 { margin:34px 0 13px; font-size:17px; }.integration-card p { margin:0; min-height:88px; color:#b7cad4; font-size:12px; line-height:1.65; }.integration-card>small { display:block; color:#6fd0d8; margin-top:15px; font-size:9px; font-weight:800; }
.journey { display:grid; grid-template-columns:.75fr 1.25fr; gap:90px; }.journey-intro p { color:var(--muted); max-width:400px; font-size:15px; line-height:1.7; }.journey-list { border-top:1px solid var(--line); }.journey-list article { display:grid; grid-template-columns:48px 130px 1fr; gap:18px; align-items:center; padding:25px 0; border-bottom:1px solid var(--line); }.journey-list b { color:var(--cyan); font-size:11px; }.journey-list h3 { margin:0; font-size:17px; }.journey-list p { margin:0; color:var(--muted); font-size:12px; line-height:1.6; }
.governance { max-width:1184px; margin:0 auto 110px; min-height:515px; display:grid; grid-template-columns:1fr 1fr; background:#eaf5f4; border-radius:18px; overflow:hidden; }.governance-visual { position:relative; min-height:515px; background:radial-gradient(circle at center,#fff 0,#eff9f8 37%,#dfeeed 100%); display:grid; place-items:center; }.shield { position:relative; z-index:3; width:95px; height:110px; background:var(--navy); color:var(--cyan); clip-path:polygon(50% 0,92% 15%,84% 72%,50% 100%,16% 72%,8% 15%); display:grid; place-items:center; font-size:34px; font-weight:900; }.governance-ring { position:absolute; border-radius:50%; border:1px solid rgba(22,116,174,.18); }.ring-a { width:270px; height:270px; }.ring-b { width:390px; height:390px; }.security-label { position:absolute; padding:9px 12px; border-radius:7px; background:white; border:1px solid var(--line); color:var(--navy); font-size:8px; font-weight:850; box-shadow:0 10px 25px rgba(30,70,90,.08); }.label-a { top:70px; right:45px; }.label-b { bottom:92px; left:35px; }.label-c { right:24px; bottom:120px; }.governance-copy { padding:68px 55px; background:white; }.governance-copy h2 { font-size:42px; }.governance-copy>p { color:var(--muted); font-size:13px; line-height:1.75; }.governance-points { margin-top:30px; display:grid; }.governance-points span { padding:13px 0; border-bottom:1px solid var(--line); color:#4f6a7b; font-size:11px; }.governance-points b { color:var(--cyan); margin-right:12px; }
.closing { display:flex; justify-content:space-between; align-items:end; gap:60px; border-top:1px solid var(--line); }.closing h2 { max-width:760px; }.closing .button { flex:none; }
footer { max-width:1184px; min-height:140px; margin:auto; padding:35px 28px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr auto auto; gap:50px; align-items:center; color:#8196a3; font-size:10px; }.footer-links { display:flex; gap:24px; color:#526d7e; font-weight:700; }footer img { width:86px; height:86px; object-fit:contain; }footer p { margin:9px 0 0; }
@media(max-width:1020px) { .hero { grid-template-columns:1fr; }.hero-copy { text-align:center; }.hero-copy>p,.hero-assurances { margin-left:auto; margin-right:auto; }.hero-actions { justify-content:center; }.hero-visual { max-width:700px; width:100%; margin:auto; }.integration-grid { grid-template-columns:repeat(2,1fr); }.journey { grid-template-columns:1fr; gap:40px; }.governance { margin-left:24px; margin-right:24px; } }
@media(max-width:760px) { html { scroll-padding-top:78px; }.site-header { height:70px; grid-template-columns:1fr auto; padding:0 18px; }.brand img { width:54px; height:54px; }.site-header nav { display:none; }.login-button { min-height:39px; padding:0 12px; gap:8px; }main { padding-top:70px; }.hero { padding:60px 18px; }.hero-actions { flex-direction:column; }.hero-assurances { gap:12px; }.hero-visual { min-height:430px; transform:scale(.9); }.system-card { width:200px; }.signal-bar { gap:13px; flex-wrap:wrap; }.signal-bar span { font-size:8px; }.section { padding:80px 18px; }.section-heading { grid-template-columns:1fr; gap:25px; }.product-grid { grid-template-columns:1fr; }.integration-grid { grid-template-columns:1fr; }.journey-list article { grid-template-columns:35px 90px 1fr; }.governance { margin:0 18px 80px; grid-template-columns:1fr; }.governance-visual { min-height:380px; }.governance-copy { padding:50px 28px; }.closing { flex-direction:column; align-items:flex-start; }footer { grid-template-columns:1fr; gap:20px; }.footer-links { flex-wrap:wrap; } }
@media(max-width:480px) { h1 { font-size:50px; }.hero-assurances { grid-template-columns:1fr; text-align:left; }.hero-assurances span { padding:8px 0; border-bottom:1px solid var(--line); }.hero-visual { min-height:350px; margin-top:20px; transform:none; }.orbit-two { width:330px; height:330px; }.orbit-one { width:240px; height:240px; }.core-card { width:135px; height:135px; }.system-card { width:165px; min-height:58px; padding:8px; grid-template-columns:31px 1fr; }.system-card>i { width:30px; height:30px; }.system-card em { display:none; }.card-sefaz { left:-5px; top:28px; }.card-nfse { right:-5px; top:85px; }.card-tax { left:8px; bottom:35px; }.status-card { right:-5px; bottom:-8px; width:190px; }.product-card { padding:27px; }.journey-list article { grid-template-columns:30px 1fr; }.journey-list p { grid-column:2; }.governance-copy h2 { font-size:35px; }.security-label { display:none; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }
