/* ==========================================================================
   Page styles: pages/contact.html
   Global/shared styles live in assets/css/style.css (and tailwind.css).
   ========================================================================== */

/* ---- Block 1 (originally inline in <head>) ---- */
/* Specific Overrides to neutralize legacy style.css effects */
.hero h1 {
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
    color: white !important;
    text-transform: uppercase !important;
}
.hero h1 span {
    color: #c41e3a !important;
}
.breadcrumb li i {
    margin-top: 2px;
}

/* ---- Block 2 (originally inline in <body>) ---- */
@keyframes char-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.15); }
}
@keyframes char-shake {
    0%, 100% { border-color: rgb(239 68 68); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}
.char-limit-pulse {
    animation: char-pulse 1.4s ease-in-out infinite;
}
.char-limit-shake {
    animation: char-shake 0.4s ease-in-out;
}

/* CAPTCHA input shake */
@keyframes captcha-shake-anim {
    0%, 100% { transform: translateX(0); }
    15%       { transform: translateX(-6px); }
    35%       { transform: translateX(6px); }
    55%       { transform: translateX(-4px); }
    75%       { transform: translateX(4px); }
    90%       { transform: translateX(-2px); }
}
.captcha-shake {
    animation: captcha-shake-anim 0.5s ease-in-out;
}

/* Subject dropdown — light mode */
#subject {
    color: #18181b;          /* zinc-900 = black */
    background-color: #f4f4f5; /* zinc-100 */
    color-scheme: light;
}
#subject option {
    color: #18181b;
    background-color: #ffffff;
}

/* Subject dropdown — dark mode */
.dark #subject {
    color: #ffffff;           /* white */
    background-color: #27272a; /* zinc-800 */
    color-scheme: dark;
}
.dark #subject option {
    color: #ffffff;
    background-color: #27272a; /* zinc-800 */
}