/* polish.css — a light, additive "professional finish" layer for the public
   marketing pages. Purely cosmetic: smoother typography, refined buttons, card
   elevation/hover, animated nav + footer links, and brand-green focus states.
   Intentionally conservative — no layout/structure changes, so it can't break
   the existing template. Brand green = #25d06f, ink = #0a3041. */

/* ── 1. Typography & rendering ─────────────────────────────────────────── */
html { scroll-behavior: smooth; }
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, .section-title, .section-title h2 {
  letter-spacing: -0.015em;
}
p { letter-spacing: .1px; }

::selection      { background: #25d06f; color: #fff; }
::-moz-selection { background: #25d06f; color: #fff; }

/* ── 2. Section-title accent ───────────────────────────────────────────── */
.section-title { position: relative; }
.section-title h2::after {
  content: "";
  display: block;
  width: 56px;
  height: 3px;
  margin: 14px auto 0;
  border-radius: 3px;
  background: linear-gradient(90deg, #25d06f, #19a458);
}
.section-title.text-left h2::after,
.section-title[style*="left"] h2::after { margin-left: 0; margin-right: auto; }

/* ── 3. Buttons — consistent radius, smooth hover lift, soft shadow ─────── */
.boxed-btn, .hero-boxed-btn, .hero-boxed-btn-s, .get-btn,
.intro-btn, .btn, .btn--primary, .contact-btn {
  transition: transform .25s ease, box-shadow .25s ease,
              background-color .25s ease, color .25s ease, border-color .25s ease !important;
  will-change: transform;
}
.boxed-btn:hover, .hero-boxed-btn:hover, .hero-boxed-btn-s:hover, .get-btn:hover,
.intro-btn:hover, .btn--primary:hover, .btn-success:hover, .contact-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(37, 208, 111, .28);
}
.btn-success {
  background-color: #25d06f !important;
  border-color: #25d06f !important;
}
.btn-success:hover { background-color: #1fb763 !important; border-color: #1fb763 !important; }
.btn-outline-success { transition: all .25s ease !important; }
.btn-outline-success:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(37, 208, 111, .22);
}
.btn:focus, .boxed-btn:focus, .hero-boxed-btn:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 208, 111, .35) !important;
}

/* ── 4. Feature / approach cards — elevation + hover lift ───────────────── */
.wt-icon-box-wraper, .single-hero-feature, .single-approach, .single-service,
.card, .pricing-box, .team-box {
  transition: transform .3s ease, box-shadow .3s ease !important;
}
.wt-icon-box-wraper:hover, .single-hero-feature:hover, .single-approach:hover,
.single-service:hover, .pricing-box:hover, .team-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(10, 18, 40, .14) !important;
}
.wt-icon-box-wraper.bg-white { border-radius: 12px; }

/* gentle zoom on card/feature imagery */
.single-hero-feature img, .wt-icon-box-wraper img, .single-service img {
  transition: transform .4s ease;
}
.single-hero-feature:hover img, .wt-icon-box-wraper:hover img,
.single-service:hover img { transform: scale(1.06); }

/* ── 5. Navigation — animated underline on hover ───────────────────────── */
.main-menu > li > a, .header-navbar a, nav#block-mainnavigation a {
  position: relative;
  transition: color .25s ease;
}
.main-menu > li > a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -4px;
  width: 0; height: 2px;
  background: #25d06f;
  border-radius: 2px;
  transition: width .28s ease;
}
.main-menu > li > a:hover::after,
.main-menu > li.active > a::after { width: 100%; }
.main-menu > li > a:hover { color: #25d06f; }

/* ── 6. Footer — link hover slide + colour ─────────────────────────────── */
.footer-area a, .footer-widget a, footer a {
  transition: color .22s ease, padding-left .22s ease;
}
.footer-area a:hover, .footer-widget a:hover {
  color: #25d06f !important;
  padding-left: 5px;
}

/* ── 7. Forms — brand-green focus ring for a premium feel ───────────────── */
input:focus, textarea:focus, select:focus, .form-control:focus {
  outline: none !important;
  border-color: #25d06f !important;
  box-shadow: 0 0 0 3px rgba(37, 208, 111, .18) !important;
}

/* ── 8. Images & media — softened corners where it reads well ───────────── */
.hero-feature-img img, .about-img img, .approach-img img { border-radius: 12px; }

/* ── 9. Subtle entrance for the sticky header ──────────────────────────── */
.header-navbar { transition: box-shadow .3s ease, background-color .3s ease; }
