.offer-dialog{width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);border-radius:20px;color:var(--ink);background:white;overflow:auto;overscroll-behavior:contain}
.offer-dialog::backdrop{background:color-mix(in srgb,var(--ink) 50%,transparent);backdrop-filter:blur(4px)}
.dialog-close{position:sticky;top:0;display:flex;justify-content:flex-end;margin:0;padding:12px 16px 0;background:#fff;z-index:1}
.close-button{height:44px;width:44px;border:0;background:var(--stone);border-radius:50%;color:var(--ink);font:28px/1 'Source Sans 3',sans-serif;cursor:pointer}
.dialog-body{padding:0 32px 32px;display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.dialog-copy{color:var(--muted);font-size:18px;line-height:1.65}
.dialog-price{padding:16px 20px;width:100%;border-radius:8px;background:var(--stone);font-weight:600;color:var(--ink)}
@media(max-width:760px){
.offer-dialog{width:100%;max-width:none;max-height:90dvh;margin:auto 0 0;border-radius:24px 24px 0 0;border-bottom:0}
.dialog-body{padding:0 24px 32px;gap:20px}
.dialog-body .btn{width:100%}
.dialog-close{padding-right:16px}
.offer-dialog[open]~.mobile-bar{display:none}
}
.dialog-heading{display:flex;align-items:center;gap:16px;width:100%}
.dialog-heading h2{flex:1;min-width:0;font-size:28px;line-height:1.25}
@media(max-width:760px){
.dialog-heading{gap:14px}
.dialog-heading h2{font-size:24px;line-height:1.3}
.offer-dialog{position:fixed;inset:auto 0 0;max-height:90dvh;margin:0;width:100%;padding-bottom:env(safe-area-inset-bottom)}
}
@media(prefers-reduced-motion:reduce){
.offer-dialog[open]{animation:none!important}
}
.dialog-body{text-align:left}
.dialog-actions{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;text-align:center}
.dialog-actions .dialog-price{text-align:center}
.dialog-actions .details-link{align-self:center;text-align:center}
.dialog-photo{display:block;width:100%;height:auto;max-height:320px;object-fit:contain;border-radius:12px;background:var(--stone)}
.content-dialog .dialog-copy p+p{margin-top:20px}
.content-dialog .dialog-copy strong{color:var(--ink)}
@media(max-width:760px){
.dialog-actions .btn{width:100%}
.dialog-photo{max-height:240px}
}
.dialog-copy p+p{margin-top:20px}
.dialog-actions{width:100%;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.dialog-actions .dialog-price{text-align:center}
.dialog-body{text-align:left}
@media(max-width:760px){
.dialog-actions .btn{width:100%}
}
.close-button:focus-visible{outline:2px solid var(--plum);outline-offset:4px}
.motion-enabled .offer-dialog[open]{animation:dialog-arrive .24s cubic-bezier(.2,.7,.2,1) both}
@keyframes dialog-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.motion-enabled .offer-dialog[open]{animation:dialog-enter .32s cubic-bezier(.2,.75,.2,1) both}
.motion-enabled .offer-dialog[open]::backdrop{animation:backdrop-enter .32s ease both}
.motion-enabled .offer-dialog[open].is-closing{animation:dialog-exit .25s ease-in both}
.motion-enabled .offer-dialog[open].is-closing::backdrop{animation:backdrop-exit .25s ease both}
@keyframes dialog-enter{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes dialog-exit{to{opacity:0;transform:translateY(24px) scale(.98)}}
@keyframes sheet-enter{from{transform:translateY(105%)}to{transform:translateY(0)}}
@keyframes sheet-exit{from{transform:translateY(0)}to{transform:translateY(105%)}}
@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}
@keyframes backdrop-exit{from{opacity:1}to{opacity:0}}
@media(max-width:760px){
.motion-enabled .offer-dialog[open]{animation:sheet-enter .52s cubic-bezier(.22,.72,.18,1) both}
.motion-enabled .offer-dialog[open]::backdrop{animation:backdrop-enter .42s ease both}
.motion-enabled .offer-dialog[open].is-closing{animation:sheet-exit .36s cubic-bezier(.4,0,.8,.4) both}
.motion-enabled .offer-dialog[open].is-closing::backdrop{animation:backdrop-exit .36s ease both}
}