/* ===== Design Tokens ===== */
:root{
  /* ألوان: حبر داكن مائل للأزرق، مائي تركوازي هادئ، برتقالي محدود جدًا، خلفية دافئة، أخضر واتساب مستقل */
  --ink:#101d2c;
  --ink-soft:#233246;
  --water:#0f6e78;
  --water-light:#e4f2f1;
  --water-line:#bfe0dd;
  --accent:#a8481a;
  --accent-hover:#8a3a15;
  --whatsapp:#25D366;
  --whatsapp-text:#0f2e1c;
  --whatsapp-hover:#147a3d;
  --bg:#faf7f2;
  --surface:#ffffff;
  --surface-alt:#f2ede4;
  --text:#1c2530;
  --text-muted:#5b6773;
  --border:#e7e0d3;
  --border-strong:#d8cdb8;

  --radius-sm:8px;
  --radius:14px;
  --radius-lg:22px;
  --shadow-sm:0 2px 10px rgba(16,29,44,.06);
  --shadow:0 10px 32px rgba(16,29,44,.09);
  --container:1180px;
  --sticky-bar-height:64px;
  --header-height:64px;
  --font-arabic:system-ui,-apple-system,'Segoe UI',Tahoma,Arial,sans-serif;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;max-width:100%;overflow-x:hidden;
  font-family:var(--font-arabic);
  background:var(--bg);
  color:var(--text);
  line-height:1.7;
  direction:rtl;
  -webkit-font-smoothing:antialiased;
  padding-bottom:var(--sticky-bar-height);
  font-size:16px;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{line-height:1.3;margin:0 0 .55em;color:var(--ink);font-weight:800}
p{margin:0 0 1em}
button{font-family:inherit}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}
section{padding:var(--space-7) 0}

:focus-visible{outline:3px solid var(--water);outline-offset:2px}
a:focus-visible,button:focus-visible{outline:3px solid var(--water);outline-offset:2px;border-radius:4px}

/* إخفاء آمن بلا أي تأثير على عرض الصفحة (لا يسبب Overflow) — يُستخدم لرابط التخطي وHoneypot */
.visually-hidden{
  position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link.visually-hidden:focus{
  position:fixed !important;width:auto;height:auto;margin:0;clip:auto;white-space:normal;
  top:8px;right:8px;z-index:1000;background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px;
}

/* ===== الهيدر ===== */
.site-header{
  position:sticky;top:0;z-index:100;background:var(--surface);
  border-bottom:1px solid var(--border);height:var(--header-height);
  transition:box-shadow .2s ease;
}
.site-header.is-scrolled{box-shadow:var(--shadow-sm)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;height:100%}
.brand{font-weight:800;font-size:1.05rem;color:var(--ink);white-space:nowrap}
.header-actions{display:flex;align-items:center;gap:8px}
.header-actions .btn{min-height:40px;padding:8px 14px;font-size:.88rem}

.nav-toggle{
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:42px;height:42px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;cursor:pointer;flex-shrink:0;
}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--ink)}

.primary-nav ul{display:flex;align-items:center;gap:2px}
.primary-nav a{display:block;padding:10px 12px;font-weight:600;color:var(--ink-soft);border-radius:var(--radius-sm);white-space:nowrap;font-size:.92rem}
.primary-nav a:hover{background:var(--water-light);color:var(--water)}
.primary-nav a[aria-current="page"]{color:var(--water);font-weight:800}

/* موبايل: قائمة تفتح كدرج RTL */
@media(max-width:899px){
  .primary-nav{
    position:fixed;top:0;right:0;height:100dvh;width:min(320px,86vw);background:#fff;z-index:300;
    box-shadow:-10px 0 30px rgba(16,29,44,.18);
    transform:translateX(100%);transition:transform .25s ease;
    display:flex;flex-direction:column;padding:var(--space-5);overflow-y:auto;
  }
  .primary-nav.open{transform:translateX(0)}
  .primary-nav ul{flex-direction:column;align-items:stretch;gap:2px;margin-top:var(--space-5)}
  .primary-nav a{padding:14px 12px;border-bottom:1px solid var(--border);font-size:1rem}
  .nav-drawer-header{display:flex;align-items:center;justify-content:space-between}
  .nav-drawer-close{
    width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:#fff;cursor:pointer;
    font-size:1.1rem;line-height:1;color:var(--ink);
  }
  .nav-overlay{
    position:fixed;inset:0;background:rgba(16,29,44,.45);z-index:290;opacity:0;pointer-events:none;transition:opacity .2s ease;
  }
  .nav-overlay.visible{opacity:1;pointer-events:auto}
}
@media(min-width:900px){
  .nav-toggle,.nav-overlay,.nav-drawer-header{display:none}
  .primary-nav{position:static;transform:none;height:auto;width:auto;box-shadow:none;padding:0;overflow:visible}
}

/* ===== الأزرار ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 20px;border-radius:var(--radius-sm);font-weight:700;font-size:.95rem;border:none;cursor:pointer;
  transition:background-color .15s ease, transform .1s ease;
  min-height:48px;line-height:1.2;
}
.btn:active{transform:scale(.97)}
.btn-call{background:var(--accent);color:#fff}
.btn-call:hover{background:var(--accent-hover)}
.btn-whatsapp{background:var(--whatsapp);color:var(--whatsapp-text)}
.btn-whatsapp:hover{background:var(--whatsapp-hover);color:#fff}
.btn-primary{background:var(--water);color:#fff;width:100%}
.btn-primary:hover{background:#0a5860}
.btn-outline{background:transparent;border:2px solid var(--water);color:var(--water)}
.btn-outline:hover{background:var(--water-light)}
.btn-ghost{background:var(--surface-alt);color:var(--ink)}
.btn-block{width:100%}

/* ===== Hero: "مسار معالجة الانسداد" ===== */
.hero{
  background:var(--surface);
  border-bottom:1px solid var(--border);
  padding:var(--space-6) 0 var(--space-7);
  position:relative;overflow:hidden;
}
.hero-flow-bg{
  position:absolute;inset:0;pointer-events:none;opacity:.5;z-index:0;
}
.hero .container{position:relative;z-index:1}
.hero-label{
  display:inline-flex;align-items:center;gap:6px;background:var(--water-light);color:var(--water);
  font-size:.8rem;font-weight:700;padding:6px 12px;border-radius:999px;margin-bottom:var(--space-4);
}
.hero h1{font-size:1.5rem;color:var(--ink)}
.hero p.lead{color:var(--text-muted);font-size:1rem;max-width:52ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:var(--space-5)}
.hero-phone-line{display:flex;align-items:center;gap:8px;margin-top:var(--space-3);font-weight:800;color:var(--ink);font-size:1.05rem}

.hero-grid{display:grid;grid-template-columns:1fr;gap:var(--space-6)}
@media(min-width:960px){
  .hero{padding:var(--space-8) 0 72px}
  .hero h1{font-size:2.2rem}
  .hero-grid{grid-template-columns:1.15fr .85fr;align-items:start;gap:var(--space-7)}
}

/* لوحة التشخيص داخل الـHero */
.diagnostic-panel{
  background:var(--ink);color:#fff;border-radius:var(--radius-lg);padding:var(--space-5);
}
.diagnostic-panel h2{color:#fff;font-size:1.05rem;margin-bottom:var(--space-4)}
.diagnostic-list{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-4)}
.diagnostic-item{
  display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-sm);padding:10px 12px;font-size:.92rem;
}
.diagnostic-item .icon-service{width:20px;height:20px;color:#7fd8cf}
.diagnostic-note{font-size:.85rem;color:#c9d6dc;margin-bottom:var(--space-4)}

/* نموذج مختصر مدمج (وليس كتلة بيضاء ضخمة) */
.mini-form{
  background:var(--surface-alt);border:1px solid var(--border-strong);border-radius:var(--radius-lg);
  padding:var(--space-5);
}
.mini-form h2{font-size:1rem;color:var(--ink)}
.mini-form-hint{font-size:.85rem;color:var(--text-muted);margin-bottom:var(--space-4)}

/* ===== نظام النماذج ===== */
.lead-form{color:var(--text)}
.form-row{margin-bottom:var(--space-4);display:flex;flex-direction:column;gap:6px}
.form-row label{font-weight:700;font-size:.9rem;color:var(--ink)}
.form-row input,.form-row select,.form-row textarea{
  padding:13px 14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);
  font-family:inherit;font-size:1rem;background:#fff;color:var(--text);width:100%;
}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{
  outline:2px solid var(--water);outline-offset:1px;border-color:var(--water);
}
.form-row.has-error input,.form-row.has-error select,.form-row.has-error textarea{border-color:#b3261e}
.field-error{color:#b3261e;font-size:.82rem;min-height:1.2em}
.req{color:var(--accent);margin-inline-start:2px}
.checkbox-label{display:flex;align-items:flex-start;gap:8px;font-weight:400;font-size:.88rem;color:var(--text)}
.checkbox-label a{color:var(--water);text-decoration:underline}
.checkbox-label input{margin-top:4px;width:18px;height:18px;flex-shrink:0}
.form-status{min-height:22px;font-weight:700}
.form-status.error{color:#b3261e}
.form-status.success{color:var(--water)}
.hp-field{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ===== أقسام عامة ===== */
.section-eyebrow{display:block;text-align:center;color:var(--water);font-weight:700;font-size:.85rem;margin-bottom:var(--space-2)}
.section-title{font-size:1.3rem;text-align:center;margin-bottom:8px;color:var(--ink)}
.section-subtitle{text-align:center;color:var(--text-muted);max-width:640px;margin:0 auto var(--space-5)}
@media(min-width:900px){ .section-title{font-size:1.7rem} }
.section-alt{background:var(--surface-alt)}

/* ===== شريط الثقة ===== */
.trust-bar{background:var(--water-light);border-top:1px solid var(--water-line);border-bottom:1px solid var(--water-line)}
.trust-bar .container{padding-block:var(--space-4)}
.trust-list{display:grid;grid-template-columns:1fr;gap:var(--space-2);text-align:center}
@media(min-width:768px){ .trust-list{grid-template-columns:repeat(4,1fr)} }
.trust-item{font-size:.88rem;font-weight:700;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;gap:6px}

/* ===== قسم المشكلة/التشخيص (عمودين) ===== */
.problem-grid{display:grid;grid-template-columns:1fr;gap:var(--space-6)}
@media(min-width:900px){ .problem-grid{grid-template-columns:1fr 1fr;align-items:start} }
.symptom-list{display:flex;flex-direction:column;gap:var(--space-3)}
.symptom-card{
  display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:var(--space-4);
}
.symptom-card .icon-service{color:var(--water);flex-shrink:0;margin-top:2px}
.symptom-card h3{font-size:1rem;margin-bottom:4px}
.symptom-card p{margin:0;color:var(--text-muted);font-size:.9rem}

.flow-diagram{
  background:var(--ink);border-radius:var(--radius-lg);padding:var(--space-5);color:#fff;
}
.flow-diagram h3{color:#fff;font-size:1rem;margin-bottom:var(--space-4)}
.flow-steps{display:flex;flex-direction:column;gap:0}
.flow-step{display:flex;align-items:center;gap:12px;padding:var(--space-3) 0;position:relative}
.flow-step:not(:last-child)::after{
  content:"";position:absolute;right:11px;top:calc(100% - 6px);width:2px;height:var(--space-3);background:rgba(127,216,207,.4);
}
.flow-dot{width:24px;height:24px;border-radius:50%;background:var(--water);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.flow-step span.label{font-size:.92rem;color:#e4f2f1}
.flow-note{margin-top:var(--space-4);font-size:.82rem;color:#a9c0c5}

/* ===== قائمة الخدمات المتضمنة ===== */
.included-list{display:grid;grid-template-columns:1fr;gap:var(--space-3)}
@media(min-width:640px){ .included-list{grid-template-columns:repeat(2,1fr)} }
.included-item{
  display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-sm);padding:var(--space-4);font-weight:600;
}
.included-item.is-link{transition:border-color .15s ease}
.included-item.is-link:hover{border-color:var(--water)}
.included-item .icon-service{color:var(--water);flex-shrink:0}
.included-item .arrow{margin-inline-start:auto;color:var(--text-muted);font-size:.85rem}

/* ===== مسار تنفيذ الطلب (Timeline متصل) ===== */
.process-path{display:flex;flex-direction:column;gap:0;max-width:760px;margin:0 auto}
.process-step{display:flex;gap:var(--space-4);position:relative;padding-bottom:var(--space-6)}
.process-step:last-child{padding-bottom:0}
.process-marker{display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.process-marker .dot{
  width:36px;height:36px;border-radius:50%;background:var(--water);color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:800;font-size:.95rem;flex-shrink:0;
}
.process-step:not(:last-child) .process-marker::after{
  content:"";flex:1;width:2px;background:var(--water-line);margin-top:6px;min-height:32px;
}
.process-content h3{font-size:1.02rem;margin-bottom:4px}
.process-content p{color:var(--text-muted);font-size:.92rem;margin:0}

/* ===== اختيار نوع الموقع (شبكة غير متطابقة) ===== */
.property-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}
@media(min-width:640px){ .property-grid{grid-template-columns:repeat(3,1fr)} }
@media(min-width:900px){
  .property-grid{grid-template-columns:2fr 1.4fr 1.4fr 1.4fr 1.4fr 1.6fr}
}
.property-tile{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:var(--space-4) var(--space-3);text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;
}
.property-tile .icon-service{color:var(--water)}
.property-tile span{font-weight:700;font-size:.88rem;color:var(--ink-soft)}

/* ===== وحدة عوامل السعر ===== */
.pricing-unit{
  background:var(--ink);color:#fff;border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;
}
.pricing-unit h2{color:#fff}
.pricing-factors{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);margin:var(--space-5) 0}
.pricing-factor{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:999px;
  padding:8px 16px;font-size:.88rem;
}

/* ===== FAQ ===== */
.faq-list{max-width:760px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--border)}
.faq-question{
  display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:700;gap:10px;
  background:none;border:none;width:100%;text-align:right;font-size:.98rem;color:var(--ink);padding:14px 4px;
}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .25s ease}
.faq-answer p{padding:0 4px 14px;color:var(--text-muted);margin:0}
.faq-item.open .faq-answer{max-height:400px}
.faq-toggle-icon{transition:transform .2s ease;flex-shrink:0;color:var(--water)}
.faq-item.open .faq-toggle-icon{transform:rotate(45deg)}

/* ===== CTA نهائي ===== */
.final-cta{
  background:linear-gradient(135deg,var(--ink) 0%,var(--water) 130%);
  border-radius:var(--radius-lg);padding:var(--space-6);color:#fff;text-align:center;
}
.final-cta h2{color:#fff}
.final-cta p{color:#dcebe9}
.final-cta .hero-actions{justify-content:center}

/* ===== Breadcrumbs ===== */
.breadcrumbs{padding:12px 0;font-size:.85rem;color:var(--text-muted)}
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:6px}
.breadcrumbs li:not(:last-child)::after{content:"/";margin-inline-start:6px;color:var(--border-strong)}
.breadcrumbs a{color:var(--water)}

/* ===== الفوتر ===== */
.site-footer{background:var(--ink);color:#c9d6dc;margin-top:var(--space-6)}
.footer-inner{display:grid;grid-template-columns:1fr;gap:var(--space-5);padding:var(--space-6) 0}
@media(min-width:768px){ .footer-inner{grid-template-columns:1.4fr 1fr 1fr 1fr} }
.footer-col h2{color:#fff;font-size:1.05rem}
.footer-col h3{color:#fff;font-size:.95rem}
.footer-col a{display:block;padding:3px 0;color:#a9c0c5;font-size:.92rem}
.footer-col a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:12px 0;font-size:.8rem;color:#7f96a0}

/* ===== الشريط السفلي الثابت (موبايل) ===== */
.mobile-sticky-bar{
  position:fixed;bottom:0;right:0;left:0;height:var(--sticky-bar-height);
  background:#fff;border-top:1px solid var(--border);display:flex;z-index:200;
  box-shadow:0 -6px 20px rgba(0,0,0,.08);
}
.sticky-btn{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  font-size:.76rem;font-weight:700;
}
.sticky-call{color:var(--accent)}
.sticky-whatsapp{color:var(--whatsapp-hover)}
.sticky-form{color:var(--water)}
@media(min-width:900px){ .mobile-sticky-bar{display:none} body{padding-bottom:0} }

/* ===== أيقونات SVG محلية عبر CSS Mask (بلا مكتبة خارجية) ===== */
.icon-phone,.icon-whatsapp,.icon-form,.icon-service{
  width:18px;height:18px;display:inline-block;flex-shrink:0;
  background-color:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
}
.icon-phone{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.6 10.8c1.4 2.7 3.6 4.9 6.3 6.3l2.1-2.1c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1v3.4c0 .6-.4 1-1 1C10.5 20.8 3.2 13.5 3.2 4.5c0-.6.4-1 1-1H7.6c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1L6.6 10.8z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.6 10.8c1.4 2.7 3.6 4.9 6.3 6.3l2.1-2.1c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1v3.4c0 .6-.4 1-1 1C10.5 20.8 3.2 13.5 3.2 4.5c0-.6.4-1 1-1H7.6c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1L6.6 10.8z'/></svg>");
}
.icon-whatsapp{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3.2c-4.8 0-8.7 3.9-8.7 8.7 0 1.5.4 3 1.1 4.2L3.2 20.8l4.8-1.2c1.2.6 2.6 1 4 1 4.8 0 8.7-3.9 8.7-8.7S16.8 3.2 12 3.2zm0 15.9c-1.3 0-2.6-.3-3.7-1l-.3-.1-2.8.7.7-2.7-.2-.3c-.8-1.2-1.2-2.6-1.2-4 0-3.9 3.2-7.1 7.1-7.1s7.1 3.2 7.1 7.1-3.1 7.4-7.1 7.4zm3.9-5.3c-.2-.1-1.3-.6-1.5-.7-.2-.1-.3-.1-.5.1-.1.2-.5.7-.7.8-.1.2-.2.2-.4.1-.2-.1-.9-.3-1.7-1-.6-.6-1-1.2-1.2-1.5-.1-.2 0-.3.1-.4.1-.1.2-.2.3-.4.1-.1.2-.2.2-.4.1-.2 0-.3 0-.4-.1-.1-.5-1.2-.7-1.6-.2-.4-.3-.4-.5-.4h-.4c-.2 0-.4.1-.6.3-.2.2-.8.8-.8 1.9s.8 2.2.9 2.4c.1.2 1.6 2.5 3.9 3.4.5.2 1 .4 1.3.5.5.2 1 .1 1.4.1.4-.1 1.3-.5 1.5-1.1.2-.5.2-.9.1-1z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3.2c-4.8 0-8.7 3.9-8.7 8.7 0 1.5.4 3 1.1 4.2L3.2 20.8l4.8-1.2c1.2.6 2.6 1 4 1 4.8 0 8.7-3.9 8.7-8.7S16.8 3.2 12 3.2zm0 15.9c-1.3 0-2.6-.3-3.7-1l-.3-.1-2.8.7.7-2.7-.2-.3c-.8-1.2-1.2-2.6-1.2-4 0-3.9 3.2-7.1 7.1-7.1s7.1 3.2 7.1 7.1-3.1 7.4-7.1 7.4zm3.9-5.3c-.2-.1-1.3-.6-1.5-.7-.2-.1-.3-.1-.5.1-.1.2-.5.7-.7.8-.1.2-.2.2-.4.1-.2-.1-.9-.3-1.7-1-.6-.6-1-1.2-1.2-1.5-.1-.2 0-.3.1-.4.1-.1.2-.2.3-.4.1-.1.2-.2.2-.4.1-.2 0-.3 0-.4-.1-.1-.5-1.2-.7-1.6-.2-.4-.3-.4-.5-.4h-.4c-.2 0-.4.1-.6.3-.2.2-.8.8-.8 1.9s.8 2.2.9 2.4c.1.2 1.6 2.5 3.9 3.4.5.2 1 .4 1.3.5.5.2 1 .1 1.4.1.4-.1 1.3-.5 1.5-1.1.2-.5.2-.9.1-1z'/></svg>");
}
.icon-form{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 2h8l5 5v13a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm7 1.5V8h4.5L14 3.5zM8 12h8v1.6H8V12zm0 3.6h8v1.6H8v-1.6zm0-7.2h4v1.6H8V8.4z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 2h8l5 5v13a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm7 1.5V8h4.5L14 3.5zM8 12h8v1.6H8V12zm0 3.6h8v1.6H8v-1.6zm0-7.2h4v1.6H8V8.4z'/></svg>");
}
.icon-service{width:24px;height:24px}
.icon-service.icon-truck{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 6h11v9H3zm11 3h4l3 3v3h-7zM6.5 20a1.8 1.8 0 1 1 0-3.6 1.8 1.8 0 0 1 0 3.6zm11 0a1.8 1.8 0 1 1 0-3.6 1.8 1.8 0 0 1 0 3.6z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 6h11v9H3zm11 3h4l3 3v3h-7zM6.5 20a1.8 1.8 0 1 1 0-3.6 1.8 1.8 0 0 1 0 3.6zm11 0a1.8 1.8 0 1 1 0-3.6 1.8 1.8 0 0 1 0 3.6z'/></svg>");
}
.icon-service.icon-pump{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2a5 5 0 0 0-5 5v3H4v2h3v2a5 5 0 0 0 10 0v-2h3v-2h-3V7a5 5 0 0 0-5-5zm0 2a3 3 0 0 1 3 3v9a3 3 0 0 1-6 0V7a3 3 0 0 1 3-3z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2a5 5 0 0 0-5 5v3H4v2h3v2a5 5 0 0 0 10 0v-2h3v-2h-3V7a5 5 0 0 0-5-5zm0 2a3 3 0 0 1 3 3v9a3 3 0 0 1-6 0V7a3 3 0 0 1 3-3z'/></svg>");
}
.icon-service.icon-pipe{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 4h4v9a3 3 0 0 0 3 3h6v4h-4v-2h-2a5 5 0 0 1-5-5V4zm10 0h6v6h-2V6h-4V4z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 4h4v9a3 3 0 0 0 3 3h6v4h-4v-2h-2a5 5 0 0 1-5-5V4zm10 0h6v6h-2V6h-4V4z'/></svg>");
}
.icon-service.icon-sink{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 11h18v2a6 6 0 0 1-6 6H9a6 6 0 0 1-6-6v-2zm8-7h2v3h-2zM7 5.5l1.4-1.4L10 5.7 8.6 7.1zM17 5.5L15.6 7.1 14 5.7l1.6-1.6z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 11h18v2a6 6 0 0 1-6 6H9a6 6 0 0 1-6-6v-2zm8-7h2v3h-2zM7 5.5l1.4-1.4L10 5.7 8.6 7.1zM17 5.5L15.6 7.1 14 5.7l1.6-1.6z'/></svg>");
}
.icon-service.icon-shower{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M17 3a4 4 0 0 0-4 4v1H8a5 5 0 0 0-5 5h2a3 3 0 0 1 3-3h9a3 3 0 0 1 3 3h2a5 5 0 0 0-5-5h-1V7a2 2 0 0 1 2-2 1 1 0 0 0 0-2zM6 16.5a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm4 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm4 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm4 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M17 3a4 4 0 0 0-4 4v1H8a5 5 0 0 0-5 5h2a3 3 0 0 1 3-3h9a3 3 0 0 1 3 3h2a5 5 0 0 0-5-5h-1V7a2 2 0 0 1 2-2 1 1 0 0 0 0-2zM6 16.5a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm4 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm4 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm4 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z'/></svg>");
}
.icon-service.icon-drop{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2C9 7 5 11.5 5 15.5A7 7 0 0 0 19 15.5C19 11.5 15 7 12 2z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2C9 7 5 11.5 5 15.5A7 7 0 0 0 19 15.5C19 11.5 15 7 12 2z'/></svg>");
}
.icon-service.icon-slowflow{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 12c2 0 2-4 4-4s2 4 4 4 2-4 4-4 2 4 4 4M3 17c2 0 2-3 4-3s2 3 4 3 2-3 4-3 2 3 4 3' stroke='currentColor' stroke-width='1.8' fill='none' stroke-linecap='round'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 12c2 0 2-4 4-4s2 4 4 4 2-4 4-4 2 4 4 4M3 17c2 0 2-3 4-3s2 3 4 3 2-3 4-3 2 3 4 3' stroke='currentColor' stroke-width='1.8' fill='none' stroke-linecap='round'/></svg>");
}
.icon-service.icon-backflow{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 6h12a4 4 0 0 1 4 4v2M20 12l-3-3m3 3l-3 3M4 18h12a4 4 0 0 0 4-4' stroke='currentColor' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 6h12a4 4 0 0 1 4 4v2M20 12l-3-3m3 3l-3 3M4 18h12a4 4 0 0 0 4-4' stroke='currentColor' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
.icon-service.icon-smell{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 20c3-2 3-5 1-7s-3-5 0-8M12 20c3-2 3-5 1-7s-3-5 0-8M18 20c3-2 3-5 1-7s-3-5 0-8' stroke='currentColor' stroke-width='1.8' fill='none' stroke-linecap='round'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 20c3-2 3-5 1-7s-3-5 0-8M12 20c3-2 3-5 1-7s-3-5 0-8M18 20c3-2 3-5 1-7s-3-5 0-8' stroke='currentColor' stroke-width='1.8' fill='none' stroke-linecap='round'/></svg>");
}
.icon-service.icon-home{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3 3 10v11h6v-6h6v6h6V10z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3 3 10v11h6v-6h6v6h6V10z'/></svg>");
}
.icon-service.icon-villa{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 21V11l9-6 9 6v10h-6v-5H9v5z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 21V11l9-6 9 6v10h-6v-5H9v5z'/></svg>");
}
.icon-service.icon-building{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 21V4h9v17H5zm9-13h5v13h-5M8 7h2M8 10h2M8 13h2M8 16h2'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 21V4h9v17H5zm9-13h5v13h-5M8 7h2M8 10h2M8 13h2M8 16h2'/></svg>");
}
.icon-service.icon-shop{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 9l1-5h16l1 5v2a3 3 0 0 1-3 3 3 3 0 0 1-3-3 3 3 0 0 1-3 3 3 3 0 0 1-3-3 3 3 0 0 1-3 3 3 3 0 0 1-3-3V9zm2 5v7h14v-7'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 9l1-5h16l1 5v2a3 3 0 0 1-3 3 3 3 0 0 1-3-3 3 3 0 0 1-3 3 3 3 0 0 1-3-3 3 3 0 0 1-3 3 3 3 0 0 1-3-3V9zm2 5v7h14v-7'/></svg>");
}
.icon-service.icon-restaurant{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 2v8a2 2 0 0 0 4 0V2M8 10v12M17 2c-2 0-3 2-3 5s1 4 2 4v11'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 2v8a2 2 0 0 0 4 0V2M8 10v12M17 2c-2 0-3 2-3 5s1 4 2 4v11'/></svg>");
}
.icon-service.icon-commercial{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 21V9l9-6 9 6v12H3zm5-8h2v6H8zm3 0h2v6h-2zm3 0h2v6h-2z'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 21V9l9-6 9 6v12H3zm5-8h2v6H8zm3 0h2v6h-2zm3 0h2v6h-2z'/></svg>");
}
.icon-service.icon-check{
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 12l5 5L20 6' stroke='currentColor' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 12l5 5L20 6' stroke='currentColor' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

/* ===== إشعار الخصوصية الخفيف ===== */
.consent-banner{
  position:fixed;bottom:calc(var(--sticky-bar-height) + 8px);right:12px;left:12px;z-index:250;
  background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow);
  display:none;
}
.consent-banner.visible{display:flex;flex-direction:column;gap:10px}
.consent-banner p{margin:0;font-size:.85rem;color:var(--text)}
@media(min-width:900px){ .consent-banner{bottom:16px;left:auto;max-width:380px} }
.consent-actions{display:flex;gap:8px}
.consent-actions .btn{flex:1;min-height:40px;font-size:.85rem;padding:8px 10px}

/* ===== قوائم النقاط العامة (تُستخدم في صفحات الثقة) ===== */
.check-list li{position:relative;padding-inline-start:26px;margin-bottom:10px}
.check-list li::before{content:"";position:absolute;right:0;top:4px;width:16px;height:16px;background-color:var(--water);
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 12l5 5L20 6' stroke='black' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 12l5 5L20 6' stroke='black' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;
}

/* ===== توافق مؤقت لصفحات لم تُهاجَر بعد لنظام التصميم الجديد ===== */
.services-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:640px){ .services-grid{grid-template-columns:repeat(2,1fr)} }
@media(min-width:1024px){ .services-grid{grid-template-columns:repeat(3,1fr)} }
.service-card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:22px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:10px;
}
.service-card h3{font-size:1.1rem;color:var(--ink)}
.service-card .btn-outline{margin-top:auto;align-self:flex-start}
.icon-badge{
  width:48px;height:48px;border-radius:10px;background:var(--water);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1.3rem;
}
.steps-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:768px){ .steps-grid{grid-template-columns:repeat(4,1fr)} }
.step-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;text-align:center}
.step-num{
  width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:800;margin:0 auto 10px;
}
.coverage-tags{display:flex;flex-wrap:wrap;gap:8px}
.coverage-tag{background:var(--surface-alt);border:1px solid var(--border);padding:6px 12px;border-radius:999px;font-size:.85rem}

/* ===== حالات مساعدة ===== */
.text-center{text-align:center}
.mt-lg{margin-top:32px}
.grid-2{display:grid;grid-template-columns:1fr;gap:24px}
@media(min-width:900px){ .grid-2{grid-template-columns:1fr 1fr} }