/* CMS and developer projects. Brand tokens (--brand, --brand-soft) come from site.css. */

/* Article typography for sanitized editor HTML */
.cms-body { font-size: 1rem; line-height: 1.75; color: #1c2633; overflow-wrap: anywhere; }
.cms-body h2 { font-size: 1.4rem; margin: 2rem 0 .75rem; }
.cms-body h3 { font-size: 1.2rem; margin: 1.5rem 0 .5rem; }
.cms-body h4, .cms-body h5, .cms-body h6 { font-size: 1rem; margin: 1.25rem 0 .5rem; }
.cms-body p { margin-bottom: 1rem; }
.cms-body img { max-width: 100%; height: auto; border-radius: .75rem; }
.cms-body figure { margin: 1.5rem 0; }
.cms-body figcaption { font-size: .85rem; color: var(--tblr-secondary); text-align: center; margin-top: .5rem; }
.cms-body blockquote { border-left: 4px solid var(--brand, #1d5ab9); background: var(--brand-soft, #e8f0fb); padding: .75rem 1.25rem; border-radius: 0 .5rem .5rem 0; margin: 1.5rem 0; }
.cms-body table { width: 100%; margin: 1rem 0; border-collapse: collapse; }
.cms-body th, .cms-body td { border: 1px solid #e3e8ef; padding: .5rem .75rem; }
.cms-body th { background: #f4f6f9; }
.cms-body pre { background: #0b2240; color: #e8eef6; padding: 1rem; border-radius: .5rem; overflow: auto; }
.cms-body a { text-decoration: underline; text-underline-offset: 2px; }
.cms-body ul, .cms-body ol { padding-left: 1.4rem; margin-bottom: 1rem; }
.cms-urdu { font-size: 1.1rem; line-height: 2.1; }

/* Page and article headers */
.cms-hero {
  position: relative; overflow: hidden; border-radius: 1rem; color: #fff; padding: 2.5rem 2rem;
  background:
    radial-gradient(900px 300px at 90% -30%, rgba(255, 255, 255, .18), transparent 60%),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .04) 0 2px, transparent 2px 14px),
    linear-gradient(100deg, #0b2240 0%, #12325c 50%, #1d5ab9 100%);
}
.cms-hero h1 { color: #fff; font-weight: 700; margin: 0; letter-spacing: -.02em; }
.cms-hero .lead, .cms-hero .cms-meta { color: rgba(255, 255, 255, .85); }
.cms-hero .breadcrumb a, .cms-hero .breadcrumb-item, .cms-hero .breadcrumb-item::before { color: rgba(255, 255, 255, .8); }
.cms-hero.has-image { background-size: cover; background-position: center; min-height: 320px; display: flex; align-items: flex-end; }
.cms-hero.has-image::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 34, 64, .1) 0%, rgba(11, 34, 64, .8) 100%); }
.cms-hero > * { position: relative; }
.cms-meta { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .875rem; }
.cms-meta i { margin-right: .25rem; }
.cms-preview-bar { position: sticky; top: 0; z-index: 1030; }

/* Cards */
.cms-card { transition: box-shadow .15s ease, transform .15s ease; overflow: hidden; }
.cms-card:hover { box-shadow: 0 .5rem 1.5rem rgba(11, 34, 64, .12); transform: translateY(-2px); }
.cms-thumb {
  position: relative; height: 190px; overflow: hidden;
  background: repeating-linear-gradient(45deg, var(--brand-soft, #e8f0fb), var(--brand-soft, #e8f0fb) 12px, #d9e5f6 12px, #d9e5f6 24px);
}
.cms-thumb img { width: 100%; height: 100%; object-fit: cover; }
.cms-thumb .cms-thumb-icon { height: 100%; display: flex; align-items: center; justify-content: center; color: var(--brand, #1d5ab9); opacity: .45; font-size: 2.5rem; }
.cms-thumb .badge { position: absolute; top: .75rem; left: .75rem; }
.cms-tag { background: var(--brand-soft, #e8f0fb); color: var(--brand-dark, #164a99); border-radius: 999px; padding: .15rem .6rem; font-size: .75rem; text-decoration: none; display: inline-block; }
.cms-tag:hover { background: #d2def1; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Projects */
.project-price { color: var(--brand, #1d5ab9); font-weight: 700; }
.project-gallery { background: #0b2240; border-radius: 1rem; overflow: hidden; }
.project-gallery .carousel-item img { height: 460px; width: 100%; object-fit: cover; }
.project-gallery .carousel-caption { background: rgba(0, 0, 0, .45); border-radius: .5rem; padding: .35rem .75rem; left: 1rem; right: auto; bottom: 1rem; }
.project-gallery-empty { height: 320px; display: grid; place-items: center; color: rgba(255, 255, 255, .6); }
.project-thumbs img { width: 96px; height: 68px; object-fit: cover; border-radius: .5rem; opacity: .8; }
.project-thumbs img:hover { opacity: 1; }
.fact-tile { border: 1px solid #e3e8ef; border-radius: .75rem; padding: .9rem; height: 100%; background: #fff; }
.fact-tile .ti { font-size: 1.5rem; color: var(--brand, #1d5ab9); }
.fact-tile .k { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--tblr-secondary); margin-top: .35rem; }
.fact-tile .v { font-weight: 600; }
.amenity-chip { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid #d8dee6; background: #fff; border-radius: 999px; padding: .3rem .75rem; font-size: .85rem; margin: 0 .35rem .5rem 0; }
.amenity-chip .ti { color: var(--brand, #1d5ab9); }
.availability-bar { height: 6px; border-radius: 999px; background: #e3e9f1; overflow: hidden; min-width: 80px; }
.availability-bar > span { display: block; height: 100%; background: var(--brand, #1d5ab9); }
.enquiry-card { top: 1rem; }

/* Admin editor */
.cms-editor-toolbar { display: flex; flex-wrap: wrap; gap: .25rem; padding: .35rem; border: 1px solid var(--tblr-border-color); border-bottom: 0; border-radius: .5rem .5rem 0 0; background: #f6f8fb; }
.cms-editor-toolbar .btn { padding: .2rem .5rem; }
.cms-editor-toolbar + textarea { border-top-left-radius: 0; border-top-right-radius: 0; font-family: var(--tblr-font-monospace); font-size: .85rem; }
.version-body { max-height: 480px; overflow: auto; border: 1px solid #edf0f4; border-radius: .5rem; padding: 1rem; }
