/*
Theme Name: Mustaqbal Riyadh Home Services
Theme URI: https://example.com/
Author: Future Riyadh Brand Update
Author URI: https://example.com/
Description: قالب ووردبريس عربي محدث لشركة مستقبل الرياض لخدمات المنازل، يشمل خدمات العزل والكشف والتنظيف والترميم ومناطق الخدمة.
Version: 2.7.1
Text Domain: motrafic-v2
*/

@import url("./styles.css");

.articles-page { padding: 140px 0 80px; background: var(--bg); }
.articles-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; align-items: stretch; }
.article-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; min-height: 100%; }
.article-body { padding: 18px; text-align: center; }
.article-title { font-size: 1.2rem; color: var(--primary); margin-bottom: 8px; }
.article-excerpt { color: var(--text-muted); }

.custom-logo-link { display: inline-flex; align-items: center; }
.custom-logo { max-height: 54px; width: auto; }

.page-numbers { display: inline-flex; gap: 8px; list-style: none; padding: 0; }
.page-numbers li a, .page-numbers li span {
    display: inline-flex; min-width: 38px; height: 38px; align-items: center; justify-content: center;
    border-radius: 10px; background: #fff; border: 1px solid #e2e8f0; color: var(--primary); padding: 0 10px;
}
.page-numbers .current { background: var(--accent); color: #fff; border-color: var(--accent); }

.single-article { max-width: 950px; margin: 0 auto; background: #fff; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg); }
.single-cover img { width: 100%; max-height: 460px; object-fit: cover; }
.single-body { padding: 30px; }
.single-meta { display: flex; flex-wrap: wrap; gap: 14px; color: var(--text-muted); font-size: .95rem; margin-bottom: 14px; }
.single-title { font-size: clamp(1.8rem, 3vw, 2.5rem); color: var(--primary); margin-bottom: 16px; line-height: 1.4; }
.single-content { color: #334155; line-height: 2; font-size: 1.05rem; }
.single-content p, .single-content ul, .single-content ol, .single-content h2, .single-content h3 { margin-bottom: 14px; }
.single-content img { border-radius: 12px; margin: 18px auto; }
.single-tags { margin-top: 20px; color: var(--text-muted); }
.single-share { margin-top: 20px; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.single-nav { max-width: 950px; margin: 16px auto 0; display: flex; justify-content: space-between; gap: 12px; }
.single-nav a { display: inline-flex; padding: 10px 16px; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; color: var(--primary); }
.single-related { max-width: 950px; margin: 30px auto 0; }
.single-related h3 { margin-bottom: 16px; color: var(--primary); }

.reading-progress {
    position: fixed; top: 0; right: 0; width: 0; height: 4px;
    background: linear-gradient(90deg,var(--accent),var(--accent-dark)); z-index: 2000;
}

/* ===== Cards Tuning ===== */
.service-card,
.gallery-item,
.article-card,
.testimonial-card {
    border-radius: 14px !important;
    overflow: hidden !important;
    border: 1px solid #e7edf5 !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08) !important;
}

.service-card:hover,
.gallery-item:hover,
.article-card:hover,
.testimonial-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.14) !important;
}

.services-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
}

.service-img-wrapper {
    height: 210px !important;
    background: #f1f5f9 !important;
}

.service-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

.service-content {
    padding: 14px 16px !important;
}

.service-title {
    font-size: 20px !important;
    line-height: 1.35 !important;
    margin-bottom: 8px !important;
}

.service-desc {
    font-size: 13px !important;
    line-height: 1.65 !important;
    margin-bottom: 0 !important;
}

.gallery-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    grid-auto-flow: row !important;
}

.gallery-item {
    height: 280px !important;
}

.gallery-item:nth-child(2),
.gallery-item:nth-child(5) {
    grid-row: auto !important;
    height: 280px !important;
}

.gallery-item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

.article-card img {
    width: 100%;
    height: 210px;
    object-fit: cover;
}

@media (max-width: 992px) {
    .services-grid,
    .gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    .services-grid,
    .gallery-grid {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .service-img-wrapper {
        height: 190px !important;
    }

    .gallery-item {
        height: 240px !important;
    }

    .service-title {
        font-size: 18px !important;
    }
}

/* ===== SEO / archive template improvements ===== */
.article-card img,
.article-image-link img {
    width: 100%;
    height: 210px;
    object-fit: cover;
    display: block;
}
.article-image-link { display: block; }
.article-meta { color: var(--text-muted); font-size: .9rem; margin-bottom: 8px; }
.article-readmore {
    display: inline-flex;
    margin-top: 12px;
    color: var(--accent);
    font-weight: 700;
}
.article-title a,
.service-title a { color: inherit; }
.pagination-wrap { text-align: center; margin-top: 32px; }
.nav-links .menu-item { list-style: none; }
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 8px; }
.footer-links a { color: inherit; }
.motrafic-breadcrumbs { margin-bottom: 20px; font-size: .95rem; color: var(--text-muted); }
.search-page-form,
.not-found-actions { margin: 24px auto; max-width: 760px; text-align: center; }
.not-found-actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.search-page-form form { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.search-page-form input[type="search"],
.search-page-form input[type="text"] {
    min-width: min(420px, 100%);
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 14px;
}
.search-page-form input[type="submit"],
.search-page-form button[type="submit"] {
    border: 0;
    border-radius: 10px;
    padding: 12px 18px;
    background: var(--accent);
    color: #fff;
    cursor: pointer;
}

/* ===== Custom post type templates: services and projects ===== */
.service-detail-page,
.service-archive-page,
.project-detail-page,
.project-archive-page {
    padding: 110px 0 70px;
    background: #f8fafc;
}

.service-detail,
.project-detail {
    display: block;
}

.service-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
    gap: 28px;
    align-items: center;
    background: #fff;
    border: 1px solid #e7edf5;
    border-radius: 20px;
    padding: 28px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
    margin-bottom: 28px;
}

.service-detail-copy .single-title {
    margin: 12px 0 14px;
}

.service-lead {
    color: var(--text-muted);
    font-size: 1.05rem;
    line-height: 1.9;
    margin-bottom: 22px;
}

.service-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
}

.service-actions-center {
    justify-content: center;
}

.btn-whatsapp {
    background: #25d366;
    color: #fff !important;
    border: 1px solid #25d366;
}

.service-detail-image img,
.project-hero img {
    width: 100%;
    height: 360px;
    object-fit: cover;
    border-radius: 16px;
    display: block;
}

.service-content-main,
.project-content-main {
    background: #fff;
    border: 1px solid #e7edf5;
    border-radius: 18px;
    padding: 28px;
    margin-bottom: 28px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.service-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 28px;
}

.service-feature-card,
.service-steps,
.service-cta-box {
    background: #fff;
    border: 1px solid #e7edf5;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.service-feature-card i {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(0, 100, 80, .08);
    color: var(--accent);
    font-size: 1.25rem;
    margin-bottom: 12px;
}

.service-feature-card h2,
.service-steps h2,
.service-cta-box h2,
.service-related h2 {
    font-size: 1.35rem;
    margin-bottom: 10px;
}

.service-feature-card p,
.service-cta-box p,
.service-steps li {
    color: var(--text-muted);
    line-height: 1.8;
}

.service-steps {
    margin-bottom: 28px;
}

.service-steps ol {
    margin: 0;
    padding-right: 22px;
}

.service-cta-box {
    text-align: center;
    margin-bottom: 34px;
}

.archive-cta-box {
    margin-top: 36px;
}

.service-img-wrapper {
    display: block;
}

.project-hero {
    position: relative;
    background: #fff;
    border: 1px solid #e7edf5;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 28px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}

.project-hero img {
    border-radius: 0;
    height: 430px;
}

.project-hero-title {
    position: absolute;
    right: 24px;
    left: 24px;
    bottom: 24px;
    background: rgba(255, 255, 255, .94);
    border-radius: 16px;
    padding: 20px;
}

.project-archive-grid .gallery-item {
    height: 310px !important;
}

@media (max-width: 992px) {
    .service-detail-hero,
    .service-feature-grid {
        grid-template-columns: 1fr;
    }

    .service-detail-image img,
    .project-hero img {
        height: 280px;
    }
}

@media (max-width: 768px) {
    .service-detail-page,
    .service-archive-page,
    .project-detail-page,
    .project-archive-page {
        padding-top: 90px;
    }

    .service-detail-hero,
    .service-content-main,
    .project-content-main,
    .service-feature-card,
    .service-steps,
    .service-cta-box {
        padding: 18px;
    }

    .project-hero-title {
        position: static;
        margin: 0;
        border-radius: 0;
    }
}


/* ===== Mustaqbal Riyadh brand update ===== */
body { font-family: 'Noto Sans Arabic','Tajawal',sans-serif; }
.logo-text, .section-title, .hero h1, .service-title, .feature-card h3 { font-family: 'Noto Kufi Arabic','Noto Sans Arabic',sans-serif; }
.logo { font-size: 1.18rem; }
.logo-text span { letter-spacing: 0; }
.logo-icon { background: linear-gradient(135deg, var(--primary), var(--accent)); }
.hero { background: linear-gradient(160deg,#073D32 0%,#0E5A46 52%,#1E2A32 100%); }
.hero-overlay { opacity: .10; mix-blend-mode: soft-light; }
.static-service-card .service-content { min-height: 210px; display: flex; flex-direction: column; align-items: flex-start; text-align: right; }
.static-service-card .service-icon-wrap { margin-bottom: 14px; }
.areas-section { padding: 90px 0; background: #fff; }
.areas-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 14px; }
.area-pill { display:flex; align-items:center; justify-content:center; gap:8px; padding: 15px 18px; border-radius: 16px; background: #F7F5EF; border: 1px solid rgba(14,90,70,.12); color: var(--primary); font-weight: 800; box-shadow: 0 8px 22px rgba(14,90,70,.08); }
.area-pill i { color: var(--accent); }
.blog-preview-section { background: #F7F5EF; }
.cta-section { background: linear-gradient(135deg,var(--primary),#0B6B53); }
.footer-logo { font-size: 1.15rem; }
@media(max-width:768px){ .logo{font-size:1rem}.services-grid{grid-template-columns:1fr!important}.areas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.static-service-card .service-content{min-height:auto} }


/* ===== Mustaqbal Riyadh hotfix: prevent old mega menus and broken images ===== */
.logo .custom-logo-link,
.logo img.custom-logo { display: none !important; }
.navbar .nav-links,
.navbar .nav-links ul,
.footer-links { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.navbar .nav-links .sub-menu,
.navbar .nav-links .children { display: none !important; }
.navbar .nav-links > li { display: inline-flex !important; align-items: center !important; }
.article-card img,
.service-img,
.single-cover img,
.service-detail-image img,
.project-hero img {
    background: linear-gradient(135deg, #0E5A46 0%, #1E2A32 62%, #C7A25A 100%);
}
.article-card img.is-fallback-image,
.service-img.is-fallback-image,
.single-cover img.is-fallback-image,
.service-detail-image img.is-fallback-image,
.project-hero img.is-fallback-image {
    object-fit: cover !important;
}
@media (max-width: 992px) {
    .nav-container { gap: 10px; }
    .nav-links { gap: 16px; }
    .nav-link { font-size: .95rem; }
}


/* ===== 2026-06-02 Enhancement: centered services, professional icons, reviews, logo ===== */
.logo { gap: 12px !important; align-items: center !important; min-width: 260px; }
.logo-emblem { width: 56px; height: 56px; display: inline-grid; place-items: center; flex: 0 0 56px; filter: drop-shadow(0 10px 18px rgba(7,61,50,.18)); }
.logo-emblem img { width: 100%; height: 100%; display: block; }
.logo-text { line-height: 1.25 !important; color: var(--primary) !important; font-weight: 900 !important; }
.logo-text span { margin-top: 4px; color: var(--accent) !important; font-size: .72rem !important; font-weight: 700 !important; }
.footer-logo { align-items: center !important; gap: 12px !important; }
.footer-logo .footer-logo-emblem { width: 42px; height: 42px; display: inline-grid; place-items: center; }
.footer-logo .footer-logo-emblem img { width: 100%; height: 100%; display: block; }
.footer-logo i { display: none !important; }

.services .section-header { margin-bottom: 42px !important; }
.services-grid-static { align-items: stretch !important; }
.static-service-card { position: relative !important; overflow: hidden !important; background: linear-gradient(180deg,#ffffff 0%,#fbfcfa 100%) !important; border: 1px solid rgba(14,90,70,.12) !important; min-height: 225px !important; }
.static-service-card::before { content: ''; position: absolute; inset-inline: 28px; top: 0; height: 4px; border-radius: 0 0 16px 16px; background: linear-gradient(90deg,var(--primary),var(--accent)); opacity: 0; transform: scaleX(.35); transition: .35s ease; }
.static-service-card:hover::before { opacity: 1; transform: scaleX(1); }
.static-service-card .service-content,
.service-card .service-content { min-height: 225px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; padding: 30px 24px !important; }
.static-service-card .service-icon-wrap,
.service-card .service-icon-wrap { width: 72px !important; height: 72px !important; margin: 0 auto 18px !important; border-radius: 22px !important; color: #fff !important; font-size: 1.55rem !important; background: linear-gradient(145deg,#0E5A46 0%,#073D32 56%,#C7A25A 100%) !important; box-shadow: 0 16px 34px rgba(14,90,70,.18), inset 0 1px 0 rgba(255,255,255,.24) !important; position: relative !important; }
.static-service-card .service-icon-wrap::after,
.service-card .service-icon-wrap::after { content:''; position:absolute; inset: 8px; border:1px solid rgba(255,255,255,.24); border-radius: 17px; pointer-events:none; }
.static-service-card .service-icon-wrap i,
.service-card .service-icon-wrap i { transform: translateY(0); filter: drop-shadow(0 4px 5px rgba(0,0,0,.18)); }
.static-service-card .service-title,
.service-card .service-title { width: 100%; margin: 0 0 10px !important; color: #075443 !important; font-size: 22px !important; font-weight: 900 !important; text-align: center !important; }
.static-service-card .service-desc,
.service-card .service-desc { max-width: 315px; margin: 0 auto !important; color: #667085 !important; font-size: 14px !important; line-height: 1.9 !important; text-align: center !important; }
.static-service-card:hover .service-icon-wrap { transform: translateY(-4px) scale(1.04); }

.customer-reviews { padding: 96px 0; background: radial-gradient(circle at 12% 8%,rgba(199,162,90,.18),transparent 28%), linear-gradient(180deg,#F7F5EF 0%,#fff 100%); position: relative; overflow: hidden; }
.customer-reviews::before { content:''; position:absolute; width:420px; height:420px; border-radius:50%; background:rgba(14,90,70,.06); right:-180px; top:40px; }
.reviews-summary { display:grid; grid-template-columns: 1.05fr 2fr; gap: 26px; align-items: stretch; position: relative; z-index: 1; }
.rating-panel { background: linear-gradient(145deg,#073D32,#0E5A46); color:#fff; border-radius: 28px; padding: 34px 28px; box-shadow: 0 20px 50px rgba(7,61,50,.18); display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; min-height: 280px; }
.rating-number { font-size: 4rem; line-height: 1; font-weight: 900; color:#fff; letter-spacing:-1px; }
.rating-stars { display:flex; gap:5px; justify-content:center; color:#F5C76A; font-size:1.25rem; margin: 16px 0 10px; }
.rating-panel h3 { color:#fff; font-size:1.35rem; margin:0 0 8px; }
.rating-panel p { color:rgba(255,255,255,.75); margin:0; line-height:1.8; }
.reviews-grid { display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.review-card { position:relative; background:#fff; border:1px solid rgba(14,90,70,.12); border-radius:24px; padding:26px 22px; box-shadow: 0 12px 30px rgba(15,23,42,.08); transition:.35s ease; overflow:hidden; }
.review-card::before { content:'\f10e'; font-family:'Font Awesome 6 Free'; font-weight:900; position:absolute; left:18px; top:16px; color:rgba(199,162,90,.12); font-size:3.4rem; line-height:1; }
.review-card:hover { transform: translateY(-7px); box-shadow:0 20px 44px rgba(14,90,70,.14); border-color:rgba(199,162,90,.45); }
.review-top { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.review-avatar { width:52px; height:52px; border-radius:18px; background:linear-gradient(135deg,var(--primary),var(--accent)); color:#fff; display:grid; place-items:center; font-weight:900; font-size:1.25rem; box-shadow:0 10px 22px rgba(14,90,70,.18); }
.review-client h4 { color:#073D32; font-size:1.05rem; margin:0 0 3px; }
.review-client span { color:#8A6A2D; font-size:.86rem; font-weight:700; }
.review-stars { color:#F2B94B; font-size:.92rem; margin-bottom:12px; }
.review-card p { color:#475467; line-height:1.9; font-size:.95rem; margin:0; }
.reviews-badges { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top: 24px; position:relative; z-index:1; }
.review-badge { display:inline-flex; align-items:center; gap:8px; border-radius:999px; background:#fff; color:#075443; border:1px solid rgba(14,90,70,.12); padding:10px 16px; font-weight:800; box-shadow:0 8px 22px rgba(15,23,42,.06); }
.review-badge i { color:var(--accent); }

@media (max-width: 992px) {
    .reviews-summary { grid-template-columns: 1fr; }
    .reviews-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .logo { min-width: auto; }
}
@media (max-width: 768px) {
    .logo-emblem { width:46px; height:46px; flex-basis:46px; }
    .reviews-grid { grid-template-columns: 1fr; }
    .customer-reviews { padding:64px 0; }
    .static-service-card .service-content, .service-card .service-content { min-height: auto !important; padding: 26px 20px !important; }
}

/* ===== 2026-06-02 Hotfix: reliable SVG floating icons + redesigned logo ===== */
.logo {
    min-width: 310px !important;
    padding: 7px 10px 7px 14px !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,.72) !important;
    border: 1px solid rgba(14,90,70,.10) !important;
    box-shadow: 0 8px 26px rgba(7,61,50,.08) !important;
}
.logo:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(7,61,50,.13) !important; }
.logo-emblem { width: 62px !important; height: 62px !important; flex: 0 0 62px !important; filter: drop-shadow(0 12px 18px rgba(7,61,50,.20)) !important; }
.logo-text { font-size: 1.04rem !important; white-space: normal !important; max-width: 220px !important; }
.logo-text span { display:block !important; font-size: .70rem !important; color:#9A7129 !important; }
.footer-logo-emblem { filter: drop-shadow(0 8px 14px rgba(7,61,50,.22)); }

.motrafic-svg-icon,
.nav-cta-icon,
.footer-contact-icon,
.float-icon-svg,
.backtop-icon-svg {
    width: 1.15em;
    height: 1.15em;
    display: inline-block;
    vertical-align: -0.18em;
    flex: 0 0 auto;
}
.nav-cta { gap: 8px !important; }
.nav-cta-icon { font-size: 18px; color: currentColor; }
.footer-contact-icon { color: var(--accent); font-size: 18px; margin-inline-end: 8px; }
.footer-contact li { display: flex; align-items: flex-start; gap: 8px; }

.floating-actions {
    right: 24px !important;
    bottom: 28px !important;
    gap: 16px !important;
    z-index: 9999 !important;
}
.float-btn {
    width: 66px !important;
    height: 66px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 30px !important;
    line-height: 1 !important;
    isolation: isolate !important;
    border: 5px solid rgba(255,255,255,.78) !important;
    box-shadow: 0 18px 38px rgba(15,23,42,.18), 0 0 0 1px rgba(14,90,70,.08) !important;
    overflow: visible !important;
}
.float-whatsapp { background: linear-gradient(145deg,#23D366 0%,#12A767 55%,#087D61 100%) !important; }
.float-call { background: linear-gradient(145deg,#D1AA58 0%,#B88732 55%,#8D641E 100%) !important; }
.float-icon-svg {
    width: 31px !important;
    height: 31px !important;
    color: #fff !important;
    display: block !important;
    filter: drop-shadow(0 3px 5px rgba(0,0,0,.18));
}
.float-btn::before {
    content: '';
    position: absolute;
    inset: -9px;
    border-radius: inherit;
    border: 2px solid currentColor;
    opacity: .22;
    pointer-events: none;
}
.float-btn::after { display: none !important; }
.float-btn:hover { transform: translateY(-4px) scale(1.06) !important; }
.float-tooltip {
    right: 78px !important;
    top: 50% !important;
    transform: translateY(-50%) translateX(10px) !important;
    background: #073D32 !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(7,61,50,.20);
}
.float-btn:hover .float-tooltip { transform: translateY(-50%) translateX(0) !important; }
.back-to-top { display: grid !important; place-items: center !important; }
.backtop-icon-svg { width: 24px !important; height: 24px !important; }
.review-card::before { content:'”' !important; font-family: Georgia, serif !important; font-weight: 900 !important; font-size: 5rem !important; line-height: .8 !important; color: rgba(199,162,90,.14) !important; }

@media (max-width: 768px) {
    .logo { min-width: 0 !important; padding: 6px 8px !important; }
    .logo-emblem { width: 50px !important; height: 50px !important; flex-basis: 50px !important; }
    .logo-text { font-size: .88rem !important; max-width: 150px !important; }
    .logo-text span { font-size: .62rem !important; }
    .floating-actions { right: 14px !important; bottom: 18px !important; gap: 12px !important; }
    .float-btn { width: 58px !important; height: 58px !important; font-size: 26px !important; border-width: 4px !important; }
    .float-icon-svg { width: 27px !important; height: 27px !important; }
}
.btn-svg-icon { width: 1.05em; height: 1.05em; display:inline-block; vertical-align:-0.16em; margin-inline-end: 6px; flex:0 0 auto; }
[dir="rtl"] .btn-svg-icon { margin-inline-end: 0; margin-inline-start: 6px; }
.btn { gap: 8px; }
.service-icon-svg { width: 34px !important; height: 34px !important; color: #fff !important; display: block !important; filter: drop-shadow(0 4px 5px rgba(0,0,0,.18)); }
.static-service-card .service-icon-wrap, .service-card .service-icon-wrap { display: grid !important; place-items: center !important; }


/* ===== 2026-06-02 Redesign v2: cleaner menu, image services, fixed feature icons ===== */
body { background:#F6F3EA; }
.navbar {
    padding: 10px 4% !important;
    background: rgba(255,255,255,.96) !important;
    border-bottom: 1px solid rgba(14,90,70,.10) !important;
    box-shadow: 0 10px 30px rgba(15,23,42,.06) !important;
}
.navbar.scrolled { padding: 7px 4% !important; }
.nav-container { max-width: 1220px !important; gap: 22px !important; }
.logo {
    min-width: 260px !important;
    max-width: 330px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    gap: 10px !important;
}
.logo:hover { transform:none !important; box-shadow:none !important; }
.logo-emblem { width: 54px !important; height: 54px !important; flex: 0 0 54px !important; filter: drop-shadow(0 12px 20px rgba(7,61,50,.18)) !important; }
.logo-text { color:#073D32 !important; font-size: .98rem !important; line-height:1.35 !important; font-weight: 900 !important; max-width: 250px !important; }
.logo-text span { color:#9A7129 !important; font-size:.70rem !important; font-weight:800 !important; }
.nav-links { display:flex !important; align-items:center !important; justify-content:center !important; gap: 4px !important; flex: 1 1 auto !important; }
.navbar .nav-links > li { display:flex !important; }
.nav-link {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height: 42px !important;
    padding: 9px 13px !important;
    border-radius: 999px !important;
    color:#1E2A32 !important;
    font-size: .91rem !important;
    font-weight: 800 !important;
    transition: .25s ease !important;
    white-space: nowrap !important;
}
.nav-link::after { display:none !important; }
.nav-link:hover, .nav-link.active { color:#073D32 !important; background:rgba(14,90,70,.08) !important; }
.nav-cta {
    flex: 0 0 auto !important;
    min-height: 44px !important;
    padding: 10px 18px !important;
    background: linear-gradient(135deg,#C7A25A,#A7792C) !important;
    box-shadow: 0 10px 24px rgba(167,121,44,.22) !important;
}
.hamburger { border:1px solid rgba(14,90,70,.12) !important; border-radius:14px !important; background:#fff !important; }

.services { background: linear-gradient(180deg,#F7F5EF 0%,#FFFFFF 100%) !important; }
.service-image-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 26px !important; }
.image-service-card {
    display:flex !important;
    flex-direction:column !important;
    min-height: 430px !important;
    border-radius: 26px !important;
    border: 1px solid rgba(14,90,70,.11) !important;
    background:#fff !important;
    box-shadow: 0 16px 44px rgba(15,23,42,.08) !important;
    overflow: hidden !important;
}
.image-service-card::before { display:none !important; }
.image-service-card:hover { transform: translateY(-8px) !important; border-color: rgba(199,162,90,.55) !important; box-shadow:0 26px 60px rgba(14,90,70,.15) !important; }
.image-service-card .service-visual,
.image-service-card .service-img-wrapper {
    height: 215px !important;
    width: 100% !important;
    background: #F7F5EF !important;
    border-radius: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}
.image-service-card .service-img { width:100% !important; height:100% !important; object-fit:cover !important; transform:none !important; }
.image-service-card:hover .service-img { transform: scale(1.035) !important; }
.image-service-card .service-content {
    min-height: 0 !important;
    flex: 1 1 auto !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    text-align:center !important;
    padding: 26px 22px 28px !important;
    position: relative !important;
}
.image-service-card .service-icon-wrap {
    width: 64px !important;
    height: 64px !important;
    border-radius: 20px !important;
    margin: -58px auto 18px !important;
    background: linear-gradient(145deg,#0E5A46,#073D32) !important;
    border: 5px solid #fff !important;
    box-shadow: 0 16px 34px rgba(7,61,50,.22) !important;
    z-index: 2 !important;
}
.image-service-card .service-icon-wrap::after { display:none !important; }
.image-service-card .service-title { color:#073D32 !important; font-size: 22px !important; margin-bottom: 8px !important; }
.image-service-card .service-desc { color:#667782 !important; font-size: 14px !important; line-height:1.9 !important; max-width:310px !important; }
.image-service-card .service-img-overlay { background: linear-gradient(180deg,rgba(7,61,50,0) 0%,rgba(7,61,50,.68) 100%) !important; opacity:0 !important; align-items:flex-end !important; padding-bottom: 22px !important; }
.image-service-card:hover .service-img-overlay { opacity:1 !important; }
.image-service-card .service-overlay-btn { background:#fff !important; color:#073D32 !important; font-size:.9rem !important; box-shadow:0 10px 22px rgba(7,61,50,.18) !important; }
.service-icon-svg, .feature-svg-icon, .hero-badge-icon, .review-badge-icon, .area-icon-svg { display:block !important; }
.hero-badge-icon { width:1.1em !important; height:1.1em !important; color:currentColor !important; }
.area-icon-svg { width:18px !important; height:18px !important; color:#C7A25A !important; }

.why-us-redesigned {
    background: radial-gradient(circle at 10% 12%, rgba(199,162,90,.18), transparent 30%), linear-gradient(180deg,#FFFFFF 0%,#F7F5EF 100%) !important;
    padding: 96px 0 !important;
}
.why-us-redesigned .section-title { color:#073D32 !important; }
.why-us-redesigned .section-subtitle { color:#667782 !important; }
.professional-features-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 22px !important; }
.professional-feature-card {
    background:#fff !important;
    border:1px solid rgba(14,90,70,.10) !important;
    border-radius: 26px !important;
    padding: 32px 28px !important;
    text-align:center !important;
    box-shadow:0 14px 40px rgba(15,23,42,.07) !important;
    position:relative !important;
    overflow:hidden !important;
}
.professional-feature-card::before { content:''; position:absolute; inset-inline:0; top:0; height:5px; background:linear-gradient(90deg,#0E5A46,#C7A25A); opacity:.9; }
.professional-feature-card:hover { transform:translateY(-7px) !important; border-color:rgba(199,162,90,.55) !important; box-shadow:0 24px 58px rgba(14,90,70,.14) !important; }
.professional-feature-card .feature-icon {
    width:72px !important;
    height:72px !important;
    border-radius:24px !important;
    margin:0 auto 18px !important;
    background: linear-gradient(145deg,#0E5A46,#073D32) !important;
    color:#fff !important;
    display:grid !important;
    place-items:center !important;
    box-shadow:0 16px 34px rgba(7,61,50,.19) !important;
}
.feature-svg-icon { width:36px !important; height:36px !important; color:#fff !important; }
.professional-feature-card h3 { color:#073D32 !important; font-size:1.18rem !important; margin-bottom:9px !important; }
.professional-feature-card p { color:#667782 !important; line-height:1.9 !important; font-size:.94rem !important; }
.stars-text { letter-spacing: 1px; color:#F2B94B; font-size:1rem; font-weight:900; }
.review-badge-icon { width:20px !important; height:20px !important; color:#C7A25A !important; }
.review-stars, .rating-stars { display:flex; justify-content:flex-start; align-items:center; color:#F2B94B; }
.rating-stars { justify-content:center; }
.review-card::before { content:'”' !important; font-family: Georgia, serif !important; }

@media (max-width: 1120px) {
    .nav-container { gap: 12px !important; }
    .logo { min-width: 225px !important; max-width: 260px !important; }
    .logo-text { font-size: .88rem !important; max-width: 195px !important; }
    .nav-link { font-size: .82rem !important; padding: 8px 9px !important; }
    .nav-cta { padding: 9px 13px !important; }
}
@media (max-width: 992px) {
    .service-image-grid, .professional-features-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .nav-links, .nav-cta { display:none !important; }
    .hamburger { display:flex !important; }
    .nav-links.open { display:flex !important; flex-direction:column !important; position:absolute !important; top:100% !important; right:4% !important; left:4% !important; width:auto !important; background:#fff !important; border:1px solid rgba(14,90,70,.10) !important; border-radius:22px !important; padding:14px !important; box-shadow:0 24px 60px rgba(15,23,42,.14) !important; gap:6px !important; align-items:stretch !important; }
    .nav-links.open > li { width:100% !important; display:block !important; }
    .nav-links.open .nav-link { width:100% !important; justify-content:flex-start !important; padding:13px 16px !important; }
}
@media (max-width: 768px) {
    .logo { min-width:0 !important; max-width: 240px !important; }
    .logo-emblem { width:46px !important; height:46px !important; flex-basis:46px !important; }
    .logo-text { font-size:.82rem !important; max-width: 170px !important; }
    .service-image-grid, .professional-features-grid { grid-template-columns: 1fr !important; }
    .image-service-card { min-height:auto !important; }
    .image-service-card .service-visual, .image-service-card .service-img-wrapper { height: 210px !important; }
    .why-us-redesigned { padding:64px 0 !important; }
}


/* ===== Premium redesign patch: menu, floating actions, service cards and why-us ===== */
:root {
    --brand-green: #073D32;
    --brand-green-2: #0E5A46;
    --brand-gold: #C7A25A;
    --brand-gold-2: #A87525;
    --brand-cream: #F8F5EC;
    --brand-ink: #17242B;
}

/* Header / menu */
.navbar {
    padding: 12px 4% !important;
    background: rgba(255,255,255,.93) !important;
    backdrop-filter: blur(18px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
    border-bottom: 1px solid rgba(7,61,50,.08) !important;
    box-shadow: 0 14px 42px rgba(15,23,42,.07) !important;
}
.nav-container { max-width: 1240px !important; gap: 18px !important; }
.logo { min-width: 285px !important; max-width: 355px !important; gap: 11px !important; }
.logo-emblem { width: 58px !important; height: 58px !important; flex: 0 0 58px !important; }
.logo-emblem img { width: 100% !important; height: 100% !important; object-fit: contain !important; }
.logo-text { color: var(--brand-green) !important; font-weight: 900 !important; font-size: .96rem !important; letter-spacing: -.2px !important; }
.logo-text span { color: var(--brand-gold-2) !important; font-weight: 800 !important; font-size: .68rem !important; margin-top: 2px !important; }
.nav-links {
    flex: 1 1 auto !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 7px !important;
    background: #F7F5EF !important;
    border: 1px solid rgba(7,61,50,.08) !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
}
.navbar .nav-links,
.navbar .nav-links ul,
.navbar .nav-links li,
.navbar .nav-links .sub-menu,
.navbar .nav-links .children {
    list-style: none !important;
}
.navbar .nav-links .sub-menu,
.navbar .nav-links .children { display: none !important; }
.nav-link {
    min-height: 38px !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    color: #2B3A42 !important;
    font-size: .86rem !important;
    font-weight: 900 !important;
    letter-spacing: -.1px !important;
}
.nav-link:hover,
.nav-link.active {
    color: #fff !important;
    background: linear-gradient(135deg,var(--brand-green-2),var(--brand-green)) !important;
    box-shadow: 0 8px 18px rgba(7,61,50,.15) !important;
}
.nav-cta {
    min-height: 48px !important;
    border-radius: 999px !important;
    padding: 11px 20px !important;
    background: linear-gradient(135deg,#D7B771,var(--brand-gold-2)) !important;
    color: #fff !important;
    font-weight: 900 !important;
    box-shadow: 0 14px 28px rgba(168,117,37,.25) !important;
}
.hamburger { width: 46px !important; height: 46px !important; justify-content: center !important; align-items: center !important; }

/* Floating side actions: premium slim pill instead of bulky circles */
.floating-actions {
    right: 22px !important;
    bottom: 96px !important;
    gap: 10px !important;
    z-index: 9997 !important;
}
.float-btn {
    width: 118px !important;
    height: 50px !important;
    border-radius: 999px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border: 1px solid rgba(255,255,255,.68) !important;
    box-shadow: 0 16px 34px rgba(15,23,42,.18) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}
.float-whatsapp { background: linear-gradient(135deg,#21C365,#068B5C) !important; }
.float-call { background: linear-gradient(135deg,#D5B061,#A87525) !important; }
.float-btn::before { display: none !important; }
.float-btn::after { content:'' !important; position:absolute !important; inset:3px !important; border-radius:inherit !important; border:1px solid rgba(255,255,255,.26) !important; display:block !important; pointer-events:none !important; }
.float-icon-svg { width: 24px !important; height: 24px !important; filter:none !important; }
.float-tooltip {
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    transform: none !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
    padding: 0 !important;
    white-space: nowrap !important;
    font-size: .86rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}
.float-btn:hover { transform: translateY(-3px) !important; box-shadow:0 22px 42px rgba(15,23,42,.24) !important; }
.back-to-top {
    left: 22px !important;
    bottom: 28px !important;
    width: 48px !important;
    height: 48px !important;
    background: linear-gradient(135deg,var(--brand-green-2),var(--brand-green)) !important;
    box-shadow: 0 16px 30px rgba(7,61,50,.20) !important;
}

/* Services: make images feel like real visual cards with clear CTA */
.services { background: linear-gradient(180deg,#FAF8F2 0%,#FFFFFF 100%) !important; }
.service-image-grid { gap: 28px !important; }
.image-service-card {
    border-radius: 30px !important;
    border: 1px solid rgba(7,61,50,.09) !important;
    box-shadow: 0 18px 48px rgba(15,23,42,.09) !important;
    background: #fff !important;
}
.image-service-card .service-visual { height: 245px !important; background:#F1F4EF !important; }
.image-service-card .service-img { transition: transform .55s ease, filter .55s ease !important; }
.image-service-card:hover .service-img { transform: scale(1.055) !important; filter: saturate(1.06) contrast(1.02) !important; }
.service-brand-strip {
    position:absolute !important;
    left: 14px !important;
    right: 14px !important;
    bottom: 14px !important;
    z-index: 2 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    border-radius: 18px !important;
    background: rgba(7,61,50,.84) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(7,61,50,.22) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    font-weight: 900 !important;
    font-size: .82rem !important;
}
.service-brand-strip strong { color:#F1D48B !important; direction:ltr !important; unicode-bidi: plaintext !important; font-size:.9rem !important; }
.image-service-card .service-content { padding: 30px 24px 28px !important; }
.image-service-card .service-icon-wrap {
    margin: -62px auto 20px !important;
    width: 70px !important;
    height: 70px !important;
    border-radius: 23px !important;
    background: linear-gradient(145deg,#073D32,#0E5A46) !important;
    border: 6px solid #fff !important;
    box-shadow: 0 18px 34px rgba(7,61,50,.24) !important;
}
.image-service-card .service-title { font-size: 1.32rem !important; font-weight: 900 !important; }
.image-service-card .service-desc { font-size: .92rem !important; line-height: 1.9 !important; }
.service-card-cta {
    margin-top: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 42px !important;
    padding: 9px 18px !important;
    border-radius: 999px !important;
    color: #fff !important;
    background: linear-gradient(135deg,var(--brand-gold),var(--brand-gold-2)) !important;
    font-weight: 900 !important;
    box-shadow: 0 12px 25px rgba(168,117,37,.18) !important;
}
.service-card-cta-icon { width: 18px !important; height: 18px !important; color: currentColor !important; }

/* Why us: richer professional cards */
.why-us-redesigned {
    background:
      radial-gradient(circle at 12% 18%, rgba(199,162,90,.20), transparent 28%),
      radial-gradient(circle at 88% 20%, rgba(14,90,70,.12), transparent 30%),
      linear-gradient(180deg,#FFFFFF 0%,#F8F5EC 100%) !important;
    padding: 100px 0 108px !important;
    position: relative !important;
    overflow: hidden !important;
}
.why-us-redesigned::before {
    content: '' !important;
    position: absolute !important;
    width: 620px !important;
    height: 620px !important;
    border-radius: 50% !important;
    right: -280px !important;
    top: 70px !important;
    background: conic-gradient(from 90deg, rgba(7,61,50,.13), rgba(199,162,90,.16), rgba(7,61,50,.04), rgba(7,61,50,.13)) !important;
    opacity: .55 !important;
}
.why-us-redesigned .container { position: relative !important; z-index: 1 !important; }
.why-us-redesigned .section-header { margin-bottom: 44px !important; }
.why-us-redesigned .section-title { color: var(--brand-green) !important; }
.why-us-redesigned .section-subtitle { color: #64747B !important; max-width: 720px !important; }
.professional-features-grid {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 22px !important;
}
.professional-feature-card {
    min-height: 224px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 34px 28px 30px !important;
    border-radius: 28px !important;
    background: rgba(255,255,255,.92) !important;
    border: 1px solid rgba(7,61,50,.10) !important;
    box-shadow: 0 18px 46px rgba(15,23,42,.08) !important;
    overflow: hidden !important;
}
.professional-feature-card::before {
    height: 0 !important;
    background: none !important;
}
.professional-feature-card::after {
    content:'' !important;
    position:absolute !important;
    inset: 0 !important;
    border-radius: inherit !important;
    padding: 1px !important;
    background: linear-gradient(135deg,rgba(14,90,70,.28),rgba(199,162,90,.44),rgba(14,90,70,.05)) !important;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) !important;
    -webkit-mask-composite: xor !important;
    mask-composite: exclude !important;
    pointer-events:none !important;
}
.feature-number {
    position:absolute !important;
    top: 18px !important;
    inset-inline-start: 20px !important;
    font-size: 2.2rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    color: rgba(7,61,50,.06) !important;
    direction:ltr !important;
}
.professional-feature-card .feature-icon {
    width: 76px !important;
    height: 76px !important;
    margin: 0 auto 18px !important;
    border-radius: 28px !important;
    background: linear-gradient(145deg,#073D32,#0E5A46) !important;
    color: #fff !important;
    box-shadow: 0 18px 34px rgba(7,61,50,.18) !important;
    position: relative !important;
}
.professional-feature-card .feature-icon::after {
    content:'' !important;
    position:absolute !important;
    inset: -8px !important;
    border-radius: 32px !important;
    background: rgba(199,162,90,.12) !important;
    z-index: -1 !important;
}
.feature-svg-icon { width: 36px !important; height: 36px !important; color:#fff !important; }
.professional-feature-card h3 { color: var(--brand-green) !important; font-size: 1.12rem !important; font-weight: 900 !important; margin: 0 0 8px !important; }
.professional-feature-card p { color: #65767E !important; font-size: .88rem !important; line-height: 1.9 !important; max-width: 300px !important; margin: 0 auto !important; }
.professional-feature-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 28px 64px rgba(7,61,50,.14) !important;
    border-color: rgba(199,162,90,.38) !important;
}
.professional-feature-card:hover .feature-icon { background: linear-gradient(145deg,#D7B771,#A87525) !important; }

@media (max-width: 1180px) {
    .logo { min-width: 235px !important; max-width: 260px !important; }
    .logo-text { font-size: .85rem !important; max-width: 185px !important; }
    .nav-link { font-size: .80rem !important; padding: 8px 10px !important; }
    .nav-links { gap: 4px !important; }
    .nav-cta { padding: 10px 14px !important; font-size: .82rem !important; }
}
@media (max-width: 992px) {
    .nav-links { border-radius: 24px !important; background:#fff !important; padding: 14px !important; }
    .nav-links.open { gap: 8px !important; }
    .nav-links.open .nav-link { justify-content: center !important; background:#F8F5EC !important; border-radius: 14px !important; color: var(--brand-green) !important; }
    .nav-links.open .nav-link:hover { color:#fff !important; background:linear-gradient(135deg,var(--brand-green-2),var(--brand-green)) !important; }
    .professional-features-grid,
    .service-image-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .floating-actions { bottom: 82px !important; right: 14px !important; }
    .float-btn { width: 52px !important; height: 52px !important; padding: 0 !important; }
    .float-tooltip { display:none !important; }
    .float-icon-svg { width: 25px !important; height: 25px !important; }
}
@media (max-width: 768px) {
    .logo { min-width: 0 !important; max-width: 270px !important; }
    .logo-emblem { width: 50px !important; height: 50px !important; flex-basis: 50px !important; }
    .logo-text { max-width: 180px !important; }
    .professional-features-grid,
    .service-image-grid { grid-template-columns: 1fr !important; }
    .image-service-card .service-visual { height: 230px !important; }
    .service-brand-strip { font-size:.78rem !important; }
    .why-us-redesigned { padding: 72px 0 !important; }
    .professional-feature-card { min-height: 210px !important; }
}


/* ===== Client requested patch: pulsing round contact buttons + changeable real service photos ===== */
.floating-actions {
    position: fixed !important;
    right: 24px !important;
    bottom: 104px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    z-index: 9999 !important;
}
.float-btn {
    width: 62px !important;
    height: 62px !important;
    min-width: 62px !important;
    min-height: 62px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
    overflow: visible !important;
    border: 3px solid rgba(255,255,255,.96) !important;
    box-shadow: 0 12px 26px rgba(15,23,42,.20), inset 0 1px 0 rgba(255,255,255,.32) !important;
    isolation: isolate !important;
}
.float-whatsapp { background: linear-gradient(145deg,#24D36B 0%,#08A86C 65%,#057A59 100%) !important; }
.float-call { background: linear-gradient(145deg,#D3AA58 0%,#B8822D 100%) !important; }
.float-btn::before {
    content: '' !important;
    position: absolute !important;
    inset: -11px !important;
    border-radius: 50% !important;
    display: block !important;
    pointer-events: none !important;
    border: 2px solid rgba(36,211,107,.48) !important;
    background: rgba(36,211,107,.10) !important;
    animation: motraficPulseRing 1.8s ease-out infinite !important;
    z-index: -1 !important;
}
.float-call::before {
    border-color: rgba(211,170,88,.46) !important;
    background: rgba(211,170,88,.10) !important;
    animation-delay: .35s !important;
}
.float-btn::after {
    content: '' !important;
    position: absolute !important;
    inset: -5px !important;
    border-radius: 50% !important;
    display: block !important;
    pointer-events: none !important;
    border: 1px solid rgba(255,255,255,.78) !important;
    box-shadow: 0 0 0 4px rgba(255,255,255,.13) !important;
    z-index: -1 !important;
}
.float-icon-svg { width: 30px !important; height: 30px !important; color: #fff !important; display: block !important; }
.float-tooltip {
    position: absolute !important;
    right: 76px !important;
    top: 50% !important;
    transform: translateY(-50%) translateX(8px) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    background: #073D32 !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: 8px 12px !important;
    font-size: .82rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    box-shadow: 0 12px 24px rgba(7,61,50,.20) !important;
    transition: .25s ease !important;
}
.float-btn:hover .float-tooltip { opacity: 1 !important; visibility: visible !important; transform: translateY(-50%) translateX(0) !important; }
.float-btn:hover { transform: translateY(-4px) scale(1.03) !important; }
@keyframes motraficPulseRing {
    0% { transform: scale(.88); opacity: .95; }
    70% { transform: scale(1.32); opacity: .10; }
    100% { transform: scale(1.42); opacity: 0; }
}

.services .section-header { margin-bottom: 42px !important; }
.service-photo-grid {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 30px !important;
}
.photo-service-card {
    border-radius: 30px !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid rgba(7,61,50,.10) !important;
    box-shadow: 0 16px 42px rgba(15,23,42,.08) !important;
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease !important;
}
.photo-service-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 28px 70px rgba(7,61,50,.16) !important;
    border-color: rgba(199,162,90,.45) !important;
}
.photo-service-card .service-visual {
    height: 255px !important;
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 30px 30px 0 0 !important;
    background: #e8ece6 !important;
}
.photo-service-card .service-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform .6s ease, filter .6s ease !important;
}
.photo-service-card:hover .service-img { transform: scale(1.065) !important; filter: saturate(1.08) contrast(1.04) !important; }
.service-photo-shade {
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg,rgba(7,61,50,0) 40%,rgba(7,61,50,.65) 100%) !important;
    pointer-events: none !important;
}
.service-phone-badge {
    position: absolute !important;
    left: 16px !important;
    bottom: 16px !important;
    z-index: 3 !important;
    direction: ltr !important;
    unicode-bidi: plaintext !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.94) !important;
    color: #073D32 !important;
    font-weight: 900 !important;
    box-shadow: 0 12px 26px rgba(7,61,50,.20) !important;
}
.photo-service-card .service-content {
    padding: 24px 24px 28px !important;
    min-height: 210px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    flex-direction: column !important;
}
.photo-service-card .service-icon-wrap { display: none !important; }
.photo-service-card .service-title,
.photo-service-card .service-title a {
    color: #073D32 !important;
    text-decoration: none !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    line-height: 1.45 !important;
    margin: 0 0 10px !important;
}
.photo-service-card .service-desc {
    color: #64747B !important;
    font-size: .95rem !important;
    line-height: 1.9 !important;
    max-width: 340px !important;
    margin: 0 auto !important;
}
.photo-service-card .service-card-cta {
    margin-top: 18px !important;
    background: linear-gradient(135deg,#0E5A46,#073D32) !important;
    box-shadow: 0 14px 28px rgba(7,61,50,.16) !important;
}
.photo-service-card .service-card-cta:hover { background: linear-gradient(135deg,#D3AA58,#B8822D) !important; }
.service-img-overlay,
.service-brand-strip { display: none !important; }
.logo-emblem img, .footer-logo-emblem img { transform: scale(1.06) !important; }
@media (max-width: 992px) {
    .service-photo-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
    .floating-actions { right: 16px !important; bottom: 90px !important; gap: 16px !important; }
    .float-btn { width: 58px !important; height: 58px !important; min-width:58px !important; min-height:58px !important; }
    .float-icon-svg { width: 28px !important; height: 28px !important; }
    .float-tooltip { display:none !important; }
}
@media (max-width: 680px) {
    .service-photo-grid { grid-template-columns: 1fr !important; }
    .photo-service-card .service-visual { height: 235px !important; }
    .photo-service-card .service-content { min-height: auto !important; }
    .floating-actions { bottom: 82px !important; }
}

/* ===== 2026-07-01 layout repair: stable RTL header and hero without relying on imported CSS order ===== */
html,
body {
    direction: rtl;
}

body {
    font-family: 'Noto Sans Arabic', 'Noto Kufi Arabic', Tahoma, Arial, sans-serif !important;
    background: #F7F5EF !important;
    color: #1E2A32 !important;
    overflow-x: hidden !important;
}

.navbar {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    min-height: 78px !important;
    padding: 10px 18px !important;
    display: block !important;
    background: rgba(255,255,255,.96) !important;
    border-bottom: 1px solid rgba(7,61,50,.08) !important;
    box-shadow: 0 10px 30px rgba(15,23,42,.07) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    z-index: 9999 !important;
}

.navbar.scrolled {
    min-height: 68px !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

.nav-container {
    width: 100% !important;
    max-width: 1280px !important;
    min-height: 58px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(150px, 230px) minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    position: relative !important;
}

.logo {
    min-width: 0 !important;
    max-width: 230px !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #073D32 !important;
}

.logo:hover {
    transform: none !important;
    box-shadow: none !important;
}

.logo-emblem {
    width: 54px !important;
    height: 54px !important;
    flex: 0 0 54px !important;
    display: inline-grid !important;
    place-items: center !important;
}

.logo-emblem img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    transform: none !important;
}

.logo-text {
    min-width: 0 !important;
    max-width: 160px !important;
    color: #073D32 !important;
    font-size: .88rem !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
    white-space: normal !important;
    letter-spacing: 0 !important;
}

.logo-text span {
    display: block !important;
    margin-top: 2px !important;
    color: #A87525 !important;
    font-size: .64rem !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
}

.nav-links {
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 6px !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    background: #F8F6EF !important;
    border: 1px solid rgba(7,61,50,.10) !important;
    border-radius: 999px !important;
    list-style: none !important;
    overflow: hidden !important;
}

.navbar .nav-links > li {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    list-style: none !important;
}

.nav-link {
    min-height: 36px !important;
    padding: 8px 11px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    color: #25333B !important;
    font-size: .82rem !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
    letter-spacing: 0 !important;
}

.nav-link::after {
    display: none !important;
}

.nav-link:hover,
.nav-link.active {
    color: #fff !important;
    background: linear-gradient(135deg,#0E5A46,#073D32) !important;
    box-shadow: 0 7px 18px rgba(7,61,50,.16) !important;
}

.nav-cta {
    min-height: 46px !important;
    padding: 10px 17px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg,#D3AA58,#A87525) !important;
    color: #fff !important;
    font-size: .88rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
    box-shadow: 0 12px 26px rgba(168,117,37,.24) !important;
}

.nav-cta-icon {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
}

.hamburger {
    display: none !important;
    width: 44px !important;
    height: 44px !important;
    align-items: center !important;
    justify-content: center !important;
}

.hero {
    min-height: 100vh !important;
    padding: 136px 24px 76px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(160deg,#073D32 0%,#0E5A46 52%,#1E2A32 100%) !important;
}

.hero-overlay,
.hero-particles {
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
}

.hero-overlay {
    background-position: center !important;
    background-size: cover !important;
    opacity: .13 !important;
    mix-blend-mode: luminosity !important;
}

.hero-content {
    position: relative !important;
    z-index: 2 !important;
    width: min(100%, 900px) !important;
    max-width: 900px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    color: #fff !important;
}

.hero-badge {
    margin: 0 auto 22px !important;
    padding: 9px 19px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-radius: 999px !important;
    background: rgba(199,162,90,.18) !important;
    border: 1px solid rgba(199,162,90,.38) !important;
    color: #F1D48B !important;
    font-size: .95rem !important;
    font-weight: 800 !important;
    line-height: 1.5 !important;
}

.hero h1 {
    max-width: 900px !important;
    margin: 0 auto 20px !important;
    color: #fff !important;
    font-size: 46px !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

.gradient-text {
    background: linear-gradient(135deg,#F1D48B,#FFFFFF) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: #F1D48B !important;
}

.hero-desc {
    max-width: 760px !important;
    margin: 0 auto 30px !important;
    color: rgba(255,255,255,.84) !important;
    font-size: 1.08rem !important;
    line-height: 2 !important;
    text-align: center !important;
}

.hero-actions {
    margin: 0 auto 42px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;
}

.hero-actions .btn {
    min-height: 50px !important;
    padding: 12px 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    border-radius: 999px !important;
    font-size: .98rem !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

.hero-actions .btn-outline {
    color: #fff !important;
    border: 2px solid rgba(255,255,255,.34) !important;
    background: rgba(255,255,255,.07) !important;
}

.hero-stats {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 28px !important;
    color: #fff !important;
}

.hero-stat {
    min-width: 120px !important;
    text-align: center !important;
}

.stat-number {
    display: block !important;
    color: #F1D48B !important;
    font-size: 2.1rem !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
}

.stat-label {
    display: block !important;
    margin-top: 4px !important;
    color: rgba(255,255,255,.72) !important;
    font-size: .9rem !important;
    font-weight: 700 !important;
}

.hero-stat-divider {
    width: 1px !important;
    min-height: 54px !important;
    background: rgba(255,255,255,.18) !important;
}

.floating-actions {
    right: 24px !important;
    bottom: 28px !important;
    z-index: 9998 !important;
}

.float-btn {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    min-height: 60px !important;
}

@media (max-width: 1220px) {
    .nav-container {
        grid-template-columns: 66px minmax(0, 1fr) auto !important;
        gap: 10px !important;
    }

    .logo {
        max-width: 66px !important;
    }

    .logo-text {
        display: none !important;
    }

    .nav-link {
        padding-right: 9px !important;
        padding-left: 9px !important;
        font-size: .78rem !important;
    }

    .nav-cta {
        padding-right: 14px !important;
        padding-left: 14px !important;
        font-size: .82rem !important;
    }
}

@media (max-width: 980px) {
    .nav-container {
        display: flex !important;
        justify-content: space-between !important;
        gap: 12px !important;
    }

    .logo {
        max-width: 245px !important;
    }

    .logo-text {
        display: block !important;
    }

    .nav-links,
    .nav-cta {
        display: none !important;
    }

    .hamburger {
        display: inline-flex !important;
    }

    .nav-links.open {
        position: absolute !important;
        top: calc(100% + 10px) !important;
        right: 0 !important;
        left: 0 !important;
        width: auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        padding: 14px !important;
        overflow: visible !important;
        border-radius: 20px !important;
        background: #fff !important;
        box-shadow: 0 22px 55px rgba(15,23,42,.16) !important;
    }

    .nav-links.open > li,
    .nav-links.open .nav-link {
        width: 100% !important;
    }

    .nav-links.open .nav-link {
        min-height: 44px !important;
        justify-content: center !important;
        background: #F8F6EF !important;
        color: #073D32 !important;
        font-size: .95rem !important;
    }
}

@media (max-width: 680px) {
    .navbar {
        min-height: 70px !important;
        padding: 8px 12px !important;
    }

    .logo {
        max-width: 220px !important;
    }

    .logo-emblem {
        width: 48px !important;
        height: 48px !important;
        flex-basis: 48px !important;
    }

    .logo-text {
        max-width: 145px !important;
        font-size: .78rem !important;
    }

    .logo-text span {
        font-size: .58rem !important;
    }

    .hero {
        min-height: auto !important;
        padding: 112px 16px 58px !important;
    }

    .hero-badge {
        max-width: 100% !important;
        font-size: .82rem !important;
        white-space: normal !important;
    }

    .hero h1 {
        font-size: 32px !important;
    }

    .hero-desc {
        font-size: .96rem !important;
        line-height: 1.9 !important;
    }

    .hero-actions .btn {
        width: 100% !important;
        max-width: 320px !important;
        white-space: normal !important;
    }

    .hero-stats {
        gap: 16px !important;
    }

    .hero-stat-divider {
        display: none !important;
    }

    .floating-actions {
        right: 14px !important;
        bottom: 18px !important;
        gap: 12px !important;
    }

    .float-btn {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        min-height: 54px !important;
    }
}

/* ===== 2026-07-01 projects section visual upgrade ===== */
.projects-showcase-section {
    padding: 96px 0 104px !important;
    background:
        linear-gradient(180deg,#fff 0%,#F8F6EF 100%) !important;
    position: relative !important;
    overflow: hidden !important;
}

.projects-showcase-section::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        radial-gradient(circle at 14% 18%, rgba(199,162,90,.16), transparent 30%),
        radial-gradient(circle at 88% 72%, rgba(14,90,70,.12), transparent 34%) !important;
    pointer-events: none !important;
}

.projects-showcase-section .container {
    position: relative !important;
    z-index: 1 !important;
}

.projects-header {
    margin-bottom: 46px !important;
}

.projects-header .section-title {
    color: #073D32 !important;
}

.projects-header .section-subtitle {
    max-width: 740px !important;
    color: #64747B !important;
}

.projects-showcase-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 28px !important;
    align-items: stretch !important;
}

.project-showcase-card {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    background: #fff !important;
    border: 1px solid rgba(7,61,50,.10) !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 16px 42px rgba(15,23,42,.08) !important;
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease !important;
}

.project-showcase-card.reveal-card {
    opacity: 1 !important;
    transform: none !important;
}

.project-showcase-card:hover {
    transform: translateY(-8px) !important;
    border-color: rgba(199,162,90,.42) !important;
    box-shadow: 0 28px 70px rgba(7,61,50,.15) !important;
}

.project-showcase-media {
    height: 255px !important;
    position: relative !important;
    display: block !important;
    overflow: hidden !important;
    background: #E8EFEA !important;
}

.project-showcase-media img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    transform: scale(1.01) !important;
    transition: transform .65s ease, filter .65s ease !important;
}

.project-showcase-card:hover .project-showcase-media img {
    transform: scale(1.07) !important;
    filter: saturate(1.08) contrast(1.04) !important;
}

.project-showcase-shade {
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(180deg, rgba(7,61,50,0) 42%, rgba(7,61,50,.70) 100%),
        linear-gradient(135deg, rgba(7,61,50,.14), rgba(199,162,90,.08)) !important;
    pointer-events: none !important;
}

.project-showcase-tag {
    position: absolute !important;
    right: 16px !important;
    bottom: 16px !important;
    max-width: calc(100% - 32px) !important;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 7px 14px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.95) !important;
    color: #073D32 !important;
    font-size: .82rem !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
    box-shadow: 0 12px 28px rgba(7,61,50,.20) !important;
}

.project-showcase-body {
    flex: 1 !important;
    padding: 24px 22px 26px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: right !important;
}

.project-showcase-body h3 {
    margin: 0 0 10px !important;
    color: #073D32 !important;
    font-family: 'Noto Kufi Arabic','Noto Sans Arabic',sans-serif !important;
    font-size: 1.2rem !important;
    line-height: 1.55 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

.project-showcase-body h3 a {
    color: inherit !important;
}

.project-showcase-body p {
    margin: 0 0 18px !important;
    color: #667782 !important;
    font-size: .92rem !important;
    line-height: 1.9 !important;
}

.project-showcase-link {
    margin-top: auto !important;
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 9px 17px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg,#0E5A46,#073D32) !important;
    color: #fff !important;
    font-size: .88rem !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
    box-shadow: 0 12px 26px rgba(7,61,50,.16) !important;
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease !important;
}

.project-showcase-link:hover {
    transform: translateY(-2px) !important;
    background: linear-gradient(135deg,#D3AA58,#A87525) !important;
    box-shadow: 0 16px 32px rgba(168,117,37,.22) !important;
}

@media (max-width: 992px) {
    .projects-showcase-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 680px) {
    .projects-showcase-section {
        padding: 68px 0 74px !important;
    }

    .projects-showcase-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .project-showcase-media {
        height: 230px !important;
    }

    .project-showcase-body {
        align-items: center !important;
        text-align: center !important;
        padding: 22px 18px 24px !important;
    }
}
