/* Photo Quote + gentle interactivity. Scoped with .pq-* so nothing else on the site changes. */
:root{--pq-ac:#0272b8;--pq-ac2:#025a92;--pq-ink:#0f172a;--pq-mut:#475569;--pq-bd:#dbe3ec;--pq-tint:#e0f2fe}

/* ---------- scroll fade-ins (JS adds .pq-rv, then .pq-in) ---------- */
.pq-rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.pq-rv.pq-in{opacity:1;transform:none}

/* ---------- hover / tap lift on service cards ---------- */
html body main .strip a.card:hover,html body main .card.sph:hover{transform:translateY(-6px)!important;box-shadow:0 14px 32px rgba(2,114,184,.18)!important;border-color:#7cc4ee!important}
html body main .strip a.card:active,html body main .card.sph:active{transform:translateY(-3px) scale(.985)!important;box-shadow:0 8px 20px rgba(2,114,184,.16)!important}
html body main .strip a.card,html body main .card.sph{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important}
html body main .strip a.card:hover .ico{transform:scale(1.08) rotate(-3deg)}
html body main .strip a.card .ico{transition:transform .25s ease}

/* ---------- how it works strip ---------- */
.pq-how{padding:34px 0 8px}
.pq-how .wrap{max-width:1000px}
.pq-how h2{text-align:center;margin-bottom:6px}
.pq-how .sub{text-align:center;margin:0 0 22px;color:var(--pq-mut)}
.pq-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;position:relative;counter-reset:none}
.pq-steps::before{content:"";position:absolute;left:16.6%;right:16.6%;top:46px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--pq-ac),#0ea5e9);transform:scaleX(0);transform-origin:left;transition:transform 1.3s ease .25s;z-index:0;opacity:.35}
.pq-steps.go::before{transform:scaleX(1)}
.pq-step{position:relative;z-index:1;background:#fff;border:1px solid var(--pq-bd);border-radius:18px;padding:20px 16px 18px;text-align:center;box-shadow:0 1px 3px rgba(15,23,42,.06);opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease,box-shadow .22s ease}
.pq-steps.go .pq-step{opacity:1;transform:none}
.pq-steps.go .pq-step:nth-child(2){transition-delay:.35s,.35s,0s}
.pq-steps.go .pq-step:nth-child(3){transition-delay:.7s,.7s,0s}
.pq-ic{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 10px;border-radius:50%;background:var(--pq-tint);font-size:1.7rem;box-shadow:0 0 0 5px #fff}
.pq-steps.go .pq-step .pq-ic{animation:pqpop .7s ease both}
.pq-steps.go .pq-step:nth-child(2) .pq-ic{animation-delay:.45s}
.pq-steps.go .pq-step:nth-child(3) .pq-ic{animation-delay:.8s}
@keyframes pqpop{0%{transform:scale(.6)}60%{transform:scale(1.12)}100%{transform:scale(1)}}
.pq-n{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--pq-ac);margin-bottom:2px}
.pq-step h3{margin:0 0 6px;font-size:1.15rem;color:var(--pq-ink)}
.pq-step p{margin:0;color:var(--pq-mut);font-size:.98rem;line-height:1.45}
.pq-how .btns{justify-content:center;margin-top:22px}
@media(max-width:700px){
  .pq-steps{grid-template-columns:1fr;gap:14px}
  .pq-steps::before{left:27px;right:auto;top:40px;bottom:40px;width:3px;height:auto;transform:scaleY(0);transform-origin:top;display:none}
  .pq-step{display:grid;grid-template-columns:56px 1fr;column-gap:14px;text-align:left;align-items:center;padding:14px}
  .pq-step .pq-ic{grid-row:1/4;margin:0}
  .pq-step .pq-n,.pq-step h3,.pq-step p{grid-column:2}
}

/* ---------- sticky mobile button ---------- */
.pq-sticky{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:7;display:none;align-items:center;gap:8px;padding:0 20px;min-height:52px;border-radius:999px;background:linear-gradient(135deg,var(--pq-ac),var(--pq-ac2))!important;color:#fff!important;font-weight:800;font-size:1rem;text-decoration:none!important;white-space:nowrap;box-shadow:0 8px 24px rgba(2,114,184,.45);transform:translate(-50%,90px);opacity:0;transition:transform .35s ease,opacity .35s ease}
.pq-sticky.show{transform:translate(-50%,0);opacity:1}
.pq-sticky:active{transform:translate(-50%,0) scale(.97)}
@media(max-width:760px){.pq-sticky{display:inline-flex}}
body.pq-pad{padding-bottom:84px}
@media(min-width:761px){body.pq-pad{padding-bottom:0}}

/* ---------- photo quote page ---------- */
.pq-wrap{max-width:760px}
.pq-form{padding:22px}
.pq-form fieldset{border:0;margin:0 0 20px;padding:0;min-width:0}
.pq-form legend,.pq-lbl{display:block!important;font-weight:800!important;font-size:1.05rem!important;margin:0 0 8px!important;padding:0;color:var(--pq-ink)!important}
.pq-form .pq-hint{font-weight:500;color:var(--pq-mut);font-size:.9rem}
.pq-form .req{color:#b42318}
.pq-form label.pq-f{display:block!important;font-weight:700!important;font-size:1rem!important;margin:0 0 6px!important;min-height:0!important;width:auto!important}
.pq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px}
.pq-grid.one{grid-template-columns:1fr}
@media(max-width:600px){.pq-grid{grid-template-columns:1fr}}
.pq-choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px}
.pq-choice{position:relative}
.pq-choice input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2}
.pq-choice span{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:68px;padding:10px 8px;text-align:center;border:1.5px solid var(--pq-bd);border-radius:14px;background:#fff;font-weight:700;font-size:.98rem;line-height:1.2;color:var(--pq-ink);transition:transform .15s ease,border-color .15s,background .15s,box-shadow .15s}
.pq-choice span i{font-style:normal;font-size:1.4rem;line-height:1}
.pq-choice:hover span{border-color:#7cc4ee;transform:translateY(-2px)}
.pq-choice input:checked+span{border-color:var(--pq-ac);background:var(--pq-tint);box-shadow:0 0 0 3px rgba(2,114,184,.18)}
.pq-choice input:focus-visible+span{outline:3px solid #0ea5e9;outline-offset:2px}
.pq-choices.prob{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.pq-choices.prob .pq-choice span{min-height:52px;flex-direction:row;gap:8px}
.pq-drop{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:96px;border:2px dashed #7cc4ee;border-radius:16px;background:#f4faff;color:var(--pq-ac2);font-weight:800;font-size:1.05rem;cursor:pointer;padding:14px;transition:background .2s,border-color .2s,transform .15s}
.pq-drop:hover{background:var(--pq-tint);border-color:var(--pq-ac)}
.pq-drop.over{background:var(--pq-tint);border-color:var(--pq-ac);transform:scale(1.01)}
.pq-drop input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.pq-drop:focus-within{outline:3px solid #0ea5e9;outline-offset:2px}
.pq-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.pq-thumbs:empty{display:none}
.pq-th{position:relative;aspect-ratio:1;border-radius:14px;overflow:hidden;background:#e2e8f0;border:1px solid var(--pq-bd);animation:pqin .35s ease both}
.pq-th img{width:100%;height:100%;object-fit:cover;display:block}
.pq-th button{position:absolute;top:6px;right:6px;width:34px;height:34px;min-height:0;border-radius:50%;border:0;background:rgba(15,23,42,.8);color:#fff;font-size:1.1rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0}
.pq-th.busy::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.7) center/28px no-repeat;animation:pqpulse 1s infinite}
@keyframes pqin{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@keyframes pqpulse{50%{opacity:.4}}
.pq-note{font-size:.9rem;color:var(--pq-mut);margin:8px 0 0}
.pq-err{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:#fef3f2;border:1px solid #fecdca;color:#912018;font-weight:600}
.pq-err[hidden]{display:none}
.pq-submit{width:100%;min-height:56px;font-size:1.1rem;cursor:pointer}
.pq-submit[disabled]{opacity:.65;cursor:progress}
.pq-priv{font-size:.88rem;color:var(--pq-mut);text-align:center;margin:12px 0 0}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.pq-done{text-align:center;padding:34px 22px;animation:pqin .5s ease both}
.pq-done .pq-tick{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 14px;border-radius:50%;background:#dcfce7;color:#15803d;font-size:2.2rem;animation:pqpop .7s ease both}
.pq-done h2{margin:0 0 8px}
.pq-done .btns{justify-content:center;margin-top:16px}
.pq-side{margin-top:18px}

/* ---------- reduced motion: nothing moves ---------- */
@media(prefers-reduced-motion:reduce){
  .pq-rv,.pq-step,.pq-steps::before,.pq-sticky,.pq-choice span,.pq-drop{transition:none!important}
  .pq-rv,.pq-step{opacity:1!important;transform:none!important}
  .pq-steps::before{transform:none!important}
  .pq-steps.go .pq-step .pq-ic,.pq-th,.pq-done,.pq-done .pq-tick{animation:none!important}
  html body main .strip a.card,html body main .card.sph,html body main .strip a.card .ico{transition:none!important}
  html body main .strip a.card:hover,html body main .card.sph:hover,html body main .strip a.card:active,html body main .card.sph:active{transform:none!important}
  .pq-sticky,.pq-sticky.show{transform:translate(-50%,0)}
}
/* beat the site's global fieldset/label rules */
html body .pq-form fieldset{border:0!important;border-radius:0!important;padding:0!important;margin:0 0 22px!important}
html body .pq-form fieldset label.pq-choice{display:block!important;margin:0!important;width:auto!important}
html body .pq-form fieldset .pq-choice input{width:100%!important;height:100%!important}
html body .pq-form fieldset label.pq-drop{display:flex!important;margin:0!important;width:100%!important;font-weight:800!important}
html body .pq-form legend{float:none;width:auto}
html body .pq-form .pq-choices{grid-template-columns:repeat(5,1fr)}
html body .pq-form .pq-choices.prob{grid-template-columns:repeat(3,1fr)}
@media(max-width:600px){html body .pq-form .pq-choices{grid-template-columns:repeat(3,1fr);gap:8px}html body .pq-form .pq-choices.prob{grid-template-columns:repeat(2,1fr)}.pq-choice span{padding:8px 4px;font-size:.92rem}}