/* ACE AI Visualizer tool (Phase 5): the box on /ai-visualizer/. Uses the cream tokens and the lead form classes
   (.ace-field, .ace-pill, .ace-step__*) of lead.css; only the tool's own layout is here. */
.aiv-tool{background:var(--cream-deep);padding:96px 24px;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.aiv-box{max-width:760px;margin:0 auto;background:var(--cream);border:1px solid var(--hairline);padding:40px 40px 36px;box-shadow:0 18px 40px rgba(26,23,20,.06)}
.aiv-progress{font-size:11px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--bronze);margin:0 0 18px;min-height:1em}
.aiv-step{border:0;margin:0;padding:0;min-width:0}
.aiv-step[hidden],.aiv-nav [hidden],.aiv-result [hidden]{display:none!important}
.aiv-step .ace-step__title{font-size:clamp(24px,3vw,30px)}
.aiv-file{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden}
.aiv-photo{margin-top:18px}
.aiv-choose{display:inline-flex;align-items:center;gap:10px;cursor:pointer;border:0}
.aiv-file:focus-visible + .aiv-choose{outline:2px solid var(--bronze);outline-offset:3px}
.aiv-choose-mob{display:none}
@media (max-width:720px){.aiv-choose-desk{display:none}.aiv-choose-mob{display:inline}}
.aiv-preview{margin:20px 0 0}
.aiv-preview img{max-height:320px;width:auto;max-width:100%;border:1px solid var(--hairline)}
.aiv-q{margin:0 0 6px;border:0;padding:0;min-width:0}
.aiv-q .ace-field{margin-top:6px}
.aiv-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:30px}
.aiv-back,.aiv-link{background:none;border:0;padding:6px 0;font:inherit;font-size:14px;color:var(--ink-soft);text-decoration:underline;text-underline-offset:3px;cursor:pointer;min-height:44px}
.aiv-back:hover,.aiv-link:hover{color:var(--bronze)}
.aiv-link:disabled{color:var(--ink-mute);text-decoration:none;cursor:default}
.aiv-links{display:flex;flex-wrap:wrap;gap:6px 24px;margin:8px 0 0}
.aiv-summary{margin-top:14px}
.aiv-working{text-align:center;padding:36px 0}
.aiv-spinner{width:38px;height:38px;margin:0 auto 22px;border:2px solid var(--hairline-strong);border-top-color:var(--bronze);border-radius:50%;animation:aivspin 1s linear infinite}
@keyframes aivspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.aiv-spinner{animation:none}}
.aiv-figure{position:relative;margin:0 0 18px}
.aiv-figure img{width:100%;height:auto;border:1px solid var(--hairline)}
.aiv-tag{position:absolute;left:12px;top:12px;max-width:calc(100% - 24px);padding:7px 12px;background:rgba(26,23,20,.82);color:var(--cream);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;line-height:1.35}
.aiv-figure figcaption{font-size:13px;line-height:1.5;color:var(--ink-mute);margin-top:8px}
.aiv-note{font-size:16px;line-height:1.65;color:var(--ink);margin:0 0 12px}
.aiv-visit{margin-top:30px;padding-top:26px;border-top:1px solid var(--hairline)}
.aiv-visit .ace-step__title{margin-bottom:16px}
.aiv-visit-form{margin-top:22px}
@media (max-width:720px){.aiv-tool{padding:56px 16px}.aiv-box{padding:26px 20px}}
/* Boxed inputs (owner 2026-10-22: the underline-only ZIP field was hard to spot), same look as the quote modal. */
.aiv-step .ace-field{border-bottom:0;padding:6px 0 0;margin:0 0 16px}
.aiv-step .ace-field label{font-size:11px;font-weight:600;letter-spacing:.18em;color:rgba(26,23,20,.65)}
.aiv-step .ace-field input{display:block;width:100%;box-sizing:border-box;font-size:17px;margin-top:8px;padding:12px 14px;min-height:50px;background:#fff;border:1px solid rgba(26,23,20,.28);border-radius:4px;transition:border-color .2s ease,box-shadow .2s ease}
.aiv-step .ace-field input:focus{outline:0;border-color:var(--bronze,#A67C3F);box-shadow:0 0 0 3px rgba(166,124,63,.16)}
.aiv-step .ace-field input::placeholder{color:rgba(26,23,20,.4)}

