/* Hover, keyboard and touch detail panels for the buyer / seller guides. */
[data-guide],.step-popup button,.step-popup a{-webkit-tap-highlight-color:transparent}
.step-guide-hint{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-4)}
.step[data-guide]{position:relative;cursor:pointer;transition:border-color var(--transition-interactive),box-shadow var(--transition-interactive)}
.step[data-guide]:hover,.step[data-guide]:focus-within{border-color:var(--color-primary);box-shadow:var(--shadow-md)}
.step-title-button,.resource-title-button{font:inherit;letter-spacing:inherit;line-height:inherit;text-align:left;display:inline;cursor:pointer;color:var(--color-primary-deep);padding:0;border:0;background:none}
.step-title-button::after,.resource-title-button::after{content:' +';display:inline-block;color:var(--color-accent);font-size:var(--text-base);padding-left:var(--space-2);font-weight:500}
.step-title-button[aria-expanded="true"]::after,.resource-title-button[aria-expanded="true"]::after{content:' −'}
.step-title-button:hover,.resource-title-button:hover{text-decoration:underline;text-underline-offset:4px}
.step-guide-links{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-6)}
.step-guide-links button{padding:var(--space-2) 0;font-size:var(--text-sm);font-weight:600;text-decoration:underline;text-underline-offset:4px;color:var(--color-primary);border:0;background:none;cursor:pointer}
.card[data-guide]{cursor:pointer}
.card[data-guide]:focus-within{border-color:var(--color-primary);box-shadow:var(--shadow-md)}
.step-popup{position:fixed;inset:auto;margin:0;padding:0;border:1px solid var(--color-border);border-radius:var(--radius-xl);background:var(--color-surface);color:var(--color-text);width:min(560px,calc(100vw - 32px));max-height:min(720px,calc(100dvh - 32px));overflow:hidden;box-shadow:0 20px 65px rgba(16,33,24,.24);z-index:90}
.step-popup:not(:popover-open){display:none}
.step-popup:popover-open{display:flex;flex-direction:column}
.step-popup::backdrop{background:transparent;pointer-events:none}
.step-popup-head{padding:var(--space-6) var(--space-6) var(--space-5);border-bottom:1px solid var(--color-divider);background:var(--color-surface-offset);display:flex;justify-content:space-between;gap:var(--space-4);align-items:flex-start;flex-shrink:0}
.step-popup-category{color:var(--color-accent);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.12em;font-weight:600}
.step-popup h2{font-size:var(--text-lg);font-weight:600;margin-top:var(--space-2)}
.step-popup-close{width:40px;height:40px;flex-shrink:0;border-radius:var(--radius-full);background:var(--color-surface);border:1px solid var(--color-border);font-size:var(--text-lg);line-height:1;display:grid;place-items:center;cursor:pointer}
.step-popup-close:hover{background:var(--color-primary);color:#fff}
.step-popup-body{padding:var(--space-6);overflow-y:auto;overscroll-behavior:contain;min-height:0;scrollbar-width:thin;line-height:1.65}
.step-popup-body p{margin-bottom:var(--space-4);color:var(--color-text-muted)}
.step-popup-body h3{font-size:var(--text-base);line-height:1.4;font-weight:600;margin-block:var(--space-6) var(--space-3)}
.step-popup-body h3:first-child{margin-top:0}
.step-popup-body ul,.step-popup-body ol{padding-left:var(--space-6);margin-bottom:var(--space-5);display:grid;gap:var(--space-2);color:var(--color-text-muted)}
.step-popup-body li::marker{color:var(--color-accent)}
.step-popup-body a{text-decoration:underline;text-underline-offset:3px}
.step-popup-body .step-note{background:var(--color-surface-offset);padding:var(--space-4);border-left:2px solid var(--color-accent);font-size:var(--text-sm);border-radius:var(--radius-sm)}
.step-popup-foot{padding:var(--space-3) var(--space-6);border-top:1px solid var(--color-divider);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);font-size:var(--text-xs);color:var(--color-text-muted);flex-shrink:0}
.step-popup-foot a{font-weight:600;white-space:nowrap}
@media(max-width:600px){
 .step-popup{width:calc(100vw - 24px);max-height:calc(100dvh - 32px);border-radius:var(--radius-xl)}
 .step-popup-head{padding:var(--space-5)}
 .step-popup-body{padding:var(--space-5)}
 .step-popup-foot{padding:var(--space-3) var(--space-5);flex-wrap:wrap;gap:var(--space-2)}
}