/* Nous contacter: page-specific blocks on top of the storefront theme. */
.playnest-site .pn-contact-hero { min-height: 520px; }
.playnest-site .pn-contact-art { position: relative; min-height: 420px; display: flex; flex-direction: column; justify-content: center; gap: 16px; padding: 0 20px; isolation: isolate; }
.playnest-site .pn-contact-art .pn-orbit { top: 0; left: 50%; transform: translateX(-50%); }
.playnest-site .pn-contact-bubble { display: flex; align-items: flex-end; gap: 10px; max-width: 360px; animation: pn-contact-in .6s ease backwards; }
.playnest-site .pn-contact-bubble p { margin: 0; padding: 14px 18px; border-radius: 18px; font-size: 13px; line-height: 1.6; box-shadow: 0 16px 40px #425c891f; }
.playnest-site .pn-contact-bubble > span { flex: 0 0 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; font-weight: 800; font-size: 13px; }
.playnest-site .pn-contact-bubble.is-them { align-self: flex-start; }
.playnest-site .pn-contact-bubble.is-them p { background: #fff; color: #34425b; border-bottom-left-radius: 4px; }
.playnest-site .pn-contact-bubble.is-them > span { background: #fcebe5; color: #d0634b; }
.playnest-site .pn-contact-bubble.is-us { align-self: flex-end; animation-delay: .5s; }
.playnest-site .pn-contact-bubble.is-us p { background: #3d5ee8; color: #fff; border-bottom-right-radius: 4px; }
.playnest-site .pn-contact-bubble.is-us > span { background: #202e43; color: #f2b69a; }
.playnest-site .pn-contact-typing { align-self: flex-start; display: flex; gap: 5px; margin-left: 44px; padding: 12px 16px; border-radius: 16px; background: #fff; box-shadow: 0 10px 30px #425c891a; animation: pn-contact-in .5s ease 1.1s backwards; }
.playnest-site .pn-contact-typing i { width: 7px; height: 7px; border-radius: 50%; background: #b4bcc8; animation: pn-contact-dot 1.2s ease-in-out infinite; }
.playnest-site .pn-contact-typing i:nth-child(2) { animation-delay: .15s; }
.playnest-site .pn-contact-typing i:nth-child(3) { animation-delay: .3s; }

.playnest-site .pn-contact { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 28px; align-items: start; padding-top: 40px; }
.playnest-site .pn-contact-main { display: grid; gap: 18px; }
.playnest-site .pn-contact-help { display: grid; gap: 24px; padding: 32px; border-radius: 22px; background: #fff; border: 1px solid #e1e3e6; box-shadow: 0 20px 55px #202e430d; }
.playnest-site .pn-contact-help h2 { margin: 0 0 12px; font-size: 30px; letter-spacing: -1px; color: #202e43; }
.playnest-site .pn-contact-help h3 { margin: 0 0 8px; font-size: 18px; color: #202e43; }
.playnest-site .pn-contact-help p:not(.pn-kicker) { margin: 0; font-size: 14px; line-height: 1.7; color: #697485; }
.playnest-site .pn-contact-tips { display: grid; gap: 18px; }
.playnest-site .pn-contact-tips article { padding-left: 18px; border-left: 3px solid #e8edf9; }
.playnest-site .pn-contact-tips .pn-text-link { display: inline-block; margin-top: 10px; }
.playnest-site .pn-contact-support { padding: 24px; border-radius: 16px; background: #edf1fb; }
.playnest-site .pn-contact-support .button { margin-top: 18px; }
.playnest-site .pn-contact-help a:focus-visible { outline: 3px solid #3d5ee8; outline-offset: 4px; }

.playnest-site .pn-contact-side { position: sticky; top: 20px; display: grid; gap: 12px; }
.playnest-site .pn-contact-channel { display: flex; gap: 14px; padding: 18px; border-radius: 16px; background: #fff; border: 1px solid #e1e3e6; color: inherit; text-decoration: none; transition: transform .2s, box-shadow .2s, border-color .2s; }
.playnest-site .pn-contact-channel:hover { transform: translateY(-3px); border-color: #c9d3ef; box-shadow: 0 16px 40px #202e4312; }
.playnest-site .pn-contact-channel > span { flex: 0 0 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 18px; background: #edf1fb; color: #3d5ee8; }
.playnest-site .pn-contact-channel.is-coral > span { background: #fcebe5; color: #d0634b; }
.playnest-site .pn-contact-channel.is-green > span { background: #e8f2ee; color: #477c72; }
.playnest-site .pn-contact-channel strong { display: block; margin-bottom: 3px; font-size: 14px; color: #202e43; }
.playnest-site .pn-contact-channel small { display: block; font-size: 12px; line-height: 1.55; color: #7c8490; overflow-wrap: anywhere; }
.playnest-site .pn-contact-address { padding: 18px 20px; border-radius: 16px; border: 1px dashed #d0d6df; font-style: normal; font-size: 13px; line-height: 1.7; color: #697485; }
.playnest-site .pn-contact-address small { display: block; margin-bottom: 6px; font: 650 10px ui-monospace, monospace; letter-spacing: 1.2px; text-transform: uppercase; color: #9aa2b0; }
.playnest-site .pn-contact-address strong { display: block; color: #202e43; }

@keyframes pn-contact-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes pn-contact-dot { 0%, 100% { transform: translateY(0); opacity: .5; } 50% { transform: translateY(-4px); opacity: 1; } }

@media (max-width: 960px) {
    .playnest-site .pn-contact { grid-template-columns: minmax(0, 1fr); }
    .playnest-site .pn-contact-side { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .playnest-site .pn-contact-hero { min-height: 0; }
    .playnest-site .pn-contact-art { min-height: 320px; padding: 0; }
    .playnest-site .pn-contact-help { padding: 22px 18px; border-radius: 18px; }
    .playnest-site .pn-contact-side { grid-template-columns: minmax(0, 1fr); }
    .playnest-site .pn-contact-support { padding: 20px 16px; }
}
