.elementor-628 .elementor-element.elementor-element-b76ac7c{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-6b2991d{width:100%;max-width:100%;}.elementor-628 .elementor-element.elementor-element-ca341a9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-e96590f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-ce75a9a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-3fe4e4b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-1ec4ddd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-d6b68ea{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-4722e18{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-449a2c4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-d87cfd7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-8ab5850{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-331c4b4{width:100%;max-width:100%;}.elementor-628 .elementor-element.elementor-element-8fc7792{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-05fb5c8{width:100%;max-width:100%;}.elementor-628 .elementor-element.elementor-element-f3de497{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-07f9940{width:100%;max-width:100%;}.elementor-628 .elementor-element.elementor-element-eb59883{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-628 .elementor-element.elementor-element-3c4aeb8{width:100%;max-width:100%;}/* Start custom CSS for html, class: .elementor-element-b3e66b7 *//* ======================================================
   ASPHALT SHINGLES FAQ — GRID 2x5 (FAQ STYLE)
====================================================== */

#gcFaqAsphaltGrid{
  font-family:"Montserrat",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  padding:90px 5%;
  background:#E0E0E0;
  color:#0a0a0a;
  overflow:hidden;
}

#gcFaqAsphaltGrid *{
  box-sizing:border-box;
}

/* WRAPPER */
#gcFaqAsphaltGrid .gc-shell{
  max-width:1700px;
  margin:0 auto;
}

/* HEADER */
#gcFaqAsphaltGrid .gc-head{
  text-align:center;
  margin-bottom:30px;
}

#gcFaqAsphaltGrid .gc-head h2{
  font-family:"Poppins",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  margin:0;
  font-size:clamp(28px,2.2vw,42px);
  letter-spacing:-.02em;
  line-height:1.1;
}

#gcFaqAsphaltGrid .gc-head p{
  margin:12px auto 0;
  color:rgba(0,0,0,.72);
  line-height:1.6;
  max-width:76ch;
  font-weight:600;
}

/* GRID 2 COLUMNS */
#gcFaqAsphaltGrid .gc-faq-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  align-items:start;
}

/* FAQ CARD */
#gcFaqAsphaltGrid .gc-faq{
  border-radius:22px;
  background:#ffffff;
  border:1px solid rgba(0,0,0,.10);
  box-shadow:0 14px 40px rgba(0,0,0,.10);
  overflow:hidden;
}

/* DETAILS */
#gcFaqAsphaltGrid details{
  border-top:1px solid rgba(0,0,0,.08);
}

#gcFaqAsphaltGrid details:first-of-type{
  border-top:0;
}

/* SUMMARY */
#gcFaqAsphaltGrid summary{
  list-style:none;
  cursor:pointer;
  padding:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-weight:900;
  color:#0a0a0a;
  user-select:none;
  font-size:1rem;
}

#gcFaqAsphaltGrid summary::-webkit-details-marker{
  display:none;
}

/* QUESTION */
#gcFaqAsphaltGrid .gc-q{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

#gcFaqAsphaltGrid .gc-q i{
  width:36px;
  height:36px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:rgba(214,186,106,.20);
  border:1px solid rgba(0,0,0,.10);
  color:#000;
  flex:0 0 auto;
  font-size:1.1rem;
}

#gcFaqAsphaltGrid .gc-q span{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* CHEVRON */
#gcFaqAsphaltGrid .gc-chevron{
  width:38px;
  height:38px;
  border-radius:12px;
  display:grid;
  place-items:center;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(0,0,0,.03);
  transition:transform .22s ease, background-color .18s ease;
  flex:0 0 auto;
}

#gcFaqAsphaltGrid details[open] .gc-chevron{
  transform:rotate(180deg);
  background:rgba(214,186,106,.25);
}

/* ANSWER */
#gcFaqAsphaltGrid .gc-a{
  padding:0 18px 18px;
  color:rgba(0,0,0,.72);
  line-height:1.65;
  font-weight:600;
}

/* HOVER EFFECT */
#gcFaqAsphaltGrid summary:hover{
  background:linear-gradient(90deg, rgba(214,186,106,.08), rgba(255,255,255,0));
}

/* RESPONSIVE */
@media(max-width:980px){
  #gcFaqAsphaltGrid{
    padding:70px 5%;
  }

  #gcFaqAsphaltGrid .gc-faq-grid{
    grid-template-columns:1fr;
    gap:18px;
  }
}

@media(max-width:600px){
  #gcFaqAsphaltGrid summary{
    padding:16px;
  }

  #gcFaqAsphaltGrid .gc-q span{
    white-space:normal;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-07f9940 *//* =========================
       CTA — Scenario 3 (Centered) + BG Image
       ✅ Margins like your form section: padding: XXpx 5%
    ========================== */
    #gcCtaS3AltBg{
      font-family:"Montserrat",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
      padding:100px 5%;              /* ✅ same margin system */
      background:#000;
      color:#fff;
      overflow:hidden;
      position:relative;
      isolation:isolate;
    }
    #gcCtaS3AltBg *{box-sizing:border-box}

    /* ✅ Shell no longer limits width */
    #gcCtaS3AltBg .gc-shell{
      max-width:100%;
      margin:0 auto;
      padding:0;
    }

    #gcCtaS3AltBg .gc-banner{
      position:relative;
      width:100%;
      border-radius:26px;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.10);
      box-shadow:0 20px 60px rgba(0,0,0,.55);
      isolation:isolate;

      background-image:url("http://graycoreroof.com/wp-content/uploads/2025/12/Metal_Roofing_Gray_Core-6.jpg");
      background-size:cover;
      background-position:center;
    }

    /* overlays */
    #gcCtaS3AltBg .gc-overlay{
      position:absolute; inset:0;
      background:
        radial-gradient(circle at 50% 20%, rgba(255, 255, 255, 0.22), transparent 55%),
        linear-gradient(180deg, rgba(0,0,0,.68) 0%, rgba(0,0,0,.46) 45%, rgba(0,0,0,.36) 100%);
      z-index:0;
      pointer-events:none;
    }

    /* gold rail */
    #gcCtaS3AltBg .gc-rail{
      position:absolute; left:0; top:0; bottom:0;
      width:10px;
      background:linear-gradient(180deg, rgba(214,186,106,1), rgba(214,186,106,.55));
      z-index:2;
    }

    /* content */
    #gcCtaS3AltBg .gc-content{
      position:relative;
      z-index:3;
      padding:72px 42px 62px;       /* keep your inner spacing */
      min-height:420px;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
    }

    #gcCtaS3AltBg .gc-inner{
      width:100%;
      max-width:980px;
      margin:0 auto;
    }

    #gcCtaS3AltBg h2{
      font-family:"Poppins",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
      margin:0;
      font-size:clamp(28px, 2.4vw, 46px);
      line-height:1.08;
      letter-spacing:-.02em;
      text-shadow:0 10px 30px rgba(0,0,0,.55);
    }
    #gcCtaS3AltBg p{
      margin:14px auto 0;
      color:rgba(255,255,255,.85);
      font-size:1.06rem;
      line-height:1.65;
      max-width:70ch;
      text-shadow:0 8px 26px rgba(0,0,0,.55);
    }

    /* buttons */
    #gcCtaS3AltBg .gc-actions{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-top:20px;
      justify-content:center;
    }

    #gcCtaS3AltBg .gc-btn{
      position:relative;
      display:inline-flex; align-items:center; justify-content:center;
      gap:10px;
      padding:16px 26px;
      min-height:54px;
      border-radius:12px;
      font-size:1rem;
      font-weight:800;
      letter-spacing:.02em;
      border:1px solid rgba(255,255,255,.18);
      text-decoration:none;
      cursor:pointer;
      user-select:none;
      transition:background-color .22s ease, color .18s ease, transform .16s ease, box-shadow .16s ease, border-color .18s ease;
      box-shadow:0 10px 26px rgba(0,0,0,.35);
      overflow:hidden; isolation:isolate;
      line-height:1;
      white-space:nowrap;
      backdrop-filter:saturate(1.1);
    }

    #gcCtaS3AltBg .gc-btn::after{
      content:"";
      position:absolute; inset:0;
      border-radius:12px;
      background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.22) 45%, transparent 100%);
      transform:translateX(-120%);
      transition:transform .55s cubic-bezier(.22,.61,.36,1);
      pointer-events:none;
      mix-blend-mode:screen;
    }
    #gcCtaS3AltBg .gc-btn:hover::after{transform:translateX(120%)}
    #gcCtaS3AltBg .gc-btn:hover{transform:translateY(-1px); box-shadow:0 14px 34px rgba(0,0,0,.45)}
    #gcCtaS3AltBg .gc-btn:focus-visible{outline:3px solid rgba(214,186,106,.6); outline-offset:2px}

    /* Scenario 3 rules */
    #gcCtaS3AltBg .gc-btn.primary{background:#E0E0E0; color:#000}
    #gcCtaS3AltBg .gc-btn.primary:hover{background:#D6BA6A; color:#000}
    #gcCtaS3AltBg .gc-btn.secondary{background:#D6BA6A; color:#000}
    #gcCtaS3AltBg .gc-btn.secondary:hover{background:#ffffff; color:#000}

    #gcCtaS3AltBg .gc-ico{font-size:1.15rem; line-height:1}

    /* Reveal */
    #gcCtaS3AltBg .reveal{
      opacity:0;
      transform:translateX(-26px);
      transition:opacity .7s ease, transform .7s ease;
    }
    #gcCtaS3AltBg.is-in .reveal{opacity:1; transform:translateX(0)}

    @media (max-width: 980px){
      #gcCtaS3AltBg{padding:80px 5%}  /* ✅ keep same margin system */
      #gcCtaS3AltBg .gc-content{padding:54px 18px 46px; min-height:380px}
      #gcCtaS3AltBg .gc-rail{width:8px}
      #gcCtaS3AltBg .gc-btn{width:100%; justify-content:center}
    }

    @media (prefers-reduced-motion: reduce){
      #gcCtaS3AltBg .reveal{opacity:1; transform:none; transition:none}
      #gcCtaS3AltBg .gc-btn, #gcCtaS3AltBg .gc-btn::after{transition:none}
    }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-3c4aeb8 *//* =========================
       GC REVIEWS — SIMPLE (Scenario 1)
       ✅ Full width + 5% side margins on SECTION (like your form)
    ========================== */
    #gcReviewsSimple{
      --gold:#D6BA6A;
      --black:#000000;
      --gray:#E0E0E0;
      --white:#FFFFFF;

      padding:80px 5%;              /* ✅ was 80px 0 */
      background:var(--white);
      color:#0a0a0a;
      font-family:"Montserrat",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
      box-sizing:border-box;
      overflow:hidden;
    }
    #gcReviewsSimple *{box-sizing:border-box}

    /* ✅ No width cap, no extra side padding */
    #gcReviewsSimple .wrap{
      max-width:100%;               /* ✅ was 1700px */
      margin:0 auto;
      padding:0;                    /* ✅ was 0 5% */
    }

    #gcReviewsSimple .head{
      text-align:center;
      margin-bottom:18px;
    }

    #gcReviewsSimple h2{
      font-family:"Poppins",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
      font-size:clamp(1.7rem, 2.3vw, 2.35rem);
      line-height:1.12;
      margin:0 0 10px;
      letter-spacing:-.02em;
    }

    #gcReviewsSimple p{
      margin:0 auto;
      max-width:72ch;
      color:rgba(0,0,0,.78);
      font-size:1.02rem;
      line-height:1.65;
    }

    /* Card for widget */
    #gcReviewsSimple .card{
      margin-top:22px;
      border-radius:22px;
      border:1px solid rgba(0,0,0,.10);
      background:#fff;
      box-shadow:0 16px 44px rgba(0,0,0,.10);
      overflow:hidden;
      padding:14px;
      transform: translateY(10px);
      opacity:0;
      transition: transform .6s ease, opacity .6s ease;
    }
    #gcReviewsSimple.is-in .card{
      transform: translateY(0);
      opacity:1;
    }

    /* small gold top line */
    #gcReviewsSimple .card::before{
      content:"";
      display:block;
      height:4px;
      border-radius:999px;
      background:linear-gradient(90deg, rgba(214,186,106,0), rgba(214,186,106,.95), rgba(214,186,106,0));
      margin:0 6px 12px;
      opacity:.9;
    }

    #gcReviewsSimple .ti-slot{
      border-radius:16px;
      border:1px solid rgba(0,0,0,.08);
      padding:10px;
      overflow:hidden;
    }

    @media (max-width:900px){
      #gcReviewsSimple{padding:70px 5%}  /* ✅ was 70px 0 */
      #gcReviewsSimple .card{padding:12px}
    }/* End custom CSS */