.site-header nav {
  gap:24px
}

.site-header nav a {
  font-size:14px
}

.hero-aside {
  max-width:370px
}

.hero-aside>p:first-child {
  font-size:21px
}

.hero-aside .muted {
  font-size:16px
}

.hero-gallery .feature {
  display:block
}

.hero-gallery .feature h2 {
  font-size:37px
}

.hero-gallery .feature-copy {
  right:20px
}

.category:focus-visible {
  outline-offset:-3px
}

.category-strip {
  scroll-padding-inline:10px
}

.services-intro {
  padding-top:95px;
  padding-bottom:22px
}

.services-intro h2 {
  font-size:56px
}

.service-section {
  padding-block:52px;
  scroll-margin-top:20px
}

.service-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:75px
}

.service-layout.reverse .service-visual {
  order:2
}

.service-visual {
  height:550px;
  background:#eaeaec;
  border-radius:30px;
  overflow:hidden;
  position:relative
}

.service-visual img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 1s var(--ease)
}

.service-visual:hover img {
  transform:scale(1.045)
}

.service-text h2 {
  font-size:clamp(34px,3.5vw,50px);
  margin-bottom:25px
}

.service-text>p {
  color:var(--muted);
  font-size:17px;
  line-height:1.65
}

.service-text .service-intro {
  font-weight:600;
  color:var(--ink);
  font-size:22px
}

.service-text .service-intro.accent {
  color:var(--pink)
}

.service-list {
  list-style:none;
  margin:0 0 25px;
  padding:0
}

.service-list li {
  position:relative;
  padding:13px 0 13px 22px;
  border-bottom:1px solid var(--line);
  font-size:16px;
  line-height:1.6;
  color:#56565d
}

.service-list li:before {
  content:"";
  position:absolute;
  left:0;
  top:25px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--pink)
}

.service-list strong {
  display:block;
  font-size:21px;
  font-weight:600;
  color:var(--ink);
  letter-spacing:-.025em;
  margin-bottom:5px
}

.service-text blockquote {
  margin:20px 0 28px;
  border-left:3px solid var(--pink);
  padding-left:20px;
  font-size:20px;
  line-height:1.5;
  letter-spacing:-.025em
}

.service-heading {
  margin-bottom:32px
}

.service-heading h2 {
  font-size:clamp(34px,3.7vw,52px)
}

.service-tiles {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:23px
}

.service-tile {
  background:white;
  border-radius:26px;
  overflow:hidden;
  transition:box-shadow .3s,transform .3s
}

.service-tile:hover {
  box-shadow:0 20px 40px #17171c12;
  transform:translateY(-6px)
}

.service-tile>img {
  width:100%;
  height:310px;
  object-fit:contain;
  padding:25px;
  transition:transform .7s var(--ease)
}

.service-tile:hover>img {
  transform:scale(1.04)
}

.service-tile>div {
  padding:12px 28px 30px
}

.service-tile h3 {
  font-size:25px;
  line-height:1.15;
  margin-bottom:12px
}

.service-tile p {
  font-size:16px;
  line-height:1.6;
  color:var(--muted);
  margin:0
}

.exterior-tiles {
  grid-template-columns:repeat(2,minmax(0,1fr))
}

.exterior-tiles .service-tile>img {
  height:280px;
  object-fit:cover;
  padding:0
}

.exterior-tiles .service-tile>div {
  padding-top:25px
}

.exterior-tiles .service-tile:first-child>img {
  object-position:center 57%
}

.pop-tiles .service-tile>img {
  height:270px
}

.pop-tiles .service-tile h3 {
  font-size:21px;
  margin:0
}

.pop-tiles .service-tile>div {
  padding-top:5px
}

#digital .service-visual {
  background:#f6e4eb
}

#digital .service-visual img {
  object-fit:contain;
  padding:25px
}

#senaletica .service-visual img {
  object-fit:contain;
  padding:0
}

#especializados .service-visual {
  height:480px
}

#especializados .service-visual img {
  object-position:30% center
}

.strategy {
  padding-top:80px
}

.service-section+.service-section {
  border-top:1px solid #e6e6ea
}

.contact-copy>p:not(.eyebrow) {
  font-size:21px;
  max-width:370px
}

.site-footer {
  background:#1c1c20;
  color:#eeeef1;
  padding:66px 0 26px
}

.footer-brand-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
  border-bottom:1px solid #ffffff26;
  padding-bottom:45px
}

.footer-brand-row img {
  width:190px;
  height:auto;
  filter:brightness(0) invert(1)
}

.footer-brand-row>p {
  font-size:clamp(29px,3.3vw,46px);
  line-height:1.05;
  letter-spacing:-.045em;
  font-weight:600;
  margin:0;
  text-align:right
}

.footer-columns {
  display:grid;
  grid-template-columns:1.2fr 1.1fr 1fr 1fr;
  gap:35px;
  padding:45px 0 55px
}

.footer-columns h2 {
  font-size:16px;
  letter-spacing:0;
  margin-bottom:20px;
  line-height:1.3;
  font-weight:600;
  color:#fff
}

.footer-columns a {
  display:block;
  color:#bcbcc4;
  font-size:14px;
  line-height:1.5;
  margin-bottom:12px;
  transition:color .2s
}

.footer-columns a:hover {
  color:#ff8cad
}

.footer-contact .footer-phone {
  font-size:23px;
  color:white;
  font-weight:500;
  letter-spacing:-.035em
}

.footer-contact p {
  font-size:14px;
  color:#bcbcc4;
  margin-bottom:12px
}

.footer-baseline {
  display:flex;
  justify-content:space-between;
  gap:25px;
  padding-top:22px;
  border-top:1px solid #ffffff26;
  color:#a6a6b0;
  font-size:12px
}

.footer-baseline a:hover {
  color:#fff
}

[data-enter] {
  --delay:0ms;
  --enter-x:0px;
  --enter-y:65px;
  --enter-scale:1
}

[data-enter="left"] {
  --enter-x:-85px;
  --enter-y:20px
}

[data-enter="right"] {
  --enter-x:85px;
  --enter-y:20px
}

[data-enter="image"] {
  --enter-y:60px;
  --enter-scale:.93
}

.will-enter {
  opacity:0
}

.will-enter.has-entered {
  animation:krav-enter 1s var(--ease) var(--delay) both
}

@keyframes krav-enter {
  from {
    opacity:0;
    transform:translate3d(var(--enter-x),var(--enter-y),0) scale(var(--enter-scale));
    filter:blur(4px)
  }

  to {
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:blur(0)
  }

}

main {
  overflow:clip
}

.category:hover {
  transform:translateY(-7px)
}

.category img {
  transition:transform .35s
}

.category:hover img {
  transform:scale(1.12)
}

@media(max-width:1100px) {
  .site-header nav {
    gap:15px
  }

  .site-header nav a {
    font-size:13px
  }

  .service-layout {
    gap:40px
  }

  .service-visual {
    height:490px
  }

  .footer-columns {
    gap:22px
  }

  .service-tile>img {
    height:255px
  }

  .service-tile>div {
    padding-inline:23px
  }

  .hero-gallery .feature h2 {
    font-size:32px
  }

}

@media(max-width:800px) {
  .site-header nav {
    gap:12px
  }

  .site-header nav a {
    font-size:12px
  }

  .service-layout {
    gap:28px
  }

  .service-visual {
    height:470px
  }

  .service-text h2 {
    font-size:33px
  }

  .service-list li {
    font-size:15px
  }

  .service-list strong {
    font-size:19px
  }

  .service-tiles {
    gap:16px
  }

  .service-tile>img {
    height:215px
  }

  .service-tile>div {
    padding:15px 19px 23px
  }

  .service-tile h3 {
    font-size:21px
  }

  .service-tile p {
    font-size:15px
  }

  .footer-columns {
    grid-template-columns:1fr 1fr;
    gap:30px
  }

  .hero-gallery .feature h2 {
    font-size:34px
  }

  .hero-aside {
    max-width:290px
  }

  .hero-aside>p:first-child {
    font-size:18px
  }

  .hero-aside .muted {
    font-size:15px
  }

}

@media(max-width:650px) {
  .site-header nav a {
    font-size:18px
  }

  .hero-aside {
    max-width:100%
  }

  .hero-aside .muted {
    max-width:100%
  }

  .hero-gallery {
    grid-template-columns:1fr;
    overflow:visible;
    padding:0;
    margin-right:0
  }

  .hero-gallery .feature {
    height:320px
  }

  .hero-gallery .feature-pink .feature-product {
    top:30px;
    left:32%;
    width:68%;
    height:290px;
    padding:20px
  }

  .hero-gallery .feature-pink .feature-copy {
    right:90px
  }

  .hero-gallery .feature-dark>img {
    object-position:center 70%
  }

  .hero-gallery .feature-blue>img {
    object-position:center 60%
  }

  .hero-gallery .feature h2 {
    font-size:32px
  }

  .hero-caption {
    margin-top:20px
  }

  .services-intro {
    padding-top:58px;
    padding-bottom:10px
  }

  .services-intro h2 {
    font-size:41px
  }

  .service-section {
    padding-block:34px
  }

  .service-layout {
    grid-template-columns:1fr;
    gap:27px
  }

  .service-layout.reverse .service-visual {
    order:0
  }

  .service-visual {
    height:370px;
    border-radius:23px
  }

  .service-text h2 {
    font-size:36px
  }

  .service-text>p {
    font-size:16px
  }

  .service-list li {
    font-size:16px
  }

  .service-list strong {
    font-size:21px
  }

  .service-text blockquote {
    font-size:19px
  }

  .service-heading h2 {
    font-size:34px
  }

  .service-tiles,.exterior-tiles {
    grid-template-columns:1fr
  }

  .service-tile>img {
    height:280px
  }

  .service-tile>div {
    padding:15px 25px 28px
  }

  .service-tile h3 {
    font-size:25px
  }

  .service-tile p {
    font-size:16px
  }

  .exterior-tiles .service-tile>img {
    height:250px
  }

  .pop-tiles {
    grid-template-columns:1fr 1fr;
    gap:12px
  }

  .pop-tiles .service-tile>img {
    height:210px;
    padding:20px
  }

  .pop-tiles .service-tile>div {
    padding:5px 15px 22px
  }

  .pop-tiles .service-tile h3 {
    font-size:17px;
    line-height:1.25
  }

  #especializados .service-visual {
    height:310px
  }

  .site-footer {
    padding:42px 0 25px
  }

  .footer-brand-row {
    align-items:flex-start;
    padding-bottom:30px;
    gap:15px
  }

  .footer-brand-row img {
    width:130px
  }

  .footer-brand-row>p {
    font-size:25px
  }

  .footer-columns {
    padding:32px 0;
    gap:28px 20px
  }

  .footer-columns h2 {
    font-size:14px
  }

  .footer-columns a {
    font-size:13px
  }

  .footer-contact .footer-phone {
    font-size:19px
  }

  .footer-baseline {
    flex-wrap:wrap;
    gap:13px;
    font-size:11px
  }

  .footer-baseline>span:first-child {
    width:100%
  }

  [data-enter="left"] {
    --enter-x:-35px
  }

  [data-enter="right"] {
    --enter-x:35px
  }

  .will-enter.has-entered {
    animation-duration:.85s
  }

}

@media(prefers-reduced-motion:reduce) {
  .will-enter {
    opacity:1!important
  }

  .will-enter.has-entered {
    animation:none!important;
    transform:none!important;
    filter:none!important
  }

}

@media print {
  .will-enter {
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    animation:none!important
  }

  .site-header {
    position:static
  }

  .service-layout {
    break-inside:avoid
  }

}

.form-trap {
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important
}

.brief-form .form-success,.brief-form .form-error {
  padding:16px!important;
  border-radius:12px;
  font-size:14px;
  line-height:1.6
}

.brief-form .form-success {
  background:#eef7f1;
  color:#215937
}

.brief-form .form-error {
  background:#fff0f3;
  color:#9f173d
}

.brief-form button:disabled {
  opacity:.65;
  cursor:wait;
  transform:none
}

.footer-contact a {
  overflow-wrap:anywhere
}