/* Independent color families: gray for neutrals, lilas for the violet scale.
   Semantic primary aliases retain the current gray application. */
:root {
  --primary-50:var(--gray-50);
  --primary-100:var(--gray-100);
  --primary-200:var(--gray-200);
  --primary-300:var(--gray-300);
  --primary-400:var(--gray-400);
  --primary-500:var(--gray-500);
  --primary-600:var(--gray-600);
  --primary-700:var(--gray-700);
  --primary-800:var(--gray-800);
  --primary-900:var(--gray-900);
  --primary-950:var(--gray-950);
  --gray-50:#fbfbfc;
  --gray-100:#f0f1f2;
  --gray-200:#dddfe1;
  --gray-300:#c2c6ca;
  --gray-400:#a0a6ad;
  --gray-500:#767f88;
  --gray-600:#4c5157;
  --gray-700:#1a1c1e;
  --gray-800:#0c0c0d;
  --gray-900:#030303;
  --gray-950:#000000;
  /* Alternative palette: apply only on explicit direction request.
     Declaration and Design System swatches do not activate this family. */
  --lilas-50:#fcfbfe;
  --lilas-100:#f2effb;
  --lilas-200:#e3dbf5;
  --lilas-300:#cdbfed;
  --lilas-400:#b19be4;
  --lilas-500:#8e6fd8;
  --lilas-600:#663bc9;
  --lilas-700:#472790;
  --lilas-800:#2a1856;
  --lilas-900:#190e34;
  --lilas-950:#140b28;
  --neutral-paper:#e6e6e6;
  --neutral-white:#fff;
  --big-number-ink:var(--neutral-carbon);
  --neutral-carbon:#1b1d1f;
  --neutral-black:#000;
  --neutral-cream:#fcfcfa;
  --neutral-muted:#5f5f5f;
  --neutral-subtle:#b8b8b8;
  --neutral-rule:#bdbdbd;
  --black:var(--neutral-black);
  --carbon:var(--neutral-carbon);
  --paper:var(--neutral-paper);
  --paper-2:var(--neutral-white);
  --cream:var(--neutral-cream);
  --ink:var(--neutral-carbon);
  --ink-2:var(--neutral-carbon);
  --mute:var(--neutral-muted);
  --mute-2:var(--neutral-muted);
  --rule:var(--neutral-rule);
  --hot:var(--primary-700);
  --on-hot:var(--primary-50);
  --signal:var(--primary-700);
  --on-signal:var(--primary-50);
  --accent:var(--primary-700);
  --surface-paper-bg:var(--neutral-paper);
  --surface-paper-ink:var(--neutral-carbon);
  --surface-white-bg:var(--neutral-paper);
  --surface-white-ink:var(--neutral-carbon);
  --surface-dark-bg:var(--neutral-carbon);
  --surface-dark-ink:var(--neutral-carbon);
  --surface-signal-bg:var(--primary-700);
  --surface-signal-ink:var(--primary-50);
  --rule-on-dark:rgb(252 252 250 / .28);
  --rule-on-dark-2:rgb(252 252 250 / .18);
  --rule-on-signal:rgb(252 252 250 / .3);
  --rule-on-signal-2:rgb(252 252 250 / .2);
  --carbon-2:#24272a;
  --carbon-3:#2e3236;
  --white:var(--neutral-white);
  --brand-video-tone:var(--lilas-600);
  --service-hero-tone:var(--brand-video-tone);
  --hero-black:var(--neutral-black);
  --hero-violet-deep:var(--gray-800);
  --hero-violet:var(--gray-600);
  --hero-magenta:var(--gray-500);
  --hero-coral:var(--gray-400);
  --hero-orange:var(--gray-300);
  --hero-gold:var(--gray-200);
}
/* Big Numbers: White on inverse surfaces, dark ink on light surfaces.
   Number, counter, unit and suffix share a single inherited color. */
:where(.surface-paper,.surface-white,[data-theme=paper],[data-theme=white],[data-surface=paper],[data-surface=white]) { --big-number-ink:var(--neutral-carbon); }
:where(.surface-dark,.surface-signal,.ht-hero,.reel-hero,[data-theme=carbon],[data-surface=dark],[data-surface=signal]) { --big-number-ink:var(--neutral-white); }
::selection { background:var(--primary-200); color:var(--primary-950); }

/* Surface roles keep accent contrast independent from the content ink. */
:is(.site-navigation-page,.hero-test-page) .page > :is(section,div).surface-paper:not(.pc-chapter,.pc-band,.pc-hero-cover,.pc-devices) {
  --paper:var(--neutral-paper); --paper-2:var(--neutral-cream); --rule:var(--neutral-rule);
  background:var(--neutral-paper);
}
:is(.site-navigation-page,.hero-test-page) .page > :is(section,div).surface-white:not(.pc-chapter,.pc-band,.pc-hero-cover,.pc-devices,.portfolio-featured) {
  --paper:var(--neutral-cream); --paper-2:var(--neutral-paper); --rule:var(--neutral-rule);
  background:var(--surface-white-bg);
}
:is(.site-navigation-page,.hero-test-page) .page > .surface-dark:not(.pc-chapter,.pc-band,.pc-hero-cover,.pc-devices),
:is(.site-navigation-page,.hero-test-page) .home-fold-overlap > .surface-dark {
  --accent:var(--primary-400); --hot:var(--primary-400); --surface-dark-ink:var(--neutral-cream);
  --ink:var(--neutral-cream); --ink-2:var(--neutral-cream);
  --mute:var(--neutral-subtle); --mute-2:var(--neutral-subtle);
  --rule:var(--rule-on-dark); --paper:var(--neutral-carbon); --paper-2:var(--neutral-carbon);
  color:var(--neutral-cream); background:var(--neutral-carbon);
}
:is(.site-navigation-page,.hero-test-page) .page [data-section-tagline]:not(.pc-hero-cover .hero-kicker,.ht-hero *,.reel-hero *) { color:var(--accent); }
:is(.site-navigation-page,.hero-test-page) .page [data-section-tagline] :is(b,strong) { color:inherit; }
:is(.site-navigation-page,.hero-test-page) .page .ht-tagline { color:var(--neutral-cream); }
:is(.site-navigation-page,.hero-test-page) :where(a,button,input,textarea,select,summary):focus-visible { outline-color:var(--accent); }

/* Accent actions on light/dark neutrals, with a light inverse on accent fields. */
:is(.site-navigation-page,.hero-test-page) :is(.cta-band,.surface-signal,.home-contato) {
  --accent:var(--primary-50); --ink:var(--primary-50); --ink-2:var(--primary-100);
  --mute:var(--primary-200); --mute-2:var(--primary-200); --hot:var(--primary-200);
  --on-hot:var(--primary-800); --rule:var(--rule-on-signal);
  --paper:var(--primary-700); --paper-2:var(--primary-800);
  color:var(--primary-50); background:var(--primary-700);
}
:is(.site-navigation-page,.hero-test-page) :is(.cta-band,.home-contato) :is(.s-head,.cta-band-t,.home-section-intro,.cta-band-cta p) { color:inherit; }
:is(.site-navigation-page,.hero-test-page) .support-fab { background:var(--primary-700); color:var(--primary-50); border-color:var(--primary-700); }

:is(.home-video-page,.hero-test-page) .ht-stat dt { color:var(--big-number-ink); }
:is(.home-video-page,.hero-test-page) .ht-stat dt :is(strong,span) { color:inherit; }

/* Solutions retain their original carbon field and gray actions. */
.home-video-page .home-fold-overlap > .home-fazemos.surface-dark {
  --paper:var(--neutral-carbon); --paper-2:var(--neutral-carbon);
  background:var(--neutral-carbon);
}
.home-video-page .home-fazemos.surface-dark > .s-idx { color:var(--primary-400); }
.home-video-page .home-fazemos .s-head em { color:var(--primary-300); }
.home-video-page .page[data-page=home] .home-fazemos .home-fazemos-n { color:var(--primary-400); }
.home-video-page .home-fazemos.surface-dark .home-fazemos-card:is(:hover,:focus-visible) { background:var(--primary-900); }

/* Why WDA: a deliberate brand field between the work and FAQ. */
:is(.site-navigation-page,.hero-test-page) .page[data-page=home] .home-operation.home-why {
  --accent:var(--primary-100); --ink:var(--primary-50); --ink-2:var(--primary-100);
  --hot:var(--primary-200); --mute:var(--primary-200); --rule:var(--rule-on-signal);
  --surface-white-bg:var(--primary-700);
  color:var(--primary-50); background:var(--primary-700);
}
.home-why .home-why-benefits[data-layout] { background:var(--primary-800); }
.home-why :is(.s-head,.home-operation-copy,.home-business-fit,.home-business-fit h3) { color:inherit; }
.home-why .home-why-message .s-head strong { color:var(--primary-200); }

/* Small repeated accents connect navigation, FAQs, filters and forms. */
:is(.site-navigation-page,.hero-test-page) .ht-header a.ht-header-contact { text-decoration:underline; text-decoration-color:var(--primary-500); text-decoration-thickness:2px; text-underline-offset:6px; }
:is(.site-navigation-page,.hero-test-page) .ht-menu { --accent:var(--primary-700); }
:is(.site-navigation-page,.hero-test-page) .ht-menu .nav-service-card:is(:hover,:focus-visible) strong { color:var(--accent); }
@media (max-width:900px) { :is(.site-navigation-page,.hero-test-page) .ht-menu { --accent:var(--primary-400); } }
:is(.site-navigation-page,.hero-test-page) .faq--accordion :is(.faq-n,.faq-toggle) { color:var(--accent); }
:is(.site-navigation-page,.hero-test-page) .faq--accordion .faq-item[open] .faq-q { color:var(--accent); }
:is(.site-navigation-page,.hero-test-page) .portfolio-category-buttons button[aria-pressed=true],
:is(.site-navigation-page,.hero-test-page) .section-nav-link.is-active { color:var(--primary-700); border-color:var(--primary-700); }
:is(.site-navigation-page,.hero-test-page) .portfolio-category-buttons button[aria-pressed=true] { background:var(--primary-100); }
:is(.site-navigation-page,.hero-test-page) .portfolio-intro ~ .portfolio-featured .portfolio-category-buttons button[aria-pressed=true] { color:var(--primary-300); background:var(--primary-900); border-color:var(--primary-400); }
:is(.site-navigation-page,.hero-test-page) :is(input,textarea,select):focus { border-color:var(--primary-700); }
:is(.site-navigation-page,.hero-test-page) .insights-page :is(.insights-read,.insights-meta > a) { color:var(--primary-700); }
:is(.site-navigation-page,.hero-test-page) .page[data-page=ads] { --ads-accent:var(--primary-400); }
:is(.site-navigation-page,.hero-test-page) .page[data-page=ads]:lang(pt-BR) > :is(#trabalhos-em-destaque,#entregaveis,#meta-ads,#faq) {
  --paper-2:var(--neutral-paper); --rule:var(--neutral-rule); background:var(--neutral-cream);
}
:is(.site-navigation-page,.hero-test-page) .page[data-page=ads]:lang(pt-BR) > #cases { --paper:var(--neutral-paper); --rule:var(--neutral-rule); background:var(--neutral-paper); }
:is(.site-navigation-page,.hero-test-page) .page[data-page=ads]:lang(pt-BR) > :is(.service-topic-overview,#planos,#google-ads,#atendimento) {
  --accent:var(--primary-400); --ink-2:var(--neutral-cream); --mute:var(--neutral-subtle); --mute-2:var(--neutral-subtle);
  --paper:var(--neutral-carbon); --paper-2:var(--neutral-carbon); --rule:var(--rule-on-dark);
  color:var(--neutral-cream); background:var(--neutral-carbon);
}

/* Separate the brand CTA from a quieter, readable global footer. */
/* Local dark journey: inherited control tokens also govern hover/focus. */
.site-navigation-page .ai-content-2026 > .ai-architecture[data-ai-theme=dark] {
  --ai-accent:var(--gray-300); --accent:var(--gray-400);
  --ink-2:var(--neutral-subtle); --mute:var(--neutral-subtle);
  --button-hover:var(--carbon-3); --button-hover-ink:var(--neutral-white); --button-hover-border:transparent;
}

:is(.site-navigation-page,.hero-test-page) > footer,
:is(.site-navigation-page,.hero-test-page) > footer.surface-paper,
:is(.site-navigation-page,.hero-test-page) main + footer.footer-signal {
  --accent:var(--primary-400); --ink:var(--neutral-cream); --ink-2:var(--neutral-cream);
  --mute:var(--neutral-subtle); --mute-2:var(--neutral-subtle); --hot:var(--primary-400);
  --rule:var(--rule-on-dark); --paper:var(--neutral-carbon);
  color:var(--neutral-cream); background:var(--neutral-carbon);
}
:is(.site-navigation-page,.hero-test-page) > footer a:is(:hover,:focus-visible) { color:var(--primary-300); }

/* Portfolio CTA keeps its brand field despite the legacy surface-white class. */
:is(.site-navigation-page,.hero-test-page) .page > :is(section,div).cta-band:is(.surface-white,.surface-paper,.surface-signal) {
  --paper:var(--primary-700); --paper-2:var(--primary-800);
  background:var(--primary-700);
}

@media (max-width:900px) {
  .home-why .home-why-benefits[data-layout] { padding:24px; }
}

/* Shared ambient-video duotone: every service and the Home use this source. */
.brand-video-filter { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
:is(.site-navigation-page,.hero-test-page) .service-hero[data-service-tone] { --service-hero-tone:var(--brand-video-tone); }
:is(.home-video-page,.hero-test-page) .ht-media video,
.service-hero .service-hero-background video,
.reel-hero-media :is(img,video) { filter:url("#wda-brand-video-tint") brightness(1.35); }
:is(.home-video-page,.hero-test-page) .ht-media, .reel-hero-media,
.service-hero > .service-hero-background { background:color-mix(in srgb,var(--brand-video-tone) 25%,var(--neutral-black)); }
:is(.home-video-page,.hero-test-page) .ht-hero::before,
.reel-hero-media::after { background:linear-gradient(180deg,rgb(0 0 0 / .4),rgb(0 0 0 / .16) 42%,rgb(0 0 0 / .5)); }
.service-hero .service-hero-background::after { background:rgb(0 0 0 / .18); }

/* Standalone WDA presentation chrome and internal reference views. */
.mlib-body,.ml-page,.kv { --wm-accent:var(--gray-500); color:var(--neutral-carbon); background:var(--neutral-paper); }
.mlib-body :is(.ml-header,.ml-footer),.ml-page .ml-nav { color:var(--neutral-cream); background:var(--neutral-carbon); }
.mlib-body :is(button,a,input,summary,[tabindex]):focus-visible,.ml-page :focus-visible { outline-color:var(--gray-600); }

[data-wda-motion] { --wm-accent:var(--gray-500); }

/* Client case chapters keep labels legible on their local artwork surfaces. */
:is(.site-navigation-page,.hero-test-page) .page.port-case [data-section-tagline]:not(.pc-hero-cover .hero-kicker) { color:inherit; }

/* One approved ambient-hero tone for Home, services and drafts in PT/EN.
   Client case media retain their own colors. */

/* One two-color button system. Variants and geometry remain on the components. */
:root { --button-primary:var(--neutral-black); --button-primary-dark:var(--neutral-black); --button-secondary:var(--primary-300); --button-primary-ink:var(--neutral-white); --button-secondary-ink:var(--neutral-carbon); --button-theme:light; --button-outline-background:var(--neutral-black); --button-outline-ink:var(--neutral-white); --button-outline-border:transparent; --button-fill-hover-ink:var(--neutral-black); --button-fill-hover-border:var(--neutral-white); --button-fill:var(--button-primary); --button-fill-border:transparent; --button-on-fill:var(--button-primary-ink); --button-outline:var(--primary-700); --button-hover:var(--neutral-white); --button-hover-ink:var(--neutral-black); --button-hover-border:var(--neutral-white); --button-fill-hover:var(--neutral-white); }
:where(.surface-paper,.surface-white,.ht-menu,[data-theme=paper],[data-theme=white],[data-surface=paper],[data-surface=white]) { --button-theme:light; --button-outline-background:var(--neutral-black); --button-outline-ink:var(--neutral-white); --button-outline-border:transparent; --button-fill-hover-ink:var(--neutral-black); --button-fill-hover-border:var(--neutral-white); --button-fill:var(--button-primary); --button-fill-border:transparent; --button-on-fill:var(--button-primary-ink); --button-outline:var(--primary-700); --button-hover:var(--neutral-white); --button-hover-ink:var(--neutral-black); --button-hover-border:var(--neutral-white); --button-fill-hover:var(--neutral-white); }
:where(.surface-dark,body > footer,.ht-hero,.reel-hero,.ht-header,.cb-lightbox,.cb-explore,[data-theme=carbon],[data-surface=dark],.pc-case-video-cover,.gg-film-play,.colorire-video-play,.ai-project-preview) { --button-theme:inverse; --button-outline-background:transparent; --button-outline-ink:var(--button-outline); --button-outline-border:var(--button-outline); --button-fill-hover-ink:var(--button-secondary-ink); --button-fill-hover-border:var(--button-secondary); --button-fill:var(--button-primary-dark); --button-on-fill:var(--button-primary-ink); --button-fill-border:transparent; --button-outline:var(--button-secondary); --button-hover:var(--primary-700); --button-hover-ink:var(--button-primary-ink); --button-hover-border:var(--button-secondary); --button-fill-hover:var(--button-secondary); }
:where(.cta-band,.surface-signal,.home-contato,.home-why,.signal-bg,.s-signal,[data-surface=signal]) { --button-theme:inverse; --button-outline-background:transparent; --button-outline-ink:var(--button-outline); --button-outline-border:var(--button-outline); --button-fill-hover-ink:var(--button-secondary-ink); --button-fill-hover-border:var(--button-secondary); --button-fill:var(--button-primary); --button-on-fill:var(--button-primary-ink); --button-fill-border:transparent; --button-outline:var(--button-secondary); --button-hover:var(--primary-700); --button-hover-ink:var(--button-primary-ink); --button-hover-border:var(--button-secondary); --button-fill-hover:var(--button-secondary); }
:where(.page[data-page=ads]:lang(pt-BR) > :is(.service-topic-overview,#planos,#google-ads,#atendimento)) { --button-theme:inverse; --button-outline-background:transparent; --button-outline-ink:var(--button-outline); --button-outline-border:var(--button-outline); --button-fill-hover-ink:var(--button-secondary-ink); --button-fill-hover-border:var(--button-secondary); --button-fill:var(--button-primary-dark); --button-on-fill:var(--button-primary-ink); --button-fill-border:transparent; --button-outline:var(--button-secondary); --button-hover:var(--primary-700); --button-hover-ink:var(--button-primary-ink); --button-hover-border:var(--button-secondary); --button-fill-hover:var(--button-secondary); }
@media(max-width:900px) { :where(.ht-menu) { --button-theme:inverse; --button-outline-background:transparent; --button-outline-ink:var(--button-outline); --button-outline-border:var(--button-outline); --button-fill-hover-ink:var(--button-secondary-ink); --button-fill-hover-border:var(--button-secondary); --button-fill:var(--button-primary-dark); --button-on-fill:var(--button-primary-ink); --button-fill-border:transparent; --button-outline:var(--button-secondary); --button-hover:var(--primary-700); --button-hover-ink:var(--button-primary-ink); --button-hover-border:var(--button-secondary); --button-fill-hover:var(--button-secondary); } }
/* On Paper/light neutral surfaces, both CTA variants use black/white.
   Inverse surfaces reset the outline and keep their existing palette. */
:is(.btn:not(.ht-explore),.pill-btn) {
 --btn-background:var(--button-outline-background); --btn-foreground:var(--button-outline-ink); --btn-border:var(--button-outline-border);
 --btn-hover-background:var(--button-hover); --btn-hover-foreground:var(--button-hover-ink); --btn-hover-border:var(--button-hover-border);
 background:var(--btn-background); color:var(--btn-foreground); border:1px solid var(--btn-border); box-shadow:none;
 transition:background-color var(--button-duration,.2s),color var(--button-duration,.2s),border-color var(--button-duration,.2s);
}
:is(.btn.btn-hot,.pill-btn.deck-portfolio-return,a.cta,button.cta) {
 --btn-background:var(--button-fill); --btn-foreground:var(--button-on-fill); --btn-border:var(--button-fill-border,var(--button-fill));
 --btn-hover-background:var(--button-fill-hover); --btn-hover-foreground:var(--button-fill-hover-ink,var(--button-secondary-ink)); --btn-hover-border:var(--button-fill-hover-border,var(--button-secondary));
 background:var(--btn-background); color:var(--btn-foreground); border:1px solid var(--btn-border); box-shadow:none;
}
body[data-wda-cursor-global][data-theme] .topbar-actions .pill-btn { background:var(--btn-background); color:var(--btn-foreground); border-color:var(--btn-border); }
:is(.btn,.pill-btn,a.cta,button.cta):not(:disabled,[aria-disabled=true]):focus-visible {
 background:var(--btn-hover-background); color:var(--btn-hover-foreground); border-color:var(--btn-hover-border); outline-color:var(--button-outline);
}
button:not(.btn),a.support-fab { --control-hover:var(--button-hover); --control-hover-ink:var(--button-hover-ink); --control-hover-border:var(--button-hover-border); }
button:not(.btn):not(:disabled,[aria-disabled=true]):focus-visible { background-color:var(--control-hover); color:var(--control-hover-ink); border-color:var(--control-hover-border); }
/* The split Hero CTA keeps its two panels and existing flat/outline distinction. */
.home-video-page .ht-explore {
 --btn-background:transparent; --btn-hover-background:transparent; --btn-foreground:var(--button-on-fill); --btn-hover-foreground:var(--button-hover-ink); --btn-hover-border:transparent;
 color:var(--btn-foreground);
}
.home-video-page .ht-explore:not(.ht-explore-secondary) > span { background:var(--button-fill); color:var(--button-on-fill); border-color:var(--button-fill-border,var(--button-fill)); }
.home-video-page .ht-explore-secondary > span { background:transparent; color:var(--button-outline); border-color:var(--button-outline); }
.home-video-page .ht-explore:focus-visible > span { background:var(--button-hover); color:var(--button-hover-ink); border-color:var(--button-hover-border); }
/* Circular actions use the same colors without changing their circular shape. */
.home-video-page .page[data-page=home] .home-fazemos .home-fazemos-go { background:var(--button-fill); color:var(--button-on-fill); border-color:var(--button-fill-border,var(--button-fill)); }
.home-video-page .home-fazemos.surface-dark .home-fazemos-card:focus-visible .home-fazemos-go { background:var(--button-fill-hover); color:var(--button-secondary-ink); border-color:var(--button-secondary); }
:is(.site-navigation-page,.hero-test-page) a.support-fab { background:var(--button-fill); color:var(--button-on-fill); border-color:var(--button-fill-border,var(--button-fill)); }
/* Hold-to-send keeps both labels legible as its progress fill advances. */
.f-submit.press-hold .ph-label-base { color:var(--btn-foreground); }
.f-submit.press-hold:focus-visible .ph-label-base { color:var(--btn-hover-foreground); }
:is(.site-navigation-page,.hero-test-page) .portfolio-intro ~ .portfolio-featured .portfolio-category-buttons button[aria-pressed=true] { background:var(--button-fill); color:var(--button-on-fill); border-color:var(--button-fill-border,var(--button-fill)); }
@media(hover:hover) and (pointer:fine) {
 :is(.btn,.pill-btn,a.cta,button.cta):not(:disabled,[aria-disabled=true]):hover { background:var(--btn-hover-background); color:var(--btn-hover-foreground); border-color:var(--btn-hover-border); }
 body[data-wda-cursor-global][data-theme] .topbar-actions .pill-btn:not(:disabled,[aria-disabled=true]):is(:hover,:focus-visible) { background:var(--btn-hover-background); color:var(--btn-hover-foreground); border-color:var(--btn-hover-border); }
 button:not(.btn):not(:disabled,[aria-disabled=true]):hover { background-color:var(--control-hover); color:var(--control-hover-ink); border-color:var(--control-hover-border); }
 .home-video-page .ht-explore:not(:disabled,[aria-disabled=true]):hover > span { background:var(--button-hover); color:var(--button-hover-ink); border-color:var(--button-hover-border); }
 .home-video-page .home-fazemos.surface-dark .home-fazemos-card:hover .home-fazemos-go { background:var(--button-fill-hover); color:var(--button-secondary-ink); border-color:var(--button-secondary); }
 .f-submit.press-hold:not(:disabled,[aria-disabled=true]):hover .ph-label-base { color:var(--btn-hover-foreground); }
 :is(.site-navigation-page,.hero-test-page) .portfolio-intro ~ .portfolio-featured .portfolio-category-buttons button[aria-pressed=true]:not(:disabled,[aria-disabled=true]):hover { background:var(--button-fill-hover); color:var(--button-secondary-ink); border-color:var(--button-secondary); }
 :is(.site-navigation-page,.hero-test-page) a.support-fab:hover { background:var(--button-fill-hover); color:var(--button-secondary-ink); border-color:var(--button-secondary); }
}
/* Existing proposal movement is retained; color feedback shares the 200ms timing. */
:is(.s-signal,.signal-bg) .btn { transition:background-color var(--button-duration,.2s),color var(--button-duration,.2s),border-color var(--button-duration,.2s),gap .3s var(--ease-out),transform .3s var(--ease-out); }
@media(prefers-reduced-motion:reduce) { :is(.btn,.pill-btn,a.cta,button.cta) { transition:none; } }

/* Draft Hero uses the same inverse flat colors as the published Hero. */
.reel-hero .reel-hero-contact { --button-fill:var(--button-primary-dark); --button-on-fill:var(--button-primary-ink); --button-fill-hover:var(--button-secondary); }

/* Expertise selectors remain text-only on hover and keyboard focus. */
.web-expertise .web-expertise-tab { --control-hover:transparent; }

/* The primary split Hero action follows the flat black-to-gray contract. */
.home-video-page .ht-explore:not(.ht-explore-secondary) { --button-hover:var(--button-secondary); --button-hover-ink:var(--button-secondary-ink); --button-hover-border:var(--button-secondary); }

.home-video-page .ht-explore:not(.ht-explore-secondary) > span { border:1px solid var(--button-fill-border,var(--button-fill)); }