/* =============================================================
   Alfa MED — CSS custom para reforcar a identidade no Elementor.
   Use as classes (.alfamed-*) em "CSS Classes" do widget Elementor
   (aba Avancado de cada elemento).
   ============================================================= */

:root {
  --alfamed-primary:        #1E5631;
  --alfamed-primary-dark:   #143D22;
  --alfamed-primary-light:  #2E7A47;
  --alfamed-secondary:      #4DA94C;
  --alfamed-secondary-dark: #3A8939;
  --alfamed-secondary-light:#7BC74E;
  --alfamed-accent:         #F59E0B;
  --alfamed-accent-dark:    #D97706;
  --alfamed-whatsapp:       #25D366;
  --alfamed-whatsapp-dark:  #1DA851;
  --alfamed-text:           #111827;
  --alfamed-text-soft:      #374151;
  --alfamed-text-muted:     #6B7280;
  --alfamed-bg-soft:        #F9FAFB;
  --alfamed-bg-dark:        #0F172A;
}

/* ===== Botoes (classes utilitarias para HTML widget / Shortcode) ===== */
.btn { display: inline-flex; align-items: center; gap: .5rem; padding: .75rem 1.5rem; font-family: 'Poppins', sans-serif; font-weight: 600; border-radius: 999px; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; line-height: 1; }
.btn:hover { transform: translateY(-2px); }
.btn-wa { background: var(--alfamed-whatsapp); color: #fff; box-shadow: 0 8px 24px rgb(37 211 102 / .4); }
.btn-wa:hover { background: var(--alfamed-whatsapp-dark); color: #fff; }
.btn-primary { background: var(--alfamed-primary); color: #fff; }
.btn-primary:hover { background: var(--alfamed-primary-dark); color: #fff; }
.btn-accent { background: var(--alfamed-accent); color: #fff; box-shadow: 0 8px 24px rgb(245 158 11 / .35); }
.btn-accent:hover { background: var(--alfamed-accent-dark); color: #fff; }

/* ===== CTA WhatsApp flutuante (canto inferior direito, em todas as paginas) ===== */
.alfamed-wa-float {
  position: fixed !important;
  bottom: clamp(1rem, 3vw, 2rem);
  right: clamp(1rem, 3vw, 2rem);
  width: 60px;
  height: 60px;
  background: var(--alfamed-whatsapp);
  color: #fff !important;
  border-radius: 999px;
  display: grid;
  place-items: center;
  box-shadow: 0 8px 24px rgb(37 211 102 / .45);
  z-index: 9999;
  transition: transform .25s ease;
  animation: alfamed-pulse 2.4s ease-in-out infinite;
}
.alfamed-wa-float:hover { transform: scale(1.08); }
.alfamed-wa-float svg { width: 28px; height: 28px; fill: #fff; }

@keyframes alfamed-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgb(37 211 102 / 0.6), 0 8px 24px rgb(37 211 102 / .45); }
  50%      { box-shadow: 0 0 0 16px rgb(37 211 102 / 0),   0 8px 24px rgb(37 211 102 / .45); }
}

/* ===== Wave separator (use no widget Shape Divider OU como classe) ===== */
.alfamed-wave-bottom {
  position: relative;
}
.alfamed-wave-bottom::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: clamp(40px, 6vw, 80px);
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'><path d='M0,40 C320,100 720,0 1440,60 L1440,100 L0,100 Z' fill='%23ffffff'/></svg>") no-repeat bottom / 100% 100%;
  pointer-events: none;
}

/* ===== Hover refinado para cards (Elementor "Icon Box" / "Image Box") ===== */
.alfamed-card-hover .elementor-widget-container,
.alfamed-card-hover {
  transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s cubic-bezier(.16,1,.3,1);
  border-radius: 16px;
}
.alfamed-card-hover:hover .elementor-widget-container,
.alfamed-card-hover:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgb(15 23 42 / .12);
}

/* ===== Top border gradient (visual nos cards de diferenciais) ===== */
.alfamed-card-gradient-top { position: relative; overflow: hidden; border-radius: 16px; }
.alfamed-card-gradient-top::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, var(--alfamed-primary), var(--alfamed-secondary-light));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.16,1,.3,1);
}
.alfamed-card-gradient-top:hover::before { transform: scaleX(1); }

/* ===== Quote testimonial (classe para o widget Testimonial / Image Box) ===== */
.alfamed-quote {
  position: relative;
  padding: 2rem;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgb(15 23 42 / .08);
}
.alfamed-quote::before {
  content: "“";
  position: absolute;
  top: -.2em;
  left: .8rem;
  font-family: 'Poppins', serif;
  font-size: 6rem;
  line-height: 1;
  color: var(--alfamed-primary);
  opacity: .12;
  pointer-events: none;
}

/* ===== Hero — gradient overlay sobre imagem de fundo ===== */
.alfamed-hero-overlay {
  position: relative;
  isolation: isolate;
}
.alfamed-hero-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgb(15 23 42 / .85) 0%, rgb(30 86 49 / .65) 60%, rgb(77 169 76 / .5) 100%);
  z-index: -1;
}

/* ===== Eyebrow (texto pequeno acima do titulo) ===== */
.alfamed-eyebrow {
  display: inline-block;
  font-family: 'Poppins', sans-serif;
  font-size: .875rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--alfamed-secondary);
  padding: .5rem 1rem;
  background: rgb(77 169 76 / .12);
  border-radius: 999px;
  border: 1px solid rgb(77 169 76 / .3);
}

/* ===== Stats (numeros destaque no "Sobre") ===== */
.alfamed-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; padding: 1.5rem 0; border-top: 1px solid #E5E7EB; border-bottom: 1px solid #E5E7EB; }
.alfamed-stats__item { text-align: left; }
.alfamed-stats__num { display: block; font-family: 'Poppins', sans-serif; font-weight: 800; font-size: clamp(1.5rem, 3vw, 2.25rem); color: var(--alfamed-primary); line-height: 1; }
.alfamed-stats__label { display: block; font-size: .875rem; color: var(--alfamed-text-muted); margin-top: .25rem; }

/* ===== Skip-link para acessibilidade (Hello Elementor ja inclui mas reforcamos) ===== */
.skip-link { position: absolute; top: -40px; left: 0; background: #000; color: #fff; padding: 8px 16px; z-index: 99999; }
.skip-link:focus { top: 0; }

/* ===== Otimizacao para usuarios com prefers-reduced-motion ===== */
@media (prefers-reduced-motion: reduce) {
  .alfamed-wa-float { animation: none; }
  .alfamed-card-hover:hover,
  .alfamed-card-hover:hover .elementor-widget-container { transform: none; }
}