/* ---------------------------------------------------------------------------
   Static-build fixes for ibuild-design.com
   ---------------------------------------------------------------------------
   WHY THIS FILE EXISTS

   Divi gives "entrance animation" elements the class .et_animated and hides them
   with:

       .et_animated { opacity: 0; animation-fill-mode: both !important; }

   They are meant to be revealed by Divi's JavaScript as you scroll. In this
   static build that never happens:

     * the LiteSpeed plugin marks every script type="litespeed/javascript" and
       only activates them after the visitor moves the mouse / scrolls;
     * by the time jQuery and Divi's code finally load, the moment when Divi
       sets up its scroll-reveal has already passed;
     * so the elements keep opacity: 0 forever and the text never appears.

   Measured: after simulating mouse move + scroll + keypress, jQuery loads and
   all deferred scripts activate, but the hero elements are still opacity 0.

   THE FIX (deliberate trade-off)

   Render those elements visible immediately and drop the fade-in animation.
   We lose a decorative effect; we gain content that is guaranteed to show even
   with JavaScript disabled, blocked, slow, or broken. For a brochure site whose
   hero carries the headline and main call-to-action, always-visible wins.

   The selector is intentionally more specific than Divi's (html body .et_animated)
   so it wins no matter what order the stylesheets happen to load in.
   --------------------------------------------------------------------------- */

html body .et_animated,
html body .et_had_animation,
html body .et-waypoint {
  opacity: 1 !important;
  -webkit-animation: none !important;
          animation: none !important;
  visibility: visible !important;
  -webkit-transform: none !important;
          transform: none !important;
}

/* ---------------------------------------------------------------------------
   FORM FIELD LEGIBILITY - "Ask a question" form on the category pages
   ---------------------------------------------------------------------------
   Divi styles these fields with light grey text (#999) on a light grey box
   (#eee). That is a contrast ratio of about 2.4:1, well under the 4.5:1 normally
   considered the minimum for readable text - so what a visitor types is hard to
   read as they type it.

   Oddly the PLACEHOLDER (#757575) was DARKER than the text typed over it, which
   is backwards: the hint was easier to read than the real answer.

   This is inherited Divi styling, NOT something the migration introduced - the
   live WordPress site renders these fields exactly the same way. Fixing it here
   is a deliberate improvement on the original, not a repair.

   Typed text becomes #333 (about 10.7:1 on the grey box - very readable) while
   the placeholder stays lighter at #757575, so the "hint vs what I typed"
   distinction is preserved and is now the right way round.

   -webkit-text-fill-color is set as well because Chrome's autofill overrides
   plain `color` on form fields.

   The lead form (WPForms) is deliberately NOT touched: its fields already use
   rgba(0,0,0,0.7) on white, roughly 8.9:1, which is comfortably readable.
   --------------------------------------------------------------------------- */

html body .et_pb_contact_form input[type="text"],
html body .et_pb_contact_form input[type="email"],
html body .et_pb_contact_form input[type="tel"],
html body .et_pb_contact_form input.input,
html body .et_pb_contact_form textarea,
html body .et_pb_contact_form textarea.et_pb_contact_message {
  color: #333 !important;
  -webkit-text-fill-color: #333 !important;
}

html body .et_pb_contact_form input::placeholder,
html body .et_pb_contact_form textarea::placeholder {
  color: #757575 !important;
  -webkit-text-fill-color: #757575 !important;
  opacity: 1 !important;
}

/* older WebKit needs the prefixed pseudo-element spelled out separately */
html body .et_pb_contact_form input::-webkit-input-placeholder,
html body .et_pb_contact_form textarea::-webkit-input-placeholder {
  color: #757575 !important;
  -webkit-text-fill-color: #757575 !important;
  opacity: 1 !important;
}