/* Dedicated button system — one interaction language for links and native buttons. */
:where(button,.btn,.icon-button,.link-button,summary,a[href]){
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}

.btn{
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.58rem;
  min-height:2.9rem;
  max-width:100%;
  padding:.78rem 1.15rem;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:.92rem;
  font:inherit;
  font-size:.92rem;
  font-weight:850;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 10px 25px rgba(15,23,48,.12);
  transition:transform var(--transition),box-shadow var(--transition),background-color var(--transition),border-color var(--transition),color var(--transition),filter var(--transition);
}
.btn::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.22) 48%,transparent 76%);
  transform:translateX(-130%);
  transition:transform 520ms cubic-bezier(.2,.7,.2,1);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(15,23,48,.18)}
.btn:hover::before{transform:translateX(130%)}
.btn:active{transform:translateY(0);box-shadow:0 7px 17px rgba(15,23,48,.12)}
.btn:focus-visible,.icon-button:focus-visible,.link-button:focus-visible{outline:3px solid color-mix(in srgb,var(--aqua) 72%,white);outline-offset:3px}

.btn-primary{background:linear-gradient(135deg,var(--primary-dark),#273b69);border-color:color-mix(in srgb,var(--primary-dark) 84%,white);color:#fff}
.btn-primary:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--primary-dark) 88%,var(--secondary)),#334b7d);color:#fff}
html[data-theme="dark"] .btn-primary{background:linear-gradient(135deg,var(--secondary),var(--accent));border-color:rgba(255,255,255,.2);color:#101626}

.btn-accent{background:var(--gradient-warm);border-color:color-mix(in srgb,var(--secondary) 55%,var(--accent));color:#141827;box-shadow:0 12px 28px rgba(233,82,103,.2)}
.btn-accent:hover{filter:saturate(1.08) brightness(1.02);color:#101626}

.btn-outline,.btn-ghost,.btn-outline-light{background:var(--surface);border-color:var(--border-strong);color:var(--heading);box-shadow:none;backdrop-filter:blur(14px)}
.btn-outline:hover,.btn-ghost:hover,.btn-outline-light:hover{background:var(--surface-solid);border-color:color-mix(in srgb,var(--primary) 72%,var(--border));color:var(--heading);box-shadow:var(--shadow)}
.cta-panel .btn-outline-light,.package-price-panel .btn-outline-light{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.34);color:#fff}
.cta-panel .btn-outline-light:hover,.package-price-panel .btn-outline-light:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.72);color:#fff}
.pricing-card .btn-outline-light{background:var(--surface);border-color:var(--border-strong);color:var(--heading)}

.btn-lg{min-height:3.35rem;padding:.94rem 1.4rem;font-size:1rem}
.btn-sm{min-height:2.75rem;padding:.6rem .85rem;font-size:.82rem}
.btn-block{width:100%}
.header-cta{white-space:nowrap}
.btn[aria-disabled="true"],.btn:disabled{opacity:.52;pointer-events:none;box-shadow:none;filter:grayscale(.18)}
.btn-icon{width:1.08rem;height:1.08rem;flex:0 0 auto;transition:transform var(--transition)}
.btn:hover .btn-icon{transform:translateX(.18rem)}

.icon-button{
  display:inline-grid;
  place-items:center;
  width:2.75rem;
  height:2.75rem;
  min-width:2.75rem;
  min-height:2.75rem;
  padding:0;
  border:1px solid var(--border);
  border-radius:.86rem;
  background:var(--surface);
  color:var(--heading);
  cursor:pointer;
  box-shadow:0 7px 18px rgba(15,23,48,.08);
  transition:transform var(--transition),background-color var(--transition),border-color var(--transition),box-shadow var(--transition);
}
.icon-button:hover{transform:translateY(-1px);background:var(--surface-solid);border-color:var(--border-strong);box-shadow:var(--shadow)}
.icon-button:active{transform:none}
.icon-button svg{width:1.12rem;height:1.12rem}
.icon-button .control-image{display:block;width:1.55rem;height:1.55rem;object-fit:contain}
.icon-button .menu-close-icon{display:none}
.mobile-menu-toggle{display:none}

.link-button{
  display:inline-flex;
  align-items:center;
  min-height:2.75rem;
  padding:.18rem 0;
  border:0;
  border-bottom:1px solid transparent;
  border-radius:0;
  background:none;
  color:var(--muted);
  font:inherit;
  font-size:.9rem;
  cursor:pointer;
}
.link-button:hover{border-bottom-color:currentColor;color:var(--heading)}

@media(max-width:480px){
  .hero-actions .btn,.hero-buttons .btn,.cta-panel .cluster .btn{flex:1 1 100%;width:100%}
  .cookie-buttons .btn{min-width:0;padding-inline:.72rem}
}
@media(max-width:1279px){.header-cta{display:none}}
@media(min-width:1280px) and (max-width:1599px){.header-cta{padding-inline:.9rem}}
@media(max-width:900px){.mobile-menu-toggle{display:inline-grid}}
@media(any-hover:none){
  .btn:hover,.icon-button:hover{transform:none}
  .btn:hover::before{transform:translateX(-130%)}
  .btn:hover .btn-icon{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .btn::before{display:none}
  .btn:hover,.icon-button:hover{transform:none}
}
@media(forced-colors:active){
  .btn,.icon-button{border:1px solid ButtonText}
  .btn{background:ButtonFace;color:ButtonText}
}
