@font-face{
  font-family:Manrope;
  src:url('../fonts/manrope-latin.woff2') format('woff2');
  font-style:normal;
  font-weight:400 800;
  font-display:swap
}
:root{
  --brand-blue:#3a86ff;
  --action:#1764d9;
  --action-hover:#0a4eb7;
  --green:#05dd7c;
  --green-ink:#007645;
  --ink:#132231;
  --muted:#546578;
  --line:#dce4ed;
  --surface:#f4f7fb;
  --blue-soft:#eaf2ff;
  --white:#fff;
  --radius:14px;
  --ease:cubic-bezier(.16,1,.3,1);
  --space-section:112px;
  --max-width:1280px;
  --elevation:0 22px 64px -28px #263e6440
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:105px;
  scrollbar-color:#9caec2 #f4f7fb
}
body{
  margin:0;
  color:var(--ink);
  background:var(--white);
  font-family:Manrope,sans-serif;
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased
}
body.menu-open{
  overflow:hidden
}
::selection{
  background:#bcf5d9;
  color:#122f25
}
input,textarea{
  caret-color:var(--action)
}
a{
  color:inherit;
  text-decoration:none;
  text-underline-offset:.25em
}
button,input,textarea,select{
  font:inherit
}
button{
  cursor:pointer
}
button:disabled{
  cursor:not-allowed;
  opacity:.55
}
img{
  max-width:100%;
  display:block;
  height:auto
}
figure{
  margin:0
}
h1,h2,h3,h4,p{
  margin-top:0
}
h1,h2,h3,h4{
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.035em;
  text-wrap:balance
}
h1{
  font-size:clamp(46px,5.4vw,76px);
  font-weight:800;
  line-height:1.09;
  margin-bottom:26px
}
h1>span,h1 span:not(.brand-period){
  color:var(--action)
}
h2{
  font-size:clamp(32px,3.35vw,46px);
  margin-bottom:24px
}
h3{
  font-size:24px;
  line-height:1.25;
  letter-spacing:-.025em
}
p{
  margin-bottom:20px;
  color:var(--muted)
}
p:last-child{
  margin-bottom:0
}
button,a,input,textarea,summary{
  -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--action);
  outline-offset:5px
}
button{
  color:inherit
}
button .icon,a .icon{
  flex-shrink:0
}
.icon{
  width:22px;
  height:22px;
  vertical-align:middle;
  flex-shrink:0
}
ul{
  padding:0;
  list-style:none
}
.container{
  width:min(var(--max-width),calc(100% - 112px));
  margin-inline:auto
}
.section{
  padding-block:var(--space-section)
}
.surface-soft{
  background:var(--surface)
}
.text-link{
  color:var(--action);
  display:inline-flex;
  align-items:center;
  gap:16px;
  font-size:15px;
  font-weight:650;
  line-height:1.5
}
.text-link:hover{
  text-decoration:underline
}
.text-link .icon{
  transition:transform .3s var(--ease)
}
.text-link:hover .icon{
  transform:translateX(4px)
}
.button{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:20px;
  min-height:52px;
  padding:13px 24px;
  border:1px solid transparent;
  border-radius:8px;
  font-size:15px;
  font-weight:650;
  line-height:1.4;
  transition:background .2s,color .2s,transform .3s var(--ease);
  text-align:center
}
.button:hover{
  transform:translateY(-2px)
}
.button-blue{
  background:var(--action);
  color:white
}
.button-blue:hover{
  background:var(--action-hover)
}
.button-dark{
  background:var(--ink);
  color:white
}
.button-dark:hover{
  background:#294359
}
.button-white{
  background:white;
  color:var(--ink)
}
.button-white:hover{
  background:#e5fff2
}
.button-white .icon{
  color:var(--green-ink)
}
.skip-link{
  position:fixed;
  left:18px;
  top:-100px;
  padding:10px 20px;
  background:var(--ink);
  color:white;
  z-index:100
}
.skip-link:focus{
  top:14px
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
[hidden]{
  display:none!important
}
.brand-period{
  color:var(--green)!important
}
.site-header{
  height:88px;
  position:sticky;
  top:0;
  z-index:40;
  background:#fff;
  border-bottom:1px solid transparent;
  transition:border-color .2s
}
.site-header.is-scrolled{
  border-color:var(--line)
}
.header-inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:36px
}
.brand{
  display:flex;
  align-items:center;
  flex-shrink:0
}
.brand img{
  width:104px;
  height:42px
}
.navigation{
  display:flex;
  align-items:center;
  gap:34px
}
.navigation>a:not(.button){
  font-size:14px;
  font-weight:550;
  line-height:2.5;
  position:relative
}
.navigation>a:not(.button):hover{
  color:var(--action)
}
.navigation>a[aria-current=page]:after{
  content:'';
  position:absolute;
  bottom:0;
  left:0;
  width:24px;
  height:3px;
  background:var(--green);
  border-radius:2px
}
.header-cta{
  margin-left:34px;
  min-height:44px;
  padding:10px 18px;
  font-size:13px
}
.header-cta .icon{
  width:18px;
  height:18px
}
.navigation>a,.systems-menu>summary{
  white-space:nowrap
}
/* Entre o menu móvel e o desktop largo, os seis itens precisam caber em uma linha. */
@media(min-width:801px) and (max-width:1000px){
  .navigation{
    gap:16px
  }
  .header-cta{
    padding:10px 14px;
    gap:0
  }
  .header-cta .icon{
    display:none
  }
}
@media(min-width:801px) and (max-width:900px){
  .header-inner{
    gap:14px
  }
  .navigation{
    gap:12px
  }
  .header-cta{
    margin-left:0;
    padding:10px 12px
  }
  .brand img{
    width:88px;
    height:36px
  }
  .nav-extra{
    display:none
  }
}
.menu-toggle{
  display:none
}
.home-hero{
  padding-top:49px;
  text-align:center;
  overflow:hidden
}
.hero-copy{
  position:relative;
  z-index:1
}
.hero-copy h1{
  margin-bottom:24px
}
.hero-copy p{
  font-size:18px;
  line-height:1.6;
  color:#435568;
  margin-bottom:27px
}
.hero-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:32px
}
.hero-showcase{
  max-width:1300px;
  width:calc(100% - 32px);
  margin:28px auto 0
}
.hero-showcase>img{
  width:100%;
  height:auto;
  max-height:630px;
  object-fit:contain
}
.hero-showcase figcaption{
  font-size:11px;
  line-height:1.6;
  color:#607085;
  margin-top:0;
  margin-bottom:36px
}
.audience-paths{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.audience-paths>a{
  position:relative;
  padding:25px 36px;
  display:grid;
  grid-template-columns:1fr auto;
  text-align:left;
  align-items:center;
  transition:background .2s
}
.audience-paths>a:first-child{
  border-right:1px solid var(--line)
}
.audience-paths>a:hover{
  background:var(--surface)
}
.audience-paths>a>span:first-child{
  font-size:26px;
  letter-spacing:-.025em;
  line-height:1.3;
  font-weight:550
}
.audience-paths .path-caption{
  grid-column:1;
  font-size:12px;
  color:var(--muted);
  margin-top:5px
}
.audience-paths .icon{
  grid-column:2;
  grid-row:1/3;
  color:var(--action);
  width:28px;
  height:28px
}
.audience-paths>a:last-child .icon{
  color:var(--green-ink)
}
.intro-section{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
  align-items:start
}
.intro-text{
  max-width:560px
}
.intro-text>p:first-child{
  color:var(--ink);
  font-size:23px;
  line-height:1.55;
  letter-spacing:-.02em
}
.intro-text>p{
  font-size:16px
}
.intro-text .text-link{
  margin-top:10px
}
.section-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  margin-bottom:44px
}
.section-heading h2{
  margin:0
}
.section-heading>p{
  max-width:410px;
  font-size:16px
}
.section-heading>.text-link{
  margin-bottom:5px
}
.section-end-link{
  margin-top:32px
}
.explorer-tabs{
  display:none;
  border-bottom:1px solid #ced9e5;
  margin-bottom:26px;
  gap:30px
}
.js .explorer-tabs{
  display:flex
}
.explorer-tabs button{
  background:none;
  border:0;
  border-bottom:3px solid transparent;
  padding:16px 0 18px;
  text-align:left;
  font-size:14px;
  color:var(--muted);
  font-weight:600;
  display:flex;
  gap:20px;
  align-items:center;
  min-height:52px;
  flex:1
}
.explorer-tabs button .icon{
  margin-left:auto;
  width:18px;
  opacity:0;
  transition:opacity .2s
}
.explorer-tabs button:hover{
  color:var(--ink)
}
.explorer-tabs button[aria-selected=true]{
  color:var(--ink);
  border-bottom-color:var(--green)
}
.explorer-tabs button[aria-selected=true] .icon{
  opacity:1;
  color:var(--action)
}
.explorer-description{
  display:flex;
  gap:40px;
  justify-content:space-between;
  align-items:flex-start;
  padding-block:13px 28px
}
.explorer-description>h3{
  font-size:23px;
  max-width:330px;
  margin:0
}
.explorer-description>p{
  font-size:14px;
  max-width:510px;
  margin:0;
  line-height:1.65
}
.explorer-panel.is-entering{
  animation:interface-reveal .5s var(--ease)
}
@keyframes interface-reveal{
  from{
    clip-path:inset(0 0 8% 0);
    opacity:.65
  }
  to{
    clip-path:inset(0);
    opacity:1
  }
}
.demo-window{
  border-radius:var(--radius);
  overflow:hidden;
  background:white;
  box-shadow:var(--elevation);
  font-size:12px;
  line-height:1.5;
  text-align:left;
  min-width:0
}
.demo-titlebar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  height:44px;
  background:#e9eef5;
  padding:0 22px;
  color:#526477;
  font-size:10px
}
.window-lights{
  display:flex;
  gap:5px
}
.window-lights i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#a5b5c7
}
.window-lights i:first-child{
  background:#87a3c5
}
.window-lights i:last-child{
  background:#81b89f
}
.demo-secure{
  display:flex;
  gap:5px;
  align-items:center
}
.demo-secure>.icon{
  width:12px;
  height:12px;
  color:var(--green-ink)
}
.demo-layout{
  display:grid;
  grid-template-columns:180px 1fr;
  min-height:410px
}
.demo-sidebar{
  background:#f8fafd;
  padding:28px 14px 20px;
  display:flex;
  flex-direction:column;
  gap:9px
}
.demo-sidebar>img{
  margin:0 12px 24px;
  width:64px;
  height:26px
}
.demo-sidebar>span{
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 12px;
  font-size:10px;
  color:#536579
}
.demo-sidebar>span>.icon{
  width:15px;
  height:15px
}
.demo-sidebar>.is-selected{
  color:var(--action);
  background:#e8f0ff;
  border-radius:6px
}
.demo-sidebar-bottom{
  margin-top:auto;
  display:flex;
  align-items:center;
  gap:9px;
  font-size:9px;
  color:#4f6174;
  padding-top:50px
}
.demo-main{
  padding:30px 36px 20px;
  min-width:0
}
.demo-top{
  display:flex;
  gap:15px;
  align-items:center;
  justify-content:space-between;
  margin-bottom:23px
}
.demo-top h3{
  font-size:22px;
  letter-spacing:-.03em;
  margin-bottom:7px;
  font-weight:700
}
.demo-top p{
  font-size:10px;
  margin-bottom:0
}
.demo-tool{
  color:#7b8fa4
}
.demo-tool .icon{
  width:17px;
  height:17px
}
.demo-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:15px
}
.demo-filter{
  display:inline-flex;
  gap:18px;
  border:1px solid #dde5ef;
  padding:7px 11px;
  border-radius:5px;
  font-size:10px
}
.demo-filter .icon{
  width:13px;
  height:13px
}
.demo-control{
  display:inline-flex;
  gap:12px;
  align-items:center;
  background:var(--action);
  color:white;
  border-radius:5px;
  padding:8px 11px;
  font-size:10px;
  white-space:nowrap
}
.demo-control .icon{
  width:13px;
  height:13px
}
.demo-table-wrap{
  overflow:auto;
  scrollbar-width:thin
}
.demo-table{
  width:100%;
  border-collapse:collapse;
  font-size:10px;
  white-space:nowrap
}
.demo-table th{
  padding:10px 12px;
  text-align:left;
  color:#4f6174;
  font-size:9px;
  font-weight:500;
  background:#f7f9fc
}
.demo-table td{
  padding:14px 12px;
  border-bottom:1px solid #eaf0f5;
  color:#53667a
}
.demo-table td:first-child{
  display:flex;
  gap:10px;
  align-items:center;
  color:var(--ink)
}
.demo-table td small{
  display:block;
  font-size:8px;
  color:#4f6174;
  margin-top:3px
}
.avatar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50%;
  font-size:9px;
  font-weight:700;
  flex-shrink:0;
  background:#eaf2ff;
  color:#1754a1
}
.tint-blue{
  background:#e7effd;
  color:#285aa1
}
.tint-lilac{
  background:#eeebf9;
  color:#725c97
}
.tint-green{
  background:#dff5e9;
  color:#187650
}
.status{
  font-size:9px;
  padding:4px 7px;
  border-radius:4px;
  white-space:nowrap
}
.status-blue{
  background:#e7efff;
  color:#205fb4
}
.status-amber{
  background:#fff2d5;
  color:#8a631e
}
.status-green{
  background:#dcf8e9;
  color:#13724b
}
.demo-note{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:10px;
  color:#5e7383;
  padding-top:20px
}
.demo-note>.icon{
  width:15px;
  height:15px;
  color:var(--green-ink)
}
.demo-disclaimer{
  text-align:center;
  font-size:11px;
  line-height:1.6;
  margin:23px 0 0;
  color:var(--muted)
}
.portal-project{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:22px;
  align-items:center;
  background:#f4f7fb;
  padding:22px;
  border-radius:8px;
  min-height:205px
}
.portal-project h4{
  font-size:22px;
  margin-block:14px 7px
}
.portal-project p{
  font-size:11px;
  line-height:1.6;
  max-width:230px
}
.portal-preview{
  background:#d9e5ef;
  padding:17px 22px;
  position:relative;
  overflow:hidden;
  min-height:170px
}
.portal-preview>span{
  display:block;
  font-size:7px;
  font-weight:700;
  letter-spacing:.18em
}
.portal-preview>strong{
  font-size:19px;
  line-height:1.2;
  font-weight:500;
  display:block;
  margin-top:18px;
  position:relative;
  z-index:1
}
.architecture-lines{
  position:absolute;
  bottom:-10px;
  right:14px;
  display:flex;
  align-items:flex-end;
  gap:6px;
  transform:skewY(-8deg)
}
.architecture-lines i{
  display:block;
  width:35px;
  height:90px;
  background:#adc0d1;
  border-top:4px solid #f0f5fa
}
.architecture-lines i:nth-child(2){
  height:120px;
  background:#bbcddb
}
.architecture-lines i:nth-child(3){
  height:145px;
  background:#a1b7ca
}
.portal-files{
  display:flex;
  gap:16px;
  margin-top:16px
}
.portal-files>span{
  display:flex;
  gap:8px;
  align-items:center;
  flex:1;
  border-bottom:1px solid var(--line);
  padding:9px 0;
  font-size:9px
}
.portal-files .icon{
  width:15px
}
.portal-files small{
  margin-left:auto;
  color:#6d7c8a
}
.kanban{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15px
}
.kanban-column{
  background:#f4f7fb;
  border-radius:6px;
  padding:13px 10px;
  min-height:264px
}
.kanban-column h4{
  font-size:10px;
  letter-spacing:0;
  font-weight:600;
  display:flex;
  gap:7px;
  align-items:center;
  margin-bottom:14px
}
.kanban-column h4>span{
  margin-left:auto;
  font-size:9px;
  font-weight:400;
  color:#6b7e8f
}
.dot{
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%
}
.dot-blue{
  background:var(--brand-blue)
}
.dot-green{
  background:var(--green)
}
.dot-amber{
  background:#d8a23c
}
.task{
  background:white;
  border-radius:5px;
  padding:13px;
  margin-bottom:9px
}
.task>small{
  font-size:8px;
  color:#637b93
}
.task>strong{
  display:block;
  font-size:11px;
  line-height:1.5;
  font-weight:600;
  margin-block:6px 15px
}
.task>span{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:8px;
  color:#697b8e
}
.task .avatar{
  width:21px;
  height:21px;
  font-size:7px
}
.agency-feature{
  display:grid;
  grid-template-columns:.85fr 1.25fr;
  gap:68px;
  align-items:center
}
.agency-copy p{
  font-size:15px;
  max-width:440px
}
.agency-copy .button{
  margin-top:12px
}
.agency-image{
  min-width:0
}
.agency-image img{
  width:100%;
  border-radius:var(--radius)
}
.agency-image figcaption,.wide-image figcaption{
  font-size:10px;
  text-align:right;
  color:var(--muted);
  padding-top:10px
}
.process-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  list-style:none;
  margin:60px 0 0;
  padding:0;
  gap:38px
}
.process-strip>li{
  border-top:1px solid #cdd9e7;
  padding-top:20px
}
.process-strip>li>span{
  font-size:12px;
  color:var(--action);
  font-variant-numeric:tabular-nums;
  font-weight:650
}
.process-strip h3{
  font-size:23px;
  margin-block:30px 14px
}
.process-strip p{
  font-size:14px
}
.about-statement{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:100px
}
.about-statement h2{
  font-size:35px
}
.about-statement p{
  font-size:15px
}
.about-statement h2 span{
  color:var(--action)
}
.about-statement .about-lead{
  font-size:19px;
  line-height:1.6;
  color:var(--ink)
}
.footer-since{
  display:block;
  margin-top:12px
}
.contact-band{
  background:#155cc9;
  color:white;
  padding-block:72px;
  position:relative
}
.contact-band-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:60px
}
.contact-band h2{
  font-size:40px;
  max-width:680px;
  margin-bottom:20px
}
.contact-band h2:after{
  content:'';
  display:inline-block;
  width:9px;
  height:9px;
  margin-left:5px;
  background:var(--green);
  border-radius:50%
}
.contact-band p{
  color:#deebff;
  max-width:610px;
  font-size:15px
}
.contact-band .button{
  flex-shrink:0
}
.site-footer{
  padding-top:70px;
  background:#fff
}
.footer-main{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:70px;
  padding-bottom:64px
}
.footer-brand p{
  font-size:18px;
  margin:20px 0 10px;
  color:var(--ink);
  font-weight:550
}
.footer-brand>span{
  font-size:13px;
  color:var(--muted)
}
.site-footer h2{
  font-size:13px;
  letter-spacing:0;
  font-weight:700;
  margin:4px 0 23px
}
.site-footer ul{
  margin:0
}
.site-footer li{
  margin-bottom:12px
}
.site-footer li a{
  font-size:13px;
  color:var(--muted)
}
.site-footer a:hover{
  color:var(--action)
}
.site-footer li .icon{
  width:15px;
  height:15px;
  margin-left:6px
}
.footer-bottom{
  border-top:1px solid var(--line);
  display:flex;
  gap:40px;
  justify-content:space-between;
  padding-block:22px;
  font-size:11px;
  color:var(--muted)
}
.footer-bottom>span:last-child{
  margin-left:auto
}
.cookie-banner{
  position:fixed;
  left:24px;
  bottom:24px;
  z-index:60;
  width:min(440px,calc(100% - 32px));
  background:white;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--elevation);
  padding:22px 24px
}
.cookie-banner h2{
  font-size:17px;
  letter-spacing:-.02em;
  margin-bottom:8px
}
.cookie-banner p{
  font-size:13px;
  line-height:1.6;
  margin-bottom:16px
}
.cookie-banner p a{
  color:var(--action);
  text-decoration:underline
}
.cookie-options{
  border:0;
  padding:0;
  margin:0 0 16px;
  display:grid;
  gap:12px
}
.cookie-options label{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:12px;
  line-height:1.5;
  color:var(--muted);
  cursor:pointer
}
.cookie-options input{
  margin-top:3px;
  width:16px;
  height:16px;
  accent-color:var(--action);
  flex-shrink:0
}
.cookie-options strong{
  display:block;
  color:var(--ink);
  font-size:13px
}
.cookie-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px
}
.cookie-actions .button{
  min-height:44px;
  padding:10px 16px;
  font-size:14px
}
.cookie-customize{
  grid-column:1/-1;
  background:none;
  border:0;
  padding:6px;
  font-size:13px;
  font-weight:650;
  color:var(--action);
  text-decoration:underline
}
.cookie-banner-open .whatsapp-float{
  display:none
}
.footer-link-button{
  background:none;
  border:0;
  padding:0;
  font:inherit;
  color:inherit;
  text-decoration:underline;
  text-underline-offset:.25em
}
.whatsapp-float{
  position:fixed;
  right:24px;
  bottom:24px;
  width:49px;
  height:49px;
  background:var(--ink);
  color:white;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:30;
  box-shadow:0 6px 20px -8px #0b203e66;
  transition:background .2s,transform .2s
}
.whatsapp-float .icon{
  width:25px;
  height:25px;
  color:var(--green)
}
.whatsapp-float:hover{
  background:#24415b;
  transform:translateY(-3px)
}
.inner-hero{
  padding-block:76px 60px;
  text-align:center
}
.inner-hero h1{
  font-size:clamp(42px,5vw,68px);
  margin-bottom:27px
}
.inner-hero>p{
  font-size:18px;
  max-width:650px;
  line-height:1.65;
  margin:0 auto 30px
}
.inner-hero>.button{
  margin-top:2px
}
.system-demonstration{
  max-width:1080px;
  margin-bottom:12px
}
.split-heading{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px
}
.split-heading .large-copy{
  font-size:22px;
  line-height:1.55;
  color:var(--ink)
}
.split-heading p{
  font-size:16px
}
.service-list{
  margin-top:60px
}
.service-row{
  display:grid;
  grid-template-columns:.9fr 1.3fr 30px;
  gap:50px;
  padding:34px 0;
  border-top:1px solid #ced9e5;
  align-items:start
}
.service-row:last-child{
  border-bottom:1px solid #ced9e5
}
.service-row>h3{
  font-size:24px;
  margin:0
}
.service-row p{
  font-size:15px;
  margin-bottom:12px;
  max-width:550px
}
.service-row div>span{
  font-size:11px;
  color:#627b95
}
.service-row>.icon{
  color:var(--action);
  width:24px;
  height:24px
}
.approach{
  text-align:center;
  max-width:850px
}
.approach>p{
  max-width:660px;
  margin:0 auto 28px
}
.wide-image{
  max-width:1150px
}
.wide-image img{
  width:100%;
  max-height:580px;
  object-fit:cover;
  object-position:50% 50%;
  border-radius:var(--radius)
}
.agency-services{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:45px 100px
}
.agency-services article{
  border-top:1px solid #ced9e5;
  padding-top:28px
}
.agency-services h3{
  font-size:24px;
  margin-bottom:16px
}
.agency-services p{
  font-size:15px;
  max-width:480px
}
.partnership h2{
  text-align:center;
  margin-bottom:58px
}
.partnership-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}
.partnership-options article{
  padding:0 40px 5px
}
.partnership-options article+article{
  border-left:1px solid var(--line)
}
.partnership-options h3{
  font-size:26px
}
.partnership-options p{
  font-size:15px
}
.partnership-options .text-link{
  margin-top:12px
}
.possibilities-explorer{
  padding-bottom:15px
}
.example-details>h2{
  margin-bottom:54px
}
.example-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:44px
}
.example-grid article{
  border-top:1px solid var(--line);
  padding-top:25px
}
.example-grid h3{
  font-size:23px;
  line-height:1.35;
  margin-bottom:20px
}
.example-grid p{
  font-size:14px;
  line-height:1.8
}
.example-grid article>span{
  font-size:11px;
  color:var(--green-ink);
  font-weight:600
}
.compact-statement{
  text-align:center;
  max-width:800px
}
.compact-statement p{
  max-width:640px;
  margin:0 auto 28px
}
.process-details{
  max-width:1030px;
  padding-bottom:100px
}
.process-details>ol{
  list-style:none;
  padding:0;
  margin:0
}
.process-details li{
  display:grid;
  grid-template-columns:100px 1fr;
  gap:65px;
  padding:45px 0;
  border-top:1px solid var(--line)
}
.step-number{
  font-size:44px;
  line-height:1;
  color:var(--brand-blue);
  font-weight:400;
  letter-spacing:-.04em;
  font-variant-numeric:tabular-nums
}
.process-details h2{
  font-size:32px;
  margin-bottom:20px
}
.process-details p{
  max-width:660px;
  font-size:16px
}
.step-outcome{
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--green-ink);
  font-size:13px;
  margin-top:3px
}
.step-outcome .icon{
  width:17px;
  height:17px
}
.faq-section{
  display:grid;
  grid-template-columns:.9fr 1.25fr;
  gap:85px
}
.faq-section h2{
  font-size:38px
}
.faq-list details{
  border-bottom:1px solid #ced9e5
}
.faq-list details:first-child{
  border-top:1px solid #ced9e5
}
.faq-list summary{
  display:flex;
  justify-content:space-between;
  gap:22px;
  align-items:center;
  cursor:pointer;
  list-style:none;
  padding:24px 0;
  font-size:15px;
  font-weight:600;
  line-height:1.55
}
.faq-list summary::-webkit-details-marker{
  display:none
}
.faq-list summary .icon{
  width:19px;
  height:19px;
  transition:transform .2s
}
.faq-list details[open] summary .icon{
  transform:rotate(45deg);
  color:var(--green-ink)
}
.faq-list details>p{
  font-size:14px;
  padding:0 30px 25px 0;
  line-height:1.8
}
.contact-page{
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  gap:85px;
  padding-block:80px 112px;
  align-items:start
}
.contact-intro h1{
  font-size:clamp(44px,4.6vw,64px)
}
.contact-intro>p{
  font-size:17px;
  max-width:360px
}
.direct-contacts{
  margin-top:50px
}
.direct-contacts>a{
  display:flex;
  align-items:center;
  gap:18px;
  padding:20px 0;
  max-width:390px;
  border-top:1px solid var(--line)
}
.direct-contacts>a:last-child{
  border-bottom:1px solid var(--line)
}
.direct-contacts>a>.icon:first-child{
  color:var(--green-ink);
  width:25px;
  height:25px
}
.direct-contacts>a>.icon:last-child{
  margin-left:auto;
  color:#75899d;
  width:19px;
  height:19px
}
.direct-contacts span{
  font-size:12px;
  color:var(--muted)
}
.direct-contacts strong{
  display:block;
  color:var(--ink);
  font-size:16px;
  font-weight:550;
  margin-top:3px
}
.contact-builder{
  display:none;
  background:var(--surface);
  padding:38px;
  border-radius:var(--radius);
  min-width:0
}
.js .contact-builder{
  display:block
}
.contact-builder h2{
  font-size:30px;
  margin-bottom:14px
}
.contact-builder>p{
  font-size:14px;
  margin-bottom:30px
}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.field{
  margin-bottom:23px
}
.field>label,.profile-field>legend{
  display:block;
  font-size:12px;
  font-weight:650;
  margin-bottom:9px;
  line-height:1.55
}
.field>label>span{
  font-size:10px;
  color:var(--muted);
  font-weight:400;
  white-space:nowrap
}
.field input,.field textarea{
  background:white;
  width:100%;
  border:1px solid #c5d2e0;
  border-radius:7px;
  padding:12px 13px;
  font-size:13px;
  line-height:1.6;
  color:var(--ink);
  min-height:46px;
  transition:border-color .2s
}
.field input:hover,.field textarea:hover{
  border-color:#879fb8
}
.field input:focus,.field textarea:focus{
  border-color:var(--action)
}
.field input::placeholder,.field textarea::placeholder{
  color:#64768a;
  opacity:1
}
.field textarea{
  resize:vertical;
  min-height:138px
}
.field-hint{
  display:flex;
  justify-content:space-between;
  gap:15px;
  font-size:10px;
  color:var(--muted);
  margin-top:5px
}
.field-hint>span:last-child{
  white-space:nowrap
}
.profile-field{
  border:0;
  padding:0;
  margin:0 0 24px;
  display:flex;
  gap:10px
}
.profile-field>legend{
  padding:0
}
.profile-field>label{
  display:flex;
  position:relative;
  flex:1;
  cursor:pointer
}
.profile-field input{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px
}
.profile-field span{
  display:block;
  width:100%;
  border:1px solid #c5d2e0;
  border-radius:7px;
  text-align:center;
  padding:11px 10px;
  font-size:12px;
  background:white;
  position:relative
}
.profile-field input:checked+span{
  border-color:var(--action);
  color:var(--action);
  background:#edf4ff
}
.profile-field input:checked+span:after{
  content:'';
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--green);
  margin-left:8px;
  vertical-align:middle
}
.profile-field input:focus-visible+span{
  outline:3px solid var(--action);
  outline-offset:3px
}
.form-submit{
  width:100%
}
.form-submit[aria-busy=true]{
  opacity:.7;
  pointer-events:none
}
.hp-field{
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden
}
.privacy-note{
  font-size:10px;
  line-height:1.7;
  margin-top:13px;
  color:var(--muted)
}
.privacy-note a{
  text-decoration:underline
}
.form-error{
  font-size:12px;
  color:#a02b36
}
.message-ready{
  border-top:1px solid #c5d2e0;
  margin-top:28px;
  padding-top:25px
}
.ready-heading{
  display:flex;
  gap:9px;
  align-items:center
}
.ready-heading>.icon{
  color:var(--green-ink)
}
.message-ready h3{
  font-size:21px;
  margin:0
}
.message-ready>p{
  font-size:12px;
  margin-top:10px
}
.message-ready pre{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font-family:inherit;
  font-size:12px;
  line-height:1.8;
  border-radius:7px;
  padding:18px;
  background:white;
  color:#42576c;
  margin:17px 0
}
.message-ready .button{
  width:100%
}
.message-ready .small-copy{
  text-align:center;
  font-size:10px
}
.reading-page{
  max-width:780px;
  padding-bottom:110px
}
.reading-page h2{
  font-size:26px;
  margin-top:44px
}
.reading-page p{
  font-size:16px
}
.reading-page a{
  color:var(--action);
  text-decoration:underline
}
.reading-page ul{
  list-style:disc;
  padding-left:22px;
  margin:0 0 20px;
  color:var(--muted)
}
.reading-page li{
  margin-bottom:8px
}
.reading-page strong{
  color:var(--ink)
}
.reading-page code{
  font-size:14px;
  background:var(--surface);
  padding:1px 6px;
  border-radius:4px
}
.reading-updated{
  font-size:14px!important
}
.not-found{
  padding-bottom:130px;
  min-height:65vh
}
.error-code{
  display:block;
  color:var(--green-ink);
  font-size:18px;
  margin-bottom:24px;
  font-variant-numeric:tabular-nums
}
@media(min-width:1600px){
  .container{
    width:min(var(--max-width),calc(100% - 160px))
  }
  .home-hero{
    padding-top:58px
  }
  .hero-showcase{
    margin-top:30px
  }
}
@media(max-width:1100px){
  :root{
    --space-section:88px
  }
  .container{
    width:calc(100% - 72px)
  }
  .navigation{
    gap:23px
  }
  .header-cta{
    margin-left:6px
  }
  .navigation>a:not(.button){
    font-size:12px
  }
  .header-inner{
    gap:24px
  }
  .intro-section,.split-heading,.about-statement{
    gap:50px
  }
  .agency-feature{
    gap:42px
  }
  .demo-layout{
    grid-template-columns:150px 1fr
  }
  .demo-main{
    padding:25px
  }
  .demo-top h3{
    font-size:20px
  }
  .demo-sidebar{
    padding-inline:10px
  }
  .demo-sidebar>span{
    font-size:9px;
    padding-inline:8px
  }
  .contact-page{
    gap:44px
  }
  .contact-builder{
    padding:28px
  }
  .contact-band h2{
    font-size:35px
  }
  .faq-section{
    gap:50px
  }
  .footer-main{
    gap:40px
  }
  .kanban{
    gap:8px
  }
  .task{
    padding:10px
  }
  .service-row{
    gap:30px
  }
  .agency-services{
    column-gap:65px
  }
  .partnership-options{
    gap:40px
  }
  .partnership-options article{
    padding-inline:20px
  }
}
@media(max-width:800px){
  .whatsapp-float{
    display:none;
  }
  :root{
    --space-section:72px
  }
  .container{
    width:calc(100% - 40px)
  }
  .site-header{
    height:74px
  }
  .brand img{
    width:90px;
    height:37px
  }
  .header-inner{
    gap:20px
  }
  .menu-toggle{
    display:none;
    background:none;
    border:0;
    padding:10px 0 10px 12px;
    align-items:center;
    gap:8px;
    font-size:12px
  }
  .js .menu-toggle{
    display:flex
  }
  .navigation{
    gap:16px;
    flex-wrap:wrap;
    justify-content:flex-end
  }
  .navigation>a:not(.button){
    font-size:11px
  }
  .navigation .header-cta{
    display:none
  }
  .js .navigation{
    display:none;
    position:fixed;
    inset:74px 0 0;
    background:white;
    padding:30px 25px 100px;
    overflow-y:auto;
    flex-direction:column;
    flex-wrap:nowrap;
    justify-content:flex-start;
    align-items:stretch;
    gap:0
  }
  .js .navigation>*{
    flex-shrink:0
  }
  .js .navigation.is-open{
    display:flex
  }
  .js .navigation>a:not(.button){
    font-size:23px;
    line-height:1.5;
    padding:17px 0;
    border-bottom:1px solid var(--line)
  }
  .js .navigation>a[aria-current=page]:after{
    bottom:10px;
    width:20px
  }
  .js .navigation .header-cta{
    display:flex;
    margin:30px 0 0;
    font-size:15px;
    min-height:50px
  }
  .home-hero{
    padding-top:42px
  }
  .hero-copy h1{
    font-size:clamp(40px,6.8vw,56px);
    margin-bottom:23px
  }
  .hero-copy p{
    font-size:16px
  }
  .hero-actions{
    gap:20px
  }
  .hero-actions .text-link{
    font-size:13px;
    gap:10px
  }
  .hero-showcase{
    width:calc(100% - 16px);
    margin-top:27px
  }
  .hero-showcase figcaption{
    font-size:10px;
    margin-bottom:26px
  }
  .audience-paths>a{
    padding:24px
  }
  .audience-paths>a>span:first-child{
    font-size:23px
  }
  .audience-paths .path-caption{
    font-size:10px
  }
  .intro-section{
    gap:35px
  }
  .intro-text>p:first-child{
    font-size:19px
  }
  .intro-text>p{
    font-size:14px
  }
  .section-heading{
    gap:25px;
    align-items:flex-start
  }
  .section-heading>p{
    font-size:14px;
    max-width:310px
  }
  .section-heading h2{
    font-size:35px
  }
  .demo-layout{
    grid-template-columns:110px 1fr
  }
  .demo-sidebar{
    padding:24px 8px 16px
  }
  .demo-sidebar>span{
    font-size:8px;
    gap:5px;
    padding:8px 5px
  }
  .demo-sidebar>span>.icon{
    width:12px;
    height:12px
  }
  .demo-sidebar>img{
    margin-inline:5px;
    width:54px
  }
  .demo-sidebar-bottom{
    font-size:7px;
    gap:5px
  }
  .demo-sidebar-bottom>.avatar{
    width:22px;
    height:22px
  }
  .demo-main{
    padding:23px 19px
  }
  .demo-table th,.demo-table td{
    padding-inline:7px
  }
  .demo-table td:last-child,.demo-table th:last-child{
    display:none
  }
  .demo-titlebar{
    padding-inline:15px
  }
  .demo-top h3{
    font-size:17px
  }
  .demo-control,.demo-filter{
    font-size:9px
  }
  .demo-filter{
    gap:8px
  }
  .demo-layout{
    min-height:390px
  }
  .demo-table{
    font-size:9px
  }
  .demo-note{
    font-size:9px
  }
  .explorer-description>h3{
    font-size:20px;
    max-width:260px
  }
  .explorer-description>p{
    font-size:12px;
    max-width:310px
  }
  .explorer-tabs{
    gap:20px
  }
  .explorer-tabs button{
    font-size:12px;
    gap:8px
  }
  .agency-feature{
    grid-template-columns:1fr;
    gap:34px
  }
  .agency-copy{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:35px
  }
  .agency-copy h2{
    grid-row:1/4
  }
  .agency-copy p{
    font-size:14px
  }
  .agency-copy .button{
    justify-self:start
  }
  .agency-image{
    max-width:100%;
    width:100%
  }
  .agency-image img{
    max-height:440px;
    object-fit:cover
  }
  .process-strip{
    gap:25px;
    grid-template-columns:1fr 1fr;
    margin-top:35px
  }
  .process-strip h3{
    font-size:22px;
    margin-top:20px
  }
  .process-strip p{
    font-size:13px
  }
  .about-statement{
    gap:35px
  }
  .about-statement h2{
    font-size:30px
  }
  .about-statement p{
    font-size:14px
  }
  .contact-band{
    padding-block:56px
  }
  .contact-band-inner{
    gap:35px
  }
  .contact-band h2{
    font-size:31px
  }
  .contact-band p{
    font-size:13px
  }
  .contact-band .button{
    font-size:13px;
    padding-inline:18px;
    gap:12px
  }
  .footer-main{
    grid-template-columns:1fr 1fr;
    gap:40px;
    padding-bottom:44px
  }
  .footer-brand{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:1fr 1fr
  }
  .footer-brand p{
    margin:0;
    font-size:20px;
    grid-column:2;
    grid-row:1
  }
  .footer-brand>span{
    grid-column:2;
    grid-row:2;
    font-size:12px
  }
  .footer-brand>a{
    grid-row:1/3
  }
  .site-footer{
    padding-top:52px
  }
  .footer-bottom{
    flex-wrap:wrap;
    gap:12px 24px;
    font-size:10px
  }
  .footer-bottom>span:last-child{
    display:none
  }
  .whatsapp-float{
    right:17px;
    bottom:17px;
    width:45px;
    height:45px
  }
  .inner-hero{
    padding-top:56px;
    padding-bottom:45px
  }
  .inner-hero h1{
    font-size:clamp(38px,6vw,52px)
  }
  .inner-hero>p{
    font-size:16px;
    max-width:580px
  }
  .split-heading{
    gap:35px
  }
  .split-heading h2{
    font-size:34px
  }
  .split-heading .large-copy{
    font-size:19px
  }
  .split-heading p{
    font-size:14px
  }
  .service-row{
    grid-template-columns:.85fr 1.2fr 20px;
    gap:25px
  }
  .service-row h3{
    font-size:21px
  }
  .service-row p{
    font-size:13px
  }
  .service-row div>span{
    font-size:10px
  }
  .agency-services{
    gap:35px
  }
  .agency-services h3{
    font-size:21px
  }
  .agency-services p{
    font-size:14px
  }
  .partnership-options{
    gap:30px
  }
  .partnership-options article{
    padding-inline:0
  }
  .partnership-options article+article{
    padding-left:30px
  }
  .partnership-options h3{
    font-size:23px
  }
  .partnership-options p{
    font-size:14px
  }
  .example-grid{
    gap:27px
  }
  .example-grid h3{
    font-size:20px
  }
  .example-grid p{
    font-size:13px
  }
  .process-details li{
    gap:30px;
    grid-template-columns:70px 1fr
  }
  .process-details h2{
    font-size:29px
  }
  .process-details p{
    font-size:15px
  }
  .faq-section{
    grid-template-columns:1fr;
    gap:20px
  }
  .faq-section h2{
    font-size:34px
  }
  .faq-list summary{
    font-size:15px
  }
  .contact-page{
    grid-template-columns:1fr;
    gap:45px;
    padding-top:48px
  }
  .contact-intro{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:30px
  }
  .contact-intro h1{
    font-size:44px
  }
  .contact-intro>p{
    font-size:15px;
    grid-column:1
  }
  .direct-contacts{
    grid-column:2;
    grid-row:1/3;
    margin-top:0;
    align-self:center
  }
  .direct-contacts strong{
    font-size:14px
  }
  .direct-contacts>a{
    gap:10px
  }
  .direct-contacts>a>.icon:last-child{
    width:16px
  }
  .contact-builder{
    padding:34px;
    max-width:680px;
    width:100%;
    margin:auto
  }
  .kanban{
    grid-template-columns:1fr 1fr
  }
  .kanban-column:last-child{
    display:none
  }
  .portal-project{
    grid-template-columns:1fr 1fr;
    padding:15px;
    gap:15px
  }
  .portal-project h4{
    font-size:18px
  }
  .portal-project p{
    font-size:9px
  }
  .portal-preview{
    padding:15px 12px
  }
  .portal-preview>strong{
    font-size:16px
  }
  .portal-files{
    flex-direction:column;
    gap:3px
  }
  .architecture-lines{
    opacity:.7
  }
  .reading-page{
    max-width:700px;
    padding-bottom:80px
  }
}
@media(max-width:520px){
  .cookie-banner{
    left:16px;
    bottom:16px;
    padding:18px
  }
  :root{
    --space-section:62px
  }
  .container{
    width:calc(100% - 40px)
  }
  body{
    font-size:15px
  }
  .home-hero{
    padding-top:35px
  }
  .hero-copy h1{
    font-size:40px;
    line-height:1.13;
    letter-spacing:-.04em;
    margin-bottom:20px
  }
  .hero-copy p{
    font-size:14px;
    line-height:1.65;
    margin-bottom:24px
  }
  .hero-actions{
    flex-direction:column;
    gap:18px
  }
  .hero-actions .button{
    min-height:50px;
    font-size:14px
  }
  .hero-actions .text-link{
    font-size:12px
  }
  .hero-showcase{
    width:110%;
    max-width:none;
    margin-left:-5%;
    margin-top:20px
  }
  .hero-showcase figcaption{
    font-size:9px;
    max-width:290px;
    margin:5px auto 23px
  }
  .audience-paths{
    width:calc(100% - 40px)
  }
  .audience-paths>a{
    padding:19px 13px 20px;
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    text-align:left
  }
  .audience-paths>a>span:first-child{
    font-size:18px
  }
  .audience-paths .path-caption{
    font-size:9px;
    order:3;
    width:100%;
    line-height:1.6;
    max-width:145px;
    margin-top:0
  }
  .audience-paths .icon{
    width:18px;
    height:18px;
    margin-left:auto
  }
  .intro-section{
    grid-template-columns:1fr;
    gap:10px
  }
  .intro-section h2{
    font-size:32px
  }
  .intro-text>p:first-child{
    font-size:19px
  }
  .intro-text p{
    font-size:14px
  }
  .intro-text .text-link{
    font-size:13px
  }
  .section-heading{
    display:block;
    margin-bottom:28px
  }
  .section-heading h2{
    font-size:32px
  }
  .section-heading>p{
    margin:20px 0 0;
    max-width:100%;
    font-size:13px
  }
  .section-heading>.text-link{
    margin-top:22px;
    font-size:13px
  }
  .explorer-tabs{
    gap:7px;
    margin-bottom:17px
  }
  .explorer-tabs button{
    font-size:11px;
    line-height:1.5;
    align-items:center;
    text-align:center;
    justify-content:center;
    padding:12px 4px;
    min-height:53px
  }
  .explorer-tabs button .icon{
    display:none
  }
  .explorer-description{
    display:block;
    padding-bottom:23px
  }
  .explorer-description>h3{
    font-size:22px;
    max-width:100%;
    margin-bottom:12px
  }
  .explorer-description>p{
    font-size:12px;
    max-width:100%
  }
  .demo-sidebar{
    display:none
  }
  .demo-layout{
    display:block;
    min-height:0
  }
  .demo-main{
    padding:20px 14px
  }
  .demo-titlebar{
    height:35px;
    gap:15px;
    padding:0 12px;
    font-size:8px
  }
  .demo-secure{
    display:none
  }
  .window-lights i{
    width:5px;
    height:5px
  }
  .demo-top{
    margin-bottom:19px;
    gap:10px
  }
  .demo-top h3{
    font-size:16px;
    margin-bottom:5px
  }
  .demo-top p{
    font-size:8px
  }
  .demo-control{
    font-size:8px;
    gap:7px;
    padding:7px 8px
  }
  .demo-control .icon{
    width:11px;
    height:11px
  }
  .demo-toolbar{
    gap:8px;
    margin-bottom:12px
  }
  .demo-filter{
    font-size:8px;
    padding:6px 8px;
    gap:5px
  }
  .demo-table{
    font-size:8px
  }
  .demo-table th{
    font-size:8px;
    padding:8px 5px
  }
  .demo-table td{
    padding:12px 5px
  }
  .demo-table td small{
    font-size:7px
  }
  .demo-table td:first-child{
    gap:7px
  }
  .demo-table td>.avatar{
    width:23px;
    height:23px;
    font-size:7px
  }
  .status{
    font-size:7px;
    padding:4px 5px
  }
  .demo-note{
    font-size:8px;
    gap:6px;
    padding-top:16px
  }
  .demo-note .icon{
    width:12px;
    height:12px
  }
  .demo-disclaimer{
    font-size:9px;
    margin-top:18px
  }
  .section-end-link{
    font-size:12px;
    margin-top:26px
  }
  .agency-copy{
    display:block
  }
  .agency-copy h2{
    font-size:32px
  }
  .agency-copy .button{
    font-size:13px
  }
  .agency-feature{
    gap:30px
  }
  .agency-image figcaption{
    font-size:9px;
    text-align:left
  }
  .process-strip{
    gap:30px 22px
  }
  .process-strip h3{
    font-size:19px;
    margin-block:18px 11px
  }
  .process-strip p{
    font-size:12px
  }
  .about-statement{
    grid-template-columns:1fr;
    gap:4px
  }
  .about-statement h2{
    font-size:29px
  }
  .contact-band-inner{
    display:block
  }
  .contact-band h2{
    font-size:32px;
    line-height:1.15
  }
  .contact-band p{
    font-size:13px;
    margin-bottom:27px
  }
  .contact-band .button{
    font-size:14px
  }
  .footer-main{
    grid-template-columns:1fr;
    gap:30px
  }
  .footer-brand{
    display:block;
    grid-column:auto
  }
  .footer-brand p{
    font-size:18px;
    margin-block:15px 6px
  }
  .footer-brand>a>img{
    width:94px
  }
  .footer-brand>span{
    font-size:12px
  }
  .site-footer h2{
    margin-bottom:16px;
    font-size:13px
  }
  .site-footer li{
    margin-bottom:9px
  }
  .site-footer li a{
    font-size:12px
  }
  .footer-bottom{
    display:block;
    padding-right:50px;
    font-size:9px
  }
  .footer-bottom>a{
    display:block;
    margin-top:12px
  }
  .inner-hero{
    padding-block:40px
  }
  .inner-hero h1{
    font-size:38px;
    line-height:1.12
  }
  .inner-hero>p{
    font-size:14px;
    margin-bottom:25px
  }
  .inner-hero .button{
    font-size:13px
  }
  .system-demonstration{
    width:calc(100% - 32px)
  }
  .split-heading{
    grid-template-columns:1fr;
    gap:0
  }
  .split-heading h2{
    font-size:31px
  }
  .split-heading .large-copy{
    font-size:19px
  }
  .service-list{
    margin-top:35px
  }
  .service-row{
    grid-template-columns:1fr 24px;
    gap:14px;
    padding:28px 0
  }
  .service-row>h3{
    font-size:24px;
    grid-column:1;
    grid-row:1
  }
  .service-row>div{
    grid-column:1/-1;
    grid-row:2
  }
  .service-row>.icon{
    grid-column:2;
    grid-row:1;
    width:20px;
    height:20px
  }
  .service-row p{
    font-size:14px
  }
  .approach h2{
    font-size:30px
  }
  .approach p{
    font-size:14px
  }
  .approach .text-link{
    font-size:13px
  }
  .wide-image{
    width:calc(100% - 24px)
  }
  .wide-image img{
    aspect-ratio:1.25;
    object-fit:cover
  }
  .wide-image figcaption{
    font-size:9px
  }
  .agency-services{
    grid-template-columns:1fr;
    gap:25px
  }
  .agency-services article{
    padding-top:24px
  }
  .agency-services h3{
    font-size:24px
  }
  .partnership h2{
    font-size:30px;
    margin-bottom:36px;
    text-align:left
  }
  .partnership-options{
    grid-template-columns:1fr;
    gap:35px
  }
  .partnership-options article+article{
    border-left:0;
    border-top:1px solid var(--line);
    padding:30px 0 0
  }
  .partnership-options h3{
    font-size:24px
  }
  .partnership-options .text-link{
    font-size:13px
  }
  .example-details>h2{
    font-size:32px;
    margin-bottom:30px
  }
  .example-grid{
    grid-template-columns:1fr;
    gap:30px
  }
  .example-grid h3{
    font-size:23px;
    max-width:320px
  }
  .example-grid p{
    font-size:14px
  }
  .example-grid article>span{
    font-size:11px
  }
  .compact-statement h2{
    font-size:32px
  }
  .compact-statement p{
    font-size:14px
  }
  .compact-statement .text-link{
    font-size:12px
  }
  .process-details{
    padding-bottom:65px
  }
  .process-details li{
    grid-template-columns:40px 1fr;
    gap:20px;
    padding:30px 0
  }
  .step-number{
    font-size:29px
  }
  .process-details h2{
    font-size:24px;
    margin-bottom:15px
  }
  .process-details p{
    font-size:13px
  }
  .step-outcome{
    font-size:11px;
    gap:7px
  }
  .step-outcome .icon{
    width:14px;
    height:14px
  }
  .faq-section h2{
    font-size:31px
  }
  .faq-list summary{
    font-size:14px;
    padding:21px 0;
    gap:15px
  }
  .faq-list details>p{
    font-size:13px;
    padding-right:10px
  }
  .contact-page{
    padding-top:38px;
    gap:36px
  }
  .contact-intro{
    display:block
  }
  .contact-intro h1{
    font-size:44px
  }
  .contact-intro>p{
    font-size:15px
  }
  .direct-contacts{
    margin-top:30px
  }
  .direct-contacts>a{
    padding:17px 0
  }
  .direct-contacts strong{
    font-size:15px
  }
  .direct-contacts span{
    font-size:11px
  }
  .contact-builder{
    padding:25px 20px
  }
  .contact-builder h2{
    font-size:27px
  }
  .contact-builder>p{
    font-size:13px
  }
  .form-row{
    grid-template-columns:1fr;
    gap:0
  }
  .field>label{
    font-size:12px
  }
  .field input,.field textarea{
    font-size:16px
  }
  .field input::placeholder,.field textarea::placeholder{
    font-size:13px
  }
  .field-hint{
    font-size:9px
  }
  .form-submit{
    font-size:13px;
    gap:15px
  }
  .privacy-note{
    font-size:9px
  }
  .message-ready h3{
    font-size:20px
  }
  .message-ready .button{
    font-size:13px
  }
  .portal-project{
    grid-template-columns:1fr 1fr;
    padding:13px;
    gap:10px
  }
  .portal-project h4{
    font-size:17px
  }
  .portal-preview{
    min-height:155px
  }
  .portal-preview>strong{
    font-size:15px
  }
  .kanban{
    gap:9px
  }
  .kanban-column{
    padding:10px 8px
  }
  .kanban-column h4{
    font-size:9px;
    gap:5px
  }
  .task{
    padding:10px 8px
  }
  .task>strong{
    font-size:10px
  }
  .task>small{
    font-size:7px
  }
  .reading-page h2{
    font-size:24px
  }
  .reading-page p{
    font-size:14px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*:before,*:after{
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}

/* Segmentos: ícones de marca e possibilidades sob demanda. */
.segment-section + .agency-feature{
  padding-top:0;
}
.segment-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:16px;
  align-items:start;
}
.segment-card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--white);
  overflow:clip;
  transition:border-color .2s,background .2s;
}
.segment-card:hover,.segment-card[open]{
  border-color:var(--brand-blue);
  background:var(--surface);
}
.segment-card summary{
  display:flex;
  align-items:center;
  flex-direction:column;
  padding:25px 10px 14px;
  cursor:pointer;
  list-style:none;
  text-align:center;
}
.segment-card summary::-webkit-details-marker{
  display:none;
}
.segment-card summary:focus-visible{
  outline-offset:-4px;
  border-radius:var(--radius);
}
.segment-icon{
  width:54px;
  height:54px;
  margin-bottom:18px;
  color:var(--action);
  fill:currentColor;
  overflow:visible;
}
.segment-accent{
  fill:var(--green);
}
.segment-accent-stroke{
  fill:none;
  stroke:var(--green);
  stroke-width:4;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.segment-name{
  font-size:17px;
  font-weight:750;
  line-height:1.3;
  letter-spacing:-.025em;
}
.segment-description{
  margin-top:5px;
  font-size:12px;
  color:var(--muted);
  line-height:1.5;
}
.segment-toggle{
  width:16px;
  height:16px;
  margin-top:14px;
  color:var(--action);
}
.segment-card[open] .segment-toggle{
  transform:rotate(45deg);
}
.segment-content{
  padding:0 16px 20px;
  text-align:center;
  font-size:13px;
  line-height:1.6;
}
.segment-content p{
  margin-bottom:14px;
}
.segment-content a{
  color:var(--action);
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
.segment-content .icon{
  width:16px;
  height:16px;
}
.segments-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-top:28px;
}
.segments-footer p{
  margin:0;
  font-size:13px;
}
@media(max-width:1100px){
  .segment-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media(max-width:800px){
  .segment-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .segments-footer{align-items:flex-start;flex-direction:column;gap:16px;}
}
@media(max-width:520px){
  .segment-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .segment-card summary{padding:22px 8px 12px;}
  .segment-icon{width:48px;height:48px;margin-bottom:16px;}
  .segment-name{font-size:16px;}
}
@media(prefers-reduced-motion:reduce){
  .segment-card{transition:none;}
}

/* Navegação de sistemas: duas rotas, um único ponto de entrada. */
.systems-menu > summary{
  display:flex;
  align-items:center;
  gap:7px;
  position:relative;
  cursor:pointer;
  list-style:none;
  font-size:14px;
  font-weight:550;
  line-height:2.5;
}
.systems-menu > summary::-webkit-details-marker{display:none;}
.systems-menu > summary:hover,.systems-menu[open] > summary{color:var(--action);}
.systems-menu > summary > .icon{width:15px;height:15px;}
.systems-menu[open] > summary > .icon{transform:rotate(180deg);}
.systems-menu > summary.is-current:after{
  content:'';
  position:absolute;
  bottom:0;
  left:0;
  width:24px;
  height:3px;
  background:var(--green);
}
.systems-mega{
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  width:min(900px,calc(100% - 72px));
  display:grid;
  grid-template-columns:1fr 1fr;
  background:var(--white);
  border-radius:0 0 var(--radius) var(--radius);
  box-shadow:var(--elevation);
  overflow:clip;
}
.system-choice{
  display:grid;
  grid-template-columns:34px 1fr 22px;
  align-items:start;
  gap:18px;
  padding:34px 30px;
  transition:background .2s;
}
.system-choice + .system-choice{border-left:1px solid var(--line);}
.system-choice:hover,.system-choice[aria-current=page]{background:var(--surface);}
.system-choice:focus-visible{outline-offset:-5px;}
.system-choice-icon{width:30px;height:30px;color:var(--action);}
.system-choice + .system-choice .system-choice-icon{color:var(--green-ink);}
.system-choice-copy{display:grid;gap:10px;}
.system-choice-copy strong{font-size:19px;line-height:1.3;letter-spacing:-.025em;}
.system-choice-copy > span{font-size:13px;line-height:1.65;color:var(--muted);}
.system-choice-arrow{color:var(--action);width:20px;height:20px;margin-top:4px;}
.ready-hero{
  display:grid;
  grid-template-columns:1fr 1.05fr;
  align-items:center;
  gap:40px;
  padding-block:72px 80px;
}
.ready-hero h1{font-size:clamp(42px,4.15vw,60px);}
.ready-hero-copy > p{max-width:460px;font-size:17px;}
.ready-hero-link{display:flex;width:fit-content;margin-top:22px;}
.ready-showcase{align-self:center;}
.ready-showcase img{width:100%;}
.ready-showcase figcaption{font-size:11px;color:var(--muted);text-align:center;padding-inline:20px;margin-top:12px;}
.ready-context{padding-block:28px;}
.ready-context p{max-width:900px;margin-inline:auto;text-align:center;font-size:14px;}
.ready-context strong{color:var(--ink);}
.ready-steps{grid-template-columns:repeat(3,minmax(0,1fr));}
.ready-custom{display:flex;align-items:center;justify-content:space-between;gap:60px;}
.ready-custom > div{max-width:590px;}
.ready-custom > .button{flex-shrink:0;max-width:350px;}
@media(max-width:1100px){
  .systems-menu > summary{font-size:12px;}
  .ready-hero{gap:20px;}
  .ready-custom{gap:35px;}
  .ready-custom > .button{max-width:280px;}
}
@media(max-width:800px){
  .systems-menu > summary{font-size:11px;}
  .systems-mega{
    position:static;
    transform:none;
    width:100%;
    grid-template-columns:1fr;
    border-radius:var(--radius);
    background:var(--surface);
    box-shadow:none;
  }
  .systems-menu[open]{width:100%;}
  .system-choice{padding:22px 18px;gap:14px;grid-template-columns:26px 1fr 18px;}
  .system-choice + .system-choice{border-left:0;border-top:1px solid var(--line);}
  .system-choice-copy strong{font-size:17px;}
  .system-choice-copy > span{font-size:12px;}
  .system-choice-icon{width:25px;height:25px;}
  .system-choice-arrow{width:18px;height:18px;}
  .js .systems-menu > summary{font-size:23px;line-height:1.5;padding:17px 0;border-bottom:1px solid var(--line);justify-content:space-between;}
  .js .systems-menu > summary.is-current:after{bottom:10px;width:20px;}
  .js .systems-menu[open] > summary{border-color:transparent;}
  .ready-hero{grid-template-columns:1fr;text-align:center;padding-block:48px;gap:35px;}
  .ready-hero-copy > p{margin-inline:auto;}
  .ready-hero-link{margin-inline:auto;}
  .ready-showcase{width:min(580px,100%);margin-inline:auto;}
  .ready-custom{align-items:flex-start;flex-direction:column;gap:28px;}
  .ready-custom > .button{max-width:none;}
}
@media(max-width:520px){
  .audience-paths{grid-template-columns:1fr;}
  .audience-paths > a{display:grid;grid-template-columns:1fr auto;padding:22px 8px;}
  .audience-paths > a:first-child{border-right:0;border-bottom:1px solid var(--line);}
  .audience-paths > a > span:first-child{font-size:20px;}
  .audience-paths .path-caption{font-size:12px;max-width:none;order:initial;}
  .audience-paths .icon{margin:0;}
  .ready-hero h1{font-size:40px;}
  .ready-hero-copy > p{font-size:15px;}
  .ready-hero-link{font-size:13px;}
  .ready-context p{font-size:13px;text-align:left;}
  .ready-steps{grid-template-columns:1fr;}
}
@media(prefers-reduced-motion:reduce){
  .system-choice{transition:none;}
}