/* Marketing links only: keep product demonstrations and form controls unchanged. */
:root body :is(.button,.reference-button,.nav-button,.plan-select)[href]{
 background:#22221e;
 color:#fff;
 border:2px solid #22221e;
 border-radius:999px;
 box-shadow:0 0 0 4px #EF5E20;
 text-decoration:none;
 transform:none;
 transition:background-color .2s cubic-bezier(0,0,.35,1),border-color .2s cubic-bezier(0,0,.35,1),color .2s cubic-bezier(0,0,.35,1);
}
:root body :is(.button-secondary,.reference-button-secondary,.nav-button-secondary)[href]{
 background:#fff;
 color:#22221e;
 border:2px solid #22221e;
 box-shadow:0 0 0 4px #f3f3f3;
}
@media(hover:hover){
 :root body :is(.button,.reference-button,.nav-button,.plan-select)[href]:hover{
  background:#151512;border-color:#151512;color:#fff;
 }
 :root body :is(.button-secondary,.reference-button-secondary,.nav-button-secondary)[href]:hover{
  background:#151512;border-color:#151512;color:#fff;
 }
}
:root body :is(.button,.reference-button,.nav-button,.plan-select)[href]:focus-visible{
 outline:2px solid #22221e;outline-offset:7px;
 box-shadow:0 0 0 4px #EF5E20;
}
@media(prefers-reduced-motion:reduce){
 :root body :is(.button,.reference-button,.nav-button,.plan-select)[href]{transition:none}
}

/* Primary CTAs switch fully to Sendvio orange without moving their labels. */
@media(hover:hover){
 :root body :is(.button,.reference-button,.nav-button,.plan-select)[href]:not(:is(.button-secondary,.reference-button-secondary,.nav-button-secondary)):hover{
  background:#EF5E20;
  border-color:#EF5E20;
  color:#fff;
  box-shadow:0 0 0 4px #EF5E20;
 }
}

/* Labels and icons keep their geometry during hover and keyboard focus. */
.cta-label{display:inline-flex;align-items:center;justify-content:center;gap:inherit}

/* Pricing plan selection: orange at rest, dark on hover. */
:root body #pricing .plan-select[href]{
 background:#EF5E20;
 border-color:#EF5E20;
 color:#fff;
 box-shadow:0 0 0 4px #EF5E20;
 transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
@media(hover:hover){
 :root body #pricing .plan-select[href]:hover{
  background:#22221e;
  border-color:#22221e;
  color:#fff;
  box-shadow:0 0 0 4px #22221e;
 }
}
@media(prefers-reduced-motion:reduce){
 :root body #pricing .plan-select[href]{transition:none}
}

/* Content-sized marketing actions. Demonstration controls keep their own scale. */
:root body :is(.button,.reference-button,.nav-button,.plan-select,.copy-button)[href]{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 box-sizing:border-box;
 inline-size:fit-content;
 max-inline-size:100%;
 min-inline-size:0;
 block-size:auto;
 min-block-size:44px;
 padding-block:10px;
 padding-inline:24px;
 line-height:1.4;
 white-space:normal;
 overflow-wrap:break-word;
 text-align:center;
 gap:10px;
}
:root body :is(.button,.reference-button,.nav-button,.plan-select,.copy-button)[href]>.cta-label{
 min-inline-size:0;
 white-space:normal;
 text-align:center;
 line-height:inherit;
}
:root body :is(.button,.reference-button,.nav-button,.plan-select,.copy-button)[href] :is(.ui-icon,svg){
 flex:none;
 align-self:center;
 vertical-align:middle;
}
:root body :is(.reference-actions,.hero-actions,.rv-actions,.wg-actions,.plus-actions,.fs-actions){
 min-inline-size:0;
 flex-wrap:wrap;
 align-items:center;
 gap:16px;
}
:root body :is(.reference-actions,.hero-actions,.rv-actions,.wg-actions,.plus-actions,.fs-actions)>*{
 min-inline-size:0;
 max-inline-size:100%;
}
:root body #pricing .plan-select[href]{inline-size:100%}
:root body :is(.sf-popup-button,.wg-demo-button,.rv-small-button,.wa-cta,.wg-mini-action,.mock-button,.preview-add-language){
 box-sizing:border-box;
 max-inline-size:100%;
 white-space:normal;
 overflow-wrap:break-word;
 text-align:center;
}
:root body .preview-language-group .preview-add-language{min-inline-size:0;flex:0 1 auto}
:root body .rv-small-button{flex:0 1 auto;min-inline-size:0}
@media(max-width:420px){
 :root body :is(.reference-actions,.hero-actions,.rv-actions,.wg-actions,.plus-actions,.fs-actions){row-gap:16px}
 :root body :is(.reference-actions,.hero-actions,.rv-actions,.wg-actions,.plus-actions,.fs-actions)>:is(.button,.reference-button)[href]{
  flex:1 1 auto;
  padding-inline:18px;
 }
}