/* TattooAE Agency: visual da hero App aplicado SOMENTE no hero Agency.
   O formulário Agency, o restante da landing e a navegação original não mudam. */
body[data-page="agency"] .hero.agency-hero-tech {
  position:relative;display:flex;flex-direction:row;align-items:center;
  min-height:760px;padding:145px 0 105px;overflow:hidden;background:#090d0e;color:#f3f3ee;
}
body[data-page="agency"] .agency-hero-tech .hero-photo {
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
}
body[data-page="agency"] .agency-hero-tech .hero-shade {
  position:absolute;inset:0;
  background:linear-gradient(90deg,#090d0ef7 0%,#090d0edb 30%,#090d0e50 60%,#090d0e15),linear-gradient(0deg,#090d0e 0%,transparent 26%);
}
body[data-page="agency"] .agency-hero-tech .wrap {width:min(1240px,calc(100% - 72px));margin-inline:auto}
body[data-page="agency"] .agency-hero-tech .hero-copy {position:relative;z-index:1}
body[data-page="agency"] .agency-hero-tech .eyebrow {
  display:block; color:#c6ff3d;
  font:400 11px/1.5 Arial,Helvetica,sans-serif;
  letter-spacing:.17em;text-transform:uppercase;margin:0 0 20px;
}
body[data-page="agency"] .agency-hero-tech .eyebrow:before {
  content:'';display:inline-block;width:5px;height:5px;
  background:#c6ff3d;border-radius:50%;margin-right:10px;vertical-align:middle;
}
body[data-page="agency"] .agency-hero-tech h1 {
  max-width:740px;font:600 clamp(48px,5.8vw,80px)/1.01 Arial,Helvetica,sans-serif;
  letter-spacing:-.055em;margin:0;
}
body[data-page="agency"] .agency-hero-tech h1 em {
  font:inherit;font-style:normal;color:#c6ff3d;
}
body[data-page="agency"] .agency-hero-tech .hero-copy>p:not(.eyebrow) {
  max-width:510px;font:400 17px/1.65 Arial,Helvetica,sans-serif;
  margin-top:25px;color:#c0c6bf;
}
body[data-page="agency"] .agency-hero-tech .actions {
  display:flex;gap:26px;align-items:center;flex-wrap:wrap;margin-top:34px;
}
body[data-page="agency"] .agency-hero-tech .btn {
  display:inline-flex;align-items:center;justify-content:space-between;
  min-height:53px;gap:22px;padding:17px 24px;
  color:#151b0d;background:#c6ff3d;border:0;border-radius:5px;
  font:600 14px/1.4 Arial,Helvetica,sans-serif;cursor:pointer;transition:background .2s,transform .2s;
}
body[data-page="agency"] .agency-hero-tech .btn:hover {background:#d9ff80;transform:translateY(-2px)}
body[data-page="agency"] .agency-hero-tech .text-link {
  color:#72dde8;background:none;padding:0;border:0;
  font:400 14px Arial,Helvetica,sans-serif;
}
body[data-page="agency"] .agency-hero-tech .hero-copy>.hero-note {
  font-size:12px!important;color:#b6c0b2!important;max-width:540px!important;margin-top:22px!important;
}
body[data-page="agency"] .agency-hero-tech .hero-bottom {
  position:absolute;z-index:1;bottom:28px;left:0;right:0;
  display:flex;justify-content:space-between;gap:16px;
  font:400 10px Arial,Helvetica,sans-serif;
  letter-spacing:.13em;color:#859187;
}
@media(max-width:800px){
  body[data-page="agency"] .hero.agency-hero-tech {min-height:660px;padding:115px 0 90px}
  body[data-page="agency"] .agency-hero-tech .wrap {width:calc(100% - 38px)}
  body[data-page="agency"] .agency-hero-tech .hero-shade {background:linear-gradient(90deg,#090d0ef7,#090d0ebb 80%,#090d0e66),linear-gradient(0deg,#090d0e,transparent 35%)}
  body[data-page="agency"] .agency-hero-tech h1 {font-size:clamp(45px,8vw,68px)}
  body[data-page="agency"] .agency-hero-tech .hero-copy>p:not(.eyebrow) {font-size:15px}
}
@media(max-width:440px){
  body[data-page="agency"] .hero.agency-hero-tech {min-height:700px;padding:115px 0 75px}
  body[data-page="agency"] .agency-hero-tech h1 {font-size:clamp(46px,11vw,54px)}
  body[data-page="agency"] .agency-hero-tech .eyebrow {font-size:9px}
  body[data-page="agency"] .agency-hero-tech .actions {gap:18px;align-items:start}
  body[data-page="agency"] .agency-hero-tech .hero-bottom {font-size:9px}
}
@media(prefers-reduced-motion:reduce){body[data-page="agency"] .agency-hero-tech *{transition:none!important}}