/* Principal's Desk page: photo card + message */
.pdesk-wrap { display: grid; grid-template-columns: 290px 1fr; gap: 30px; align-items: start; margin-top: 18px; }
.pdesk-card { position: sticky; top: 20px; border-radius: 22px; overflow: hidden; background: #fff; box-shadow: 0 14px 38px rgba(14, 54, 66, .22); border: 1px solid #e8eef0; animation: pdeskIn .9s cubic-bezier(.2, .8, .2, 1) both; }
.pdesk-photo { position: relative; overflow: hidden; aspect-ratio: 4 / 4.4; background: #0e3642; }
.pdesk-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; display: block; animation: pdeskZoom 14s ease-in-out infinite alternate; }
.pdesk-photo::after { content: ""; position: absolute; inset: auto 0 0 0; height: 40%; background: linear-gradient(to top, rgba(14, 54, 66, .55), transparent); }
.pdesk-name { position: relative; text-align: center; padding: 16px 14px 20px; background: linear-gradient(135deg, #0e3642, #164e63); color: #fff; }
.pdesk-name::before { content: ""; position: absolute; left: 50%; top: -3px; width: 70px; height: 5px; border-radius: 5px; transform: translateX(-50%); background: linear-gradient(90deg, #f6c90e, #ea1f63); }
.pdesk-name b { display: block; font-size: 1.15rem; letter-spacing: .3px; }
.pdesk-name span { display: inline-block; margin: 6px 0 4px; padding: 3px 14px; border-radius: 20px; background: #ea1f63; font-size: .85rem; font-weight: 600; letter-spacing: .6px; text-transform: uppercase; }
.pdesk-name small { display: block; opacity: .85; font-size: .8rem; }
.pdesk-msg { position: relative; padding: 26px 28px 22px; border-radius: 22px; background: #fff; box-shadow: 0 10px 30px rgba(14, 54, 66, .1); border: 1px solid #eef2f3; border-top: 5px solid #ea1f63; animation: pdeskIn .9s .15s cubic-bezier(.2, .8, .2, 1) both; }
.pdesk-msg::before { content: "\201C"; position: absolute; right: 22px; top: -6px; font: 700 110px/1 Georgia, serif; color: rgba(234, 31, 99, .12); pointer-events: none; }
.pdesk-title { margin: 0 0 14px; font-size: 1.15rem; font-weight: 700; color: #0e3642; display: flex; align-items: center; gap: 10px; }
.pdesk-title::after { content: ""; flex: 1; height: 2px; background: linear-gradient(90deg, #f6c90e, transparent); }
.pdesk-msg p { line-height: 1.8; margin-bottom: 12px; }
.pdesk-msg p:first-of-type { font-weight: 600; color: #0e3642; }
.pdesk-sign { margin-top: 16px; padding-top: 12px; border-top: 1px dashed #cfd9dc; text-align: right; color: #0e3642; }
.pdesk-sign b { display: block; font-size: 1.05rem; }
.pdesk-sign span { font-size: .9rem; color: #ea1f63; font-weight: 600; }
@keyframes pdeskIn { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes pdeskZoom { from { transform: scale(1); } to { transform: scale(1.08); } }
@media (max-width: 767px) { .pdesk-wrap { grid-template-columns: 1fr; } .pdesk-card { position: static; max-width: 340px; margin: 0 auto; } .pdesk-msg { padding: 22px 18px 18px; } }
@media (prefers-reduced-motion: reduce) { .pdesk-card, .pdesk-msg, .pdesk-photo img { animation: none; } }

/* one single card: photo on the left, the message flows around it */
.pdesk-wrap { display: flow-root; background: #fff; border-radius: 22px; padding: 28px 30px 22px; box-shadow: 0 12px 36px rgba(14, 54, 66, .12); border: 1px solid #edf2f3; border-top: 5px solid #ea1f63; }
.pdesk-card { float: left; width: 270px; margin: 0 30px 16px 0; position: static; box-shadow: 0 12px 30px rgba(14, 54, 66, .25); }
.pdesk-msg { position: static; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; animation: none; }
.pdesk-msg::before { display: none; }
.pdesk-title { font-size: 1.3rem; }
.pdesk-msg p { text-align: justify; line-height: 1.75; font-size: .98rem; margin-bottom: 10px; }
.pdesk-sign { clear: none; }
@media (max-width: 767px) { .pdesk-wrap { padding: 20px 16px 16px; } .pdesk-card { float: none; width: 100%; max-width: 300px; margin: 0 auto 18px; } }
.pdesk-wrap { background: transparent; border: 0; box-shadow: none; padding: 6px 0 0; }