/* ============================================================
   components.css — PRONTOSERRATURE · prefisso euf
   Componenti riusabili: bottoni (3 pattern CTA), card, eyebrow, badge.
   REGOLA CTA: rosso = chiamata urgente (max forza, un uso). Ambra = il resto.
   v1.0 — WEB ONLY
   ============================================================ */

/* ---------- BOTTONI ---------- */
.euf-btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-family:var(--euf-font-heading);font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-size:1rem;line-height:1;border:none;border-radius:var(--euf-radius-sm);padding:16px 28px;cursor:pointer;text-decoration:none!important;transition:transform .12s ease,background .15s ease,box-shadow .15s ease;white-space:nowrap}
.euf-btn:hover{transform:translateY(-2px)}
.euf-btn:active{transform:translateY(0)}

/* Rosso emergenza — SOLO "Chiama ora 24/7" */
.euf-btn--urgent{background:var(--euf-urgent);color:var(--euf-on-urgent)!important;box-shadow:0 4px 16px rgba(var(--euf-urgent-rgb),.32)}
.euf-btn--urgent:hover{background:var(--euf-urgent-hover);color:#fff!important}

/* Ambra — azione "approfondisci / preventivo / whatsapp" */
.euf-btn--accent{background:var(--euf-accent);color:var(--euf-on-accent)!important}
.euf-btn--accent:hover{background:var(--euf-accent-hover);color:var(--euf-ink)!important}

/* WhatsApp (verde, secondaria d'azione) */
.euf-btn--wa{background:var(--euf-success);color:#fff!important}
.euf-btn--wa:hover{background:#256835;color:#fff!important}

/* Ghost — secondaria su chiaro */
.euf-btn--ghost{background:transparent;color:var(--euf-ink)!important;border:2px solid var(--euf-ink);padding:14px 26px}
.euf-btn--ghost:hover{background:var(--euf-ink);color:var(--euf-on-dark)!important}

/* Ghost su fondo scuro */
.euf-btn--ghost-light{background:transparent;color:var(--euf-on-dark)!important;border:2px solid rgba(255,255,255,.4);padding:14px 26px}
.euf-btn--ghost-light:hover{background:var(--euf-on-dark);color:var(--euf-ink)!important;border-color:var(--euf-on-dark)}

.euf-btn--lg{font-size:1.15rem;padding:18px 34px}
.euf-btn--block{display:flex;width:100%}

/* ---------- EYEBROW / OCCHIELLO ---------- */
.euf-eyebrow{display:inline-block;font-family:var(--euf-font-heading);font-weight:600;text-transform:uppercase;letter-spacing:3px;font-size:.78rem;color:var(--euf-accent-hover);margin-bottom:.6rem}
.euf-section--ink .euf-eyebrow,.euf-cta .euf-eyebrow{color:var(--euf-accent)}

/* ---------- CARD BASE ---------- */
.euf-card{background:#fff;border:1px solid rgba(var(--euf-ink-rgb),.10);border-radius:var(--euf-radius);box-shadow:var(--euf-shadow);overflow:hidden;transition:transform .15s ease,box-shadow .15s ease}
.euf-card:hover{transform:translateY(-4px);box-shadow:var(--euf-shadow-strong)}
.euf-card__body{padding:1.6rem}
.euf-card__title{font-family:var(--euf-font-heading);font-weight:600;font-size:1.25rem;margin:0 0 .5rem;color:var(--euf-ink)}
.euf-card__text{color:var(--euf-ink-soft);font-size:.98rem;margin:0 0 1rem}

/* ---------- BADGE / PILL ---------- */
.euf-badge{display:inline-flex;align-items:center;gap:.4rem;background:var(--euf-accent-soft);color:var(--euf-accent-hover);font-family:var(--euf-font-heading);font-weight:600;text-transform:uppercase;letter-spacing:1px;font-size:.72rem;padding:5px 12px;border-radius:50px}
.euf-badge--urgent{background:rgba(var(--euf-urgent-rgb),.12);color:var(--euf-urgent)}

/* ---------- LINK-BOX PATTERN (box cliccabile, link fantasma) ---------- */
/* Uso: <div class="euf-linkbox"><a class="euf-linkbox__a" href=""></a> contenuto </div> */
.euf-linkbox{position:relative}
.euf-linkbox__a{position:absolute;inset:0;z-index:2;text-indent:-9999px;overflow:hidden}
.euf-linkbox > *:not(.euf-linkbox__a){position:relative;z-index:1}