/* Canonical web CTA motion, measured on Inicio (2026-10-14).
 * Public source; DESIGN SYSTEM/assets/web-components/button-motion.css is derived.
 * Geometry adapters preserve each family's existing dimensions. */
:is([data-cta-motion],.lr-web-button) {
  --cta-duration:400ms; --cta-label-duration:360ms; --cta-fade-duration:220ms;
  --cta-ease:cubic-bezier(.2,.8,.2,1); --cta-press-duration:280ms;
  --cta-inset:8px; --cta-rest-right:8px; --cta-icon:52px; --cta-label-y:0%;
  position:relative; isolation:isolate; overflow:hidden;
  transition:transform var(--cta-press-duration) cubic-bezier(.2,.65,.3,1) !important;
}
[data-cta-motion="orb"] { --cta-label-y:-50%; }
[data-cta-motion="flat"].button { --cta-rest-right:var(--button-pad-x,16px); --cta-inset:var(--button-pad-y,8px); --cta-icon:var(--button-icon,52px); }
.lr-web-button { --cta-rest-right:16px; }
.lr-web-article .lr-web-button { --cta-icon:44px; --cta-inset:4px; --cta-rest-right:10px; }
.blog-read-link[data-cta-motion] { --cta-icon:34px; --cta-inset:5px; --cta-rest-right:6px; }
.blog-card .blog-read-link[data-cta-motion] { --cta-icon:30px; }
.blog-press-card .blog-read-link[data-cta-motion] { --cta-icon:23px; }
.blog-detail-page .blog-related .blog-read-link[data-cta-motion] { --cta-icon:28px; }
.not-found-page .not-found__home[data-cta-motion] { --cta-inset:calc(8 * var(--not-found-unit)); --cta-icon:calc(52 * var(--not-found-unit)); --cta-rest-right:var(--cta-inset); }

/* Text exits left while the original circle expands. No absolute-position jump. */
:is([data-cta-motion],.lr-web-button) :is(.button-label,.lr-web-button-label),
.blog-read-link[data-cta-motion] > span:first-child {
  z-index:2;
  transform:translate(0,var(--cta-label-y)) !important;
  transition:opacity var(--cta-fade-duration) ease,transform var(--cta-label-duration) var(--cta-ease) !important;
}
.blog-read-link[data-cta-motion] > span:first-child { position:relative; }
[data-cta-motion="orb"] .button-orb {
  top:var(--cta-inset) !important; right:var(--cta-rest-right) !important;
  width:var(--cta-icon) !important; height:calc(100% - 2 * var(--cta-inset)) !important;
  border-radius:999px !important; box-shadow:none !important;
  transition:width var(--cta-duration) var(--cta-ease),height var(--cta-duration) var(--cta-ease),top var(--cta-duration) var(--cta-ease),right var(--cta-duration) var(--cta-ease),border-radius var(--cta-duration) var(--cta-ease) !important;
}
/* Flat markup (worker landing, article links and catalog) uses the same surface. */
:is([data-cta-motion="flat"],.lr-web-button)::before {
  content:""; position:absolute; z-index:0;
  inset:auto !important; top:var(--cta-inset) !important; right:var(--cta-rest-right) !important;
  width:var(--cta-icon) !important; height:calc(100% - 2 * var(--cta-inset)) !important;
  border-radius:999px !important; background:#173300;
  transition:width var(--cta-duration) var(--cta-ease),height var(--cta-duration) var(--cta-ease),top var(--cta-duration) var(--cta-ease),right var(--cta-duration) var(--cta-ease),border-radius var(--cta-duration) var(--cta-ease) !important;
}
:is([data-cta-motion="flat"],.lr-web-button)::after {
  content:""; display:block; position:static; width:var(--cta-icon) !important; height:var(--cta-icon); flex:0 0 var(--cta-icon);
}
:is([data-cta-motion="flat"],.lr-web-button) > :is(.button-arrow,.blog-read-link__arrow,.lr-web-button-icon) {
  position:absolute !important; z-index:1; left:auto !important; top:50% !important; right:var(--cta-rest-right);
  width:var(--cta-icon); height:var(--cta-icon); background:transparent !important;
  transform:translateY(-50%) !important;
  transition:right var(--cta-duration) var(--cta-ease) !important;
}
:is([data-cta-motion],.lr-web-button):is(:hover,:focus-visible) { background:#eaff25 !important; box-shadow:none; transform:none !important; }
:is([data-cta-motion],.lr-web-button):focus-visible { outline:3px solid #7d6a03; outline-offset:4px; }
/* Keyboard gets the same effect. Hover is restricted to precise pointers. */
:is([data-cta-motion],.lr-web-button):focus-visible :is(.button-label,.lr-web-button-label),
.blog-read-link[data-cta-motion]:focus-visible > span:first-child { opacity:0; transform:translate(-110%,var(--cta-label-y)) !important; }
[data-cta-motion="orb"]:focus-visible .button-orb,
:is([data-cta-motion="flat"],.lr-web-button):focus-visible::before { right:var(--cta-inset) !important; width:calc(100% - 2 * var(--cta-inset)) !important; }
:is([data-cta-motion="flat"],.lr-web-button):focus-visible > :is(.button-arrow,.blog-read-link__arrow,.lr-web-button-icon) { right:calc(50% - var(--cta-icon) / 2); }
@media(hover:hover) and (pointer:fine) {
  :is([data-cta-motion],.lr-web-button):hover :is(.button-label,.lr-web-button-label),
  .blog-read-link[data-cta-motion]:hover > span:first-child { opacity:0; transform:translate(-110%,var(--cta-label-y)) !important; }
  [data-cta-motion="orb"]:hover .button-orb,
  :is([data-cta-motion="flat"],.lr-web-button):hover::before { right:var(--cta-inset) !important; width:calc(100% - 2 * var(--cta-inset)) !important; }
  :is([data-cta-motion="flat"],.lr-web-button):hover > :is(.button-arrow,.blog-read-link__arrow,.lr-web-button-icon) { right:calc(50% - var(--cta-icon) / 2); }
}
@media(prefers-reduced-motion:no-preference) {
  :is([data-cta-motion],.lr-web-button):active { transform:translateY(1px) scale(.975) !important; }
}
/* Store badges keep the same separate interaction family as Inicio. */
:is(.store-badges a,.store-link,.lr-web-badges a) { transition:transform 280ms cubic-bezier(.2,.65,.3,1),opacity 220ms ease !important; }
@media(hover:hover) and (pointer:fine) {
  :is(.store-badges a,.store-link,.lr-web-badges a):hover { transform:translateY(-3px); opacity:.86; }
}
@media(prefers-reduced-motion:no-preference) {
  :is(.store-badges a,.store-link,.lr-web-badges a):active { transform:translateY(1px) scale(.975); }
}
@media(prefers-reduced-motion:reduce) {
  :is([data-cta-motion],.lr-web-button),:is([data-cta-motion],.lr-web-button)::before,
  :is([data-cta-motion],.lr-web-button) *,:is(.store-badges a,.store-link,.lr-web-badges a) { transition:none !important; }
}
/* The old individual hover rules must not hide labels on touch screens. */
@media(hover:none) {
  :is([data-cta-motion],.lr-web-button):hover:not(:focus-visible) :is(.button-label,.lr-web-button-label),
  .blog-read-link[data-cta-motion]:hover:not(:focus-visible) > span:first-child { opacity:1; }
}
/* Keep action labels readable while a form action is unavailable or pending. */
:is([data-cta-motion],.lr-web-button):is(:disabled,[aria-disabled="true"],[aria-busy="true"]) :is(.button-label,.lr-web-button-label),
.blog-read-link[data-cta-motion]:is([aria-disabled="true"],[aria-busy="true"]) > span:first-child {
  opacity:1 !important; transform:translate(0,var(--cta-label-y)) !important;
}
:is([data-cta-motion],.lr-web-button):is(:disabled,[aria-disabled="true"],[aria-busy="true"]) { transform:none !important; }
[data-cta-motion="orb"]:is(:disabled,[aria-disabled="true"],[aria-busy="true"]) .button-orb,
:is([data-cta-motion="flat"],.lr-web-button):is(:disabled,[aria-disabled="true"],[aria-busy="true"])::before {
  width:var(--cta-icon) !important; right:var(--cta-rest-right) !important;
}
:is([data-cta-motion="flat"],.lr-web-button):is(:disabled,[aria-disabled="true"],[aria-busy="true"]) > :is(.button-arrow,.blog-read-link__arrow,.lr-web-button-icon) { right:var(--cta-rest-right) !important; }
