
/* v1.3 WordPress fidelity: the approved standalone preview uses Arial/Helvetica throughout.
   Force that exact inherited font stack so theme h1/h2/p/button typography cannot override it. */
.locked-roofing-page,
.locked-roofing-page *{font-family:Arial,Helvetica,sans-serif!important;}

html{scroll-behavior:auto;}
body.locked-roofing-page-active{margin:0!important;overflow-x:clip!important;background:#efefee;}
.locked-roofing-page{position:relative!important;width:100vw!important;max-width:none!important;margin:0!important;overflow:visible!important;isolation:isolate;z-index:0;font-family:Arial,Helvetica,sans-serif;}
.locked-roofing-page,.locked-roofing-page *{box-sizing:border-box;}
.locked-roofing-page img{max-width:none;box-shadow:none;border:0;}
.locked-roofing-page picture{display:contents;}
@media(max-width:782px){body.admin-bar .locked-roofing-page .sticky{top:46px;height:calc(100vh - 46px)}}
@media(min-width:783px){body.admin-bar .locked-roofing-page .sticky{top:32px;height:calc(100vh - 32px)}}

.locked-roofing-page{
  --bg:#efefee; --text:#111111; --muted:#5e5e5e; --line:#cdcdcb; --inactive:#d3d3d1;
}
.locked-roofing-page, .locked-roofing-page *{ box-sizing:border-box; }
.locked-roofing-page{ margin:0; padding:0; background:var(--bg); color:var(--text); font-family:Arial, Helvetica, sans-serif; }
.locked-roofing-page{ overflow-x:hidden; }
.locked-roofing-page .scroll-spacer{ height:700vh; }
.locked-roofing-page .sticky{ position:fixed; inset:0; background:var(--bg); overflow:hidden; }
.locked-roofing-page .header{ position:absolute; top:22px; left:46px; right:46px; display:flex; justify-content:space-between; align-items:flex-start; gap:20px; z-index:50; }
.locked-roofing-page .brand-wrap{ display:flex; align-items:center; gap:20px; min-width:0; }
.locked-roofing-page .brand-logo{ height:40px; width:auto; display:block; filter:brightness(0); }
.locked-roofing-page .phone{ display:flex; align-items:center; font-size:14px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#111; white-space:nowrap; animation:pulse 2.1s ease-in-out infinite; transform-origin:left center; }
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.82; transform:scale(1.022); } }
.locked-roofing-page .top-nav{ font-size:14px; font-weight:800; letter-spacing:.24em; text-transform:uppercase; white-space:nowrap; padding-top:10px; }
.locked-roofing-page .rule{ position:absolute; top:96px; left:46px; right:46px; height:1px; background:var(--line); z-index:20; }
.locked-roofing-page .layout{ position:absolute; inset:0; display:grid; grid-template-columns:minmax(350px, 34vw) 1fr; gap:24px; padding:114px 46px 38px; }
.locked-roofing-page .left{ position:relative; z-index:20; align-self:start; max-width:500px; }
.locked-roofing-page .kicker{ margin:0 0 22px; font-size:clamp(40px,5.4vh,60px); line-height:.90; letter-spacing:-.055em; font-weight:900; text-transform:uppercase; }
.locked-roofing-page .eyebrow-row{ display:flex; align-items:center; gap:16px; margin:0 0 18px; }
.locked-roofing-page .eyebrow-bar{ width:118px; height:4px; background:#111; flex:0 0 auto; }
.locked-roofing-page .eyebrow-text{ font-size:12px; font-weight:800; letter-spacing:.23em; text-transform:uppercase; white-space:nowrap; }
.locked-roofing-page .hero{ margin:0 0 14px; font-size:clamp(42px,6.25vh,62px); line-height:.89; letter-spacing:-.06em; font-weight:900; text-transform:uppercase; white-space:pre-line; max-width:490px; }
.locked-roofing-page .body{ margin:0; max-width:470px; font-size:clamp(14px,1.6vh,17px); line-height:1.44; color:var(--muted); }
.locked-roofing-page .right{ position:relative; min-width:0; }
.locked-roofing-page .stage-hint{ position:absolute; left:54px; top:6px; z-index:24; font-size:11px; font-weight:800; letter-spacing:.20em; text-transform:uppercase; white-space:nowrap; display:flex; align-items:center; gap:10px; }
.locked-roofing-page .stage-hint .arrow{ display:inline-block; font-size:30px; line-height:1; animation:hintBounce 1.25s ease-in-out infinite; transform-origin:center; }
@keyframes hintBounce { 0%,100% { transform:translateY(0); opacity:.92; } 50% { transform:translateY(8px); opacity:1; } }
.locked-roofing-page .image-stage{ position:absolute; inset:0; overflow:visible; }
.locked-roofing-page .house-shell{ position:absolute; right:14px; top:12px; width:min(54vw,792px); aspect-ratio:1740 / 1180; }
.locked-roofing-page .house-frame{ position:absolute; inset:0; }
.locked-roofing-page .house-shell img.slide-image{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:center center; display:none; user-select:none; -webkit-user-drag:none; will-change:transform, opacity; backface-visibility:hidden; transform:translateZ(0); }
.locked-roofing-page .house-shell img.slide-image.active{ display:block; }
.locked-roofing-page .house-shell img.slide-image.build-enter{ animation:buildIn .62s cubic-bezier(.18,.67,.18,1); }
@keyframes buildIn { 0% { opacity:.16; transform:translateY(7px) scale(.996); } 42% { opacity:1; transform:translateY(1px) scale(.999); } 100% { opacity:1; transform:translateY(0) scale(1); } }
.locked-roofing-page }
.build-fx{ position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:17; }
.locked-roofing-page .dust{ position:absolute; border-radius:999px; pointer-events:none; opacity:0; filter:blur(7px); animation:dustFloat 1.08s ease-out forwards; mix-blend-mode:multiply; }
@keyframes dustFloat { 0% { opacity:0; transform:translate3d(0,13px,0) scale(.72); } 16% { opacity:.52; } 50% { opacity:.27; } 100% { opacity:0; transform:translate3d(0,-32px,0) scale(1.34); } }
.locked-roofing-page }
.spark{ position:absolute; width:2px; height:2px; border-radius:50%; background:rgba(182,160,122,.58); opacity:0; animation:spark .78s ease-out forwards; }
@keyframes spark { 0% { opacity:0; transform:translate3d(0,0,0) scale(.7); } 20% { opacity:.58; } 100% { opacity:0; transform:translate3d(var(--dx), var(--dy), 0) scale(1.4); } }
.locked-roofing-page .dust-sweep{ position:absolute; left:18%; top:22%; width:64%; height:26%; pointer-events:none; opacity:0; background:radial-gradient(ellipse at center, rgba(188,166,132,.12) 0%, rgba(188,166,132,.08) 34%, rgba(188,166,132,0) 72%); filter:blur(14px); animation:dustSweep 1.05s ease-out forwards; mix-blend-mode:multiply; }
@keyframes dustSweep { 0% { opacity:0; transform:translate3d(-18px,22px,0) scale(.92); } 22% { opacity:.58; } 100% { opacity:0; transform:translate3d(18px,-22px,0) scale(1.08); } }
.locked-roofing-page .debris{ position:absolute; width:3px; height:2px; border-radius:1px; background:rgba(104,91,73,.48); opacity:0; transform-origin:center; animation:debrisDrift .85s ease-out forwards; box-shadow:0 1px 1px rgba(255,255,255,.16); }
@keyframes debrisDrift { 0% { opacity:0; transform:translate3d(0,0,0) rotate(0deg); } 18% { opacity:.62; } 100% { opacity:0; transform:translate3d(var(--dx),var(--dy),0) rotate(var(--rot)); } }
.locked-roofing-page .xray-lens{ position:absolute; width:290px; height:290px; border-radius:50%; overflow:hidden; display:none; z-index:35; pointer-events:none; border:2px solid rgba(255,255,255,.94); box-shadow:0 0 0 1px rgba(17,17,17,.13), 0 18px 34px rgba(0,0,0,.16), inset 0 0 0 1px rgba(255,255,255,.26); background:radial-gradient(circle at 35% 28%, rgba(255,255,255,.26) 0%, rgba(255,255,255,.11) 38%, rgba(255,255,255,.06) 100%); backdrop-filter:blur(2.4px); }
.locked-roofing-page .xray-lens.visible{ display:block; }
.locked-roofing-page .xray-lens::before{ content:""; position:absolute; inset:15px; border-radius:50%; border:1px solid rgba(255,255,255,.18); }
.locked-roofing-page .xray-lens::after{ content:""; position:absolute; inset:0; border-radius:50%; box-shadow: inset 0 0 0 30px rgba(255,255,255,.03); }
.locked-roofing-page .xray-stack{ position:absolute; inset:0; }
.locked-roofing-page .xray-card{ position:absolute; left:34px; width:204px; height:44px; border-radius:8px; background:rgba(255,255,255,.07); box-shadow:0 5px 10px rgba(0,0,0,.10); border:1px solid rgba(255,255,255,.15); overflow:hidden; }
.locked-roofing-page .xray-card::after{ content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:1px; background:rgba(255,255,255,.22); }
.locked-roofing-page .xray-card img{ position:absolute; left:-10px; top:-52px; width:224px; height:150px; object-fit:contain; object-position:center center; filter:drop-shadow(0 2px 4px rgba(0,0,0,.12)); }
.locked-roofing-page .xray-name{ position:absolute; right:10px; top:6px; font-size:8.6px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.98); text-shadow:0 1px 3px rgba(0,0,0,.30); }
.locked-roofing-page .xray-card .guide{ position:absolute; left:0; right:0; bottom:0; height:8px; background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.08) 100%); }
.locked-roofing-page .xray-label{ position:absolute; left:20px; bottom:14px; z-index:3; font-size:10px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.96); text-shadow:0 1px 3px rgba(0,0,0,.36); }
.locked-roofing-page .pager{ position:absolute; right:46px; bottom:22px; display:flex; gap:10px; z-index:28; }
.locked-roofing-page .dot{ width:34px; height:4px; background:var(--inactive); transition:all .18s ease; }
.locked-roofing-page .dot.active{ width:46px; background:#141414; }
@media (max-width: 1500px){.locked-roofing-page .house-shell{ width:min(54vw,770px); top:24px; right:10px; }
.locked-roofing-page .stage-hint{ top:12px; left:44px; }}
@media (max-width: 1280px){.locked-roofing-page .header{ left:32px; right:32px; }
.locked-roofing-page .rule{ left:32px; right:32px; top:92px; }
.locked-roofing-page .layout{ padding:110px 32px 34px; grid-template-columns:minmax(300px, 38vw) 1fr; gap:16px; }
.locked-roofing-page .brand-logo{ height:34px; }
.locked-roofing-page .phone{ font-size:13px; letter-spacing:.12em; }
.locked-roofing-page .top-nav{ font-size:12px; }
.locked-roofing-page .kicker{ font-size:clamp(36px,5vh,54px); }
.locked-roofing-page .hero{ font-size:clamp(38px,5.7vh,56px); }
.locked-roofing-page .body{ font-size:clamp(13px,1.45vh,16px); }
.locked-roofing-page .house-shell{ width:min(56vw,714px); top:28px; right:4px; }
.locked-roofing-page .stage-hint{ left:34px; top:16px; font-size:10px; }
.locked-roofing-page .pager{ right:32px; bottom:20px; }}
@media (max-width: 1040px){.locked-roofing-page .header{ left:22px; right:22px; top:18px; flex-wrap:wrap; }
.locked-roofing-page .brand-wrap{ gap:12px; }
.locked-roofing-page .brand-logo{ height:28px; }
.locked-roofing-page .phone{ font-size:11px; letter-spacing:.10em; }
.locked-roofing-page .rule{ left:22px; right:22px; top:88px; }
.locked-roofing-page .layout{ grid-template-columns:1fr; padding:104px 22px 78px; gap:10px; }
.locked-roofing-page .left{ max-width:100%; }
.locked-roofing-page .hero{ max-width:100%; }
.locked-roofing-page .body{ max-width:92%; }
.locked-roofing-page .right{ min-height:44vh; }
.locked-roofing-page .stage-hint{ top:-12px; left:0; font-size:10px; }
.locked-roofing-page .house-shell{ left:50%; right:auto; transform:translateX(-50%); width:min(94vw,628px); top:4px; }
.locked-roofing-page .pager{ right:22px; bottom:18px; }
.locked-roofing-page .xray-lens{ width:240px; height:240px; }
.locked-roofing-page .xray-card{ left:28px; width:172px; height:37px; }
.locked-roofing-page .xray-card img{ width:190px; height:130px; left:-8px; top:-45px; }}
.locked-roofing-page .partner-divider{
  position: relative;
  padding: 54px 48px 56px;
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,248,248,.96) 100%);
  border-top: 1px solid rgba(0,0,0,.10);
  border-bottom: 1px solid rgba(0,0,0,.10);
}
.locked-roofing-page .partner-divider::before, .locked-roofing-page .partner-divider::after{
  content: "";
  position: absolute;
  left: 48px;
  right: 48px;
  height: 1px;
  background: rgba(0,0,0,.05);
}
.locked-roofing-page .partner-divider::before{ top: 16px; }
.locked-roofing-page .partner-divider::after{ bottom: 16px; }
.locked-roofing-page .partner-header{
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 18px;
  margin-bottom: 26px;
}
.locked-roofing-page .partner-overline{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #111;
  opacity: .75;
  margin-bottom: 10px;
}
.locked-roofing-page .partner-title{
  font-size: clamp(28px, 4vw, 58px);
  line-height: .95;
  font-weight: 900;
  letter-spacing: -.04em;
  color: #0d0d0d;
  margin: 0;
  text-transform: uppercase;
}
.locked-roofing-page .partner-copy{
  max-width: 500px;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(0,0,0,.64);
  margin: 0;
}
.locked-roofing-page .partner-grid{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}
.locked-roofing-page .partner-card{
  min-height: 138px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 20px;
  padding: 18px 18px 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  box-shadow: 0 14px 34px rgba(0,0,0,.045);
}
.locked-roofing-page .partner-logo-wrap{
  flex: 1;
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.locked-roofing-page .partner-card img{
  display: block;
  max-width: 100%;
  max-height: 80px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.locked-roofing-page .partner-card.maximum img{ max-height: 74px; }
.locked-roofing-page .partner-card.velux img{ max-height: 64px; }
.locked-roofing-page .partner-card.gaf img{ max-height: 56px; }
.locked-roofing-page .partner-name{
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(0,0,0,.56);
  text-align: center;
}
@media (max-width: 1100px){.locked-roofing-page .partner-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }}
@media (max-width: 800px){.locked-roofing-page .partner-divider{ padding: 42px 22px 44px; }
.locked-roofing-page .partner-divider::before, .locked-roofing-page .partner-divider::after{ left: 22px; right: 22px; }
.locked-roofing-page .partner-header{ display: block; }
.locked-roofing-page .partner-copy{ margin-top: 12px; max-width: none; }
.locked-roofing-page .partner-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.locked-roofing-page .partner-card{ min-height: 120px; border-radius: 16px; }}
@media (max-width: 560px){.locked-roofing-page .partner-grid{ grid-template-columns: 1fr; }}
.locked-roofing-page .xray-lens{
  width: 320px !important;
  height: 320px !important;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,.96) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,.12), 0 22px 42px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.22) !important;
  background: radial-gradient(circle at 32% 24%, rgba(255,255,255,.28) 0%, rgba(255,255,255,.12) 36%, rgba(255,255,255,.06) 100%) !important;
  backdrop-filter: blur(2.4px);
}
.locked-roofing-page .xray-lens::before{ inset: 14px !important; }
.locked-roofing-page .xray-lens::after{ box-shadow: inset 0 0 0 24px rgba(255,255,255,.03) !important; }
.locked-roofing-page .xray-stack{ position:absolute; inset:0; }
.locked-roofing-page .xray-stack.rebuilt{ perspective: 1000px; }
.locked-roofing-page .xray-stack.rebuilt .xr-shell{
  position:absolute; inset:0;
  transform-style: preserve-3d;
}
.locked-roofing-page .xray-stack.rebuilt .xr-title{
  position:absolute; left:28px; top:16px; right:28px;
  font-size: 10px; font-weight: 800; letter-spacing:.18em; text-transform:uppercase;
  color: rgba(255,255,255,.92); text-shadow:0 1px 4px rgba(0,0,0,.28);
}
.locked-roofing-page .xray-stack.rebuilt .xr-sub{
  position:absolute; left:28px; top:31px; right:28px;
  font-size: 8px; line-height:1.35; letter-spacing:.09em; text-transform:uppercase;
  color: rgba(255,255,255,.72); text-shadow:0 1px 3px rgba(0,0,0,.24);
}
.locked-roofing-page .xray-stack.rebuilt .xr-cutaway{
  position:absolute; left:50%; top:56%; width:220px; height:184px;
  transform: translate(-50%, -50%) rotateZ(-9deg) rotateX(16deg);
  transform-style: preserve-3d;
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer{
  position:absolute; left:18px; width:184px; border-radius:7px;
  overflow:hidden;
  clip-path: polygon(9% 0, 90% 0, 100% 100%, 0 100%);
  border:1px solid rgba(255,255,255,.18);
  box-shadow: 0 7px 14px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.18);
  transform-style: preserve-3d;
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer .tex{
  position:absolute; inset:-24px -18px;
  background-size: cover;
  background-position: center 22%;
  filter: saturate(1.03) contrast(1.03);
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer .shade{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(0,0,0,.06) 100%);
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer .edge{
  position:absolute; left:0; right:0; bottom:0; height:3px;
  background: rgba(255,255,255,.14);
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer .name{
  position:absolute; left:10px; top:50%; transform:translateY(-50%);
  font-size:7.4px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.95); text-shadow:0 1px 3px rgba(0,0,0,.34);
  background:rgba(0,0,0,.16); padding:2px 5px; border-radius:10px;
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer.ridge{ clip-path: polygon(5% 0, 95% 0, 100% 100%, 0 100%); }
.locked-roofing-page .xray-stack.rebuilt .xr-guide{
  position:absolute; left:50%; bottom:24px; transform:translateX(-50%);
  font-size:8px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.78); text-shadow:0 1px 3px rgba(0,0,0,.28);
}
.locked-roofing-page .xray-label{ bottom:12px !important; left:18px !important; font-size:10px !important; }
.locked-roofing-page .xray-lens{
  width: 360px !important;
  height: 360px !important;
  border-width: 2px !important;
  border-color: rgba(255,255,255,.98) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,.10), 0 24px 46px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.24) !important;
  background: radial-gradient(circle at 30% 24%, rgba(255,255,255,.30) 0%, rgba(255,255,255,.12) 34%, rgba(255,255,255,.05) 100%) !important;
  backdrop-filter: blur(2.2px);
}
.locked-roofing-page .xray-lens.visible{ animation: xrayAppear .12s ease-out; }
@keyframes xrayAppear { from { opacity:0; transform:scale(.96); } to { opacity:1; transform:scale(1); } }
.locked-roofing-page .xray-lens::before{ inset: 14px !important; }
.locked-roofing-page .xray-lens::after{ box-shadow: inset 0 0 0 26px rgba(255,255,255,.028) !important; }
.locked-roofing-page .xray-stack.rebuilt .xr-shell{ position:absolute; inset:0; transform-style:preserve-3d; }
.locked-roofing-page .xray-stack.rebuilt .xr-title{
  position:absolute; left:30px; top:18px; font-size:10px; font-weight:800; letter-spacing:.20em;
  color:rgba(255,255,255,.94); text-transform:uppercase; text-shadow:0 1px 4px rgba(0,0,0,.28);
}
.locked-roofing-page .xray-stack.rebuilt .xr-sub{
  position:absolute; left:30px; top:35px; right:28px; font-size:8px; line-height:1.35; letter-spacing:.10em;
  color:rgba(255,255,255,.72); text-transform:uppercase; text-shadow:0 1px 3px rgba(0,0,0,.26);
}
.locked-roofing-page .xray-stack.rebuilt .xr-cutaway{
  position:absolute; left:50%; top:58%; width:250px; height:228px;
  transform: translate(-50%, -50%) rotateZ(-9deg) rotateX(18deg);
  transform-style: preserve-3d;
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer{
  position:absolute; left:20px; width:210px; border-radius:8px; overflow:hidden;
  clip-path: polygon(11% 0, 92% 0, 100% 100%, 0 100%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow: 0 10px 20px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.16);
  transform-style:preserve-3d;
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer .tex{ position:absolute; inset:-28px -18px; background-size:cover; background-position:center 22%; }
.locked-roofing-page .xray-stack.rebuilt .xr-layer .shade{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(0,0,0,.08) 100%); }
.locked-roofing-page .xray-stack.rebuilt .xr-layer .edge{ position:absolute; left:0; right:0; bottom:0; height:4px; background:rgba(255,255,255,.14); }
.locked-roofing-page .xray-stack.rebuilt .xr-layer .side{
  position:absolute; right:-10px; top:4px; bottom:-1px; width:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.18));
  transform:skewY(35deg);
  transform-origin:left top;
  opacity:.62;
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer .name{
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  font-size:7.6px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.95); text-shadow:0 1px 3px rgba(0,0,0,.36);
  background:rgba(0,0,0,.18); padding:2px 6px; border-radius:10px;
}
.locked-roofing-page .xray-stack.rebuilt .xr-layer.ridge{ clip-path: polygon(6% 0, 96% 0, 100% 100%, 0 100%); }
.locked-roofing-page .xray-stack.rebuilt .xr-guide{
  position:absolute; left:50%; bottom:20px; transform:translateX(-50%);
  font-size:8px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.78); text-shadow:0 1px 3px rgba(0,0,0,.28);
}
.locked-roofing-page .xray-label{ bottom:12px !important; left:18px !important; font-size:10px !important; }
.locked-roofing-page .xray-lens{
  width: 286px !important;
  height: 286px !important;
  background: rgba(255,255,255,.08) !important;
  backdrop-filter: blur(1.2px);
  border: 2px solid rgba(255,255,255,.96) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,.11), 0 20px 42px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.20) !important;
}
.locked-roofing-page .xray-lens::before{ inset:14px !important; border-color:rgba(255,255,255,.15) !important; }
.locked-roofing-page .xray-lens::after{ box-shadow:inset 0 0 0 16px rgba(255,255,255,.022) !important; }
.locked-roofing-page .xray-stack.rebuilt{ position:absolute; inset:0; overflow:hidden; perspective:none !important; }
.locked-roofing-page .xray-stack.rebuilt .xr-shell{ position:absolute; inset:0; transform:none !important; }
.locked-roofing-page .xray-stack.rebuilt .xr-title, .locked-roofing-page .xray-stack.rebuilt .xr-sub, .locked-roofing-page .xray-stack.rebuilt .xr-guide, .locked-roofing-page .xray-stack.rebuilt .xr-cutaway{ display:none !important; }
.locked-roofing-page .xr-magnify{
  position:absolute; inset:0;
  background-repeat:no-repeat;
  background-color:rgba(255,255,255,.03);
  transition:opacity .10s ease;
}
.locked-roofing-page .xr-magnify::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 34% 26%, rgba(255,255,255,.10), rgba(255,255,255,0) 48%);
  pointer-events:none;
}
.locked-roofing-page .xr-detail{
  position:absolute; inset:0; opacity:0; pointer-events:none;
  transition:opacity .10s ease;
  background:linear-gradient(180deg, rgba(25,27,28,.16) 0%, rgba(20,20,20,.08) 100%);
}
.locked-roofing-page .xray-lens.roof-mode .xr-detail{ opacity:1; }
.locked-roofing-page .xray-lens.roof-mode .xr-magnify{ opacity:.08; }
.locked-roofing-page .xr-detail-head{
  position:absolute; left:26px; right:26px; top:20px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:12px;
}
.locked-roofing-page .xr-detail-kicker{ font-size:7px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.95); text-shadow:0 1px 3px rgba(0,0,0,.32); white-space:nowrap; }
.locked-roofing-page .xr-detail-note{ font-size:5.8px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:rgba(255,255,255,.70); text-align:right; text-shadow:0 1px 3px rgba(0,0,0,.30); white-space:nowrap; }
.locked-roofing-page .xr-roof-assembly{
  position:absolute; left:42px; right:42px; top:60px; bottom:34px;
  display:flex; flex-direction:column; justify-content:flex-start;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.18));
}
.locked-roofing-page .xr-piece{
  position:relative; width:100%; overflow:hidden;
  border-left:1px solid rgba(255,255,255,.14);
  border-right:1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.15);
  transform:none !important;
}
.locked-roofing-page .xr-piece .mat{
  position:absolute; inset:-16px -12px;
  background-size:cover; background-position:center;
}
.locked-roofing-page .xr-piece .surface{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(0,0,0,.08)); }
.locked-roofing-page .xr-piece .label{
  position:absolute; left:10px; top:50%; transform:translateY(-50%);
  font-size:5.8px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.96); text-shadow:0 1px 3px rgba(0,0,0,.42);
  padding:1px 5px; border-radius:10px; background:rgba(0,0,0,.20); max-width:calc(100% - 22px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.locked-roofing-page .xr-piece .thickness{
  position:absolute; right:0; top:0; bottom:0; width:6px;
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.28));
}
.locked-roofing-page .xr-piece .fasteners{
  position:absolute; inset:0;
  background-image:radial-gradient(circle, rgba(228,228,228,.55) 0 1px, transparent 1.5px);
  background-size:42px 100%; opacity:.38;
}
.locked-roofing-page .xr-piece.vent{ height:12px; border-radius:8px 8px 3px 3px; margin-bottom:2px; }
.locked-roofing-page .xr-piece.shingles{ height:28px; margin-bottom:3px; border-radius:4px; }
.locked-roofing-page .xr-piece.valley{ height:14px; margin-bottom:2px; border-radius:3px; }
.locked-roofing-page .xr-piece.under{ height:20px; margin-bottom:2px; }
.locked-roofing-page .xr-piece.ice{ height:16px; margin-bottom:2px; }
.locked-roofing-page .xr-piece.plywood{ height:24px; border-radius:3px 3px 8px 8px; }
.locked-roofing-page .xr-piece.shingles .mat{ filter:saturate(1.03) contrast(1.06); }
.locked-roofing-page .xr-piece.valley::after{
  content:""; position:absolute; left:50%; top:0; bottom:0; width:18px; transform:translateX(-50%);
  background:linear-gradient(90deg, rgba(170,175,180,.22), rgba(240,245,250,.56), rgba(90,95,100,.28));
  border-left:1px solid rgba(255,255,255,.24); border-right:1px solid rgba(0,0,0,.18);
}
.locked-roofing-page .xr-piece.under::after{
  content:""; position:absolute; left:18px; right:18px; top:50%; height:1px;
  background:repeating-linear-gradient(90deg, rgba(255,255,255,.24) 0 12px, transparent 12px 18px);
  opacity:.45;
}
.locked-roofing-page .xr-piece.ice::after{
  content:""; position:absolute; left:0; right:0; bottom:3px; height:3px;
  background:rgba(20,20,20,.20); box-shadow:0 1px 0 rgba(255,255,255,.08);
}
.locked-roofing-page .xr-piece.plywood::after{
  content:""; position:absolute; left:0; right:0; top:50%; height:1px;
  background:rgba(70,44,23,.25);
}
.locked-roofing-page .xr-bottom-note{
  position:absolute; left:0; right:0; bottom:8px;
  font-size:5px; font-weight:700; letter-spacing:.11em; text-align:center; text-transform:uppercase;
  color:rgba(255,255,255,.68); text-shadow:0 1px 3px rgba(0,0,0,.30);
}
.locked-roofing-page .xray-label{ display:none !important; }
.locked-roofing-page .xray-lens{
  background:rgba(255,255,255,.045) !important;
  backdrop-filter:blur(1.2px) !important;
}
.locked-roofing-page .xray-lens .xray-label, .locked-roofing-page .xray-lens .xr-detail, .locked-roofing-page .xray-lens .xr-magnify, .locked-roofing-page .xray-lens .xr-shell, .locked-roofing-page .xray-lens .xr-roof-assembly, .locked-roofing-page .xray-lens .xr-detail-head{ display:none !important; }
.locked-roofing-page .xray-stack{ position:absolute !important; inset:0 !important; overflow:hidden !important; }
.locked-roofing-page .xr-user-overlay{
  position:absolute;
  display:block;
  max-width:none !important;
  max-height:none !important;
  object-fit:fill;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
  filter:none;
}
.locked-roofing-page .flat-simple{background:#f2f2f0;color:#111;border-top:1px solid rgba(0,0,0,.10)}
.locked-roofing-page .flat-simple-head{min-height:34vh;padding:54px 48px 48px;display:grid;grid-template-columns:minmax(340px,.9fr) 1.1fr;gap:50px;align-items:end;border-bottom:1px solid rgba(0,0,0,.10)}
.locked-roofing-page .flat-simple-overline, .locked-roofing-page .flat-simple-step{font-size:11px;line-height:1.2;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:rgba(0,0,0,.62)}
.locked-roofing-page .flat-simple-head h2{margin:10px 0 0;font-size:clamp(42px,5.2vw,76px);line-height:.9;letter-spacing:-.055em;font-weight:900;text-transform:uppercase}
.locked-roofing-page .flat-simple-head p{margin:0 0 5px;max-width:680px;font-size:clamp(16px,1.6vw,23px);line-height:1.4;font-weight:600;color:rgba(0,0,0,.68)}
.locked-roofing-page .flat-simple-panel{height:100vh;min-height:680px;max-height:960px;padding:34px 48px;display:grid;grid-template-columns:minmax(300px,31vw) 1fr;gap:34px;align-items:center;border-bottom:1px solid rgba(0,0,0,.10);overflow:hidden}
.locked-roofing-page .flat-simple-copy{max-width:470px;align-self:center}
.locked-roofing-page .flat-simple-copy h3{margin:14px 0 16px;font-size:clamp(38px,5.05vw,67px);line-height:.9;letter-spacing:-.055em;font-weight:900;text-transform:uppercase}
.locked-roofing-page .flat-simple-lead{margin:0;font-size:clamp(14px,1.4vw,17px);line-height:1.48;color:rgba(0,0,0,.67)}
.locked-roofing-page .flat-simple-lead strong{color:#111}
.locked-roofing-page .flat-simple-points{margin-top:18px;display:grid;gap:9px}
.locked-roofing-page .flat-simple-points>div{display:grid;grid-template-columns:34px 1fr;gap:11px;padding-top:9px;border-top:1px solid rgba(0,0,0,.10)}
.locked-roofing-page .flat-simple-points b{width:29px;height:29px;display:grid;place-items:center;border:1px solid rgba(0,0,0,.18);border-radius:50%;font-size:10px}
.locked-roofing-page .flat-simple-points p{margin:0}
.locked-roofing-page .flat-simple-points strong{display:block;font-size:13px;margin-bottom:2px}
.locked-roofing-page .flat-simple-points span{display:block;font-size:12.5px;line-height:1.38;color:rgba(0,0,0,.62)}
.locked-roofing-page .plain-definition{margin-top:15px;padding:12px 14px;border-left:4px solid #111;background:rgba(255,255,255,.62);border-radius:0 12px 12px 0}
.locked-roofing-page .plain-definition b{display:block;font-size:10px;letter-spacing:.15em;margin-bottom:4px}
.locked-roofing-page .plain-definition span{font-size:12.5px;line-height:1.4;color:rgba(0,0,0,.64)}
.locked-roofing-page .slope-teaching-card{height:min(720px,calc(100vh - 68px));min-height:600px;border:1px solid rgba(0,0,0,.10);border-radius:26px;background:#fff;padding:18px;box-shadow:0 18px 50px rgba(0,0,0,.055);display:grid;grid-template-rows:auto 1fr auto;gap:12px;overflow:hidden}
.locked-roofing-page .teaching-head{display:flex;align-items:end;justify-content:space-between;gap:20px;border-bottom:1px solid rgba(0,0,0,.09);padding:0 2px 12px}
.locked-roofing-page .teaching-head>div:first-child span{display:block;font-size:9px;font-weight:800;letter-spacing:.17em;color:rgba(0,0,0,.52);margin-bottom:4px}
.locked-roofing-page .teaching-head>div:first-child strong{font-size:14px;letter-spacing:.10em}
.locked-roofing-page .water-result{text-align:right;white-space:nowrap}
.locked-roofing-page .water-result strong{display:block;font-size:27px;line-height:1}
.locked-roofing-page .water-result span{display:block;font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:rgba(0,0,0,.52);margin-top:3px}
.locked-roofing-page .cutaway-demo-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:12px;min-height:0}
.locked-roofing-page .cutaway-demo-panel, .locked-roofing-page .plan-demo-panel{position:relative;min-height:0;border:1px solid rgba(0,0,0,.08);border-radius:18px;background:#f6f6f4;overflow:hidden}
.locked-roofing-page .demo-mini-title{position:absolute;z-index:3;left:14px;right:14px;top:11px;display:flex;justify-content:space-between;gap:12px;align-items:center}
.locked-roofing-page .demo-mini-title b{font-size:9px;letter-spacing:.15em}
.locked-roofing-page .demo-mini-title span{font-size:9px;color:rgba(0,0,0,.55)}
.locked-roofing-page .slope-section-svg{position:absolute;left:8px;right:8px;top:36px;width:calc(100% - 16px);height:calc(100% - 62px)}
.locked-roofing-page .svg-white-label{fill:#fff;font:700 12px Arial;letter-spacing:1.2px}
.locked-roofing-page .svg-dark-label{fill:#111;font:700 11px Arial;letter-spacing:1px}
.locked-roofing-page .svg-blue-label{fill:#177aa9;font:800 12px Arial;letter-spacing:1px}
.locked-roofing-page .svg-callout-title{fill:#fff;font:800 12px Arial;letter-spacing:1px}
.locked-roofing-page .svg-callout-copy{fill:rgba(255,255,255,.78);font:600 10px Arial;letter-spacing:.4px}
.locked-roofing-page .layer-key-row{position:absolute;left:14px;right:14px;bottom:8px;display:flex;gap:6px;flex-wrap:wrap}
.locked-roofing-page .layer-key-row span{font-size:8px;font-weight:800;letter-spacing:.1em;padding:5px 8px;border-radius:999px}
.locked-roofing-page .key-membrane{background:#282b2e;color:#fff}
.locked-roofing-page .key-taper{background:#e6cf5e;color:#332d05}
.locked-roofing-page .key-deck{background:#bd8251;color:#fff}
.locked-roofing-page .plan-demo-panel canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.locked-roofing-page .demo-label{position:absolute;z-index:4;padding:7px 9px;border-radius:10px;background:rgba(255,255,255,.9);border:1px solid rgba(0,0,0,.08);box-shadow:0 5px 14px rgba(0,0,0,.08)}
.locked-roofing-page .demo-label b{display:block;font-size:8px;letter-spacing:.13em}
.locked-roofing-page .demo-label span{display:block;font-size:9px;color:rgba(0,0,0,.58);margin-top:2px}
.locked-roofing-page .demo-label-low{left:12%;top:39%}
.locked-roofing-page .demo-label-drain{right:8%;bottom:13%}
.locked-roofing-page .slope-control-strip{display:grid;grid-template-columns:minmax(160px,1fr) minmax(260px,1.8fr) auto;grid-template-rows:auto auto;column-gap:16px;row-gap:5px;align-items:center;padding-top:2px}
.locked-roofing-page .slope-control-title span{display:block;font-size:8px;font-weight:800;letter-spacing:.16em;color:rgba(0,0,0,.5)}
.locked-roofing-page .slope-control-title strong{display:block;font-size:11px;line-height:1.2;margin-top:3px}
.locked-roofing-page .slope-control-strip input{width:100%;accent-color:#111}
.locked-roofing-page .slope-scale{grid-column:2;display:flex;justify-content:space-between;font-size:8px;font-weight:800;letter-spacing:.08em;color:rgba(0,0,0,.48)}
.locked-roofing-page .slope-control-strip button{grid-column:3;grid-row:1/3;border:1px solid #111;background:#111;color:#fff;border-radius:999px;padding:12px 16px;font-size:9px;font-weight:800;letter-spacing:.13em;cursor:pointer}
.locked-roofing-page .flat-cutaway-card{height:min(700px,calc(100vh - 76px));min-height:590px;border:1px solid rgba(0,0,0,.10);border-radius:26px;background:#fff;padding:22px;box-shadow:0 18px 50px rgba(0,0,0,.05);display:flex;flex-direction:column;justify-content:center}
.locked-roofing-page .cutaway-title{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(0,0,0,.09);padding-bottom:11px;margin-bottom:12px}
.locked-roofing-page .cutaway-title span, .locked-roofing-page .cutaway-title strong{font-size:9px;letter-spacing:.15em}
.locked-roofing-page .cutaway-stack{display:grid;gap:6px}
.locked-roofing-page .cut-layer{min-height:66px;border-radius:12px;padding:10px 13px;display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:center;border:1px solid rgba(0,0,0,.09)}
.locked-roofing-page .cut-layer.cap{background:linear-gradient(180deg,#3c4043,#26292c);color:#fff}
.locked-roofing-page .cut-layer.base{background:linear-gradient(180deg,#5e6264,#44484b);color:#fff}
.locked-roofing-page .cut-layer.taper{background:linear-gradient(90deg,#efe09c,#d6c467)}
.locked-roofing-page .cut-layer.deck{background:repeating-linear-gradient(90deg,#c99258 0,#c99258 18px,#b9834c 19px,#b9834c 20px)}
.locked-roofing-page .cut-layer.structure{background:linear-gradient(135deg,#d8d8d3,#bdbdb7)}
.locked-roofing-page .cut-number{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;border:1px solid currentColor;font-size:10px;font-weight:900;opacity:.8}
.locked-roofing-page .cut-layer b{display:block;font-size:11px;letter-spacing:.13em;text-transform:uppercase;margin-bottom:3px}
.locked-roofing-page .cut-layer span{display:block;font-size:11.5px;line-height:1.35;opacity:.78}
.locked-roofing-page .cutaway-side-note{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px}
.locked-roofing-page .cutaway-side-note>div{position:relative;min-height:70px;padding:12px 12px 10px 46px;border:1px solid rgba(0,0,0,.09);border-radius:13px;background:#f5f5f3}
.locked-roofing-page .cutaway-side-note i{position:absolute;left:13px;top:14px;width:22px;height:22px;border-radius:50%;background:#111}
.locked-roofing-page .drain-mini i::after{content:"";position:absolute;inset:7px;border-radius:50%;background:#f5f5f3}
.locked-roofing-page .flash-mini i{border-radius:2px;background:linear-gradient(135deg,#999 0 40%,#e8e8e8 41% 60%,#777 61%)}
.locked-roofing-page .cutaway-side-note b{display:block;font-size:9px;letter-spacing:.13em;margin-bottom:3px}
.locked-roofing-page .cutaway-side-note span{font-size:10.5px;line-height:1.32;color:rgba(0,0,0,.62)}
.locked-roofing-page .assembly-note{margin:9px 2px 0;font-size:9.5px;line-height:1.35;color:rgba(0,0,0,.46)}
.locked-roofing-page .inspection-homeowner-card{height:min(730px,calc(100vh - 68px));min-height:610px;border:1px solid rgba(0,0,0,.10);border-radius:26px;background:#fff;padding:18px;box-shadow:0 18px 50px rgba(0,0,0,.05);display:grid;grid-template-rows:auto 1fr auto;gap:10px;overflow:hidden}
.locked-roofing-page .inspection-stage-head{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid rgba(0,0,0,.09);padding-bottom:10px}
.locked-roofing-page .inspection-stage-head span, .locked-roofing-page .inspection-stage-head strong{font-size:9px;letter-spacing:.15em}
.locked-roofing-page .inspection-main-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);gap:12px;min-height:0}
.locked-roofing-page .realistic-roof-map{border:1px solid rgba(0,0,0,.08);border-radius:18px;background:#f5f5f3;min-height:0;overflow:hidden}
.locked-roofing-page .realistic-roof-map svg{width:100%;height:100%;display:block}
.locked-roofing-page .map-pin circle{fill:#fff;stroke:#111;stroke-width:2}
.locked-roofing-page .map-pin text{font:800 12px Arial;text-anchor:middle;fill:#111}
.locked-roofing-page .map-label{font:800 10px Arial;letter-spacing:1px;fill:#111}
.locked-roofing-page .map-label.blue{fill:#177aa9}
.locked-roofing-page .homeowner-check-list{display:grid;grid-template-rows:repeat(6,1fr);border:1px solid rgba(0,0,0,.08);border-radius:18px;background:#fafaf9;padding:0 14px;overflow:hidden}
.locked-roofing-page .homeowner-check-list>div{display:grid;grid-template-columns:30px 1fr;gap:9px;padding:7px 0;border-bottom:1px solid rgba(0,0,0,.075);min-height:0;align-items:start}
.locked-roofing-page .homeowner-check-list>div:last-child{border-bottom:0}
.locked-roofing-page .homeowner-check-list>div>b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#111;color:#fff;font-size:9px}
.locked-roofing-page .homeowner-check-list p{margin:0}
.locked-roofing-page .homeowner-check-list strong{display:block;font-size:9.5px;letter-spacing:.09em;margin-bottom:2px}
.locked-roofing-page .homeowner-check-list span{display:block;font-size:10px;line-height:1.28;color:rgba(0,0,0,.62)}
.locked-roofing-page .homeowner-check-list em{font-style:normal;font-weight:800;color:rgba(0,0,0,.78)}
.locked-roofing-page .inspection-bottom-rule{display:flex;gap:10px;align-items:baseline;padding:8px 11px;border-radius:11px;background:#111;color:#fff}
.locked-roofing-page .inspection-bottom-rule b{font-size:9px;letter-spacing:.12em;white-space:nowrap}
.locked-roofing-page .inspection-bottom-rule span{font-size:10px;line-height:1.3;color:rgba(255,255,255,.76)}
@media (max-width:1280px){.locked-roofing-page .flat-simple-panel{grid-template-columns:minmax(280px,35vw) 1fr;gap:24px;padding:28px 32px}
.locked-roofing-page .flat-simple-copy h3{font-size:clamp(36px,4.7vw,58px)}
.locked-roofing-page .cutaway-demo-wrap{grid-template-columns:1fr}
.locked-roofing-page .cutaway-demo-panel{min-height:250px}
.locked-roofing-page .plan-demo-panel{min-height:210px}
.locked-roofing-page .slope-teaching-card{min-height:620px}
.locked-roofing-page .inspection-main-grid{grid-template-columns:1fr minmax(280px,.9fr)}}
@media (max-width:900px){.locked-roofing-page .flat-simple-head{grid-template-columns:1fr;padding:42px 22px;gap:18px;min-height:auto}
.locked-roofing-page .flat-simple-panel{height:auto;max-height:none;min-height:0;grid-template-columns:1fr;padding:46px 22px;overflow:visible}
.locked-roofing-page .flat-simple-copy{max-width:none}
.locked-roofing-page .slope-teaching-card, .locked-roofing-page .flat-cutaway-card, .locked-roofing-page .inspection-homeowner-card{height:auto;max-height:none;min-height:620px}
.locked-roofing-page .inspection-main-grid{grid-template-columns:1fr}
.locked-roofing-page .homeowner-check-list{grid-template-rows:none}
.locked-roofing-page .cutaway-side-note{grid-template-columns:1fr}}
.locked-roofing-page #slopedSticky{ z-index:40; }
.locked-roofing-page #slopedSticky.is-hidden{ opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }
.locked-roofing-page #preferredPartners{
  position:relative !important;
  z-index:80 !important;
  isolation:isolate;
  background:#fff !important;
}
.locked-roofing-page #flatRestore{
  position:relative !important;
  z-index:80 !important;
  isolation:isolate;
  clear:both;
  background:#f2f2f0 !important;
  overflow:clip;
}
.locked-roofing-page #flatRestore .flat-simple-head, .locked-roofing-page #flatRestore .flat-simple-panel{
  position:relative;
  z-index:1;
  overflow:hidden;
}
.locked-roofing-page #flatRestore .slope-teaching-card, .locked-roofing-page #flatRestore .flat-cutaway-card, .locked-roofing-page #flatRestore .inspection-homeowner-card{
  position:relative;
  contain:paint;
}
.locked-roofing-page #simpleWaterDemo{height:min(700px,calc(100vh - 54px));min-height:560px;overflow:hidden}
.locked-roofing-page #simpleWaterDemo .water-result strong{color:#d71920!important}
.locked-roofing-page #simpleWaterDemo .cutaway-demo-wrap{grid-template-columns:1.08fr .92fr;gap:12px;min-height:0}
.locked-roofing-page #simpleWaterDemo .cutaway-demo-panel, .locked-roofing-page #simpleWaterDemo .plan-demo-panel{min-width:0;min-height:0}
.locked-roofing-page #simpleWaterDemo .demo-mini-title{left:16px;right:16px;top:12px;line-height:1.15}
.locked-roofing-page #simpleWaterDemo .demo-mini-title span{max-width:62%;text-align:right;line-height:1.2}
.locked-roofing-page #simpleWaterDemo .slope-control-strip{padding-top:10px;border-top:1px solid rgba(0,0,0,.08);min-width:0}
.locked-roofing-page #simpleWaterDemo .slope-control-title, .locked-roofing-page #simpleWaterDemo .slope-control-strip input, .locked-roofing-page #simpleWaterDemo .slope-scale{min-width:0}
.locked-roofing-page #simpleWaterDemo .slope-control-title strong{line-height:1.28}
.locked-roofing-page #simpleWaterDemo .slope-scale{gap:12px;line-height:1.25;white-space:normal}
.locked-roofing-page #simpleWaterDemo .slope-scale span:last-child{text-align:right}
@media (max-width:1280px) and (min-width:1051px){.locked-roofing-page #simpleWaterDemo .cutaway-demo-wrap{grid-template-columns:1.06fr .94fr!important}
.locked-roofing-page #simpleWaterDemo .cutaway-demo-panel, .locked-roofing-page #simpleWaterDemo .plan-demo-panel{min-height:0!important}
.locked-roofing-page #simpleWaterDemo{min-height:560px!important}}
@media (max-width:1050px){.locked-roofing-page #simpleWaterDemo{height:auto;max-height:none;min-height:690px;overflow:visible}
.locked-roofing-page #simpleWaterDemo .cutaway-demo-wrap{grid-template-columns:1fr!important}
.locked-roofing-page #simpleWaterDemo .cutaway-demo-panel{min-height:260px!important}
.locked-roofing-page #simpleWaterDemo .plan-demo-panel{min-height:230px!important}}
.locked-roofing-page #simpleWaterDemo .cutaway-demo-wrap{grid-template-columns:1fr 1fr!important}
.locked-roofing-page #simpleWaterDemo .slope-section-svg{overflow:visible}
.locked-roofing-page #simpleWaterDemo .svg-callout-title{font-size:10.5px;letter-spacing:.75px}
.locked-roofing-page #simpleWaterDemo .svg-callout-copy{font-size:9.5px;letter-spacing:.25px}
.locked-roofing-page #simpleWaterDemo .svg-dark-label{font-size:9.5px;letter-spacing:.65px}
.locked-roofing-page #simpleWaterDemo .svg-blue-label{font-size:10px;letter-spacing:.7px}
.locked-roofing-page #simpleWaterDemo .cutaway-demo-panel, .locked-roofing-page #simpleWaterDemo .plan-demo-panel{overflow:hidden}
.locked-roofing-page #simpleWaterDemo .demo-label-drain{right:6%;bottom:10%}
@media (max-width:1280px) and (min-width:1051px){.locked-roofing-page #simpleWaterDemo .cutaway-demo-wrap{grid-template-columns:1fr 1fr!important}}
.locked-roofing-page #simpleWaterDemo .demo-label-drain{right:7%!important;bottom:12%!important}
.locked-roofing-page #simpleWaterDemo .plan-demo-panel canvas{image-rendering:auto}
.locked-roofing-page #simpleWaterDemo .unified-plan-panel{overflow:hidden!important;background:#f6f6f4!important}
.locked-roofing-page #simpleWaterDemo .unified-plan-panel #simpleWaterCanvas{display:none!important}
.locked-roofing-page #simpleWaterDemo .unified-roof-svg{position:absolute;left:10px;right:10px;top:38px;width:calc(100% - 20px);height:calc(100% - 48px);display:block;overflow:visible}
.locked-roofing-page #simpleWaterDemo .unified-title{font:800 15px Arial;letter-spacing:1.5px;fill:#171717}
.locked-roofing-page #simpleWaterDemo .unified-copy{font:500 12px Arial;fill:#626262}
.locked-roofing-page #simpleWaterDemo .unified-path-title{font:800 13px Arial;letter-spacing:1.25px;fill:#fff}
.locked-roofing-page #simpleWaterDemo .unified-path-copy{font:500 10px Arial;fill:rgba(255,255,255,.78)}
.locked-roofing-page #simpleWaterDemo .demo-label-low, .locked-roofing-page #simpleWaterDemo .demo-label-drain{display:none!important}
.locked-roofing-page .v31-layers-panel, .locked-roofing-page .v31-life-panel{padding-top:28px!important;padding-bottom:28px!important}
.locked-roofing-page .v31-assembly-card, .locked-roofing-page .v31-life-card{
  height:min(735px,calc(100vh - 58px));min-height:600px;border:1px solid rgba(0,0,0,.10);border-radius:26px;
  background:#fff;padding:18px;box-shadow:0 18px 50px rgba(0,0,0,.05);overflow:hidden;display:grid;gap:12px
}
.locked-roofing-page .v31-assembly-card{grid-template-rows:auto 1fr auto}
.locked-roofing-page .v31-life-card{grid-template-rows:auto 1fr auto}
.locked-roofing-page .v31-card-head{display:flex;align-items:end;justify-content:space-between;gap:18px;padding:0 2px 11px;border-bottom:1px solid rgba(0,0,0,.09)}
.locked-roofing-page .v31-card-head div{display:grid;gap:4px}
.locked-roofing-page .v31-card-head span{font-size:9px;font-weight:800;letter-spacing:.16em;color:rgba(0,0,0,.54)}
.locked-roofing-page .v31-card-head strong{font-size:17px;letter-spacing:.01em}
.locked-roofing-page .v31-card-head em{font-style:normal;font-size:10px;color:rgba(0,0,0,.50);white-space:nowrap}
.locked-roofing-page .v31-assembly-grid{display:grid;grid-template-columns:minmax(390px,1.03fr) minmax(350px,.97fr);gap:14px;min-height:0}
.locked-roofing-page .v31-roof-cutaway{position:relative;min-height:0;border:1px solid rgba(0,0,0,.08);border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#f8f8f6 0%,#eeeeeb 100%)}
.locked-roofing-page .v31-roof-cutaway::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 58% 32%,rgba(255,255,255,.9),rgba(255,255,255,0) 42%);pointer-events:none}
.locked-roofing-page .v31-wall{position:absolute;left:9%;top:8%;width:34%;height:35%;z-index:4}
.locked-roofing-page .v31-wall-cap{position:absolute;left:0;right:0;top:0;height:18px;background:linear-gradient(180deg,#383a3b 0 28%,#8a8c89 29% 100%);transform:skewX(-18deg);box-shadow:0 4px 7px rgba(0,0,0,.16)}
.locked-roofing-page .v31-wall-face{position:absolute;left:5%;right:6%;top:16px;height:88px;background:repeating-linear-gradient(180deg,#e2e0da 0 13px,#d7d5cf 14px 15px);border:1px solid #aaa9a4;box-shadow:8px 10px 18px rgba(0,0,0,.09)}
.locked-roofing-page .v31-flashing-upturn{position:absolute;left:7%;right:9%;bottom:0;height:31px;background:linear-gradient(180deg,#353839,#252829);clip-path:polygon(0 30%,100% 0,100% 100%,0 100%)}
.locked-roofing-page .v31-wall span{position:absolute;left:10%;bottom:-19px;font-size:7px;font-weight:800;letter-spacing:.12em}
.locked-roofing-page .v31-roof-perspective{position:absolute;left:11%;right:8%;top:36%;height:48%;transform:skewY(-4deg);transform-origin:left top;filter:drop-shadow(0 14px 14px rgba(0,0,0,.16))}
.locked-roofing-page .v31-layer{position:absolute;left:0;right:0;border-left:1px solid rgba(0,0,0,.14);border-right:1px solid rgba(0,0,0,.14);overflow:hidden}
.locked-roofing-page .v31-layer i{position:absolute;inset:0;opacity:.95}
.locked-roofing-page .v31-layer b{position:absolute;left:12px;top:50%;transform:translateY(-50%) skewY(4deg);font-size:7px;letter-spacing:.12em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.55);z-index:2}
.locked-roofing-page .v31-cap{top:0;height:42px;background:#272b2d;border-radius:5px 5px 0 0}
.locked-roofing-page .v31-cap i{background:repeating-linear-gradient(18deg,rgba(255,255,255,.035) 0 2px,transparent 2px 7px),radial-gradient(circle at 15% 30%,#555 0 1px,transparent 2px);background-size:auto,14px 14px}
.locked-roofing-page .v31-cap::after{content:"";position:absolute;left:56%;top:0;bottom:0;width:3px;background:rgba(218,222,224,.45)}
.locked-roofing-page .v31-base{top:42px;height:24px;background:linear-gradient(180deg,#34383a,#1f2224)}
.locked-roofing-page .v31-base i{background:repeating-linear-gradient(90deg,transparent 0 48px,rgba(255,255,255,.08) 49px 50px)}
.locked-roofing-page .v31-board{top:66px;height:28px;background:linear-gradient(180deg,#c3b69a,#a99d83)}
.locked-roofing-page .v31-board i{background:repeating-linear-gradient(0deg,rgba(92,78,52,.12) 0 1px,transparent 1px 5px)}
.locked-roofing-page .v31-board b{color:#222;text-shadow:none}
.locked-roofing-page .v31-insulation{top:94px;height:94px;background:linear-gradient(180deg,#f0d36c,#d7b84b);clip-path:polygon(0 3%,100% 28%,100% 100%,0 100%)}
.locked-roofing-page .v31-insulation i{background:repeating-linear-gradient(90deg,transparent 0 56px,rgba(120,91,0,.12) 57px 58px)}
.locked-roofing-page .v31-insulation b{color:#342b12;text-shadow:none;top:60%}
.locked-roofing-page .v31-vapor{top:188px;height:15px;background:linear-gradient(180deg,#2b7d91,#14596c)}
.locked-roofing-page .v31-vapor b{font-size:6.5px}
.locked-roofing-page .v31-deck{top:203px;height:60px;background:repeating-linear-gradient(90deg,#a66c3e 0 52px,#8a5732 53px 55px);border-radius:0 0 5px 5px}
.locked-roofing-page .v31-deck i{background:linear-gradient(180deg,rgba(255,255,255,.16),transparent)}
.locked-roofing-page .v31-drain-detail{position:absolute;right:7%;top:39%;width:92px;height:178px;z-index:6}
.locked-roofing-page .v31-drain-ring{position:absolute;right:7px;top:0;width:52px;height:29px;border-radius:50%;background:#242729;border:7px solid #a9afb0;box-shadow:0 3px 7px rgba(0,0,0,.22)}
.locked-roofing-page .v31-drain-ring span{position:absolute;inset:5px;border-radius:50%;border:2px solid #777f82;background:repeating-conic-gradient(#757c80 0 8deg,#262a2c 9deg 18deg)}
.locked-roofing-page .v31-drain-pipe{position:absolute;right:28px;top:26px;width:15px;height:126px;background:linear-gradient(90deg,#707779,#2d3234 50%,#707779);border-radius:0 0 5px 5px}
.locked-roofing-page .v31-drain-arrow{position:absolute;right:-9px;bottom:0;font-size:6.5px;font-weight:800;letter-spacing:.1em;white-space:nowrap}
.locked-roofing-page .v31-cutaway-caption{position:absolute;left:7%;bottom:4%;width:64%;padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.88);border:1px solid rgba(0,0,0,.08);box-shadow:0 8px 22px rgba(0,0,0,.05)}
.locked-roofing-page .v31-cutaway-caption b{display:block;font-size:7.5px;letter-spacing:.11em;margin-bottom:3px}
.locked-roofing-page .v31-cutaway-caption span{display:block;font-size:9px;line-height:1.32;color:rgba(0,0,0,.62)}
.locked-roofing-page .v31-layer-guide{display:grid;grid-template-rows:repeat(6,1fr);border:1px solid rgba(0,0,0,.08);border-radius:18px;padding:0 13px;background:#fafaf8;overflow:hidden}
.locked-roofing-page .v31-guide-row{display:grid;grid-template-columns:30px 1fr;gap:9px;align-items:start;padding:7px 0;border-bottom:1px solid rgba(0,0,0,.075);min-height:0}
.locked-roofing-page .v31-guide-row:last-child{border-bottom:0}
.locked-roofing-page .v31-guide-row>b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#111;color:#fff;font-size:8px}
.locked-roofing-page .v31-guide-row p{margin:0}
.locked-roofing-page .v31-guide-row strong{display:block;font-size:9px;letter-spacing:.055em;margin-bottom:2px}
.locked-roofing-page .v31-guide-row span{display:block;font-size:9px;line-height:1.27;color:rgba(0,0,0,.61)}
.locked-roofing-page .v31-guide-row em{font-style:normal;font-weight:800;color:rgba(0,0,0,.77)}
.locked-roofing-page .v31-guide-row.cap>b{background:#2c3032}
.locked-roofing-page .v31-guide-row.base>b{background:#4c5153}
.locked-roofing-page .v31-guide-row.board>b{background:#a18a5e}
.locked-roofing-page .v31-guide-row.insulation>b{background:#c69e22}
.locked-roofing-page .v31-guide-row.vapor>b{background:#176d83}
.locked-roofing-page .v31-guide-row.deck>b{background:#8c5730}
.locked-roofing-page .v31-detail-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.locked-roofing-page .v31-detail-strip>div{display:grid;grid-template-columns:32px 1fr;gap:8px;align-items:center;padding:8px 10px;border-radius:12px;border:1px solid rgba(0,0,0,.08);background:#f5f5f3}
.locked-roofing-page .v31-detail-strip p{margin:0}
.locked-roofing-page .v31-detail-strip b{display:block;font-size:8px;letter-spacing:.1em;margin-bottom:2px}
.locked-roofing-page .v31-detail-strip em{display:block;font-style:normal;font-size:8.5px;line-height:1.25;color:rgba(0,0,0,.58)}
.locked-roofing-page .v31-detail-icon{width:28px;height:28px;display:block;position:relative}
.locked-roofing-page .v31-detail-icon.wall{border-left:7px solid #333;border-bottom:5px solid #222}
.locked-roofing-page .v31-detail-icon.wall::after{content:"";position:absolute;left:7px;bottom:5px;width:17px;height:10px;background:#777;clip-path:polygon(0 100%,100% 35%,100% 100%)}
.locked-roofing-page .v31-detail-icon.drain{border:5px solid #8d9496;border-radius:50%;background:repeating-conic-gradient(#777 0 9deg,#222 10deg 18deg)}
.locked-roofing-page .v31-detail-icon.seam::before, .locked-roofing-page .v31-detail-icon.seam::after{content:"";position:absolute;left:1px;right:1px;height:9px;background:#333;border-radius:2px}
.locked-roofing-page .v31-detail-icon.seam::before{top:4px}
.locked-roofing-page .v31-detail-icon.seam::after{top:15px}
.locked-roofing-page .v31-detail-icon.seam{border-top:2px solid #aaa;transform:skewX(-10deg)}
.locked-roofing-page .v31-life-layout{display:grid;grid-template-columns:minmax(365px,.92fr) minmax(380px,1.08fr);gap:14px;min-height:0}
.locked-roofing-page .v31-life-stack{display:grid;grid-template-rows:repeat(5,1fr);gap:7px}
.locked-roofing-page .v31-factor{position:relative;display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:8px 12px;border-radius:14px;border:1px solid rgba(0,0,0,.08);overflow:hidden;background:#f8f8f6}
.locked-roofing-page .v31-factor::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--accent)}
.locked-roofing-page .v31-factor-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--accent);color:#fff;font-size:9px;font-weight:900}
.locked-roofing-page .v31-factor b{display:block;font-size:10px;letter-spacing:.08em;margin-bottom:3px}
.locked-roofing-page .v31-factor span{display:block;font-size:9px;line-height:1.28;color:rgba(0,0,0,.61)}
.locked-roofing-page .v31-factor>i{font-style:normal;font-size:7px;font-weight:800;letter-spacing:.13em;color:var(--accent)}
.locked-roofing-page .v31-factor.material{--accent:#b74437}
.locked-roofing-page .v31-factor.install{--accent:#4b8e96}
.locked-roofing-page .v31-factor.drainage{--accent:#19778a}
.locked-roofing-page .v31-factor.moisture{--accent:#c49327}
.locked-roofing-page .v31-factor.maintenance{--accent:#285c79}
.locked-roofing-page .v31-life-visual{display:grid;grid-template-rows:1fr auto;gap:10px;border:1px solid rgba(0,0,0,.08);border-radius:18px;background:#f5f5f3;padding:12px;min-height:0}
.locked-roofing-page .v31-life-roof{position:relative;min-height:0;border-radius:14px;overflow:hidden;background:linear-gradient(145deg,#4c5153,#313638);border:8px solid #85898a;box-shadow:inset 0 0 0 2px #272b2d}
.locked-roofing-page .life-surface{position:absolute;inset:14px;background:repeating-linear-gradient(0deg,transparent 0 54px,rgba(255,255,255,.11) 55px 57px),repeating-linear-gradient(90deg,transparent 0 110px,rgba(0,0,0,.09) 111px 113px)}
.locked-roofing-page .life-wall{position:absolute;left:0;right:0;top:0;height:31px;background:linear-gradient(180deg,#d8d8d4,#aeb1ad);border-bottom:7px solid #323638;z-index:3}
.locked-roofing-page .life-drain{position:absolute;right:14%;bottom:18%;width:48px;height:48px;border-radius:50%;border:7px solid #aeb4b5;background:#262a2c;z-index:4}
.locked-roofing-page .life-drain span{position:absolute;inset:5px;border-radius:50%;background:repeating-conic-gradient(#777 0 8deg,#222 9deg 17deg)}
.locked-roofing-page .life-unit{position:absolute;left:55%;top:28%;width:110px;height:73px;border:10px solid #d3d6d5;background:linear-gradient(145deg,#a8adae,#7a8183);box-shadow:0 10px 16px rgba(0,0,0,.18)}
.locked-roofing-page .life-pipe{position:absolute;left:23%;top:33%;width:36px;height:36px;border-radius:50%;border:8px solid #b2b7b8;background:#24282a}
.locked-roofing-page .life-seam{position:absolute;left:8%;right:8%;height:2px;background:rgba(255,255,255,.16)}
.locked-roofing-page .life-seam.s1{top:43%}
.locked-roofing-page .life-seam.s2{top:61%}
.locked-roofing-page .life-seam.s3{top:79%}
.locked-roofing-page .life-arrow{position:absolute;z-index:5;padding:7px 9px;border-radius:10px;background:rgba(255,255,255,.93);border:1px solid rgba(0,0,0,.08);box-shadow:0 7px 18px rgba(0,0,0,.09)}
.locked-roofing-page .life-arrow b{display:block;font-size:7.5px;letter-spacing:.1em}
.locked-roofing-page .life-arrow span{display:block;font-size:8px;color:rgba(0,0,0,.58);margin-top:2px}
.locked-roofing-page .life-arrow.a1{left:7%;bottom:8%}
.locked-roofing-page .life-arrow.a2{right:5%;top:12%}
.locked-roofing-page .life-arrow.a3{right:31%;bottom:6%}
.locked-roofing-page .v31-life-summary{padding:9px 11px;border-radius:11px;background:#fff;border:1px solid rgba(0,0,0,.075)}
.locked-roofing-page .v31-life-summary strong{display:block;font-size:8px;letter-spacing:.12em;margin-bottom:3px}
.locked-roofing-page .v31-life-summary span{display:block;font-size:9px;line-height:1.3;color:rgba(0,0,0,.60)}
.locked-roofing-page .v31-owner-strip{display:flex;gap:10px;align-items:baseline;padding:9px 12px;border-radius:12px;background:#111;color:#fff}
.locked-roofing-page .v31-owner-strip>b{font-size:8px;letter-spacing:.12em;white-space:nowrap}
.locked-roofing-page .v31-owner-strip>span{font-size:9px;line-height:1.3;color:rgba(255,255,255,.75)}
.locked-roofing-page .v31-owner-strip strong{color:#fff}
@media (max-width:1280px){.locked-roofing-page .v31-assembly-grid{grid-template-columns:minmax(350px,1fr) minmax(315px,1fr)}
.locked-roofing-page .v31-life-layout{grid-template-columns:minmax(340px,.95fr) minmax(340px,1.05fr)}
.locked-roofing-page .v31-guide-row span, .locked-roofing-page .v31-factor span{font-size:8.5px}
.locked-roofing-page .v31-roof-perspective{left:8%;right:5%}
.locked-roofing-page .v31-assembly-card, .locked-roofing-page .v31-life-card{height:min(720px,calc(100vh - 54px))}}
@media (max-width:900px){.locked-roofing-page .v31-layers-panel, .locked-roofing-page .v31-life-panel{padding-top:46px!important;padding-bottom:46px!important}
.locked-roofing-page .v31-assembly-card, .locked-roofing-page .v31-life-card{height:auto;max-height:none;min-height:0}
.locked-roofing-page .v31-assembly-grid, .locked-roofing-page .v31-life-layout{grid-template-columns:1fr}
.locked-roofing-page .v31-roof-cutaway{min-height:560px}
.locked-roofing-page .v31-layer-guide{grid-template-rows:none}
.locked-roofing-page .v31-guide-row{min-height:72px}
.locked-roofing-page .v31-detail-strip{grid-template-columns:1fr}
.locked-roofing-page .v31-life-roof{min-height:460px}
.locked-roofing-page .v31-life-stack{grid-template-rows:none}
.locked-roofing-page .v31-factor{min-height:80px}
.locked-roofing-page .v31-card-head{align-items:start}
.locked-roofing-page .v31-card-head em{white-space:normal;text-align:right}}
.locked-roofing-page .v32-life-card{height:min(720px,calc(100vh - 68px));min-height:600px;display:grid;grid-template-rows:auto 1fr auto;gap:14px;padding:20px;background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:26px;box-shadow:0 18px 50px rgba(0,0,0,.05);overflow:hidden}
.locked-roofing-page .v32-life-head{padding-bottom:12px}
.locked-roofing-page .v32-life-head em{font-size:9px!important;letter-spacing:.08em!important;color:rgba(0,0,0,.50)!important}
.locked-roofing-page .v32-factor-board{display:grid;grid-template-rows:repeat(5,1fr);gap:9px;min-height:0;align-self:stretch}
.locked-roofing-page .v32-factor-row{--factor:#2c3033;position:relative;display:grid;grid-template-columns:72px minmax(0,1fr) 105px;align-items:center;min-height:0;border-radius:16px;overflow:hidden;background:linear-gradient(90deg,var(--factor) 0 72px,rgba(248,248,246,.98) 72px);border:1px solid rgba(0,0,0,.08);box-shadow:0 7px 18px rgba(0,0,0,.035)}
.locked-roofing-page .v32-factor-row::after{content:"";position:absolute;right:0;top:0;bottom:0;width:18px;background:var(--factor);clip-path:polygon(0 0,100% 50%,0 100%);opacity:.92}
.locked-roofing-page .v32-factor-icon{height:100%;display:grid;place-items:center;color:#fff;background:var(--factor)}
.locked-roofing-page .v32-factor-icon span{width:34px;height:34px;border:2px solid rgba(255,255,255,.82);border-radius:10px;display:grid;place-items:center;font-size:10px;font-weight:900;letter-spacing:.08em}
.locked-roofing-page .v32-factor-copy{padding:11px 18px 11px 20px;min-width:0}
.locked-roofing-page .v32-factor-copy b{display:block;font-size:13px;line-height:1.1;letter-spacing:.08em;margin-bottom:5px}
.locked-roofing-page .v32-factor-copy span{display:block;font-size:10.5px;line-height:1.34;color:rgba(0,0,0,.62);max-width:690px}
.locked-roofing-page .v32-factor-end{padding:0 26px 0 8px;text-align:right;font-size:7.5px;font-weight:900;letter-spacing:.15em;color:var(--factor);white-space:nowrap}
.locked-roofing-page .v32-factor-row.material{--factor:#813f38}
.locked-roofing-page .v32-factor-row.install{--factor:#536f73}
.locked-roofing-page .v32-factor-row.drainage{--factor:#2f6670}
.locked-roofing-page .v32-factor-row.moisture{--factor:#9a762d}
.locked-roofing-page .v32-factor-row.maintenance{--factor:#354f61}
.locked-roofing-page .v32-simple-formula{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px;padding:11px 12px;border-radius:13px;background:#111;color:#fff;text-align:center}
.locked-roofing-page .v32-simple-formula span{font-size:7.5px;font-weight:800;letter-spacing:.10em;white-space:nowrap}
.locked-roofing-page .v32-simple-formula i{font-style:normal;color:rgba(255,255,255,.45);font-size:10px}
.locked-roofing-page .v32-simple-formula b{flex-basis:100%;font-size:9px;letter-spacing:.12em;margin-top:1px}
@media (max-width:1280px){.locked-roofing-page .v32-factor-row{grid-template-columns:62px minmax(0,1fr) 88px}
.locked-roofing-page .v32-factor-copy{padding-left:16px}
.locked-roofing-page .v32-factor-copy span{font-size:9.5px}
.locked-roofing-page .v32-factor-end{font-size:6.8px}
.locked-roofing-page .v32-life-card{height:min(710px,calc(100vh - 58px))}}
@media (max-width:900px){.locked-roofing-page .v32-life-card{height:auto;min-height:0}
.locked-roofing-page .v32-factor-board{grid-template-rows:none}
.locked-roofing-page .v32-factor-row{min-height:96px;grid-template-columns:58px 1fr}
.locked-roofing-page .v32-factor-end{display:none}
.locked-roofing-page .v32-factor-row::after{display:none}
.locked-roofing-page .v32-factor-copy b{font-size:12px}
.locked-roofing-page .v32-factor-copy span{font-size:10px}}
/* v1.4 WordPress admin-toolbar clearance: only the logo/phone header moves down for logged-in editors. */
@media (min-width:783px){
  body.admin-bar .locked-roofing-page .header{top:40px!important;}
}
@media (max-width:782px){
  body.admin-bar .locked-roofing-page .header{top:54px!important;}
}
