/* Abertura do estúdio. A composição acompanha a largura da própria coluna. */
#dnoA .dnoA-header { background: #100d17f5; }
#dnoA .dnoA-hero { background: #100d17; overflow: hidden; }
#dnoA .dnoA-hero-gridbg, #dnoA .dnoA-hero-glow { display: none; }
#dnoA .dnoA-hero-inner { max-width: 1320px; padding: 70px 40px 64px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: 48px; align-items: center; }
#dnoA .dnoA-hero-copy { min-width: 0; }
#dnoA .dnoA-badge { margin-bottom: 28px; font-size: 10px; letter-spacing: .12em; }
#dnoA .dnoA-badge-dot { box-shadow: 0 0 0 4px #bba6ff12; }
#dnoA .dnoA-hero-title { font-size: clamp(60px, 6.9vw, 100px); line-height: 1.045; letter-spacing: -.075em; font-weight: 700; margin: 0 0 30px; }
#dnoA .dnoA-title-line { display: block; white-space: nowrap; }
#dnoA .dnoA-title-line:last-child { display: flex; align-items: center; gap: .42em; }
#dnoA .dnoA-hero-em { color: #bba6ff; font-weight: 700; }
#dnoA .dnoA-title-star { width: .63em; height: .63em; flex: 0 0 auto; margin: .08em 0 0; color: #bba6ff; }
#dnoA .dnoA-hero-desc { max-width: 40ch; font-size: 16px; line-height: 1.75; margin: 0 0 30px; }
#dnoA .dnoA-hero-actions { gap: 22px; align-items: center; }
#dnoA .dnoA-hero-cta { padding: 18px 22px; border-radius: 6px; }
#dnoA .dnoA-hero-actions .dnoA-btn-ghost { border: 0; padding: 16px 2px; font-size: 13px; }
#dnoA .dnoA-hero-proof { margin-top: 24px; gap: 10px 24px; }
#dnoA .dnoA-hero-bottom { max-width: 1240px; margin: 0 auto; border-top: 1px solid #ffffff20; padding: 20px 0 26px; display: flex; justify-content: space-between; gap: 20px; color: #aaa2b7; font-size: 10px; }
#dnoA .dnoA-hero-bottom a { color: inherit; text-decoration: none; }
#dnoA .dnoA-hero-bottom a:hover { color: #d6caff; }

#dnoA .dnoA-studio-art { position: relative; width: 100%; height: auto; max-width: 640px; aspect-ratio: 640 / 620; min-width: 0; isolation: isolate; container-type: inline-size; font-family: 'Archivo', sans-serif; }
#dnoA .dnoA-orbit { position: absolute; border: 1px solid #bba6ff18; border-radius: 50%; width: 95%; aspect-ratio: 1; top: -2%; left: 2%; z-index: -1; }
#dnoA .dnoA-orbit-two { width: 79%; left: 10%; top: 7%; }
#dnoA .dnoA-art-label, #dnoA .dnoA-art-signature { position: absolute; font-size: 1.75cqw; letter-spacing: .16em; color: #b3a3c7; white-space: nowrap; }
#dnoA .dnoA-art-label { top: 5%; left: 13%; }
#dnoA .dnoA-art-signature { bottom: 3%; left: 10%; }
#dnoA .dnoA-art-browser { position: absolute; width: 87%; left: 0; top: 16%; border: .8cqw solid #3c324b; border-radius: 2.2cqw; background: #efede7; transform: rotate(-5deg); overflow: hidden; box-shadow: 0 4cqw 8cqw #0004; color: #302638; }
#dnoA .dnoA-art-toolbar { height: 4.6cqw; background: #292132; color: #a69ab4; font-size: 1.1cqw; display: flex; align-items: center; justify-content: space-between; padding: 0 2cqw; }
#dnoA .dnoA-art-toolbar > span:first-child { letter-spacing: .5cqw; }
#dnoA .dnoA-art-toolbar > span:last-child { margin-right: 32%; }
#dnoA .dnoA-art-page { position: relative; padding: 3.5cqw 4cqw 2.6cqw; }
#dnoA .dnoA-art-nav { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #30263820; padding-bottom: 2.6cqw; }
#dnoA .dnoA-art-nav strong { font-size: 2.35cqw; letter-spacing: -.07em; }
#dnoA .dnoA-art-nav > span { font-size: 1cqw; }
#dnoA .dnoA-art-content { position: relative; z-index: 1; margin: 4.2cqw 0 3.8cqw; }
#dnoA .dnoA-art-content small { font-size: .85cqw; letter-spacing: .15em; }
#dnoA .dnoA-art-content p { font-size: 7.15cqw; line-height: 1.03; letter-spacing: -.065em; margin: 2.2cqw 0 3cqw; }
#dnoA .dnoA-art-content em { font-family: Georgia, serif; color: #8253a4; font-weight: 400; }
#dnoA .dnoA-art-button { display: inline-block; background: #32243f; color: #fff; padding: 1.5cqw 2cqw; font-size: 1cqw; border-radius: .4cqw; }
#dnoA .dnoA-rings { position: absolute; width: 24%; height: 32cqw; right: 10%; top: 14cqw; }
#dnoA .dnoA-rings i { position: absolute; width: 100%; aspect-ratio: 1; border: 3cqw solid #b997d7; border-bottom-color: #8253a4; border-right-color: #956bb5; border-radius: 50%; box-shadow: 0 2cqw 2.4cqw #39244c16; }
#dnoA .dnoA-rings i:nth-child(2) { top: 7.4cqw; }
#dnoA .dnoA-rings i:nth-child(3) { top: 14.8cqw; }
#dnoA .dnoA-art-footer { border-top: 1px solid #30263820; padding-top: 2.3cqw; display: flex; justify-content: space-between; font-size: 1cqw; }
#dnoA .dnoA-art-note { position: absolute; right: 3%; top: 10%; z-index: 3; background: #2d233a; border: 1px solid #9a7db9; border-radius: 1.6cqw; transform: rotate(5deg); padding: 2cqw 2.8cqw; display: flex; align-items: center; gap: 2.3cqw; color: #f2edf8; box-shadow: 0 2cqw 6cqw #0002; }
#dnoA .dnoA-art-note > span { font-size: 5.8cqw; color: #bba6ff; line-height: 1; }
#dnoA .dnoA-art-note p { font-size: 1.9cqw; line-height: 1.4; margin: 0; }
#dnoA .dnoA-art-note em { color: #bba6ff; font-style: normal; }
#dnoA .dnoA-art-phone { position: absolute; right: 0; top: 40%; width: 27%; aspect-ratio: 165 / 325; background: #bf9fe0; border: .85cqw solid #d6c4e7; border-radius: 5cqw; transform: rotate(7deg); padding: 5.6cqw 2cqw 2cqw; color: #382541; box-shadow: 0 3cqw 7cqw #0003; z-index: 2; }
#dnoA .dnoA-art-notch { position: absolute; width: 33%; height: 1.5cqw; background: #35243f; top: 1.3cqw; left: 33%; border-radius: 3cqw; }
#dnoA .dnoA-art-phone strong { display: block; font-size: 1.6cqw; letter-spacing: -.06em; }
#dnoA .dnoA-art-phone small { display: block; font-size: .7cqw; letter-spacing: .15em; margin: 4cqw 0 1.5cqw; }
#dnoA .dnoA-art-phone p { font-size: 5cqw; line-height: 1.03; letter-spacing: -.06em; margin: 0; }
#dnoA .dnoA-art-phone em { font-family: Georgia, serif; }
#dnoA .dnoA-phone-star { position: absolute; bottom: 12cqw; right: 1.7cqw; width: 9cqw; height: 9cqw; color: #8555a6; }
#dnoA .dnoA-art-phone .dnoA-art-button { position: absolute; left: 2cqw; right: 2cqw; bottom: 5.4cqw; text-align: center; padding: 1.2cqw .6cqw; font-size: .85cqw; }
#dnoA .dnoA-phone-lines { position: absolute; bottom: 2cqw; left: 2.2cqw; width: 65%; height: 1.8cqw; border-top: .35cqw solid #8253a455; border-bottom: .35cqw solid #8253a455; }

@media (min-width: 801px) and (max-width: 1100px) {
  #dnoA .dnoA-hero-inner { padding: 60px 32px; gap: 24px; }
  #dnoA .dnoA-hero-title { font-size: clamp(54px, 6.9vw, 76px); }
  #dnoA .dnoA-hero-actions { gap: 8px; }
  #dnoA .dnoA-hero-cta { padding: 16px; }
  #dnoA .dnoA-hero-actions .dnoA-btn-ghost { font-size: 12px; }
}
@media (max-width: 1320px) {
  #dnoA .dnoA-hero-bottom { margin-inline: 40px; }
}
@media (max-width: 800px) {
  #dnoA .dnoA-hero-inner { grid-template-columns: 1fr; padding: 48px 24px 24px; gap: 32px; }
  #dnoA .dnoA-hero-title { font-size: clamp(56px, 10.6vw, 82px); }
  #dnoA .dnoA-hero-desc { max-width: 44ch; }
  #dnoA .dnoA-studio-art { max-width: 560px; margin: 0 auto; }
  #dnoA .dnoA-hero-bottom { margin-inline: 24px; }
}
@media (max-width: 480px) {
  #dnoA .dnoA-hero-title { font-size: clamp(43px, 13.8vw, 64px); margin-bottom: 24px; }
  #dnoA .dnoA-badge { font-size: 9px; letter-spacing: .08em; margin-bottom: 24px; }
  #dnoA .dnoA-hero-desc { font-size: 15px; margin-bottom: 24px; }
  #dnoA .dnoA-hero-actions { align-items: stretch; gap: 6px; }
  #dnoA .dnoA-hero-actions > a { width: 100%; text-align: center; }
  #dnoA .dnoA-hero-proof { margin-top: 18px; gap: 8px 16px; }
  #dnoA .dnoA-hero-bottom { font-size: 9px; padding: 18px 0; }
}
