.elementor-45 .elementor-element.elementor-element-3c2e336{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-45 .elementor-element.elementor-element-e30f29d{width:100%;max-width:100%;}.elementor-45 .elementor-element.elementor-element-70cd1d5{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-45 .elementor-element.elementor-element-0a6c134{width:100%;max-width:100%;}.elementor-45 .elementor-element.elementor-element-de2c420{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-45 .elementor-element.elementor-element-ee739b4{width:100%;max-width:100%;}.elementor-45 .elementor-element.elementor-element-5781f95{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-45 .elementor-element.elementor-element-ea36828{width:100%;max-width:100%;}:root{--page-title-display:none;}/* Start custom CSS *//* =========================================================
   YourClad — FLASHINGS (PAGE BASE)
   Scope: body.page-id-45
   Brand: #F66000 / #060817
   BG: #f7f7f7
   ========================================================= */

/* ---------- Tokens (scoped) ---------- */
body.page-id-45{
  --yc-bg-page: #f7f7f7;
  --yc-ink: #060817;
  --yc-accent: #F66000;

  --yc-border: rgba(6,8,23,0.12);
  --yc-border-soft: rgba(6,8,23,0.10);
  --yc-muted: rgba(6,8,23,0.78);
  --yc-muted2: rgba(6,8,23,0.68);

  --yc-card: #fff;
  --yc-radius-lg: 22px;
  --yc-radius-md: 18px;

  --yc-shadow-lg: 0 24px 60px rgba(6,8,23,0.14);
  --yc-shadow-md: 0 14px 34px rgba(6,8,23,0.10);

  --yc-max: 1200px;
  --yc-pad: 18px;
  --yc-gap: 18px;

  --yc-scroll-offset: 110px;
}

body.page-id-45{ background: var(--yc-bg-page); }

/* Anchor offset (only these IDs) */
body.page-id-45 #drip-flashing,
body.page-id-45 #ridge-flashing,
body.page-id-45 #barge-board{
  scroll-margin-top: var(--yc-scroll-offset);
}

/* =========================================================
   HERO — .yc-fl-hero
   ========================================================= */
body.page-id-45 .yc-fl-hero{
  width:100%;
  max-width: var(--yc-max);
  margin: 28px auto 0;
  padding: 0 var(--yc-pad);
  font-family: Poppins, Montserrat, Arial, sans-serif;
}
body.page-id-45 .yc-fl-hero,
body.page-id-45 .yc-fl-hero *{ box-sizing:border-box; }

body.page-id-45 .yc-fl-hero__panel{
  position:relative;
  overflow:hidden;
  border-radius: var(--yc-radius-lg);
  border: 1px solid var(--yc-border);
  box-shadow: 0 24px 60px rgba(6,8,23,0.18);
  background: var(--yc-ink);
}

body.page-id-45 .yc-fl-hero__bg{
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(70% 60% at 15% 20%, rgba(246,96,0,0.18) 0%, rgba(246,96,0,0.00) 60%),
    linear-gradient(115deg, rgba(6,8,23,0.92) 0%, rgba(6,8,23,0.74) 55%, rgba(6,8,23,0.52) 100%);
  background-size: cover;
  background-position: center;
  background-repeat:no-repeat;
  transform: scale(1.02);
  transition: transform .6s ease;
}
body.page-id-45 .yc-fl-hero__panel:hover .yc-fl-hero__bg{ transform: scale(1.06); }

body.page-id-45 .yc-fl-hero__grid{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap: 18px;
  padding: clamp(26px, 5vw, 64px);
  align-items:flex-start;
  min-height: clamp(520px, 78vh, 820px);
}

body.page-id-45 .yc-fl-hero__kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.86);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
}
body.page-id-45 .yc-fl-hero__dot{
  width:10px;height:10px;border-radius:50%;
  background: var(--yc-accent);
  box-shadow: 0 0 0 4px rgba(246,96,0,0.22);
  flex:0 0 auto;
}

body.page-id-45 .yc-fl-hero__title{
  margin: 6px 0 4px;
  color:#fff;
  font-weight: 900;
  line-height: 1.08;
  font-size: clamp(30px, 3.6vw, 52px);
  max-width: 980px;
}
body.page-id-45 .yc-fl-hero__subtitle{
  margin: 0 0 6px;
  color: rgba(255,255,255,0.84);
  font-size: clamp(15px, 1.2vw, 19px);
  line-height: 1.75;
  max-width: 960px;
}
body.page-id-45 .yc-fl-hero__intro{
  margin: 0 0 6px;
  color: rgba(255,255,255,0.86);
  font-size: 14px;
  line-height: 1.75;
  max-width: 960px;
}

body.page-id-45 .yc-fl-hero__chips{
  margin: 4px 0 6px;
  padding: 0;
  list-style: none;
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
}
body.page-id-45 .yc-fl-hero__chipLink{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 11px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.16);
  color: rgba(255,255,255,0.90) !important;
  font-size: 12.5px;
  line-height: 1;
  text-decoration:none !important;
  backdrop-filter: blur(10px);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
body.page-id-45 .yc-fl-hero__chipLink:hover{
  transform: translateY(-2px);
  border-color: rgba(246,96,0,0.55);
  background: rgba(246,96,0,0.14);
  box-shadow: 0 14px 34px rgba(6,8,23,0.20);
}
body.page-id-45 .yc-fl-hero__chipDot{
  width:8px;height:8px;border-radius:50%;
  background: var(--yc-accent);
  box-shadow: 0 0 0 4px rgba(246,96,0,0.18);
}

body.page-id-45 .yc-fl-hero__bullets{
  margin: 6px 0 6px;
  padding: 0;
  list-style: none;
  display:grid;
  gap: 12px;
  max-width: 980px;
}
body.page-id-45 .yc-fl-hero__li{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.16);
  color: rgba(255,255,255,0.88);
  font-size: 13.5px;
  line-height: 1.6;
  backdrop-filter: blur(10px);
}
body.page-id-45 .yc-fl-hero__tick{
  width: 20px; height: 20px;
  border-radius: 8px;
  background: rgba(246,96,0,0.16);
  border: 1px solid rgba(246,96,0,0.34);
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--yc-accent);
  flex: 0 0 auto;
  margin-top: 2px;
}
body.page-id-45 .yc-fl-hero__li strong{ color:#fff; font-weight:900; }

body.page-id-45 .yc-fl-hero__actions{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items:center;
  margin-top: 6px;
}
body.page-id-45 .yc-fl-hero__btnPrimary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  padding: 14px 20px;
  border-radius: 999px;
  background: var(--yc-accent);
  color:#fff !important;
  font-weight: 900;
  font-size: 14px;
  text-decoration:none !important;
  box-shadow: 0 18px 50px rgba(246,96,0,0.38);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
body.page-id-45 .yc-fl-hero__btnPrimary:hover{
  transform: translateY(-2px);
  background:#e45700;
  box-shadow: 0 26px 70px rgba(246,96,0,0.48);
}
body.page-id-45 .yc-fl-hero__btnSecondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  padding: 13px 18px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.22);
  color:#fff !important;
  font-weight: 900;
  font-size: 14px;
  text-decoration:none !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
body.page-id-45 .yc-fl-hero__btnSecondary:hover{
  transform: translateY(-1px);
  background: rgba(246,96,0,0.10);
  border-color: rgba(246,96,0,0.55);
  box-shadow: 0 18px 54px rgba(6,8,23,0.16);
}

/* =========================================================
   PRODUCT BLOCK — .yc-fl-prod (3 systems)
   ========================================================= */
body.page-id-45 .yc-fl-prod{
  width:100%;
  max-width: var(--yc-max);
  margin: 22px auto 0;
  padding: 0 var(--yc-pad);
  font-family: Poppins, Montserrat, Arial, sans-serif;
}
body.page-id-45 .yc-fl-prod,
body.page-id-45 .yc-fl-prod *{ box-sizing:border-box; }

body.page-id-45 .yc-fl-prod__panel{
  position:relative;
  overflow:hidden;
  border-radius: var(--yc-radius-lg);
  border: 1px solid var(--yc-border);
  box-shadow: var(--yc-shadow-lg);
  background: var(--yc-card);
}
body.page-id-45 .yc-fl-prod__panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(70% 70% at 10% 10%, rgba(246,96,0,0.08) 0%, rgba(246,96,0,0.00) 55%),
    radial-gradient(80% 70% at 90% 20%, rgba(6,8,23,0.06) 0%, rgba(6,8,23,0.00) 60%);
  pointer-events:none;
}

body.page-id-45 .yc-fl-prod__grid{
  position:relative;
  display:grid;
  grid-template-columns: 1fr 1.05fr;
  gap: var(--yc-gap);
  padding: 32px;
  align-items: stretch;
}

/* LEFT media */
body.page-id-45 .yc-fl-prod__media{
  position:relative;
  overflow:hidden;
  border-radius: var(--yc-radius-md);
  border: 1px solid var(--yc-border-soft);
  background: var(--yc-card);
  box-shadow: var(--yc-shadow-md);
  display:flex;
  flex-direction:column;
  min-height: 100%;
}
body.page-id-45 .yc-fl-prod__mediaTop{
  position:relative;
  overflow:hidden;
  background: var(--yc-card);
  aspect-ratio: 1 / 1;
}
body.page-id-45 .yc-fl-prod__img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: 50% 20%;
  display:block;
  transform: scale(1.02);
  transition: transform .6s ease, filter .6s ease;
  filter: saturate(1.02) contrast(1.02);
}
body.page-id-45 .yc-fl-prod__panel:hover .yc-fl-prod__img{
  transform: scale(1.06);
  filter: saturate(1.06) contrast(1.04);
}

body.page-id-45 .yc-fl-prod__badge{
  position:absolute;
  top: 14px;
  left: 14px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.86);
  border: 1px solid var(--yc-border);
  color: rgba(6,8,23,0.86);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
}
body.page-id-45 .yc-fl-prod__dot{
  width:10px;height:10px;border-radius:50%;
  background: var(--yc-accent);
  box-shadow: 0 0 0 4px rgba(246,96,0,0.18);
  flex:0 0 auto;
}

body.page-id-45 .yc-fl-prod__caption{
  padding: 14px 16px 16px;
  border-top: 1px solid var(--yc-border-soft);
  background: rgba(6,8,23,0.02);
  display:flex;
  flex-direction:column;
  gap: 10px;
  flex: 1 1 auto;
}
body.page-id-45 .yc-fl-prod__capTitle{
  margin: 0;
  color: var(--yc-ink);
  font-weight: 900;
  font-size: 14px;
}
body.page-id-45 .yc-fl-prod__capText{
  margin: 0;
  color: rgba(6,8,23,0.72);
  font-size: 12.5px;
  line-height: 1.55;
}
body.page-id-45 .yc-fl-prod__capLinkRow{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: auto;
}
body.page-id-45 .yc-fl-prod__capLink{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(246,96,0,0.10);
  border: 1px solid rgba(246,96,0,0.28);
  color: var(--yc-ink) !important;
  font-weight: 900;
  font-size: 12.5px;
  text-decoration:none !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
  white-space: nowrap;
}
body.page-id-45 .yc-fl-prod__capLink:hover{
  transform: translateY(-1px);
  background: rgba(246,96,0,0.16);
  border-color: rgba(246,96,0,0.45);
  box-shadow: 0 14px 34px rgba(6,8,23,0.10);
}
body.page-id-45 .yc-fl-prod__capLinkDot{
  width:9px;height:9px;border-radius:50%;
  background: var(--yc-accent);
  box-shadow: 0 0 0 4px rgba(246,96,0,0.18);
}

/* RIGHT content */
body.page-id-45 .yc-fl-prod__kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(6,8,23,0.04);
  border: 1px solid rgba(6,8,23,0.10);
  color: rgba(6,8,23,0.78);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
body.page-id-45 .yc-fl-prod__kdot{
  width:10px;height:10px;border-radius:50%;
  background: var(--yc-accent);
  box-shadow: 0 0 0 4px rgba(246,96,0,0.18);
}
body.page-id-45 .yc-fl-prod__title{
  margin: 12px 0 8px;
  color: var(--yc-ink);
  font-weight: 900;
  line-height: 1.12;
  font-size: 28px;
}
body.page-id-45 .yc-fl-prod__lead{
  margin: 0 0 14px;
  color: var(--yc-muted);
  font-size: 14px;
  line-height: 1.75;
  max-width: 680px;
}

/* specs list */
body.page-id-45 .yc-fl-prod__specs{
  margin: 0;
  padding: 0;
  list-style: none;
  display:grid;
  gap: 10px;
}
body.page-id-45 .yc-fl-prod__spec{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(6,8,23,0.03);
  border: 1px solid rgba(6,8,23,0.10);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
body.page-id-45 .yc-fl-prod__spec:hover{
  transform: translateY(-2px);
  border-color: rgba(246,96,0,0.35);
  background: rgba(246,96,0,0.06);
}
body.page-id-45 .yc-fl-prod__tick{
  width: 20px; height: 20px;
  border-radius: 8px;
  background: rgba(246,96,0,0.12);
  border: 1px solid rgba(246,96,0,0.28);
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--yc-accent);
  flex: 0 0 auto;
  margin-top: 2px;
}
body.page-id-45 .yc-fl-prod__spec strong{
  display:block;
  color: var(--yc-ink);
  font-weight: 900;
  font-size: 13px;
  line-height: 1.25;
  margin: 0 0 2px;
}
body.page-id-45 .yc-fl-prod__spec span{
  display:block;
  color: var(--yc-muted);
  font-size: 13px;
  line-height: 1.55;
}

body.page-id-45 .yc-fl-prod__note{
  margin: 12px 0 0;
  color: var(--yc-muted2);
  font-size: 12.5px;
  line-height: 1.6;
}

/* actions */
body.page-id-45 .yc-fl-prod__actions{
  display:flex;
  gap:10px;
  flex-wrap: wrap;
  margin-top: 14px;
}
body.page-id-45 .yc-fl-prod__btnPrimary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 16px;
  border-radius: 999px;
  background: var(--yc-accent);
  color:#fff !important;
  font-weight: 900;
  font-size: 13px;
  text-decoration:none !important;
  box-shadow: 0 16px 40px rgba(246,96,0,0.32);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
body.page-id-45 .yc-fl-prod__btnPrimary:hover{
  transform: translateY(-2px);
  background:#e45700;
  box-shadow: 0 22px 52px rgba(246,96,0,0.42);
}
body.page-id-45 .yc-fl-prod__btnSecondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 11px 14px;
  border-radius: 999px;
  background: rgba(6,8,23,0.03);
  border: 1px solid rgba(6,8,23,0.16);
  color: var(--yc-ink) !important;
  font-weight: 900;
  font-size: 13px;
  text-decoration:none !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
body.page-id-45 .yc-fl-prod__btnSecondary:hover{
  transform: translateY(-1px);
  background: rgba(246,96,0,0.08);
  border-color: rgba(246,96,0,0.45);
  box-shadow: 0 18px 50px rgba(6,8,23,0.10);
}

/* Responsive */
@media (max-width: 980px){
  body.page-id-45 .yc-fl-hero__grid{ min-height: 84vh; padding: 26px; }
  body.page-id-45 .yc-fl-prod__grid{ grid-template-columns: 1fr; padding: 24px; }
  body.page-id-45 .yc-fl-prod__mediaTop{ aspect-ratio: 11 / 10; }
  body.page-id-45 .yc-fl-prod__title{ font-size: 26px; }
}
@media (max-width: 520px){
  body.page-id-45 .yc-fl-hero__grid{ padding: 20px; min-height: 76vh; }
  body.page-id-45 .yc-fl-hero__actions{ width:100%; }
  body.page-id-45 .yc-fl-hero__btnPrimary,
  body.page-id-45 .yc-fl-hero__btnSecondary{ width:100%; }

  body.page-id-45 .yc-fl-prod__grid{ padding: 20px; }
  body.page-id-45 .yc-fl-prod__actions{ width:100%; }
  body.page-id-45 .yc-fl-prod__btnPrimary,
  body.page-id-45 .yc-fl-prod__btnSecondary{ width:100%; }
  body.page-id-45 .yc-fl-prod__capLink{ width:100%; justify-content:center; }
}

/* Focus safety */
body.page-id-45 .yc-fl-hero a:focus,
body.page-id-45 .yc-fl-prod a:focus{
  outline: 2px solid rgba(246,96,0,0.55);
  outline-offset: 3px;
  border-radius: 12px;
}/* End custom CSS */