.hero__body { max-width: 880px; }
.hero__title { max-width: 18ch; }
.hero__title {
    font-family: "Archivo", sans-serif;
    font-weight: 800;
    font-size: clamp(34px, 4.4vw, 60px);
    line-height: 1;
    letter-spacing: -0.028em;
    color: var(--bone);
    margin-bottom: 14px;
    max-width: 22ch;
  }
.hero__title .accent { color: var(--brass); font-style: normal; }
.hero__title em {
    font-family: "Fraunces", serif;
    font-weight: 300;
    font-style: italic;
    color: var(--brass-soft);
    font-size: 0.9em;
  }
.hero__sub {
    font-size: 15px;
    line-height: 1.55;
    color: #fff;
    max-width: 560px;
    margin-bottom: 20px;
    font-weight: 400;
  }
.hero--v1 .hero__body {
    max-width: 640px;
    background: linear-gradient(165deg, rgba(6,22,41,0.13) 0%, rgba(6,22,41,0.27) 100%);
    backdrop-filter: blur(5px) saturate(1.05);
    -webkit-backdrop-filter: blur(5px) saturate(1.05);
    color: var(--bone);
    padding: 38px 44px 42px 42px;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(201,149,75,0.18);
    box-shadow: 0 30px 70px -30px rgba(4,16,31,0.45);
  }
.hero--v1 .hero__body::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 4px;
    background: var(--brass);
  }
.hero--v1 .breadcrumb,
  .hero--v1 .hero__title,
  .hero--v1 .hero__sub,
  .hero--v1 .hero__spec,
  .hero--v1 .hero__spec strong { text-shadow: 0 1px 12px rgba(4,16,31,0.72), 0 1px 2px rgba(4,16,31,0.55); }
.hero--v1 .hero__title { color: var(--bone); }
.hero--v1 .hero__title em { color: var(--brass-soft); }
.hero--v1 .hero__title .accent { color: var(--brass); }
.hero--v1 .hero__sub { color: #fff; }
@media (max-width: 520px) {
.hero--v1 .hero__body { padding: 28px 22px 30px 24px; }
}
.quiz {
    background: var(--bone);
    color: var(--ink);
    padding: 22px 24px 22px;
    border-top: 5px solid var(--brass);
    box-shadow: 0 30px 60px -24px rgba(6,22,41,0.55);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
.quiz__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  }
.quiz__head-l { display: flex; flex-direction: column; gap: 2px; }
.quiz__kicker {
    font-family: "IBM Plex Mono", monospace;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--brass-deep);
    font-weight: 700;
  }
.quiz__title {
    font-family: "Archivo", sans-serif;
    font-weight: 800;
    font-size: 18px;
    letter-spacing: -0.015em;
    color: var(--ink);
    line-height: 1.15;
  }
.quiz__stepnum {
    font-family: "IBM Plex Mono", monospace;
    font-size: 10.5px;
    letter-spacing: 0.1em;
    color: var(--ink-mute);
    text-transform: uppercase;
    font-weight: 600;
  }
.quiz__stepnum strong { color: var(--navy); font-weight: 700; }
.quiz__progress {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
  }
.quiz__dot {
    height: 3px;
    background: var(--rule);
    transition: background 280ms ease;
  }
.quiz__dot.is-active { background: var(--brass); }
.quiz__dot.is-done { background: var(--navy); }
.quiz__body { display: flex; flex-direction: column; gap: 10px; min-height: 156px; }
.quiz__step { display: none; flex-direction: column; gap: 10px; }
.quiz__step.is-active { display: flex; }
.quiz__q {
    font-family: "Archivo", sans-serif;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: -0.01em;
    color: var(--ink);
    line-height: 1.2;
  }
.quiz__hint {
    font-family: "IBM Plex Mono", monospace;
    font-size: 10.5px;
    letter-spacing: 0.04em;
    color: var(--ink-mute);
    text-transform: uppercase;
    margin-bottom: 2px;
  }
.quiz__opts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
.quiz__opt {
    background: var(--paper);
    border: 1.5px solid var(--rule);
    padding: 10px 12px;
    text-align: left;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 2px;
    transition: all 180ms ease;
  }
.quiz__opt:hover { border-color: var(--navy); background: var(--bone-soft); }
.quiz__opt.is-selected { border-color: var(--navy); background: var(--navy); color: var(--bone); }
.quiz__opt-name {
    font-family: "Archivo", sans-serif;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: -0.005em;
    line-height: 1.2;
  }
.quiz__opt-sub {
    font-family: "IBM Plex Mono", monospace;
    font-size: 10px;
    letter-spacing: 0.06em;
    color: var(--ink-mute);
    text-transform: uppercase;
  }
.quiz__opt.is-selected .quiz__opt-sub { color: var(--brass-soft); }
.quiz__slider { display: flex; flex-direction: column; gap: 10px; padding: 4px 0 0; }
.quiz__slider-val { display: flex; align-items: baseline; gap: 8px; }
.quiz__slider-val strong {
    font-family: "Archivo", sans-serif;
    font-weight: 900;
    font-size: 32px;
    letter-spacing: -0.025em;
    color: var(--navy);
    line-height: 1;
  }
.quiz__slider-val span {
    font-family: "IBM Plex Mono", monospace;
    font-size: 10.5px;
    letter-spacing: 0.08em;
    color: var(--ink-mute);
    text-transform: uppercase;
  }
.quiz__range { width: 100%; -webkit-appearance: none; appearance: none; background: transparent; }
.quiz__range::-webkit-slider-runnable-track { height: 4px; background: var(--rule); }
.quiz__range::-moz-range-track { height: 4px; background: var(--rule); }
.quiz__range::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: var(--brass);
    border: 3px solid var(--bone);
    box-shadow: 0 0 0 1.5px var(--brass-deep);
    margin-top: -8px;
    cursor: pointer;
  }
.quiz__range::-moz-range-thumb {
    width: 20px; height: 20px; border-radius: 50%;
    background: var(--brass); border: 3px solid var(--bone);
    box-shadow: 0 0 0 1.5px var(--brass-deep);
    cursor: pointer;
  }
.quiz__ticks { display: flex; justify-content: space-between; font-family: "IBM Plex Mono", monospace; font-size: 10px; letter-spacing: 0.06em; color: var(--ink-quiet); }
.quiz__inputs { display: flex; flex-direction: column; gap: 6px; }
.quiz__input {
    width: 100%;
    background: var(--paper);
    border: 1.5px solid var(--rule);
    padding: 10px 12px;
    font-family: "Manrope", sans-serif;
    font-size: 13px;
    color: var(--ink);
    transition: border-color 200ms ease;
  }
.quiz__input:focus { outline: none; border-color: var(--navy); }
.quiz__textarea { resize: vertical; min-height: 72px; line-height: 1.5; font-family: "Manrope", sans-serif; }
.quiz__estimate {
    background: var(--navy-deep);
    color: var(--bone);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 4px;
  }
.quiz__estimate-l {
    font-family: "IBM Plex Mono", monospace;
    font-size: 9.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--brass-soft);
    font-weight: 600;
  }
.quiz__estimate-v {
    font-family: "Archivo", sans-serif;
    font-weight: 900;
    font-size: 22px;
    letter-spacing: -0.025em;
    color: var(--brass);
    line-height: 1.1;
  }
.quiz__estimate-v .em { color: var(--bone); margin: 0 4px; font-weight: 700; }
.quiz__estimate-meta { font-family: "IBM Plex Mono", monospace; font-size: 10px; letter-spacing: 0.04em; color: #fff; }
.quiz__done {
    display: none;
    flex-direction: column;
    gap: 6px;
    padding: 12px 0;
  }
.quiz__done.is-active { display: flex; }
.quiz__done-t {
    font-family: "Archivo", sans-serif;
    font-weight: 800;
    font-size: 18px;
    letter-spacing: -0.015em;
    color: var(--ink);
    line-height: 1.2;
  }
.quiz__done-t .em { color: var(--brass-deep); font-family: "Fraunces", serif; font-style: italic; font-weight: 300; }
.quiz__done-sub { font-size: 13px; color: var(--ink-mute); line-height: 1.55; }
.quiz__foot {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid var(--rule);
  }
.quiz__back {
    background: transparent;
    border: 1.5px solid var(--rule-strong);
    color: var(--ink-soft);
    padding: 10px 16px;
    font-family: "Archivo", sans-serif;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: all 200ms ease;
  }
.quiz__back:hover { border-color: var(--navy); color: var(--navy); }
.quiz__back:disabled { opacity: 0.3; cursor: not-allowed; }
.quiz__next {
    background: var(--navy);
    color: var(--bone);
    border: none;
    padding: 10px 18px;
    font-family: "Archivo", sans-serif;
    font-weight: 800;
    font-size: 11.5px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: background 200ms ease, gap 200ms ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }
.quiz__next:hover { background: var(--navy-soft); }
.quiz__next.is-final { background: var(--brass); color: var(--navy-deep); }
.quiz__next.is-final:hover { background: var(--brass-soft); }
.quiz__assurance {
    font-family: "IBM Plex Mono", monospace;
    font-size: 10px;
    letter-spacing: 0.04em;
    color: var(--ink-mute);
    line-height: 1.5;
    padding-top: 2px;
  }
.quiz__assurance strong { color: var(--navy); font-weight: 700; }
.sh-crumb{ font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase; display:flex; gap:9px; align-items:center; }
.sh-crumb a{ color:inherit; opacity:.72; text-decoration:none; }
.sh-crumb a:hover{ opacity:1; color:var(--brass); }
.sh-crumb span{ opacity:.4; }
.sh-crumb b{ color:var(--brass); font-weight:600; }
.sh1 .sh-crumb{ position:absolute; top:92px; left:56px; z-index:3; color:var(--bone); }
.sh3__text .sh-crumb a{ opacity:.65; }
.sh4__in .sh-crumb a{ opacity:.6; }
.sh5 .sh-crumb{ position:absolute; top:92px; left:56px; z-index:3; color:var(--bone); }
@media (max-width:860px) {
.sh1 .sh-crumb, .sh5 .sh-crumb{ top:80px; left:22px; }
}
.lead .quiz { background: rgba(6,22,41,0.32); backdrop-filter: blur(26px) saturate(1.1); -webkit-backdrop-filter: blur(26px) saturate(1.1); color: var(--bone); border: 1px solid rgba(201,149,75,0.32); border-top: 4px solid var(--brass); box-shadow: 0 32px 60px -28px rgba(6,22,41,0.7), 0 10px 24px -14px rgba(0,0,0,0.4); width: 100%; max-width: 420px; justify-self: end; overflow: hidden; padding: 0; gap: 0; }
.lead .quiz__head { padding: 16px 22px 14px; border-bottom: 1px solid rgba(246,242,232,0.14); display: flex; justify-content: space-between; align-items: flex-end; background: transparent; margin: 0; }
.lead .quiz__kicker { color: var(--brass); }
.lead .quiz__title { color: var(--bone); }
.lead .quiz__body { padding: 18px 22px 20px; }
.lead .quiz__q { color: var(--bone); }
.lead .quiz__hint { color: #fff; }
.lead .quiz__inputs { display: flex; flex-direction: column; gap: 8px; }
.lead .quiz__input { background: var(--bone); border: 1.5px solid rgba(246,242,232,0.2); color: var(--ink); }
.lead .quiz__input:focus { outline: none; border-color: var(--brass); background: #fff; }
.lead .quiz__input::placeholder { color: var(--ink-quiet); }
.lead .quiz__textarea { resize: vertical; min-height: 72px; line-height: 1.5; }
.lead .quiz__foot { padding: 10px 22px 16px; border-top: 1px solid rgba(246,242,232,0.14); background: transparent; margin: 0; }
.lead .quiz__next { flex: 1; background: var(--brass); color: var(--navy-deep); }
.lead .quiz__next:hover { background: var(--brass-soft); }
.lead .quiz__assurance { padding: 10px 22px 14px; background: transparent; color: #fff; }
.lead .quiz__assurance strong { color: var(--brass-soft); }
@media (max-width: 1000px) {
.lead .quiz { justify-self: center; max-width: 600px; }
}
.hero-statsband{ background:var(--navy-deep); border-top:1px solid rgba(201,149,75,.18); margin-top:36px; }
.hero-statsband__grid{ display:grid; grid-template-columns:repeat(5,1fr); }
.hero-statsband .st{ padding:24px 20px; border-right:1px solid rgba(246,242,232,.08); }
.hero-statsband .st:last-child{ border-right:none; }
.hero-statsband .st__v{ font-family:"Archivo",sans-serif; font-weight:900; font-size:42px; letter-spacing:-.03em; line-height:1; color:var(--brass); }
.hero-statsband .st__v sub{ font-size:18px; color:var(--bone); vertical-align:super; letter-spacing:0; margin-left:2px; font-weight:700; }
.hero-statsband .st__l{ font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-quiet); margin-top:9px; }
.hero-statsband .st__m{ font-size:12.5px; color:rgba(246,242,232,.6); line-height:1.4; margin-top:4px; }
@media (max-width:900px) {
.hero-statsband__grid{ grid-template-columns:repeat(2,1fr); }
.hero-statsband .st{ border-bottom:1px solid rgba(246,242,232,.08); padding:20px 18px; }
.hero-statsband .st:nth-child(2n){ border-right:none; }
.hero-statsband .st__v{ font-size:34px; }
}
section.hero .vslide[data-label="Stats band below"] .hero-statsband{ padding-bottom:24px; }
.hero__inner--quiz { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 56px; align-items: center; }
@media (max-width: 1000px) {
.hero__inner--quiz { grid-template-columns: 1fr; gap: 32px; }
}
.hero__inner--quiz .hero__body { max-width: 640px; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; border: none; box-shadow: none; padding: 0; overflow: visible; }
.hero__inner--quiz .hero__body::before { display: none; }
.hero__inner--quiz .hero__title, .hero__inner--quiz .hero__sub, .hero__inner--quiz .breadcrumb { text-shadow: 0 2px 22px rgba(6,22,41,0.6); }
.quiz__step-num { font-family: "IBM Plex Mono", monospace; font-size: 10px; letter-spacing: 0.06em; color: #fff; font-weight: 600; text-transform: uppercase; }
.quiz__step-num strong { color: var(--brass); }
.quiz__opt-icon { width: 20px; height: 20px; color: var(--navy); margin-bottom: 1px; transition: color 180ms ease; }
.quiz__opt-icon svg { width: 100%; height: 100%; stroke: currentColor; fill: none; stroke-width: 1.5; }
.quiz__opt.is-selected .quiz__opt-icon { color: var(--brass); }
.hero__inner--quiz .quiz { background: rgba(6,22,41,0.32); backdrop-filter: blur(26px) saturate(1.1); -webkit-backdrop-filter: blur(26px) saturate(1.1); color: var(--bone); border: 1px solid rgba(201,149,75,0.32); border-top: 4px solid var(--brass); box-shadow: 0 32px 60px -28px rgba(6,22,41,0.7), 0 10px 24px -14px rgba(0,0,0,0.4); width: 100%; max-width: 440px; justify-self: end; overflow: hidden; padding: 0; gap: 0; }
.hero__inner--quiz .quiz__head { padding: 16px 22px 14px; border-bottom: 1px solid rgba(246,242,232,0.14); display: flex; justify-content: space-between; align-items: flex-end; background: transparent; margin: 0; }
.hero__inner--quiz .quiz__kicker { color: var(--brass); }
.hero__inner--quiz .quiz__title { color: var(--bone); }
.hero__inner--quiz .quiz__body { padding: 18px 22px 20px; }
.hero__inner--quiz .quiz__q { color: var(--bone); }
.hero__inner--quiz .quiz__hint { color: #fff; }
.hero__inner--quiz .quiz__inputs { display: flex; flex-direction: column; gap: 8px; }
.hero__inner--quiz .quiz__input { background: var(--bone); border: 1.5px solid rgba(246,242,232,0.2); color: var(--ink); }
.hero__inner--quiz .quiz__input:focus { outline: none; border-color: var(--brass); background: #fff; }
.hero__inner--quiz .quiz__input::placeholder { color: var(--ink-quiet); }
.hero__inner--quiz .quiz__foot { padding: 10px 22px 16px; border-top: 1px solid rgba(246,242,232,0.14); background: transparent; margin: 0; }
.hero__inner--quiz .quiz__back { color: #fff; }
.hero__inner--quiz .quiz__next { flex: 1; background: var(--brass); color: var(--navy-deep); }
.hero__inner--quiz .quiz__next:hover { background: var(--brass-soft); }
.hero__inner--quiz .quiz__assurance { padding: 10px 22px 14px; background: transparent; color: #fff; }
.hero__inner--quiz .quiz__assurance strong { color: var(--brass-soft); }
.hero__inner--quiz .quiz__done { padding: 20px 22px; }
@media (max-width: 1000px) {
.hero__inner--quiz .quiz { justify-self: center; max-width: 600px; }
}
.pqhero{ position:relative; overflow:hidden; display:flex; flex-direction:column; min-height:544px; }
.pqhero__bg{ position:absolute; inset:0; background:url("/assets/ext/miamifirstremodeling/kitchen-002/kitchen-001.webp") center/cover; }
.pqhero__scrim{ position:absolute; inset:0; background:linear-gradient(105deg, rgba(6,22,41,.66) 0%, rgba(6,22,41,.40) 46%, rgba(6,22,41,.28) 100%); }
.pqhero > .shell{ position:relative; z-index:2; flex:1; display:flex; align-items:center; padding:104px 0 30px; width:100%; }
.pqhero .hero-statsband{ position:relative; z-index:2; margin-top:22px; }
.pqhero .hero-statsband__grid{ grid-template-columns:repeat(6,1fr) !important; }
.pqhero .hero__title{ color:var(--bone); font-family:"Archivo",sans-serif; font-weight:900; font-size:clamp(38px,5vw,58px); line-height:1.03; letter-spacing:-.03em; margin:0; }
.pqhero .hero__title em{ color:var(--brass-soft); font-style:italic; font-weight:300; font-family:"Fraunces",serif; }
.pqhero .hero__sub{ color:rgba(246,242,232,.9); font-size:16px; line-height:1.6; max-width:520px; margin:16px 0 0; }
.pqhero .sh-crumb{ margin-bottom:16px; justify-content:flex-start; }
.pqhero .quiz__dot.is-active{ background:var(--bone); }
.pqhero .quiz__dot.is-done{ background:var(--brass); }
.pqhero .quiz__opt:hover{ border-color:var(--brass); background:#fff; }
.pqhero .quiz__slider-val strong{ color:var(--brass); }
.pqhero .quiz__slider-val span{ color:rgba(246,242,232,.72); }
.pqhero .quiz__ticks{ color:rgba(246,242,232,.6); }
.pqhero .quiz__done-t{ color:var(--bone); }
.pqhero .quiz__done-t .em{ color:var(--brass-soft); }
.pqhero .quiz__done-sub{ color:rgba(246,242,232,.75); }
@media (max-width:900px) {
.pqhero .hero-statsband__grid{ grid-template-columns:repeat(2,1fr); }
.pqhero{ min-height:auto; padding-top:100px; }
}
/* 07/09: standard hero parity with bathroom (crumbs, spacing, height) */
.pqhero { min-height: 80vh; }
.pqhero > .shell { padding: 104px 56px 30px; }
.pqhero .sh-crumb a { color: rgba(246,242,232,.65); }
.pqhero .sh-crumb span { color: rgba(246,242,232,.45); }
.pqhero .sh-crumb b { color: var(--brass); }
@media (max-width: 1100px) {
  /* !important: overrides repeat(6)!important from the process reference */
  .pqhero .hero-statsband__grid { grid-template-columns: repeat(3, 1fr) !important; gap: 20px 28px; }
}
@media (max-width: 720px) {
  .pqhero { min-height: auto; }
  .pqhero > .shell { padding: 104px 20px 30px; }
  .pqhero .hero-statsband__grid { grid-template-columns: repeat(2, 1fr) !important; gap: 16px 20px; }
}
/* Tier-2 (07/09 fix): compact hero — the next block is visible above the fold */
.pqhero--compact { min-height: auto; }
.pqhero--compact > .shell { padding: 92px 56px 10px; }  /* 92 = fixed navbar (87px) + gap */
.pqhero--compact .hero-statsband { padding-top: 10px; padding-bottom: 10px; }
.pqhero--compact .hero__title { font-size: clamp(34px, 3.8vw, 54px); }
.pqhero--compact .hero__inner, .pqhero--compact .hero__inner--quiz { padding: 0; }
.pqhero--compact .quiz__head { padding: 10px 18px 8px; }
.pqhero--compact .quiz__body { padding: 10px 18px 12px; gap: 7px; }
.pqhero--compact .quiz__opt { padding: 6px 10px; }
.pqhero--compact .quiz__foot { padding: 7px 18px 8px; }
.pqhero--compact .quiz__assurance { padding: 6px 18px 8px; }
@media (max-width: 720px) {
  .pqhero--compact > .shell { padding: 96px 20px 12px; }
}

/* 07/09: shared boring stuff block — swipe on mobile (scope-grid pattern) */
@media (max-width: 600px) {
  .creds__grid { display: flex; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; gap: 14px; scrollbar-width: none; }
  .creds__grid::-webkit-scrollbar { display: none; }
  .creds__grid > .cred { flex: 0 0 80%; scroll-snap-align: start; }
}
