/* SalaTreze — estilos consolidados com ordem de cascata preservada. */
/* Fonte crítica do Hero, compartilhada com os demais títulos em peso 900. */
@font-face {
  font-family: "Saira Extra Condensed";
  src: url("assets/fonts/saira-extra-condensed-900.woff2") format("woff2");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}
/* Fontes locais ajustadas à largura e às métricas das famílias Saira. */
@font-face {
  font-family: "SalaTreze Hero Title Fallback";
  src: local("Arial Bold"), local("Liberation Sans Bold"), local("Roboto Bold");
  font-style: normal;
  font-weight: 900;
  size-adjust: 55.83%;
  ascent-override: 203.3%;
  descent-override: 78.63%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "SalaTreze Hero Body Fallback";
  src: local("Arial"), local("Liberation Sans"), local("Roboto");
  size-adjust: 101.15%;
  ascent-override: 112.21%;
  descent-override: 43.4%;
  line-gap-override: 0%;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
a {
  color: inherit;
  text-decoration: none;
}
button,input,select,textarea {
  font: inherit;
}
button {
  cursor: pointer;
}
img {
  display: block;
  max-width: 100%;
}
::selection {
  background: var(--acid);
  color: var(--ink);
}
.skip {
  position: absolute;
  z-index: 100;
  background: var(--acid);
  color: var(--ink);
  padding: 12px;
  transform: translateY(-140%);
}
.skip:focus {
  transform: translateY(0);
}
.topbar.scrolled {
  color: var(--paper);
  border-bottom-color: #343c35;
  backdrop-filter: blur(15px);
}
.navlogo {
  font-size: 1.0625rem;
  font-weight: 900;
  letter-spacing: -.07em;
  white-space: nowrap;
}
.navlinks {
  display: flex;
  align-items: center;
}
.navlinks a:hover {
  opacity: .55;
}
.mobiletoggle {
  display: none;
  border: 0;
  background: none;
  color: inherit;
  font-size: 1.75rem;
  line-height: 1;
  padding: 5px;
}
.mobilemenu {
  display: none;
  position: fixed;
  inset: 65px 0 0;
  z-index: 55;
  background: var(--ink);
  padding: 35px var(--pad);
  flex-direction: column;
  gap: 0;
}
.mobilemenu a {
  font-family: var(--condensed);
  font-size: clamp(2.8125rem,11vw,4.375rem);
  line-height: 1.05;
  border-bottom: 1px solid #3c463f;
  padding: 16px 0;
  text-transform: uppercase;
}
.mobilemenu small {
  margin-top: 30px;
  color: var(--acid);
}
.hero:after {
  content: "";
  position: absolute;
  inset: 50% 0 0;
  z-index: -1;
  background: linear-gradient(to bottom,transparent,rgba(9,14,10,.45) 40%,rgba(9,12,10,.94));
  pointer-events: none;
}
.hero:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}
.hero h1 em {
  font-style: normal;
  display: block;
}
.roundlink {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 35px;
  font-size: 0.6875rem;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
  border-bottom: 1px solid currentColor;
  padding: 14px 0;
  min-width: 195px;
}
.roundlink span {
  font-size: 1.4375rem;
  font-weight: 400;
}
.roundlink:hover {
  color: var(--acid);
}
.tickflow span {
  white-space: nowrap;
}
.tickflow i {
  font-style: normal;
  font-size: 80%;
  padding: 0 18px;
}
@keyframes marquee {
  to {
    transform: translateX(-50%);
  }
}
.section {
  padding: clamp(78px,11vw,180px) var(--pad);
}
.section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid currentColor;
  padding-bottom: 17px;
  margin-bottom: clamp(40px,7vw,90px);
}
.index {
  font-size: 0.6875rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.maxwide {
  max-width: 1650px;
  margin: 0 auto;
}
.display {
  font: 900 clamp(3.5rem,9vw,9.625rem)/.9 var(--condensed);
  text-transform: uppercase;
  margin: 0;
}
.bodycopy {
  font-size: clamp(1rem,1.52vw,1.375rem);
  line-height: 1.5;
  letter-spacing: -.02em;
}
.accent {
  color: var(--acid);
}
.manifesto .aside-note {
  margin-top: 32px;
  color: var(--acid);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.services h2 {
  max-width: 1100px;
  margin-bottom: 60px;
}
.service-layout {
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(270px,.85fr);
}
.service-btn .count {
  font-size: 0.6875rem;
  font-weight: 800;
}
.service-btn .sign {
  font-size: 1.8125rem;
  text-align: right;
}
.service-desc {
  display: none;
  max-width: 620px;
  line-height: 1.52;
}
.service-art {
  position: sticky;
  height: min(70vh,670px);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.artgrid {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg,transparent 0 47px,#3b493c 48px),repeating-linear-gradient(90deg,transparent 0 47px,#3b493c 48px);
  opacity: .34;
}
.art-ring:before,.art-ring:after {
  content: "";
  position: absolute;
  inset: 12%;
  border: 1px solid #6bff85;
  border-radius: 50%;
  transform: scaleX(.4) rotate(50deg);
}
.art-ring:after {
  transform: scaleY(.4) rotate(-45deg);
}
.artstamp {
  position: absolute;
  bottom: 24px;
  left: 24px;
  right: 24px;
  display: flex;
  justify-content: space-between;
  font-size: 0.6875rem;
  color: #c0d5c3;
  letter-spacing: .1em;
}
.extras p {
  line-height: 1.6;
}
/* Seção 03: o índice define apenas o deslocamento inicial e o atraso. */
.process .steps {
  --step-enter-spacing: 16px;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  align-items: start;
  gap: clamp(16px,3vw,42px);
  margin-top: 80px;
}
.process .step {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 260px;
  padding-top: 18px;
  border-top: 2px solid #15231a;
}
.process .step:nth-child(2) { --step-index: 1; }
.process .step:nth-child(3) { --step-index: 2; }
.process .step:nth-child(4) { --step-index: 3; }
.step h3 {
  font: 900 1.9375rem/1 var(--heading);
  text-transform: uppercase;
  margin: 30px 0 10px;
}
.step p {
  max-width: 260px;
  margin: 0;
}
@media (max-width:1200px) {
  .process .steps {
    --step-enter-spacing: 10px;
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}
@media (max-width:760px) {
  .process .steps {
    --step-enter-spacing: 6px;
    grid-template-columns: minmax(0,1fr);
    gap: 25px;
    margin-top: 60px;
  }
  .process .step {
    min-height: 155px;
  }
  .step h3 {
    font-size: 1.5625rem;
  }
}
@media (max-width:420px) {
  .process .step {
    padding-bottom: 15px;
  }
}
@media (prefers-reduced-motion:no-preference) {
  .js-motion .process .step {
    translate: 0 0;
    transition: opacity .65s ease, translate .65s cubic-bezier(.2,.75,.2,1), filter .65s ease;
    transition-delay: calc(var(--step-index, 0) * .15s);
  }
  .js-motion .process .steps:not(.in-view) > .step {
    translate: 0 calc(18px + var(--step-index, 0) * var(--step-enter-spacing));
    opacity: 0;
    filter: blur(5px);
  }
}
.audience h2 {
  max-width: 1200px;
}
.aud-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  margin-top: 80px;
}
.aud-card:hover {
  background: #222b24;
}
.aud-label {
  color: var(--acid);
  font-size: 0.6875rem;
  letter-spacing: .1em;
}
.aud-card p {
  max-width: 390px;
  line-height: 1.55;
  color: #d2dad2;
}
.aud-arrow {
  font-size: 2rem;
  color: var(--acid);
}
.showcase-grid {
  grid-template-columns: 1.25fr .75fr;
  grid-template-rows: 420px 330px;
}
.show-tile:first-child {
  background: var(--acid) url("assets/degrade-bg.jpg") center/cover;
}
.show-tile:nth-child(2) {
  background: #eeeae2;
  color: #171d18;
}
.show-tile:nth-child(3) {
  background: #1b241d;
}
.show-tile .fake-media {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.show-tile footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.6875rem;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.pricing-lede {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,.55fr);
  gap: 8vw;
  align-items: end;
}
.pricing-lede p {
  font-size: 1.125rem;
  line-height: 1.55;
  margin-bottom: 3px;
}
.plan-price span {
  display: block;
  font-size: 0.625rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.plan-price strong {
  display: block;
  font: 900 clamp(2.125rem,3.15vw,3.375rem)/1.2 var(--condensed);
  margin: 4px 0;
}
.plan-price small {
  font-size: 0.6875rem;
}
.plan ul {
  padding: 0;
  list-style: none;
  margin: 24px 0 26px;
  display: grid;
  gap: 13px;
  flex: 1;
}
.pricing-foot {
  display: flex;
  justify-content: space-between;
  gap: 25px;
  align-items: start;
}
.pricing-foot p {
  font-size: 0.75rem;
  max-width: 750px;
  line-height: 1.5;
  margin: 0;
}
.pricing-foot a {
  font-size: 0.75rem;
  text-transform: uppercase;
  font-weight: bold;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.studio-offer {
  padding: 35px;
  color: var(--paper);
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  align-items: end;
  gap: 35px;
}
.studio-offer p {
  font-size: 0.9375rem;
  line-height: 1.5;
}
.studio-offer strong {
  font: 900 2.375rem var(--condensed);
  color: var(--acid);
}
.about-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  align-items: center;
}
.about-art {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  padding: 6%;
  overflow: hidden;
}
.about-art img {
  width: 100%;
}
.about-copy h2 {
  font: 900 clamp(3.4375rem,6vw,6.5625rem)/.88 var(--condensed);
  overflow-wrap: anywhere;
  margin: 0 0 42px;
  text-transform: uppercase;
}
.about-copy p {
  font-size: clamp(1.0625rem,1.5vw,1.3125rem);
  line-height: 1.55;
  max-width: 560px;
}
.about-copy .origin {
  margin-top: 40px;
  font-size: 0.6875rem;
  color: var(--acid);
  font-weight: 900;
  letter-spacing: .09em;
}
.contact-side h3 {
  font: 900 clamp(2.5rem,4vw,4.0625rem) var(--condensed);
  margin: 22px 0 8px;
}
.contact form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.field {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.field.full {
  grid-column: 1/-1;
}
.field label {
  font-size: 0.6875rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.field input,.field select,.field textarea {
  padding: 16px 3px;
  color: var(--ink);
  border: 0;
  border-bottom: 1px solid #287333;
  outline: 0;
  background: transparent;
  border-radius: 0;
  min-width: 0;
  font-size: 0.9375rem;
}
.field input::placeholder,.field textarea::placeholder {
  color: #286d37;
}
.field input:focus,.field select:focus,.field textarea:focus {
  border-bottom: 2px solid var(--ink);
}
.field textarea {
  min-height: 82px;
  resize: vertical;
}
.send {
  grid-column: 1/-1;
  background: var(--ink);
  color: #fff;
  border: 1px solid var(--ink);
  padding: 21px 27px;
  font-size: 0.8125rem;
  font-weight: 900;
  letter-spacing: .1em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.send span {
  font-size: 1.5625rem;
}
.send:hover {
  background: #1d3422;
}
.contact-result {
  display: none;
  margin-top: 20px;
  border: 1px solid var(--ink);
  padding: 22px;
}
.contact-result.visible {
  display: block;
}
.contact-result textarea {
  width: 100%;
  min-height: 155px;
  margin-top: 12px;
  padding: 12px;
  background: #eefff0;
  border: 1px solid #4b9c59;
  resize: vertical;
}
.contact-result p {
  font-size: 0.8125rem;
  line-height: 1.5;
}
.copy-message {
  padding: 11px 18px;
  text-transform: uppercase;
  font-size: 0.6875rem;
  font-weight: bold;
}
.footer-links {
  font-size: 0.75rem;
  line-height: 2;
  display: flex;
  flex-direction: column;
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  border-top: 1px solid #424b43;
  margin-top: 55px;
  padding-top: 15px;
  font-size: 0.6875rem;
  color: #9ca79c;
}
.footer-bottom a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width:1120px) {
  .hero-bottom {
    grid-template-columns: 1.5fr .7fr;
  }
  .plan-price strong {
    font-size: 2.9375rem;
  }
  .showcase-grid {
    grid-template-rows: 360px 260px;
  }
  .manifesto-layout {
    grid-template-columns: 1fr .6fr;
  }
  .services h2 {
    margin-bottom: 45px;
  }
}
@media (max-width:760px) {
  :root {
    --pad: 22px;
  }
  .navlinks {
    display: none;
  }
  .mobiletoggle {
    display: block;
  }
  .mobilemenu.open {
    display: flex;
  }
  .hero h1 em {
    display: block;
  }
  .hero-side .roundlink {
    white-space: nowrap;
  }
  .hero-side .roundlink span {
    font-size: 1.1875rem;
  }
  .section {
    padding: 82px var(--pad);
  }
  .section-head {
    margin-bottom: 41px;
  }
  .display {
    font-size: clamp(3.4375rem,12.5vw,6rem);
  }
  .manifesto-layout,.pricing-lede,.contact-head,.showcase-intro {
    grid-template-columns: minmax(0,1fr);
    gap: 25px;
  }
  .manifesto .bodycopy {
    max-width: 520px;
  }
  .manifesto .aside-note {
    margin-top: 25px;
  }
  .service-art {
    display: none;
  }
  .service-desc {
    margin-left: 47px;
    margin-right: 12px;
    font-size: 0.875rem;
  }
  .aud-grid {
    grid-template-columns: minmax(0,1fr);
  }
  .aud-card {
    min-height: 370px;
  }
  .show-tile:first-child {
    grid-row: auto;
  }
  .show-tile footer {
    padding: 12px;
    font-size: 0.5625rem;
  }
  .plan ul {
    gap: 10px;
  }
  .pricing-foot {
    display: block;
  }
  .pricing-foot a {
    display: inline-block;
    margin-top: 12px;
  }
  .studio-offer {
    grid-template-columns: 1fr;
    padding: 28px;
    margin-top: 48px;
  }
  .about-grid {
    grid-template-columns: minmax(0,1fr);
  }
  .about-art {
    aspect-ratio: 1.15;
  }
  .about-copy h2 {
    font-size: clamp(3.25rem,11vw,5.4375rem);
  }
  .contact-side h3 {
    margin-top: 4px;
  }
  .contact form {
    gap: 17px;
  }
  .footer-links {
    flex-direction: row;
    gap: 20px;
    margin-top: 28px;
  }
  .footer-bottom {
    flex-direction: column;
  }
}
@media (max-width:420px) {
  .topbar .navlogo {
    font-size: 0.9375rem;
  }
  .display {
    font-size: clamp(3.0625rem,12.4vw,4.125rem);
  }
  .showcase-grid {
    grid-template-columns: 1fr;
    grid-template-rows: 350px 240px 240px;
  }
  .show-tile:first-child {
    grid-column: auto;
  }
  .contact form {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto;
  }
  *,*:before,*:after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}
.topbar .navlogo {
  color: #e9f6e7;
}
.navlogo sup {
  font-size: 0.5625rem;
  top: -.5em;
  position: relative;
  margin-left: 3px;
  color: var(--acid);
}
.navlinks {
  gap: clamp(10px,1.6vw,28px);
}
.navlinks a {
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  transition: opacity .2s;
  font-size: 0.625rem;
}
.navcta {
  border-radius: 100px;
  background: var(--acid);
  color: var(--ink);
  border: 0 !important;
  padding: 13px 18px;
}
.navcta:hover {
  opacity: 1 !important;
  background: #f0f6e9;
}
.hero {
  position: relative;
  isolation: isolate;
  background: #32fa60 url("assets/degrade-bg.jpg") center center/cover no-repeat;
  flex-direction: column;
  color: var(--ink);
  padding-top: 125px;
  padding-bottom: 55px;
}
.manifesto .display .outline {
  color: transparent;
  -webkit-text-stroke: 1.5px #e4e7e2;
}
.manifesto-signal {
  margin-top: 90px;
  border: 1px solid #454e46;
  border-radius: 120px;
  display: flex;
  gap: 35px;
  align-items: center;
  justify-content: center;
  padding: 18px 35px;
  font: 900 clamp(1.8125rem,6.2vw,5.9375rem)/1 var(--condensed);
  white-space: nowrap;
  color: #e4e7e2;
  transform: rotate(-2deg);
}
.service-row {
  border-top: 1px solid #9ca39c;
  border-radius: 12px;
  background: #f9f9f2;
  margin-bottom: 9px;
  overflow: hidden;
  box-shadow: 0 3px 0 #1c2e2177;
}
.service-row:nth-child(2) {
  background: #d4f8d9;
}
.service-row:nth-child(3) {
  background: #eff0ea;
}
.service-row:nth-child(4) {
  background: #b8e7c1;
}
.service-row.open {
  background: #17231b;
  color: white;
}
.service-btn {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--ink);
  display: grid;
  align-items: center;
  text-align: left;
  gap: 10px;
  padding: 24px 22px;
  grid-template-columns: 42px 1fr 35px;
}
.service-btn .name {
  font: 900 clamp(1.875rem,4.2vw,4.1875rem)/.95 var(--condensed);
  text-transform: uppercase;
  font-size: clamp(1.75rem,3.6vw,4rem);
}
.service-row.open .service-btn {
  color: var(--acid);
}
.service-row.open .service-desc {
  display: block;
  color: #e6ede5;
}
.service-desc {
  margin: 0 26px 27px 64px;
  font-size: 0.9375rem;
}
.service-ticket span {
  font: 900 clamp(1.4375rem,3vw,2.75rem)/.85 var(--condensed);
  padding: 13px;
  background: var(--acid);
  border-radius: 5px;
}
.service-ticket b {
  font-size: 1.375rem;
  color: var(--acid);
}
.showcase-note-band {
  margin-top: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  font-size: 0.625rem;
  letter-spacing: .1em;
  border-top: 1px solid #5f7862;
  border-bottom: 1px solid #5f7862;
  padding: 15px 0;
  color: #c1d4c1;
}
.showcase-note-band strong {
  color: var(--acid);
}
.show-tile .fake-media img {
  object-fit: contain;
  mix-blend-mode: multiply;
  width: 85%;
  height: 75%;
}
.show-tile:nth-child(2) .fake-media b {
  font: 900 9.0625rem/.72 var(--condensed);
  letter-spacing: -.05em;
  transform: rotate(-13deg);
  text-align: center;
  font-size: clamp(8.125rem,17vw,16.25rem);
}
.show-tile:nth-child(3) .fake-media b {
  font: 900 clamp(4.375rem,9vw,9.0625rem)/.8 var(--condensed);
  color: var(--acid);
  text-align: center;
  transform: rotate(10deg);
  font-size: clamp(7.1875rem,14vw,11.875rem);
}
.pricing .display {
  font-size: clamp(4.6875rem,11vw,11.125rem);
}
.pricing-lede {
  position: relative;
  z-index: 1;
}
.pricing-intro-stamp {
  position: absolute;
  top: clamp(280px,34vw,490px);
  right: 6%;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: #141a14;
  color: var(--acid);
  font: 900 2.1875rem/.86 var(--condensed);
  letter-spacing: -.02em;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  box-shadow: 5px 7px 0 #237c3f;
  pointer-events: none;
}
.pricing-intro-stamp span {
  font-size: 2rem;
}
.plan {
  min-width: 0;
  flex-direction: column;
  border: 2px solid #17221a;
  background: #161a16;
  color: #f2f4e9;
  padding: 27px 23px;
}
.plan:hover {
  transform: translateY(-8px);
  box-shadow: 9px 15px 0 #0b140b;
}
.plan h3 {
  font: 900 clamp(2.5rem,3.8vw,4.125rem)/.9 var(--condensed);
  text-transform: uppercase;
  margin: 30px 0 12px;
  letter-spacing: -.025em;
  font-size: clamp(2.6875rem,3.8vw,4.375rem);
  margin-top: 45px;
}
.plan-price {
  margin-top: 24px;
  padding: 20px 0;
  border-top: 1px solid #9ba39a;
  border-bottom: 1px solid #9ba39a;
  border-color: #78877b;
}
.plan button {
  width: 100%;
  text-transform: uppercase;
  font-size: 0.6875rem;
  font-weight: 900;
  letter-spacing: .07em;
  padding: 15px 12px;
  background: #def4df;
  color: #141c15;
  border: 0;
  border-radius: 100px;
  margin-top: auto;
}
.plan button:hover {
  background: var(--acid);
  color: #111;
}
.plan.featured button {
  background: #161a16;
  color: #fff;
}
.plan.featured button:hover {
  background: #1d8c3b;
  color: #fff;
}
.plan li:before {
  content: "↗";
  font-weight: bold;
  color: var(--acid);
}
.plan.featured li:before {
  color: #167333;
}
.plan-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #bdcabe;
}
.plan-summary {
  font-size: 0.875rem;
  line-height: 1.5;
  color: #c9d1c7;
}
.plan.featured .plan-summary {
  color: #38493b;
}
.about {
  background: #151918;
}
.about-grid {
  gap: 5vw;
}
.faq-section {
  background: #e8ede5;
  color: #121a13;
}
.faq-layout {
  display: grid;
  grid-template-columns: minmax(0,.85fr) minmax(0,1fr);
  gap: 8vw;
}
.faq-title-area {
  position: relative;
}
.faq-title-area .display {
  font-size: clamp(4.375rem,8vw,9.0625rem);
}
.faq-title-area .display span {
  color: #228f42;
}
.faq-title-area p {
  line-height: 1.55;
  max-width: 350px;
}
.faq-list {
  border-top: 1px solid #a8b3a8;
}
.faq-list details {
  border-bottom: 1px solid #a8b3a8;
}
.faq-list summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  cursor: pointer;
  font-weight: 700;
  padding: 25px 3px;
  list-style: none;
  font-size: clamp(0.9375rem,1.5vw,1.25rem);
  line-height: 1.35;
}
.faq-list summary::-webkit-details-marker {
  display: none;
}
.faq-list summary:hover {
  color: #157e35;
}
.faq-list .faq-icon {
  flex-shrink: 0;
  background: #111b14;
  color: var(--acid);
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1;
}
.faq-list details[open] .faq-icon {
  transform: rotate(45deg);
}
.faq-list details p {
  margin: 0;
  padding: 0 55px 25px 3px;
  max-width: 650px;
  line-height: 1.6;
  color: #3c4a3d;
}
.contact:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -10%;
  right: -10%;
  top: -20%;
  height: 75%;
  background: var(--acid) url("assets/degrade-bg.jpg") center center/cover;
  clip-path: ellipse(58% 52% at 50% 46%);
}
.contact:after {
  content: "";
  position: absolute;
  z-index: -1;
  left: -20%;
  right: -20%;
  top: 11%;
  height: 61%;
  background: #0c100e;
  clip-path: ellipse(63% 60% at 50% 100%);
}
.contact .section-head {
  color: #d5ebd6;
}
.contact-orbit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  width: max-content;
  margin: 0 auto 24px;
  transform: rotate(-8deg);
  color: var(--acid);
}
.contact-orbit i {
  font-size: 0.625rem;
  font-style: normal;
  line-height: 1.4;
  letter-spacing: .1em;
}
.contact-head {
  display: grid;
  align-items: end;
  grid-template-columns: 1fr;
  gap: 20px;
  text-align: center;
  justify-items: center;
}
.contact-head .display {
  font-size: clamp(4.0625rem,9vw,9.0625rem);
  max-width: 1150px;
}
.contact-grid {
  display: grid;
  margin-top: 100px;
  gap: 5vw;
  grid-template-columns: .6fr 1fr;
}
.contact-side {
  border-top: 1px solid #192b1c;
  padding-top: 20px;
  border-color: #435246;
}
.contact-side p {
  max-width: 300px;
  line-height: 1.55;
  color: #a4b5a6;
}
.contact .field label {
  color: var(--acid);
}
.contact .field input,.contact .field select,.contact .field textarea {
  color: #fff;
  border-color: #536a57;
}
.contact .field select option {
  background: #17221a;
}
.contact .field input::placeholder,.contact .field textarea::placeholder {
  color: #a3b4a3;
}
.contact .field input:focus,.contact .field select:focus,.contact .field textarea:focus {
  border-color: var(--acid);
}
.contact .send {
  background: var(--acid);
  color: #111;
  border-color: var(--acid);
  border-radius: 40px;
}
.contact .send:hover {
  background: #f0f5eb;
}
.contact .contact-result {
  border-color: var(--acid);
}
.footer {
  background: var(--ink);
  color: var(--paper);
  padding: 35px var(--pad) 28px;
  padding-top: 65px;
}
.footer-top {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  align-items: start;
  position: relative;
}
.footer-asterisk {
  font-size: clamp(5rem,13vw,14.375rem);
  line-height: 1;
  color: var(--acid);
  transform: rotate(-10deg);
}
.footbrand {
  font: 900 clamp(3.4375rem,10vw,10.9375rem)/.9 var(--condensed);
  text-transform: uppercase;
  font-size: clamp(4.375rem,12.5vw,15rem);
}
.floating-cta {
  display: none;
  position: fixed;
  bottom: 16px;
  right: 16px;
  z-index: 70;
  background: var(--acid);
  color: #101811;
  padding: 14px 17px;
  border-radius: 100px;
  font-size: 0.6875rem;
  font-weight: 900;
  letter-spacing: .03em;
  box-shadow: 0 8px 23px #0006;
}
.floating-cta span {
  margin-left: 9px;
  font-size: 1.0625rem;
}
@media (max-width:1120px) {
  .pricing-intro-stamp {
    right: 10%;
    top: 285px;
  }
  .plans {
    gap: 20px;
  }
  .plan {
    min-height: 600px;
  }
  .plan:nth-child(2),.plan:nth-child(4) {
    transform: translateY(0);
  }
  .topbar {
    width: calc(100% - 32px);
  }
}
@media (max-width:760px) {
  .mobilemenu {
    top: 0;
    inset: 0;
    z-index: 58;
    padding: 85px var(--pad) 25px;
  }
  .mobilemenu a {
    font-size: clamp(2.5rem,11vw,4.0625rem);
  }
  .mobiletoggle {
    z-index: 70;
    color: #f2f8f1;
  }
  .hero {
    padding-top: 96px;
    padding-bottom: 49px;
  }
  .hero-brand {
    transform-origin: center;
  }
  .manifesto-signal {
    margin-top: 52px;
    font-size: clamp(1.125rem,7vw,2.9375rem);
    gap: 9px;
    padding: 16px 8px;
  }
  .service-row {
    margin-bottom: 9px;
  }
  .service-btn {
    padding: 22px 14px;
  }
  .service-desc {
    margin: 0 18px 22px 55px;
  }
  .showcase-grid {
    display: flex;
    grid-template-columns: none;
    grid-template-rows: none;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  .show-tile:first-child {
    grid-column: auto;
  }
  .show-tile:nth-child(2) .fake-media b {
    font-size: 6.875rem;
  }
  .show-tile:nth-child(3) .fake-media b {
    font-size: 5.9375rem;
  }
  .showcase-note-band {
    font-size: 0.5625rem;
  }
  .showcase-note-band span:nth-child(2) {
    display: none;
  }
  .pricing {
    padding-bottom: 110px;
  }
  .pricing-intro-stamp {
    width: 92px;
    height: 92px;
    font-size: 1.25rem;
    top: 265px;
    right: 15px;
  }
  .pricing-intro-stamp span {
    font-size: 1.375rem;
  }
  .plans {
    gap: 18px;
  }
  .plan {
    padding: 27px 25px;
  }
  .plan:nth-child(3),.plan:nth-child(4) {
    margin-top: 0;
  }
  .plan h3 {
    font-size: 3.625rem;
  }
  .faq-layout {
    grid-template-columns: 1fr;
  }
  .faq-list summary {
    padding: 22px 2px;
  }
  .contact:before {
    clip-path: ellipse(80% 50% at 50% 40%);
  }
  .contact:after {
    display: none;
  }
  .contact-orbit {
    margin-top: 30px;
  }
  .contact-grid {
    margin-top: 65px;
  }
  .contact form {
    grid-template-columns: 1fr;
  }
  .floating-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .footer-top {
    display: flex;
    flex-wrap: wrap;
  }
  .footbrand {
    font-size: clamp(3.4375rem,12vw,6.5625rem);
  }
  .footer-asterisk {
    font-size: 6.25rem;
  }
}
@media (max-width:420px) {
  .hero-brand {
    width: 91vw;
  }
  .manifesto-signal {
    font-size: 6.2vw;
  }
  .pricing-intro-stamp {
    top: 300px;
  }
  .plan-price strong {
    font-size: 2.625rem;
  }
  .faq-list summary {
    font-size: 0.9375rem;
  }
}
@media (max-width:760px) {
  .contact-grid {
    grid-template-columns: minmax(0,1fr);
  }
  .contact-grid>div {
    min-width: 0;
  }
  .contact-head {
    grid-template-columns: minmax(0,1fr);
  }
  .contact-head .display {
    font-size: clamp(2.9375rem,10.5vw,4.6875rem);
    overflow-wrap: anywhere;
  }
  .faq-title-area .display {
    font-size: clamp(3.25rem,11vw,5.3125rem);
  }
  .showcase-note-band {
    max-width: 100%;
  }
}
@media (max-width:420px) {
  .contact-head .display {
    font-size: clamp(2.75rem,10.3vw,3.75rem);
  }
  .contact .field select {
    width: 100%;
  }
}
@media (min-width:761px) {
  .footer {
    overflow: hidden;
  }
}
@media (max-width:760px) {
  .service-layout {
    grid-template-columns: minmax(0,1fr);
  }
  .service-list {
    min-width: 0;
  }
  .service-btn {
    grid-template-columns: 27px minmax(0,1fr) 25px;
  }
  .service-btn .name {
    font-size: clamp(1.8125rem,7.9vw,3.5rem);
    overflow-wrap: anywhere;
  }
  .footer {
    overflow: hidden;
  }
}
@media (max-width:420px) {
  .footer .footbrand {
    font-size: 3rem;
  }
  .section .display {
    overflow-wrap: anywhere;
  }
}
html {
  scroll-padding-top: 72px;
}
body {
  margin: 0;
  color: var(--paper);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  background: #0d110e;
}
.topbar .navlogo {
  font-size: 1rem;
}
.topbar .navlinks {
  gap: clamp(12px,2vw,28px);
}
.topbar .navlinks a {
  font-size: 0.625rem;
}
.hero-glow {
  position: absolute;
  inset: -30%;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 21% 27% at var(--mouse-x,50%) var(--mouse-y,28%),#d3ffba48,transparent 90%);
  mix-blend-mode: screen;
  transition: opacity .2s;
}
.hero h1 {
  font: 900 clamp(3.75rem,8.4vw,9.6875rem)/.85 var(--condensed);
  text-transform: uppercase;
  margin: 0;
  letter-spacing: -.061em;
}
.hero h1 em {
  letter-spacing: -.02em;
  color: var(--acid);
}
.hero-side {
  align-self: end;
  padding-bottom: 6px;
}
@keyframes stickerTurn {
  to {
    rotate: 360deg;
  }
}
@keyframes heroTitleEnter {
  from {
    opacity: 0;
    translate: 0 34px;
    filter: blur(12px);
  }
  to {
    opacity: 1;
    translate: 0 0;
    filter: blur(0);
  }
}
.ticker {
  overflow: hidden;
  white-space: nowrap;
  font: 900 clamp(1.1875rem,2.5vw,2.1875rem)/1 var(--condensed);
  letter-spacing: .05em;
  padding: 14px 0 12px;
  background: #0d120e;
  color: var(--acid);
  border-top: 1px solid var(--acid);
  border-bottom: 1px solid #39553d;
  font-family: var(--heading);
  font-weight: 900;
  font-size: clamp(1.5rem,3vw,2.75rem);
  line-height: .8;
  position: relative;
  z-index: 2;
}
.tickflow {
  display: flex;
  width: max-content;
  animation: marquee 28s linear infinite;
  animation-duration: 25s;
  gap: 28px;
}
.ticker i {
  color: #edfbec;
}
.ticker:hover .tickflow {
  animation-play-state: paused;
}
.section-head {
  font-size: 0.625rem;
  letter-spacing: .15em;
}
.manifesto {
  position: relative;
  background: #161918;
  min-height: 700px;
  overflow: hidden;
  isolation: isolate;
}
.manifesto .display {
  max-width: 1100px;
  letter-spacing: -.03em;
  position: relative;
  z-index: 2;
  font-size: clamp(4.125rem,8.7vw,9.375rem);
}
.manifesto-signal b {
  font-family: var(--sans);
  font-size: 1.5em;
  font-weight: 500;
  color: var(--acid);
}
.services h2 {
  font-size: clamp(5.125rem,10vw,10.3125rem);
}
.service-layout {
  gap: 5vw;
  align-items: start;
}
.service-btn .name {
  font-family: var(--heading);
  font-weight: 900;
  letter-spacing: -.04em;
}
.service-btn .name::after {
  content: "";
  height: 3px;
  background: var(--acid);
  display: block;
  position: absolute;
  left: 60px;
  right: 40px;
  bottom: 8px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .55s cubic-bezier(.2,.8,.2,1);
}
.service-row:hover .name::after {
  transform: scaleX(1);
}
.service-row.open .name::after {
  transform: scaleX(.12);
}
.arttext {
  position: absolute;
  font: 900 clamp(3.75rem,10vw,9.0625rem)/.82 var(--condensed);
  color: var(--acid);
  text-align: center;
  mix-blend-mode: screen;
  text-transform: uppercase;
  max-width: 90%;
  overflow-wrap: anywhere;
  font-size: clamp(5.3125rem,11vw,10.3125rem);
  font-family: var(--heading);
  font-weight: 900;
  letter-spacing: -.08em;
  transition: transform .45s cubic-bezier(.2,.75,.2,1),opacity .3s;
}
.art-radar {
  position: absolute;
  width: 90%;
  aspect-ratio: 1;
  pointer-events: none;
  border-radius: 50%;
  border: 1px dashed #74cc8866;
  animation: stickerTurn 36s linear infinite reverse;
}
.service-ticket {
  position: absolute;
  top: 25px;
  left: 20px;
  right: 20px;
  display: flex;
  justify-content: space-between;
  color: #1a241a;
  font-size: 0.5625rem;
  transform: rotate(-9deg);
  transition: transform .4s;
}
.service-art:hover .service-ticket {
  transform: rotate(-1deg);
}
.process::before {
  content: "✳";
  position: absolute;
  right: -7vw;
  top: 10%;
  font-size: clamp(16.25rem,45vw,48.75rem);
  line-height: .8;
  animation: stickerTurn 100s linear infinite;
  pointer-events: none;
}
.process h2 {
  max-width: 1200px;
  position: relative;
  z-index: 1;
}
.stepnum {
  font: 900 clamp(2.75rem,5vw,5.125rem)/1 var(--condensed);
  font-family: var(--heading);
  font-weight: 900;
}
.audience {
  background: #171c18;
}
.aud-grid {
  gap: 14px;
  background: transparent;
  border: 0;
}
.aud-card:hover::after {
  transform: rotate(-12deg) scale(1.1);
}
.aud-card:first-child {
  transform: translateY(25px);
}
.inbetween {
  position: relative;
  height: 330px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.inbetween-run {
  display: flex;
  white-space: nowrap;
  animation: marquee 23s linear infinite;
  width: max-content;
  gap: 40px;
  font: 900 clamp(5.875rem,13.2vw,13.75rem)/.83 var(--heading);
  letter-spacing: -.07em;
}
.inbetween-run span {
  display: block;
}
.inbetween-run span:nth-child(even) {
  color: transparent;
  -webkit-text-stroke: 2px #111;
}
.inbetween-outline {
  position: absolute;
  right: 3.5vw;
  bottom: 15px;
  color: #155d27;
  font-family: monospace;
  font-size: 0.625rem;
  letter-spacing: .15em;
  transform: rotate(-3deg);
}
.showcase {
  background: #0d110e;
}
.showcase-intro .display {
  font-size: clamp(5rem,10vw,9.6875rem);
}
.showcase-grid {
  padding-bottom: 22px;
  scrollbar-width: thin;
  scrollbar-color: var(--acid) #202923;
}
.show-tile {
  border-radius: 8px;
  min-height: 0;
  transition: filter .4s;
}
.show-tile:first-child {
  background-position: center center;
  grid-row: auto;
}
.show-tile::after {
  content: "↗";
  position: absolute;
  right: 18px;
  top: 14px;
  border: 1px solid #efffec;
  border-radius: 50%;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: white;
  transition: background .3s,color .3s,transform .3s;
}
.show-tile:hover::after {
  background: var(--acid);
  color: #101a12;
  transform: rotate(45deg);
}
.show-tile .fake-media {
  transition: transform .8s cubic-bezier(.2,.7,.2,1);
}
.show-tile:hover .fake-media {
  transform: scale(1.05);
}
.pricing::before {
  content: "✳";
  position: absolute;
  font: 900 34.375rem/.8 var(--heading);
  right: -70px;
  top: 60px;
  pointer-events: none;
  transform: rotate(var(--price-rotate,-10deg));
}
.plans {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  margin-top: 100px;
  position: relative;
  z-index: 2;
  gap: 14px;
}
.plan:nth-child(2) {
  transform: rotate(-2deg) translateY(22px);
}
.plan:nth-child(3) {
  transform: rotate(2deg) translateY(-9px);
}
.plan:nth-child(4) {
  transform: rotate(-1deg) translateY(42px);
}
.plan:hover,.plan:nth-child(2):hover,.plan:nth-child(3):hover,.plan:nth-child(4):hover {
  transform: translateY(-16px) rotate(0);
  box-shadow: 15px 18px 0 #10331d55;
}
.plan h3 {
  font-family: var(--heading);
  font-weight: 900;
}
.pricing-foot {
  margin-top: 105px;
}
.studio-offer {
  margin-top: 60px;
  background: #111713;
  box-shadow: 8px 9px 0 #4ba35a;
  border-radius: 0;
  transform: rotate(-.5deg);
  transition: transform .4s;
}
.studio-offer:hover {
  transform: rotate(0deg);
}
.studio-offer h3 {
  font: 900 clamp(2.9375rem,6vw,5.75rem)/.9 var(--condensed);
  margin: 15px 0 0;
  text-transform: uppercase;
  font-family: var(--heading);
  font-weight: 900;
}
.about-art:hover {
  transform: rotate(0deg) scale(1.015);
}
.faq-section .display,.contact .display {
  font-family: var(--heading);
  font-weight: 900;
}
.contact {
  color: #eaf5e9;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #0a120d;
}
.contact-orbit span {
  font: 900 7.375rem/.8 var(--condensed);
  font-size: clamp(6.25rem,16vw,12.8125rem);
  animation: stickerTurn 22s linear infinite;
  display: inline-block;
  line-height: .8;
}
.contact-orbit {
  margin-bottom: 0;
}
.contact-head .display {
  letter-spacing: -.063em;
}
.js-motion .motion-reveal {
  opacity: 0;
  transform: translateY(54px) rotate(.8deg);
  filter: blur(5px);
  transition: opacity .9s cubic-bezier(.2,.7,.2,1),transform .95s cubic-bezier(.2,.75,.2,1),filter .9s;
}
.js-motion .motion-reveal.in-view {
  opacity: 1;
  transform: translateY(0) rotate(0);
  filter: blur(0);
}
.js-motion .motion-reveal:nth-child(2) {
  transition-delay: .08s;
}
.js-motion .motion-reveal:nth-child(3) {
  transition-delay: .13s;
}
.js-motion .motion-reveal:nth-child(4) {
  transition-delay: .18s;
}
@media (max-width:1120px) {
  .plans {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .plan:nth-child(n) {
    transform: none;
  }
  .plan:nth-child(3),.plan:nth-child(4) {
    margin-top: 0;
  }
  .pricing-foot {
    margin-top: 50px;
  }
}
@media (max-width:760px) {
  .topbar .navlogo {
    font-size: 0.9375rem;
  }
  .hero h1 {
    letter-spacing: -.065em;
  }
  .ticker {
    padding: 13px 0;
    font-size: clamp(1.625rem,5vw,2.1875rem);
  }
  .manifesto {
    min-height: 0;
  }
  .manifesto .display {
    font-size: clamp(3.5rem,12.5vw,6.25rem);
  }
  .services h2 {
    font-size: clamp(4.0625rem,12vw,6.25rem);
  }
  .service-row:hover .name::after {
    display: none;
  }
  .process::before {
    font-size: 29.375rem;
    top: 5%;
    right: -40%;
  }
  .aud-card:first-child {
    transform: none;
  }
  .inbetween {
    height: 190px;
  }
  .inbetween-run {
    font-size: clamp(4.375rem,16vw,6.875rem);
    gap: 28px;
  }
  .inbetween-outline {
    font-size: 0.5625rem;
  }
  .showcase-intro .display {
    font-size: clamp(3.75rem,12vw,6.25rem);
  }
  .showcase-grid {
    padding: 16px 9vw 23px 0;
    margin-top: 30px;
  }
  .show-tile,.show-tile:nth-child(2),.show-tile:nth-child(3) {
    flex: 0 0 85vw;
    height: 385px;
    min-height: 385px;
  }
  .pricing .display {
    font-size: clamp(4.0625rem,12vw,6.25rem);
  }
  .pricing-intro-stamp {
    animation-duration: 28s;
  }
  .plans {
    margin-top: 53px;
  }
  .plan:nth-child(n) {
    transform: none !important;
  }
  .plan:hover,.plan:nth-child(n):hover {
    transform: translateY(-5px) !important;
    box-shadow: 7px 8px 0 #10331d55;
  }
  .pricing::before {
    font-size: 18.75rem;
    right: -80px;
    top: 170px;
  }
  .studio-offer {
    transform: none;
  }
  .pricing-foot {
    margin-top: 35px;
  }
  .contact-orbit span {
    font-size: 6.75rem;
  }
  .contact:before {
    top: 0;
    height: 36%;
  }
  .js-motion .motion-reveal {
    transform: translateY(32px) rotate(0);
  }
}
@media (max-width:420px) {
  .manifesto .display {
    font-size: clamp(3.0625rem,12vw,3.75rem);
  }
  .services h2 {
    font-size: clamp(3.25rem,13vw,4.375rem);
  }
  .showcase-intro .display {
    font-size: clamp(3.125rem,12vw,3.8125rem);
  }
  .show-tile,.show-tile:nth-child(2),.show-tile:nth-child(3) {
    height: 345px;
    min-height: 345px;
  }
  .pricing .display {
    font-size: clamp(3.75rem,11.8vw,4.875rem);
  }
}
@media (max-height:720px) and (min-width:761px) {
  .hero {
    padding-top: 78px;
    padding-bottom: 23px;
  }
  .hero-brand {
    max-height: 27svh;
  }
  .hero h1 {
    font-size: clamp(3.375rem,6vw,5.9375rem);
  }
}
@media (max-height:690px) and (max-width:760px) {
  .hero-brand {
    max-height: 19svh;
  }
  .hero h1 {
    font-size: clamp(2.8125rem,10.5vw,4.5625rem);
  }
  .hero-side p {
    font-size: 0.6875rem;
  }
}
@media (hover:none) {
  .hero-glow {
    display: none;
  }
}
@media (prefers-reduced-motion:reduce) {
  .js-motion .motion-reveal {
    opacity: 1;
    transform: none;
    filter: none;
  }
  .inbetween-run,.art-ring,.art-radar,.pricing-intro-stamp,.contact-orbit span {
    animation: none !important;
  }
  .hero-glow {
    display: none;
  }
}
@media (max-width:760px) {
  .floating-cta {
    opacity: 0;
    transform: translateY(95px);
    pointer-events: none;
    transition: opacity .32s,transform .42s cubic-bezier(.2,.7,.2,1);
  }
  .floating-cta.is-visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }
}
.topbar {
  position: fixed;
  z-index: 60;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  transition: background .35s,color .35s,border .35s;
  border-bottom: 1px solid transparent;
  background: rgba(12,15,13,.93);
  border-radius: 60px;
  color: white;
  top: 12px;
  width: min(calc(100% - 42px),1410px);
  padding: 9px 20px;
  min-height: 50px;
  border: 1px solid #3f4e43;
  box-shadow: 0 9px 35px #001c0c35;
  transform: translateX(-50%);
  left: 50%;
  right: auto;
  backdrop-filter: blur(16px);
}
.topbar:not(.scrolled) {
  background: #101a12;
  color: #eff7ec;
  border-radius: 999px;
}
.topbar.scrolled {
  background: #101a12e8;
  border: 1px solid #57695a;
  border-radius: 999px;
}
.topbar .navcta {
  padding: 10px 17px;
  background: var(--acid);
  color: #0d160e;
  border: 0;
  border-radius: 999px;
  transition: background .25s,transform .25s;
}
.topbar .navcta:hover {
  opacity: 1;
  background: #e7ffe9;
  transform: rotate(-2deg);
}
.hero {
  background-position: center center;
  overflow: hidden;
}
.hero::after {
  inset: 36% 0 0;
  background: linear-gradient(180deg,transparent,rgba(9,14,10,.17) 18%,rgba(6,10,7,.76) 72%,#08100acc);
}
.hero-brand {
  align-self: center;
  position: relative;
  z-index: 3;
  display: block;
  height: auto;
  object-fit: contain;
  will-change: transform;
}
.hero h1,.display,.service-btn .name,.aud-card h3,.plan h3,.about-copy h2,.faq-section .display,.contact .display {
  letter-spacing: var(--heading-track) !important;
}
.hero h1 {
  font-weight: 900;
  font-stretch: condensed;
  font-size: clamp(4.25rem,7.3vw,7.625rem);
  max-width: 1040px;
  text-wrap: balance;
  transform: translateY(0);
  animation: heroTitleEnter 1.1s cubic-bezier(.2,.78,.2,1) both;
}
.hero-side p {
  line-height: 1.47;
}
.hero-rule {
  position: absolute;
  left: var(--pad);
  right: var(--pad);
  color: #dfe7da;
  display: flex;
  justify-content: space-between;
  gap: 15px;
  border-top: 1px solid #e8f2df60;
  z-index: 4;
  font-size: 0.5rem;
}
.services {
  color: var(--ink);
  background: var(--beige);
}
.pricing {
  background: var(--paper2) !important;
  color: #111713;
  position: relative;
  overflow: hidden;
}
.pricing::before {
  color: #0d46110e;
}
.pricing .display {
  position: relative;
  z-index: 2;
}
.process::before {
  color: #15351a12;
}
.inbetween {
  background: var(--paper2);
  color: #101411;
  border-top: 1px solid #193b20;
  border-bottom: 1px solid #193b20;
}
.showcase .show-tile:nth-child(2) {
  background: var(--paper2) !important;
  color: #171d18;
}
.about-art {
  border-radius: 5px;
  box-shadow: 15px 15px 0 #334038;
  transform: rotate(-3deg);
  transition: transform .55s cubic-bezier(.2,.75,.2,1);
  background: var(--paper2);
}
.footbrand {
  font-family: var(--heading);
  font-weight: 900;
  letter-spacing: -.07em;
  display: flex;
  align-items: center;
}
.footbrand img {
  width: min(320px,42vw);
  height: auto;
  filter: brightness(0) invert(1);
  opacity: .98;
}
@media (max-width:1120px) {
  .hero h1 {
    font-size: clamp(3.875rem,7.7vw,6.5rem);
  }
}
@media (max-width:760px) {
  .topbar {
    top: 8px;
    width: calc(100% - 24px);
    min-height: 46px;
    padding: 8px 16px;
  }
  .mobilemenu {
    padding-top: 80px;
  }
  .hero {
    max-height: none;
    background-position: 52% center;
  }
  .hero-brand {
    margin: 0 auto 1vh;
    align-self: center;
  }
  .hero h1 {
    line-height: .88;
  }
  .hero-side {
    align-items: end;
    justify-content: space-between;
    gap: 12px;
  }
  .hero-side p {
    line-height: 1.42;
  }
  .hero-side .roundlink {
    min-width: 0;
    gap: 10px;
  }
  .hero-rule {
    letter-spacing: .1em;
  }
  .services {
    background: #efede6;
  }
  .pricing {
    background: var(--paper2) !important;
  }
  .process {
    background: var(--beige);
  }
  .footbrand img {
    width: min(260px,60vw);
  }
}
@media (max-width:420px) {
  .hero-side {
    display: block;
  }
  .hero-side p {
    max-width: 310px;
    font-size: 0.75rem;
    margin-bottom: 1px;
  }
  .footbrand img {
    width: min(220px,70vw);
  }
}
.hero-side p,.hero-rule,.extras p,.service-desc,.manifesto .bodycopy,
.step p,.aud-card p,.showcase-intro p,.pricing-lede p,
.plan-summary,.plan li,.studio-offer p,.about-copy p,.faq-title-area p,
.faq-list details p,.contact-head p,.contact-side p,.contact .contact-result p {
  font-size: var(--description-size) !important;
  line-height: 1.54;
  letter-spacing: normal;
}
.hero-rule {
  font-weight: 700;
  letter-spacing: .025em !important;
  line-height: 1.2;
  padding-top: 11px;
  bottom: 11px;
  max-width: calc(100% - 2 * var(--pad));
}
.hero-rule span {
  color: var(--acid);
  font-size: 1.05em;
}
.services {
  padding-bottom: clamp(70px,7vw,110px);
}
.extras {
  border-top: 1px solid #a7aba3;
  display: flex;
  justify-content: space-between;
  margin-top: 34px !important;
  padding-top: 24px;
  gap: clamp(20px,4vw,60px);
  align-items: start;
}
.extras strong {
  font-family: var(--condensed);
  text-transform: uppercase;
  font-weight: 400;
  font-size: clamp(2rem,3vw,2.75rem);
  line-height: 1.04;
  max-width: 380px;
}
.extras p {
  max-width: 650px;
  margin: 0;
}
.hero h1,.display,.service-btn .name,.aud-card h3,.plan h3,
.about-copy h2,.contact-side h3,.studio-offer h3,.extras strong,
.faq-title-area .display,.pricing .display,.showcase-intro .display {
  letter-spacing: var(--heading-track) !important;
}
.topbar,.service-row,.service-art,.plan,.plan:hover,.plan.featured,
.studio-offer,.about-art,.floating-cta,.pricing-intro-stamp {
  box-shadow: none !important;
  text-shadow: none !important;
}
.service-row {
  position: relative;
  isolation: isolate;
  transition: padding .2s;
  border: 1px solid #17251b1c;
}
.pricing-intro-stamp {
  z-index: 2;
  animation: none !important;
  transform: translate3d(var(--stamp-x,0px),var(--stamp-y,0px),0) !important;
  transition: transform .24s cubic-bezier(.22,.75,.23,1);
  will-change: transform;
  border: 1px solid #46634d;
}
.hero {
  height: calc(100svh - 68px) !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: clamp(76px,9vh,118px) var(--pad) clamp(25px,4vh,39px) !important;
  display: flex;
  justify-content: space-between;
}
.hero-bottom {
  color: var(--paper);
  display: grid;
  position: relative;
  z-index: 4;
  margin-bottom: 36px;
}
.hero h1 {
  line-height: .9;
}
.ticker {
  min-height: 68px;
}
@media (max-width:1120px) {
  .hero {
    height: calc(100svh - 66px) !important;
    min-height: 0 !important;
  }
}
@media (max-width:760px) {
  .hero {
    height: calc(100svh - 64px) !important;
    min-height: 0 !important;
    padding: clamp(68px,9svh,83px) var(--pad) 23px !important;
  }
  .hero h1 {
    font-size: clamp(3.1875rem,10.7vw,5.0625rem);
    margin-bottom: 15px;
  }
  .hero-side {
    display: block;
  }
  .hero-bottom {
    margin-bottom: 56px;
  }
  .hero-side p {
    max-width: 500px;
    margin: 0 0 5px;
  }
  .hero-rule {
    font-size: var(--description-size) !important;
    bottom: 8px;
    padding-top: 7px;
  }
  .extras {
    flex-direction: column;
    gap: 12px;
    margin-top: 27px !important;
    padding-top: 18px;
  }
  .extras strong {
    max-width: none;
  }
  .services {
    padding-bottom: 72px;
  }
  .ticker {
    min-height: 64px;
  }
  .pricing-intro-stamp {
    transition: transform .28s ease-out;
  }
}
@media (max-width:420px) {
  .hero {
    height: calc(100svh - 64px) !important;
    min-height: 0 !important;
    padding-top: 68px !important;
    padding-bottom: 22px !important;
  }
  .hero-brand {
    max-height: 27svh;
  }
  .hero h1 {
    font-size: clamp(3.0625rem,11.35vw,4rem);
    line-height: .89;
    margin-bottom: 10px;
  }
  .hero-side .roundlink {
    padding: 7px 0;
  }
  .hero-rule {
    font-size: var(--description-size) !important;
    line-height: 1.12;
  }
}
@media (max-height:740px) and (min-width:761px) {
  .hero {
    padding-top: 72px !important;
    padding-bottom: 23px !important;
  }
  .hero-brand {
    max-height: 26svh;
  }
  .hero h1 {
    font-size: clamp(3rem,6.4vw,6.375rem);
  }
  .hero-side p {
    font-size: 1rem !important;
  }
  .hero-rule {
    font-size: 0.875rem !important;
  }
}
@media (max-height:710px) and (max-width:760px) {
  .hero {
    padding-top: 64px !important;
    padding-bottom: 19px !important;
  }
  .hero-brand {
    max-height: 18svh;
  }
  .hero h1 {
    font-size: clamp(2.5625rem,10.2vw,4.0625rem);
  }
  .hero-side p {
    font-size: 1rem !important;
  }
  .hero-rule {
    font-size: 0.75rem !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .pricing-intro-stamp {
    transition: none !important;
    transform: none !important;
    will-change: auto;
  }
}
.hero-bottom {
  grid-template-columns: minmax(0,1.35fr) minmax(280px,.6fr);
  align-items: end;
  gap: clamp(25px,5vw,90px);
}
.hero-side p {
  font-size: clamp(1.0625rem,1.35vw,1.25rem) !important;
  max-width: 460px;
  font-weight: 500;
}
.hero-side .roundlink {
  font-size: 0.8125rem;
  min-width: 235px;
  margin-top: 15px;
}
.manifesto-layout {
  display: grid;
  position: relative;
  z-index: 2;
  grid-template-columns: minmax(0,1.5fr) minmax(300px,.65fr);
  gap: 6vw;
  align-items: center;
}
.manifesto .bodycopy {
  margin-bottom: 10px;
  position: relative;
  z-index: 2;
  max-width: 580px;
  font-size: clamp(1.125rem,1.8vw,1.5625rem) !important;
  line-height: 1.48 !important;
}
.manifesto-signal {
  transition: transform .25s;
  position: relative;
  z-index: 2;
}
.services-independent-note {
  color: #4b5b4e;
  font-size: 0.75rem;
  line-height: 1.55;
  margin: 15px 5px 0;
}
.service-art {
  background: #18241a;
  border-radius: 0;
  min-height: 480px;
  top: 90px;
  box-shadow: 14px 14px 0 #a7baaa;
  border: none !important;
}
.art-ring {
  width: 70%;
  aspect-ratio: 1;
  border: 2px solid var(--acid);
  border-radius: 50%;
  position: relative;
  animation: stickerTurn 55s linear infinite;
  border-style: dashed;
  transform: rotate(-13deg);
}
.service-art::after {
  content: "◈";
  position: absolute;
  color: var(--acid);
  font: 900 clamp(10rem,23vw,23.75rem)/1 var(--condensed);
  opacity: .15;
  transform: rotate(24deg);
}
.process-bottom {
  display: flex;
  justify-content: flex-end;
  margin-top: 165px;
  position: relative;
  z-index: 2;
}
.aud-card {
  min-width: 0;
  padding: clamp(24px,4vw,65px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: background .3s;
  background: #222923;
  min-height: 490px;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.aud-card>div,.aud-card>.aud-label,.aud-card>.aud-arrow {
  position: relative;
  z-index: 2;
}
.aud-card h3 {
  font: 900 clamp(3.375rem,7vw,7.5rem)/.85 var(--condensed);
  letter-spacing: -.03em;
  text-transform: uppercase;
  margin: 40px 0;
  font-family: var(--heading);
  font-weight: 900;
  font-size: clamp(3.75rem,7.2vw,7.8125rem);
  white-space: nowrap;
}
.showcase-intro {
  display: grid;
  position: relative;
  grid-template-columns: minmax(0,1.2fr) minmax(360px,.75fr);
  align-items: center;
  gap: 7vw;
}
.showcase-intro p {
  font-size: clamp(1.3125rem,2.15vw,1.875rem) !important;
  line-height: 1.37 !important;
  max-width: 660px;
  color: #e4ede4;
  font-weight: 600;
  letter-spacing: -.028em !important;
}
.show-nav {
  display: flex;
  gap: 8px;
  margin-left: auto;
}
.show-nav button {
  border: 1px solid #5e7363;
  background: transparent;
  color: var(--paper);
  font-size: 1.4375rem;
  width: 43px;
  height: 43px;
}
.show-nav button:hover,.show-nav button:focus-visible {
  color: var(--ink);
  background: var(--acid);
}
.showcase-grid {
  display: flex !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory;
  gap: 18px;
  margin-top: 37px;
  padding: 16px 20px 35px 0;
  cursor: grab;
}
.showcase-grid.dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}
.show-tile {
  flex: 0 0 min(49vw,710px) !important;
  height: clamp(340px,37vw,555px) !important;
  position: relative;
  overflow: hidden;
  background: #19231a;
  border: 1px solid #38473a !important;
  scroll-snap-align: start;
  transform: none !important;
}
.show-tile:nth-child(2) {
  flex-basis: min(37vw,520px) !important;
}
.show-tile:nth-child(3) {
  flex-basis: min(44vw,630px) !important;
}
.show-tile:nth-child(4) {
  flex-basis: min(38vw,540px) !important;
}
.show-tile .fake-media {
  min-height: 0;
  height: calc(100% - 60px);
}
.show-tile footer {
  z-index: 2;
  height: 60px;
  background: #101811;
  color: #d9f8df;
  padding: 15px 20px;
}
.show-tile .show-open {
  position: absolute;
  right: 15px;
  bottom: 77px;
  border: 1px solid #d3f4d4;
  color: #eaffed;
  background: #14281cbf;
  font-size: 0.6875rem;
  font-weight: bold;
  letter-spacing: .1em;
  padding: 12px 15px;
}
.show-open:hover {
  background: var(--acid);
  color: #101a12;
}
.show-study-one .fake-media {
  background: var(--acid) url("assets/degrade-bg.jpg") center/cover;
}
.show-study-one .fake-media img {
  width: 80%;
  max-height: 85%;
  object-fit: contain;
  filter: none;
}
.show-study-two .fake-media {
  background: #f0eee5 !important;
  color: #121814 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.show-study-two .fake-media img,
.show-study-three .fake-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: normal;
}

.tiny-dot {
  color: #268c42;
}
.study-corner {
  font-size: 0.625rem;
  letter-spacing: .15em;
  position: absolute;
  top: 24px;
  left: 24px;
}
.show-study-three .fake-media {
  background: radial-gradient(ellipse at 68% 20%,#32533a,#111b14 60%);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.show-study-three .fake-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,#080d0aa8,#080d0a28);
  pointer-events: none;
}
.show-study-three .fake-media > b {
  position: absolute;
  z-index: 1;
  text-shadow: 0 2px 18px #080d0a;
}
.show-study-three .fake-media>b {
  font: 900 clamp(4.6875rem,9.5vw,10rem)/.85 var(--heading);
  letter-spacing: -.05em;
  color: #e9f3e6;
  transform: rotate(6deg);
}
.show-study-four .fake-media {
  background: repeating-linear-gradient(135deg,#1a241c 0 24px,#26442c 24px 26px,#142018 26px 50px);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.show-study-four .fake-media>b {
  font: 900 clamp(5rem,9vw,9.375rem)/.78 var(--heading);
  letter-spacing: -.07em;
  color: var(--acid);
  transform: rotate(-6deg);
}
.study-dialog {
  width: min(680px,calc(100% - 32px));
  border: 1px solid #5e7f64;
  padding: clamp(24px,4vw,45px);
  background: #111813;
  color: #f3f5ee;
}
.study-dialog::backdrop {
  background: #080d0add;
  backdrop-filter: blur(5px);
}
.study-dialog p {
  font-size: 1.0625rem;
  line-height: 1.6;
}
.study-close {
  position: absolute;
  right: 16px;
  top: 9px;
  border: 0;
  background: transparent;
  color: white;
  font-size: 2.25rem;
}
.plans {
  align-items: stretch !important;
}
.plan {
  border-radius: 0 !important;
  transition: transform .4s cubic-bezier(.2,.75,.2,1),box-shadow .4s;
  will-change: transform;
  display: flex;
  min-height: 630px !important;
  box-shadow: none !important;
}
.plan.featured {
  background: #152119 !important;
  color: #f3f7ef !important;
  border-color: #42ed6a !important;
}
.plan.featured-drop {
  border-top: 6px solid #39fc63 !important;
}
.plan.featured-production {
  border-top: 6px solid #39fc63 !important;
}
.plan.featured-drop::before,.plan.featured-production::before {
  content: "✳";
  position: absolute;
  right: 12px;
  top: 47px;
  font-size: 1.6875rem;
  color: var(--acid);
}
.plan .plan-top span:last-child {
  font-size: 0.625rem;
  letter-spacing: .08em;
  color: #68f88b;
}
.plan-summary {
  min-height: 92px;
}
.plan-price strong {
  color: var(--acid);
  font-family: var(--heading);
  font-weight: 900;
  letter-spacing: -.045em;
  font-size: clamp(1.75rem,2.7vw,2.6875rem) !important;
  white-space: nowrap;
}
.plan ul {
  padding-left: 18px;
}
.plan li {
  display: flex;
  gap: 9px;
  font-size: clamp(0.9375rem,1.08vw,1.0625rem) !important;
  line-height: 1.4 !important;
  margin-bottom: 12px;
}
.plan-details {
  border-top: 1px solid #67796a;
  margin-top: auto;
  padding-top: 15px;
  margin-bottom: 16px;
}
.plan-details summary {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  list-style: none;
  font-size: 0.6875rem;
  font-weight: 900;
  letter-spacing: .075em;
  padding: 6px 0 12px;
}
.plan-details summary::-webkit-details-marker {
  display: none;
}
.plan-details[open] summary span {
  transform: rotate(45deg);
}
.plan-details-body {
  border-top: 1px solid #49624e;
  padding: 13px 0 3px;
  font-size: 0.875rem;
  line-height: 1.48;
}
.plan-details-body strong {
  display: block;
  color: #8dfd9c;
  font-size: 0.8125rem;
}
.plan-details-body p {
  margin: 5px 0 14px;
  color: #e5ece6;
  font-size: 0.875rem;
}
.plan button[data-plan] {
  margin-top: 0;
}
.human-service {
  margin-top: 18px;
  padding: 32px 35px;
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 45px;
  border: 1px solid #555d55;
  background: #ecece5;
  color: #101611;
}
.human-service h3 {
  font: 900 clamp(2.6875rem,5vw,5rem)/.9 var(--heading);
  margin: 22px 0 0;
}
.human-service p {
  font-size: 1.0625rem;
  line-height: 1.55;
}
.human-service button {
  border: 1px solid #172017;
  background: transparent;
  color: #172017;
  padding: 15px 20px;
  font-weight: 900;
  font-size: 0.6875rem;
  letter-spacing: .07em;
}
.human-service button:hover {
  background: #151b17;
  color: #eff6ed;
}
.studio-offer button {
  padding: 15px 18px;
  background: var(--acid);
  color: var(--ink);
  border: 1px solid var(--acid);
  font-size: 0.6875rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 14px;
  cursor: pointer;
}
.about-carousel {
  position: relative;
  aspect-ratio: 1.12;
  overflow: hidden;
  padding: 0 !important;
  transform: none !important;
  border: 1px solid #5c765f;
}
.about-slides {
  position: absolute;
  inset: 0;
}
.about-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .65s ease;
  filter: none !important;
}
.about-slide.is-active {
  opacity: 1;
}
.about-carousel-top,.about-carousel-bottom {
  position: absolute;
  z-index: 3;
  left: 18px;
  right: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  color: white;
  font-size: 0.625rem;
  letter-spacing: .09em;
  font-weight: 900;
  text-shadow: 0 1px 2px #0007;
}
.about-carousel-top {
  top: 19px;
}
.about-carousel-bottom {
  bottom: 16px;
}
.about-carousel-bottom button {
  background: #192b1d;
  border: 1px solid #cee6d0;
  color: white;
  font-size: 1.0625rem;
  width: 34px;
  height: 34px;
  flex-shrink: 0;
}
.about-phrase {
  font: 900 clamp(1.375rem,3vw,2.625rem)/1 var(--heading);
  color: var(--acid);
  margin: 30px 0 14px;
}
.origin {
  line-height: 1.6 !important;
}
.faq-list details[open] summary .faq-icon {
  transform: rotate(45deg);
}
.faq-list details summary {
  font-size: clamp(1.1875rem,1.7vw,1.6875rem) !important;
}
.faq-list details p {
  font-size: clamp(1rem,1.17vw,1.125rem) !important;
}
.faq-title-area p {
  font-size: clamp(1.0625rem,1.3vw,1.25rem) !important;
}
.contact-head p {
  color: #c9d5ca;
  font-size: clamp(1.25rem,1.8vw,1.6875rem) !important;
  line-height: 1.4 !important;
  max-width: 580px;
}
.contact-result-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 15px;
}
.wa-send-link,.copy-message {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  font-size: 0.75rem;
  font-weight: bold;
  letter-spacing: .05em;
  text-align: center;
  padding: 12px 16px;
  background: var(--acid);
  color: var(--ink);
}
.copy-message {
  background: transparent;
  color: var(--paper);
  border: 1px solid #608766;
}
.footer-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 15px;
}
.footer-socials a {
  border: 1px solid #819082;
  padding: 9px 13px;
  font-size: 0.6875rem;
  letter-spacing: .03em;
  white-space: nowrap;
}
.footer-socials a:hover {
  background: var(--acid);
  color: var(--ink);
}
@media (max-width:1200px) {
  .process-bottom {
    margin-top: 130px;
  }
  .aud-card h3 {
    font-size: clamp(3.125rem,7.4vw,6.5625rem);
  }
  .showcase-intro {
    grid-template-columns: 1fr 1fr;
  }
  .show-tile {
    flex-basis: 60vw !important;
  }
  .show-tile:nth-child(2),.show-tile:nth-child(3),.show-tile:nth-child(4) {
    flex-basis: 50vw !important;
  }
  .plan-price strong {
    font-size: clamp(1.6875rem,3.2vw,2.5rem) !important;
  }
}
@media (max-width:760px) {
  .hero-bottom {
    display: block;
  }
  .hero-side p {
    font-size: clamp(1rem,3.8vw,1.1875rem) !important;
  }
  .hero-side .roundlink {
    font-size: 0.6875rem;
    margin-top: 4px;
  }
  .manifesto-layout {
    display: block;
  }
  .manifesto .bodycopy {
    margin-top: 35px;
    font-size: 1.1875rem !important;
  }
  .services .extras {
    display: block !important;
  }
  .service-art {
    min-height: 250px;
    height: 310px;
  }
  .process-bottom {
    margin-top: 60px;
  }
  .aud-card h3 {
    font-size: clamp(3.3125rem,13vw,5.125rem);
  }
  .showcase-intro {
    display: block;
  }
  .showcase-intro p {
    margin-top: 35px;
    font-size: 1.3125rem !important;
  }
  .showcase-note-band {
    flex-wrap: wrap;
  }
  .showcase-note-band>span {
    max-width: 160px;
  }
  .show-nav {
    margin-left: auto;
  }
  .showcase-grid {
    gap: 12px;
  }
  .show-tile,.show-tile:nth-child(n) {
    flex-basis: 85vw !important;
    height: clamp(380px,110vw,510px) !important;
  }
  .show-study-three .fake-media>b {
    font-size: 18vw;
  }
  .show-study-four .fake-media>b {
    font-size: 17vw;
  }
  .plans {
    grid-template-columns: 1fr !important;
  }
  .plan {
    min-height: unset !important;
  }
  .plan-summary {
    min-height: 0;
  }
  .plan-price strong {
    font-size: clamp(1.875rem,8.5vw,2.625rem) !important;
  }
  .human-service {
    grid-template-columns: 1fr;
    padding: 25px;
    gap: 10px;
  }
  .about-grid {
    gap: 40px;
  }
  .about-carousel {
    aspect-ratio: 1.1;
  }
  .contact-head p {
    font-size: 1.1875rem !important;
  }
  .footer-socials {
    gap: 7px;
  }
}
@media (prefers-reduced-motion:reduce) {
  .about-slide,.showcase-grid {
    transition: none !important;
    animation: none !important;
  }
}
.plan.featured .plan-summary,.plan.featured .plan-price span,.plan.featured .plan-price small {
  color: #e7f3e8 !important;
}
.plan.featured .plan-price strong {
  color: #39fc63 !important;
}
.plan.featured .plan-top {
  color: #f0f5ef !important;
}
.plan.featured .plan-top span:last-child {
  color: #8aff9c !important;
}
.plan.featured li {
  color: #e6eee6 !important;
}
.services .service-layout {
  align-items: stretch !important;
}
.services .service-list {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.services .extras {
  border-top: 2px solid #191f1a !important;
  width: 100%;
  max-width: none;
  display: block !important;
  box-sizing: border-box;
  margin: 15px 0 0 !important;
  padding: 24px 24px 23px !important;
  background: #f8f8f1;
  border: 1px solid #17251b25;
  border-radius: 11px;
}
.services .extras strong {
  display: block;
  max-width: none;
  font-size: clamp(1.8125rem,3vw,2.625rem);
  line-height: 1.06;
}
.services .extras p {
  margin-top: 12px;
  max-width: none;
  margin: 12px 0 0 !important;
  line-height: 1.5;
}
.services .services-independent-note {
  margin: 14px 4px 0 !important;
}
.services .service-art {
  position: relative !important;
  top: auto !important;
  align-self: stretch !important;
  height: auto !important;
  min-height: 0 !important;
}
.services .service-ticket,.services .service-art:hover .service-ticket {
  transform: none !important;
}
.services .service-ticket {
  display: grid;
  grid-template-columns: minmax(0,.85fr) minmax(0,1.25fr);
  gap: 9px;
  align-items: start;
}
.services .service-ticket span {
  position: relative;
  overflow: hidden;
  min-width: 0;
  background: var(--acid) !important;
  transform: none !important;
  color: #142418;
  font-size: clamp(1.3125rem,2.3vw,2.125rem);
  padding: 11px;
}
.services .service-ticket b {
  grid-column: 1 / -1;
  justify-self: end;
  font-size: 0.9375rem;
  line-height: 1;
  margin-top: 2px;
}
.services .service-ticket span::before {
  content: none !important;
}
.services .art-ring,.services .art-radar {
  transition: border-color .35s ease,opacity .35s ease,filter .35s ease;
}
.services .artgrid {
  transition: transform .75s cubic-bezier(.2,.8,.2,1),opacity .6s ease;
  transform-origin: center;
}
.services .service-art:hover .art-ring {
  animation-duration: 9s;
  border-color: #b0ffc0;
  filter: brightness(1.18);
}
.services .service-art:hover .art-radar {
  animation-duration: 12s;
  border-color: #adffbb;
  opacity: 1;
}
.services .service-art:hover .artgrid {
  transform: scale(1.07) rotate(2deg);
  opacity: .48;
}
.process {
  position: relative;
  overflow: hidden;
  background: var(--acid) !important;
  color: var(--ink) !important;
}
.process .process-bottom {
  margin-top: 142px;
  justify-content: flex-end;
}
.process .process-bottom p {
  margin: 0;
  max-width: 720px;
  line-height: 1.12;
  font-size: clamp(1.5rem,3.15vw,2.75rem);
}
.aud-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(circle 340px at var(--spot-x,50%) var(--spot-y,50%),rgba(57,252,99,.19),rgba(57,252,99,.055) 48%,transparent 80%);
  opacity: 0;
  transition: opacity .35s ease;
}
.aud-card:hover::before,.aud-card:focus-visible::before {
  opacity: 1;
}
.aud-card::after {
  position: absolute;
  right: -.06em;
  bottom: -.33em;
  color: #38ff6a0f;
  font: 900 20.625rem/1 var(--heading);
  transition: transform .5s;
  content: none !important;
}
.aud-card:focus-visible {
  outline: 2px solid var(--acid);
  outline-offset: -4px;
}
.pricing .plan.featured-drop button[data-plan],.pricing .plan.featured-production button[data-plan] {
  background: #39fc63 !important;
  color: #0b170d !important;
  border: 2px solid #39fc63 !important;
  font-weight: 900 !important;
}
.pricing .plan.featured-drop button[data-plan]:hover,.pricing .plan.featured-production button[data-plan]:hover {
  background: #eaffed !important;
  color: #0b170d !important;
  border-color: #eaffed !important;
}
.pricing .plan.featured-drop button[data-plan]:focus-visible,.pricing .plan.featured-production button[data-plan]:focus-visible {
  outline: 3px solid #f5fff5;
  outline-offset: 3px;
}
.pricing .pricing-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(22px,4vw,65px);
  margin-top: clamp(40px,5vw,75px);
  padding: 25px 0 0;
  border-top: 1px solid #a4ada2;
}
.pricing .pricing-foot p {
  font-size: clamp(0.875rem,1.15vw,1.0625rem);
  line-height: 1.6;
  max-width: 810px;
  color: #343e34;
  margin: 0;
}
.pricing .pricing-foot a {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-shrink: 0;
  min-height: 56px;
  padding: 17px 22px;
  margin: 0;
  background: #14241a;
  color: #f6fff5;
  border: 2px solid #14241a;
  border-radius: 100px;
  text-decoration: none;
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: .06em;
  transition: background .25s,color .25s,transform .25s;
}
.pricing .pricing-foot a:hover {
  background: var(--acid);
  color: #112017;
  transform: translateY(-3px);
}
.pricing .pricing-foot a:focus-visible {
  outline: 3px solid #125d29;
  outline-offset: 3px;
}
.pricing .pricing-foot a span {
  font-size: 1.25rem;
  line-height: .8;
}
@media (max-width:1120px) {
  .process .process-bottom {
    margin-top: 95px;
  }
  .pricing .pricing-foot {
    align-items: flex-start;
  }
}
@media (max-width:760px) {
  .services .extras {
    padding: 23px 18px !important;
    margin-top: 13px !important;
  }
  .services .service-art {
    display: none !important;
  }
  .process .process-bottom {
    justify-content: flex-start;
  }
  .process .process-bottom p {
    max-width: 100%;
    font-size: clamp(1.5rem,6vw,2.1875rem);
  }
  .pricing .pricing-foot {
    flex-direction: column;
    gap: 22px;
    padding-top: 22px;
  }
  .pricing .pricing-foot a {
    align-self: stretch;
    justify-content: space-between;
    width: 100%;
  }
}
@media (max-width:420px) {
  .hero-brand {
    transform: translate3d(0,calc(12px + var(--logo-rise,0px)),0) rotate(var(--logo-rotate,0deg)) !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .aud-card::before,.services .art-ring,.services .art-radar,.services .artgrid,.pricing .pricing-foot a {
    transition: none !important;
  }
  .services .service-art:hover .art-ring,.services .service-art:hover .art-radar {
    animation: none !important;
  }
  .services .service-art:hover .artgrid {
    transform: none !important;
  }
}
@media (prefers-reduced-motion:reduce) and (max-width:420px) {
  .hero-brand {
    transform: translate3d(0,12px,0) !important;
  }
}
.hero-brand {
  margin: 0 auto;
  flex-shrink: 1;
  filter: none !important;
  animation: none !important;
  width: min(66vw,860px) !important;
  max-height: min(36svh,348px) !important;
  transform: translate3d(0,calc(72px + var(--logo-rise,0px)),0) rotate(var(--logo-rotate,0deg)) !important;
}
.process,.process.section {
  background-color: var(--acid) !important;
  color: var(--ink) !important;
}
.process .section-head {
  border-color: #15231a !important;
}
.audience .aud-card {
  isolation: isolate;
  position: relative;
  overflow: hidden;
}
.audience .aud-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(circle 340px at var(--spot-x,50%) var(--spot-y,50%),rgba(57,252,99,.18) 0%,rgba(57,252,99,.06) 44%,transparent 80%);
  opacity: 0;
  transition: opacity .32s ease;
}
.audience .aud-card:hover::before,.audience .aud-card:focus-visible::before {
  opacity: 1;
}
.audience .aud-card::after {
  display: none !important;
  content: none !important;
}
.audience .aud-card>.aud-label,.audience .aud-card>div,.audience .aud-card>.aud-arrow {
  position: relative;
  z-index: 2;
}
@media (max-width:1120px) {
  .hero-brand {
    width: min(74vw,790px) !important;
    max-height: 35svh !important;
    transform: translate3d(0,calc(55px + var(--logo-rise,0px)),0) rotate(var(--logo-rotate,0deg)) !important;
  }
}
@media (max-width:760px) {
  .hero-brand {
    width: min(96vw,510px) !important;
    max-height: 33svh !important;
    transform: translate3d(0,calc(80px + var(--logo-rise,0px)),0) rotate(var(--logo-rotate,0deg)) !important;
  }
  .pricing .pricing-intro-stamp {
    display: none !important;
  }
  .process,.process.section {
    background: var(--acid) !important;
    color: var(--ink) !important;
  }
  .process .process-bottom {
    margin-top: 30px !important;
  }
  .audience .aud-card::before {
    opacity: .44;
    background: radial-gradient(circle 310px at 75% 25%,rgba(57,252,99,.16),rgba(57,252,99,.06) 45%,transparent 82%);
  }
  .audience .aud-card:nth-child(2)::before {
    background: radial-gradient(circle 310px at 25% 72%,rgba(57,252,99,.16),rgba(57,252,99,.06) 45%,transparent 82%);
  }
  .audience .aud-card:active::before,.audience .aud-card:focus-visible::before {
    opacity: 1;
  }
  .audience .aud-card:active {
    background: #222d24;
  }
  .audience .aud-card::after {
    display: none !important;
    content: none !important;
  }
}
@media (max-width:760px) and (max-height:760px) {
  .hero-brand {
    max-height: 24svh !important;
    transform: translate3d(0,calc(44px + var(--logo-rise,0px)),0) rotate(var(--logo-rotate,0deg)) !important;
  }
  .hero h1 {
    font-size: clamp(2.6875rem,10.4vw,4.1875rem) !important;
  }
}
@media (max-width:760px) and (max-height:650px) {
  .hero-brand {
    max-height: 21svh !important;
    transform: translate3d(0,calc(24px + var(--logo-rise,0px)),0) rotate(var(--logo-rotate,0deg)) !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .hero-brand {
    transform: translate3d(0,72px,0) !important;
    animation: none !important;
  }
  .audience .aud-card::before {
    transition: none !important;
  }
}
@media (prefers-reduced-motion:reduce) and (max-width:1120px) {
  .hero-brand {
    transform: translate3d(0,55px,0) !important;
  }
}
@media (prefers-reduced-motion:reduce) and (max-width:760px) {
  .hero-brand {
    transform: translate3d(0,80px,0) !important;
  }
}
@media (prefers-reduced-motion:reduce) and (max-width:760px) and (max-height:760px) {
  .hero-brand {
    transform: translate3d(0,44px,0) !important;
  }
}
@media (prefers-reduced-motion:reduce) and (max-width:760px) and (max-height:650px) {
  .hero-brand {
    transform: translate3d(0,24px,0) !important;
  }
}
:root {
  --paper2: #f5f3ec;
  --beige: #eeece3;
  --condensed: "Saira Extra Condensed", sans-serif;
  --sans: "Saira", sans-serif;
  --hero-heading: "Saira Extra Condensed", "SalaTreze Hero Title Fallback", sans-serif;
  --hero-sans: "Saira", "SalaTreze Hero Body Fallback", sans-serif;
  --ink: #131614;
  --paper: #ecece7;
  --acid: #35ff69;
  --heading: "Saira Extra Condensed", sans-serif;
  --pad: clamp(20px,4.2vw,80px);
  --description-size: clamp(16px,1.13vw,18px);
  --heading-track: -.012em;
}
h1,h2,h3,h4,h5,h6,
.hero h1,.display,.service-btn .name,.aud-card h3,.plan h3,
.step h3,.extras strong,.contact-side h3,.studio-offer h3,
.faq-title-area .display,.pricing .display,.showcase-intro .display {
  letter-spacing: var(--heading-track) !important;
}
.footer .footer-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  min-height: 2.75rem;
  padding: .7rem .9rem;
  line-height: 1.1;
  transition: background-color .25s ease,color .25s ease,border-color .25s ease,transform .25s ease;
}
.footer .footer-social-icon {
  width: 1.2rem;
  height: 1.2rem;
  display: block;
  flex: none;
}
.footer .footer-socials a:hover,.footer .footer-socials a:focus-visible {
  background: var(--acid);
  color: var(--ink);
  border-color: var(--acid);
  transform: translateY(-2px);
}
.footer .footer-socials a:focus-visible {
  outline: 2px solid var(--acid);
  outline-offset: 3px;
}
@media (max-width:820px) {
  .footer {
    padding-top: 3rem;
    padding-bottom: 2rem;
  }
  .footer .footer-top {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1.5rem;
  }
  .footer .footbrand {
    align-self: flex-start;
    width: 100%;
  }
  .footer .footbrand img {
    width: min(20rem,78vw);
    max-width: 100%;
    height: auto;
  }
  .footer .footer-links {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin: 0;
    width: 100%;
    min-width: 0;
  }
  .footer .footer-links>a {
    display: flex;
    align-items: center;
    min-height: 2.75rem;
    padding: .55rem 0;
    border-bottom: 1px solid #3f5345;
    line-height: 1.25;
  }
  .footer .footer-socials {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .65rem;
    margin-top: 1.3rem;
    width: 100%;
  }
  .footer .footer-socials a {
    display: flex;
    justify-content: center;
    width: 100%;
    min-height: 3.2rem;
    padding: .85rem 1rem;
    white-space: normal;
  }
  .footer .footer-asterisk {
    display: none;
  }
  .footer .footer-bottom {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .8rem;
    margin-top: 2rem;
    padding-top: 1.1rem;
    text-align: left;
    line-height: 1.5;
  }
  .footer .footer-bottom>* {
    display: block;
    max-width: 100%;
  }
  .footer .footer-bottom a {
    padding: .35rem 0;
    min-height: 2.5rem;
    display: flex;
    align-items: center;
  }
}
.section-mobile-entrance {
  display: none;
}
@media (max-width:820px) and (prefers-reduced-motion:no-preference) {
  .section-mobile-entry {
    position: relative;
  }
  .section-mobile-entrance {
    display: block;
    position: absolute;
    inset: 0 0 auto 0;
    height: clamp(7rem,23svh,12rem);
    pointer-events: none;
    overflow: hidden;
    z-index: 3;
    color: var(--acid);
  }
  .section-mobile-entrance::before {
    content: "";
    position: absolute;
    inset: -2rem -55% -2rem -55%;
    background: linear-gradient(103deg,transparent 23%,var(--sweep-accent,rgba(57,252,99,.42)) 43%,var(--sweep-accent,rgba(57,252,99,.42)) 52%,transparent 74%);
    transform: translate3d(-118%,0,0) skewX(-15deg);
    opacity: 0;
  }
  .section-mobile-entrance::after {
    content: "";
    position: absolute;
    bottom: 1.5rem;
    left: var(--pad);
    right: var(--pad);
    height: 2px;
    background: var(--sweep-line,var(--acid));
    opacity: .85;
    transform: scaleX(0);
    transform-origin: left center;
  }
  .section-mobile-entered .section-mobile-entrance::before {
    animation: sala-mobile-sweep 1.05s cubic-bezier(.18,.7,.2,1) both;
  }
  .section-mobile-entered .section-mobile-entrance::after {
    animation: sala-mobile-draw .72s cubic-bezier(.2,.77,.2,1) .13s both;
  }
  .section-mobile-entry .section-head {
    transition: opacity .72s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1),filter .8s ease;
  }
  .section-mobile-entry:not(.section-mobile-entered) .section-head {
    opacity: 0;
    transform: translate3d(-1.8rem,1rem,0) skewX(-5deg);
    filter: blur(4px);
  }
  .section-mobile-entered .section-head {
    opacity: 1;
    transform: translate3d(0,0,0) skewX(0);
    filter: blur(0);
    transition-delay: .08s;
  }
  .manifesto,.audience,.showcase,.about,.contact {
    --sweep-accent: rgba(57,252,99,.5);
    --sweep-line: rgba(57,252,99,.74);
  }
  .process {
    --sweep-accent: rgba(10,36,18,.28);
    --sweep-line: rgba(11,40,20,.64);
  }
  .services,.faq-section {
    --sweep-accent: rgba(32,106,51,.23);
    --sweep-line: rgba(25,79,38,.55);
  }
  .pricing {
    --sweep-accent: rgba(11,34,18,.24);
    --sweep-line: rgba(9,44,21,.55);
  }
  @keyframes sala-mobile-sweep {
    0% {
      transform: translate3d(-118%,0,0) skewX(-15deg);
      opacity: 0;
    }
    22% {
      opacity: .9;
    }
    75% {
      opacity: .7;
    }
    100% {
      transform: translate3d(118%,0,0) skewX(-15deg);
      opacity: 0;
    }
  }
  @keyframes sala-mobile-draw {
    0% {
      transform: scaleX(0);
      opacity: .9;
    }
    70% {
      transform: scaleX(1);
      opacity: .9;
    }
    100% {
      transform: scaleX(1);
      opacity: 0;
    }
  }
}
@media (prefers-reduced-motion:reduce) {
  .section-mobile-entrance {
    display: none !important;
  }
  .section-mobile-entry .section-head {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  .footer .footer-socials a {
    transition: none !important;
  }
}
:where(.manifesto) h2.display {
  font-size: calc(clamp(4.125rem,8.7vw,9.375rem)*.9) !important;
}
:where(.services) h2.display {
  font-size: calc(clamp(5.125rem,10vw,10.3125rem)*.9) !important;
}
:where(.process,.audience) h2.display {
  font-size: calc(clamp(3.5rem,9vw,9.625rem)*.9) !important;
}
:where(.showcase) h2.display {
  font-size: calc(clamp(5rem,10vw,9.6875rem)*.9) !important;
}
:where(.pricing) h2.display {
  font-size: calc(clamp(4.6875rem,11vw,11.125rem)*.9) !important;
}
:where(.about) h2 {
  font-size: calc(clamp(4.1875rem,7vw,7.5rem)*.9) !important;
}
:where(.faq-section) h2.display {
  font-size: calc(clamp(4.375rem,8vw,9.0625rem)*.9) !important;
}
:where(.contact) h2.display {
  font-size: calc(clamp(4.0625rem,9vw,9.0625rem)*.9) !important;
}
#study-modal-title {
  font-size: calc(6.25rem * .9) !important;
}
@media (max-width:760px) {
  :where(.manifesto) h2.display {
    font-size: calc(clamp(3.5rem,12.5vw,6.25rem)*.9) !important;
  }
  :where(.services) h2.display {
    font-size: calc(clamp(4.0625rem,12vw,6.25rem)*.9) !important;
  }
  :where(.process,.audience) h2.display {
    font-size: calc(clamp(3.4375rem,12.5vw,6rem)*.9) !important;
  }
  :where(.showcase) h2.display {
    font-size: calc(clamp(3.75rem,12vw,6.25rem)*.9) !important;
  }
  :where(.pricing) h2.display {
    font-size: calc(clamp(4.0625rem,12vw,6.25rem)*.9) !important;
  }
  :where(.faq-section) h2.display {
    font-size: calc(clamp(3.25rem,11vw,5.3125rem)*.9) !important;
  }
  :where(.contact) h2.display {
    font-size: calc(clamp(2.9375rem,10.5vw,4.6875rem)*.9) !important;
  }
  #study-modal-title {
    font-size: calc(3rem * .9) !important;
  }
}
@media (max-width:420px) {
  :where(.manifesto,.process,.audience) h2.display {
    font-size: calc(clamp(3.0625rem,12.4vw,4.125rem)*.9) !important;
  }
  :where(.services) h2.display {
    font-size: calc(clamp(3.25rem,13vw,4.375rem)*.9) !important;
  }
  :where(.showcase) h2.display {
    font-size: calc(clamp(3.125rem,12vw,3.8125rem)*.9) !important;
  }
  :where(.pricing) h2.display {
    font-size: calc(clamp(3.75rem,11.8vw,4.875rem)*.9) !important;
  }
  :where(.contact) h2.display {
    font-size: calc(clamp(2.75rem,10.3vw,3.75rem)*.9) !important;
  }
}
.section-desktop-entrance {
  display: none;
}
@media (min-width:821px) and (prefers-reduced-motion:no-preference) {
  .section-desktop-entry {
    position: relative;
    isolation: isolate;
    --section-scroll: 0;
    --section-progress: 0;
    --entry-accent: #39fc63;
    --entry-outline: rgba(57,252,99,.25);
  }
  .section-desktop-entrance {
    display: block;
    position: absolute;
    inset: 0 0 auto;
    height: clamp(22rem,75vh,47rem);
    z-index: 4;
    pointer-events: none;
    overflow: hidden;
    contain: layout style;
  }
  .section-desktop-entrance .entry-slab {
    position: absolute;
    top: -30%;
    height: 158%;
    width: clamp(9rem,22vw,30rem);
    background: var(--entry-accent);
    clip-path: polygon(31% 0,100% 0,69% 100%,0 100%);
    opacity: 0;
    transform: translate3d(-135vw,0,0) skewX(-12deg);
    will-change: transform;
  }
  .section-desktop-entrance .entry-slab:nth-child(1) {
    left: -8vw;
  }
  .section-desktop-entrance .entry-slab:nth-child(2) {
    left: 22vw;
    filter: brightness(.8);
  }
  .section-desktop-entrance .entry-slab:nth-child(3) {
    left: 52vw;
    filter: brightness(1.1);
  }
  .section-desktop-entrance .entry-index {
    position: absolute;
    right: 3vw;
    top: -.05em;
    font: 900 clamp(11rem,32vw,34rem)/.9 var(--heading);
    letter-spacing: -.12em;
    color: transparent;
    -webkit-text-stroke: 2px var(--entry-outline);
    opacity: 0;
    transform: translate3d(12vw,6rem,0) rotate(12deg);
    user-select: none;
  }
  .section-desktop-entrance .section-blade {
    position: absolute;
    right: -9vw;
    top: -10vw;
    width: clamp(23rem,45vw,46rem);
    aspect-ratio: 1;
    border: 1px solid var(--entry-outline);
    border-radius: 50%;
    opacity: 0;
    transform: translate3d(0,calc(var(--section-scroll)*-3.7rem),0) rotate(calc(var(--section-scroll)*67deg));
    transition: opacity .8s ease;
  }
  .section-desktop-entrance .section-blade:before,
  .section-desktop-entrance .section-blade:after {
    content: "";
    position: absolute;
    inset: 14%;
    border: 1px solid var(--entry-outline);
    transform: rotate(37deg);
  }
  .section-desktop-entrance .section-blade:after {
    inset: 33%;
    transform: rotate(-24deg);
    border-radius: 50%;
  }
  .section-desktop-entrance .entry-progress {
    position: absolute;
    left: var(--pad);
    top: clamp(9rem,30vh,18rem);
    height: 3px;
    width: clamp(6rem,22vw,23rem);
    background: var(--entry-accent);
    opacity: .46;
    transform-origin: left center;
    transform: scaleX(var(--section-progress));
  }
  .section-desktop-entry h2:not(#study-modal-title) {
    clip-path: inset(0 100% 0 0);
    transition: clip-path 1.15s cubic-bezier(.18,.83,.16,1) .15s;
  }
  .section-desktop-entered h2:not(#study-modal-title) {
    clip-path: inset(0 0 0 0);
  }
  .section-desktop-entry .section-head {
    transition: opacity .7s cubic-bezier(.16,.8,.2,1),transform .85s cubic-bezier(.16,.8,.2,1);
  }
  .section-desktop-entry:not(.section-desktop-entered) .section-head {
    opacity: 0;
    transform: translate3d(-4rem,1.4rem,0) skewX(-9deg);
  }
  .section-desktop-entered .section-head {
    opacity: 1;
    transform: none;
  }
  .section-desktop-entered .entry-slab:nth-child(1) {
    animation: sala-entry-blade 1.05s cubic-bezier(.13,.81,.17,1) .00s both;
  }
  .section-desktop-entered .entry-slab:nth-child(2) {
    animation: sala-entry-blade 1.12s cubic-bezier(.13,.81,.17,1) .09s both;
  }
  .section-desktop-entered .entry-slab:nth-child(3) {
    animation: sala-entry-blade 1.2s cubic-bezier(.13,.81,.17,1) .16s both;
  }
  .section-desktop-entered .entry-index {
    animation: sala-entry-index 1.28s cubic-bezier(.18,.8,.17,1) .12s both;
  }
  .section-desktop-entered .section-blade {
    opacity: .34;
  }
  .services,.pricing,.faq-section {
    --entry-accent: #154d24;
    --entry-outline: rgba(17,82,34,.30);
  }
  .process {
    --entry-accent: #174e27;
    --entry-outline: rgba(8,45,20,.28);
  }
  .manifesto,.audience,.showcase,.about,.contact {
    --entry-accent: #39fc63;
    --entry-outline: rgba(57,252,99,.25);
  }
  @keyframes sala-entry-blade {
    0% {
      transform: translate3d(-135vw,0,0) skewX(-12deg);
      opacity: 0;
    }
    13% {
      opacity: .94;
    }
    70% {
      opacity: .82;
    }
    100% {
      transform: translate3d(165vw,0,0) skewX(-12deg);
      opacity: 0;
    }
  }
  @keyframes sala-entry-index {
    0% {
      transform: translate3d(13vw,8rem,0) rotate(14deg) scale(1.3);
      opacity: 0;
    }
    35% {
      opacity: .72;
    }
    74% {
      opacity: .38;
    }
    100% {
      transform: translate3d(-4vw,-2rem,0) rotate(-7deg) scale(.92);
      opacity: 0;
    }
  }
}
@media (prefers-reduced-motion:reduce) {
  .section-desktop-entrance {
    display: none !important;
  }
  .section-desktop-entry h2 {
    clip-path: none !important;
    transition: none !important;
  }
  .section-desktop-entry .section-head {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
/* Hero sticky: a faixa e o manifesto passam por cima durante a rolagem. */
.hero-scroll-stack {
  position: relative;
  isolation: isolate;
}
.hero-scroll-stack > .hero {
  position: sticky;
  top: 0;
  z-index: 0;
}
.hero-scroll-stack > .ticker {
  position: relative;
  z-index: 1;
}
.hero-scroll-stack > .manifesto {
  position: relative;
  z-index: 2;
}
/* Estilos semânticos antes declarados inline no HTML. */
.navlogo-light {
  font-weight: 400;
}
.studio-offer .studio-offer-note {
  font-size: .6875rem;
  opacity: .7;
}
/* Títulos semânticos: Saira Extra Condensed, peso 900. */
h1,h2,h3,h4,h5,h6 {
  font-family: var(--heading);
  font-weight: 900 !important;
}
/* Tipografia, hero e seção de processo. */
.hero-scroll-stack > .ticker {
  font-family: var(--hero-heading);
}
.hero-bottom {
  font-family: var(--hero-sans);
}
.hero h1 {
  font-family: var(--hero-heading);
  min-block-size: 2lh;
  font-size: clamp(5.1rem,8.76vw,9.15rem) !important;
}
.display {
  font-family: var(--heading);
  font-weight: 900;
  letter-spacing: -.058em;
  line-height: .86;
  font-size: clamp(3.85rem,9.9vw,10.5875rem) !important;
}
.manifesto .display {
  font-size: clamp(4.5375rem,9.57vw,10.3125rem) !important;
}
.services h2 {
  font-size: clamp(5.6375rem,11vw,11.34375rem) !important;
}
.about-copy h2 {
  font-family: var(--heading);
  font-weight: 900;
  letter-spacing: -.06em;
  font-size: clamp(4.60625rem,7.7vw,8.25rem) !important;
}
.study-dialog h2 {
  font: 900 clamp(3rem,7vw,6.25rem)/.9 var(--heading);
  letter-spacing: -.045em;
  margin: 30px 0;
  font-size: clamp(3.3rem,7.7vw,6.875rem) !important;
}
.process h2.display {
  line-height: .95 !important;
  padding-top: .08em;
  overflow: visible;
}
.process-bottom {
  justify-content: flex-end !important;
}
.process-bottom p {
  font-size: clamp(1.375rem,3.5vw,3rem);
  line-height: 1.1;
  font-weight: 900;
  letter-spacing: -.04em;
  max-width: 750px;
  text-align: right;
  margin-left: auto;
}
.manifesto-signal {
  letter-spacing: .045em;
  transform: translateZ(0) rotate(-2deg);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
  contain: paint;
}
.manifesto-signal span,
.manifesto-signal b {
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.hero-brand {
  transform: translate3d(0,72px,0) !important;
}
@media (max-width:1120px) {
  .hero-brand {
    transform: translate3d(0,55px,0) !important;
  }
}
@media (max-width:760px) {
  .hero-brand {
    transform: translate3d(0,80px,0) !important;
  }
}
@media (max-width:760px) and (max-height:760px) {
  .hero h1 {
    font-size: clamp(3.225rem,12.48vw,5.025rem) !important;
  }
  .hero-brand {
    transform: translate3d(0,44px,0) !important;
  }
}
@media (max-width:760px) and (max-height:650px) {
  .hero-brand {
    transform: translate3d(0,24px,0) !important;
  }
}
@media (max-width:420px) {
  .hero-brand {
    transform: translate3d(0,12px,0) !important;
  }
}
