/* Acciones principales: contraste e identidad compartidos en las páginas propias. */
:root{
  --cta-web-white:var(--champagne);
  --cta-web-fill:var(--olive);
  --cta-web-ink:var(--cream);
  --cta-web-band-1:var(--cream);
  --cta-web-band-2:var(--sage);
  --cta-web-band-3:var(--brand-gradient-color2);
  --cta-web-band-4:var(--deep);
  --cta-web-edge-shade:color-mix(in srgb,var(--deep) 18%,transparent);
  --cta-web-focus:var(--ui-focus,var(--olive));
  --cta-web-focus-underlay:var(--cream);
  --cta-web-duration:2s;
  --cta-web-magnet-range-x:18px;
  --cta-web-magnet-range-y:9px;
}
@media screen and (forced-colors:none){
  :root:not([data-theme="dark"]){
    --cta-web-fill:var(--ui-day-ink);
    --cta-web-ink:var(--cream);
    --cta-web-band-1:var(--cream);
    --cta-web-band-2:color-mix(in srgb,var(--ui-day-ink) 25%,var(--cream));
    --cta-web-band-3:color-mix(in srgb,var(--ui-day-ink) 55%,var(--cream));
    --cta-web-band-4:var(--ui-day-ink);
    --cta-web-edge-shade:color-mix(in srgb,var(--ui-day-ink) 18%,transparent);
  }
  :root[data-theme="dark"]{
    --cta-web-fill:var(--cta-web-white);
    --cta-web-ink:var(--ui-night-surface);
    --cta-web-band-1:var(--brand-gradient-color1);
    --cta-web-band-2:var(--brand-gradient-color2);
    --cta-web-band-3:var(--brand-gradient-color3);
    --cta-web-band-4:var(--palette-brass);
    --cta-web-edge-shade:color-mix(in srgb,var(--ui-night-surface) 18%,transparent);
    --cta-web-focus:var(--champagne);
    --cta-web-focus-underlay:var(--ui-night-surface);
  }
}
/* La prioridad del componente conserva su aspecto sobre los estilos previos. */
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary),
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary):hover{
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:fit-content;
  max-width:100%;
  min-height:54px;
  padding:14px 26px;
  border:2px solid transparent;
  border-radius:var(--r-pill);
  background:
    linear-gradient(var(--cta-web-fill),var(--cta-web-fill)) padding-box,
    linear-gradient(transparent,var(--cta-web-edge-shade)) border-box,
    linear-gradient(100deg,var(--cta-web-band-1),var(--cta-web-band-2),var(--cta-web-band-3),var(--cta-web-band-4),var(--cta-web-band-1)) border-box;
  background-size:100% 100%,100% 100%,200% 100%;
  background-position:0% 50%;
  color:var(--cta-web-ink);
  font:inherit;
  font-size:14px;
  font-weight:600;
  line-height:1.5;
  text-align:center;
  text-decoration:none;
  text-shadow:none;
  white-space:normal;
  vertical-align:middle;
  overflow:visible;
  box-shadow:none;
  translate:var(--cta-web-magnet-x,0px) var(--cta-web-magnet-y,0px);
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
  animation:cta-web-flow var(--cta-web-duration) linear infinite;
  transition:transform .18s ease,box-shadow .18s ease;
}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)[hidden]{display:none}
:root .cta-web--magnet-active{will-change:translate}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):visited{color:var(--cta-web-ink)}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)>span,
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)>svg{position:relative;z-index:1}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)>svg{width:14px;height:14px;flex:none}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)::before{
  content:"";
  position:absolute;
  inset:auto;
  left:20%;
  bottom:-20%;
  z-index:-1;
  display:block;
  width:60%;
  height:20%;
  border-radius:50%;
  background:linear-gradient(100deg,var(--cta-web-band-1),var(--cta-web-band-2),var(--cta-web-band-3),var(--cta-web-band-4),var(--cta-web-band-1));
  background-size:200% 100%;
  background-position:0% 50%;
  filter:blur(14px);
  opacity:.55;
  pointer-events:none;
  animation:cta-web-flow var(--cta-web-duration) linear infinite;
  transition:opacity .18s ease;
}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button)::after{content:none;display:none}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):focus-visible{
  outline:3px solid var(--cta-web-focus);
  outline-offset:4px;
  box-shadow:0 0 0 2px var(--cta-web-focus-underlay);
}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):focus-visible::before{opacity:.75}
@media (hover:hover) and (pointer:fine){
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):not(:disabled,[aria-disabled="true"]):hover::before{opacity:.75}
}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):not(:disabled,[aria-disabled="true"]):active{transform:translateY(1px)}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary):is(:disabled,[aria-disabled="true"]){opacity:.45;cursor:not-allowed;animation:none;transform:none;translate:none}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(:disabled,[aria-disabled="true"])::before{opacity:0;animation:none}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary)[aria-busy="true"]{cursor:wait;animation-play-state:paused;translate:none}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)[aria-busy="true"]::before{animation-play-state:paused}

:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary).cta-web--hero:is(a,button){
  --cta-web-magnet-range-x:24px;
  --cta-web-magnet-range-y:12px;
  width:min(100%,340px);
  min-height:96px;
  padding:24px 52px;
  gap:18px;
  font-size:24px;
  font-weight:800;
  line-height:1.2;
}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary).cta-web--hero>svg{width:22px;height:22px}
:where(.admin-theme) :is(.cta-web,.doc-btn--primary){
  --cta-web-magnet-range-x:8px;
  --cta-web-magnet-range-y:4px;
}
/* La interfaz pública comparte el cuerpo legible; el panel conserva su densidad. */
:root body:not(.admin-theme) .cta-web:not(.cta-web--hero){font-size:var(--type-small,16px)}
.svc-wizard #pedirPrecio:is(.cta-web,:where(.admin-theme) .doc-btn--primary){min-height:54px;padding:14px 26px;font-size:14px}
:root summary:is(.cta-web,:where(.admin-theme) .doc-btn--primary).svc-config__summary{width:fit-content;list-style:none;text-align:left}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary).svc-config__summary>span:first-child{font-size:14px;line-height:1.4}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary).svc-config__summary>span>span{margin-top:3px;font-size:12px;line-height:1.5;color:inherit;opacity:.85}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary).svc-config__summary::after{background:transparent;border:1px solid currentColor;color:inherit}
:root :is(.cta-web,:where(.admin-theme) .doc-btn--primary).svc-config__summary::-webkit-details-marker{display:none}
@keyframes cta-web-flow{to{background-position:200% 50%}}

@media (prefers-reduced-motion:reduce){
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary),
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary):hover,
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)::before{animation:none;transition:none;translate:none}
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):active{transform:none}
}
.portfolio-preview :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary),
.portfolio-preview :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary):hover,
.portfolio-preview :is(.cta-web,:where(.admin-theme) .doc-btn--primary)::before{animation:none;transition:none;translate:none}
@media (hover:none),(pointer:coarse){
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary),
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary):hover{translate:none}
}
@media print,(forced-colors:active){
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary),
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary):hover{animation:none}
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary)::before{display:none}
}
@media (forced-colors:active){
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary),
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):is(a,button,summary):hover,
  :root :is(.cta-web,:where(.admin-theme) .doc-btn--primary):visited{
    border-color:ButtonText;
    background:ButtonFace;
    color:ButtonText;
  }
}
