/*
 Theme Name:     Construct Resolve Theme
 Description:    Construct Resolve Child Theme for Divi
 Author:         Lacon Design
 Author URI:     https://lacondesign.co.uk
 Template:       Divi
 Version:        1.0.5
*/

/* =========================
   GLOBAL STYLES
   ========================= */

.et_pb_button {
  padding: 14px 34px !important;
}

.highlight-word {
  color: #E46A2A !important;
}

.gradient-word {
  background: linear-gradient(
    90deg,
    #003180 0%,
    #374185 30%,
    #9A5644 60%,
    #E46A2A 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.cr-icon-gradient .et-pb-icon {
  background: linear-gradient(
    180deg,
    #D7DEED 0%,
    #F2C7B3 100%
  );
}

h2 {
  font-family: 'DM Sans', sans-serif;
  letter-spacing: -0.04em;
}

/* =========================
   LIST STYLING (PROMO)
   ========================= */

.cr-bullets .et_pb_promo_description ul {
  list-style: none;
  margin: 0;
  padding-left: 0;
}

.cr-bullets .et_pb_promo_description ul li {
  position: relative;
  margin: 0 0 0.75rem;
  padding-left: 2.1rem;
}

.cr-bullets .et_pb_promo_description ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.65em;
  transform: translateY(-50%);
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  background: linear-gradient(
    135deg,
    #003180 0%,
    #E46A2A 100%
  );
}

/* =========================
   CTA PROMO MODULE
   ========================= */

.cr-cta .et_pb_button_wrapper {
  display: block;
}

.cr-cta .et_pb_promo_button {
  display: block;
  width: 100%;
  text-align: center;
}

/* =========================
   TESTIMONIALS (QUOTE STYLE)
   ========================= */

.quote-left .et_pb_testimonial_portrait {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

.quote-left .et_pb_testimonial_portrait img {
  display: block;
  margin: 0 !important;
}

.quote-left .et_pb_testimonial_description_inner {
  position: relative;
  padding-bottom: 25px;
}

.quote-left .et_pb_testimonial_description_inner:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: #E1E4EA;
}

/* =========================
   STEP CARDS (ALL SIZES)
   Best practice: no large negative margins
   Number circle is generated inside the blurb content (flex-friendly)
   ========================= */

/* Layout for number + icon row, and text below */
.step-card .et_pb_blurb_content{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

/* Disable the old absolute-positioned number circle method */
.step-card::before{
  content: none !important;
  display: none !important;
}

/* Number circle INSIDE the flex container */
.step-card .et_pb_blurb_content::before{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #003180;
  color: #fff;
  font-weight: 700;
  font-size: 20px;
  margin-right: 12px;
}

/* Numbers per step */
.step-card.step-1 .et_pb_blurb_content::before{ content: "1"; }
.step-card.step-2 .et_pb_blurb_content::before{ content: "2"; }
.step-card.step-3 .et_pb_blurb_content::before{ content: "3"; }

/* Icon tile sits next to number (no pulling required) */
.step-card .et_pb_main_blurb_image{
  margin: 0 !important;
}

/* Title + body drop below */
.step-card .et_pb_blurb_container{
  flex-basis: 100%;
  margin-top: 12px;
}

/* Small mobile: tighten spacing slightly */
@media (max-width: 767px){
  .step-card .et_pb_blurb_content::before{
    width: 44px;
    height: 44px;
    font-size: 18px;
    margin-right: 10px;
  }
  .step-card .et_pb_blurb_container{
    margin-top: 10px;
  }
}

/* =========================
   BUTTON ROW (VALUES)
   ========================= */

.values-buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.values-buttons .et_pb_button {
  margin: 0 !important;
  white-space: nowrap;
}

/* =========================
   MENU CTA BUTTON
   ========================= */

#top-menu li a:hover { opacity: 1 !important; }

.menu-cta a {
  border: 2px solid #003180 !important;
  background-color: #003180 !important;
  padding: 12px !important;
  color: white !important;
  border-radius: 5px;
  text-align: center;
}

.menu-cta a:hover {
  background-color: #8dc63f;
  color: white !important;
}

.et_header_style_left #et-top-navigation {
  padding-top: 16px !important;
}

.et_header_style_left .et-fixed-header #et-top-navigation {
  padding-top: 6px !important;
}

.menu-cta > a::after {
  content: "→";
  display: inline-block;
  margin-left: 0.5em;
  font-weight: 600;
}

/* Fixed header CTA text colour */
#main-header.et-fixed-header .menu-cta a {
  color: #fff !important;
}

/* Active/current state for CTA (fixed header) */
#main-header.et-fixed-header .menu-cta.current-menu-item > a,
#main-header.et-fixed-header .menu-cta.current-menu-parent > a,
#main-header.et-fixed-header .menu-cta.current-menu-ancestor > a {
  color: #fff !important;
}

/* =========================
   ICON COLOURS (MOBILE MENU)
   ========================= */

.mobile_menu_bar:before {
  color: #003180 !important;
}

.mobile_nav.opened .mobile_menu_bar:before {
  color: #003180 !important;
}

/* =========================
   TABLET & DESKTOP EQUAL HEIGHT ROWS
   (base behaviour, refined for iPad portrait below)
   ========================= */

@media (min-width: 768px) {

  .equal-blurbs.et_pb_row {
    display: flex;
    align-items: stretch;
  }

  .equal-blurbs.et_pb_row .et_pb_column {
    display: flex;
    flex-direction: column;
  }

  .equal-blurbs.et_pb_row .et_pb_column .et_pb_blurb {
    flex: 1 1 auto;
    height: 100%;
  }

  .equal-testimonials.et_pb_row {
    display: flex;
    align-items: stretch;
  }

  .equal-testimonials.et_pb_row .et_pb_column {
    display: flex;
    flex-direction: column;
  }

  .equal-testimonials.et_pb_row .et_pb_column .et_pb_testimonial {
    flex: 1 1 auto;
    height: 100%;
  }
}

/* =========================
   MOBILE (<= 980px)
   ========================= */

@media (max-width: 980px) {

  .menu-cta a {
    background-color: #003180;
  }

  /* Mobile logo size – default Divi header (left aligned) */
  .et_header_style_left #logo {
    max-width: 180px !important;
    max-height: 80px !important;
    width: auto !important;
    height: auto !important;
  }

  .et_header_style_left .logo_container {
    width: auto !important;
    max-width: none !important;
  }

  /* Fullwidth Header: reduce inner constraints on mobile */
  .custom-header-sub .et_pb_fullwidth_header_container,
  .custom-header-sub .et_pb_fullwidth_header_content {
    padding-left: 4% !important;
    padding-right: 4% !important;
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* =========================
   TABLET PORTRAIT (iPad) – 768px–980px
   - 3-step cards spacing + 3rd card drop
   - Testimonials spacing + 3rd card drop
   (Step-card icon/number is handled globally above)
   ========================= */

@media (min-width: 768px) and (max-width: 980px) {

  /* 3-step cards row layout */
  .equal-blurbs.et_pb_row{
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    gap: 20px !important;
  }

  .equal-blurbs.et_pb_row .et_pb_column{
    flex: 1 1 calc(50% - 20px) !important;
    margin: 0 !important;
    display: flex !important;
  }

  .equal-blurbs.et_pb_row .et_pb_column:nth-child(3){
    flex-basis: 100% !important;
  }

  /* Testimonials row layout */
  .equal-testimonials.et_pb_row{
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    gap: 20px !important;
  }

  .equal-testimonials.et_pb_row .et_pb_column{
    flex: 1 1 calc(50% - 20px) !important;
    margin: 0 !important;
    display: flex !important;
  }

  .equal-testimonials.et_pb_row .et_pb_column:nth-child(3){
    flex-basis: 100% !important;
  }
}

/* =========================
   STEP CARDS – MOBILE SPACING FIX
   Keep number + icon side-by-side
   ========================= */
@media (max-width: 767px) {

  /* Remove Divi's extra spacing around the icon */
  .step-card .et_pb_main_blurb_image {
    margin: 0 !important;
  }

  /* Slightly tighten the gap between number and icon */
  .step-card .et_pb_blurb_content::before {
    margin-right: 10px;
  }
}

/* =========================
   2x2 SERVICE TILES
   Row classes: equal-blurbs equal-tiles
   ========================= */

/* DESKTOP: equal height + bottom-aligned buttons */
@media (min-width: 981px) {

  .equal-tiles.et_pb_row {
    display: flex !important;
    align-items: stretch !important;
  }

  .equal-tiles.et_pb_row > .et_pb_column {
    display: flex !important;
  }

  .equal-tiles.et_pb_row > .et_pb_column > .et_pb_column_inner {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }

  /* Push last module in the column (your button/CTA) to the bottom */
  .equal-tiles.et_pb_row
  > .et_pb_column
  > .et_pb_column_inner
  > .et_pb_module:last-child {
    margin-top: auto !important;
  }
}

/* TABLET PORTRAIT (iPad): undo the equal-blurbs iPad wrapping rules for tiles only */
@media (min-width: 768px) and (max-width: 980px) {

  .equal-tiles.equal-blurbs.et_pb_row {
    /* return to Divi's normal row behaviour */
    display: block !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
  }

  .equal-tiles.equal-blurbs.et_pb_row > .et_pb_column {
    flex: none !important;
    display: block !important;
    margin: 0 !important;
  }

  .equal-tiles.equal-blurbs.et_pb_row > .et_pb_column:nth-child(3) {
    flex-basis: auto !important;
  }
}