/* ============================================================
   Roof Estimate Tool page
   Hero plate is 1708x715 (2.389:1) and is never cropped: it
   scales width-based and every label is pinned in % / cqw of
   the plate, measured off the supplied no-text comp.
   The tool itself is embedded so its own stylesheet cannot
   collide with aa-index.css.
   ============================================================ */

.rthero{background:#fff;}
.rthero .layer{color:var(--navy);}
.rthero .ov{z-index:2;}

/* --- stopwatch dial: 60 / SECOND ------------------------- */
.rt-dial{
  left:17.5%;top:23.19%;width:13.5%;margin:0;text-align:center;
  color:var(--navy) !important;
  text-shadow:0 .1cqw .34cqw rgba(255,255,255,.6);
}
.rt-dial b{
  display:block;font-family:var(--display,"Archivo Narrow",Arial,sans-serif);
  font-weight:700;font-size:6.6cqw;line-height:1;letter-spacing:-.01em;
}
.rt-dial span{
  display:block;font-family:var(--ui,"Archivo",Arial,sans-serif);
  font-weight:800;font-size:1.9cqw;line-height:1;letter-spacing:.11em;
  margin-top:.25cqw;
}

/* --- headline -------------------------------------------- */
.rt-h1{
  left:2.4%;top:58.57%;width:29%;margin:0;
  font-family:var(--display,"Archivo Narrow",Arial,sans-serif);
  font-weight:700;font-style:italic;font-size:3.15cqw;line-height:1.08;
  letter-spacing:.005em;color:var(--navy);
}
.rt-h1 i{display:block;font-style:italic;}
.rt-h1 .red{color:#D01A28;}

/* --- labels under the four badges ------------------------ */
.rt-badges{left:0;right:0;top:0;bottom:0;margin:0;padding:0;list-style:none;}
.rt-badges li{
  position:absolute;top:94.83%;transform:translateX(-50%);
  font-family:var(--ui,"Archivo",Arial,sans-serif);font-weight:800;
  font-size:1.15cqw;letter-spacing:.03em;color:var(--navy);white-space:nowrap;
}
.rt-badges li:nth-child(1){left:8.31%;}
.rt-badges li:nth-child(2){left:17.51%;}
.rt-badges li:nth-child(3){left:26.82%;}
.rt-badges li:nth-child(4){left:35.89%;}

/* --- call to action under the hero ----------------------- */
.rt-cta-wrap{background:#fff;text-align:center;padding:26px 16px 30px;}
.rt-cta{
  display:inline-flex;align-items:center;gap:14px;
  background:#D01A28;color:#fff;text-decoration:none;
  font-family:var(--ui,"Archivo",Arial,sans-serif);font-weight:900;
  font-size:1.35rem;letter-spacing:.02em;
  padding:16px 40px;border-radius:8px;
  box-shadow:0 8px 22px rgba(160,0,0,.28);
  transition:background .15s ease,transform .15s ease;
}
.rt-cta:hover{background:#b00000;transform:translateY(-1px);}
.rt-cta svg{width:26px;height:26px;fill:#fff;}

/* --- embedded tool --------------------------------------- */
.rt-tool{background:#f2f5fa;padding:0 0 8px;}
.rt-tool iframe{
  display:block;width:100%;border:0;min-height:1500px;
  background:transparent;
}

/* --- mobile ---------------------------------------------- */
@media (max-width:900px){
  .rthero .layer{position:static;padding:18px 16px 4px;background:#f2f5fa;}
  .rthero .ov{position:static;width:auto !important;height:auto !important;
    transform:none;text-align:left;}
  .rt-dial{margin:0 0 10px;}
  .rt-dial b{font-size:2.6rem;}
  .rt-dial span{font-size:.95rem;letter-spacing:.14em;margin-top:2px;}
  .rt-h1{font-size:1.85rem;line-height:1.12;margin:0 0 14px;}
  .rt-badges{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0 0 4px;}
  .rt-badges li{position:static;transform:none;font-size:.85rem;}
  .rt-cta-wrap{background:#f2f5fa;padding:18px 16px 24px;}
  .rt-cta{font-size:1.05rem;padding:14px 26px;width:100%;justify-content:center;}
  .rt-tool iframe{min-height:1750px;}
}

/* ============================================================
   INSTANT ROOF QUOTE HERO (.rqhero) — built from the 2172x724 comp.
   1 comp px = var(--rk) = .04604cqw. The plate keeps its painted
   stopwatch and chevron; the headline, sub-line and the four feature
   items are live text over the cleared area.
   ============================================================ */
.rqhero{--rk:.04604cqw;background:#fff;}
.rqhero .layer{color:var(--navy);}
.rqhero .ov{margin:0;}
.rq-eb{
  left:calc(427*var(--rk));top:calc(266*var(--rk));white-space:nowrap;
  font-family:var(--ui);font-weight:800;font-size:calc(50*var(--rk));line-height:1;letter-spacing:-.01em;color:var(--navy);
}
.rq-h1{position:static;margin:0;font-family:var(--ui);font-weight:900;}
.rq-h1 span{position:absolute;left:calc(425*var(--rk));display:block;white-space:nowrap;line-height:1;letter-spacing:-.035em;color:var(--navy);}
.rq-h1 .l1{top:calc(308*var(--rk));font-size:calc(108*var(--rk));}
.rq-h1 .l2{top:calc(400*var(--rk));font-size:calc(110*var(--rk));}
.rq-h1 em{font-style:normal;color:var(--red);}
.rq-sub{
  left:calc(427*var(--rk));top:calc(520*var(--rk));white-space:nowrap;
  font-family:var(--ui);font-size:calc(24*var(--rk));line-height:1.3;color:var(--navy);
}
.rq-feats{left:calc(168*var(--rk));top:calc(600*var(--rk));padding:0;list-style:none;display:flex;}
.rq-feats li{
  width:calc(212*var(--rk));display:flex;flex-direction:column;align-items:center;gap:calc(10*var(--rk));
  border-left:1px solid rgba(11,42,91,.35);
}
.rq-feats li:first-child{border-left:0;}
.rq-feats svg{width:calc(44*var(--rk));height:calc(44*var(--rk));fill:var(--navy);color:var(--navy);}
.rq-feats b{
  font-family:var(--ui);font-weight:800;font-size:calc(21*var(--rk));line-height:1.18;
  text-align:center;color:var(--navy);white-space:nowrap;
}

@media (max-width:1000px){
  .rqhero{--rk:1px;}
  .rqhero > img.plate{aspect-ratio:16/10;object-fit:cover;object-position:76% 50%;}
  .rqhero .layer{position:static;padding:22px 18px 24px;background:#fff;}
  .rqhero .ov{position:static;white-space:normal;}
  .rq-eb{font-size:1.1rem;}
  .rq-h1 span{position:static;left:auto;top:auto;white-space:normal;}
  .rq-h1 .l1{font-size:clamp(2.4rem,11vw,3.4rem);}
  .rq-h1 .l2{margin-top:2px;font-size:clamp(2.4rem,11vw,3.4rem);}
  .rq-sub{margin-top:10px;font-size:1rem;line-height:1.5;}
  .rq-sub br.dk{display:none;}
  .rq-feats{margin-top:18px;display:grid;grid-template-columns:repeat(4,1fr);}
  .rq-feats li{width:auto;gap:8px;}
  .rq-feats svg{width:30px;height:30px;}
  .rq-feats b{font-size:.6rem;white-space:normal;}
}