/*
 * PixelGuard - Accessible UI
 * رنگ وضعیت‌ها:
 *   ایمن      = سبز
 *   تبلیغاتی  = زرد/کهربایی
 *   فیشینگ    = قرمز
 */

:root {
    --bg: #0b1220;
    --panel: #111c2d;
    --panel-2: #162337;
    --text: #f8fafc;
    --muted: #b8c4d6;
    --line: rgba(255,255,255,.12);
    --blue: #60a5fa;
    --green: #22c55e;
    --yellow: #f59e0b;
    --red: #ef4444;
    --shadow: 0 16px 45px rgba(0,0,0,.28);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at 15% 5%, rgba(59,130,246,.15), transparent 28%),
        radial-gradient(circle at 90% 15%, rgba(34,197,94,.08), transparent 25%),
        var(--bg);
    color: var(--text);
    font-family: "Vazirmatn", Tahoma, sans-serif;
    font-size: 16px;
    line-height: 1.7;
    text-align: right;
    overflow-x: hidden;
}

body::before {
    content: "🛡️";
    position: fixed;
    left: -90px;
    bottom: -80px;
    font-size: 260px;
    opacity: .025;
    pointer-events: none;
}

button,
input,
textarea,
select {
    font-family: inherit !important;
}

button,
.btn {
    min-height: 48px;
}

.app-shell {
    max-width: 1180px;
    padding-top: 28px;
    padding-bottom: 50px;
}

.app-header {
    text-align: center;
    margin-bottom: 24px;
}

.brand-row {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(17,28,45,.82);
    box-shadow: 0 8px 24px rgba(0,0,0,.2);
}

.brand-mark {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: rgba(96,165,250,.15);
    font-size: 26px;
}

.brand-name {
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: 1.5px;
    direction: ltr;
    text-align: left;
}

.brand-version {
    color: var(--muted);
    font-size: .78rem;
}

.app-title {
    margin: 20px 0 4px;
    font-size: clamp(1.45rem, 3vw, 2.05rem);
    font-weight: 900;
    color: #fff;
}

.app-subtitle {
    max-width: 760px;
    margin: 0 auto;
    color: var(--muted);
    font-size: 1rem;
}

.legend {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 15px;
}

.legend-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.04);
    font-weight: 800;
    font-size: .82rem;
}

.legend-item i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.legend-item.safe i { background: var(--green); }
.legend-item.ad i { background: var(--yellow); }
.legend-item.danger i { background: var(--red); }

.card.main-card {
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(22,35,55,.94), rgba(13,24,39,.94));
    padding: 24px !important;
    box-shadow: var(--shadow);
    margin-bottom: 20px;
}

.section-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.section-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: rgba(96,165,250,.12);
    font-size: 21px;
}

.section-icon.big {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
    font-size: 25px;
}

.section-heading h2,
.section-heading strong {
    margin: 0;
    color: #fff;
    font-size: 1.02rem;
    font-weight: 900;
}

.section-heading p,
.section-heading small {
    display: block;
    margin: 2px 0 0;
    color: var(--muted);
    font-size: .82rem;
    font-weight: 500;
}

.upload-card {
    border-color: rgba(96,165,250,.22) !important;
}

.btn-action {
    border-radius: 14px;
    font-weight: 900;
    font-size: 1rem;
    padding: 12px 16px;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.btn-action:hover {
    transform: translateY(-1px);
    filter: brightness(1.06);
}

.btn-action:active {
    transform: translateY(1px);
}

.btn-upload {
    color: #eaf3ff;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    border: 1px solid #60a5fa;
    box-shadow: 0 9px 22px rgba(37,99,235,.24);
}

.btn-paste {
    color: #fff;
    background: #334155;
    border: 1px solid #64748b;
}

.btn-analyze {
    color: #fff;
    background: linear-gradient(135deg, #0ea5e9, #2563eb);
    border: 1px solid #7dd3fc;
    box-shadow: 0 9px 22px rgba(37,99,235,.22);
}

.btn-action:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.history-btn:focus-visible {
    outline: 3px solid rgba(96,165,250,.7);
    outline-offset: 2px;
}

.form-label {
    color: #e5edf8;
    font-weight: 800;
    margin-bottom: 7px;
}

.sms-textarea,
.ocr-input,
.form-select {
    color: #fff !important;
    background: #0b1524 !important;
    border: 2px solid #33445b !important;
    border-radius: 14px !important;
    padding: 13px 15px;
    font-size: 1rem;
}

.sms-textarea::placeholder,
.ocr-input::placeholder {
    color: #9fb0c5 !important;
    opacity: 1;
}

.sms-textarea:focus,
.ocr-input:focus,
.form-select:focus {
    border-color: var(--blue) !important;
    box-shadow: 0 0 0 4px rgba(96,165,250,.18) !important;
}

.sms-textarea {
    height: 145px;
    resize: vertical;
    min-height: 110px;
}

.form-select option {
    background: #0b1524;
    color: #fff;
}

.loading-shimmer {
    height: 6px;
    margin-top: 16px;
    border-radius: 999px;
    background: #1d4ed8;
    overflow: hidden;
    display: none;
}

.loading-shimmer::after {
    content: "";
    display: block;
    width: 42%;
    height: 100%;
    background: linear-gradient(90deg, transparent, #bfdbfe, transparent);
    animation: move-shimmer 1.1s infinite;
}

@keyframes move-shimmer {
    from { transform: translateX(-130%); }
    to { transform: translateX(300%); }
}

.tips-card {
    background: rgba(17,28,45,.72) !important;
}

.tip-list {
    display: grid;
    gap: 9px;
    color: #dbe7f5;
    font-size: .9rem;
}

.tip-list div {
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.07);
}

.empty-state {
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    text-align: center;
    color: var(--muted);
    padding: 25px;
}

.empty-state strong {
    color: #fff;
    font-size: 1.05rem;
}

.empty-state span {
    max-width: 400px;
}

.empty-icon {
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    background: rgba(96,165,250,.09);
    font-size: 40px;
    margin-bottom: 4px;
}

.empty-history,
.loading-state,
.empty-state {
    margin: 0;
}

.loading-state {
    min-height: 160px;
    display: grid;
    place-items: center;
    color: #bfdbfe;
    font-weight: 800;
}

.result-box {
    animation: slideUp .3s ease-out;
}

@keyframes slideUp {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.result-status {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    margin-bottom: 20px;
    border-radius: 16px;
    border: 1px solid;
}

.result-status strong,
.result-status span {
    display: block;
}

.result-status strong {
    font-size: .98rem;
    margin-bottom: 2px;
}

.result-status span {
    font-size: .84rem;
    line-height: 1.8;
}

.result-status-icon {
    font-size: 27px;
    flex: 0 0 auto;
}

.result-status.safe {
    background: rgba(34,197,94,.10);
    border-color: rgba(34,197,94,.38);
    color: #bbf7d0;
}

.result-status.ad {
    background: rgba(245,158,11,.12);
    border-color: rgba(245,158,11,.42);
    color: #fde68a;
}

.result-status.danger {
    background: rgba(239,68,68,.12);
    border-color: rgba(239,68,68,.45);
    color: #fecaca;
}

.result-status.unknown {
    background: rgba(100,116,139,.12);
    border-color: rgba(148,163,184,.35);
    color: #dbeafe;
}

.result-heading {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    align-items: center;
    margin-bottom: 20px;
}

.result-kicker {
    display: block;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
}

.result-title {
    margin: 2px 0 0;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #fff;
    font-size: 1.55rem;
    font-weight: 950;
}

.status-dot {
    width: 13px;
    height: 13px;
    border-radius: 50%;
    display: inline-block;
}

.result-box.safe .status-dot { background: var(--green); box-shadow: 0 0 0 5px rgba(34,197,94,.13); }
.result-box.ad .status-dot { background: var(--yellow); box-shadow: 0 0 0 5px rgba(245,158,11,.13); }
.result-box.danger .status-dot { background: var(--red); box-shadow: 0 0 0 5px rgba(239,68,68,.13); }
.result-box.unknown .status-dot { background: #94a3b8; }

.sender-card {
    min-width: 150px;
    padding: 10px 13px;
    border-radius: 13px;
    background: rgba(0,0,0,.17);
    border: 1px solid rgba(255,255,255,.09);
}

.sender-card span,
.sender-card strong {
    display: block;
}

.sender-card span {
    color: var(--muted);
    font-size: .72rem;
}

.sender-card strong {
    color: #fff;
    font-size: .9rem;
    direction: rtl;
    word-break: break-word;
}

.result-main-grid {
    display: grid;
    grid-template-columns: minmax(180px, .85fr) minmax(250px, 1.15fr);
    gap: 14px;
    margin-bottom: 14px;
}

.confidence-card,
.engine-card,
.explanation-card,
.xai-card,
.feedback-card {
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 17px;
    background: rgba(0,0,0,.12);
    padding: 17px;
}

.confidence-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 245px;
}

.confidence-ring {
    width: 160px;
    height: 160px;
    position: relative;
}

.confidence-ring svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.confidence-ring circle {
    fill: none;
    stroke-width: 9;
}

.ring-bg {
    stroke: rgba(255,255,255,.09);
}

.ring-value {
    stroke-linecap: round;
    transition: stroke-dasharray .7s ease;
}

.confidence-number {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    direction: ltr;
}

.confidence-number strong {
    font-size: 2.2rem;
    line-height: 1;
    font-weight: 950;
}

.confidence-number span {
    font-size: 1rem;
    margin-top: 10px;
    font-weight: 900;
}

.confidence-label {
    margin-top: -2px;
    color: #fff;
    font-weight: 900;
}

.confidence-note {
    color: var(--muted);
    font-size: .72rem;
    text-align: center;
    max-width: 220px;
    margin-top: 4px;
}

.final-label-row,
.metric-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.final-label-row {
    margin: 16px 0 11px;
    color: #dce7f4;
    font-weight: 800;
}

.metric-row {
    margin-top: 11px;
    color: var(--muted);
    font-size: .86rem;
}

.metric-row strong {
    color: #fff;
}

.confidence-bar {
    width: 100%;
    height: 12px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
}

.confidence-bar-fill {
    height: 100%;
    border-radius: inherit;
    transition: width .7s ease;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 900;
    border: 1px solid;
    white-space: nowrap;
}

.status-badge-safe {
    color: #bbf7d0;
    background: rgba(34,197,94,.13);
    border-color: rgba(34,197,94,.4);
}

.status-badge-ad {
    color: #fde68a;
    background: rgba(245,158,11,.15);
    border-color: rgba(245,158,11,.42);
}

.status-badge-danger {
    color: #fecaca;
    background: rgba(239,68,68,.15);
    border-color: rgba(239,68,68,.45);
}

.status-badge-unknown {
    color: #e2e8f0;
    background: rgba(100,116,139,.15);
    border-color: rgba(148,163,184,.35);
}

.explanation-card,
.xai-card,
.feedback-card {
    margin-top: 14px;
}

.summary-text {
    color: #edf4fb;
    font-size: .93rem;
    margin: 0;
    line-height: 2;
}

.reason-list {
    display: grid;
    gap: 6px;
    margin-top: 10px;
}

.reason-item {
    color: #dbe7f5;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(255,255,255,.035);
}

.xai-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.xai-chip {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 6px 11px;
    border-radius: 10px;
    background: rgba(239,68,68,.14);
    border: 1px solid rgba(239,68,68,.35);
    color: #fecaca;
    font-size: .8rem;
    font-weight: 900;
}

.xai-empty {
    color: var(--muted);
    font-size: .84rem;
}

.feedback-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.feedback-btn {
    min-height: 48px;
    padding: 10px 17px;
    border-radius: 12px;
    border: 1px solid;
    font-weight: 900;
    cursor: pointer;
}

.feedback-yes {
    color: #dcfce7;
    background: rgba(34,197,94,.14);
    border-color: rgba(34,197,94,.42);
}

.feedback-no {
    color: #fecaca;
    background: rgba(239,68,68,.10);
    border-color: rgba(239,68,68,.4);
}

.feedback-submit {
    color: #fff;
    background: #2563eb;
    border-color: #60a5fa;
}

.correct-menu {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.correct-menu label {
    display: block;
    color: #dbe7f5;
    font-size: .85rem;
    font-weight: 800;
    margin-bottom: 7px;
}

.correct-row {
    display: flex;
    gap: 9px;
}

.correct-row .form-select {
    flex: 1;
}

.history-list {
    max-height: 260px;
    overflow-y: auto;
}

.history-btn {
    width: 100%;
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.07);
    background: transparent;
    color: #dbe7f5;
    padding: 10px 5px;
    text-align: right;
    cursor: pointer;
}

.history-btn:hover {
    background: rgba(255,255,255,.035);
}

.history-message {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .85rem;
}

.empty-history {
    text-align: center;
    color: var(--muted);
    padding: 15px 5px;
    font-size: .85rem;
}

.dashboard-section {
    margin-top: 6px;
}

.dashboard-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 2px 12px;
}

.dashboard-title > span {
    font-size: 24px;
}

.dashboard-title strong,
.dashboard-title small {
    display: block;
}

.dashboard-title strong {
    font-size: 1rem;
}

.dashboard-title small {
    color: var(--muted);
    font-size: .75rem;
}

.stat-card {
    min-height: 105px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: rgba(17,28,45,.88);
    box-shadow: 0 8px 25px rgba(0,0,0,.16);
}

.stat-card span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
    text-align: center;
}

.stat-card strong {
    font-size: 1.55rem;
    font-weight: 950;
}

.stat-card.safe { border-color: rgba(34,197,94,.25); }
.stat-card.safe strong { color: #4ade80; }

.stat-card.ad { border-color: rgba(245,158,11,.25); }
.stat-card.ad strong { color: #fbbf24; }

.stat-card.danger { border-color: rgba(239,68,68,.25); }
.stat-card.danger strong { color: #f87171; }

.stat-card.total strong { color: #fff; }

@media (max-width: 800px) {
    .app-shell {
        padding-top: 18px;
    }

    .card.main-card {
        padding: 18px !important;
        border-radius: 18px;
    }

    .result-main-grid {
        grid-template-columns: 1fr;
    }

    .confidence-card {
        min-height: 220px;
    }

    .result-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .sender-card {
        width: 100%;
    }
}

@media (max-width: 520px) {
    body {
        font-size: 15px;
    }

    .app-title {
        font-size: 1.35rem;
    }

    .app-subtitle {
        font-size: .9rem;
    }

    .legend {
        gap: 6px;
    }

    .legend-item {
        font-size: .74rem;
        padding: 6px 9px;
    }

    .section-heading {
        align-items: flex-start;
    }

    .section-icon.big {
        width: 44px;
        height: 44px;
        flex-basis: 44px;
    }

    .result-title {
        font-size: 1.35rem;
    }

    .correct-row {
        flex-direction: column;
    }

    .history-btn {
        align-items: flex-start;
        flex-direction: column;
    }

    .history-message {
        width: 100%;
    }

    .status-badge {
        align-self: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* ===== v5.1 feedback + explanation polish ===== */
.reason-muted { opacity: .78; }
.security-override-box {
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(239,68,68,.35);
    background: rgba(239,68,68,.09);
    display: grid;
    gap: 5px;
}
.security-override-box { color: var(--text); background: rgba(239,68,68,.14); border-color: rgba(239,68,68,.55); }
.security-override-box strong { display:block; margin-bottom:2px; color: #fecaca; font-weight: 800; }
.security-override-box span { color: var(--text); font-size: .95em; line-height: 1.7; }
.xai-chip em { font-style: normal; opacity: .72; font-size: .78em; margin-right: 4px; }
#pgToastHost {
    position: fixed;
    inset: auto 18px 18px 18px;
    z-index: 9999;
    display: flex;
    justify-content: center;
    pointer-events: none;
}
.pg-toast {
    max-width: min(92vw, 560px);
    padding: 13px 18px;
    border-radius: 14px;
    background: #0f172a;
    color: #fff;
    border: 2px solid rgba(255,255,255,.12);
    box-shadow: 0 14px 35px rgba(0,0,0,.28);
    opacity: 0;
    transform: translateY(10px);
    transition: .25s ease;
    font-weight: 700;
    text-align: center;
}
.pg-toast.show { opacity: 1; transform: translateY(0); }
.pg-toast.success { border-color: rgba(34,197,94,.45); }
.pg-toast.danger { border-color: rgba(239,68,68,.5); }
.feedback-result {
    min-height: 0;
    margin-top: 10px;
    padding: 0;
    border-radius: 12px;
    opacity: 0;
    transform: translateY(-3px);
    transition: .22s ease;
}
.feedback-result.show {
    padding: 11px 13px;
    opacity: 1;
    transform: translateY(0);
}
.feedback-result.success {
    background: rgba(34,197,94,.12);
    border: 1px solid rgba(34,197,94,.3);
    color: #86efac;
    font-weight: 800;
}
.feedback-btn:focus-visible, .history-btn:focus-visible, .btn-action:focus-visible,
.form-control:focus-visible, .form-select:focus-visible {
    outline: 3px solid rgba(96,165,250,.7);
    outline-offset: 2px;
}
@media (max-width: 520px) {
    #pgToastHost { inset: auto 10px 10px 10px; }
    .pg-toast { width: 100%; font-size: .9rem; }
}
/* ===== Auth panel (مراحل ۸ و ۹) ===== */
.auth-panel {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
    margin-top: 10px; padding: 10px 14px; border-radius: 12px;
    background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08);
}
.auth-status { font-size: .85rem; color: #cbd5e1; flex-basis: 100%; }
.auth-input { max-width: 200px; padding: 8px 10px; border-radius: 8px; }
.quota-badge {
    font-size: .78rem; color: #7dd3fc; background: rgba(56, 189, 248, .1);
    border: 1px solid rgba(56, 189, 248, .25); padding: 4px 10px; border-radius: 999px;
}
.otp-row { display: flex; gap: 8px; }

/* PixelGuard 2.0 account navigation */
.portal-shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 4px}
.portal-shortcuts a{display:inline-flex;padding:7px 12px;border:1px solid rgba(148,180,211,.2);border-radius:10px;color:#b7ccdf;background:rgba(10,30,49,.5);font-size:12px;text-decoration:none}
.portal-shortcuts a:hover{border-color:rgba(93,224,223,.55);color:#5de0df}

/* منوی سه‌خط */
.menu-wrap{position:relative;display:flex;justify-content:flex-start;margin:18px 0 4px}
.menu-toggle{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid rgba(148,180,211,.25);border-radius:12px;background:rgba(10,30,49,.6);color:#b7ccdf;cursor:pointer}
.menu-toggle:hover,.menu-toggle[aria-expanded="true"]{border-color:rgba(93,224,223,.55);color:#5de0df}
.site-menu{position:absolute;top:50px;inset-inline-start:0;z-index:20;min-width:200px;display:flex;flex-direction:column;padding:6px;border:1px solid rgba(148,180,211,.25);border-radius:14px;background:#0b1d2f;box-shadow:0 14px 40px rgba(0,0,0,.45)}
.site-menu[hidden]{display:none}
.site-menu a,.site-menu button{display:block;width:100%;text-align:right;padding:10px 12px;border:0;border-radius:9px;background:transparent;color:#cfe0ee;font:inherit;font-size:13px;text-decoration:none;cursor:pointer}
.site-menu a:hover,.site-menu button:hover{background:rgba(93,224,223,.1);color:#5de0df}
.site-menu a[hidden],.site-menu button[hidden]{display:none}

[hidden]{display:none!important}
.ocr-busy{min-height:160px;display:grid;place-items:center;text-align:center;gap:10px;color:#bfdbfe;font-weight:800;line-height:2}
.ocr-busy small{display:block;color:#93a9c9;font-weight:500;font-size:.8rem}
.ocr-spinner{width:38px;height:38px;margin:0 auto 6px;border-radius:50%;border:3px solid rgba(147,197,253,.2);border-top-color:#60a5fa;animation:ocrspin .9s linear infinite}
@keyframes ocrspin{to{transform:rotate(360deg)}}

/* ===== تماس با ما (پایین همه‌ی صفحه‌ها) ===== */
html{scroll-behavior:smooth}
.contact-section{scroll-margin-top:16px;max-width:1160px;margin:34px auto 0;padding:0 18px}
.contact-inner{padding:26px 24px;border:1px solid rgba(148,180,211,.2);border-radius:18px;background:linear-gradient(155deg,rgba(18,39,59,.9),rgba(9,23,38,.92));text-align:center}
.contact-title{font-size:18px;margin:0 0 6px;color:#edf5fc}
.contact-sub{margin:0 0 18px;font-size:12px;color:#8da4ba;line-height:2}
.contact-links{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.contact-link{display:flex;align-items:center;gap:12px;min-width:230px;padding:11px 16px;border:1px solid rgba(148,180,211,.22);border-radius:14px;background:rgba(3,13,23,.5);color:#cfe0ee;text-decoration:none;transition:transform .2s,border-color .2s,background .2s}
.contact-link:hover{transform:translateY(-2px);background:rgba(93,224,223,.08);color:#fff}
.contact-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;flex:none}
.contact-telegram .contact-icon{background:rgba(41,169,235,.15);color:#29a9eb}
.contact-telegram:hover{border-color:rgba(41,169,235,.6)}
.contact-email .contact-icon{background:rgba(244,189,98,.14);color:#f4bd62}
.contact-email:hover{border-color:rgba(244,189,98,.6)}
.contact-text{display:grid;text-align:right;gap:2px}
.contact-text small{font-size:10px;color:#8da4ba}
.contact-text b{font-size:13px;font-weight:700;letter-spacing:.01em;word-break:break-all}
@media(max-width:640px){.contact-link{width:100%}}
/* ===== کپچا ===== */
.cf-turnstile{display:flex;justify-content:center;min-height:65px}