/* Support-only layout; keep the shared header and form behavior unchanged. */
.support-page {
    --support-bg: #f5f6ef;
    --support-panel: #fff;
    --support-text: #252c22;
    --support-muted: #596253;
    --support-border: #dce2d2;
    --support-field: #f7f8f2;
    --support-link: #536300;
    min-height: 100vh;
    padding: 100px 0 0;
    background: radial-gradient(ellipse at top left, #e6edd2 0, transparent 45%), var(--support-bg);
    color: var(--support-text);
}
.support-shell { width: min(1120px, calc(100% - 3rem)); margin-inline: auto; padding: 1.25rem 0 2rem; }
.support-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.support-topbar > span { display: inline-flex; align-items: center; gap: .5rem; color: var(--support-muted); font-size: .85rem; }
.support-page .support-back { display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; color: var(--support-link); font-size: .95rem; font-weight: 650; text-decoration: none; }
.support-page .support-back:hover { color: var(--support-text); }
.support-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: 1.5rem; }
.support-welcome { min-width: 0; padding: 2rem; border: 1px solid #374522; border-radius: 1.6rem; background: radial-gradient(ellipse at top right, #3e501d, transparent 75%), #111d12; overflow: hidden; }
.support-page .support-eyebrow { display: inline-flex; align-items: center; gap: .5rem; color: var(--support-link); font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; line-height: 1.5; }
.support-welcome .support-eyebrow { color: #e1f190; }
.support-page .support-welcome h1 { margin: .9rem 0 1rem; color: #fff; font-family: "Gabarito", sans-serif; font-size: clamp(2.4rem, 3.8vw, 3.25rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.04; }
.support-page .support-welcome__copy > p { margin: 0; color: #e0e8d7; font-size: 1.1rem; line-height: 1.6; }
.support-welcome__art { margin: 1.6rem 0 1rem; overflow: hidden; border: 1px solid rgba(223, 237, 154, .2); border-radius: 1.15rem; background: #192416; }
.support-welcome__art img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.support-page .support-welcome__note { display: flex; align-items: flex-start; gap: .65rem; color: #e1f190; font-size: .9rem; line-height: 1.5; }
.support-welcome__note i { flex: 0 0 auto; font-size: 1.15rem; }
.support-page .support-welcome__jump { display: none; align-items: center; gap: .6rem; min-height: 44px; margin-top: .85rem; color: #e1f190; font-weight: 750; font-size: .95rem; text-decoration: none; }
.support-page .support-welcome__jump:hover { color: #fff; text-decoration: underline; text-underline-offset: .2rem; }
.support-panel { min-width: 0; padding: 2rem; border: 1px solid var(--support-border); border-radius: 1.6rem; background: var(--support-panel); box-shadow: 0 14px 38px rgba(32, 42, 17, .06); scroll-margin-top: 105px; }
.support-page .support-panel h2 { margin: .75rem 0 .65rem; color: var(--support-text); font-family: "Gabarito", sans-serif; font-size: clamp(1.8rem, 2.5vw, 2.2rem); font-weight: 800; line-height: 1.12; letter-spacing: -.025em; }
.support-page .support-panel__intro > p { margin: 0 0 1.6rem; color: var(--support-muted); font-size: 1rem; line-height: 1.55; }
.support-page .support-form { display: flex; flex-direction: column; gap: 1.25rem; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.support-form__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 1rem; }
.support-page .support-form label { display: block; margin-bottom: .45rem; color: var(--support-text); font-size: .95rem; font-weight: 650; text-transform: none; letter-spacing: 0; }
.support-page .support-form :is(.form-control, .form-select) { width: 100%; min-height: 48px; padding: .8rem .85rem; border: 1px solid var(--support-border); border-radius: .75rem; background-color: var(--support-field); color: var(--support-text); font-size: 1rem; line-height: 1.45; }
.support-page .support-form .form-select { padding-right: 2.3rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23596253' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-size: 16px; background-position: right .8rem center; background-repeat: no-repeat; }
.support-page .support-form .form-select option { background: var(--support-panel); color: var(--support-text); }
.support-page .support-form :is(.form-control, .form-select):focus { background-color: var(--support-panel); border-color: #809a25; box-shadow: 0 0 0 3px rgba(124, 145, 34, .18); color: var(--support-text); outline: 0; }
.support-page .support-form .form-control::placeholder { color: var(--support-muted); opacity: .9; }
.support-page .support-form textarea.form-control { min-height: 156px; resize: vertical; }
.support-page .support-form .support-form__help { margin: .45rem 0 0; color: var(--support-muted); font-size: .85rem; line-height: 1.5; }
.support-page .support-submit { display: inline-flex; align-items: center; justify-content: center; gap: .7rem; width: 100%; min-height: 54px; padding: .9rem 1.25rem; border: 1px solid #c52a54; border-radius: .85rem; background: #c52a54; color: #fff; font-size: 1.08rem; font-weight: 750; letter-spacing: 0; box-shadow: 0 8px 20px rgba(197, 42, 84, .19); transition: background-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.support-page .support-submit:hover:not(:disabled) { background: #a91f45; border-color: #a91f45; color: #fff; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(197, 42, 84, .24); }
.support-page .support-submit:active:not(:disabled) { background: #921b3c; color: #fff; transform: translateY(0); }
.support-page .support-submit:disabled { background: #a96275; border-color: #a96275; color: #fff; cursor: wait; box-shadow: none; transform: none; }
.support-page :is(a, button):focus-visible { outline: 3px solid #ae365c; outline-offset: 4px; }
.support-welcome a:focus-visible { outline-color: #e1f190; }
.support-page .support-form .support-form__privacy { display: flex; align-items: flex-start; gap: .5rem; margin: 0; color: var(--support-muted); font-size: .83rem; line-height: 1.5; }
.support-form__privacy i { flex: 0 0 auto; font-size: 1rem; }
.support-page .support-claim-note { display: flex; align-items: flex-start; gap: .75rem; padding: .9rem; border: 1px solid var(--support-border); border-radius: .85rem; background: var(--support-field); }
.support-claim-note > i { color: var(--support-link); font-size: 1.4rem; }
.support-page .support-claim-note > p { margin: 0; color: var(--support-text); font-size: .9rem; line-height: 1.55; }
.support-dmca { display: flex; flex-direction: column; gap: 1rem; min-width: 0; padding: 1rem; border: 1px solid var(--support-border); border-radius: .85rem; background: var(--support-field); }
.support-page .support-dmca legend { float: none; width: auto; padding: 0 .25rem; margin-bottom: 0; color: var(--support-text); font-size: 1rem; font-weight: 750; }
.support-page .support-notice { margin: 1rem 0; padding: .9rem 1rem; border: 1px solid; border-radius: .85rem; font-size: .95rem; line-height: 1.5; overflow-wrap: anywhere; }
.support-notice--error { background: #fff1f4; border-color: #e5a1b2; color: #8e1839; }
.support-notice--warning { background: #fff7df; border-color: #d7b965; color: #695015; }
.support-page .validation-errors, .support-page .validation-errors li, .support-page .validation-message { color: #a32245; font-size: .9rem; line-height: 1.45; }
.support-page .validation-errors { padding-left: 1.25rem; }
.support-page .support-form .invalid { border-color: #c52a54; }
.support-success { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 1rem 0; }
.support-success img { display: block; width: min(220px, 100%); height: auto; margin-bottom: 1.3rem; border-radius: 1.2rem; }
.support-page .support-success > p { margin: .3rem 0 1.5rem; color: var(--support-muted); font-size: 1.05rem; line-height: 1.6; }
.support-page .support-success__back { display: inline-flex; align-items: center; gap: .6rem; min-height: 48px; padding: .8rem 1.1rem; border: 1px solid var(--support-border); border-radius: 999px; background: var(--support-field); color: var(--support-link); font-weight: 750; text-decoration: none; }
.support-page .support-success__back:hover { color: var(--support-text); border-color: var(--support-link); }
.support-footer { margin-top: 2.5rem; text-align: center; }
.support-footer .footer-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .65rem 1.2rem; margin: 0; padding: 0; }
.support-footer .footer-links > li { margin: 0; }
.support-footer .footer-links > .d-block { flex-basis: 100%; }
.support-footer .footer-social-links { justify-content: center; }

[data-theme="dark"] .support-page { --support-bg: #10170f; --support-panel: #1b241a; --support-text: #f0f4e9; --support-muted: #bbc5b2; --support-border: #3a4832; --support-field: #152012; --support-link: #d5e98b; background: radial-gradient(ellipse at top left, #2b3819 0, transparent 45%), var(--support-bg); }
[data-theme="dark"] .support-panel { box-shadow: 0 14px 38px rgba(0, 0, 0, .16); }
[data-theme="dark"] .support-page .support-notice--error { background: #351a23; border-color: #9f5265; color: #ffd8e2; }
[data-theme="dark"] .support-page .support-notice--warning { background: #302a18; border-color: #9f8742; color: #f9e8b8; }
[data-theme="dark"] .support-page :is(.validation-errors, .validation-errors li, .validation-message) { color: #ffc1d1; }
[data-theme="dark"] .support-page .support-form .form-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bbc5b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
[data-theme="dark"] .support-page :is(a, button):focus-visible { outline-color: #e1f190; }

@media (max-width: 980px) {
    .support-layout { grid-template-columns: minmax(0, 1fr); }
    .support-welcome { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: center; gap: 1rem 1.5rem; }
    .support-welcome__art { grid-column: 2; grid-row: 1 / 3; margin: 0; }
    .support-welcome__note { grid-column: 1; }
    .support-page .support-welcome__jump { display: inline-flex; }
}
@media (max-width: 620px) {
    .support-page { padding-top: 80px; }
    .support-shell { width: calc(100% - 1.5rem); padding-top: .75rem; }
    .support-topbar { margin-bottom: .7rem; }
    .support-topbar > span { display: none; }
    .support-welcome { grid-template-columns: minmax(0, 1fr) 110px; padding: 1.15rem; gap: .85rem; border-radius: 1.15rem; }
    .support-page .support-welcome h1 { font-size: 1.95rem; }
    .support-page .support-welcome__copy > p { font-size: 1rem; }
    .support-welcome__art { grid-row: 1; border-radius: .8rem; }
    .support-welcome__note { grid-column: 1 / -1; }
    .support-panel { padding: 1.25rem; border-radius: 1.15rem; }
    .support-form__row { grid-template-columns: minmax(0, 1fr); }
    .support-page .support-form :is(.form-control, .form-select) { font-size: 1rem; }
    .support-footer { margin-top: 2rem; }
}
@media (max-width: 380px) {
    .support-welcome { grid-template-columns: minmax(0, 1fr) 86px; }
    .support-page .support-welcome h1 { font-size: 1.75rem; }
}
@media (prefers-reduced-motion: reduce) {
    .support-page *, .support-page *::before, .support-page *::after { scroll-behavior: auto; transition: none; }
}
