/* ux2 cohesive draft: room hero + aligned header + finish corners + quote defaults preserved via HTML */

:root{
  --ux-max:1440px;
  --ux-gutter:clamp(16px,4.2vw,28px);
  --ux-navy:#0B2545;
  --ux-orange:#FF7A00;
  --ux-cream:#F4F0E8;
  --ux-line:rgba(11,37,69,.12);
}

/* ——— shared content rail ——— */
.in, .wrap, .h11{
  max-width:var(--ux-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--ux-gutter)!important;
  padding-right:var(--ux-gutter)!important;
  box-sizing:border-box;
}
.wrap{padding-top:36px!important;padding-bottom:36px!important}

.nav.hdr4{
  width:100%;
  box-sizing:border-box;
  padding-left:max(var(--ux-gutter), calc((100% - var(--ux-max)) / 2 + var(--ux-gutter)))!important;
  padding-right:max(var(--ux-gutter), calc((100% - var(--ux-max)) / 2 + var(--ux-gutter)))!important;
  gap:16px!important;
}
@media (max-width:900px){
  .nav.hdr4{
    padding-left:var(--ux-gutter)!important;
    padding-right:var(--ux-gutter)!important;
  }
  .nav.hdr4 .nav-links{
    padding-left:var(--ux-gutter)!important;
    padding-right:var(--ux-gutter)!important;
  }
}

/* ——— ROOM HERO (clean interior-navy photo; no weather sky) ——— */
.pq-hero.hero-room{
  position:relative;
  isolation:isolate;
  background:var(--ux-navy);
}
.pq-hero.hero-room .pq-bg .house{
  background-image:url(assets/hero-room-desktop-2160.webp)!important;
  background-size:cover!important;
  background-position:center 42%!important;
  background-repeat:no-repeat!important;
  filter:none!important;
}
@media (max-width:959px){
  .pq-hero.hero-room .pq-bg .house{
    background-image:image-set(url(assets/hero-room-mobile-644.webp) 1x, url(assets/hero-room-mobile-1288.webp) 2x)!important;
    background-position:center 38%!important;
  }
}
/* hide weather FX — room photo is the design */
.pq-hero.hero-room .pq-bg .sky,
.pq-hero.hero-room .pq-bg .fogov{display:none!important}

/* minimal scrim — photo stays clear; just enough for white type */
.pq-hero.hero-room .pq-ov{
  background:
    linear-gradient(90deg, rgba(11,37,69,.34) 0, rgba(11,37,69,.10) 38%, rgba(11,37,69,.04) 62%, rgba(11,37,69,.10) 100%),
    linear-gradient(180deg, rgba(11,37,69,.18) 0, rgba(11,37,69,.04) 28%, rgba(11,37,69,.08) 72%, rgba(11,37,69,.42) 100%)!important;
}
@media (max-width:959px){
  .pq-hero.hero-room .pq-ov{
    background:
      linear-gradient(180deg, rgba(11,37,69,.28) 0, rgba(11,37,69,.08) 22%, rgba(11,37,69,.12) 55%, rgba(11,37,69,.48) 100%)!important;
  }
}

/* typography styled like brand post 01 */
.pq-hero.hero-room .h11-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  max-width:16ch;
  padding:8px 0 0!important;
}
.pq-hero.hero-room .h11-stroke{
  width:clamp(72px,12vw,120px);
  height:10px;
  margin:0 0 16px;
  border-radius:3px 14px 3px 3px;
  background:var(--ux-orange);
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset;
  clip-path:polygon(0 18%, 92% 0, 100% 55%, 96% 100%, 0 82%);
}
.pq-hero.hero-room .h11-copy h1{
  font:400 clamp(40px,5.6vw,72px)/.98 'Archivo Black',system-ui,sans-serif!important;
  letter-spacing:-.03em;
  color:#fff!important;
  max-width:12ch!important;
  margin:0 0 14px!important;
  text-shadow:0 2px 18px rgba(0,0,0,.35)!important;
}
.pq-hero.hero-room .h11-copy h1 em{
  font-style:normal!important;
  color:var(--ux-orange)!important;
  box-shadow:none!important;
}
.pq-hero.hero-room .h11-lead{
  margin:0!important;
  max-width:28em;
  color:var(--ux-cream)!important;
  font:500 17px/1.45 Inter,system-ui,sans-serif!important;
  text-shadow:0 1px 10px rgba(0,0,0,.35)!important;
}

/* keep quote card glass, slightly clearer over room */
.pq-hero.hero-room .pq-card{
  background:rgba(255,255,255,.50)!important;
  -webkit-backdrop-filter:saturate(140%) blur(14px)!important;
  backdrop-filter:saturate(140%) blur(14px)!important;
  border:1px solid rgba(255,255,255,.6)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset, 0 28px 60px -24px rgba(0,0,0,.5)!important;
}
@media (max-width:959px){
  .pq-hero.hero-room .pq-card{
    background:rgba(255,255,255,.62)!important;
  }
}

/* preserve fixed hero/card height locks from ux1 on desktop */
@media (min-width:960px){
  .pq-hero.hero-room,
  .pq-hero.hero-room .h11{min-height:1240px!important}
  .pq-hero.hero-room .pq-card{
    min-height:1080px!important;
    height:1080px!important;
    max-width:760px!important;
  }
}

.pq-hero.hero-room > .h11-wx{display:none!important}
.pq-hero.hero-room .pq-lbl{opacity:.65;font-size:11px}

/* ——— FINISH BUTTONS: wall-corner thumbs, clean cards ——— */
.pq-fin{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:10px!important;
}
.pq-chip.pq-finb{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:12px!important;
  padding:8px!important;
  min-height:72px!important;
  border-radius:14px!important;
  border:1.5px solid rgba(11,37,69,.14)!important;
  background:#fff!important;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset!important;
  text-align:left!important;
  overflow:hidden!important;
  transition:border-color .15s, box-shadow .15s, transform .12s;
}
.pq-chip.pq-finb:hover{
  border-color:rgba(255,122,0,.55)!important;
}
.pq-chip.pq-finb[aria-pressed=true]{
  border-color:var(--ux-orange)!important;
  background:#FFF7EF!important;
  box-shadow:0 0 0 1px rgba(255,122,0,.35), 0 1px 0 rgba(255,255,255,.9) inset!important;
}
.pq-chip.pq-finb:focus-visible{
  outline:2px solid #FFB46E;
  outline-offset:2px;
}
.pq-finb .fn-th{
  width:84px!important;
  height:64px!important;
  flex:0 0 84px!important;
  object-fit:cover!important;
  border-radius:10px!important;
  box-shadow:0 1px 4px rgba(11,37,69,.28)!important;
  background:#e9e5de!important;
}
.pq-finb .fn-txt{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;gap:2px}
.pq-finb .fn-l{
  font:700 13.5px/1.2 Inter,system-ui,sans-serif!important;
  color:var(--ux-navy)!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.pq-finb .fn-g{
  font:500 11.5px/1.3 Inter,system-ui,sans-serif!important;
  color:#5b6675!important;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.pq-fin .fn-pop{display:none!important}
.fgal{display:none!important}
@media (max-width:959px){
  .pq-chip.pq-finb{min-height:64px!important;gap:8px!important;padding:7px!important}
  .pq-finb .fn-th{width:64px!important;height:48px!important;flex-basis:64px!important;flex:0 0 64px!important}
}
@media (max-width:400px){
  .pq-fin{gap:8px!important}
  .pq-chip.pq-finb{min-height:58px!important}
  .pq-finb .fn-l{font-size:12px!important}
  .pq-finb .fn-g{font-size:10px!important}
}

/* estimate caveat always visible */
.pq-hero .pq-card .pq-res .pq-fine{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}
