/*
Theme Name: Divi Child
Description: Child theme of Divi
Template: Divi
Version: 1.0.0
*/

/* Import parent theme styles */
@import url("../Divi/style.css");

/* Custom styles for child theme */
body {
    /* Add your custom styles here */
}

/* ========================================
   MOBILE MENU STYLES
======================================== */

.et_mobile_menu {
    border-radius: 15px;
}

@media (max-width: 768px) {
    .et_mobile_menu {
        width: 80vw!important;
    }
}
.et_mobile_menu ul li {
    padding-left: 0!important;
}
/* Apply the border to all links in the mobile menu */
.et_mobile_menu a {
    border-top: 1px dashed #707070 !important;
}


/* Base (Mobile First) */
.sub-menu li a {
    position: relative;
    padding-left: 50px !important;
}

.sub-menu li a::before {
    content: "\251C";
    position: absolute;
    left: 20px;
    /* aligns within the 50px padding */
    color: #f16b2d;
}

/* Desktop Enhancements */
@media (min-width: 981px) {

    .sub-menu,
    .sub-menu li {
        min-width: 350px;
    }

    .sub-menu {
        border-radius: 15px;
    }

    .sub-menu li a {
        padding: 10px 0 !important;
        min-width: 100%;
        border-top: 1px dashed #707070 !important;
    }

    /* Remove mobile tree marker on desktop */
    .sub-menu li a::before {
        content: none;
    }
}


.mobile_nav.opened .mobile_menu_bar::before {
    content: "X";
}


/* =================================================
   FIX: DIVI FIXED HEADER MENU HOVER JUMP
================================================= */

.et_pb_row_0_tb_header.et_pb_row.et_flex_row.et_pb_row--with-menu:hover {
    padding-top: 15px !important;
}
/* ========================================
   FOOTER MENU STYLES
======================================== */
#menu-footer-menu{
    display: flex;
    flex-direction: column;
}


/* ========================================
   HEADING DECORATIONS
======================================== */
h2 {
    position: relative;
}
/* Left-Aligned H2 Styling */
h2::before {
    content: "";
    position: absolute;
    top: -25px;
    left: 0;
    width: 80px;
    height: 15px;
    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='120' height='12' viewBox='0 0 120 12'>\
  <defs>\
    <pattern id='hatch' width='5' height='5' patternUnits='userSpaceOnUse' patternTransform='rotate(45)'>\
      <line x1='0' y1='0' x2='0' y2='5' stroke='%23F16B2D' stroke-width='2'/>\
    </pattern>\
  </defs>\
  <rect x='2' y='2' width='116' height='8' rx='2' ry='2' fill='none' stroke='%23F16B2D' stroke-width='3'/>\
  <rect x='2' y='2' width='116' height='8' fill='url(%23hatch)'/>\
</svg>");
    background-repeat: no-repeat;
    background-size: contain;
}


/* Centered H2 Styling */

.heading-centered h2::before {
    content: "";
    position: absolute;
    top: -25px;
    left: calc(50% - 40px);
    width: 80px;
    height: 15px;
    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='120' height='12' viewBox='0 0 120 12'>\
  <defs>\
    <pattern id='hatch' width='5' height='5' patternUnits='userSpaceOnUse' patternTransform='rotate(45)'>\
      <line x1='0' y1='0' x2='0' y2='5' stroke='%23F16B2D' stroke-width='3'/>\
    </pattern>\
  </defs>\
  <rect x='2' y='2' width='116' height='8' rx='2' ry='2' fill='none' stroke='%23F16B2D' stroke-width='3'/>\
  <rect x='2' y='2' width='116' height='8' fill='url(%23hatch)'/>\
</svg>");
    background-repeat: no-repeat;
    background-size: contain;
}

/* ========================================
   CUSTOM HERO SECTION STYLING
======================================== */
.hero_section {
    /* position: relative; */
    /* Required to contain the absolute pseudo-element */
       overflow: hidden;
    /* Ensures the overlay doesn't spill out */
}

/* The Overlay */
.hero_section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.55);
    /* 50% Black Overlay */
    z-index: 1;
    /* Sits above the background image */
}




/* ========================================
   CUSTOM LIST STYLING
======================================== */
ul li {
    list-style: none;
    margin-bottom: 0.5em;
    padding-left: 2em;
    position: relative;
}

/* Add custom SVG marker using ::before pseudo-element */
.text-list {padding-left: 0!important;}

.text-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.2em;
    width: 1.2em;
    height: 1.2em;
    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 48 48'>\
  <!-- Circle -->\
  <circle cx='24' cy='24' r='18' fill='none' stroke='%23F58220' stroke-width='5'/>\
  \
  <!-- Vertical crosshair: top segment -->\
  <line x1='24' y1='0' x2='24' y2='20' stroke='%23F58220' stroke-width='5'/>\
  <!-- Vertical crosshair: bottom segment -->\
  <line x1='24' y1='28' x2='24' y2='48' stroke='%23F58220' stroke-width='5'/>\
  \
  <!-- Horizontal crosshair: left segment -->\
  <line x1='0' y1='24' x2='20' y2='24' stroke='%23F58220' stroke-width='5'/>\
  <!-- Horizontal crosshair: right segment -->\
  <line x1='28' y1='24' x2='48' y2='24' stroke='%23F58220' stroke-width='5'/>\
</svg>");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ========================================
   FORM STYLES
======================================== */
/* Text Inputs, Textareas, and Dropdowns */
input:focus,
textarea:focus,
select:focus {
    border: 3px solid #f58220 !important;
    outline-offset: 3px;
    -webkit-box-shadow: 0px 10px 13px -7px #a5a5a5, 5px 5px 15px 5px rgba(0, 0, 0, 0)!important;
        box-shadow: 0px 10px 13px -7px #a5a5a5, 5px 5px 15px 5px rgba(0, 0, 0, 0)!important;
}

/* Checkboxes and Radio Buttons (Focus State) */
input[type="checkbox"]:focus,
input[type="radio"]:focus {
    outline: 2px solid #f58220 !important;
    outline-offset: 2px;
}

/* Checkboxes and Radio Buttons (Active/Checked State) */
input[type="checkbox"],
input[type="radio"] {
    accent-color: #f58220;
}

/* ========================================
   BACKGROUND PATTERNS
======================================== */
/* Crosshatched gray background */
.bkg-crosshatch-grey {
    background-color: #efefef;
    background-image: repeating-linear-gradient(-45deg,
            rgba(0, 0, 0, 0.04) 0,
            rgba(0, 0, 0, 0.04) 3px,
            transparent 3px,
            transparent 10px);
}
/* engineering symbol pattern background */

.bkg-engineering-symbols {
    /* background-color: #efefef; */
    /* Updated viewBox to 2000x2000 for perfect 200px cell increments */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 2000 2000'%3E%3Cdefs%3E%3Csymbol id='s1' viewBox='0 0 100 100'%3E%3Cline x1='20' y1='50' x2='80' y2='50' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s2' viewBox='0 0 100 100'%3E%3Cpath d='M30 70 L80 70 L70 30 L20 30 Z' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s3' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='30' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s4' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='22' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3Cline x1='30' y1='75' x2='50' y2='25' stroke='%23efefef' stroke-width='4' /%3E%3Cline x1='50' y1='75' x2='70' y2='25' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s5' viewBox='0 0 100 100'%3E%3Cpath d='M20 60 A 30 30 0 0 1 80 60' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s6' viewBox='0 0 100 100'%3E%3Cpath d='M20 60 A 30 30 0 0 1 80 60 Z' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s7' viewBox='0 0 100 100'%3E%3Cpath d='M20 70 L80 70 M20 70 L65 30' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s8' viewBox='0 0 100 100'%3E%3Cpath d='M20 80 L80 80 M50 80 L50 20' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s9' viewBox='0 0 100 100'%3E%3Cline x1='35' y1='80' x2='55' y2='20' stroke='%23efefef' stroke-width='4' /%3E%3Cline x1='50' y1='80' x2='70' y2='20' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s10' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='25' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3Cline x1='15' y1='50' x2='85' y2='50' stroke='%23efefef' stroke-width='4' /%3E%3Cline x1='50' y1='15' x2='50' y2='85' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s11' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='30' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3Ccircle cx='50' cy='50' r='15' fill='none' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3Csymbol id='s12' viewBox='0 0 100 100'%3E%3Cline x1='30' y1='40' x2='70' y2='40' stroke='%23efefef' stroke-width='4' /%3E%3Cline x1='20' y1='50' x2='80' y2='50' stroke='%23efefef' stroke-width='4' /%3E%3Cline x1='30' y1='60' x2='70' y2='60' stroke='%23efefef' stroke-width='4' /%3E%3C/symbol%3E%3C/defs%3E%3Cg transform='translate(50, 50)'%3E%3C!-- Symbols shifted 50px to center them in 200px cells --%3E%3Cuse href='%23s5' x='0' y='0' width='100' height='100' /%3E%3Cuse href='%23s12' x='200' y='0' width='100' height='100' /%3E%3Cuse href='%23s3' x='400' y='0' width='100' height='100' /%3E%3Cuse href='%23s9' x='600' y='0' width='100' height='100' /%3E%3Cuse href='%23s1' x='800' y='0' width='100' height='100' /%3E%3Cuse href='%23s10' x='1000' y='0' width='100' height='100' /%3E%3Cuse href='%23s7' x='1200' y='0' width='100' height='100' /%3E%3Cuse href='%23s2' x='1400' y='0' width='100' height='100' /%3E%3Cuse href='%23s11' x='1600' y='0' width='100' height='100' /%3E%3Cuse href='%23s4' x='1800' y='0' width='100' height='100' /%3E%3Cuse href='%23s8' x='0' y='200' width='100' height='100' /%3E%3Cuse href='%23s4' x='200' y='200' width='100' height='100' /%3E%3Cuse href='%23s1' x='400' y='200' width='100' height='100' /%3E%3Cuse href='%23s6' x='600' y='200' width='100' height='100' /%3E%3Cuse href='%23s12' x='800' y='200' width='100' height='100' /%3E%3Cuse href='%23s3' x='1000' y='200' width='100' height='100' /%3E%3Cuse href='%23s9' x='1200' y='200' width='100' height='100' /%3E%3Cuse href='%23s5' x='1400' y='200' width='100' height='100' /%3E%3Cuse href='%23s10' x='1600' y='200' width='100' height='100' /%3E%3Cuse href='%23s7' x='1800' y='200' width='100' height='100' /%3E%3Cuse href='%23s2' x='0' y='400' width='100' height='100' /%3E%3Cuse href='%23s11' x='200' y='400' width='100' height='100' /%3E%3Cuse href='%23s9' x='400' y='400' width='100' height='100' /%3E%3Cuse href='%23s5' x='600' y='400' width='100' height='100' /%3E%3Cuse href='%23s8' x='800' y='400' width='100' height='100' /%3E%3Cuse href='%23s1' x='1000' y='400' width='100' height='100' /%3E%3Cuse href='%23s12' x='1200' y='400' width='100' height='100' /%3E%3Cuse href='%23s4' x='1400' y='400' width='100' height='100' /%3E%3Cuse href='%23s6' x='1600' y='400' width='100' height='100' /%3E%3Cuse href='%23s3' x='1800' y='400' width='100' height='100' /%3E%3Cuse href='%23s10' x='0' y='600' width='100' height='100' /%3E%3Cuse href='%23s7' x='200' y='600' width='100' height='100' /%3E%3Cuse href='%23s4' x='400' y='600' width='100' height='100' /%3E%3Cuse href='%23s11' x='600' y='600' width='100' height='100' /%3E%3Cuse href='%23s3' x='800' y='600' width='100' height='100' /%3E%3Cuse href='%23s9' x='1000' y='600' width='100' height='100' /%3E%3Cuse href='%23s6' x='1200' y='600' width='100' height='100' /%3E%3Cuse href='%23s1' x='1400' y='600' width='100' height='100' /%3E%3Cuse href='%23s2' x='1600' y='600' width='100' height='100' /%3E%3Cuse href='%23s5' x='1800' y='600' width='100' height='100' /%3E%3Cuse href='%23s12' x='0' y='800' width='100' height='100' /%3E%3Cuse href='%23s8' x='200' y='800' width='100' height='100' /%3E%3Cuse href='%23s2' x='400' y='800' width='100' height='100' /%3E%3Cuse href='%23s10' x='600' y='800' width='100' height='100' /%3E%3Cuse href='%23s7' x='800' y='800' width='100' height='100' /%3E%3Cuse href='%23s5' x='1000' y='800' width='100' height='100' /%3E%3Cuse href='%23s11' x='1200' y='800' width='100' height='100' /%3E%3Cuse href='%23s3' x='1400' y='800' width='100' height='100' /%3E%3Cuse href='%23s9' x='1600' y='800' width='100' height='100' /%3E%3Cuse href='%23s4' x='1800' y='800' width='100' height='100' /%3E%3Cuse href='%23s6' x='0' y='1000' width='100' height='100' /%3E%3Cuse href='%23s1' x='200' y='1000' width='100' height='100' /%3E%3Cuse href='%23s11' x='400' y='1000' width='100' height='100' /%3E%3Cuse href='%23s4' x='600' y='1000' width='100' height='100' /%3E%3Cuse href='%23s9' x='800' y='1000' width='100' height='100' /%3E%3Cuse href='%23s12' x='1000' y='1000' width='100' height='100' /%3E%3Cuse href='%23s2' x='1200' y='1000' width='100' height='100' /%3E%3Cuse href='%23s8' x='1400' y='1000' width='100' height='100' /%3E%3Cuse href='%23s10' x='1600' y='1000' width='100' height='100' /%3E%3Cuse href='%23s7' x='1800' y='1000' width='100' height='100' /%3E%3Cuse href='%23s3' x='0' y='1200' width='100' height='100' /%3E%3Cuse href='%23s5' x='200' y='1200' width='100' height='100' /%3E%3Cuse href='%23s8' x='400' y='1200' width='100' height='100' /%3E%3Cuse href='%23s2' x='600' y='1200' width='100' height='100' /%3E%3Cuse href='%23s1' x='800' y='1200' width='100' height='100' /%3E%3Cuse href='%23s6' x='1000' y='1200' width='100' height='100' /%3E%3Cuse href='%23s10' x='1200' y='1200' width='100' height='100' /%3E%3Cuse href='%23s11' x='1400' y='1200' width='100' height='100' /%3E%3Cuse href='%23s4' x='1600' y='1200' width='100' height='100' /%3E%3Cuse href='%23s12' x='1800' y='1200' width='100' height='100' /%3E%3Cuse href='%23s9' x='0' y='1400' width='100' height='100' /%3E%3Cuse href='%23s10' x='200' y='1400' width='100' height='100' /%3E%3Cuse href='%23s7' x='400' y='1400' width='100' height='100' /%3E%3Cuse href='%23s12' x='600' y='1400' width='100' height='100' /%3E%3Cuse href='%23s5' x='800' y='1400' width='100' height='100' /%3E%3Cuse href='%23s3' x='1000' y='1400' width='100' height='100' /%3E%3Cuse href='%23s4' x='1200' y='1400' width='100' height='100' /%3E%3Cuse href='%23s6' x='1400' y='1400' width='100' height='100' /%3E%3Cuse href='%23s1' x='1600' y='1400' width='100' height='100' /%3E%3Cuse href='%23s8' x='1800' y='1400' width='100' height='100' /%3E%3Cuse href='%23s11' x='0' y='1600' width='100' height='100' /%3E%3Cuse href='%23s3' x='200' y='1600' width='100' height='100' /%3E%3Cuse href='%23s6' x='400' y='1600' width='100' height='100' /%3E%3Cuse href='%23s8' x='600' y='1600' width='100' height='100' /%3E%3Cuse href='%23s10' x='800' y='1600' width='100' height='100' /%3E%3Cuse href='%23s7' x='1000' y='1600' width='100' height='100' /%3E%3Cuse href='%23s1' x='1200' y='1600' width='100' height='100' /%3E%3Cuse href='%23s12' x='1400' y='1600' width='100' height='100' /%3E%3Cuse href='%23s2' x='1600' y='1600' width='100' height='100' /%3E%3Cuse href='%23s9' x='1800' y='1600' width='100' height='100' /%3E%3Cuse href='%23s4' x='0' y='1800' width='100' height='100' /%3E%3Cuse href='%23s2' x='200' y='1800' width='100' height='100' /%3E%3Cuse href='%23s1' x='400' y='1800' width='100' height='100' /%3E%3Cuse href='%23s5' x='600' y='1800' width='100' height='100' /%3E%3Cuse href='%23s11' x='800' y='1800' width='100' height='100' /%3E%3Cuse href='%23s9' x='1000' y='1800' width='100' height='100' /%3E%3Cuse href='%23s8' x='1200' y='1800' width='100' height='100' /%3E%3Cuse href='%23s10' x='1400' y='1800' width='100' height='100' /%3E%3Cuse href='%23s7' x='1600' y='1800' width='100' height='100' /%3E%3Cuse href='%23s3' x='1800' y='1800' width='100' height='100' /%3E%3C/g%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 300px;
    /* Base size */
}

/* Medium Devices (< 980px) */
@media (min-width: 768px) and (max-width: 979px) {
    .bkg-engineering-symbols {
        background-size: 400px;
    }
}

/* Laptops (< 1280px) */
@media (min-width: 980px) and (max-width: 1279px) {
    .bkg-engineering-symbols {
        background-size: 500px;
    }
}

/* Large Desktops (1281px+) */
@media (min-width: 1281px) {
    .bkg-engineering-symbols {
        background-size: 600px;
    }
}


/* ========================================
   CTA Buttons Box Shadow
======================================== */

.btn-primary-shadow:hover,
#contact-form form button:hover{
    -webkit-box-shadow: 0px 10px 13px -7px #a5a5a5, 5px 5px 15px 5px rgba(0, 0, 0, 0) !important;
    box-shadow: 0px 10px 13px -7px #a5a5a5, 5px 5px 15px 5px rgba(0, 0, 0, 0) !important;
}


/* ========================================
   CASE STUDY CARD
======================================== */
.card-case_study {
    transition:
        background-color 0.27s ease,
        border-color 0.27s ease,
        transform 0.27s ease,
        box-shadow 0.27s ease;
}

.card-case_study img {
    width: 100%;
    /* Ensure it fills the width of the card */
    aspect-ratio: 1 / 1;
    /* Forces the sqare shape */
    object-fit: cover;
    /* Cuts off overflow and prevents stretching */
    object-position: center;
    /* Keeps the center of the image visible */
    display: block;
    /* Removes extra bottom whitespace */
}

/* Container for the heading and symbol */
.card-case_study h4{
    display: flex;
    align-items: center;
    gap: 15px;
    /* Space between symbol and text */
    line-height: 1.2;
    position: relative;
    margin-left: 35px;
}

/* 1. The Circle (using ::before) */
.card-case_study h4::before{
    content: "";
    display: inline-block;
    width: 20px;
    /* Circle diameter */
    height: 20px;
    flex-shrink: 0;
    border: 3px solid rgb(217,217,217);
    border-radius: 50%;
    position: absolute;
    top: 0px !important;
    left: -33px;
    z-index: 2;
}

/* 2. The Protruding Lines (using ::after) */
.card-case_study h4::after{
    content: "";
    position: absolute;
    top: 12px;
    left: -20px;
    transform: translate(-50%, -50%);

    /* Crosshair size */
    width: 32px;
    height: 32px;

    /* The lines */
    background:
            linear-gradient(rgb(217, 217, 217), rgb(217, 217, 217)) center/100% 2px no-repeat,
                linear-gradient(rgb(217, 217, 217), rgb(217, 217, 217)) center/2px 100% no-repeat;

    pointer-events: none;
    z-index: 1;
}


.card-case_study:hover {
    /* background-color: #FAFAFA; */
    border-style: solid;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
    cursor: pointer;
}


/* ========================================
   MINI-CASE STUDY 
======================================== */


/* ========================================
   IMAGE LINK
======================================== */
.image-link {
    display: inline-block;
    /* prevents transform jitter on <a><img></a> */
    transition:
        transform 0.27s ease,
        box-shadow 0.27s ease;
    will-change: transform;
}

.image-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
    cursor: pointer;
}



/* ========================================
   POST CONTENT
======================================== */
#post-content-wrapper {
    border: 1px solid red;
    width:100%;
}
#post-content-wrapper .et_pb_row_0.et_pb_row.et_flex_row{
    border: 1px solid green;
    width: 100%;
}