/*
Theme Name: Divi Child
Theme URI: https://ideaxconsultant.com
Author: ideaxconsultant
Author URI: https://ideaxconsultant.com
Description: A child theme for Divi, customized fonts and typography.
Template: Divi
Version: 1.0
Text Domain: divi-child
*/


/* ------------------------------------------------------------
   FIGTREE (BODY FONT) — ONLY 400
   ------------------------------------------------------------ */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/wp-content/uploads/fonts/figtree-v9-latin-regular.woff2') format('woff2');
}


/* ------------------------------------------------------------
   EB GARAMOND (HEADINGS/MENU) — ONLY 400 + 500
   ------------------------------------------------------------ */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/wp-content/uploads/fonts/eb-garamond-v32-latin-regular.woff2') format('woff2');
}

@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/wp-content/uploads/fonts/eb-garamond-v32-latin-500.woff2') format('woff2');
}

/* ============================================================
   APPLY FONTS
   ============================================================ */

/* HEADINGS / NAV — EB Garamond */
h1, h2, h3, h4, h5, h6,
.site-title,
.main-navigation a,
.header-menu a,
.elementor-heading-title,
span.highlight-text,
#top-menu-nav,
#top-menu-nav a {
  font-family: 'EB Garamond', serif !important;
}

/* BODY — Figtree */
html, body,
p, span,
input, textarea, select, button {
  font-family: 'Figtree', sans-serif !important;
}


/* ============================================================
   LOCK WEIGHTS + KILL ITALICS (PREVENT EXTRA FONT REQUESTS)
   ============================================================ */

/* Kill any italic usage (prevents eb-garamond italic from ever being requested) */
* {
  font-style: normal !important;
}

/* Body text weight */
body { 
  font-weight: 400 !important; 
}

/* Bold text — keep it at 500 (so it DOES NOT trigger Figtree 600/700 downloads) */
strong, b { 
  font-weight: 500 !important; 
}

/* Headings weight — match the loaded EB Garamond 500 */
h1, h2, h3, h4, h5, h6 { 
  font-weight: 500 !important; 
}

/* Menu weight — match the loaded EB Garamond 500 */
#top-menu-nav,
#top-menu-nav a {
  font-size: 20px !important;
  font-weight: 500 !important;
}


/* ============================================================
   FONT SIZES (OPTIONAL)
   ============================================================ */
h1 { font-size: 3vw; }

@media (max-width: 767px) {
  h1 { font-size: 4vw; }
}

@media (max-width: 480px) {
  h1 { font-size: 6vw; }
}

body, p { font-size: 16px; }

.contact-link, .small-text { font-size: 13px; }

button, .button { font-size: 18px; }


.jobs-section {
  background: #fff;
  padding: 40px 20px;
  max-width: 915px;
  margin: 0 auto;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
  font-family: 'Figtree', sans-serif !important;
  color: #111;
  text-align: center;
}

.jobs-header h2 {
  font-size: 40px;
  font-family: 'EB Garamond', serif !important;
  color: #0E2152;
  margin-bottom: 10px;
  font-weight: 600 !important;
}

.jobs-header p {
  font-size: 16px;
  color: #333;
  margin: 0 auto 40px;
  max-width: 650px;
  line-height: 28.8px;
}

.jobs-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 auto;
  table-layout: fixed; /* ensures even column width */
}

table.jobs-table tbody > tr:nth-child(odd) > td,
table.jobs-table tbody > tr:nth-child(odd) > th {
  background-color: hsla(0, 0%, 50.2%, 0.0705882353);
}

table.jobs-table td,
table.jobs-table th {
  padding: 15px !important;
  line-height: 1.5 !important;
  vertical-align: top !important;
  border: 1px solid hsla(0, 0%, 50.2%, 0.5019607843) !important;
}

.jobs-table td {
  border: 2px solid #ddd;
  padding: 14px 20px;
  text-align: left;
  background: #fafafa;
  font-size: 21.6px;
  line-height: 32.4px;
  vertical-align: middle;
  font-family: 'Roboto' !important;

  /* New changes for wrapping long text */
  word-break: break-word;
  white-space: normal;
  hyphens: auto;
}

.jobs-table tr:nth-child(even) td {
  background: #fefefe;
}

@media (max-width: 768px) {
  .jobs-section {
    padding: 30px 20px;
  }
  
  .jobs-header h2 {
    font-size: 32px;
  }
  
  .jobs-header p {
    font-size: 16px;
    margin-bottom: 30px;
  }
  
  .jobs-table td {
    font-size: 18px;
    padding: 10px 14px;
    line-height: 28px;
    word-break: break-word;
    white-space: normal;
    hyphens: auto;
  }

  .jobs-table th {
    font-size: 19px;
    padding: 10px 14px;
    line-height: 30px;
  }
}

/* ==============================
   HEADER MENU STYLES
   ============================== */

/* ==============================
   DESKTOP HEADER
   ============================== */
.container.clearfix.et_menu_container {
  max-width: 1525px !important;
}

/* Force blue header on all pages */
header.et-fixed-header {
  background-color: rgb(14, 33, 82) !important;
}

nav#top-menu-nav ul li a {
  font-weight: 400 !important;
}

nav#top-menu-nav ul li a:hover {
  text-decoration: underline !important;
  text-underline-offset: 10px;
  font-weight: 400 !important;
}

/* ==============================
   FORCE BLUE HEADER ON POST PAGES
   ============================== */
body.single-post header#main-header,
body.single-post header.et-fixed-header {
  background-color: rgb(14, 33, 82) !important; /* Always blue */
}

/* Remove transparency on scroll */
body.single-post header#main-header.scrolled {
  background-color: rgb(14, 33, 82) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

/* ==============================
   MOBILE HEADER STYLES
   ============================== */
@media (max-width: 980px) {
  /* Sticky header */
  header#main-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 99999;
    background-color: rgb(14, 33, 82) !important;
    transition: background-color 0.4s ease, box-shadow 0.4s ease;
    margin: 0 !important;
  }

  /* Header when scrolled */
  header#main-header.scrolled {
    background-color: rgb(14, 33, 82) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  }


  /* White hamburger icon */
  #et-top-navigation .mobile_menu_bar:before,
  .mobile_menu_bar::before {
    color: #ffffff !important;
  }

  /* Opened mobile menu background */
  .et_mobile_menu {
    background-color: #ffffff !important;
    position: absolute !important;
    top: 80px !important; /* Ensures menu appears below header */
    left: 0;
    right: 0;
    width: 100%;
    z-index: 99998;
  }

  /* Menu link styles */
  .et_mobile_menu li a {
    color: #0e2152 !important;
  }

  .et_mobile_menu li a:hover {
    color: #0e2152 !important;
    text-decoration: underline;
  }

  /* Force blue header on mobile post pages */
  body.single-post header#main-header {
    background-color: rgb(14, 33, 82) !important;
  }
}

/* ===================================
   Fill a Form – Base Styles
=================================== */

/* Labels */
.fill-a-form form label {
  font-family: "Roboto" !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 35px !important;
  color: #000000 !important;
  padding-bottom: 20px !important;
}

/* Form Row Spacing */
.fill-a-form form p {
  padding-bottom: 2em !important;
}

/* Input + Textarea */
.fill-a-form input,
.fill-a-form textarea {
  background-color: #fff !important;
  border-color: #C3C3C3 !important;
  border-width: 0 0 1px 0 !important;
  border-radius: 0 !important;
  font-family: "Roboto" !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  border-bottom: 1px solid #C3C3C3 !important;
  padding: .5rem 1rem !important;
  width: 70% !important;           /* Desktop width */
  max-width: 100% !important;      /* Prevent overflow */
  box-sizing: border-box !important;
}

/* Submit Button Hover */
.fill-a-form input.wpcf7-form-control.wpcf7-submit.has-spinner:hover {
  background-color: #AB7511 !important;
  color: #fff !important;
  font-family: "Roboto" !important;
  font-weight: 500 !important;
  text-transform: none !important;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .5) !important;
  padding: 12px 24px !important;
}

/* Submit Button Default */
.fill-a-form input.wpcf7-form-control.wpcf7-submit.has-spinner {
  background-color: #0E2152 !important;
  color: #fff !important;
  font-family: "Roboto" !important;
  font-weight: 500 !important;
  text-transform: none !important;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .5) !important;
  padding: 12px 24px !important;
}

/* Checkbox */
.fill-a-form input[type="checkbox"] {
  width: unset !important;
}

.fill-a-form .wpcf7-list-item {
  display: block !important;
  margin-bottom: 10px !important;
}

span.wpcf7-list-item-label {
  font-family: "Roboto" !important;
  font-weight: 500 !important;
  color: #000000 !important;
  font-size: 16px !important;
}

/* ===================================
   ✅ Mobile Responsive Fix
=================================== */
@media (max-width: 768px) {
  .fill-a-form input,
  .fill-a-form textarea {
    width: 100% !important;    /* Full width on mobile */
    padding: .75rem 1rem !important;
  }

  .fill-a-form form label {
    font-size: 16px !important;
    line-height: 28px !important;
    padding-bottom: 10px !important;
  }

  .fill-a-form form p {
    padding-bottom: 1.5em !important;
  }

  .fill-a-form input.wpcf7-form-control.wpcf7-submit.has-spinner {
    width: 100% !important;   /* Full-width submit button on mobile */
    text-align: center !important;
  }
}


.hero-text-container{text-align:center;padding:20px}.hero-heading{font-family:'EB Garamond',serif;color:#fff;font-weight:300;text-shadow:0 3px 6px rgba(0,0,0,.29);text-transform:uppercase;font-size:3vw;line-height:1.2;display:inline-block;margin:0;white-space:nowrap}.highlight-text{color:#edbf69;font-family:'baskerville-display-pt',serif;font-style:italic}@media(max-width:767px){.hero-heading{font-size:4vw;display:block;white-space:normal;word-break:break-word;overflow-wrap:break-word;text-align:center}}@media(max-width:480px){.hero-heading{font-size:7vw;text-align:center}}
/* --- MARQUEE CONTAINER --- */
.marquee-container {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  background: transparent; /* You can change this */
  position: relative;
}

/* --- MOVING TEXT (ALL DEVICES) --- */
.marquee-wrapper {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.marquee-content {
  display: inline-block;
  white-space: nowrap;
  animation: marquee 15s linear infinite;
}

.marquee-content span {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #ffffff;
  text-transform: uppercase;
}

/* --- KEYFRAMES FOR SMOOTH MOVEMENT --- */
@keyframes marquee {
  0%   { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

/* --- MOBILE FIX --- */
@media (max-width: 768px) {
  .marquee-content {
    animation: marquee 12s linear infinite; /* slightly faster for small screens */
  }

  .marquee-content span {
    font-size: 16px; /* optional smaller mobile text */
  }
}


/* 1 logo ≈ 160px (100px + 60px margin)
   2 logos = 320px
*/

/* --- INFINITE LOOP WITH PAUSE EVERY 2 LOGOS --- */
@keyframes infinite-pause {
  0%   { transform: translateX(0); }
  10%  { transform: translateX(0); }                /* pause */

  20%  { transform: translateX(-320px); }           /* 2 logos */
  30%  { transform: translateX(-320px); }

  40%  { transform: translateX(-640px); }           /* 4 logos */
  50%  { transform: translateX(-640px); }

  60%  { transform: translateX(-960px); }           /* 6 logos */
  70%  { transform: translateX(-960px); }

  80%  { transform: translateX(-1280px); }          /* 8 logos */
  90%  { transform: translateX(-1280px); }

  /* ✅ Instead of resetting, finish exactly halfway
     (the duplicated row takes over seamlessly) */
  100% { transform: translateX(-1600px); }           /* full original row width */
}

body {
  margin: 0;
  background: #fff;
  font-family: sans-serif;
}

.logos {
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  background: #fff;
  padding: 20px 0;
}
.logos-row + .logos-row {
  margin-top: 60px; /* adjust size as you like */
}

.logos-row {
  display: flex;
  width: max-content;
  animation: infinite-pause 16s ease-in-out infinite;
}

.logos-row img {
  height: 100px;
  margin: 0 30px;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.logos-row img:hover {
  transform: scale(1.08);
}

@media (max-width: 768px) {
  .logos-row img {
    height: 80px;
    margin: 0 15px;
  }
}

/* end of banner effect */

.fill-form-box {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0E2152; 
  text-decoration: none;
  padding: 8px;
  border-radius: 5px;
  transition: all 0.3s ease;
}

/* Hover effect */
.fill-form-box:hover {
  background: #B38328; /* Change to match your Divi accent color */
  transform: translateY(-3px);
}

/* Inner content */
.fill-form-content {
  text-align: center;
}

/* Text styling */
.fill-form-title {
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
  margin: 0;
}

/* Hover text color */
.fill-form-box:hover .fill-form-title {
  color: #fff;
}

/* If MediaElement.js is used, hide its entire control bar UI */
.mejs__controls,
.mejs-controls,
.mejs__overlay-button,
.mejs-overlay-button,
.mejs__captions-button,
.mejs__fullscreen-button,
.mejs__time,
.mejs__time-rail,
.mejs__volume,
.mejs__button {
  display: none !important;
}

/* Prevent click-to-pause overlays from getting in the way */
.mejs__overlay,
.mejs-overlay {
  pointer-events: none !important;
}

/* Optional: also ensure native controls never show */
video::-webkit-media-controls { display:none !important; }


