/* Cluster pages (/clusters/<slug>/ and /ar/clusters/<slug>/). Loaded after /css/lite.css (tokens, Amiri + Noto Naskh). */
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/hanken-grotesk-normal-latin.woff2) format('woff2')}
.cl-page{--line:rgba(240,168,81,.18)}
.cl-page:not(.lite--ar) :is(h1,h2,h3){font-family:'Gloock',"Times New Roman",serif;font-weight:400;letter-spacing:-.01em}
.cl-nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:12px clamp(16px,4vw,40px);background:rgba(26,33,48,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.cl-nav .brand{margin-inline-end:auto}.cl-nav .lang{min-height:44px;display:inline-flex;align-items:center}
.cl-nav .btn{min-height:44px}
.cl-crumbs{font-size:14px;color:var(--muted);margin:28px 0 0}.cl-crumbs a{color:var(--muted);display:inline-flex;min-height:44px;align-items:center}.cl-crumbs a:hover{color:var(--lantern-2)}
.cl-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,5vw,64px);align-items:center;padding:12px 0 clamp(40px,7vw,80px)}
.cl-hero h1{font-size:clamp(38px,6vw,72px);line-height:1.05;margin:.2em 0 .35em}.lite--ar .cl-hero h1{line-height:1.35}
.cl-hero__img{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#efe8dc}
.cl-hero__img img{width:100%;height:auto}
.cl-hero__img figcaption{background:var(--night);color:var(--muted);font-size:13px;padding:8px 14px}
.cl-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:1.6rem 0 0;padding:0}
.cl-facts div{border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.cl-facts dt{color:var(--muted);font-size:13px;letter-spacing:.06em;text-transform:uppercase}.lite--ar .cl-facts dt{text-transform:none;letter-spacing:0;font-size:14px}
.cl-facts dd{margin:.25em 0 0;font-size:18px;color:var(--text)}
.cl-sec{padding:clamp(48px,7vw,88px) 0;border-top:1px solid var(--line)}
.cl-sec h2{margin-bottom:.4em}.cl-sec>.wrap>p.muted{max-width:44em}
.cl-types{list-style:none;padding:0;margin:1.6rem 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.cl-type{background:var(--night);border:1px solid rgba(236,229,216,.1);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.cl-type__img{display:block;background:#efe8dc;aspect-ratio:4/3;padding:10px;overflow:hidden}
.cl-type__img img{width:100%;height:100%;object-fit:contain}
.cl-type__b{padding:14px 16px 16px;display:grid;gap:4px}
.cl-type__t{font-size:17px;line-height:1.35;margin:0;color:var(--text)}
.cl-type__s{margin:0;color:var(--lantern-2);font-size:16px}.cl-type__m{margin:0;color:var(--muted);font-size:14px}
.cl-type__fl{display:flex;flex-wrap:wrap;gap:4px 14px;margin:4px 0 0;padding:0;list-style:none}
.cl-type__fl a{display:inline-flex;align-items:center;min-height:44px;font-size:15px}
.cl-site{margin:1.6rem 0 0;border-radius:16px;overflow:hidden;background:#efe8dc;border:1px solid var(--line);max-width:980px}
.cl-site figcaption{background:var(--night);color:var(--muted);font-size:14px;padding:10px 16px}
.cl-legend{list-style:none;padding:0;margin:1rem 0 0;display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--muted);font-size:15px}
.cl-photos{list-style:none;padding:0;margin:1.6rem 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.cl-photos img{border-radius:14px;width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--night)}
.cl-list .lgrid{margin-top:1.6rem}.cl-list .lcard img{aspect-ratio:720/490;object-fit:cover;width:100%}
.cl-list .lcard__t{font-size:15px;color:var(--muted)}
.cl-cta{background:radial-gradient(90% 80% at 100% 0,rgba(240,168,81,.12),transparent 60%),var(--night);border:1px solid var(--line);border-radius:20px;padding:clamp(24px,4vw,44px);margin-top:1rem}
.cl-cta h2{margin-top:0}
.cl-others{list-style:none;padding:0;margin:1.2rem 0 0;display:flex;flex-wrap:wrap;gap:10px}
.cl-others a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid rgba(236,229,216,.2);border-radius:999px;text-decoration:none;color:var(--text)}
.cl-others a:hover,.cl-others a[aria-current]{border-color:var(--lantern);color:var(--lantern-2)}
.cl-src{font-size:14px;color:var(--muted);margin-top:1.4rem}
.cl-page .lfoot{padding-bottom:40px}
@media (max-width:820px){.cl-hero{grid-template-columns:1fr}.cl-nav .btn--ghost{display:none}.cl-page .lfoot{padding-bottom:110px}}
@media (max-width:480px){.cl-nav .brand__text{display:none}}
/* home page: links from the clusters section to the cluster pages */
.fx-guides{margin:22px 0 0;font-size:15px;color:var(--muted,#b3ab9e);line-height:2}
.fx-guides a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--lantern-2,#ffcf8f)}
.cl-faq{display:grid;gap:10px;max-width:880px;margin-top:1.2rem}
.cl-faq details{border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}
.cl-faq summary{cursor:pointer;min-height:48px;display:flex;align-items:center;padding:10px 18px;font-weight:600;color:var(--text)}
.cl-faq details[open] summary{color:var(--lantern-2)}
.cl-faq p{margin:0;padding:0 18px 16px;color:#d9d1c3}
.cl-band{margin:1rem 0 0;padding:12px 16px;border-inline-start:3px solid var(--lantern);background:rgba(240,168,81,.07);border-radius:8px;max-width:44em}
.cl-hub h3{margin:0 0 .3em}.cl-hub h3 a{color:var(--text);text-decoration:none;display:inline-flex;min-height:44px;align-items:center}.cl-hub h3 a:hover{color:var(--lantern-2)}
.cl-hub .muted{margin:0;font-size:15px}
.cl-nav .brand{min-height:44px;min-width:44px}.cl-page .lcard__a .text-link{display:inline-flex;align-items:center;min-height:44px}
/* master plan + floor plans quick links in the cluster hero (every cluster page, EN + AR) */
.cl-jump{display:flex;flex-wrap:wrap;gap:10px;margin:1rem 0 0}
.cl-jump a{display:inline-flex;align-items:center;min-height:40px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;color:var(--lantern-2);font-size:15px;text-decoration:none}
.cl-jump a:hover{border-color:var(--lantern-2)}

/* 15 Oct 2026: photo-led listing cards (EN + AR, mirrored by dir) */
.cl-list .lgrid--big{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
.lgrid--big .lcard__media{display:block;overflow:hidden;background:var(--ink,#141824)}
.cl-list .lgrid--big .lcard img{display:block;width:100%;aspect-ratio:720/490;object-fit:cover;transform:scale(1);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
@media (hover:hover) and (pointer:fine){.lgrid--big .lcard:hover img{transform:scale(1.045)}}
.lgrid--big .lcard__h{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin:0 0 6px!important}
.lgrid--big .lcard__n{font-size:clamp(20px,1.8vw,26px);line-height:1.25}
.lgrid--big .lcard__price{font-size:clamp(16px,1.4vw,20px);white-space:nowrap}
@media (max-width:759px){.cl-list .lgrid--big{grid-template-columns:1fr}.cl-list .lgrid--big .lcard img{aspect-ratio:4/3}}
@media (prefers-reduced-motion:reduce){.lgrid--big .lcard img{transition:none}}

/* 16 Oct 2026 phone test: 44px-wide crumb links and short cluster links */
.cl-crumbs a,.fx-guides a{min-width:44px;justify-content:center}
.lcard__a .btn{min-height:44px}
