/*
 * ESPO 2.5.1.64 — Unified CTA system
 * A restrained architectural hierarchy for every button and call to action.
 * The header stylesheet loads after this file and keeps its refined variants.
 */

:root {
  --espo-cta-navy: #101c28;
  --espo-cta-navy-hover: #0b6da8;
  --espo-cta-navy-soft: #172635;
  --espo-cta-ivory: #f7f4ec;
  --espo-cta-ivory-hover: #fffdf8;
  --espo-cta-gold: #d7b75c;
  --espo-cta-gold-hover: #caa64a;
  --espo-cta-ink: #132130;
  --espo-cta-line: rgba(19, 33, 48, .18);
  --espo-cta-shadow: 0 10px 24px rgba(16, 28, 40, .10);
  --espo-cta-shadow-hover: 0 15px 34px rgba(11, 109, 168, .18);
  --espo-cta-radius: 13px;
}

/* Global button geometry: architectural, calm and consistent. */
body.espo-site .espo-btn {
  min-height: 46px;
  padding: .78rem 1.18rem;
  border-radius: var(--espo-cta-radius);
  font-size: .77rem;
  font-weight: 650;
  letter-spacing: .005em;
  box-shadow: none;
  transition:
    transform .25s cubic-bezier(.22,1,.36,1),
    color .25s ease,
    background-color .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;
}
body.espo-site .espo-btn__content {
  gap: .58rem;
}
body.espo-site .espo-btn .espo-icon {
  width: .95rem;
  height: .95rem;
}
body.espo-site .espo-btn:hover,
body.espo-site .espo-btn:focus-visible {
  transform: translateY(-2px);
}
body.espo-site .espo-btn:active {
  transform: translateY(0);
}

/* Primary: deep navy-charcoal instead of pure black. */
body.espo-site .espo-btn--primary {
  --espo-btn-bg: var(--espo-cta-navy);
  --espo-btn-bg-hover: var(--espo-cta-navy-hover);
  --espo-btn-color: #fff;
  --espo-btn-color-hover: #fff;
  --espo-btn-border: var(--espo-cta-navy);
  --espo-btn-border-hover: var(--espo-cta-navy-hover);
  --espo-btn-shadow: var(--espo-cta-shadow);
  --espo-btn-shadow-hover: var(--espo-cta-shadow-hover);
}

/* Dark is never black; it is a softer secondary navy. */
body.espo-site .espo-btn--dark {
  --espo-btn-bg: var(--espo-cta-navy-soft);
  --espo-btn-bg-hover: var(--espo-cta-navy-hover);
  --espo-btn-color: #fff;
  --espo-btn-color-hover: #fff;
  --espo-btn-border: var(--espo-cta-navy-soft);
  --espo-btn-border-hover: var(--espo-cta-navy-hover);
  --espo-btn-shadow: 0 9px 22px rgba(16,28,40,.09);
  --espo-btn-shadow-hover: var(--espo-cta-shadow-hover);
}

/* Secondary: ivory surface and an exact neutral border. */
body.espo-site .espo-btn--secondary {
  --espo-btn-bg: rgba(255,255,255,.72);
  --espo-btn-bg-hover: var(--espo-cta-ivory-hover);
  --espo-btn-color: var(--espo-cta-ink);
  --espo-btn-color-hover: var(--espo-cta-navy-hover);
  --espo-btn-border: var(--espo-cta-line);
  --espo-btn-border-hover: rgba(11,109,168,.40);
  --espo-btn-shadow: inset 0 1px 0 rgba(255,255,255,.82);
  --espo-btn-shadow-hover: 0 11px 26px rgba(16,28,40,.08);
  backdrop-filter: blur(8px);
}

/* Accent: champagne gold, reserved for campaign or partnership actions. */
body.espo-site .espo-btn--accent {
  --espo-btn-bg: var(--espo-cta-gold);
  --espo-btn-bg-hover: var(--espo-cta-gold-hover);
  --espo-btn-color: #201b0f;
  --espo-btn-color-hover: #17130b;
  --espo-btn-border: var(--espo-cta-gold);
  --espo-btn-border-hover: var(--espo-cta-gold-hover);
  --espo-btn-shadow: 0 9px 22px rgba(202,166,74,.12);
  --espo-btn-shadow-hover: 0 14px 30px rgba(202,166,74,.20);
}

/* Tertiary text action: editorial rather than button-like. */
body.espo-site .espo-btn--text {
  position: relative;
  min-height: 38px;
  padding: .55rem 0;
  border-radius: 0;
  --espo-btn-bg: transparent;
  --espo-btn-bg-hover: transparent;
  --espo-btn-color: var(--espo-cta-ink);
  --espo-btn-color-hover: var(--espo-cta-navy-hover);
  --espo-btn-border: transparent;
  --espo-btn-border-hover: transparent;
  --espo-btn-shadow: none;
  --espo-btn-shadow-hover: none;
}
body.espo-site .espo-btn--text::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: .35rem;
  height: 1px;
  background: linear-gradient(90deg, var(--espo-cta-gold), rgba(215,183,92,0));
  transform: scaleX(.34);
  transform-origin: left;
  opacity: .7;
  transition: transform .3s cubic-bezier(.22,1,.36,1), opacity .3s ease;
}
html[dir="rtl"] body.espo-site .espo-btn--text::after {
  background: linear-gradient(-90deg, var(--espo-cta-gold), rgba(215,183,92,0));
  transform-origin: right;
}
body.espo-site .espo-btn--text:hover::after,
body.espo-site .espo-btn--text:focus-visible::after {
  transform: scaleX(1);
  opacity: 1;
}
body.espo-site .espo-btn--text:hover,
body.espo-site .espo-btn--text:focus-visible {
  transform: none;
}

/* Homepage hero: one clear primary and one quiet secondary. */
body.home .espo-premium-hero__actions .espo-btn {
  min-height: 48px;
  border-radius: var(--espo-cta-radius) !important;
  padding-inline: 1.28rem;
}
body.home .espo-premium-hero__actions .espo-btn--primary {
  color: #fff !important;
  border-color: var(--espo-cta-navy) !important;
  background: var(--espo-cta-navy) !important;
  box-shadow: 0 12px 28px rgba(16,28,40,.13) !important;
}
body.home .espo-premium-hero__actions .espo-btn--primary:hover,
body.home .espo-premium-hero__actions .espo-btn--primary:focus-visible {
  border-color: var(--espo-cta-navy-hover) !important;
  background: var(--espo-cta-navy-hover) !important;
  box-shadow: var(--espo-cta-shadow-hover) !important;
}
body.home .espo-premium-hero__actions .espo-btn--dark {
  color: var(--espo-cta-ink) !important;
  border-color: rgba(19,33,48,.18) !important;
  background: rgba(255,255,255,.68) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85) !important;
  backdrop-filter: blur(8px);
}
body.home .espo-premium-hero__actions .espo-btn--dark:hover,
body.home .espo-premium-hero__actions .espo-btn--dark:focus-visible {
  color: var(--espo-cta-navy-hover) !important;
  border-color: rgba(11,109,168,.36) !important;
  background: #fff !important;
  box-shadow: 0 12px 28px rgba(16,28,40,.08) !important;
}

/* Standard light sections use the same secondary and editorial actions. */
body.home :is(
  .espo-cohesive-about,
  .espo-cohesive-work,
  .espo-sectors-section,
  .espo-home-insights
) .espo-btn--secondary {
  color: var(--espo-cta-ink) !important;
  border-color: rgba(19,33,48,.18) !important;
  background: rgba(255,255,255,.72) !important;
}
body.home :is(
  .espo-cohesive-about,
  .espo-cohesive-work,
  .espo-sectors-section,
  .espo-home-insights
) .espo-btn--secondary:hover,
body.home :is(
  .espo-cohesive-about,
  .espo-cohesive-work,
  .espo-sectors-section,
  .espo-home-insights
) .espo-btn--secondary:focus-visible {
  color: #fff !important;
  border-color: var(--espo-cta-navy-hover) !important;
  background: var(--espo-cta-navy-hover) !important;
  box-shadow: var(--espo-cta-shadow-hover) !important;
}
body.home .espo-cohesive-work__heading .espo-btn--text,
body.home .espo-home-insights .espo-btn--text {
  color: var(--espo-cta-ink) !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
body.home .espo-cohesive-work__heading .espo-btn--text:hover,
body.home .espo-cohesive-work__heading .espo-btn--text:focus-visible,
body.home .espo-home-insights .espo-btn--text:hover,
body.home .espo-home-insights .espo-btn--text:focus-visible {
  color: var(--espo-cta-navy-hover) !important;
  background: transparent !important;
}

/* OHEC keeps its campaign identity but follows the same hierarchy. */
body.home .espo-ohec-actions {
  gap: .65rem;
}
body.home .espo-ohec-actions .espo-btn {
  min-height: 46px;
  border-radius: var(--espo-cta-radius) !important;
  padding-inline: 1.12rem;
}
body.home .espo-ohec-actions .espo-btn--primary {
  color: #fff !important;
  border-color: var(--espo-cta-navy) !important;
  background: var(--espo-cta-navy) !important;
  box-shadow: 0 11px 26px rgba(16,28,40,.12) !important;
}
body.home .espo-ohec-actions .espo-btn--primary:hover,
body.home .espo-ohec-actions .espo-btn--primary:focus-visible {
  border-color: var(--espo-cta-navy-hover) !important;
  background: var(--espo-cta-navy-hover) !important;
  box-shadow: var(--espo-cta-shadow-hover) !important;
}
body.home .espo-ohec-actions .espo-btn--dark {
  color: var(--espo-cta-ink) !important;
  border-color: rgba(19,33,48,.14) !important;
  background: rgba(255,255,255,.86) !important;
  box-shadow: inset 0 1px 0 #fff, 0 8px 20px rgba(70,54,0,.06) !important;
}
body.home .espo-ohec-actions .espo-btn--dark:hover,
body.home .espo-ohec-actions .espo-btn--dark:focus-visible {
  color: #201b0f !important;
  border-color: rgba(202,166,74,.54) !important;
  background: #f7e4a1 !important;
  box-shadow: 0 12px 26px rgba(202,166,74,.16) !important;
}
body.home .espo-ohec-actions .espo-btn--secondary {
  color: var(--espo-cta-ink) !important;
  border-color: rgba(19,33,48,.24) !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.home .espo-ohec-actions .espo-btn--secondary:hover,
body.home .espo-ohec-actions .espo-btn--secondary:focus-visible {
  color: #fff !important;
  border-color: var(--espo-cta-navy) !important;
  background: var(--espo-cta-navy) !important;
  box-shadow: 0 11px 26px rgba(16,28,40,.12) !important;
}

/* Final dark CTA: same palette, reversed for contrast. */
.espo-home-cta-canonical .espo-final-cta__actions {
  gap: .62rem;
}
.espo-home-cta-canonical .espo-final-cta__actions .espo-btn {
  min-height: 46px;
  border-radius: var(--espo-cta-radius) !important;
  padding-inline: 1.16rem;
  font-size: .76rem;
}
.espo-home-cta-canonical .espo-final-cta__actions .espo-btn--primary {
  color: var(--espo-cta-navy) !important;
  border-color: var(--espo-cta-ivory) !important;
  background: var(--espo-cta-ivory) !important;
  box-shadow: 0 10px 25px rgba(0,0,0,.16) !important;
}
.espo-home-cta-canonical .espo-final-cta__actions .espo-btn--primary:hover,
.espo-home-cta-canonical .espo-final-cta__actions .espo-btn--primary:focus-visible {
  color: #fff !important;
  border-color: var(--espo-cta-navy-hover) !important;
  background: var(--espo-cta-navy-hover) !important;
  box-shadow: 0 15px 34px rgba(11,109,168,.25) !important;
}
.espo-home-cta-canonical .espo-final-cta__actions .espo-btn--accent {
  color: #e8cf79 !important;
  border-color: rgba(215,183,92,.52) !important;
  background: rgba(215,183,92,.035) !important;
  box-shadow: none !important;
}
.espo-home-cta-canonical .espo-final-cta__actions .espo-btn--accent:hover,
.espo-home-cta-canonical .espo-final-cta__actions .espo-btn--accent:focus-visible {
  color: #19150c !important;
  border-color: var(--espo-cta-gold) !important;
  background: var(--espo-cta-gold) !important;
  box-shadow: 0 14px 30px rgba(202,166,74,.18) !important;
}
.espo-home-cta-canonical .espo-final-cta__actions .espo-button-on-dark {
  color: rgba(255,255,255,.80) !important;
  border-color: rgba(255,255,255,.17) !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.espo-home-cta-canonical .espo-final-cta__actions .espo-button-on-dark:hover,
.espo-home-cta-canonical .espo-final-cta__actions .espo-button-on-dark:focus-visible {
  color: #fff !important;
  border-color: rgba(255,255,255,.34) !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.14) !important;
}

/* Form and archive CTAs inherit the primary system without becoming oversized. */
body.espo-site form .espo-btn--primary,
body.espo-site .espo-contact-form .espo-btn--primary,
body.espo-site .espo-project-archive .espo-btn--primary {
  border-radius: var(--espo-cta-radius);
}

/* Language-aware text rhythm, without changing the typography system. */
html:lang(fa) body.espo-site .espo-btn,
html:lang(ar) body.espo-site .espo-btn,
html:lang(tr) body.espo-site .espo-btn {
  letter-spacing: 0;
}
html:lang(fa) body.espo-site .espo-btn__content,
html:lang(ar) body.espo-site .espo-btn__content {
  line-height: 1.55;
}

@media (max-width: 767px) {
  body.espo-site .espo-btn {
    min-height: 45px;
    padding: .76rem 1rem;
    border-radius: 12px;
  }
  body.home .espo-premium-hero__actions .espo-btn,
  .espo-home-cta-canonical .espo-final-cta__actions .espo-btn {
    width: 100%;
    justify-content: center;
  }
  body.home .espo-ohec-actions .espo-btn {
    flex: 1 1 100%;
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.espo-site .espo-btn,
  body.espo-site .espo-btn::after,
  body.espo-site .espo-btn .espo-icon {
    transition: none !important;
    transform: none !important;
  }
}
