/*
 Theme Name:     Experlogix Child
 Theme URI:      https://experlogix.com
 Description:    Experlogix child theme with CPTs, ACF/ACF Extended integration, editor shortcodes, and brand admin styling.
 Author:         Experlogix
 Author URI:     https://experlogix.com
 Template:       Divi
 Version:        1.0.0
 License:        GNU General Public License v2 or later
 License URI:    http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:    experlogix
*/
:root{
  --xpl-indigo:#0C214C;
  --xpl-royal:#223E7B;
  --xpl-azure:#3B7DDD;
  --xpl-arctic:#E8F1FF;
}



/* Toggle vertical centering by adding data-vcenter="1" on a Row */
@media (min-width:768px){
  [data-vcenter] .et_pb_column{
    display:flex !important;
    flex-direction:column;
    justify-content:center;
  }
  [data-vcenter] .et_pb_column > .et_pb_module{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}
/* Optional: on phones, turn it off (or delete this block to keep centering) */
@media (max-width:767px){
  [data-vcenter] .et_pb_column{ display:block; }
}
/* XPL Author bar – tweak globally if needed */
.xpl-author-bar {
  border-radius: 12px;              /* a touch more rounded */
}
.xpl-author-bar .xpl-author-name {
  font-weight: 800;                 /* bold like screenshot */
}
.xpl-author-bar .xpl-author-title {
  font-weight: 500;                 /* medium weight like screenshot */
}

/* If you want your brand font sizes globally */
.xpl-author-bar .xpl-author-name { font-size: 16px; line-height: 1.2; }
.xpl-author-bar .xpl-author-title { font-size: 16px; line-height: 1.2; }

/* Optional: shrink avatar slightly site-wide (e.g., to 28px) */
.xpl-author-bar img { width: 32px; height: 32px; border-radius: 6px; object-fit: cover; }


/* 1024bp utilities (works with your data-tb attributes) */
@media (max-width:1024px){
  [data-tb~="mb0"]{ margin-bottom:0 !important; }
  [data-tb~="center"]{ text-align:center !important; }
}

/* 1024 tablet tweaks driven by attributes */
@media (min-width:768px) and (max-width:1024px){
  /* if padding is on the module wrapper */
  .et_pb_text[data-tb~="pt0"]{ padding-top:0 !important; }

  /* if padding is on the inner wrapper */
  .et_pb_text[data-tb~="pt0"] .et_pb_text_inner{ padding-top:0 !important; }
}
:root {
  --xpl-body-font: "Object Sans", Helvetica, Arial, Lucida, sans-serif;
}

/* Global default */
body {
  font-family: var(--xpl-body-font) !important;
}

/* If any module or inline style tries to force Inter, override it */
[class*="et_pb"], [style*="font-family: Inter"] {
  font-family: var(--xpl-body-font) !important;
}

.xpl-audio-embed { margin: 1rem 0; }
.xpl-audio-embed audio { width: 100%; height: 40px; }
.xpl-audio-embed .xpl-audio-download { margin-top: .5rem;margin-bottom:.5rem; font-size: .95rem; }

/************************************************************
 * EXPERLOGIX SPACING UTILITIES – SECTIONS & ROWS
 * ----------------------------------------------------------
 * Usage:
 *  - Add these classes in Advanced → CSS Class on Sections/Rows
 *  - DO NOT stack conflicting vertical classes on the same row
 ************************************************************/


/* ==========================================================
   SECTION SPACING UTILITIES
   Apply to: Sections (blue)
   Classes: xpl-section-80 / 40 / 20 / 10 / none
   ========================================================== */
/************************************************************
 * EXPERLOGIX SPACING UTILITIES – SECTIONS & ROWS
 ************************************************************/


/* ==========================================================
   SECTION SPACING UTILITIES
   Apply to: Sections (blue)
   ========================================================== */

/* 80px vertical padding (desktop) */
.et_pb_section.xpl-section-80 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

/* 40px vertical padding (desktop) */
.et_pb_section.xpl-section-40 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* 20px vertical padding (desktop) */
.et_pb_section.xpl-section-20 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

/* 10px vertical padding (desktop) */
.et_pb_section.xpl-section-10 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* No vertical padding */
.et_pb_section.xpl-section-none {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}



/* ==========================================================
   ROW SPACING UTILITIES – SYMMETRIC VERTICAL
   Apply to: Rows (green)
   ========================================================== */

/* 80px vertical padding (desktop) */
.et_pb_row.xpl-row-80 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

/* 40px vertical padding (desktop) */
.et_pb_row.xpl-row-40 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* 20px vertical padding (desktop) */
.et_pb_row.xpl-row-20 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

/* 10px vertical padding (desktop) */
.et_pb_row.xpl-row-10 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* No vertical padding */
.et_pb_row.xpl-row-none {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Remove ALL padding on columns for very-tight rows (10 & none) */
.et_pb_row.xpl-row-10 > .et_pb_column,
.et_pb_row.xpl-row-10 > .et_pb_column_single,
.et_pb_row.xpl-row-none > .et_pb_column,
.et_pb_row.xpl-row-none > .et_pb_column_single {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}



/* ==========================================================
   ROW TOP / BOTTOM UTILITIES – ASYMMETRIC
   Combine ONE top + ONE bottom as needed.
   Do NOT combine these with xpl-row-80/40/20/10/none.
   ========================================================== */

/* TOP padding only */
.et_pb_row.xpl-row-top-80  { padding-top: 80px !important; }
.et_pb_row.xpl-row-top-40  { padding-top: 40px !important; }
.et_pb_row.xpl-row-top-20  { padding-top: 20px !important; }
.et_pb_row.xpl-row-top-10  { padding-top: 10px !important; }
.et_pb_row.xpl-row-top-0   { padding-top: 0 !important; }

/* BOTTOM spacing – padding + margin below row */
.et_pb_row.xpl-row-bottom-80 {
    padding-bottom: 80px !important;
    margin-bottom: 80px !important;
}
.et_pb_row.xpl-row-bottom-40 {
    padding-bottom: 40px !important;
    margin-bottom: 40px !important;
}
.et_pb_row.xpl-row-bottom-20 {
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
}
.et_pb_row.xpl-row-bottom-10 {
    padding-bottom: 10px !important;
    margin-bottom: 10px !important;
}
.et_pb_row.xpl-row-bottom-0 {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* Prevent “double gap” from last module’s bottom margin */
.et_pb_row.xpl-row-bottom-80 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-40 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-20 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-10 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-0  > .et_pb_column:last-child .et_pb_module:last-child {
    margin-bottom: 0 !important;
}



/* ==========================================================
   ROW HORIZONTAL PADDING UTILITIES – LEFT / RIGHT
   Can be combined with ANY vertical row utilities
   ========================================================== */

/* 20px left/right padding on the row */
.et_pb_row.xpl-row-h-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* 40px left/right padding on the row */
.et_pb_row.xpl-row-h-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

/* Ensure total inset is exactly 20/40 by removing column LR padding */
.et_pb_row.xpl-row-h-20 > .et_pb_column,
.et_pb_row.xpl-row-h-20 > .et_pb_column_single,
.et_pb_row.xpl-row-no-col-pad > .et_pb_column,
.et_pb_row.xpl-row-no-col-pad > .et_pb_column_single {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.et_pb_row.xpl-row-h-40 > .et_pb_column,
.et_pb_row.xpl-row-h-40 > .et_pb_column_single {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Explicit utility: remove ALL padding on columns for this row */
.et_pb_row.xpl-row-no-col-pad > .et_pb_column,
.et_pb_row.xpl-row-no-col-pad > .et_pb_column_single {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}



/* ==========================================================
   MOBILE / TABLET OVERRIDES (<= 980px)
   Scales down vertical spacing; horizontal stays the same
   ========================================================== */
@media (max-width: 980px) {

  /* SECTION vertical scaling */
  .et_pb_section.xpl-section-80 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  .et_pb_section.xpl-section-40 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .et_pb_section.xpl-section-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .et_pb_section.xpl-section-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  /* xpl-section-none already 0 */


  /* ROW symmetric vertical scaling */
  .et_pb_row.xpl-row-80 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  .et_pb_row.xpl-row-40 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .et_pb_row.xpl-row-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .et_pb_row.xpl-row-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  /* xpl-row-none already 0 */
}


/* Prevent “double gap” from last module’s bottom margin */
.et_pb_row.xpl-row-bottom-80 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-40 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-20 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-10 > .et_pb_column:last-child .et_pb_module:last-child,
.et_pb_row.xpl-row-bottom-0  > .et_pb_column:last-child .et_pb_module:last-child {
    margin-bottom: 0 !important;
}



/* ==========================================================
   ROW HORIZONTAL PADDING UTILITIES – LEFT / RIGHT
   Apply to: Rows (green)
   Classes: xpl-row-h-20 / xpl-row-h-40
   Can be combined with ANY vertical row utilities
   ========================================================== */

/* 20px left/right padding on the row */
.et_pb_row.xpl-row-h-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* 40px left/right padding on the row */
.et_pb_row.xpl-row-h-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

/* Ensure total inset is exactly 20/40 by removing column LR padding */
.et_pb_row.xpl-row-h-20 > .et_pb_column,
.et_pb_row.xpl-row-h-20 > .et_pb_column_single {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.et_pb_row.xpl-row-h-40 > .et_pb_column,
.et_pb_row.xpl-row-h-40 > .et_pb_column_single {
    padding-left: 0 !important;
    padding-right: 0 !important;
}



/* ==========================================================
   MOBILE / TABLET OVERRIDES
   Applies at 980px and below (tablet + phone)
   Scales down vertical spacing; horizontal stays the same
   ========================================================== */
@media (max-width: 980px) {

  /* SECTION vertical scaling */
  .et_pb_section.xpl-section-80 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  .et_pb_section.xpl-section-40 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .et_pb_section.xpl-section-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .et_pb_section.xpl-section-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  /* xpl-section-none already 0 */


  /* ROW symmetric vertical scaling */
  .et_pb_row.xpl-row-80 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  .et_pb_row.xpl-row-40 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .et_pb_row.xpl-row-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .et_pb_row.xpl-row-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  /* xpl-row-none already 0 */
}
/* Remove ALL padding on columns for any row that needs it */
.et_pb_row.xpl-row-no-col-pad > .et_pb_column,
.et_pb_row.xpl-row-no-col-pad > .et_pb_column_single {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}



/* 1. THE WRAPPER - Maintains 16:9 and prevents overflow */
.yt-consent-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-color: #0d2c54;
    overflow: hidden;
    margin: 20px 0;
    border-radius: 8px;
    border: 2px solid #0a2342;
}

/* 2. THE OVERLAY */
.yt-consent-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle, rgba(13,44,84,0.9) 0%, rgba(10,35,66,1) 100%);
    padding: 15px;
}

/* 3. INNER CONTAINER - Controls all spacing */
.yt-box-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 400px;
    /* This gap replaces the 15px margins causing issues */
    gap: clamp(8px, 2vh, 15px); 
    text-align: center;
}

/* 4. THE PLAY BUTTON - Professional Scaling Icon */
.yt-play-btn {
    width: clamp(40px, 10vh, 65px);
    height: clamp(40px, 10vh, 65px);
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

/* The Triangle - Scaled via clip-path for crisp edges */
.yt-play-btn::after {
    content: "";
    width: 25%;
    height: 25%;
    background-color: #ffffff;
    clip-path: polygon(20% 0%, 20% 100%, 100% 50%);
    margin-left: 5%; /* Visually centers the triangle mass */
}

/* 5. REDUCED TEXT - Optimized for Mobile/Tablet */
.yt-box-inner p {
    color: #ffffff !important;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.2 !important;
    margin: 0 !important; /* Force removal of the 15px margin seen in inspector */
    /* Scales from 12px (mobile) to 16px (desktop) */
    font-size: clamp(12px, 3vw, 16px) !important;
}

/* 6. THE ACTION BUTTON */
.yt-accept-btn {
    background-color: #ffffff !important;
    color: #0d2c54 !important;
    border: none !important;
    padding: clamp(8px, 1.5vh, 6px) 30px !important;
    font-size: clamp(11px, 1vw, 12px) !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    border-radius: 50px !important;
    cursor: pointer;
}

/* 7. TABLET SPECIFIC (Up to 1024px) */
@media screen and (max-width: 1024px) {
    .yt-box-inner {
        gap: 10px; /* Tighter vertical spacing */
    }
    .yt-box-inner p {
        font-size: 13px !important; /* Smaller footprint on iPad Pro */
    }
    .yt-play-btn {
        width: 40px;
        height: 40px;
    }
}

/* 8. VIDEO ELEMENTS */
.yt-real-video, 
.cookieconsent-optin-marketing {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
}