.hw-ic{--ic:44px;position:relative;display:inline-block;flex:none;width:var(--ic);height:var(--ic);border-radius:50%;overflow:hidden;vertical-align:middle;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.hw-ic img{display:block;width:100%;height:100%;object-fit:cover;margin:0;border-radius:50%}
/* Instagram-Story-Format (900×1600): Kreis aus der Mitte */
.hw-ic.is-raw img{position:absolute;left:50%;top:50%;width:144%;height:auto;max-width:none;border-radius:0;transform:translate(-50%,-50%)}
.hw-ic--sm{--ic:clamp(38px,3.4vw,46px)}
.hw-ic--md{--ic:clamp(48px,4.4vw,60px)}
.hw-ic--lg{--ic:clamp(64px,7vw,96px)}

/* Icon vor Titeln (Panels, Preis-Karten, Weiterbildungen) */
.hw-has-ic{display:flex!important;align-items:center;gap:.55em}
.hw-panel__title.hw-has-ic,.hw-tab__title.hw-has-ic{gap:.6em}
.hw-panel:hover .hw-ic,.hw-panel:focus-within .hw-ic,.hw-tab__card:hover .hw-ic{transform:rotate(-8deg) scale(1.06)}

/* Icon über Seitenkopf / Abschnitt */
.hw-ic-head{display:block;margin:0 0 clamp(14px,1.6vw,22px)!important;line-height:0}
.hw-ic-head--md{margin-bottom:12px!important}
.hw-ic-head .hw-ic{animation:hwIcIn .8s cubic-bezier(.2,.7,.2,1) both}
@keyframes hwIcIn{from{opacity:0;transform:translateY(10px) rotate(-10deg) scale(.9)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hw-ic,.hw-ic-head .hw-ic{transition:none;animation:none}}
