:root {
  --navy: #092d3c;
  --navy-2: #0d3b4d;
  --cyan: #10adc1;
  --mint: #61e6c1;
  --cream: #f5f3ed;
  --ink: #122624;
  --lime: #d7f35a;
  --cobalt: #4b5cff;
  --white: #fff;
  --muted: #678089;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--navy); background: #fff; font-family: "DM Sans", sans-serif; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.concept { display: none; min-height: 100vh; overflow: hidden; }
.concept.is-visible { display: block; animation: conceptIn .5s ease both; }
@keyframes conceptIn { from { opacity: 0; transform: translateY(8px); } }
.reveal { animation: reveal .7s .1s ease both; }
@keyframes reveal { from { opacity: 0; transform: translateY(18px); } }
.concept-switcher {
  position: fixed; z-index: 100; left: 50%; bottom: 20px; transform: translateX(-50%);
  display: flex; align-items: center; gap: 14px; padding: 8px 10px 8px 16px;
  background: rgba(8, 21, 27, .92); color: white; border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px; backdrop-filter: blur(18px); box-shadow: 0 15px 45px rgba(0,0,0,.25);
}
.switcher-label { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #99abb2; white-space: nowrap; }
.switcher-buttons { display: flex; gap: 4px; }
.concept-button { border: 0; color: #c8d1d4; background: transparent; padding: 10px 13px; border-radius: 10px; cursor: pointer; font-size: 12px; font-weight: 600; }
.concept-button span { color: #71858d; margin-right: 4px; }
.concept-button:hover { color: white; }
.concept-button.is-active { color: #061e28; background: var(--mint); }
.concept-button.is-active span { color: #316658; }
.brand { display: flex; align-items: center; gap: 10px; }
.brand > span:last-child { display: flex; flex-direction: column; }
.brand small { font-size: 7px; letter-spacing: .22em; font-weight: 700; }
.menu-button { display: none; background: none; border: 0; font-size: 24px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; border-radius: 6px; padding: 14px 19px; font-weight: 700; font-size: 13px; transition: .2s ease; }
.button span { font-size: 18px; }
.button:hover { transform: translateY(-2px); }
.eyebrow { display: flex; align-items: center; gap: 9px; font-size: 11px; letter-spacing: .13em; text-transform: uppercase; font-weight: 700; color: var(--cyan); }
.eyebrow i { display: block; width: 20px; height: 2px; background: currentColor; }
.hero-actions { display: flex; align-items: center; gap: 28px; }

/* CONCEITO 1 — ESSENCIAL */
.concept-one { font-family: "Manrope", sans-serif; background: #fbfcfa; }
.c1-header { height: 82px; display: flex; align-items: center; justify-content: space-between; }
.brand-c1 img { display: block; width: 72px; height: 62px; object-fit: contain; }
.c1-header nav { display: flex; gap: 34px; font-size: 13px; font-weight: 600; }
.c1-header nav a:hover { color: var(--cyan); }
.button-outline { border: 1px solid #c9d5d8; }
.c1-hero { min-height: 645px; display: grid; grid-template-columns: 1fr .92fr; align-items: center; gap: 70px; padding-top: 28px; padding-bottom: 70px; }
.c1-hero-copy h1 { font-size: clamp(45px, 4.4vw, 68px); line-height: 1.04; letter-spacing: -.055em; margin: 20px 0 24px; font-weight: 700; }
.c1-hero-copy h1 em { color: var(--cyan); font-style: normal; }
.c1-hero-copy > p { max-width: 560px; line-height: 1.75; color: #5f747b; margin-bottom: 32px; font-size: 15px; }
.button-primary { background: var(--navy); color: white; box-shadow: 0 12px 30px rgba(9,45,60,.16); }
.button-primary:hover { background: var(--cyan); }
.text-link { font-size: 13px; font-weight: 700; border-bottom: 1px solid #bfd0d4; padding-bottom: 5px; }
.trust-line { display: flex; align-items: center; margin-top: 50px; gap: 12px; color: #71858b; font-size: 11px; }
.trust-line strong { display: block; color: var(--navy); font-size: 12px; }
.avatars { display: flex; }
.avatars b { display: grid; place-items: center; width: 31px; height: 31px; margin-left: -6px; border: 2px solid white; border-radius: 50%; background: #bee0df; color: var(--navy); font-size: 9px; }
.avatars b:nth-child(2) { background: #f1c8a9; }.avatars b:nth-child(3) { background: #c7cce6; }
.c1-dashboard { position: relative; width: 440px; max-width: 100%; justify-self: end; padding: 25px; border-radius: 16px; background: white; box-shadow: 0 28px 70px rgba(15,53,63,.14); border: 1px solid #edf1ef; }
.dashboard-top { display: flex; justify-content: space-between; align-items: center; }
.dashboard-top > div { display: flex; flex-direction: column; gap: 5px; }
.dashboard-top small { font-size: 8px; letter-spacing: .12em; color: #8ba0a5; }
.dashboard-top strong { font-size: 17px; }
.icon-button { border: 1px solid #e7eded; border-radius: 50%; background: white; width: 35px; height: 35px; color: #84999e; }
.company-pill { margin: 20px 0 13px; display: flex; align-items: center; gap: 9px; background: #f5f8f7; border-radius: 7px; padding: 9px; font-size: 10px; font-weight: 700; }
.company-pill span { display: grid; place-items: center; width: 24px; height: 24px; color: white; border-radius: 5px; background: var(--navy); font-size: 8px; }
.company-pill i { margin-left: auto; }
.metric-card { background: var(--navy); color: white; padding: 18px 18px 0; border-radius: 10px; overflow: hidden; }
.metric-card > span { font-size: 9px; color: #a8c1c8; }
.metric-card > strong { display: block; font-size: 25px; margin-top: 5px; }.metric-card > strong small { font-size: 13px; }
.metric-row { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 8px; color: #8faeb6; }
.metric-row b { color: var(--mint); background: rgba(97,230,193,.12); border-radius: 3px; padding: 3px 5px; }
.chart-bars { height: 80px; display: flex; align-items: end; gap: 8px; padding-top: 8px; }
.chart-bars i { flex: 1; background: #1a5364; border-radius: 3px 3px 0 0; }.chart-bars i.active { background: var(--cyan); }
.dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 11px; }
.dashboard-grid > div { position: relative; display: grid; padding: 12px 10px 12px 42px; background: #f6f8f8; border-radius: 7px; }
.dashboard-grid small { font-size: 8px; color: #829398; }.dashboard-grid strong { font-size: 10px; margin-top: 3px; }
.dash-icon { position: absolute; left: 10px; top: 12px; display: grid; place-items: center; width: 25px; height: 25px; border-radius: 5px; font-size: 12px; }.dash-icon.cyan { background: #dff4f2; color: #0a978f; }.dash-icon.blue { background: #e4ecf7; color: #436499; }
.next-item { display: flex; align-items: center; gap: 10px; padding-top: 15px; }
.next-item > span { display: flex; flex-direction: column; text-align: center; width: 35px; color: var(--cyan); font-size: 9px; font-weight: 800; }
.next-item p { display: flex; flex: 1; flex-direction: column; margin: 0; }
.next-item p small { font-size: 8px; color: #88999d; }.next-item p strong, .next-item > b { font-size: 9px; margin-top: 2px; }
.floating-secure { position: absolute; display: flex; align-items: center; gap: 10px; right: -46px; bottom: 47px; background: white; border: 1px solid #edf2f1; border-radius: 8px; padding: 10px 15px; box-shadow: 0 12px 30px rgba(8,49,58,.13); color: #0c9c88; font-size: 13px; }
.floating-secure span { display: flex; flex-direction: column; }.floating-secure b { color: var(--navy); font-size: 8px; }.floating-secure small { color: #8ca0a5; font-size: 7px; margin-top: 2px; }
.logo-strip { border-block: 1px solid #e5ebea; background: white; }
.logo-strip .container { min-height: 83px; display: flex; align-items: center; justify-content: space-between; color: #87999d; }
.logo-strip span { font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }.logo-strip strong { font-size: 12px; letter-spacing: .05em; color: #778d91; }
.c1-services { padding-top: 110px; padding-bottom: 120px; }
.section-heading { display: grid; grid-template-columns: 1fr .7fr; align-items: end; gap: 60px; margin-bottom: 50px; }
.section-heading h2 { font-size: 43px; line-height: 1.12; letter-spacing: -.04em; margin: 17px 0 0; }
.section-heading > p { color: #6f8186; line-height: 1.7; font-size: 14px; }
.service-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid #dce5e4; }
.service-grid a { position: relative; min-height: 310px; padding: 25px; border-right: 1px solid #dce5e4; transition: .25s; }
.service-grid a:last-child { border: 0; }.service-grid a:hover { color: white; background: var(--navy); transform: translateY(-7px); box-shadow: 0 20px 35px rgba(9,45,60,.13); }
.service-grid a > span { font-size: 9px; color: #98a7a9; }.service-icon { margin: 38px 0 28px; font-size: 26px; color: var(--cyan); }
.service-grid h3 { font-size: 17px; }.service-grid p { min-height: 66px; color: #75878b; font-size: 11px; line-height: 1.7; }.service-grid b { font-size: 10px; }
.service-grid a:hover p { color: #b1c2c7; }.service-grid a:hover b { color: var(--mint); }
.c1-cta { padding: 90px 0 120px; text-align: center; color: white; background: var(--navy); }
.c1-cta .container { display: flex; flex-direction: column; align-items: center; }
.eyebrow.light { color: var(--mint); }.c1-cta h2 { max-width: 800px; font-size: 46px; letter-spacing: -.04em; line-height: 1.15; }
.button-white { color: var(--navy); background: white; }

/* CONCEITO 2 — PRÓXIMO */
.concept-two { background: var(--cream); color: var(--ink); font-family: "Plus Jakarta Sans", sans-serif; }
.c2-header { display: flex; align-items: center; justify-content: space-between; height: 91px; padding: 0 4vw; border-bottom: 1px solid #cfd2c7; }
.brand-c2 img { display: block; width: 78px; height: 68px; object-fit: contain; }
.c2-header nav { display: flex; gap: 36px; font-size: 12px; font-weight: 600; }
.c2-login { display: flex; align-items: center; gap: 9px; padding: 10px 13px; border: 1px solid var(--ink); border-radius: 30px; font-size: 11px; font-weight: 700; }
.c2-login span { color: #21a273; }
.c2-hero { position: relative; display: grid; grid-template-columns: 80px 1.12fr .88fr; min-height: 610px; max-width: 1450px; margin: auto; }
.c2-side-note { border-right: 1px solid #cfd2c7; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 30px; writing-mode: vertical-rl; transform: rotate(180deg); font-size: 8px; font-weight: 700; letter-spacing: .14em; }
.c2-side-note i { width: 1px; height: 60px; background: #adb4a8; }.c2-side-note b { color: #879087; }
.c2-copy { position: relative; padding: 95px 5vw 70px; }
.c2-sticker { position: absolute; right: 45px; top: 38px; display: grid; place-items: center; width: 94px; height: 94px; border-radius: 50%; background: var(--lime); text-align: center; font-size: 10px; line-height: 1.5; font-weight: 800; transform: rotate(7deg); }
.c2-kicker { font-size: 9px; letter-spacing: .19em; font-weight: 800; }
.c2-copy h1 { font-size: clamp(48px, 5vw, 76px); line-height: 1.01; letter-spacing: -.065em; margin: 27px 0; font-weight: 700; }
.c2-copy h1 em { font-family: Georgia, serif; font-weight: 400; }
.c2-description { max-width: 570px; color: #5f6962; font-size: 14px; line-height: 1.7; }
.c2-button { display: inline-flex; gap: 25px; align-items: center; background: var(--ink); color: white; padding: 17px 20px; border-radius: 2px; font-size: 12px; font-weight: 700; box-shadow: 5px 5px 0 var(--lime); }
.c2-copy .hero-actions { margin-top: 35px; }
.c2-rating { display: flex; align-items: center; gap: 12px; }.c2-rating > b { letter-spacing: .05em; font-size: 10px; color: #e19a29; }
.c2-rating span { display: flex; flex-direction: column; }.c2-rating strong { font-size: 9px; }.c2-rating small { font-size: 8px; color: #7c8580; margin-top: 2px; }
.c2-visual { position: relative; padding: 55px 4vw 55px 0; }
.c2-photo { width: 100%; height: 100%; min-height: 500px; overflow: hidden; background: #bdd2cb; border-radius: 180px 180px 8px 8px; }
.abstract-person { position: relative; height: 100%; min-height: 500px; background: radial-gradient(circle at 70% 20%, #ecf6e9 0 12%, transparent 12.5%), linear-gradient(135deg, #b4d8ce, #648f83); overflow: hidden; }
.abstract-person:after { content: ""; position: absolute; inset: auto -10% 0; height: 30%; background: #e6c698; border-radius: 50% 50% 0 0; }
.person-head { position: absolute; z-index: 2; width: 105px; height: 120px; left: 46%; top: 21%; border-radius: 48% 48% 45% 45%; background: #b8784f; box-shadow: -16px -13px 0 #332922; }
.person-body { position: absolute; z-index: 1; width: 280px; height: 330px; left: 29%; top: 38%; border-radius: 48% 48% 0 0; background: #f2e9d8; transform: rotate(-4deg); }
.plant { position: absolute; z-index: 3; width: 40px; height: 180px; bottom: 8%; background: #294e3d; border-radius: 100% 0 100% 0; }.p1 { left: 6%; transform: rotate(-25deg); }.p2 { right: 5%; height: 140px; transform: rotate(25deg); }
.note-card { position: absolute; left: -45px; bottom: 70px; width: 220px; padding: 20px; background: white; transform: rotate(-3deg); box-shadow: 0 12px 30px rgba(24,51,43,.13); }
.note-card span { font: 30px Georgia; color: #54a88b; }.note-card p { font: italic 14px/1.5 Georgia; margin: 0 0 10px; }.note-card b { font-size: 8px; letter-spacing: .08em; }
.round-label { position: absolute; right: 1.5vw; top: 35px; display: grid; place-items: center; align-content: center; width: 76px; height: 76px; border-radius: 50%; background: var(--ink); color: var(--lime); font-size: 18px; font-weight: 700; }.round-label small { display: block; font-size: 7px; letter-spacing: .18em; }
.c2-marquee { overflow: hidden; padding: 14px 0; color: var(--ink); background: var(--lime); border-block: 1px solid var(--ink); white-space: nowrap; }
.c2-marquee div { width: max-content; font-size: 10px; font-weight: 800; letter-spacing: .09em; animation: marquee 25s linear infinite; }
@keyframes marquee { to { transform: translateX(-40%); } }
.c2-solutions { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; padding: 120px 8vw; }
.c2-title span, .portal-copy > span { font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.c2-title h2, .portal-copy h2 { font-size: 44px; line-height: 1.12; letter-spacing: -.05em; margin-top: 28px; }
.c2-list { border-top: 1px solid #adb5aa; }
.c2-list a { display: grid; grid-template-columns: 45px 1fr .75fr 30px; align-items: center; min-height: 110px; border-bottom: 1px solid #adb5aa; transition: .2s; }
.c2-list a:hover { padding-inline: 12px; background: var(--lime); }.c2-list span { font-size: 9px; }.c2-list h3 { font-size: 17px; }.c2-list p { color: #6d756f; font-size: 10px; line-height: 1.6; }.c2-list b { text-align: right; }
.c2-portal { display: grid; grid-template-columns: .7fr 1.3fr; gap: 7vw; padding: 110px 8vw; background: #193e35; color: white; }
.portal-copy > span { color: var(--lime); }.portal-copy h2 { font-size: 50px; }.portal-copy > p { color: #b1c4bd; font-size: 13px; line-height: 1.75; }
.portal-copy ul { list-style: none; padding: 14px 0; font-size: 11px; line-height: 2.4; }.portal-copy li i { color: var(--lime); margin-right: 10px; font-style: normal; }
.c2-text-link { display: inline-flex; gap: 30px; border-bottom: 1px solid #738c85; padding-bottom: 7px; font-size: 10px; font-weight: 700; }
.c2-app { min-height: 420px; display: grid; grid-template-columns: 55px 1fr; background: #f7f8f3; color: var(--ink); border-radius: 8px; box-shadow: 20px 22px 0 rgba(216,243,90,.12); overflow: hidden; transform: rotate(1deg); }
.app-sidebar { display: flex; align-items: center; flex-direction: column; gap: 29px; padding: 18px 0; color: #789088; background: #102d27; }
.app-sidebar b { color: var(--lime); margin-bottom: 9px; }.app-sidebar i { font-style: normal; font-size: 12px; }.app-sidebar .last { display: grid; place-items: center; width: 28px; height: 28px; background: var(--lime); color: var(--ink); border-radius: 50%; margin-top: auto; font-size: 7px; }
.app-content { padding: 24px 28px; }
.app-welcome { display: flex; justify-content: space-between; align-items: center; }.app-welcome p { display: flex; flex-direction: column; margin: 0; }.app-welcome small { font-size: 8px; color: #82918c; }.app-welcome strong { margin-top: 4px; font-size: 15px; }
.app-welcome button { border: 1px solid #b7c2be; background: transparent; border-radius: 3px; padding: 8px 10px; font-size: 7px; font-weight: 700; }
.status-card { margin: 20px 0; display: flex; flex-direction: column; padding: 16px; background: #e5f1b3; border-radius: 5px; }.status-card > span { font-size: 7px; letter-spacing: .1em; }.status-card strong { margin: 7px 0; font-size: 13px; }.status-card strong i { display: inline-grid; place-items: center; border-radius: 50%; background: #3f7766; color: white; width: 20px; height: 20px; margin-right: 7px; font-style: normal; font-size: 9px; }.status-card small { padding-left: 31px; font-size: 7px; color: #6a796f; }
.app-section-title { display: flex; justify-content: space-between; font-size: 8px; margin-bottom: 9px; }.app-section-title a { text-decoration: underline; color: #60736c; }
.tax-row { display: grid; grid-template-columns: 40px 1fr auto auto; gap: 11px; align-items: center; padding: 11px; background: white; border: 1px solid #e2e6df; }.tax-date { display: flex; flex-direction: column; text-align: center; font-size: 15px; font-weight: 700; }.tax-date small { font-size: 6px; }.tax-row p { display: flex; flex-direction: column; margin: 0; }.tax-row p b { font-size: 8px; }.tax-row p small { font-size: 6px; margin-top: 4px; color: #7b8b85; }.tax-row > strong { font-size: 8px; }.tax-row button { border: 0; background: var(--ink); color: white; padding: 7px 9px; font-size: 6px; }
.app-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }.app-cards div { display: grid; grid-template-columns: 1fr auto; padding: 12px; background: white; border: 1px solid #e2e6df; }.app-cards span { font-size: 6px; }.app-cards strong { grid-row: span 2; font-size: 18px; }.app-cards small { font-size: 6px; color: #81908a; }
.c2-footer { display: flex; align-items: center; justify-content: space-between; padding: 75px 8vw 110px; color: var(--ink); background: var(--lime); }.c2-footer h2 { font: 52px Georgia, serif; margin: 0; }.c2-footer a { padding-bottom: 8px; border-bottom: 2px solid; font-size: 12px; font-weight: 700; }

/* CONCEITO 3 — DIGITAL */
.concept-three { position: relative; font-family: "Plus Jakarta Sans", sans-serif; color: #eaf0ff; background: #080d24; }
.c3-noise { position: absolute; inset: 0 0 auto; height: 800px; pointer-events: none; background: radial-gradient(circle at 75% 30%, rgba(75,92,255,.34), transparent 34%), radial-gradient(circle at 10% 80%, rgba(57,180,174,.11), transparent 30%); }
.c3-header { position: relative; z-index: 2; height: 84px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255,255,255,.1); }
.logo-light { display: grid; place-items: center; width: 76px; height: 64px; padding: 4px; border-radius: 8px; background: rgba(255,255,255,.94); }
.brand-c3 img { display: block; width: 62px; height: 55px; object-fit: contain; }
.c3-header nav { display: flex; gap: 37px; color: #b1bdd5; font-size: 11px; }
.c3-head-actions { display: flex; align-items: center; gap: 22px; font-size: 11px; }.c3-button { display: inline-flex; align-items: center; gap: 20px; padding: 16px 20px; border-radius: 7px; color: #07132a; background: var(--mint); font-size: 11px; font-weight: 800; box-shadow: 0 10px 30px rgba(97,230,193,.14); }.c3-button.small { padding: 11px 15px; font-size: 9px; }
.c3-hero { position: relative; display: grid; grid-template-columns: .9fr 1.1fr; gap: 65px; align-items: center; min-height: 660px; padding-block: 75px 100px; }
.c3-badge { display: inline-flex; align-items: center; gap: 9px; padding: 7px 10px; border-radius: 30px; color: #aebbd3; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.09); font-size: 8px; text-transform: uppercase; letter-spacing: .15em; font-weight: 700; }.c3-badge i { width: 5px; height: 5px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 8px var(--mint); }
.c3-copy h1 { font-size: clamp(47px, 4.7vw, 70px); line-height: 1.06; letter-spacing: -.06em; margin: 25px 0; }.c3-copy h1 em { color: var(--mint); font-style: normal; }
.c3-copy > p { max-width: 600px; color: #8e9bb9; line-height: 1.75; font-size: 14px; }.c3-copy .hero-actions { margin-top: 32px; }
.c3-play { display: flex; align-items: center; gap: 9px; color: #cbd5eb; font-size: 10px; font-weight: 700; }.c3-play i { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #65718e; border-radius: 50%; font-size: 8px; font-style: normal; }
.c3-proof { display: flex; align-items: center; gap: 22px; margin-top: 52px; }.c3-proof > i { width: 1px; height: 30px; background: #38415a; }.c3-proof span { display: flex; flex-direction: column; }.c3-proof strong { font-size: 16px; }.c3-proof small { color: #74819e; font-size: 7px; margin-top: 3px; }
.c3-console { position: relative; z-index: 1; display: grid; grid-template-columns: 54px 1fr; width: 100%; min-height: 480px; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; background: rgba(13,20,46,.86); box-shadow: 0 35px 90px rgba(0,0,0,.38); backdrop-filter: blur(18px); transform: perspective(1200px) rotateY(-3deg) rotateX(1deg); overflow: visible; }
.console-nav { display: flex; flex-direction: column; align-items: center; gap: 30px; padding: 17px 0; border-right: 1px solid rgba(255,255,255,.08); color: #64708e; }.mini-logo { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 7px; background: var(--mint); color: #091126; font-size: 8px; font-weight: 800; margin-bottom: 9px; }.console-nav i { font-style: normal; font-size: 12px; }.console-nav i.active { color: var(--mint); }.console-nav > span { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: #34405f; font-size: 6px; margin-top: auto; }
.console-main { padding: 23px; }.console-head { display: flex; align-items: center; justify-content: space-between; }.console-head p { display: flex; flex-direction: column; margin: 0; }.console-head small, .health-card p > span { color: #687692; font-size: 6px; letter-spacing: .14em; }.console-head strong { font-size: 16px; margin-top: 4px; }.console-head > div { display: flex; gap: 8px; align-items: center; }.console-head button { background: #151e3d; color: #8e9ab7; border: 1px solid #2d3756; border-radius: 5px; font-size: 6px; padding: 7px 9px; }.console-head i { display: grid; place-items: center; width: 25px; height: 25px; background: #151e3d; border: 1px solid #2d3756; border-radius: 5px; color: #8290ad; font-style: normal; }
.health-card { display: flex; justify-content: space-between; align-items: center; margin: 22px 0 12px; padding: 17px; border: 1px solid rgba(97,230,193,.2); border-radius: 8px; background: linear-gradient(100deg, rgba(97,230,193,.1), rgba(68,77,189,.08)); }.health-card p { display: flex; flex-direction: column; margin: 0; }.health-card strong { color: var(--mint); font-size: 15px; margin: 6px 0 3px; }.health-card small { color: #7886a3; font-size: 7px; }.health-score { display: flex; align-items: baseline; }.health-score b { font-size: 29px; }.health-score span { color: #71809d; font-size: 9px; }
.console-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.console-metrics > div { display: flex; flex-direction: column; padding: 14px; border-radius: 7px; border: 1px solid #252f4e; background: #101831; }.console-metrics span, .console-chart span { color: #6e7c99; font-size: 6px; letter-spacing: .1em; }.console-metrics strong { font-size: 15px; margin: 7px 0 4px; }.console-metrics small { color: var(--mint); font-size: 6px; }.console-metrics div:last-child small { color: #8390ab; }
.console-chart { margin-top: 10px; padding: 14px 14px 0; background: #101831; border: 1px solid #252f4e; border-radius: 7px; }.console-chart > div { display: flex; justify-content: space-between; }.console-chart b { color: #8290aa; font-size: 6px; font-weight: 500; }.console-chart svg { width: 100%; height: 100px; display: block; margin-top: 5px; }
.console-toast { position: absolute; right: -28px; bottom: -28px; display: flex; align-items: center; gap: 10px; padding: 12px; width: 235px; background: #f6f8ff; color: #0e1730; border-radius: 8px; box-shadow: 0 15px 40px rgba(0,0,0,.3); }.console-toast > i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 6px; background: #d8f7ed; color: #15997c; font-style: normal; }.console-toast span { display: flex; flex-direction: column; flex: 1; }.console-toast b { font-size: 8px; }.console-toast small { color: #7c869d; font-size: 6px; margin-top: 3px; }.console-toast button { color: #2639c6; border: 0; background: transparent; font-size: 7px; font-weight: 800; }
.c3-trust { border-block: 1px solid rgba(255,255,255,.09); background: #0b1128; }.c3-trust .container { height: 82px; display: flex; justify-content: space-between; align-items: center; color: #687590; }.c3-trust span { font-size: 7px; text-transform: uppercase; letter-spacing: .15em; }.c3-trust b { font-size: 9px; letter-spacing: .05em; color: #8793ad; }
.c3-solutions { padding-top: 115px; padding-bottom: 120px; }.c3-section-title { display: grid; grid-template-columns: 1fr 2fr 1.2fr; gap: 50px; align-items: start; }.c3-section-title > span { color: var(--mint); font-size: 8px; letter-spacing: .14em; }.c3-section-title h2 { font-size: 41px; line-height: 1.16; letter-spacing: -.05em; margin: 0; }.c3-section-title p { color: #7d8aa7; line-height: 1.7; font-size: 11px; margin: 0; }
.c3-card-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; margin-top: 55px; }.c3-card-grid a { position: relative; min-height: 280px; padding: 25px; border: 1px solid #26304b; border-radius: 8px; background: linear-gradient(145deg,#101831,#0b1229); transition: .25s; }.c3-card-grid a:hover { transform: translateY(-7px); border-color: #5865dc; background: linear-gradient(145deg,#172043,#0d1530); }.c3-card-num { position: absolute; right: 20px; top: 20px; color: #4c5874; font-size: 8px; }.c3-card-grid a > i { display: grid; place-items: center; width: 40px; height: 40px; background: rgba(97,230,193,.1); color: var(--mint); border-radius: 8px; font-style: normal; font-size: 19px; }.c3-card-grid h3 { margin-top: 35px; font-size: 17px; }.c3-card-grid p { min-height: 52px; color: #75829e; font-size: 10px; line-height: 1.7; }.c3-card-grid b { color: var(--mint); font-size: 8px; }
.c3-cta { padding: 105px 24px 135px; text-align: center; background: linear-gradient(135deg,#4457f0,#2930a5); }.c3-cta > span { font-size: 8px; letter-spacing: .17em; color: #bbc3ff; }.c3-cta h2 { font-size: 52px; letter-spacing: -.05em; line-height: 1.1; }.c3-cta h2 em { color: var(--mint); font-style: normal; }.c3-button.light { background: white; color: #2431b9; }

@media (max-width: 980px) {
  .container { width: min(100% - 34px, 760px); }
  nav { display: none !important; }
  .menu-button { display: block; }
  .c1-header .button-outline, .c2-login, .c3-head-actions { display: none; }
  .c1-hero, .c3-hero { grid-template-columns: 1fr; padding-block: 70px 100px; }
  .c1-dashboard { justify-self: center; width: min(100%, 520px); }
  .service-grid { grid-template-columns: 1fr 1fr; }.service-grid a:nth-child(2) { border-right: 0; }.service-grid a { border-bottom: 1px solid #dce5e4; }
  .c2-hero { grid-template-columns: 1fr 1fr; }.c2-side-note { display: none; }.c2-copy { padding-left: 5vw; }.c2-sticker { display: none; }
  .c2-solutions, .c2-portal { grid-template-columns: 1fr; }.c2-title h2 br { display: none; }
  .c3-console { max-width: 680px; justify-self: center; }.c3-section-title { grid-template-columns: 1fr 2.5fr; }.c3-section-title p { grid-column: 2; }
}

@media (max-width: 680px) {
  .concept-switcher { bottom: 10px; width: calc(100% - 20px); padding: 7px; justify-content: center; }.switcher-label { display: none; }.switcher-buttons { width: 100%; }.concept-button { flex: 1; padding-inline: 6px; }
  .c1-hero-copy h1, .c2-copy h1, .c3-copy h1 { font-size: 42px; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .floating-secure { right: -8px; bottom: -34px; }
  .logo-strip .container { min-height: 120px; flex-wrap: wrap; gap: 20px; padding-block: 20px; }.logo-strip span { width: 100%; }
  .section-heading { grid-template-columns: 1fr; gap: 15px; }.section-heading h2, .c1-cta h2 { font-size: 34px; }
  .service-grid { grid-template-columns: 1fr; }.service-grid a { border-right: 0; min-height: 250px; }
  .c2-hero { grid-template-columns: 1fr; }.c2-copy { padding: 70px 24px; }.c2-visual { padding: 0 24px 70px; }.c2-photo, .abstract-person { min-height: 430px; }.note-card { left: 10px; }.round-label { right: 10px; }
  .c2-solutions, .c2-portal { padding: 85px 24px; }.c2-list a { grid-template-columns: 34px 1fr 25px; }.c2-list p { display: none; }.c2-app { grid-template-columns: 40px 1fr; overflow: visible; }.app-content { padding: 18px 12px; }.tax-row { grid-template-columns: 32px 1fr auto; }.tax-row > strong { display: none; }.app-sidebar { gap: 26px; }.app-cards { grid-template-columns: 1fr; }.c2-footer { align-items: flex-start; gap: 30px; flex-direction: column; }.c2-footer h2 { font-size: 43px; }
  .c3-hero { padding-top: 60px; }.c3-proof { gap: 11px; }.c3-proof > i { display: none; }.c3-console { grid-template-columns: 38px 1fr; min-height: 440px; transform: none; }.console-main { padding: 15px 10px; }.console-nav { gap: 26px; }.console-metrics { grid-template-columns: 1fr; }.console-metrics > div:nth-child(2) { display: none; }.console-toast { right: -6px; bottom: -38px; }.c3-trust .container { flex-wrap: wrap; height: auto; gap: 20px; padding-block: 25px; }.c3-trust span { width: 100%; }.c3-section-title { grid-template-columns: 1fr; }.c3-section-title p { grid-column: auto; }.c3-card-grid { grid-template-columns: 1fr; }.c3-cta h2 { font-size: 41px; }
}
