/* Public landing page — scoped under .ema-landing so nothing leaks into the
   rest of either app. Neither app's global CSS (portal's .ema-page-enter /
   .ema-hover-lift, portal's --ema-surface-*) is available here, so this file
   is self-contained. */

html,
body,
html:has(.ema-landing) {
  scroll-behavior: smooth !important;
}

.ema-landing section[id],
.ema-landing div[id] {
  scroll-margin-top: 80px;
}

.ema-landing .ema-landing-fade {
  animation: ema-landing-fade-up 360ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes ema-landing-fade-up {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ema-landing .ema-landing-hover {
  transition:
    transform 180ms cubic-bezier(0.2, 0, 0, 1),
    box-shadow 180ms cubic-bezier(0.2, 0, 0, 1),
    border-color 180ms ease;
}
.ema-landing .ema-landing-hover:hover {
  transform: translateY(-4px);
  box-shadow: var(--mantine-shadow-md);
  border-color: var(--mantine-primary-color-light-color);
}

/* Card top accent gradient bar */
.ema-landing .ema-landing-card-accent {
  position: relative;
  overflow: hidden;
}
.ema-landing .ema-landing-card-accent::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #3160b7 0%, #1fc29d 100%);
  opacity: 0.85;
  transition: opacity 180ms ease;
}
.ema-landing .ema-landing-card-accent:hover::before {
  opacity: 1;
}

/* Stats counter card background glassmorphism */
.ema-landing .ema-stats-banner {
  background: linear-gradient(135deg, rgba(49, 96, 183, 0.04) 0%, rgba(31, 194, 157, 0.07) 100%);
  border-top: 1px solid var(--mantine-color-default-border);
  border-bottom: 1px solid var(--mantine-color-default-border);
}

/* Hero floating animation */
.ema-hero-pulse {
  animation: ema-hero-float 8s ease-in-out infinite alternate;
}

@keyframes ema-hero-float {
  0% {
    transform: translateY(0px) scale(1);
  }
  100% {
    transform: translateY(-12px) scale(1.03);
  }
}

/* Verification tab search box focus ring */
.ema-verification-box {
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
  transition: box-shadow 200ms ease;
}
.ema-verification-box:focus-within {
  box-shadow: 0 16px 40px rgba(49, 96, 183, 0.14);
}

/* Gradient text helper */
.ema-landing .ema-text-gradient {
  background: linear-gradient(135deg, #2453a2 0%, #0aab89 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Hero live status indicator pulse dot */
.ema-landing .ema-live-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  animation: ema-dot-pulse 2s infinite;
}

@keyframes ema-dot-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
  }
}

/* Vision & Mission card left accent borders */
.ema-landing .ema-vision-card {
  border-left: 4px solid #3160b7 !important;
}
.ema-landing .ema-mission-card {
  border-left: 4px solid #1fc29d !important;
}

/* Card hover arrow animation */
.ema-landing .ema-landing-hover .ema-card-arrow {
  transition: transform 180ms ease, color 180ms ease;
}
.ema-landing .ema-landing-hover:hover .ema-card-arrow {
  transform: translateX(4px);
  color: var(--mantine-primary-color-filled);
}

/* Footer top gradient accent bar */
.ema-landing footer {
  position: relative;
}
.ema-landing footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #3160b7 0%, #1fc29d 50%, #3160b7 100%);
}

/* FAQ custom item styling */
.ema-landing .ema-faq-accordion .mantine-Accordion-item {
  border: 1px solid var(--mantine-color-default-border);
  border-radius: var(--mantine-radius-lg);
  margin-bottom: 14px;
  background-color: var(--mantine-color-body);
  transition: box-shadow 180ms ease, border-color 180ms ease;
}
.ema-landing .ema-faq-accordion .mantine-Accordion-item[data-active] {
  border-color: var(--mantine-primary-color-light-color);
  box-shadow: 0 8px 24px rgba(49, 96, 183, 0.08);
}
.ema-landing .ema-faq-accordion .mantine-Accordion-control {
  font-weight: 600;
  padding: 16px 20px;
}

/* Contact HQ Card and Inquiry Form Styling */
.ema-landing .ema-contact-hq-card {
  border-left: 4px solid var(--mantine-primary-color-filled);
}
.ema-landing .ema-inquiry-box {
  box-shadow: 0 12px 36px rgba(15, 23, 42, 0.06);
  border: 1px solid var(--mantine-color-default-border);
}

/* Mobile drawer link item */
.ema-drawer-nav-link {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  border-radius: var(--mantine-radius-md);
  font-weight: 500;
  color: var(--mantine-color-text);
  text-decoration: none;
  transition: background-color 140ms ease;
}
.ema-drawer-nav-link:hover,
.ema-drawer-nav-link[aria-current='true'] {
  background-color: var(--mantine-color-default-hover);
  color: var(--mantine-primary-color-filled);
}

/* Amharic runs 20-40% longer than English and falls back to a different font
   (Inter has no Ethiopic glyphs), so it needs more vertical room. */
.ema-landing:lang(am) {
  line-height: 1.7;
}

@media (prefers-reduced-motion: reduce) {
  html:has(.ema-landing) {
    scroll-behavior: auto;
  }
  .ema-landing .ema-landing-fade,
  .ema-landing .ema-landing-hover,
  .ema-hero-pulse,
  .ema-landing .ema-live-dot {
    animation: none;
    transition: none;
  }
}
