/* =========================================================================
   REEM TRANSPORT — Design System
   مؤسسة ريم لنقل العفش · navy/gold · RTL
   -------------------------------------------------------------------------
   1. Tokens (colors, type, space, shadow, radius)
   2. Base / reset / typography
   3. Layout primitives (container, section, eyebrow)
   4. Components (buttons, badges, cards, pills, tables, faq)
   5. Header (topbar, nav)
   6. Home sections (hero, services, stats, steps, why, cities, cta)
   7. Single / page (breadcrumb, hero, entry content, related)
   8. Archive
   9. Footer
   10. Floating actions
   11. Utilities & animations
   12. Responsive
   ========================================================================= */

/* ============================ 1. TOKENS ================================= */
:root {
    /* brand */
    --navy-900:#0f1b33;
    --navy-800:#15233f;
    --navy-700:#1d2f52;
    --navy-600:#284071;
    --navy-500:#365394;
    --gold-600:#b8941f;
    --gold-500:#c9a227;
    --gold-400:#dcb845;
    --gold-100:#f7eed2;
    --gold-50: #fbf6e6;

    /* neutrals */
    --ink:     #1c2330;
    --ink-soft:#475066;
    --muted:   #6b7385;
    --line:    #e8eaf0;
    --line-2:  #f0f2f6;
    --bg:      #ffffff;
    --bg-soft: #f7f8fb;
    --bg-tint: #eef1f8;

    /* status */
    --ok:#1f9d63;

    /* type */
    --font: 'Tajawal','Segoe UI',Tahoma,sans-serif;
    --fs-hero: clamp(30px, 4.4vw, 52px);
    --fs-h1: clamp(26px, 3.4vw, 40px);
    --fs-h2: clamp(24px, 2.8vw, 34px);
    --fs-h3: clamp(19px, 1.6vw, 23px);
    --fs-lead: clamp(17px, 1.4vw, 20px);
    --fs-body: 17px;
    --fs-sm: 14.5px;

    /* space scale (8pt) */
    --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
    --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:120px;

    /* radius */
    --r-sm:10px; --r-md:16px; --r-lg:22px; --r-pill:999px;

    /* shadow */
    --sh-1:0 1px 2px rgba(15,27,51,.06), 0 2px 6px rgba(15,27,51,.05);
    --sh-2:0 6px 18px rgba(15,27,51,.08);
    --sh-3:0 14px 38px rgba(15,27,51,.13);
    --sh-gold:0 10px 26px rgba(201,162,39,.38);

    --maxw:1200px;
    --ease:cubic-bezier(.22,.61,.36,1);

    /* glass */
    --glass-bg:rgba(255,255,255,.07);
    --glass-bg-2:rgba(255,255,255,.12);
    --glass-brd:rgba(255,255,255,.16);
    --glass-blur:blur(14px) saturate(140%);
}

/* ============================ 2. BASE =================================== */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
    margin:0; background:var(--bg); color:var(--ink);
    font-family:var(--font); font-size:var(--fs-body); line-height:1.85;
    -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img { max-width:100%; height:auto; display:block; }
a { color:var(--navy-600); text-decoration:none; transition:color .2s var(--ease); }
a:hover { color:var(--gold-600); }
h1,h2,h3,h4,h5 { margin:0 0 .55em; color:var(--navy-800); font-weight:800; line-height:1.32; letter-spacing:-.01em; }
p { margin:0 0 1.1em; }
ul,ol { margin:0 0 1.1em; }
strong { color:var(--navy-800); font-weight:700; }
::selection { background:var(--gold-200,#f0e0a8); color:var(--navy-900); }

/* ====================== 3. LAYOUT PRIMITIVES =========================== */
.reem-container { width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px; }
section { padding-block:var(--s-9); }
@media (max-width:768px){ section { padding-block:var(--s-8); } }

.reem-eyebrow {
    display:inline-flex; align-items:center; gap:8px;
    font-size:13px; font-weight:800; letter-spacing:.06em;
    color:var(--gold-600); text-transform:uppercase;
    background:var(--gold-50); border:1px solid var(--gold-100);
    padding:6px 14px; border-radius:var(--r-pill); margin-bottom:var(--s-4);
}
.reem-head { text-align:center; max-width:680px; margin-inline:auto; margin-bottom:var(--s-7); }
.reem-section-title { font-size:var(--fs-h2); margin-bottom:var(--s-3); }
.reem-section-sub { color:var(--muted); font-size:var(--fs-lead); margin:0; }

/* ========================= 4. COMPONENTS =============================== */
/* buttons */
.reem-btn {
    --btn-bg:var(--gold-500); --btn-fg:#fff;
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    padding:15px 30px; border-radius:var(--r-pill); border:2px solid transparent;
    font-family:inherit; font-weight:800; font-size:16px; cursor:pointer;
    background:var(--btn-bg); color:var(--btn-fg);
    box-shadow:var(--sh-gold); transition:transform .18s var(--ease), box-shadow .18s var(--ease), background .18s;
    white-space:nowrap;
}
.reem-btn:hover { transform:translateY(-3px); color:#fff; box-shadow:0 16px 34px rgba(201,162,39,.45); }
.reem-btn:active { transform:translateY(-1px); }
.reem-btn-gold { position:relative; overflow:hidden; background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); }
.reem-btn-gold::after {
    content:""; position:absolute; inset-block:0; inset-inline-start:-60%; width:40%;
    background:linear-gradient(120deg,transparent,rgba(255,255,255,.45),transparent);
    transform:skewX(-20deg); transition:inset-inline-start .6s var(--ease);
}
.reem-btn-gold:hover::after { inset-inline-start:120%; }
.reem-btn-outline { background:transparent; color:#fff; border-color:rgba(255,255,255,.55); box-shadow:none; }
.reem-btn-outline:hover { background:rgba(255,255,255,.12); border-color:#fff; box-shadow:none; }
.reem-btn-navy { background:var(--navy-800); box-shadow:var(--sh-2); }
.reem-btn-navy:hover { background:var(--navy-700); box-shadow:var(--sh-3); }
.reem-btn-lg { padding:18px 44px; font-size:19px; }

/* generic grids */
.reem-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:var(--s-5); }
.reem-flex { display:flex; flex-wrap:wrap; gap:var(--s-5); }
.reem-flex > .reem-card { flex:1 1 240px; }

/* cards */
.reem-card {
    position:relative; background:var(--bg); border:1px solid var(--line);
    border-radius:var(--r-md); padding:var(--s-5);
    box-shadow:var(--sh-1); transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s;
}
.reem-card::before {
    content:""; position:absolute; inset-block-start:0; inset-inline:0; height:3px;
    background:linear-gradient(90deg,var(--gold-400),var(--gold-600));
    border-start-start-radius:var(--r-md); border-start-end-radius:var(--r-md);
    opacity:0; transition:opacity .25s var(--ease);
}
.reem-card:hover { transform:translateY(-6px); box-shadow:var(--sh-3); border-color:transparent; }
.reem-card:hover::before { opacity:1; }
.reem-card h3,.reem-card h4,.reem-card h5 { margin-top:0; color:var(--navy-800); }
.reem-card p { color:var(--ink-soft); margin-bottom:0; }
.reem-card ul { margin:var(--s-3) 0 0; padding-inline-start:18px; color:var(--ink-soft); font-size:var(--fs-sm); }
.reem-card ul li { margin-bottom:6px; }
.reem-card-ic {
    width:60px; height:60px; border-radius:16px; margin-bottom:var(--s-4);
    display:grid; place-items:center; font-size:28px;
    background:linear-gradient(135deg,var(--gold-50),var(--gold-100));
    border:1px solid var(--gold-100);
}

/* services (premium) */
.reem-svc-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:24px; }
.reem-svc {
    position:relative; overflow:hidden; background:linear-gradient(180deg,#ffffff,#fafcff);
    border:1px solid var(--line); border-radius:22px; padding:34px 28px 30px;
    box-shadow:0 4px 16px rgba(15,27,51,.05);
    transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s;
}
/* gradient border on hover */
.reem-svc::before {
    content:""; position:absolute; inset:0; border-radius:22px; padding:1.5px; pointer-events:none; opacity:0;
    background:linear-gradient(135deg,var(--gold-400),var(--navy-500));
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude; transition:opacity .4s;
}
.reem-svc:hover { transform:translateY(-10px); box-shadow:0 24px 52px rgba(15,27,51,.16); border-color:transparent; }
.reem-svc:hover::before { opacity:1; }
/* elegant outlined numeral */
.reem-svc-no {
    position:absolute; inset-block-start:20px; inset-inline-end:26px; z-index:0;
    font-size:56px; font-weight:900; line-height:1; letter-spacing:-.04em; pointer-events:none;
    color:transparent; -webkit-text-stroke:1.5px var(--bg-tint); transition:-webkit-text-stroke-color .4s, transform .4s;
}
.reem-svc:hover .reem-svc-no { -webkit-text-stroke-color:var(--gold-200,#ecd99f); transform:translateY(-2px); }
/* icon badge with glow */
.reem-svc-ic {
    position:relative; z-index:1; display:grid; place-items:center; width:74px; height:74px;
    border-radius:20px; margin-bottom:22px; color:var(--gold-400);
    background:linear-gradient(135deg,var(--navy-700),var(--navy-900));
    box-shadow:0 12px 24px rgba(21,35,63,.28);
    transition:background .4s var(--ease), color .4s var(--ease), transform .4s var(--ease);
}
.reem-svc-ic::after {
    content:""; position:absolute; inset:-7px; z-index:-1; border-radius:26px; opacity:0;
    background:radial-gradient(circle, rgba(201,162,39,.4), transparent 70%); transition:opacity .4s;
}
.reem-svc-ic svg { width:34px; height:34px; }
.reem-svc:hover .reem-svc-ic { background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); color:var(--navy-900); transform:translateY(-4px) rotate(-6deg); }
.reem-svc:hover .reem-svc-ic::after { opacity:1; }
.reem-svc h3 { position:relative; z-index:1; font-size:21px; margin-bottom:14px; padding-bottom:14px; }
.reem-svc h3::after { content:""; position:absolute; inset-block-end:0; inset-inline-start:0; width:38px; height:3px; border-radius:3px; background:linear-gradient(90deg,var(--gold-400),var(--gold-600)); transition:width .4s var(--ease); }
.reem-svc:hover h3::after { width:70px; }
.reem-svc p { position:relative; z-index:1; color:var(--ink-soft); margin-bottom:0; font-size:15.5px; line-height:1.85; }

/* step number badge */
.reem-step-num {
    display:inline-grid; place-items:center; width:56px; height:56px; border-radius:50%;
    background:linear-gradient(135deg,var(--navy-700),var(--navy-900)); color:var(--gold-400);
    font-size:22px; font-weight:900; margin-bottom:var(--s-3); box-shadow:var(--sh-2);
}

/* callout boxes (used inside cleaned content + home) */
.reem-box {
    background:var(--bg-soft); border:1px solid var(--line);
    border-inline-start:5px solid var(--gold-500);
    border-radius:var(--r-md); padding:var(--s-5); margin-block:var(--s-5);
}
.reem-box h3,.reem-box h4 { margin-top:0; }
.reem-box p:last-child { margin-bottom:0; }

/* pills / tags */
.reem-tags { display:flex; flex-wrap:wrap; gap:10px; }
.reem-tags span {
    background:var(--gold-50); color:var(--navy-700); border:1px solid var(--gold-100);
    font-weight:700; font-size:var(--fs-sm); padding:7px 16px; border-radius:var(--r-pill);
}

/* tables */
.reem-table {
    width:100%; border-collapse:separate; border-spacing:0; background:var(--bg);
    border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden;
    box-shadow:var(--sh-1); margin-block:var(--s-5);
}
.reem-table th { background:var(--navy-800); color:#fff; padding:16px 18px; text-align:right; font-weight:800; font-size:var(--fs-sm); }
.reem-table td { padding:15px 18px; border-block-start:1px solid var(--line-2); vertical-align:top; }
.reem-table tbody tr:first-child td { border-block-start:0; }
.reem-table tbody tr:nth-child(even) td { background:var(--bg-soft); }
.reem-table td:first-child { font-weight:700; color:var(--navy-800); }
.reem-table a { color:var(--gold-600); font-weight:800; }

/* faq */
.reem-faq-item {
    background:var(--bg); border:1px solid var(--line); border-radius:var(--r-md);
    padding:4px 20px; margin-bottom:12px; transition:border-color .2s, box-shadow .2s;
}
.reem-faq-item[open] { border-color:var(--gold-200,#ead9a0); box-shadow:var(--sh-1); }
.reem-faq-item summary {
    list-style:none; cursor:pointer; font-weight:800; color:var(--navy-800);
    padding-block:16px; display:flex; align-items:center; gap:12px;
}
.reem-faq-item summary::-webkit-details-marker { display:none; }
.reem-faq-item summary::before {
    content:"+"; flex:0 0 28px; width:28px; height:28px; display:grid; place-items:center;
    background:var(--gold-50); color:var(--gold-600); border-radius:8px; font-weight:900; font-size:18px;
    transition:transform .2s var(--ease);
}
.reem-faq-item[open] summary::before { content:"\2212"; transform:rotate(0); }
.reem-faq-item p { margin:0 0 16px; color:var(--ink-soft); padding-inline-start:40px; }

/* ============================ 5. HEADER ================================ */
.reem-topbar { background:var(--navy-900); color:#aebbd4; font-size:13.5px; }
.reem-topbar-in { display:flex; justify-content:space-between; align-items:center; min-height:42px; gap:12px; }
.reem-topbar-phone { color:var(--gold-400); font-weight:800; }
.reem-topbar-phone:hover { color:#fff; }

.reem-header { background:rgba(255,255,255,.96); backdrop-filter:saturate(140%) blur(8px); position:sticky; top:0; z-index:100; border-bottom:1px solid var(--line); transition:box-shadow .3s, background .3s; }
.reem-header.is-stuck { box-shadow:var(--sh-2); }
.reem-header-in { display:flex; align-items:center; gap:20px; min-height:78px; }
.reem-brand-text { display:flex; flex-direction:column; line-height:1.2; }
.reem-brand-name { font-size:21px; font-weight:900; color:var(--navy-800); }
.reem-brand-desc { font-size:11.5px; color:var(--muted); font-weight:600; }
.custom-logo,.reem-brand img { max-height:58px; width:auto; }

.reem-nav { margin-inline-start:auto; }
.reem-menu { list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:2px; margin:0; padding:0; }
.reem-menu > li { position:relative; }
.reem-menu a { display:flex; align-items:center; gap:6px; padding:10px 15px; font-weight:700; font-size:15px; color:var(--navy-700); border-radius:10px; }
.reem-menu a:hover,.reem-menu .current-menu-item > a { background:var(--bg-tint); color:var(--gold-600); }
.reem-menu .menu-item-has-children > a::after { content:"\25be"; font-size:10px; opacity:.6; }
.reem-menu .sub-menu {
    list-style:none; margin:0; padding:8px; position:absolute; top:calc(100% + 6px); inset-inline-end:0;
    min-width:250px; background:#fff; box-shadow:var(--sh-3); border:1px solid var(--line);
    border-radius:14px; opacity:0; visibility:hidden; transform:translateY(8px);
    transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s; z-index:110;
}
.reem-menu li:hover > .sub-menu { opacity:1; visibility:visible; transform:translateY(0); }
.reem-menu .sub-menu a { font-size:14px; padding:9px 12px; }
.reem-menu .sub-menu a:hover { background:var(--gold-50); }

.reem-header-cta { background:var(--navy-800); color:#fff; padding:11px 22px; border-radius:var(--r-pill); font-weight:800; font-size:14.5px; box-shadow:var(--sh-1); }
.reem-header-cta:hover { background:var(--gold-500); color:#fff; transform:translateY(-2px); }

.reem-nav-toggle { display:none; flex-direction:column; gap:5px; background:none; border:0; padding:10px; cursor:pointer; margin-inline-start:auto; }
.reem-nav-toggle span { width:26px; height:3px; background:var(--navy-800); border-radius:3px; transition:.25s var(--ease); }
.reem-nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.reem-nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.reem-nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* ======================= 6. HOME SECTIONS ============================= */
/* unified top block (hero + stats share one animated background) */
.reem-top {
    position:relative; overflow:hidden; isolation:isolate;
    background:linear-gradient(150deg,var(--navy-900) 0%, var(--navy-700) 48%, var(--navy-800) 100%);
    background-size:200% 200%; animation:reem-bg-shift 22s ease infinite;
}
.reem-top::before {
    content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.45;
    background-image:radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
    background-size:24px 24px;
}
.reem-top > section { position:relative; z-index:1; background:transparent; }
.reem-top .reem-home-hero::after,
.reem-top .reem-stats::before { display:none; }
.reem-top .reem-stats { background:transparent; }
.reem-top .reem-home-hero { padding-block:var(--s-9) var(--s-7); }
.reem-top .reem-stats { padding-block:var(--s-6) var(--s-8); }

@keyframes reem-bg-shift { 0%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } 100%{ background-position:0% 50%; } }

/* floating glow orbs */
.reem-orb { position:absolute; z-index:0; border-radius:50%; filter:blur(64px); pointer-events:none; }
.reem-orb-1 { width:440px; height:440px; inset-block-start:-130px; inset-inline-end:-90px;
    background:radial-gradient(circle, rgba(201,162,39,.5), transparent 70%); animation:reem-drift1 17s ease-in-out infinite; }
.reem-orb-2 { width:380px; height:380px; inset-block-end:-120px; inset-inline-start:-70px;
    background:radial-gradient(circle, rgba(54,83,148,.65), transparent 70%); animation:reem-drift2 21s ease-in-out infinite; }
.reem-orb-3 { width:300px; height:300px; inset-block-start:42%; inset-inline-start:32%;
    background:radial-gradient(circle, rgba(201,162,39,.28), transparent 70%); animation:reem-drift3 26s ease-in-out infinite; }
@keyframes reem-drift1 { 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(-46px,46px) scale(1.08); } }
@keyframes reem-drift2 { 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(50px,-36px) scale(1.1); } }
@keyframes reem-drift3 { 0%,100%{ transform:translate(0,0); } 33%{ transform:translate(40px,-30px); } 66%{ transform:translate(-30px,24px); } }
/* falling furniture-icon "rain" */
.reem-rain { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.reem-drop { position:absolute; inset-block-start:-60px; will-change:transform; animation:reem-fall linear infinite; filter:drop-shadow(0 3px 5px rgba(0,0,0,.35)); }
.reem-drop svg { width:100%; height:100%; display:block; }
@keyframes reem-fall {
    0% { transform:translateY(-60px) rotate(0deg); }
    100% { transform:translateY(118vh) rotate(230deg); }
}
.reem-drop:nth-child(1)  { inset-inline-start:4%;  width:36px; animation-duration:13s;  animation-delay:0s;   opacity:.5; }
.reem-drop:nth-child(2)  { inset-inline-start:10%; width:26px; animation-duration:16s;  animation-delay:2.4s; opacity:.4;  color:#fff; }
.reem-drop:nth-child(3)  { inset-inline-start:16%; width:42px; animation-duration:11s;  animation-delay:1.1s; opacity:.5; }
.reem-drop:nth-child(4)  { inset-inline-start:22%; width:28px; animation-duration:15s;  animation-delay:4.2s; opacity:.44; }
.reem-drop:nth-child(5)  { inset-inline-start:29%; width:34px; animation-duration:18s;  animation-delay:.6s;  opacity:.38; color:#fff; }
.reem-drop:nth-child(6)  { inset-inline-start:35%; width:24px; animation-duration:12s;  animation-delay:3.3s; opacity:.5; }
.reem-drop:nth-child(7)  { inset-inline-start:42%; width:40px; animation-duration:14s;  animation-delay:1.7s; opacity:.46; }
.reem-drop:nth-child(8)  { inset-inline-start:48%; width:26px; animation-duration:17s;  animation-delay:5.5s; opacity:.4;  color:#fff; }
.reem-drop:nth-child(9)  { inset-inline-start:55%; width:44px; animation-duration:10.5s;animation-delay:2.8s; opacity:.5; }
.reem-drop:nth-child(10) { inset-inline-start:61%; width:26px; animation-duration:15.5s;animation-delay:.9s;  opacity:.44; }
.reem-drop:nth-child(11) { inset-inline-start:67%; width:32px; animation-duration:12.5s;animation-delay:3.9s; opacity:.5; }
.reem-drop:nth-child(12) { inset-inline-start:73%; width:24px; animation-duration:16.5s;animation-delay:6.2s; opacity:.4;  color:#fff; }
.reem-drop:nth-child(13) { inset-inline-start:79%; width:38px; animation-duration:13.5s;animation-delay:2s;   opacity:.46; }
.reem-drop:nth-child(14) { inset-inline-start:85%; width:26px; animation-duration:19s;  animation-delay:4.8s; opacity:.4; }
.reem-drop:nth-child(15) { inset-inline-start:91%; width:36px; animation-duration:12s;  animation-delay:1.4s; opacity:.5; }
.reem-drop:nth-child(16) { inset-inline-start:96%; width:24px; animation-duration:17.5s;animation-delay:3.1s; opacity:.4;  color:#fff; }
.reem-drop:nth-child(17) { inset-inline-start:7%;  width:30px; animation-duration:14.5s;animation-delay:5.9s; opacity:.46; }
.reem-drop:nth-child(18) { inset-inline-start:46%; width:28px; animation-duration:20s;  animation-delay:7.2s; opacity:.38; }
.reem-drop:nth-child(19) { inset-inline-start:88%; width:32px; animation-duration:11.5s;animation-delay:8s;   opacity:.46; }
.reem-drop:nth-child(20) { inset-inline-start:33%; width:26px; animation-duration:18.5s;animation-delay:6.8s; opacity:.4;  color:#fff; }
/* أيقونات ملوّنة: شفافية أعلى موحّدة لوضوح أكبر */
.reem-rain .reem-drop { opacity:.92; }

@media (prefers-reduced-motion:reduce){ .reem-top{ animation:none; } .reem-orb,.reem-drop{ animation:none!important; } .reem-rain{ display:none; } }

/* hero */
.reem-home-hero {
    position:relative; color:#fff; overflow:hidden;
    background:
        radial-gradient(900px 500px at 85% -10%, rgba(201,162,39,.22), transparent 60%),
        radial-gradient(700px 500px at 5% 110%, rgba(54,83,148,.5), transparent 55%),
        linear-gradient(135deg,var(--navy-900) 0%, var(--navy-700) 60%, var(--navy-600) 100%);
    padding-block:var(--s-10) var(--s-9);
}
.reem-home-hero::after {
    content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
    background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
    background-size:22px 22px;
}
.reem-hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:1.15fr .85fr; gap:var(--s-8); align-items:center; }
.reem-home-hero-in { max-width:680px; }
.reem-home-hero .reem-eyebrow { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.18); color:var(--gold-400); }
.reem-home-hero h1 { color:#fff; font-size:var(--fs-hero); font-weight:900; margin-bottom:var(--s-4); }
.reem-home-hero h1 span { display:block; font-size:.55em; font-weight:600; color:var(--gold-400); margin-top:14px; }
.reem-home-hero p { font-size:var(--fs-lead); color:rgba(255,255,255,.9); margin-bottom:var(--s-6); max-width:620px; }
.reem-home-hero p strong { color:var(--gold-400); font-weight:800; }
.reem-home-hero-cta { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:var(--s-7); }
.reem-home-hero-feats { list-style:none; display:flex; flex-wrap:wrap; gap:14px 26px; padding:0; margin:0; }
.reem-home-hero-feats li { display:flex; align-items:center; gap:9px; font-weight:700; font-size:15.5px; color:rgba(255,255,255,.92); }
.reem-home-hero-feats li::before { content:"\2713"; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:rgba(201,162,39,.22); color:var(--gold-400); font-size:13px; font-weight:900; }

/* hero visual */
.reem-hero-visual { position:relative; aspect-ratio:1/1; max-width:480px; margin-inline:auto; width:100%; }
.reem-hero-disc {
    position:absolute; inset:8% 8% 12% 8%; border-radius:50%;
    background:
        radial-gradient(circle at 35% 30%, rgba(255,255,255,.12), transparent 55%),
        linear-gradient(150deg, var(--gold-400), var(--gold-600));
    box-shadow:0 30px 80px rgba(201,162,39,.35), inset 0 0 60px rgba(255,255,255,.12);
}
.reem-hero-rings { position:absolute; inset:0; }
.reem-hero-rings span { position:absolute; inset:0; border-radius:50%; border:1px solid rgba(255,255,255,.16); }
.reem-hero-rings span:nth-child(1){ inset:-2%; }
.reem-hero-rings span:nth-child(2){ inset:6%; border-style:dashed; border-color:rgba(255,255,255,.12); animation:reem-spin 60s linear infinite; }
.reem-hero-rings span:nth-child(3){ inset:18%; }
@keyframes reem-spin { to{ transform:rotate(360deg); } }

.reem-truck { position:absolute; inset:16% 9% 14% 9%; width:82%; height:auto; margin:auto; filter:drop-shadow(0 20px 28px rgba(15,27,51,.3)); animation:reem-float 4.5s ease-in-out infinite; }
.reem-truck-shadow { fill:rgba(15,27,51,.16); }
.reem-truck-chassis { fill:var(--navy-900); }
.reem-truck-box { fill:#ffffff; stroke:rgba(15,27,51,.08); stroke-width:2; }
.reem-truck-roof { fill:var(--navy-800); }
.reem-truck-panel { fill:var(--bg-soft); stroke:var(--gold-100); stroke-width:2; }
.reem-truck-brand { fill:var(--navy-800); font-family:var(--font); font-weight:900; font-size:46px; }
.reem-truck-sub { fill:var(--gold-600); font-family:var(--font); font-weight:800; font-size:22px; letter-spacing:.5px; }
.reem-truck-accent { fill:var(--gold-500); }
.reem-truck-cab { fill:var(--navy-800); }
.reem-truck-window { fill:#d3e3ff; }
.reem-truck-door { fill:var(--navy-700); }
.reem-truck-handle { fill:var(--gold-400); }
.reem-truck-headlight { fill:var(--gold-400); }
.reem-truck-bumper { fill:var(--navy-900); }
.reem-wheel { fill:var(--navy-900); }
.reem-wheel-rim { fill:var(--gold-400); }
.reem-wheel-hub { fill:var(--navy-800); }
.reem-motion { stroke:#ffffff; stroke-width:6; stroke-linecap:round; opacity:.75; }

/* floating cards */
.reem-hero-seal {
    position:absolute; inset-block-start:6%; inset-inline-start:-4%;
    width:104px; height:104px; border-radius:50%; display:grid; place-content:center; text-align:center;
    background:#fff; box-shadow:var(--sh-3); border:3px solid var(--gold-400);
    animation:reem-float 5s ease-in-out infinite .4s;
}
.reem-seal-num { font-size:26px; font-weight:900; color:var(--navy-800); line-height:1; }
.reem-seal-txt { font-size:12px; font-weight:700; color:var(--gold-600); margin-top:3px; }

.reem-hero-chip {
    position:absolute; display:flex; align-items:center; gap:10px;
    background:rgba(255,255,255,.97); padding:11px 16px; border-radius:14px;
    box-shadow:var(--sh-3); border:1px solid rgba(255,255,255,.6);
}
.reem-chip-meta { font-size:13.5px; color:var(--ink-soft); line-height:1.3; }
.reem-chip-meta b { display:block; font-size:16px; color:var(--navy-800); }
.reem-chip-stars { color:var(--gold-500); font-size:15px; letter-spacing:1px; }
.reem-chip-ic { font-size:20px; }
.reem-chip-rating { inset-block-end:14%; inset-inline-end:-6%; animation:reem-float 5.5s ease-in-out infinite .2s; }
.reem-chip-cities { inset-block-start:40%; inset-inline-end:-8%; animation:reem-float 6s ease-in-out infinite .6s; }

@keyframes reem-float { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }
@media (prefers-reduced-motion:reduce){ .reem-truck,.reem-hero-seal,.reem-hero-chip,.reem-hero-rings span{ animation:none!important; } }

/* stats band — glass cards over navy */
.reem-stats {
    position:relative; overflow:hidden; color:#fff; padding-block:var(--s-7);
    background:
        radial-gradient(700px 360px at 80% -30%, rgba(201,162,39,.2), transparent 60%),
        linear-gradient(135deg,var(--navy-900),var(--navy-700));
}
.reem-stats::before {
    content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
    background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px); background-size:22px 22px;
}
.reem-stats-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-5); }
.reem-stat {
    text-align:center; padding:var(--s-5) var(--s-3); border-radius:var(--r-md);
    background:var(--glass-bg); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
    border:1px solid var(--glass-brd); transition:transform .3s var(--ease), background .3s, box-shadow .3s;
}
.reem-stat:hover { transform:translateY(-6px); background:var(--glass-bg-2); box-shadow:0 18px 40px rgba(0,0,0,.25); }
.reem-stat-num { font-size:clamp(30px,3.4vw,46px); font-weight:900; color:var(--gold-400); line-height:1.1; }
.reem-stat-label { font-size:var(--fs-sm); color:rgba(255,255,255,.82); margin-top:8px; }

.reem-home-services { background:radial-gradient(900px 400px at 50% -10%, var(--gold-50), transparent 60%), var(--bg-soft); }

/* steps — dark band, glass cards, connecting line */
.reem-home-steps {
    position:relative; overflow:hidden; color:#fff;
    background:
        radial-gradient(600px 320px at 15% 120%, rgba(201,162,39,.16), transparent 60%),
        linear-gradient(160deg,var(--navy-800),var(--navy-900));
}
.reem-home-steps .reem-section-title { color:#fff; }
.reem-home-steps .reem-section-sub { color:rgba(255,255,255,.78); }
.reem-home-steps .reem-eyebrow { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.16); color:var(--gold-400); }
.reem-steps-line { position:relative; }
.reem-steps-line::before {
    content:""; position:absolute; inset-block-start:60px; inset-inline:6%; height:2px;
    background:linear-gradient(90deg,transparent,var(--gold-500),transparent); opacity:.5;
}
.reem-home-steps .reem-flex { position:relative; z-index:1; gap:var(--s-5); }
.reem-home-steps .reem-card {
    text-align:center; background:var(--glass-bg); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
    border:1px solid var(--glass-brd); box-shadow:none;
}
.reem-home-steps .reem-card::before { display:none; }
.reem-home-steps .reem-card:hover { transform:translateY(-8px); background:var(--glass-bg-2); box-shadow:0 20px 44px rgba(0,0,0,.3); border-color:rgba(201,162,39,.4); }
.reem-home-steps .reem-card h3 { color:#fff; }
.reem-home-steps .reem-card p { color:rgba(255,255,255,.78); }
.reem-home-steps .reem-card .reem-step-num {
    margin-inline:auto; background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); color:var(--navy-900);
    box-shadow:0 8px 20px rgba(201,162,39,.45); border:4px solid rgba(255,255,255,.12);
}

/* ===== animated process "how it works" ===== */
.reem-process { background:linear-gradient(180deg,var(--bg) 0%, var(--bg-soft) 100%); }
.reem-process-track { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-5); }
.reem-stage {
    position:relative; overflow:hidden; background:#fff; border:1px solid var(--line);
    border-radius:var(--r-lg); padding:var(--s-5); text-align:center; box-shadow:var(--sh-1);
    transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.reem-stage:hover { transform:translateY(-7px); box-shadow:var(--sh-3); border-color:transparent; }
.reem-stage-no {
    position:absolute; inset-block-start:14px; inset-inline-start:14px; z-index:2;
    width:32px; height:32px; border-radius:50%; display:grid; place-items:center; font-weight:900; color:#fff;
    background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); box-shadow:var(--sh-2);
}
.reem-stage-scene {
    height:130px; display:grid; place-items:center; margin-bottom:var(--s-4); border-radius:var(--r-md);
    background:radial-gradient(circle at 50% 38%, var(--gold-50), #fff 72%); border:1px solid var(--line-2);
}
.reem-scene { width:170px; height:auto; overflow:visible; }
.reem-stage h3 { font-size:var(--fs-h3); margin-bottom:8px; }
.reem-stage p { color:var(--ink-soft); font-size:14.5px; margin:0; }
/* connector chevron between stages (RTL: points to next, on inline-start) */
.reem-stage:not(:last-child)::after {
    content:"\203A"; position:absolute; inset-inline-start:-22px; inset-block-start:50%;
    transform:translateY(-50%); color:var(--gold-500); font-size:30px; font-weight:900; z-index:3;
    animation:reem-chev 1.5s ease-in-out infinite;
}

/* scene animations */
.reem-rock { transform-box:fill-box; transform-origin:50% 100%; animation:reem-rock 1.6s ease-in-out infinite; }
.reem-wheelspin { transform-box:fill-box; transform-origin:center; animation:reem-spin 1.3s linear infinite; }
.reem-bob { animation:reem-bob 1.4s ease-in-out infinite; }
.reem-road { animation:reem-roadmove 1s linear infinite; }
.reem-lift { animation:reem-lift 3.2s ease-in-out infinite; }
.reem-tape { stroke-dasharray:230; stroke-dashoffset:230; animation:reem-tapedraw 3s ease-in-out infinite; }
.reem-bub { animation:reem-bub 2s ease-in-out infinite; }
.reem-bub:nth-of-type(2){ animation-delay:.5s; } .reem-bub:nth-of-type(3){ animation-delay:1s; }

@keyframes reem-rock { 0%,100%{ transform:rotate(-20deg); } 50%{ transform:rotate(16deg); } }
@keyframes reem-spin { to{ transform:rotate(360deg); } }
@keyframes reem-bob { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-3px); } }
@keyframes reem-roadmove { to{ stroke-dashoffset:-44; } }
@keyframes reem-lift { 0%{ transform:translateY(36px); } 42%,58%{ transform:translateY(0); } 100%{ transform:translateY(36px); } }
@keyframes reem-tapedraw { 0%{ stroke-dashoffset:230; } 55%,100%{ stroke-dashoffset:0; } }
@keyframes reem-bub { 0%,100%{ opacity:0; transform:scale(.4); } 50%{ opacity:.9; transform:scale(1); } }
@keyframes reem-chev { 0%,100%{ transform:translateY(-50%) translateX(0); opacity:.5; } 50%{ transform:translateY(-50%) translateX(-5px); opacity:1; } }
@media (prefers-reduced-motion:reduce){
    .reem-rock,.reem-wheelspin,.reem-bob,.reem-road,.reem-lift,.reem-tape,.reem-bub,.reem-stage:not(:last-child)::after{ animation:none!important; }
    .reem-tape{ stroke-dashoffset:0; } .reem-bub{ opacity:.9; }
}

/* ===== sequential animated "movie" (4 acts) ===== */
.reem-movie {
    position:relative; width:100%; padding-top:37.5%; border-radius:var(--r-lg); overflow:hidden;
    box-shadow:var(--sh-2); border:1px solid var(--line);
    background:linear-gradient(180deg,#d7e3f3 0%, #eef4fa 72%); margin-bottom:var(--s-5);
}
/* real video player */
.reem-vid {
    position:relative; aspect-ratio:16/9; border-radius:var(--r-lg); overflow:hidden;
    box-shadow:var(--sh-3); border:1px solid var(--line); background:#0f1b33; margin-bottom:var(--s-5);
}
.reem-vid-el { width:100%; height:100%; object-fit:cover; display:block; }
.reem-vid::after {
    content:""; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(180deg, rgba(15,27,51,.18), transparent 28%, transparent 72%, rgba(15,27,51,.3));
}
.reem-vid-badge {
    position:absolute; inset-block-start:16px; inset-inline-start:16px; z-index:2;
    display:inline-flex; align-items:center; gap:8px; color:#fff; font-weight:700; font-size:13px;
    padding:8px 14px; border-radius:var(--r-pill); background:rgba(15,27,51,.6);
    -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.18);
}
.reem-vid-dot { width:9px; height:9px; border-radius:50%; background:#e3504b; animation:reem-rec 1.5s infinite; }
@keyframes reem-rec { 0%{ box-shadow:0 0 0 0 rgba(227,80,75,.6); } 100%{ box-shadow:0 0 0 9px rgba(227,80,75,0); } }
@media (prefers-reduced-motion:reduce){ .reem-vid-dot{ animation:none; } }
/* logo watermark on video */
.reem-vid-logo { position:absolute; inset-block-start:14px; inset-inline-end:14px; z-index:3; max-height:56px; width:auto; padding:6px 10px; background:rgba(255,255,255,.94); border-radius:12px; box-shadow:var(--sh-2); }
.reem-vid-logo-txt { display:inline-flex; align-items:center; font-weight:900; color:var(--navy-800); font-size:16px; }

/* video step indicators (synced to video time) */
.reem-vid-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.reem-vstep {
    position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center; text-align:center; gap:5px;
    padding:16px 12px; background:#fff; border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--sh-1);
    transition:transform .35s var(--ease), box-shadow .35s, background .35s, border-color .35s;
}
.reem-vstep-no { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-weight:900; color:var(--navy-800); background:var(--bg-tint); transition:background .35s, color .35s; }
.reem-vstep b { color:var(--navy-800); font-size:15.5px; }
.reem-vstep i { color:var(--muted); font-size:12.5px; font-style:normal; line-height:1.6; }
.reem-vstep-bar { position:absolute; inset-block-end:0; inset-inline:0; height:3px; background:linear-gradient(90deg,var(--gold-400),var(--gold-600)); transform:scaleX(0); transform-origin:inline-end; transition:transform .4s var(--ease); }
.reem-vstep.is-active { background:linear-gradient(135deg,var(--navy-700),var(--navy-900)); border-color:transparent; transform:translateY(-6px); box-shadow:var(--sh-3); }
.reem-vstep.is-active b { color:#fff; }
.reem-vstep.is-active i { color:rgba(255,255,255,.82); }
.reem-vstep.is-active .reem-vstep-no { background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); color:var(--navy-900); }
.reem-vstep.is-active .reem-vstep-bar { transform:scaleX(1); }
@media (max-width:760px){ .reem-vid-steps { grid-template-columns:repeat(2,1fr); } }
@media (max-width:440px){ .reem-vid-steps { grid-template-columns:1fr; } .reem-vid-logo { max-height:44px; } }

.reem-defs { position:absolute; width:0; height:0; overflow:hidden; }
.reem-act { position:absolute; inset:0; opacity:0; animation:reem-act 16s linear infinite; }
.reem-act svg { width:100%; height:100%; display:block; }
.reem-act2 { animation-delay:4s; }
.reem-act3 { animation-delay:8s; }
.reem-act4 { animation-delay:12s; }
@keyframes reem-act { 0%{ opacity:0; } 1.5%{ opacity:1; } 23.5%{ opacity:1; } 25%{ opacity:0; } 100%{ opacity:0; } }

/* progress bar */
.reem-progress { position:absolute; inset-inline:0; inset-block-end:0; height:4px; background:rgba(21,35,63,.12); }
.reem-progress span { display:block; height:100%; transform-origin:inline-start; background:linear-gradient(90deg,var(--gold-400),var(--gold-600)); animation:reem-prog 16s linear infinite; }
@keyframes reem-prog { from{ transform:scaleX(0); } to{ transform:scaleX(1); } }

/* shared character/action animations */
.reem-legA,.reem-legB { transform-box:fill-box; transform-origin:50% 0; animation:reem-step .5s ease-in-out infinite; }
.reem-legB { animation-delay:.25s; }
.reem-walk { animation:reem-walk 4s linear infinite; }
.reem-load { animation:reem-load 2.4s ease-in-out infinite; }
.reem-rock { transform-box:fill-box; transform-origin:0% 50%; animation:reem-rock 1.3s ease-in-out infinite; }
.reem-rock2 { transform-box:fill-box; transform-origin:100% 50%; animation:reem-rock 1.3s ease-in-out infinite .2s; }
.reem-detach { transform-box:fill-box; animation:reem-detach 4s ease-in infinite; }
.reem-hoist { transform-box:fill-box; animation:reem-hoist 16s ease-in-out infinite; animation-delay:8s; }
.reem-arrive { transform-box:fill-box; animation:reem-arrive 16s ease-out infinite; animation-delay:8s; }
.reem-assemble { transform-box:fill-box; animation:reem-assemble 16s ease-in-out infinite; animation-delay:12s; }
@keyframes reem-step { 0%,100%{ transform:rotate(16deg); } 50%{ transform:rotate(-16deg); } }
@keyframes reem-walk { 0%{ transform:translateX(0); opacity:0; } 10%{ opacity:1; } 85%{ opacity:1; } 100%{ transform:translateX(-150px); opacity:0; } }
@keyframes reem-load { 0%{ transform:translateY(22px); } 45%,55%{ transform:translateY(-6px); } 100%{ transform:translateY(22px); } }
@keyframes reem-rock { 0%,100%{ transform:rotate(-14deg); } 50%{ transform:rotate(12deg); } }
@keyframes reem-detach { 0%{ transform:translate(0,0); opacity:1; } 55%{ opacity:1; } 100%{ transform:translate(46px,-8px); opacity:0; } }
@keyframes reem-hoist { 0%{ transform:translateY(120px); } 40%,70%{ transform:translateY(0); } 100%{ transform:translateY(120px); } }
@keyframes reem-arrive { 0%{ transform:translateX(340px); } 35%,100%{ transform:translateX(0); } }
@keyframes reem-assemble { 0%{ transform:translateY(-40px); opacity:0; } 28%{ opacity:1; } 55%,100%{ transform:translateY(0); opacity:1; } }

/* step indicators synced to timeline */
.reem-movie-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-3); }
.reem-mstep {
    display:flex; align-items:center; justify-content:center; gap:10px; text-align:center;
    padding:14px 12px; background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
    font-weight:800; color:var(--ink-soft); font-size:14.5px; box-shadow:var(--sh-1);
    animation:reem-mstep-on 16s linear infinite;
}
.reem-mstep span {
    flex:0 0 30px; width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
    font-weight:900; color:var(--navy-800); background:var(--bg-tint); transition:none;
    animation:reem-mstep-dot 16s linear infinite;
}
.reem-mstep:nth-child(2),.reem-mstep:nth-child(2) span { animation-delay:4s; }
.reem-mstep:nth-child(3),.reem-mstep:nth-child(3) span { animation-delay:8s; }
.reem-mstep:nth-child(4),.reem-mstep:nth-child(4) span { animation-delay:12s; }
@keyframes reem-mstep-on {
    0%{ background:linear-gradient(135deg,var(--navy-700),var(--navy-900)); color:#fff; border-color:transparent; transform:translateY(-3px); box-shadow:var(--sh-2); }
    24%{ background:linear-gradient(135deg,var(--navy-700),var(--navy-900)); color:#fff; border-color:transparent; }
    25%{ background:#fff; color:var(--ink-soft); border-color:var(--line); transform:translateY(0); box-shadow:var(--sh-1); }
    100%{ background:#fff; color:var(--ink-soft); border-color:var(--line); }
}
@keyframes reem-mstep-dot {
    0%,24%{ background:var(--gold-500); color:#fff; }
    25%,100%{ background:var(--bg-tint); color:var(--navy-800); }
}
@media (max-width:760px){ .reem-movie-steps { grid-template-columns:repeat(2,1fr); } }
@media (max-width:440px){ .reem-movie-steps { grid-template-columns:1fr; } }

@media (prefers-reduced-motion:reduce){
    .reem-act{ animation:none; } .reem-act1{ opacity:1; }
    .reem-act2,.reem-act3,.reem-act4{ opacity:0; }
    .reem-legA,.reem-legB,.reem-walk,.reem-load,.reem-rock,.reem-rock2,.reem-detach,.reem-hoist,.reem-arrive,.reem-assemble,.reem-progress span,.reem-mstep,.reem-mstep span{ animation:none!important; }
}

/* why — feature cards (light) */
.reem-home-why { background:linear-gradient(180deg,var(--bg),var(--bg-soft)); }
.reem-feat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:var(--s-5); }
.reem-feat {
    position:relative; overflow:hidden; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
    padding:var(--s-6) var(--s-5); box-shadow:var(--sh-1);
    transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.reem-feat::after {
    content:""; position:absolute; inset:0; border-radius:inherit; padding:1.5px; pointer-events:none; opacity:0;
    background:linear-gradient(135deg,var(--gold-400),var(--navy-500)); transition:opacity .3s;
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
}
.reem-feat:hover { transform:translateY(-7px); box-shadow:var(--sh-3); border-color:transparent; }
.reem-feat:hover::after { opacity:1; }
.reem-feat-ic {
    display:grid; place-items:center; width:62px; height:62px; border-radius:50%; margin-bottom:var(--s-4); color:var(--gold-600);
    background:radial-gradient(circle at 35% 30%, var(--gold-50), var(--gold-100));
    border:1px solid var(--gold-100); transition:transform .3s var(--ease), background .3s, color .3s;
}
.reem-feat-ic svg { width:30px; height:30px; }
.reem-feat:hover .reem-feat-ic { background:linear-gradient(135deg,var(--navy-700),var(--navy-900)); color:var(--gold-400); transform:scale(1.08); }
.reem-feat h3 { font-size:var(--fs-h3); margin-bottom:8px; }
.reem-feat p { color:var(--ink-soft); margin-bottom:0; font-size:15.5px; }

/* cities */
.reem-home-cities { background:var(--bg-soft); }

/* cta band — glass panel + floating blobs */
.reem-home-cta {
    position:relative; overflow:hidden; text-align:center; color:#fff;
    background:
        radial-gradient(600px 300px at 80% 0%, rgba(201,162,39,.25), transparent 60%),
        linear-gradient(135deg,var(--navy-900),var(--navy-600));
}
.reem-home-cta::before,.reem-home-cta::after {
    content:""; position:absolute; border-radius:50%; pointer-events:none; filter:blur(8px);
}
.reem-home-cta::before { width:240px; height:240px; inset-block-start:-80px; inset-inline-start:-60px; background:radial-gradient(circle,rgba(201,162,39,.3),transparent 70%); animation:reem-float 7s ease-in-out infinite; }
.reem-home-cta::after { width:200px; height:200px; inset-block-end:-70px; inset-inline-end:-40px; background:radial-gradient(circle,rgba(54,83,148,.5),transparent 70%); animation:reem-float 9s ease-in-out infinite 1s; }
.reem-home-cta .reem-container { position:relative; z-index:1; }
.reem-home-cta h2 { color:#fff; font-size:var(--fs-h2); margin-bottom:var(--s-3); }
.reem-home-cta p { color:rgba(255,255,255,.88); font-size:var(--fs-lead); margin-bottom:var(--s-6); }

/* ===================== 7. SINGLE / PAGE =============================== */
.reem-single { padding-block:var(--s-6) var(--s-9); }
.reem-breadcrumb { font-size:13.5px; color:var(--muted); margin-bottom:var(--s-5); display:flex; flex-wrap:wrap; align-items:center; gap:4px; }
.reem-breadcrumb a { color:var(--navy-600); font-weight:700; }
.reem-bc-sep { color:var(--gold-500); }
.reem-bc-current { color:var(--ink-soft); }

.reem-single-head {
    position:relative; overflow:hidden; text-align:center; color:#fff; border-radius:var(--r-lg);
    padding:var(--s-8) var(--s-6); margin-bottom:var(--s-7);
    background:
        radial-gradient(600px 300px at 85% -20%, rgba(201,162,39,.22), transparent 60%),
        linear-gradient(135deg,var(--navy-900),var(--navy-600));
}
.reem-single-title { color:#fff; font-size:var(--fs-h1); margin-bottom:var(--s-5); }
.reem-single-cta-row { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* cleaned post content */
.reem-entry { max-width:880px; margin-inline:auto; font-size:17.5px; color:var(--ink-soft); }
.reem-entry > :first-child { margin-top:0; }
.reem-entry h2 { font-size:var(--fs-h2); margin-top:1.8em; margin-bottom:.6em; color:var(--navy-800); }
.reem-entry h3 { font-size:var(--fs-h3); margin-top:1.5em; color:var(--navy-700); }
.reem-entry h4 { font-size:18px; color:var(--gold-600); margin-top:1.2em; }
.reem-entry p { margin:0 0 1.15em; }
.reem-entry strong { color:var(--navy-800); }
.reem-entry ul,.reem-entry ol { padding-inline-start:24px; margin:0 0 1.3em; }
.reem-entry li { margin-bottom:9px; }
.reem-entry ul li::marker { color:var(--gold-500); }
.reem-entry a:not(.reem-btn) { color:var(--gold-600); font-weight:700; text-decoration:underline; text-underline-offset:3px; text-decoration-color:rgba(201,162,39,.4); }
.reem-entry img { border-radius:var(--r-md); box-shadow:var(--sh-2); margin-inline:auto; }
.reem-entry figure,.reem-entry .wp-caption { max-width:100%!important; margin:var(--s-5) auto; text-align:center; }
.reem-entry .wp-caption-text,.reem-entry figcaption { font-size:13.5px; color:var(--muted); margin-top:10px; }
.reem-entry .reem-grid,.reem-entry .reem-flex { margin-block:var(--s-5); }

/* hero block living inside cleaned content */
.reem-entry .reem-hero {
    color:#fff; border-radius:var(--r-lg); padding:var(--s-7) var(--s-5); text-align:center; margin-bottom:var(--s-6);
    background:linear-gradient(135deg,var(--navy-900),var(--navy-600));
}
.reem-entry .reem-hero h2 { color:#fff; margin-top:0; }
.reem-entry .reem-hero p { color:rgba(255,255,255,.9); margin-bottom:0; }

/* cta block inside cleaned content */
.reem-entry .reem-cta {
    color:#fff; border-radius:var(--r-lg); padding:var(--s-8) var(--s-5); text-align:center; margin-block:var(--s-7);
    background:radial-gradient(600px 300px at 80% 0%, rgba(201,162,39,.25), transparent 60%),linear-gradient(135deg,var(--navy-900),var(--navy-600));
}
.reem-entry .reem-cta h2,.reem-entry .reem-cta h3 { color:#fff; }
.reem-entry .reem-cta p { color:rgba(255,255,255,.9); }
.reem-entry .reem-cta a[href^="tel:"] {
    display:inline-block; margin-top:var(--s-3); background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); color:#fff;
    font-weight:900; padding:16px 42px; border-radius:var(--r-pill); font-size:20px; box-shadow:var(--sh-gold);
}
.reem-entry .reem-cta a[href^="tel:"]:hover { transform:translateY(-3px); }
.reem-entry .reem-cta > div span { display:inline-block; margin:5px; background:rgba(255,255,255,.14); padding:7px 18px; border-radius:var(--r-pill); font-weight:700; font-size:var(--fs-sm); }
.reem-entry .reem-landing { box-shadow:none; background:transparent; }

/* related / city grid */
.reem-related { margin-top:var(--s-8); }
.reem-related-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px; }
.reem-related-item {
    position:relative; overflow:hidden; display:flex; align-items:center; gap:12px;
    background:var(--bg); border:1px solid var(--line); border-radius:var(--r-md); padding:15px 48px 15px 18px;
    font-weight:700; color:var(--navy-800); box-shadow:var(--sh-1);
    transition:transform .25s var(--ease), border-color .25s, box-shadow .25s, color .2s;
}
.reem-related-item::after {
    content:"\2039"; position:absolute; inset-inline-start:16px; top:50%; transform:translateY(-50%) translateX(8px);
    color:var(--gold-500); font-size:24px; font-weight:900; opacity:0; transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.reem-related-item:hover {
    transform:translateY(-5px); border-color:transparent; color:var(--navy-900);
    box-shadow:0 14px 30px rgba(201,162,39,.22), var(--sh-2);
}
.reem-related-item:hover::after { opacity:1; transform:translateY(-50%) translateX(0); }
.reem-related-ic {
    flex:0 0 40px; width:40px; height:40px; border-radius:11px; display:grid; place-items:center;
    background:radial-gradient(circle at 35% 30%, var(--gold-50), var(--gold-100)); font-size:18px;
    transition:background .25s var(--ease), transform .25s var(--ease);
}
.reem-related-item:hover .reem-related-ic { background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); transform:scale(1.08) rotate(-6deg); }
.reem-related-txt { font-size:14px; line-height:1.5; }

/* ============================ 8. ARCHIVE ============================== */
.reem-archive { padding-block:var(--s-7) var(--s-9); }
.reem-archive-head { text-align:center; margin-bottom:var(--s-7); }
.reem-archive-title { font-size:var(--fs-h1); }
.reem-pagination { margin-top:var(--s-7); text-align:center; }
.reem-pagination .page-numbers { display:inline-grid; place-items:center; min-width:42px; height:42px; padding:0 12px; margin:0 3px; border-radius:10px; background:#fff; border:1px solid var(--line); font-weight:700; }
.reem-pagination .page-numbers:hover { border-color:var(--gold-400); }
.reem-pagination .current { background:var(--navy-800); color:#fff; border-color:var(--navy-800); }

/* ============================ 9. FOOTER =============================== */
.reem-footer { background:var(--navy-900); color:#a9b6d1; margin-top:var(--s-9); }
.reem-footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:var(--s-7); padding-block:var(--s-8); }
.reem-foot-title { color:#fff; font-size:17px; margin-bottom:var(--s-4); position:relative; padding-bottom:12px; }
.reem-foot-title::after { content:""; position:absolute; bottom:0; inset-inline-start:0; width:42px; height:3px; background:var(--gold-500); border-radius:3px; }
.reem-foot-about { font-size:14.5px; line-height:1.85; }
.reem-foot-phone { display:inline-flex; align-items:center; gap:8px; margin-top:14px; color:var(--gold-400); font-weight:800; font-size:19px; }
.reem-foot-links { list-style:none; margin:0; padding:0; }
.reem-foot-links li { margin-bottom:10px; }
.reem-foot-links a { color:#a9b6d1; font-size:14px; transition:color .2s, padding .2s; }
.reem-foot-links a:hover { color:var(--gold-400); padding-inline-start:6px; }
.reem-copy { border-top:1px solid rgba(255,255,255,.08); padding-block:18px; font-size:13px; text-align:center; color:#7e8cab; }

/* ====================== 10. FLOATING ACTIONS ========================= */
.reem-float { position:fixed; inset-inline-start:18px; inset-block-end:18px; z-index:90; display:flex; flex-direction:column; gap:12px; }
.reem-float-btn {
    display:flex; align-items:center; gap:9px; color:#fff; font-weight:800; font-size:15px;
    padding:13px 20px; border-radius:var(--r-pill); box-shadow:var(--sh-3);
    transition:transform .2s var(--ease);
}
.reem-float-btn:hover { color:#fff; transform:translateY(-3px) scale(1.03); }
.reem-float-call { background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); }
.reem-float-wa { background:linear-gradient(135deg,#2bd06f,#1fa855); }
.reem-float-ic { font-size:18px; }
.reem-float-call { animation:reem-pulse 2.6s infinite; }
@keyframes reem-pulse { 0%,100%{ box-shadow:var(--sh-3); } 50%{ box-shadow:0 0 0 12px rgba(201,162,39,.0), var(--sh-3); } }

/* ==================== 11. UTILITIES & ANIM =========================== */
.reem-reveal { opacity:0; transform:translateY(22px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reem-reveal.is-in { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reem-reveal{opacity:1;transform:none;transition:none;} .reem-float-call{animation:none;} html{scroll-behavior:auto;} }

/* ========================= 12. RESPONSIVE ============================= */
@media (max-width:1024px){
    .reem-process-track { grid-template-columns:repeat(2,1fr); }
    .reem-stage:not(:last-child)::after { display:none; }
}
@media (max-width:540px){
    .reem-process-track { grid-template-columns:1fr; }
}
@media (max-width:980px){
    .reem-hero-grid { grid-template-columns:1fr; gap:var(--s-8); }
    .reem-home-hero-in { max-width:none; }
    .reem-hero-visual { max-width:380px; order:2; }
}
@media (max-width:520px){
    .reem-hero-visual { max-width:300px; }
    .reem-hero-seal { width:84px; height:84px; }
    .reem-seal-num { font-size:21px; }
    .reem-chip-cities { inset-inline-end:-2%; }
    .reem-chip-rating { inset-inline-end:-2%; }
}
@media (max-width:1024px){
    .reem-stats-grid { grid-template-columns:repeat(2,1fr); gap:var(--s-6) var(--s-5); }
    .reem-stat:nth-child(3) { border-inline-start:0; }
    .reem-footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:768px){
    .reem-nav-toggle { display:flex; }
    .reem-header-cta { display:none; }
    .reem-nav {
        position:absolute; top:100%; inset-inline:0; background:#fff; border-top:1px solid var(--line);
        box-shadow:var(--sh-3); padding:12px; max-height:0; overflow:hidden; opacity:0;
        transition:max-height .3s var(--ease), opacity .3s var(--ease), padding .3s;
    }
    .reem-nav.is-open { max-height:80vh; overflow:auto; opacity:1; }
    .reem-menu { flex-direction:column; align-items:stretch; }
    .reem-menu a { padding:13px 14px; }
    .reem-menu .sub-menu { position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0; border-inline-start:2px solid var(--line); border-radius:0; padding-inline-start:14px; margin-top:2px; }
    .reem-single-head { padding:var(--s-6) var(--s-4); }
    .reem-float-txt { display:none; }
    .reem-float-btn { padding:14px; }
    .reem-stat-label { font-size:13px; }
}
@media (max-width:520px){
    .reem-container { padding-inline:18px; }
    .reem-footer-grid { grid-template-columns:1fr; gap:var(--s-6); }
    .reem-stats-grid { grid-template-columns:1fr 1fr; }
    body { font-size:16px; }
    .reem-home-hero-cta .reem-btn { flex:1 1 100%; }
}