/* Part 2.3A v3 — useful ecosystem map, not duplicate CTA cards. */
.tna-brands-map {
    --brands-surface: #11151b;
    --brands-surface-2: #171c23;
    --brands-text: #f4f1e8;
    --brands-muted: #aab2bd;
    --brands-line: rgba(212,175,55,.16);
    --brands-gold: #d4af37;
    padding: clamp(42px, 7vw, 88px) 0 clamp(60px, 8vw, 110px);
}
html[data-tna-theme="light"] .tna-brands-map {
    --brands-surface: #fff;
    --brands-surface-2: #f7f5ef;
    --brands-text: #171a1f;
    --brands-muted: #66707b;
    --brands-line: rgba(92,72,19,.14);
    --brands-gold: #9a7418;
}
.tna-brands-map__hero {
    display: grid;
    grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr);
    gap: 18px;
    align-items: stretch;
    margin-bottom: 22px;
}
.tna-brands-map__intro,
.tna-brands-map__guide,
.tna-brand-route,
.tna-brands-map__empty {
    border: 1px solid var(--brands-line);
    background: var(--brands-surface);
    box-shadow: 0 24px 70px rgba(0,0,0,.18);
}
html[data-tna-theme="light"] :is(.tna-brands-map__intro,.tna-brands-map__guide,.tna-brand-route,.tna-brands-map__empty) {
    box-shadow: 0 18px 50px rgba(38,31,20,.07);
}
.tna-brands-map__intro {
    position: relative;
    overflow: hidden;
    padding: clamp(28px,5vw,54px);
    border-radius: 30px;
}
.tna-brands-map__intro::after {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    inset-block: 22px;
    width: 3px;
    border-radius: 9px;
    background: linear-gradient(180deg, var(--brands-gold), transparent);
}
.tna-brands-map__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 13px;
    border: 1px solid var(--brands-line);
    border-radius: 999px;
    color: var(--brands-gold);
    background: var(--brands-surface-2);
    font-weight: 850;
    font-size: .84rem;
}
.tna-brands-map__intro h1 {
    max-width: 790px;
    margin: 18px 0 12px;
    color: var(--brands-text);
    font-size: clamp(2.1rem,5vw,4.4rem);
    line-height: 1.13;
    letter-spacing: -.035em;
}
html[lang="fa"] .tna-brands-map__intro h1 { line-height: 1.32; letter-spacing: 0; }
.tna-brands-map__intro p {
    max-width: 780px;
    margin: 0;
    color: var(--brands-muted);
    line-height: 1.95;
    font-size: clamp(.96rem,1.45vw,1.08rem);
}
.tna-brands-map__guide {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 10px;
    padding: clamp(24px,4vw,34px);
    border-radius: 30px;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--brands-gold) 7%, var(--brands-surface)), var(--brands-surface)) !important;
}
.tna-brands-map__guide span { color: var(--brands-muted); font-size: .88rem; }
.tna-brands-map__guide strong { color: var(--brands-text); line-height: 1.75; font-size: 1.12rem; }
.tna-brands-map__guide a {
    width: fit-content;
    margin-top: 8px;
    padding: 11px 15px;
    border: 1px solid color-mix(in srgb, var(--brands-gold) 48%, transparent);
    border-radius: 14px;
    color: #17140a;
    background: linear-gradient(135deg,#f2cf72,#d4af37);
    font-weight: 900;
    text-decoration: none;
}
html[data-tna-theme="light"] .tna-brands-map__guide a { color: #fff; background: linear-gradient(135deg,#9a7418,#b88c25); }
.tna-brands-map__grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
}
.tna-brand-route {
    position: relative;
    overflow: hidden;
    min-height: 390px;
    display: flex;
    flex-direction: column;
    padding: 22px;
    border-radius: 24px;
    transition: transform .2s ease, border-color .2s ease;
}
.tna-brand-route::before {
    content: '';
    position: absolute;
    inset-inline: 20px;
    inset-block-start: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--brand-accent), transparent);
    opacity: .82;
}
.tna-brand-route:hover { transform: translateY(-3px); border-color: color-mix(in srgb,var(--brand-accent) 40%,var(--brands-line)); }
.tna-brand-route__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.tna-brand-route__logo {
    width: 66px !important;
    height: 66px !important;
    padding: 9px;
    border: 1px solid color-mix(in srgb,var(--brand-accent) 24%,var(--brands-line));
    border-radius: 18px;
    background: var(--brands-surface-2);
    object-fit: contain;
}
.tna-brand-route__status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid var(--brands-line);
    border-radius: 999px;
    color: var(--brands-muted);
    background: var(--brands-surface-2);
    font-size: .76rem;
    font-weight: 800;
}
.tna-brand-route__status i { width: 7px; height: 7px; border-radius: 50%; background: var(--brand-accent); }
.tna-brand-route__body { padding-top: 28px; }
.tna-brand-route__role { color: var(--brand-accent); font-size: .82rem; font-weight: 900; }
.tna-brand-route__body h2 { margin: 8px 0 10px; color: var(--brands-text); font-size: clamp(1.45rem,2.2vw,2rem); }
.tna-brand-route__body p { margin: 0; color: var(--brands-muted); line-height: 1.9; }
.tna-brand-route__footer { margin-top: auto; padding-top: 24px; }
.tna-brand-route__cta,
.tna-brand-route__disabled {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 15px;
    border: 1px solid color-mix(in srgb,var(--brand-accent) 34%,var(--brands-line));
    border-radius: 15px;
    text-decoration: none;
    font-weight: 900;
}
.tna-brand-route__cta { color: var(--brands-text); background: color-mix(in srgb,var(--brand-accent) 7%,var(--brands-surface-2)); }
.tna-brand-route__cta:hover { background: color-mix(in srgb,var(--brand-accent) 12%,var(--brands-surface-2)); }
.tna-brand-route__disabled { justify-content: center; color: var(--brands-muted); background: var(--brands-surface-2); }
.tna-brand-route.is-coming-soon { opacity: .82; }
.tna-brands-map__empty { grid-column: 1 / -1; padding: 34px; border-radius: 24px; text-align: center; color: var(--brands-text); }
.tna-brands-map__empty p { color: var(--brands-muted); }
@media (max-width: 980px) {
    .tna-brands-map__hero { grid-template-columns: 1fr; }
    .tna-brands-map__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px) {
    .tna-brands-map { padding-top: 24px; }
    .tna-brands-map__intro,.tna-brands-map__guide { border-radius: 22px; }
    .tna-brands-map__intro h1 { font-size: clamp(1.9rem,10vw,2.8rem); }
    .tna-brands-map__grid { grid-template-columns: 1fr; }
    .tna-brand-route { min-height: 330px; }
}
@media (prefers-reduced-motion: reduce) {
    .tna-brand-route { transition: none !important; }
    .tna-brand-route:hover { transform: none; }
}
