/* Site-wide hover & animation effects. Elements are tagged with data-fx by assets/site-effects.js. */

a, button {
  transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .25s ease, transform .25s ease, opacity .2s ease;
}

/* Buttons (padded links / buttons with a fill or border) */
[data-fx="btn"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px -10px rgba(11, 38, 107, .45);
}
[data-fx="btn"]:active { transform: translateY(0); box-shadow: none; }

/* Cards */
[data-fx="card"] {
  transition: transform .3s cubic-bezier(.2, .7, .3, 1), box-shadow .3s ease, border-color .3s ease;
}
[data-fx="card"]:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px -18px rgba(11, 38, 107, .35);
  border-color: #00A87E !important;
  position: relative;
  z-index: 1;
}

/* Cells in 1px-gap grids (lists, process steps) */
[data-fx="cell"] { transition: background-color .25s ease, box-shadow .25s ease; }
[data-fx="cell"]:hover {
  background-color: #F2FAF7 !important;
  box-shadow: inset 3px 0 0 #00A87E;
}
[data-fx-open] { background: transparent !important; border-color: transparent !important; }
[data-fx-open] > [data-fx="cell"] { box-shadow: 0 0 0 1px #E2E7EC; }
[data-fx-open] > [data-fx="cell"]:hover { box-shadow: inset 3px 0 0 #00A87E, 0 0 0 1px #E2E7EC; }

/* Image zoom inside clipped frames */
[data-fx-img] { transition: transform .6s cubic-bezier(.2, .7, .3, 1); }
[data-fx-zoomwrap]:hover [data-fx-img],
[data-fx="card"]:hover [data-fx-img] { transform: scale(1.06); }

/* Footer / nav text links */
footer a:hover { transform: translateX(3px); }
footer a[aria-label]:hover, footer button:hover { transform: scale(1.08); }

/* Scroll reveal (only once JS has started, so content never stays hidden without it) */
html.fx-ready [data-fx-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .3, 1);
  transition-delay: var(--fx-delay, 0ms);
}
html.fx-ready [data-fx-reveal][data-fx-in] { opacity: 1; transform: none; }
html.fx-ready [data-fx-reveal][data-fx-in][data-fx="card"]:hover { transform: translateY(-6px); transition-delay: 0ms; }

/* Hero entrance */
@keyframes fx-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
html.fx-ready [data-fx-hero] { animation: fx-rise .8s cubic-bezier(.2, .7, .3, 1) both; animation-delay: var(--fx-delay, 0ms); }

/* WhatsApp button pulse */
@keyframes fx-pulse { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .5); } 70% { box-shadow: 0 0 0 14px rgba(37, 211, 102, 0); } 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } }
.wa-btn { animation: fx-pulse 2.4s infinite; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html.fx-ready [data-fx-reveal] { opacity: 1; transform: none; }
  [data-fx]:hover, [data-fx-img] { transform: none !important; }
}

/* ---------- Responsive safety net ---------- */
img, video, svg { max-width: 100%; }
h1, h2, h3, h4, p, li, span, a { overflow-wrap: break-word; }
a[href^="mailto:"], a[href^="tel:"] { overflow-wrap: anywhere; }

@media (max-width: 640px) {
  /* 16px stops iOS from zooming into form fields */
  input, select, textarea { font-size: 16px !important; }
  /* value cards (Trust, Innovation...): two per row, an odd last card spans the row */
  .values-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .values-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .values-grid > * { padding-left: 14px !important; padding-right: 14px !important; }
  /* centre the label in CTA buttons when they wrap */
  section [data-fx="btn"] { text-align: center; }
}
