/* ===== contact page: pinned notes with animation ===== */
.sc-contact{grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.ct-msg{padding:14px 18px;border-radius:14px;margin-bottom:16px;font-weight:600;line-height:1.5;animation:ctMsg .5s cubic-bezier(.2,.9,.3,1.3)}
.ct-msg[hidden]{display:none}
.ct-msg.ok{background:#e4f7ea;color:#14663a}.ct-msg.err{background:#fde8e8;color:#9b1c1c}.ct-msg a{text-decoration:underline;font-weight:800}
@keyframes ctMsg{from{opacity:0;transform:translateY(-10px) scale(.96)}}
#scSend.is-sending{opacity:.75;cursor:progress}
#scSend.is-sending b{display:inline-block;animation:ctFly 1s ease-in-out infinite}
@keyframes ctFly{50%{transform:translate(6px,-6px)}}

.ct-head{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:var(--blue2)}
.ct-dot{width:10px;height:10px;border-radius:50%;background:#25d366;box-shadow:0 0 0 0 rgba(37,211,102,.6);animation:ctPing 2s ease-out infinite}
@keyframes ctPing{to{box-shadow:0 0 0 14px rgba(37,211,102,0)}}

.ct-notes{grid-template-columns:1fr 1fr;gap:62px 26px;padding:42px 6px 16px}
.ct-wide{grid-column:1/-1}
.ct-card{border-radius:32px;padding:12px}
.ct-card .sn-in{min-height:0;padding:20px 20px 24px;border-radius:24px}
.ct-card .sn-in b{margin:18px 0 8px;font-size:21px}
.ct-card .sn-in small{max-width:none;font-size:14px;color:rgba(15,23,42,.62);font-weight:600;line-height:1.55}
.ct-mail{word-break:break-all;font-size:15px!important}
.ct-card .sn-go{right:22px;bottom:22px;width:38px;height:38px}
.ct-card .sn-num{font-size:13px;letter-spacing:.12em}

/* push-pin */
.ct-pin{position:absolute;z-index:4;top:-18px;left:var(--px,50%);width:32px;height:32px;margin-left:-16px;border-radius:50%;
 background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.75) 0 14%,transparent 38%),radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--tape) 82%,#fff),var(--tape) 55%,color-mix(in srgb,var(--tape) 70%,#000));
 box-shadow:0 12px 14px -4px color-mix(in srgb,var(--tape) 55%,rgba(0,0,0,.4)),inset 0 -4px 6px rgba(0,0,0,.18);animation:ctPin 3.8s ease-in-out infinite;animation-delay:var(--d,0s)}
.ct-pin:after{content:"";position:absolute;left:50%;top:78%;width:6px;height:10px;margin-left:-3px;background:linear-gradient(90deg,#9aa4ae,#e5eaee,#8b95a0);border-radius:0 0 3px 3px;z-index:-1}
@keyframes ctPin{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-3px) rotate(-8deg)}70%{transform:translateY(0) rotate(6deg)}}
a.ct-card:hover .ct-pin{animation:ctPinHit .6s ease}
@keyframes ctPinHit{30%{transform:translateY(-10px) scale(1.15)}60%{transform:translateY(2px)}}

/* icon bubble */
.ct-ic{position:absolute;z-index:2;right:18px;top:16px;width:46px;height:46px;border-radius:16px 6px 16px 6px;display:grid;place-items:center;background:#fff;color:var(--num);box-shadow:0 8px 18px rgba(0,0,0,.09);animation:ctIc 3.4s ease-in-out infinite;animation-delay:var(--d,0s)}
.ct-ic:after{content:"";position:absolute;inset:-5px;border-radius:inherit;border:2px solid var(--tape);opacity:0;animation:ctRing 2.8s ease-out infinite;animation-delay:var(--d,0s)}
.ct-ic svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@keyframes ctIc{50%{transform:translateY(-5px) rotate(-6deg)}}
@keyframes ctRing{0%{transform:scale(.9);opacity:.8}100%{transform:scale(1.55);opacity:0}}
a.ct-card:hover .ct-ic{animation-play-state:paused;transform:rotate(-12deg) scale(1.12);background:var(--tape);color:#fff}

/* socials */
.ct-soc{position:relative;display:flex;gap:12px;margin-top:2px}
.ct-soc a{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--num);box-shadow:0 8px 18px rgba(0,0,0,.1);transition:transform .35s cubic-bezier(.2,1.4,.3,1),background .25s,color .25s}
.ct-soc a:hover{transform:translateY(-6px) rotate(-10deg) scale(1.12);background:var(--tape);color:#fff}
.ct-soc svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:900px){.sc-contact{grid-template-columns:1fr;gap:34px}.ct-notes{padding-top:46px}}
@media(max-width:560px){.ct-notes{grid-template-columns:1fr;gap:52px}.ct-wide{grid-column:auto}.ct-card{--rot:-2deg}.ct-card:nth-child(even){--rot:2deg}}
@media(prefers-reduced-motion:reduce){.ct-pin,.ct-ic,.ct-ic:after,.ct-dot,.ct-msg{animation:none!important}}