/* Shared type and text rhythm. Four-pixel spacing base; fluid display sizes. */
:root{
 --font-sans:Arial,Helvetica,sans-serif;
 --text-xs:12px;--text-sm:14px;--text-md:clamp(16px,1.25vw,20px);
 --text-lead:clamp(18px,1.5vw,24px);--text-card:clamp(22px,2.3vw,32px);
 --text-subtitle:clamp(28px,3vw,40px);--text-section:clamp(40px,5vw,72px);
 --text-display:clamp(48px,6.5vw,104px);--text-footer:clamp(64px,12vw,192px);
 --leading-copy:1.55;--leading-heading:1.08;--leading-label:1.4;
 --tracking-heading:-.05em;--tracking-copy:-.015em;--tracking-label:.12em;
 --rhythm-1:4px;--rhythm-2:8px;--rhythm-3:12px;--rhythm-4:16px;
 --rhythm-6:24px;--rhythm-8:32px;--rhythm-12:48px;--rhythm-16:64px;--rhythm-24:96px;
 --section-space:clamp(80px,9vw,144px);
 /* Keep existing components on the same tokens. */
 --type-xs:var(--text-xs);--type-sm:var(--text-sm);--type-body:var(--text-md);
 --type-lg:var(--text-card);--type-xl:var(--text-section);--type-about-title:var(--text-section);
 --type-display:var(--text-display);--type-footer:var(--text-footer);
 --space-1:var(--rhythm-2);--space-2:var(--rhythm-4);--space-3:var(--rhythm-6);
 --space-4:var(--rhythm-8);--space-5:var(--rhythm-12);--space-6:var(--rhythm-16);
 --text-gap-xs:var(--rhythm-2);--text-gap-sm:var(--rhythm-3);--text-gap-md:var(--rhythm-4);
 --text-gap-lg:var(--rhythm-6);--text-gap-xl:var(--rhythm-8);--leading-body:var(--leading-copy);--leading-title:var(--leading-heading)
}
body,button,input,select,textarea{font-family:var(--font-sans)}
body{font-size:var(--text-md);line-height:var(--leading-copy)}
.hero .hero-title,.post-header h1{font-size:var(--text-display);font-weight:400;line-height:var(--leading-heading);letter-spacing:var(--tracking-heading)}
.hero .hero-title{margin:0 0 var(--rhythm-6)}
.hero .intro,.about-section .about-intro,.post-intro p,dialog p{font-size:var(--text-md);line-height:var(--leading-copy);letter-spacing:var(--tracking-copy)}
.hero .intro{margin:0;max-width:60ch}
.hero .cta{font-size:var(--text-sm);line-height:var(--leading-label);margin-top:var(--rhythm-8);padding:var(--rhythm-4) var(--rhythm-6)}
#atuacao .services-header h2,#about-title,#timezone .timezone-heading h2,.related-heading h2{font-size:var(--text-section);line-height:var(--leading-heading);font-weight:400;letter-spacing:var(--tracking-heading);margin:0}
#atuacao>.services-header{margin-bottom:var(--rhythm-12)}
.service-copy h3{font-size:var(--text-subtitle);line-height:var(--leading-heading);font-weight:400;letter-spacing:var(--tracking-heading);margin:0 0 var(--rhythm-4)}
.service-copy p{font-size:var(--text-md);line-height:var(--leading-copy);letter-spacing:var(--tracking-copy);margin:0;max-width:48ch}
.about-section .about-label,.global-kicker,.post-category,.related-heading .eyebrow{font-size:var(--text-xs);line-height:var(--leading-label);letter-spacing:var(--tracking-label);font-weight:400}
.about-section .about-label{margin:0 0 var(--rhythm-4)}
.about-section .about-intro{margin:var(--rhythm-6) 0 0}
#about .about-read-more{font-size:var(--text-sm);line-height:var(--leading-label);margin-top:var(--rhythm-4);padding-bottom:var(--rhythm-1)}
#about .tile-random-title{font-size:var(--text-card);line-height:1.15;letter-spacing:-.04em;padding:0}
#timezone .timezone-heading{margin-bottom:var(--rhythm-8)}
#timezone .timezone-heading .global-kicker{margin:0 0 var(--rhythm-6)}
#timezone .timezone-heading h2{margin:0 0 var(--rhythm-6)}
#timezone .timezone-heading p{font-size:var(--text-md);line-height:var(--leading-copy);letter-spacing:var(--tracking-copy);margin:0 auto;max-width:60ch}
.post-header{margin-bottom:var(--rhythm-16)}
.post-header h1{margin:var(--rhythm-12) 0 var(--rhythm-8)}
.post-intro{max-width:75ch}
.post-intro p+p{margin-top:var(--rhythm-6)}
.post-gallery{gap:var(--rhythm-8)}
.related-heading{gap:var(--rhythm-8);margin-bottom:var(--rhythm-8)}
.related-heading h2{margin-top:var(--rhythm-4)}
.related-heading>a{font-size:var(--text-sm);line-height:var(--leading-label)}
.related-info{padding-top:var(--rhythm-6);gap:var(--rhythm-4)}
.related-info h3{font-size:var(--text-card);line-height:1.15;letter-spacing:-.04em;margin:0 0 var(--rhythm-2)}
.related-info>div>span{font-size:var(--text-xs);line-height:var(--leading-label)}
.site-footer .footer-title{font-size:var(--text-footer);line-height:.98;font-weight:400;letter-spacing:-.06em;margin:0}
.site-footer .footer-links{padding:var(--rhythm-6) 0}
.site-footer .footer-contact{font-size:var(--text-subtitle);line-height:1.15;letter-spacing:-.04em}
.site-footer .footer-meta,.site-footer .back-top{font-size:var(--text-xs);line-height:var(--leading-label);letter-spacing:.04em}
.floating-contact{font-size:var(--text-sm);line-height:var(--leading-label);padding:var(--rhythm-4) var(--rhythm-6)}
@media(max-width:700px){
 :root{--text-section:clamp(36px,8vw,48px);--text-display:clamp(40px,8vw,56px);--text-card:clamp(20px,4.5vw,28px);--text-subtitle:clamp(24px,5vw,32px)}
 #atuacao>.services-header{margin-bottom:var(--rhythm-8)}
 #about .tile-random-title{padding:0}
 .post-header{margin-bottom:var(--rhythm-8)}.post-header h1{margin:var(--rhythm-8) 0 var(--rhythm-6)}
 .post-gallery{gap:var(--rhythm-4)}
}
/* Card gutters are a separate layout rule, not part of text rhythm. */
#about,#about .about-grid{gap:2px}

.site-footer a.footer-contact{color:inherit;text-decoration:none;display:inline-block}.site-footer a.footer-contact:hover{text-decoration:underline;text-underline-offset:6px}

.site-footer .footer-side{justify-content:flex-end}.site-footer .back-top{margin-top:auto;align-self:flex-end}

#atuacao .service-preview.has-image{aspect-ratio:3843/3011;overflow:hidden;background:#031127}#atuacao .service-preview.has-image img{display:block;width:100%;height:auto}

#atuacao .service-preview.visual-identity-preview{aspect-ratio:2752/1536}

#atuacao .service-preview.web-development-preview{aspect-ratio:auto}

#atuacao .service-preview.artificial-intelligence-preview{aspect-ratio:1080/1450}

#atuacao .service-toggle,#atuacao .service-toggle *{cursor:default}

/* Service previews share a centered, non-destructive 4:3 crop. */
#atuacao .service-preview.has-image{aspect-ratio:4/3}
#atuacao .service-preview.has-image img{width:100%;height:100%;object-fit:cover;object-position:center}

#atuacao .service-row.is-active{background:transparent}

/* One shared inset for the icon and caption on both animated card faces. */
#about .about-tile .about-face{padding:var(--rhythm-6)}
#about .about-face .tile-random-title{padding:0;margin: auto 0 0;width:100%;text-align:left}
#about .about-icon-placeholder{padding:0;margin:0;align-self:flex-start}
@media(max-width:700px){#about .about-tile .about-face{padding:var(--rhythm-4)}}

/* Longer editorial footer heading, fitted to the existing two-column layout. */
.site-footer .footer-title{font-size:clamp(44px,7.5vw,120px);max-width:15ch}
@media(max-width:700px){.site-footer .footer-title{font-size:clamp(40px,9vw,64px)}}
