/* Elusive vision preview — interactive demo. Sample data only. */
:root{
  --demo-bg:#f6f4ee; --demo-ink:#14233d; --demo-muted:#5d6a7d; --demo-line:#e2e0d6;
  --demo-card:#ffffff; --demo-mint:#a9cbb7; --demo-mint-strong:#8fbda4; --demo-mint-ink:#12402f;
  --demo-soft:#eef4ef; --demo-amber:#f6e7c8; --demo-amber-ink:#7a5a1c;
  --demo-serif:'Playfair Display',Georgia,serif; --demo-sans:'DM Sans','Manrope',system-ui,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--demo-bg);color:var(--demo-ink);font:400 15px/1.6 var(--demo-sans);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p{margin:0}
button{font:inherit;cursor:pointer}
a{color:inherit}
.wrap{width:min(1180px,calc(100% - 48px));margin-inline:auto}

.preview-bar{background:#12233d;color:#dfe6f0;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.preview-bar .wrap{display:flex;justify-content:space-between;gap:16px;min-height:34px;align-items:center}
.demo-header{background:var(--demo-bg);border-bottom:1px solid var(--demo-line)}
.demo-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px}
.demo-brand{font:500 1.9rem/1 var(--demo-serif);letter-spacing:-.02em}
.demo-brand span{display:block;font:500 .6rem/1 var(--demo-sans);letter-spacing:.42em;margin-top:6px;color:var(--demo-muted)}
.portal-switch{display:flex;gap:6px}
.portal-switch button{border:0;background:none;padding:9px 15px;border-radius:7px;font-size:.88rem;color:var(--demo-muted)}
.portal-switch button[aria-selected=true]{background:var(--demo-soft);color:var(--demo-ink);font-weight:500}
.demo-reset{border:1px solid var(--demo-line);background:#fff;border-radius:7px;padding:8px 13px;font-size:.78rem;color:var(--demo-muted)}.portal-brand{display:flex;align-items:center;text-decoration:none}.portal-brand img{display:block;height:40px;width:auto}.portal-nav{display:flex;gap:23px;font-size:.87rem;margin-inline:auto}.portal-nav a{text-decoration:none;color:var(--demo-ink);padding-block:4px;border-bottom:1px solid transparent}.portal-nav a:hover{border-bottom-color:var(--demo-mint-strong)}.portal-intro{padding:34px 0 4px}.handoff-preview{display:flex;gap:16px;align-items:center;margin-top:16px;padding:14px;border:1px solid var(--demo-line);border-radius:9px;background:var(--demo-soft)}.handoff-preview img{width:110px;height:84px;object-fit:cover;border-radius:6px;flex-shrink:0}.handoff-preview p{margin-top:4px}@media(max-width:560px){.handoff-preview{flex-direction:column;align-items:flex-start}.handoff-preview img{width:100%;height:150px}}.draft-resume{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-left:3px solid var(--demo-mint-strong);background:var(--demo-soft)}.draft-resume p{margin-top:5px}.draft-resume-actions{display:flex;gap:10px;flex-wrap:wrap}@media(max-width:620px){.draft-resume{display:block}.draft-resume-actions{margin-top:14px}.draft-resume-actions .btn{flex:1;justify-content:center}}.portal-intro h1{font:500 2.35rem/1.15 var(--demo-serif);letter-spacing:-.01em}.portal-intro p{margin-top:12px;max-width:620px;color:var(--demo-muted)}.portal-event{margin-top:18px;max-width:620px;border-left:3px solid var(--demo-mint-strong);background:var(--demo-soft);border-radius:0 8px 8px 0;padding:14px 16px;font-size:.9rem}.portal-event strong{display:block;margin-bottom:4px}.portal-event a{text-decoration:underline;text-underline-offset:3px;white-space:nowrap}.portal-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.portal-footer-links{display:flex;gap:18px}.portal-footer-links a{text-decoration:none}.portal-footer-links a:hover{text-decoration:underline}@media(max-width:940px){.portal-nav{display:none}.portal-intro{padding-top:26px}.portal-intro h1{font-size:1.95rem}}

.portal{padding:34px 0 64px}
.portal[hidden]{display:none}
.portal-intro{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:26px}
.portal-intro h2{font:500 2.1rem/1.15 var(--demo-serif);letter-spacing:-.02em}
.portal-intro p{color:var(--demo-muted);margin-top:8px;font-size:.95rem}
.eyebrow{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--demo-muted);margin-bottom:10px}
.pill{display:inline-block;background:var(--demo-soft);color:var(--demo-mint-ink);border-radius:20px;padding:5px 12px;font-size:.72rem}
.pill-amber{background:var(--demo-amber);color:var(--demo-amber-ink)}
.pill-plain{background:#eef0f3;color:var(--demo-muted)}

.card{background:var(--demo-card);border:1px solid var(--demo-line);border-radius:12px;padding:22px}
.grid-2{display:grid;grid-template-columns:1.25fr .85fr;gap:22px;align-items:start}
.grid-equal{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.btn{border:0;border-radius:8px;padding:12px 18px;font-size:.9rem;font-weight:500;display:inline-flex;align-items:center;gap:10px}
.btn-primary{background:var(--demo-mint);color:var(--demo-mint-ink)}
.btn-primary:hover{background:var(--demo-mint-strong)}
.btn-quiet{background:#fff;border:1px solid var(--demo-line);color:var(--demo-ink)}
.btn[disabled]{opacity:.55;cursor:default}
.btn-done{background:var(--demo-soft);color:var(--demo-mint-ink)}
.link-btn{border:0;background:none;padding:6px 0;color:var(--demo-ink);text-decoration:underline;text-underline-offset:4px;font-size:.85rem}

/* hero */
.demo-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center;padding:26px 0 34px}
.demo-hero h1{font:500 clamp(2.1rem,3.4vw,3rem)/1.1 var(--demo-serif);letter-spacing:-.03em}
.demo-hero .lead{color:var(--demo-muted);margin-top:14px}
.start-card{background:#fff;border:1px solid var(--demo-line);border-radius:12px;padding:18px;margin-top:22px;max-width:430px}
.start-card label{font-size:.8rem;color:var(--demo-muted);display:block;margin-bottom:8px}
.start-row{display:flex;gap:8px}
.start-row input{flex:1;min-width:0;border:1px solid var(--demo-line);border-radius:8px;padding:11px 12px;font:inherit}
.hero-photo{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3;background:#dfe3dc}
.hero-photo img{width:100%;height:100%;object-fit:cover}
.hero-note{position:absolute;left:14px;bottom:14px;right:14px;background:#ffffffee;border-radius:9px;padding:12px 14px;font-size:.82rem}
.trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;color:var(--demo-muted);font-size:.8rem}

.service-row{margin-top:10px}
.service-row h3{font:500 1.3rem/1.3 var(--demo-serif);margin-bottom:14px}
.service-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.service-cards button{border:1px solid var(--demo-line);background:#fff;border-radius:11px;padding:0;overflow:hidden;text-align:left}
.service-cards img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.service-cards span{display:block;padding:11px 12px;font-size:.85rem}
.service-cards button[aria-pressed=true]{border-color:var(--demo-mint-strong);box-shadow:0 0 0 2px var(--demo-soft)}

/* wizard */
.stepper{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:6px 0 22px}
.stepper li{display:flex;align-items:center;gap:9px;font-size:.8rem;color:var(--demo-muted);list-style:none}
.stepper li+li:before{content:'';width:26px;height:1px;background:var(--demo-line)}
.step-dot{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#eceee9;color:var(--demo-muted);font-size:.72rem}
.stepper li.is-current .step-dot{background:#12233d;color:#fff}
.stepper li.is-done .step-dot{background:var(--demo-mint);color:var(--demo-mint-ink)}
.stepper li.is-current{color:var(--demo-ink);font-weight:500}
.field{margin-bottom:16px}
.field label{display:block;font-size:.82rem;color:var(--demo-muted);margin-bottom:6px}
.field select,.field input{width:100%;border:1px solid var(--demo-line);border-radius:8px;padding:11px 12px;font:inherit;background:#fff}
/* Checkboxes and radios keep their natural size (the rule above made them full width). */
.field input[type=checkbox],.field input[type=radio]{width:18px;height:18px;min-width:18px;padding:0;margin:0;flex:none;border:0;border-radius:0;accent-color:#0d234b;cursor:pointer}

.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.choice{border:1px solid var(--demo-line);background:#fff;border-radius:10px;padding:0;overflow:hidden;text-align:left}
.choice img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
.choice span{display:block;padding:10px 12px;font-size:.85rem}
.choice small{display:block;padding:0 12px 11px;color:var(--demo-muted);font-size:.75rem}
.choice[aria-pressed=true]{border-color:var(--demo-mint-strong);box-shadow:0 0 0 2px var(--demo-soft)}
.wizard-actions{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:20px}
.side-note{font-size:.8rem;color:var(--demo-muted);margin-top:12px}

/* budget */
.estimate{font:500 2.3rem/1.1 var(--demo-serif);margin:10px 0 6px}
.line-items{margin-top:16px;border-top:1px solid var(--demo-line)}
.line-items div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--demo-line);font-size:.88rem}
.selection-list{list-style:none;padding:0;margin:12px 0 0;font-size:.85rem;color:var(--demo-muted)}
.selection-list li{padding:4px 0}

/* slots + timeline */
.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px}
.slot{border:1px solid var(--demo-line);background:#fff;border-radius:9px;padding:12px;font-size:.85rem;text-align:left}
.slot[aria-pressed=true]{border-color:var(--demo-mint-strong);box-shadow:0 0 0 2px var(--demo-soft)}
.timeline{list-style:none;margin:18px 0 0;padding:0}
.timeline li{display:flex;gap:14px;padding-bottom:18px;position:relative}
.timeline li:before{content:'';position:absolute;left:11px;top:26px;bottom:0;width:1px;background:var(--demo-line)}
.timeline li:last-child{padding-bottom:0}
.timeline li:last-child:before{display:none}
.timeline .step-dot{flex-shrink:0}
.timeline strong{display:block;font-weight:500;font-size:.95rem}
.timeline span{display:block;color:var(--demo-muted);font-size:.82rem;margin-top:2px}
.doc-list div{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid var(--demo-line);font-size:.86rem}
.doc-list div:last-child{border-bottom:0}
.kv div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--demo-line);font-size:.87rem}
.kv div:last-child{border-bottom:0}
.kv span:first-child{color:var(--demo-muted)}
.stack{display:grid;gap:14px}
.muted{color:var(--demo-muted)}
.small{font-size:.8rem}
.demo-footer{border-top:1px solid var(--demo-line);padding:20px 0 40px;color:var(--demo-muted);font-size:.78rem;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.callout{background:var(--demo-soft);border-radius:9px;padding:12px 14px;font-size:.82rem;color:var(--demo-mint-ink);margin-top:14px}

@media(max-width:980px){
  .grid-2,.grid-equal,.demo-hero{grid-template-columns:1fr}
  .service-cards{grid-template-columns:repeat(2,1fr)}
  .choice-grid,.slots{grid-template-columns:1fr}
  .wrap{width:calc(100% - 32px)}
  .demo-header .wrap{flex-wrap:wrap;min-height:0;padding:14px 0;gap:12px}
  .field-row{grid-template-columns:1fr}
}

/* photo helpers: sprite tiles stand in where we have no real photo yet */
.photo{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#dfe3dc}
.photo-sprite{background-image:url('../assets/design-concepts.webp');background-size:300% 200%;background-repeat:no-repeat}
.photo-bathroom{background-position:50% 0}
.photo-adu{background-position:100% 100%}
.photo-tall{aspect-ratio:3/2}

/* Google address autocomplete sits where the plain input was. */
#places-field gmp-place-autocomplete{width:100%;--gmp-mat-color-surface:#fff}

/* photo previews, conversation, proposal */
.photo-previews{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 6px}
.photo-previews img{width:74px;height:74px;object-fit:cover;border-radius:8px;border:1px solid var(--demo-line)}
.thread{display:grid;gap:10px;margin:12px 0}
.bubble{padding:10px 13px;border-radius:12px;font-size:.88rem;max-width:88%;line-height:1.5}
.bubble small{display:block;color:var(--demo-muted);font-size:.72rem;margin-top:4px}
.bubble.customer{background:var(--demo-soft);justify-self:end}
.bubble.team{background:#fff;border:1px solid var(--demo-line);justify-self:start}
.message-box{width:100%;min-height:84px;border:1px solid var(--demo-line);border-radius:8px;padding:10px 12px;font:inherit;resize:vertical}
.proposal-price{font:500 2rem/1.1 var(--demo-serif);margin:8px 0}
.proposal-included{white-space:pre-line;color:var(--demo-muted);font-size:.9rem;margin-top:8px}

/* Customer extras: more services, saved selections, financing, proposal changes, client login */
.service-cards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.photo-plain{display:flex;align-items:flex-end;width:100%;aspect-ratio:4/3;background:linear-gradient(135deg,#12233d,#2f5d6b);color:#fff;padding:12px}
.photo-plain span,.service-cards .photo-plain span{display:block;padding:0;color:#fff;font:500 1.05rem/1.2 var(--demo-serif)}
.photo-plain.photo-tall{aspect-ratio:3/2}
.service-cards .photo-plain span{display:none}
.check-row{display:flex;gap:10px;align-items:flex-start;font-size:.88rem;margin:16px 0 4px;cursor:pointer}
.check-row input{width:18px;height:18px;min-width:18px;margin:2px 0 0;flex:none;accent-color:#0d234b}
.saved-selections{border:1px solid var(--demo-line);border-radius:10px;padding:2px 14px 12px;margin-top:16px;background:#fbfbf8}
.saved-selections ul{margin:6px 0 0 28px;padding:0;font-size:.82rem;color:var(--demo-muted)}
.selection-items{margin:10px 0 0 18px;padding:0;font-size:.88rem;color:var(--demo-muted)}
.change-box{margin-top:14px}
.login-card{max-width:520px;margin:0 auto}
.login-title{font:500 1.8rem/1.2 var(--demo-serif);margin:6px 0 10px}
.login-form{display:grid;gap:12px;margin:18px 0 10px}
.login-form .btn{justify-self:start}
.project-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 2px;border-bottom:1px solid var(--demo-line);color:inherit;text-decoration:none}
.project-row:last-child{border-bottom:0}
.project-row div{display:grid;gap:2px}
.project-row div span{color:var(--demo-muted);font-size:.88rem}
.project-row small{color:var(--demo-muted);font-size:.75rem}
.project-row:hover strong{text-decoration:underline}
.header-links{display:flex;gap:10px;align-items:center}
@media(max-width:560px){.service-cards{grid-template-columns:repeat(2,1fr)}.project-row{flex-direction:column;align-items:flex-start}}
.price-notes{margin:12px 0 4px 18px;padding:0;font-size:.85rem;color:var(--demo-ink)}
.price-notes li{margin:3px 0}
.estimate.estimate-words{font-size:1.7rem;line-height:1.2}

/* Site visit booking, calendar, progress photos, contractor quotes and updates */
.visit-days{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;margin:6px 0 16px}
.visit-day{border:1px solid var(--demo-line);background:#fff;border-radius:9px;padding:9px 8px;text-align:center;font-size:.8rem;cursor:pointer;color:var(--demo-ink)}
.visit-day strong{display:block;font-size:.95rem}
.visit-day small{display:block;color:var(--demo-muted);font-size:.7rem}
.visit-day[aria-pressed=true]{border-color:var(--demo-mint-strong);box-shadow:0 0 0 2px var(--demo-soft)}
.visit-day:disabled,.slot:disabled{opacity:.45;cursor:not-allowed}
.slots.windows{grid-template-columns:repeat(4,1fr)}
.calendar-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.calendar-actions .btn{text-decoration:none}
.progress-photos{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.progress-photos img{width:92px;height:92px;object-fit:cover;border-radius:8px;border:1px solid var(--demo-line)}
.job-form{display:grid;gap:10px;margin-top:12px}
.job-form textarea{width:100%;min-height:90px;border:1px solid var(--demo-line);border-radius:8px;padding:10px 12px;font:inherit;box-sizing:border-box}
.job-item{border-top:1px solid var(--demo-line);padding-top:10px;margin-top:10px;font-size:.88rem}
.job-item p{margin:0 0 4px}
.job-item .included{white-space:pre-line;color:var(--demo-muted);margin-top:4px}
@media(max-width:560px){.slots.windows{grid-template-columns:repeat(2,1fr)}}

/* Upload drop zone: request form photos and trade partner documents */
.file-input-hidden{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0)}
.field-label{display:block;font-size:.82rem;color:var(--demo-muted);margin-bottom:6px}
.upload-drop,.field label.upload-drop{display:flex;align-items:center;gap:14px;margin:0;font-size:inherit;color:inherit;padding:18px;border:1.5px dashed #b9cfc1;border-radius:12px;background:var(--demo-soft);cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s}
.upload-drop:hover,.upload-drop.is-drag{border-color:var(--demo-mint-strong);background:#e4f0e7}
.upload-drop.is-drag{box-shadow:0 0 0 4px #8fbda433}
.file-input-hidden:focus-visible+.upload-drop{outline:3px solid #008cac;outline-offset:3px}
.upload-drop-icon{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;background:#fff;color:#0d234b;box-shadow:0 2px 8px rgba(13,35,75,.08)}
.upload-drop-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.upload-drop-text{flex:1;min-width:0}
.upload-drop-text strong{display:block;font-size:.95rem;color:var(--demo-ink)}
.upload-drop-text small{display:block;margin-top:2px;font-size:.76rem;color:var(--demo-muted);overflow-wrap:anywhere}
.upload-drop-button{flex:none;padding:9px 16px;border-radius:999px;background:#0d234b;color:#fff;font-size:.82rem;font-weight:600}
.upload-drop.is-full{opacity:.55;pointer-events:none}
.upload-drop.is-small{padding:12px 14px;gap:10px}
.upload-drop.is-small .upload-drop-icon{width:36px;height:36px}
.upload-drop.has-file{border-style:solid;border-color:var(--demo-mint-strong);background:#fff}
.photo-pick{position:relative;padding:0;border:2px solid transparent;border-radius:10px;background:none;line-height:0;cursor:pointer}
.photo-pick img{display:block;width:74px;height:74px;object-fit:cover;border-radius:8px}
.photo-pick[aria-pressed=true]{border-color:#0d234b}
.photo-pick[aria-pressed=true]::after{content:'✦';position:absolute;right:4px;top:4px;width:20px;height:20px;border-radius:50%;background:#0d234b;color:#fff;font-size:.65rem;line-height:20px;text-align:center}
.photo-pick:focus-visible{outline:3px solid #008cac;outline-offset:2px}
.preview-toggle{margin-top:10px}
.vendor-docs{display:grid;gap:10px}
.vendor-doc-expiry{display:grid;gap:4px;margin:8px 0 0 50px}
.vendor-doc-expiry label{font-size:.78rem;color:var(--demo-muted)}
.vendor-doc-expiry input{max-width:220px}
@media(max-width:560px){.upload-drop{flex-wrap:wrap}.upload-drop-button{width:100%;text-align:center}.vendor-doc-expiry{margin-left:0}}

/* AI style preview on the pricing step */
.ai-preview{position:relative}
.ai-preview.is-loading{overflow:hidden;border-radius:12px}
.ai-preview-base{filter:blur(4px) saturate(.8);transform:scale(1.04)}
.ai-preview-veil{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px;text-align:center;color:#fff;background:linear-gradient(120deg,rgba(13,35,75,.74),rgba(13,35,75,.46),rgba(13,35,75,.74));background-size:200% 100%;animation:ai-shimmer 2.4s ease-in-out infinite}
.ai-preview-veil strong{font-size:1rem}
.ai-preview-veil small{max-width:260px;font-size:.78rem;opacity:.88}
.ai-spinner{width:34px;height:34px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:ai-spin 1s linear infinite}
@keyframes ai-spin{to{transform:rotate(360deg)}}
@keyframes ai-shimmer{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.ai-compare{--split:50%;position:relative;overflow:hidden;aspect-ratio:4/3;border-radius:12px;background:#dfe5e1}
.ai-compare img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ai-before-wrap{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.ai-compare::after{content:'';position:absolute;top:0;bottom:0;left:var(--split);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 10px rgba(0,0,0,.35);pointer-events:none}
.ai-slider{position:absolute;inset:0;z-index:2;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.ai-compare:has(.ai-slider:focus-visible){outline:3px solid #008cac;outline-offset:3px}
.ai-tag{position:absolute;bottom:10px;z-index:1;padding:5px 9px;border-radius:999px;background:rgba(13,35,75,.8);color:#fff;font-size:.7rem;pointer-events:none}
.ai-tag-before{left:10px}
.ai-tag-after{right:10px}
.ai-note{margin-top:8px;font-size:.75rem;color:var(--demo-muted)}
.ai-error{color:#7a5a1c}
@media(prefers-reduced-motion:reduce){.ai-spinner,.ai-preview-veil{animation:none}}

/* Estimate reveal on the pricing step */
.estimate-loading{min-height:150px}
.estimate-skeleton{display:grid;gap:8px;margin:14px 0 14px}
.estimate-skeleton span{display:block;width:78%;height:34px;border-radius:8px;background:linear-gradient(90deg,#eef1ee 25%,#dde8e1 50%,#eef1ee 75%);background-size:200% 100%;animation:estimate-shimmer 1.2s ease-in-out infinite}
.estimate-skeleton span+span{width:55%;height:12px}
.estimate-steps{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.estimate-steps li{position:relative;padding-left:24px;font-size:.84rem;color:var(--demo-muted);opacity:0;animation:estimate-step .35s ease forwards;animation-delay:calc(var(--i) * .5s)}
.estimate-steps li::before{content:'';position:absolute;left:0;top:.18em;width:14px;height:14px;box-sizing:border-box;border:2px solid var(--demo-mint-strong);border-right-color:transparent;border-radius:50%;animation:ai-spin .8s linear infinite,estimate-done .2s ease forwards;animation-delay:0s,calc((var(--i) + 1) * .5s)}
.estimate-steps li::after{content:'✓';position:absolute;left:3px;top:.05em;font-size:.62rem;font-weight:700;color:#fff;opacity:0;animation:estimate-step .2s ease forwards;animation-delay:calc((var(--i) + 1) * .5s)}
.estimate.is-counting{font-variant-numeric:tabular-nums}
@keyframes estimate-step{to{opacity:1}}
@keyframes estimate-done{to{background:var(--demo-mint-strong);border-color:var(--demo-mint-strong)}}
@keyframes estimate-shimmer{from{background-position:100% 0}to{background-position:-100% 0}}
@media(prefers-reduced-motion:reduce){.estimate-skeleton span,.estimate-steps li,.estimate-steps li::before,.estimate-steps li::after{animation:none;opacity:1}}
.estimate-wait{display:flex;gap:10px;align-items:center;margin:2px 0 0;font-size:.86rem;color:var(--demo-muted)}
.estimate-wait-dot{flex:none;width:14px;height:14px;box-sizing:border-box;border:2px solid var(--demo-mint-strong);border-right-color:transparent;border-radius:50%;animation:ai-spin .8s linear infinite}
@media(prefers-reduced-motion:reduce){.estimate-wait-dot{animation:none}}