.hoppa-greetings{margin:34px auto 10px;padding:26px;border:1px solid rgba(23,212,227,.35);border-radius:22px;background:linear-gradient(145deg,rgba(7,17,34,.96),rgba(5,10,25,.94));box-shadow:0 0 35px rgba(23,212,227,.08),inset 0 1px 0 rgba(255,255,255,.04)}
.hoppa-greetings__head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}.hoppa-greetings__head h2{margin:2px 0 0;font-size:clamp(25px,3vw,38px)}.hoppa-greetings__eyebrow{color:#17d4e3;text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:800}.hoppa-greetings__list{display:grid;gap:14px}.hoppa-greeting-card{display:flex;gap:15px;padding:18px;border:1px solid rgba(158,178,202,.16);border-radius:17px;background:rgba(255,255,255,.025);transition:.2s ease}.hoppa-greeting-card:hover{transform:translateY(-2px);border-color:rgba(255,106,0,.45);box-shadow:0 10px 28px rgba(0,0,0,.22)}.hoppa-greeting-card__avatar{flex:0 0 46px;width:46px;height:46px;display:grid;place-items:center;border-radius:50%;font-size:22px;background:linear-gradient(145deg,#0aa8ff,#6a27d8);box-shadow:0 0 18px rgba(10,168,255,.35)}.hoppa-greeting-card__body{min-width:0;flex:1}.hoppa-greeting-card__meta{display:flex;justify-content:space-between;gap:16px;align-items:center}.hoppa-greeting-card__meta strong{font-size:17px}.hoppa-greeting-card__meta time{color:#9eb2ca;font-size:12px;white-space:nowrap}.hoppa-greeting-card blockquote{margin:9px 0 13px;color:#e8f3ff;font-size:16px;font-style:normal}.hoppa-greeting-audio{display:flex;align-items:center;gap:10px;max-width:520px}.hoppa-greeting-audio__play{width:38px;height:38px;border:0;border-radius:50%;cursor:pointer;background:#ff6a00;color:#fff;font-weight:900;box-shadow:0 0 15px rgba(255,106,0,.35)}.hoppa-greeting-audio__track{height:7px;flex:1;overflow:hidden;border-radius:999px;background:#142840}.hoppa-greeting-audio__track span{display:block;width:0;height:100%;background:linear-gradient(90deg,#17d4e3,#ff6a00);border-radius:inherit}.hoppa-greeting-audio__time{min-width:40px;color:#9eb2ca;font-variant-numeric:tabular-nums;font-size:12px}.hoppa-greetings__empty{text-align:center;padding:34px 18px;color:#9eb2ca}.hoppa-greetings__empty span{font-size:38px}.hoppa-greetings__empty p{margin:8px 0 0}@media(max-width:680px){.hoppa-greetings{padding:18px}.hoppa-greetings__head{align-items:flex-start;flex-direction:column}.hoppa-greetings__submit{width:100%;text-align:center}.hoppa-greeting-card{padding:14px}.hoppa-greeting-card__avatar{flex-basis:40px;width:40px;height:40px}.hoppa-greeting-card__meta{align-items:flex-start;flex-direction:column;gap:2px}.hoppa-greeting-card__meta time{white-space:normal}}

/* Houd verzenden zichtbaar wanneer de audio-preview het formulier langer maakt. */
.hoppa-message-modal{padding:24px 18px;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}
.hoppa-message-modal__dialog{box-sizing:border-box;display:flex;flex-direction:column;max-height:calc(100vh - 48px - env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 48px - env(safe-area-inset-bottom,0px));overflow:hidden;min-height:0}
.hoppa-message-modal__dialog>h2,.hoppa-message-modal__dialog>p,.hoppa-message-modal__dialog>.hoppa-message-notice{flex-shrink:0}
.hoppa-message-form{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.hoppa-message-form__fields{display:grid;gap:13px;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:2px 6px 4px 2px;scroll-padding-block:12px}
.hoppa-message-form__actions{flex-shrink:0;padding-top:10px;border-top:1px solid rgba(23,212,227,.25);background:#071426}
.hoppa-message-form__actions button[type=submit]{display:block;width:100%;min-height:46px}
@media(max-height:500px){.hoppa-message-modal__dialog{padding:16px}.hoppa-message-modal__dialog h2{font-size:20px}.hoppa-message-modal__dialog>p{margin-bottom:10px}}