/* Property group in the direction A look (6 Oct 2026, Mohamed: "do all of them"): the homes list, one home,
   real estate services, the buying guide, the Egypt visa checker and the best-time guide.
   Loaded after home-a.css, blog-a.css and pages-a.css; uses their tokens and colours only. Logical CSS for Arabic. */

/* ---------- shared: a white card over the hero's lower edge ---------- */
.re-dock { position: relative; z-index: 2; margin-top: -104px; }
.re-card { background: #fff; border-radius: 18px; box-shadow: 0 30px 60px -28px rgba(2,31,69,.45), 0 2px 8px rgba(2,31,69,.08); }
.re-empty-sec { padding-bottom: 80px; }
/* a photo hero with nothing docked over its lower edge */
.re-hero-solo .b-hero-in { padding-bottom: 96px; }

/* tones: green = good or quiet, blue = moderate, sand = take care, red = no or peak */
.re-ok { --tone: #0B6B3A; --tone-bg: #E9F7EF; }
.re-info { --tone: var(--blue); --tone-bg: var(--mist); }
.re-warn { --tone: #8A4B00; --tone-bg: var(--sand); }
.re-no { --tone: var(--danger); --tone-bg: #FDECEA; }
.re-tag { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; background: var(--tone-bg, var(--mist)); color: var(--tone, var(--blue)); font-size: 12.5px; font-weight: 800; line-height: 1.4; }
.re-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--tone, var(--sun)); flex: none; }

/* bullet list with the teal dots of the articles */
.re-dots { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.re-dots li { position: relative; padding-inline-start: 22px; color: var(--text-2); }
.re-dots li::before { content: ""; position: absolute; inset-inline-start: 3px; top: .62em; width: 8px; height: 8px; border-radius: 50%; background: var(--teal); }

/* ---------- homes list: search card ---------- */
.re-find { padding: 22px 24px 16px; }
.re-bar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 14px; align-items: end; }
.re-bar select.ctl { text-overflow: ellipsis; }
.re-go .btn { height: 48px; }
.re-find-foot { margin-top: 12px; font-size: 14px; color: var(--muted); }
.re-find-foot a { color: var(--blue); font-weight: 700; }

/* ---------- homes list: cards ---------- */
.re-grid .trip-media { position: relative; }
.re-tags { position: absolute; top: 12px; inset-inline-start: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.re-tags .pg-tag { box-shadow: 0 2px 8px rgba(2,31,69,.2); }
.trip-price .re-ask-price { font-size: 18px; letter-spacing: 0; }

/* ---------- homes list: owners band and the empty state ---------- */
.re-own { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px 40px; padding: 36px 40px; border-radius: var(--card-r); background: var(--navy); color: #fff; }
.re-own .kicker { margin-bottom: 8px; }
.re-own h2 { font-size: clamp(24px, 2.2vw, 30px); line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; }
.re-own p:not(.kicker) { margin-top: 8px; color: var(--light); max-width: 40em; }
.re-own :focus-visible, .re-empty-own :focus-visible { outline-color: #FFB45C; }
.re-empty { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); overflow: hidden; }
.re-empty-main { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 44px 44px 40px; }
.re-empty-main h2 { font-size: clamp(26px, 2.4vw, 34px); line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); }
.re-empty-main > p { color: var(--text-2); font-size: 17px; max-width: 30em; }
.re-empty-main .pg-acts { margin-top: 8px; }
.re-empty-own { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 44px; background: var(--navy); color: #fff; }
.re-empty-own .kicker { margin-bottom: 0; }
.re-empty-own h2 { font-size: 26px; line-height: 1.2; font-weight: 800; letter-spacing: -0.015em; }
.re-empty-own p:not(.kicker) { color: var(--light); font-size: 16.5px; }
.re-empty-own .btn { margin-top: 8px; }

/* ---------- one home ---------- */
.re-thumbs { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.re-thumbs img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; background: var(--mist); }
.re-stats { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.re-stats > div { padding: 16px 12px; border-radius: 14px; background: var(--mist); text-align: center; }
.re-stats dt { font-size: 13.5px; font-weight: 700; color: var(--muted); }
.re-stats dd { margin: 4px 0 0; font-size: 24px; font-weight: 800; color: var(--navy); }
.pg-buy .amt.re-ask-price { font-size: 26px; }
.re-ask h2 { font-size: 20px; line-height: 1.25; font-weight: 800; color: var(--navy); }
.re-ask p { margin-top: 4px; font-size: 15px; color: var(--text-2); }

/* ---------- real estate services ---------- */
.re-copy { display: grid; gap: 14px; margin-top: 18px; font-size: 17px; color: var(--text-2); }
.re-ticks { margin-top: 24px; }
.re-form-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.re-errs { margin-top: 18px; }
.re-wa { display: grid; gap: 16px; padding: 28px; }
.re-wa-top { display: flex; align-items: center; gap: 14px; }
.re-wa h2 { font-size: 22px; }
.re-wa-sub { margin-top: 2px; font-size: 14.5px; color: var(--light); }
.re-wa > p { color: #E3EAF3; }
.re-wa .btn { width: 100%; }
.re-wa :focus-visible { outline-color: #FFB45C; }
.re-guide-cards .pg-card p + p { margin-top: 4px; }

/* ---------- buying guide ---------- */
.re-short { padding: 26px 28px; border-radius: var(--card-r); background: var(--mist); border: 1px solid var(--line); }
.re-short h2 { font-size: 22px; line-height: 1.25; font-weight: 800; color: var(--navy); }
.re-short .re-dots { margin-top: 14px; font-size: 16.5px; }
.re-sec { margin-top: 56px; }
.re-sec > h2 { font-size: clamp(25px, 2.2vw, 30px); line-height: 1.18; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); }
.re-sec > h2 + * { margin-top: 14px; }
.re-lead { font-size: 17.5px; line-height: 1.65; color: var(--text-2); }
.re-sec > .re-lead + * { margin-top: 20px; }
.re-areas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.re-areas li { display: grid; gap: 6px; align-content: start; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.re-areas h3 { display: flex; align-items: center; gap: 8px; font-size: 18px; line-height: 1.3; font-weight: 800; color: var(--navy); }
.re-areas h3 .ico { width: 18px; height: 18px; color: #B45309; }
.re-areas p { font-size: 15.5px; color: var(--text-2); }
.re-areas .re-typ { margin-top: 2px; font-size: 14px; font-weight: 600; color: var(--muted); }
.re-more { margin-top: 12px; }
.re-small { margin-top: 12px; font-size: 14px; color: var(--muted); }
.re-band { padding: 32px; border-radius: 20px; background: var(--navy); color: #fff; }
.re-sec.re-band > h2 { color: #fff; }
.re-band > p { font-size: 17px; color: #E3EAF3; }
.re-tiers { list-style: none; margin: 20px 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.re-tiers li { display: grid; gap: 4px; padding: 18px; border-radius: 14px; background: var(--navy-2); border: 1px solid rgba(255,255,255,.14); }
.re-tier { font-size: 13.5px; font-weight: 800; color: #FFB45C; }
.re-tiers b { font-size: 28px; line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; }
.re-tiers li > span:last-child { font-size: 15px; color: var(--light); }
.re-mistakes { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.re-mistakes li { padding: 20px 22px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.re-mistakes h3 { font-size: 18px; line-height: 1.3; font-weight: 800; color: var(--navy); }
.re-mistakes p { margin-top: 6px; color: var(--text-2); }
.re-mistakes a { color: var(--link); font-weight: 600; text-underline-offset: 3px; }
.re-card-p { margin-top: 8px; font-size: 15.5px; color: var(--light); }
.page-buying-guide .p-main { padding-bottom: 80px; }
@media (min-width: 1024px) {
  /* The side card already offers WhatsApp; the floating button would sit beside it. */
  .page-buying-guide .wa-float { display: none; }
}

/* ---------- visa checker ---------- */
.re-check { padding: 24px 26px 18px; }
.re-check-row { display: flex; gap: 12px; }
.re-check-row .ctl { flex: 1; font-weight: 600; }
.re-check-row .btn { flex: none; height: 48px; min-width: 128px; }
.re-hint { margin-top: 10px; font-size: 14px; color: var(--muted); }
.re-result { margin-top: 20px; padding: 32px; border-radius: 20px; background: var(--navy); color: #fff; }
.re-for { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px; border-radius: 999px; background: var(--tone-bg, var(--mist)); color: var(--tone, var(--blue)); font-size: 14px; font-weight: 800; }
.re-result h2 { margin-top: 14px; font-size: clamp(26px, 2.8vw, 38px); line-height: 1.12; font-weight: 800; letter-spacing: -0.02em; }
.re-sum { margin-top: 10px; max-width: 46em; font-size: 17.5px; color: #E3EAF3; }
.re-note { margin-top: 18px; padding: 14px 16px; border-radius: 12px; background: var(--sand); color: var(--text); }
.re-note b { color: #8A4B00; }
.re-note p { margin-top: 2px; }
.re-facts { margin: 20px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.re-facts > div, .re-how { padding: 14px 16px; border-radius: 12px; background: var(--navy-2); border: 1px solid rgba(255,255,255,.14); }
.re-facts dt { font-size: 13px; font-weight: 700; color: var(--light-2); }
.re-facts dd { margin: 4px 0 0; font-weight: 700; }
.re-how { margin-top: 10px; }
.re-how h3 { font-size: 13.5px; font-weight: 800; color: #FFB45C; }
.re-how p { margin-top: 4px; color: #E3EAF3; }
.re-result .pg-acts { margin-top: 22px; }
.re-result :focus-visible { outline-color: #FFB45C; }
.re-ways h3 { display: flex; align-items: center; gap: 10px; }
.re-mini { margin: auto 0 0; padding-top: 4px; display: grid; gap: 4px; font-size: 14.5px; }
.re-mini > div { display: flex; flex-wrap: wrap; gap: 0 6px; }
.re-mini dt { font-weight: 600; color: var(--muted); }
.re-mini dd { margin: 0; font-weight: 700; color: var(--navy); }
.re-disclaimer { margin-top: 28px; max-width: 860px; }

/* ---------- best time to visit ---------- */
.re-answer { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; padding: 12px 16px; border-radius: 12px; background: var(--navy); border: 1px solid rgba(255,255,255,.22); font-size: 16px; font-weight: 700; }
.re-answer .ico { color: #FFB45C; }
.re-sweet { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.re-sweet .re-card { display: grid; gap: 8px; align-content: start; padding: 20px; }
.re-sweet .re-tag { justify-self: start; }
.re-sweet-t { font-size: 20px; line-height: 1.25; font-weight: 800; color: var(--navy); }
.re-sweet .re-card > p:last-child { font-size: 15px; color: var(--text-2); }
.re-months { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.re-month { display: flex; flex-direction: column; gap: 14px; padding: 20px; border: 1px solid var(--line); border-radius: var(--card-r); background: #fff; }
.re-month-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.re-month h3 { font-size: 21px; line-height: 1.2; font-weight: 800; color: var(--navy); }
.re-month-facts { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.re-month-facts > div { padding: 10px 12px; border-radius: 10px; background: var(--mist); }
.re-month-facts dt { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--muted); }
.re-month-facts dt .ico { width: 15px; height: 15px; color: var(--blue); }
.re-month-facts > div:first-child dt .ico { color: #B45309; }
.re-month-facts dd { margin: 3px 0 0; font-size: 16px; font-weight: 800; color: var(--navy); }
.re-month > p { font-size: 14.5px; color: var(--text-2); }
.re-ramadan { display: flex; align-items: flex-start; gap: 20px; max-width: 900px; }
.re-moon { width: 52px; height: 52px; flex: none; display: grid; place-items: center; border-radius: 14px; background: var(--navy-2); border: 1px solid rgba(255,255,255,.18); color: #FFB45C; }
.re-moon .ico { width: 26px; height: 26px; }
.re-ramadan h2 { font-size: clamp(24px, 2.4vw, 32px); line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; }
.re-ramadan p:not(.kicker) { margin-top: 10px; font-size: 17px; color: #E3EAF3; }
.re-pack h3 { font-size: 18px; }
.re-pack .re-dots { font-size: 15px; gap: 8px; }
.re-source { margin-top: 24px; max-width: 860px; font-size: 13.5px; color: var(--muted); }

/* ---------- responsive ---------- */
@media (max-width: 1279px) {
  .re-months { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1023px) {
  .re-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .re-go { grid-column: 1 / -1; }
  .re-go .btn { width: 100%; }
  .re-empty { grid-template-columns: 1fr; }
  .re-form-grid { grid-template-columns: 1fr; }
  .re-sweet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .re-months { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 699px) {
  .re-dock { margin-top: -72px; }
  .re-empty-sec { padding-bottom: 56px; }
  .re-hero-solo .b-hero-in { padding-bottom: 56px; }
  .page-buying-guide .p-main { padding-bottom: 56px; }
  .re-find { padding: 16px 14px 12px; }
  .re-bar { gap: 10px; }
  .re-empty-main, .re-empty-own { padding: 26px 20px; }
  .re-empty-main .pg-acts .btn, .re-empty-own .btn { width: 100%; }
  .re-own { padding: 24px 20px; }
  .re-own .btn { width: 100%; }
  .re-thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .re-stats dd { font-size: 20px; }
  .re-wa { padding: 22px 18px; }
  .re-short { padding: 20px 18px; }
  .re-sec { margin-top: 44px; }
  .re-areas { grid-template-columns: 1fr; gap: 10px; }
  .re-band { padding: 24px 18px; }
  .re-tiers { grid-template-columns: 1fr; gap: 8px; }
  .re-check { padding: 18px 16px 14px; }
  .re-check-row { flex-direction: column; }
  .re-check-row .ctl { flex: none; }
  .re-check-row .btn { width: 100%; }
  .re-result { padding: 24px 18px; }
  .re-facts { grid-template-columns: 1fr; }
  .re-answer { font-size: 15px; }
  .re-sweet { gap: 10px; }
  .re-sweet .re-card { padding: 16px 14px; }
  .re-sweet-t { font-size: 18px; }
  .re-months { grid-template-columns: 1fr; }
  .re-ramadan { flex-direction: column; gap: 14px; }
  /* long labels (Arabic, Russian, German) wrap inside full-width buttons instead of running off the screen */
  .re-result .pg-acts .btn, .re-empty .btn, .re-own .btn, .cta-btns .btn { width: 100%; height: auto; min-height: 50px; padding-block: 12px; white-space: normal; text-align: center; }
}