/* ============================================================================
   EcoChisto — enhancement layer  (enhance.css)
   Loaded AFTER allinone.css. Additive only: no markup, no SEO text touched.
   Purpose: align UI to the brand's GREEN logo (was stock Bootstrap blue),
   modernise depth/typography/hover, and neutralise the page loader.
   Brand green sampled from logo: emerald #078A52 + leaf #4EB053.
   Accessible primary #0a8149 (~4.9:1 white text, AA).
   Author: Builder-ecochisto-facelift, 2026-07-15
   ========================================================================== */

/* ---- 1. Brand tokens: recolour Bootstrap primary blue -> eco green -------- */
:root{
  --bs-primary:#0a8149;
  --bs-primary-rgb:10,129,73;
  --bs-primary-bg-subtle:#e4f4ea;
  --bs-primary-border-subtle:#bfe3cd;
  --bs-primary-text-emphasis:#075f37;
  --bs-link-color:#0a7a43;
  --bs-link-color-rgb:10,122,67;
  --bs-link-hover-color:#075f37;
  --bs-link-hover-color-rgb:7,95,55;

  /* local palette */
  --eco:#0a8149;
  --eco-strong:#097040;
  --eco-dark:#075f37;
  --eco-leaf:#28a15a;
  --eco-subtle:#e4f4ea;
  --eco-border:#bfe3cd;
  --ink:#14251c;
  --muted:#586a60;
  --card-border:#e6efe9;
  --card-shadow:0 .5rem 1.5rem rgba(16,64,40,.06);
  --card-shadow-hover:0 1rem 2.25rem rgba(16,64,40,.13);
}

/* ---- 2. Buttons: primary + outline-primary go green ----------------------- */
.btn-primary{
  --bs-btn-bg:#0a8149;--bs-btn-border-color:#0a8149;
  --bs-btn-hover-bg:#097040;--bs-btn-hover-border-color:#097040;
  --bs-btn-active-bg:#075f37;--bs-btn-active-border-color:#075f37;
  --bs-btn-disabled-bg:#0a8149;--bs-btn-disabled-border-color:#0a8149;
  --bs-btn-focus-shadow-rgb:10,129,73;
}
.btn-outline-primary{
  --bs-btn-color:#097040;--bs-btn-border-color:#0a8149;
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0a8149;--bs-btn-hover-border-color:#0a8149;
  --bs-btn-active-color:#fff;--bs-btn-active-bg:#0a8149;--bs-btn-active-border-color:#0a8149;
  --bs-btn-focus-shadow-rgb:10,129,73;
}

/* button feel: gentle lift + shadow, crisp focus, honest active press */
.btn{transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease, border-color .16s ease;}
.btn-primary:hover{box-shadow:0 .5rem 1.1rem rgba(10,129,73,.28);transform:translateY(-1px);}
.btn-primary:active{transform:translateY(0);}
.btn-outline-primary:hover,.btn-outline-dark:hover{transform:translateY(-1px);}
.btn-lg{--bs-btn-padding-y:.7rem;--bs-btn-padding-x:1.5rem;font-weight:500;}
.btn:focus-visible{outline:3px solid rgba(10,129,73,.40);outline-offset:2px;box-shadow:none!important;}
/* the WhatsApp CTA reads better with WhatsApp-green weighting on hover accent */
.fab-wa{background:#1eae5a;}

/* ---- 3. Primary panels (.bg-primary): flat blue -> rich green gradient ----- */
.bg-primary{
  background-color:#0a8149!important;
  background-image:linear-gradient(135deg,#12a15c 0%,#0a7a43 60%,#097a44 100%)!important;
}

/* ---- 4. Typography: firmer headings, warmer ink, comfortable body ---------- */
body{color:#54635b;}
h1,.h1,h2,.h2,h3,.h3,h4,.h4,.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{
  color:var(--ink);letter-spacing:-.015em;line-height:1.14;
}
.display-5,.display-6{line-height:1.08;}
.text-dark{color:var(--ink)!important;}
.text-secondary{color:#5f6f66!important;}
.lead,.fs-5{line-height:1.6;}
::selection{background:rgba(10,129,73,.18);}

/* ---- 5. Cards: softer borders, layered shadow, hover elevation ------------- */
.shadow-sm{box-shadow:var(--card-shadow)!important;}
.border{border-color:var(--card-border)!important;}
.rounded-5{border-radius:1.5rem!important;}
/* elevate content cards on hover (bordered white/light rounded cards) */
.rounded-5.border.bg-white,
.rounded-5.border.bg-light,
.whyus-card{
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.rounded-5.border.bg-white:hover,
.whyus-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--card-shadow-hover)!important;
  border-color:var(--eco-border)!important;
}
/* eco-tint the "why us" icon chips + subtle callouts */
.bg-primary-subtle{background-color:var(--eco-subtle)!important;}
.text-primary{color:#0a7a43!important;}

/* section header kicker rhythm */
section{scroll-margin-top:92px;}
#mosthead{
  background:
    radial-gradient(1100px 420px at 82% -12%, rgba(40,161,90,.16), transparent 60%),
    radial-gradient(900px 400px at -10% 120%, rgba(10,129,73,.08), transparent 55%);
}

/* ---- 6. Hero image caption: guarantee legible overlay --------------------- */
#mosthead .position-relative.overflow-hidden .position-absolute{background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(4,40,22,.62) 100%)!important;}

/* ---- 7. Navbar: cleaner shrink + green link affordance -------------------- */
.navbar.shrink{box-shadow:0 .35rem 1.4rem rgba(16,64,40,.10)!important;}
.nav-link{transition:color .2s ease,border-color .2s ease;}
.nav-link:hover,.nav-link:focus{color:var(--eco)!important;border-bottom-color:var(--eco)!important;}

/* ---- 8. Splide slider controls (partners / reviews) ----------------------- */
.splide__arrow{background:#fff!important;border:1px solid var(--card-border)!important;box-shadow:var(--card-shadow)!important;opacity:1!important;transition:transform .18s ease,box-shadow .18s ease;}
.splide__arrow:hover{transform:scale(1.06);box-shadow:var(--card-shadow-hover)!important;}
.splide__arrow svg{fill:var(--eco)!important;height:1.05em;width:1.05em;}
.splide__pagination__page.is-active{background:var(--eco)!important;}

/* ---- 9. Accordion (FAQ): green active state ------------------------------- */
.accordion{--bs-accordion-btn-focus-box-shadow:0 0 0 .25rem rgba(10,129,73,.18);--bs-accordion-active-color:#075f37;--bs-accordion-active-bg:#eef8f1;}
.accordion-button:not(.collapsed){color:var(--eco-dark)!important;background-color:#eef8f1!important;box-shadow:inset 0 -1px 0 var(--card-border);}
.accordion-button:not(.collapsed)::after{filter:hue-rotate(85deg) saturate(1.4);}

/* ---- 10. Forms: green focus ring, tidy inputs ----------------------------- */
.form-control:focus,.form-select:focus{border-color:#7fc79c;box-shadow:0 0 0 .25rem rgba(10,129,73,.15);}
.form-control{border-color:#dfe8e2;}

/* ---- 11. Badges: keep light chips subtle, primary chips green ------------- */
.badge.text-bg-light{background-color:#eef3f0!important;color:#41514a!important;border-color:var(--card-border)!important;}

/* ---- 12. Links inside content: green hover ------------------------------- */
a.text-dark:hover,a.text-decoration-none:hover{color:var(--eco-strong)!important;}
a{transition:color .18s ease;}

/* ---- 13. Loader safety net (removed at source; hide if ever cached) ------- */
#rexlama-loader{display:none!important;}

/* ---- 14. Overflow guard @ 390 (no element may exceed the viewport) -------- */
@media (max-width:575.98px){
  img,svg{max-width:100%;height:auto;}
  h1,.h1,.display-4,.display-5,.display-6{overflow-wrap:break-word;word-break:normal;}
  /* wide data tables (Aktobe pricing) scroll INSIDE their wrapper, never clip text */
  .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;}
}

/* ---- 15. Reduced motion: respect user preference ------------------------- */
@media (prefers-reduced-motion:reduce){
  .btn,.nav-link,.rounded-5.border.bg-white,.whyus-card,.splide__arrow,a{transition:none!important;}
  .rounded-5.border.bg-white:hover,.whyus-card:hover,.btn-primary:hover{transform:none!important;}
}

/* ---- 16. Visual-QA remediation (2026-07-15) ------------------------------ */
/* P1 (blocker): headings inside SOLID-green panels must stay white. The panel sets
   text-white/-light on its body copy; the global heading-ink rule (sect. 4) was
   darkening only the heading, leaving a dark-title / white-body mismatch on the
   callback + quick-contacts conversion panels. Force light headings back. */
.bg-primary h1, .bg-primary h2, .bg-primary h3, .bg-primary h4,
.bg-primary .h1, .bg-primary .h2, .bg-primary .h3, .bg-primary .h4 { color:#fff !important; font-weight:700 !important; }

/* P4: match the Aktobe hero H1 weight to the home hero (allinone.css pins h1 to 400). */
#mosthead h1, .header-text { font-weight:700 !important; }

/* P3: calm the Aktobe FAQ — solid deep-green pills -> soft light-green w/ dark-green text
   (home FAQ uses bg-white and is unaffected). */
.accordion-button.bg-primary{ background-color:#eef8f1 !important; background-image:none !important; color:#0a6b3d !important; }
.accordion-button.bg-primary:not(.collapsed){ background-color:#dcefe4 !important; color:#075f37 !important; }
.accordion-button.bg-primary:focus{ box-shadow:0 0 0 .25rem rgba(10,129,73,.18) !important; }
