/* ==========================================================================
   Minni – Kontaktseite
   ========================================================================== */

.contactp{padding-top:22px;padding-bottom:30px}

/* ---------- Kopf ---------- */
.chero{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:34px;align-items:center;margin:0 0 30px;padding:30px 34px;border-radius:26px;background:radial-gradient(120% 140% at 0% 0%,var(--sticker) 0,var(--surface) 60%);box-shadow:var(--shadow-sm),0 0 0 1px var(--line);overflow:hidden}
.chero::after{content:"♡  ✦  ♡";position:absolute;right:28px;top:20px;font-size:18px;letter-spacing:6px;color:var(--rose-line);pointer-events:none}
.chero__avatar{position:relative;width:150px;height:150px;flex:none}
.chero__avatar::before{content:"";position:absolute;inset:-9px;border-radius:50%;border:2px dashed var(--rose-line);animation:minni-turn 26s linear infinite}
.chero__img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:55% 30%;box-shadow:0 10px 26px -12px rgba(120,60,80,.45);border:4px solid var(--surface)}
.chero__mail{position:absolute;right:-4px;bottom:6px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--rose-btn);color:#fff;box-shadow:0 6px 14px -6px rgba(160,80,100,.7);animation:minni-bob 3.4s ease-in-out infinite}
.chero__mail svg{width:20px;height:20px}
@keyframes minni-turn{to{transform:rotate(1turn)}}
@keyframes minni-bob{50%{transform:translateY(-5px) rotate(-6deg)}}
.chero .kicker{color:var(--rose-strong)}
.chero__title{margin:0;font-size:clamp(32px,4vw,46px)}
.chero__title span{color:var(--rose)}
.chero__hand{margin:2px 0 10px;font-family:var(--font-hand);font-size:26px;line-height:1.1;color:var(--rose-strong);transform:rotate(-2deg);transform-origin:left}
.chero__intro{max-width:620px;margin:0 0 14px;font-family:var(--font-display);font-size:16.5px;line-height:1.6}
.cstatus{display:inline-flex;align-items:center;gap:9px;margin:0;padding:6px 14px 6px 12px;border-radius:99px;background:#e3f3e9;color:#2e6e4a;font-size:13px;font-weight:600}
.cstatus__dot{position:relative;width:9px;height:9px;border-radius:50%;background:#3fae6c}
.cstatus__dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:minni-ping 2s ease-out infinite}
.cstatus--away{background:#fbf0d4;color:#7d5a0e}
.cstatus--away .cstatus__dot{background:#e0a92e}
@keyframes minni-ping{to{transform:scale(2.6);opacity:0}}
html[data-theme="dark"] .cstatus{background:#21392b;color:#9fd9b4}
html[data-theme="dark"] .cstatus--away{background:#3d3220;color:#f0d08a}

/* ---------- Raster ---------- */
.cgrid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px;align-items:start}

/* ---------- Formular ---------- */
.cform-card{position:relative;padding:28px 30px 30px;border-radius:24px;background:var(--surface);box-shadow:var(--shadow-sm),0 0 0 1px var(--line);scroll-margin-top:24px}
.cform__title{margin:0 0 16px;font-size:23px}
.cform__alert{margin:0 0 16px;padding:12px 16px;border-radius:14px;background:#fde8ec;color:#9b2c45;font-size:14px;font-weight:500}
html[data-theme="dark"] .cform__alert{background:#4a2530;color:#ffc2cf}
.ctopics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;border:0;min-width:0}
.ctopic{position:relative;display:block;cursor:pointer}
.ctopic input{position:absolute;opacity:0;pointer-events:none}
.ctopic__card{display:flex;align-items:center;gap:12px;height:100%;padding:12px 14px;border-radius:16px;background:var(--tile);box-shadow:inset 0 0 0 1.5px transparent;transition:background .2s,box-shadow .2s,transform .2s}
.ctopic:hover .ctopic__card{transform:translateY(-2px)}
.ctopic input:checked+.ctopic__card{background:var(--sticker);box-shadow:inset 0 0 0 2px var(--rose)}
.ctopic input:focus-visible+.ctopic__card{outline:3px solid var(--rose-strong);outline-offset:2px}
.ctopic__icon{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:13px;background:var(--surface)}
.ctopic__icon img,.ctopic__icon svg{max-width:32px;max-height:30px;width:auto;height:auto}
.ctopic__txt{display:flex;flex-direction:column;min-width:0;flex:1}
.ctopic__txt strong{font-family:var(--font-display);font-size:15.5px;font-weight:600;line-height:1.25;color:var(--ink)}
.ctopic__txt small{font-size:12px;line-height:1.35;color:var(--muted)}
.ctopic__check{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:var(--surface);color:transparent;box-shadow:inset 0 0 0 1.5px var(--rose-line);transition:background .2s,color .2s}
.ctopic__check svg{width:14px;height:14px}
.ctopic input:checked+.ctopic__card .ctopic__check{background:var(--rose-btn);color:#fff;box-shadow:none}

.cform__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.cfield{display:flex;flex-direction:column;gap:6px;margin:16px 0 0;min-width:0}
.cfield label,.cfield__label{font-size:13.5px;font-weight:600;color:var(--ink)}
.cfield__req{color:var(--rose-strong)}
.cfield input[type=text],.cfield input[type=email],.cfield input[type=url],.cfield select,.cfield textarea{width:100%;min-height:46px;padding:11px 14px;border:0;border-radius:13px;background:var(--tile);box-shadow:inset 0 0 0 1.5px transparent;color:var(--ink);font:inherit;font-size:15px;transition:box-shadow .2s,background .2s}
.cfield textarea{min-height:150px;resize:vertical;line-height:1.55}
.cfield input:focus,.cfield select:focus,.cfield textarea:focus{outline:0;background:var(--surface);box-shadow:inset 0 0 0 2px var(--rose)}
.cfield [aria-invalid="true"]{box-shadow:inset 0 0 0 2px #d0566f!important}
.cfield__err{font-size:12.5px;font-weight:500;color:#b23a55}
html[data-theme="dark"] .cfield__err{color:#ff9fb3}
.ctopics+.cfield__err{margin:8px 0 0}
.cfield__foot{display:flex;justify-content:space-between;gap:12px}
.cfield__count{margin-left:auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}

.cextra{display:none;margin:18px 0 0;padding:4px 18px 18px;border:0;border-radius:18px;background:var(--sticker);min-width:0;animation:minni-in .3s ease}
.cextra legend{float:left;width:100%;padding:14px 0 0;font-family:var(--font-display);font-size:15.5px;font-weight:600;color:var(--ink)}
.cextra legend+*{clear:both}
.cextra .cfield input,.cextra .cfield select{background:var(--surface)}
.cform:has(input[name=topic][value=coop]:checked) .cextra--coop,
.cform:has(input[name=topic][value=post]:checked) .cextra--post,
.cform:has(input[name=topic][value=game]:checked) .cextra--game{display:block}
@keyframes minni-in{from{opacity:0;transform:translateY(-6px)}}

.cchips{display:flex;flex-wrap:wrap;gap:6px}
.cchip{position:relative;cursor:pointer}
.cchip input{position:absolute;opacity:0}
.cchip span{display:inline-block;padding:9px 14px;border-radius:99px;background:var(--surface);font-size:13.5px;font-weight:500;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.cchip input:checked+span{background:var(--rose-btn);color:#fff;box-shadow:none}
.cchip input:focus-visible+span{outline:3px solid var(--rose-strong);outline-offset:2px}

.cform__hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.ccheck{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;font-weight:400!important;line-height:1.5;color:var(--text)!important;cursor:pointer}
.ccheck input{flex:none;width:19px;height:19px;margin:1px 0 0;accent-color:var(--rose-btn)}
.ccheck a{color:var(--rose-strong);text-decoration:underline;text-underline-offset:2px}
.cform__send{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:22px}
.cform__btn .licon{width:19px;height:19px;transition:transform .3s}
.cform__btn:hover .licon{transform:translate(3px,-3px)}
.cform__btn[disabled]{opacity:.7;cursor:progress}
.cform__btn.is-sending .licon{animation:minni-fly .8s ease-in-out infinite}
@keyframes minni-fly{50%{transform:translate(4px,-4px)}}
.cform__note{font-size:12px;color:var(--muted)}

/* ---------- Erfolg ---------- */
.cdone{display:flex;flex-direction:column;align-items:center;padding:30px 10px 16px;text-align:center;outline:0}
.cdone[hidden]{display:none}
.cdone__art{position:relative;display:block;width:150px;height:110px;margin-bottom:12px}
.cdone__env{position:absolute;left:30px;top:30px;width:92px;height:auto;filter:drop-shadow(0 8px 10px rgba(90,60,80,.2));animation:minni-send 1.6s cubic-bezier(.5,-.2,.4,1.2) both}
.cdone__art i{position:absolute;width:12px;height:12px;background:var(--rose);clip-path:path("M6 11 1.2 6.2A2.8 2.8 0 0 1 6 2.4a2.8 2.8 0 0 1 4.8 3.8Z");opacity:0;animation:minni-heart 1.8s ease-out .9s forwards}
.cdone__art i:nth-of-type(1){left:18px;top:62px}
.cdone__art i:nth-of-type(2){left:120px;top:34px;animation-delay:1.1s;transform:scale(1.3)}
.cdone__art i:nth-of-type(3){left:66px;top:6px;animation-delay:1.3s}
@keyframes minni-send{0%{transform:translate(-40px,30px) rotate(-14deg) scale(.6);opacity:0}45%{transform:translate(8px,-14px) rotate(8deg) scale(1.05);opacity:1}70%{transform:translate(-3px,3px) rotate(-3deg)}100%{transform:none}}
@keyframes minni-heart{0%{opacity:0;translate:0 6px}30%{opacity:1}100%{opacity:0;translate:0 -26px}}
.cdone__title{margin:0 0 6px;font-size:26px}
.cdone__text{max-width:420px;margin:0 0 20px;font-family:var(--font-display);font-size:16.5px;color:var(--text)}

/* ---------- Seitenleiste ---------- */
.cside{display:flex;flex-direction:column;gap:16px}
.ccard{position:relative;padding:20px 22px;border-radius:22px;background:var(--surface);box-shadow:var(--shadow-sm),0 0 0 1px var(--line)}
.ccard__title{margin:0 0 10px;font-size:17px}
.ccard p{margin:0 0 14px;font-size:14px;line-height:1.55;color:var(--text)}
.ccard__icon{display:grid;place-items:center;width:46px;height:46px;margin-bottom:12px;border-radius:14px;background:var(--tile);color:var(--rose-strong)}
.ccard__icon svg{width:24px;height:24px}
.ccard__btn{min-height:40px;padding:0 20px;gap:10px;font-size:14px}
.ccard__btn svg{width:15px;height:15px}
.ccard--discord{background:linear-gradient(150deg,#eef0ff 0,#f7eefc 100%);box-shadow:0 0 0 1px #e1e3fb}
.ccard--discord .ccard__icon{background:#5865f2;color:#fff}
.ccard--discord .ccard__title,.ccard--discord p{color:#2f2b4a}
.ccard--discord .ccard__btn{background:#4752c4;color:#fff!important;box-shadow:0 6px 16px -8px rgba(88,101,242,.7)}
.ccard--discord .ccard__btn:hover{background:#3a429e}
html[data-theme="dark"] .ccard--discord{background:linear-gradient(150deg,#262a4d 0,#2c2440 100%);box-shadow:0 0 0 1px #3a3d66}
html[data-theme="dark"] .ccard--discord .ccard__title,html[data-theme="dark"] .ccard--discord p{color:#e6e7ff}
.csocial{display:flex;flex-wrap:wrap;gap:8px}
.csocial .icon-btn{width:46px;height:46px;border-radius:14px;background:var(--tile);transition:transform .2s,background .2s}
.csocial .icon-btn:hover{transform:translateY(-2px);background:var(--sticker)}
.csocial .icon-btn svg{width:22px;height:22px}
.clinks{margin:0;padding:0;list-style:none}
.clinks li+li{border-top:1px dashed var(--line)}
.clinks a{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:14px;color:var(--ink);text-decoration:none}
.clinks a:hover{color:var(--rose-strong)}
.clinks .licon{width:18px;height:18px;color:var(--rose)}

/* ---------- FAQ ---------- */
.cfaq{max-width:820px;margin:44px auto 0}
.cfaq__title{margin:0 0 6px;font-size:28px;text-align:center}
.contactp__content{max-width:820px;margin:34px auto 0}

/* ---------- Tablet & Handy ---------- */
@media (max-width:980px){
	.cgrid{grid-template-columns:1fr}
	.cside{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
}
@media (max-width:640px){
	.contactp{padding-top:10px}
	.chero{grid-template-columns:1fr;justify-items:center;gap:18px;padding:26px 18px 22px;text-align:center}
	.chero::after{display:none}
	.chero__avatar{width:118px;height:118px}
	.chero__mail{width:38px;height:38px}
	.chero__hand{transform:rotate(-2deg);transform-origin:center;font-size:23px}
	.chero__intro{font-size:15.5px}
	.cform-card{padding:22px 16px 22px;border-radius:20px}
	.ctopics{grid-template-columns:1fr;gap:8px}
	.ctopic__card{padding:10px 12px}
	.ctopic__icon{width:40px;height:40px}
	.cform__grid{grid-template-columns:1fr}
	.cextra{padding:2px 14px 14px}
	.cform__btn{width:100%;justify-content:center}
	.cside{grid-template-columns:1fr}
	.cfaq{margin-top:34px}
	.cfaq__title{font-size:24px}
}
@media (prefers-reduced-motion:reduce){
	.chero__avatar::before,.chero__mail,.cstatus__dot::after,.cdone__env,.cdone__art i,.cform__btn.is-sending .licon{animation:none}
	.cdone__art i{opacity:1}
}
.cextra.is-on{display:block}
.cform fieldset{position:relative}
.cform legend.screen-reader-text{left:0;top:0;margin:0;padding:0}