/* Design-Horoskope: Schritte + Rechner (Quelle: build/custom-dh.less, via apply_theme.php) */
.dh-step-nr { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:50%;
  background:#E8731A; color:#fff; font-weight:800; font-size:20px; font-family:'Playfair Display', serif; }
.dh-rechner { font-family:'Nunito Sans', system-ui, sans-serif; }
.dh-designs { display:grid; grid-template-columns:repeat(auto-fill, minmax(120px,1fr)); gap:10px; }
.dh-designs button { padding:0; border:3px solid transparent; border-radius:10px; background:none; cursor:pointer; overflow:hidden; transition:transform .15s, border-color .15s; }
.dh-designs button:hover { transform:translateY(-2px); }
.dh-designs button.uk-active { border-color:#E8731A; }
.dh-designs img { display:block; width:100%; aspect-ratio:1; object-fit:cover; }
.dh-designs span { display:block; font-size:12px; padding:4px 2px; color:#5B6070; text-align:center; }
.dh-form label { display:block; font-size:13px; font-weight:700; color:#1A2A6C; margin:12px 0 4px; }
.dh-cities { position:relative; }
.dh-cities ul { position:absolute; z-index:20; left:0; right:0; margin:0; padding:0; list-style:none; background:#fff; border:1px solid #ddd; border-radius:6px; max-height:240px; overflow:auto; box-shadow:0 8px 24px rgba(0,0,0,.12); }
.dh-cities li { padding:8px 12px; cursor:pointer; font-size:14px; } .dh-cities li:hover { background:#F4F2EE; }
.dh-out { text-align:center; min-height:320px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:#F4F2EE; border-radius:12px; padding:20px; }
.dh-out img { max-width:100%; height:auto; border-radius:10px; box-shadow:0 12px 40px rgba(0,0,0,.18); }
.dh-out .dh-info { font-size:13px; color:#5B6070; margin-top:10px; }
.dh-hinweis { font-size:12px; color:#5B6070; margin-top:8px; }