/*
  YUPA DESIGN SYSTEM MASTER — Sprint de padronização geral
  Camada global carregada no head. A camada runtime em /includes/design-system.inc reforça padrões após estilos locais.
*/
:root{
  --yupa-bg:#f5f7fb;
  --yupa-surface:#ffffff;
  --yupa-ink:#0b1f33;
  --yupa-muted:rgba(11,31,51,.68);
  --yupa-line:rgba(11,31,51,.09);
  --yupa-line-strong:rgba(11,31,51,.14);
  --yupa-green:#0fbf9f;
  --yupa-cyan:#0e9fd8;
  --yupa-blue:#346df1;
  --yupa-orange:#f1873a;
  --yupa-gold:#c89c2f;
  --yupa-purple:#6f5cff;
  --yupa-pink:#e44f93;
  --yupa-amber:#de8a27;
  --yupa-red:#d9485e;
  --yupa-radius-xl:32px;
  --yupa-radius-lg:26px;
  --yupa-radius-md:20px;
  --yupa-shadow-sm:0 10px 28px rgba(16,34,53,.06);
  --yupa-shadow:0 22px 60px rgba(16,34,53,.09);
  --yupa-shadow-lg:0 34px 90px rgba(16,34,53,.13);
  --yupa-max:1280px;
}
body.theme{background:radial-gradient(circle at 7% 0%, rgba(14,159,216,.10), transparent 28%),radial-gradient(circle at 93% 3%, rgba(15,191,159,.09), transparent 25%),linear-gradient(180deg,#fbfcfe 0%,#f6f8fb 42%,#f3f6fa 100%);color:var(--yupa-ink)}
.container{max-width:var(--yupa-max)}
.section{padding:clamp(72px,8vw,112px) 0}.sectionHead{max-width:920px}.sectionHead h2{letter-spacing:-.055em}.sectionHead p{max-width:840px;color:var(--yupa-muted)}
.hero{min-height:calc(96vh - 92px)}.hero--area{min-height:calc(94vh - 92px)}.hero__grid,.hero__grid--area{gap:clamp(24px,3vw,38px)}.hero h1{letter-spacing:-.072em}.hero__lede{color:var(--yupa-muted)}
.hero__video{opacity:.15}.hero--area .hero__video{opacity:.20}

/* === YUPA MASTER 4.1 — padronização final conservadora === */
html{scroll-behavior:smooth}
body.theme{font-feature-settings:"liga" 1,"kern" 1;text-rendering:optimizeLegibility}
.sectionHead{position:relative}.sectionHead .sectionKicker{margin-bottom:14px}
.sectionHead h2{text-wrap:balance}.sectionHead p{text-wrap:pretty}
.hero h1{text-wrap:balance}.hero__lede{text-wrap:pretty}
.solutionCard,.architectureCard,.matrixCard,.flowStep,.panelLarge,.panelSide,.faqItem,.areaCard,.statCard,.numberAreaCard,.productCard,.partnerCard,.assetCard,.valueCard,.integrationCard,.stepCard,.processStep,.insightPanel,.faqCard--cobranca{position:relative;isolation:isolate}
.solutionCard::after,.architectureCard::after,.matrixCard::after,.flowStep::after,.areaCard::after,.panelLarge::after,.panelSide::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.42),transparent 38%);opacity:.55;z-index:-1}
.btn{letter-spacing:-.01em;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}.btn--primary:hover,.btn--outline:hover,.btn--ghost:hover{transform:translateY(-2px)}
.clientsMarquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.clientsMarquee__track,.clientMarqueeTrack{display:flex;align-items:center;gap:16px;width:max-content;animation:yupaMarquee 42s linear infinite;will-change:transform}
.clientsMarquee:hover .clientsMarquee__track,.clientsMarquee:hover .clientMarqueeTrack{animation-play-state:paused}
.clientsMarquee__lane--right .clientsMarquee__track{animation-direction:reverse}
.clientMarqueeGroup{display:flex;align-items:center;gap:16px;flex-shrink:0}.clientsMarquee__track > *,.clientMarqueeTrack > *{flex-shrink:0}
@keyframes yupaMarquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.navCard,.clientMarqueeItem{will-change:transform}.faqQ{width:100%;text-align:left}.footer__bottom span{text-wrap:pretty}
@media (prefers-reduced-motion:reduce){.clientsMarquee__track,.clientMarqueeTrack{animation:none!important}.fade-in{transition:none!important}}
@media (max-width:768px){.section{padding:64px 0}.hero__cta{gap:10px}.clientsMarquee{mask-image:none;-webkit-mask-image:none}}