/* Real Estate ERP Software in MENA (industry_real_estate_mena.html).
   Shares the components of industry_real_estate_uae.css; this file swaps the palette to
   maroon + gold and adds the country ledgers, e-invoicing status and country coverage. */

.rmena {
    --ru-ink: #2a1320;
    --ru: #8b2c4c;
    --ru-2: #b3446a;
    --ru-soft: #f8eaf0;
    --ru-soft-2: #fcf6f8;
    --ru-line: #f0dde5;
    --ru-muted: #6d5a63;
    --ru-grad: linear-gradient(120deg, #b3446a 0%, #8b2c4c 100%);
    --rx-ink: #2a1320;
    --rx: #8b2c4c;
    --rx-2: #b3446a;
    --rx-muted: #6d5a63;
    --rx-line: #f0dde5;
    --rx-soft: #f8eaf0;
}
.rex-hero.rmena {
    background:
        radial-gradient(45% 55% at 85% 20%, rgba(179, 68, 106, .14) 0%, transparent 65%),
        radial-gradient(35% 45% at 5% 95%, rgba(224, 189, 99, .18) 0%, transparent 65%),
        linear-gradient(180deg, #fdf6f8 0%, #fffbfc 100%);
}
.rmena .rex-grad { background: linear-gradient(120deg, #b3446a 0%, #8b2c4c 60%, #6a1f38 100%); -webkit-background-clip: text; background-clip: text; }

.tk-answer {
    --qa-accent: #8b2c4c; --qa-accent-soft: rgba(139, 44, 76, .06); --qa-accent-line: rgba(139, 44, 76, .2);
    --qa-grad: linear-gradient(120deg, #e0bd63 0%, #c19a3d 100%);
    --qa-ink: #2a1320; --qa-muted: #6d5a63;
}

.rmena .ruae-card--lead, .rmena .ruae-cta-card {
    background:
        radial-gradient(70% 60% at 100% 0%, rgba(224, 189, 99, .22) 0%, transparent 60%),
        linear-gradient(160deg, #5c1a33 0%, #3d0f22 100%);
    box-shadow: 0 1.8rem 3.2rem -1.8rem rgba(61, 15, 34, .7);
}
.rmena .ruae-card--lead p, .rmena .ruae-cta-card { color: #ecd3dc; }
.ruae-link { display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; color: var(--ru); }
.ruae-link:hover { color: var(--ru-ink); }

/* hero: country ledgers, a highlight moves from country to country */
.rmena-visual .ruae-dash-mid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.rmena-ctry { list-style: none; margin: 0; padding: 0; display: grid; gap: .28rem; }
.rmena-ctry li {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: .4rem;
    padding: .28rem .4rem; border-radius: .5rem; background: var(--ru-soft-2); border: 1px solid transparent;
    animation: rmenaRow 10s calc(1s + var(--n) * 2s) infinite;
}
.rmena-ctry .cc {
    width: 1.35rem; height: 1rem; display: grid; place-items: center; border-radius: .25rem;
    font-size: .48rem; font-weight: 800; color: #fff; background: var(--ru-grad);
}
.rmena-ctry .nm { font-size: .6rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rmena-ctry .cur { font-size: .55rem; font-weight: 700; color: var(--ru-muted); }
.rmena-ctry .vat { font-size: .5rem; font-weight: 800; padding: .12rem .35rem; border-radius: 2rem; color: #8a6d1f; background: #fbf1d7; white-space: nowrap; }

/* hero: e-invoicing status */
.rmena-einv { display: flex; flex-direction: column; }
.rmena-einv-row {
    display: flex; align-items: center; justify-content: space-between; gap: .4rem;
    padding: .4rem .45rem; border-radius: .5rem; background: var(--ru-soft-2); margin-bottom: .3rem;
}
.rmena-einv-row .lbl2 { display: flex; flex-direction: column; font-size: .5rem; color: var(--ru-muted); line-height: 1.2; }
.rmena-einv-row .lbl2 b { font-size: .64rem; color: var(--ru-ink); }
.rmena-state { position: relative; width: 3.6rem; height: 1.05rem; }
.rmena-state > span {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: .12rem;
    border-radius: 2rem; font-size: .5rem; font-weight: 800;
}
.rmena-state .a { color: #8a6d1f; background: #fbf1d7; }
.rmena-state .b { color: #1f9d55; background: #e3f5ea; opacity: 0; animation: rmenaState 8s 1.2s infinite; }
.rmena-state.s2 .b { animation-delay: 3.2s; }
.rmena-sync { margin-top: auto; padding-top: .35rem; font-size: .52rem; font-weight: 700; color: var(--ru-muted); }
.rmena-sync i { display: inline-block; color: var(--ru); animation: rmenaSpin 3s linear infinite; }

.rmena-bars { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.rmena-bars .bar span { font-size: .5rem; }

/* country coverage */
.rmena-country-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
.rmena-country-grid article {
    display: flex; flex-direction: column; gap: .9rem; padding: 1.5rem 1.4rem; border-radius: 1.1rem;
    background: #fff; border: 1px solid var(--ru-line); box-shadow: 0 1.2rem 2.4rem -2.1rem rgba(61, 15, 34, .45);
}
.rmena-country-h { display: flex; align-items: center; gap: .7rem; }
.rmena-country-h .cc {
    flex: none; min-width: 2.4rem; height: 2rem; padding: 0 .45rem; display: grid; place-items: center;
    border-radius: .55rem; font-size: .72rem; font-weight: 800; color: #fff; background: var(--ru-grad);
}
.rmena-country-h h3 { margin: 0; font-size: 1.05rem; }
.rmena-country-grid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.rmena-country-grid li { position: relative; padding-left: 1.2rem; color: var(--ru-muted); font-size: .88rem; line-height: 1.5; }
.rmena-country-grid li::before {
    content: ""; position: absolute; left: 0; top: .55rem; width: .45rem; height: .45rem; border-radius: 50%;
    background: var(--ru-gold-2, #e0bd63);
}
.rmena-country-grid .ruae-link { margin-top: auto; font-size: .88rem; }
.rmena-countries .ruae-proof { margin-top: 2rem; }

@keyframes rmenaRow {
    0%, 16% { background: #fff; border-color: rgba(139, 44, 76, .35); box-shadow: 0 .4rem .9rem -.6rem rgba(61, 15, 34, .45); }
    22%, 100% { background: var(--ru-soft-2); border-color: transparent; box-shadow: none; }
}
@keyframes rmenaState { 0%, 20% { opacity: 0; } 26%, 90% { opacity: 1; } 96%, 100% { opacity: 0; } }
@keyframes rmenaSpin { to { transform: rotate(360deg); } }

@media (max-width: 1199.98px) {
    .rmena-country-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
    .rmena-country-grid { grid-template-columns: minmax(0, 1fr); }
    .rmena-visual .ruae-dash-mid { grid-template-columns: minmax(0, 1fr); }
    .rmena-einv { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .rmena-ctry li, .rmena-state .b, .rmena-sync i { animation: none; }
    .rmena-state .b { opacity: 1; }
}