/*
Theme Name: Khadamat Monthly
Author: Khadamat Monthly
Description: قالب عربي لخدمات الخادمات بالشهر في مدن المملكة مع رقم اتصال وواتساب مستقل لكل صفحة ومقالة.
Version: 2.2.0
Text Domain: khadamat-monthly
*/
:root{--gold:#a88750;--dark:#171713;--cream:#f7f2e9;--ink:#302c25;--green:#5e7041}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Tahoma,Arial,sans-serif;direction:rtl;color:var(--ink);line-height:1.9;background:#fff}a{text-decoration:none;color:inherit}.wrap{width:min(1180px,92%);margin:auto}
.top{background:#171713;color:#eee;padding:7px 0;font-size:14px}.top .wrap,.nav{display:flex;align-items:center;justify-content:space-between;gap:20px}.site-head{background:#fff;position:sticky;top:0;z-index:50;box-shadow:0 2px 15px #00000012}.nav{min-height:86px}.logo img{display:block;max-height:70px;width:auto;object-fit:contain}.menu{display:flex;gap:23px;font-weight:700}.call{background:var(--gold);color:#fff;padding:11px 20px;border-radius:999px;font-weight:800}
.hero{min-height:670px;display:flex;align-items:center;color:#fff;background:linear-gradient(90deg,#0009,#0003),none center/cover no-repeat}.hero-box{max-width:680px;padding:55px 0}.eyebrow{color:#f0d9ad;font-weight:800}.hero h1{font-size:54px;line-height:1.25;margin:12px 0}.hero p{font-size:20px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.btn{display:inline-block;padding:12px 23px;border-radius:999px;font-weight:800}.btn-gold{background:var(--gold);color:#fff}.btn-light{background:#fff;color:#222}.section{padding:75px 0}.section.alt{background:var(--cream)}.title{text-align:center;max-width:780px;margin:0 auto 38px}.title h2{font-size:36px;margin:0}.title p{color:#746d63}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 10px 35px #4e402315}.card img{width:100%;height:220px;object-fit:cover}.card-body{padding:22px}.card h3{margin:0 0 8px;color:#403623}.cities{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.city{padding:25px 15px;background:#fff;border:1px solid #eadfcd;border-radius:14px;text-align:center;font-weight:800}.why{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}.why img{width:100%;border-radius:22px}.checks{display:grid;grid-template-columns:1fr 1fr;gap:12px}.check{background:#fff;padding:14px;border-radius:12px;border:1px solid #eadfcd}.cta{background:linear-gradient(120deg,#211d17,#5b4a31);color:#fff;text-align:center}.cta h2{font-size:39px;margin:0}.article{width:min(900px,92%);margin:45px auto}.article h1{font-size:42px;line-height:1.3}.article-content{font-size:18px}.article-content img{max-width:100%;height:auto}.post-contact{margin:30px 0;padding:25px;border-radius:18px;background:var(--cream);text-align:center;border:1px solid #e5d5bc}.post-contact h3{margin-top:0}.footer{background:#151511;color:#cfc8bc;padding:45px 0 25px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.footer img{max-height:70px}.copy{border-top:1px solid #ffffff20;margin-top:30px;padding-top:20px;text-align:center}.floating{position:fixed;bottom:20px;left:20px;display:flex;flex-direction:column;gap:10px;z-index:70}.float{width:57px;height:57px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:23px;box-shadow:0 8px 25px #0004}.phone{background:var(--gold)}.wa{background:#25D366}
@media(max-width:850px){.menu{display:none}.hero{min-height:580px}.hero h1{font-size:40px}.cards,.cities{grid-template-columns:1fr 1fr}.why,.footer-grid{grid-template-columns:1fr}.article h1{font-size:34px}}
@media(max-width:520px){.cards,.cities,.checks{grid-template-columns:1fr}.hero h1{font-size:34px}.logo img{max-height:58px}.call{padding:8px 13px}.top{font-size:12px}}

/* V4 speed + accessibility */
img{max-width:100%;height:auto}
.card img{aspect-ratio:450/318;height:auto;object-fit:cover}
.why img{aspect-ratio:1600/893;object-fit:cover}
.city,.btn,.call,.float{min-height:44px}
.city{display:flex;align-items:center;justify-content:center}
.hero{background-image:linear-gradient(90deg,#0009,#0003),none}

/* V7 audit fixes */
body{overflow-x:hidden}
img{max-width:100%;height:auto}
.card img{width:100%;aspect-ratio:450/318;object-fit:cover}
.why img{width:100%;aspect-ratio:1200/670;object-fit:cover}
a:focus-visible,button:focus-visible{outline:3px solid #7b5b28;outline-offset:3px}
.top{color:#fff}
.title p{color:#625b52}
.footer{color:#e4ded5}
.menu a,.city,.btn,.call{min-height:44px;display:inline-flex;align-items:center}
.menu a{padding:10px 3px}
.city{justify-content:center}


/* V13 homepage excerpt + floating contact buttons */
.home-seo-intro{gap:48px}.home-seo-copy h2{font-size:38px;line-height:1.45;margin:8px 0 18px}.home-seo-copy p{margin:0 0 14px}.home-seo-image img{width:100%;aspect-ratio:450/318;object-fit:cover;border-radius:22px;box-shadow:0 18px 45px #4e402326}.home-wa-btn{background:#25D366;color:#fff}
.floating{bottom:22px;left:20px;gap:9px;align-items:flex-start}.float{width:auto;height:54px;min-width:148px;padding:0 18px;border-radius:999px;gap:10px;font-size:16px;font-weight:800;justify-content:flex-start;box-shadow:0 8px 22px #00000030;transition:transform .2s ease,box-shadow .2s ease}.float:hover{transform:translateY(-2px);box-shadow:0 11px 26px #00000038}.float-icon{width:26px;height:26px;display:grid;place-items:center;flex:0 0 26px}.float-icon svg{width:25px;height:25px;fill:#fff;display:block}.phone{background:var(--gold)}.wa{background:#25D366}
@media(max-width:850px){.home-seo-intro{gap:28px}.home-seo-copy h2{font-size:31px}}
@media(max-width:520px){.home-seo-copy h2{font-size:28px}.home-seo-image{order:-1}.floating{left:14px;bottom:18px}.float{height:50px;min-width:132px;padding:0 14px;font-size:14px}.float-icon{width:23px;height:23px;flex-basis:23px}.float-icon svg{width:22px;height:22px}}

/* V13.2 mobile hardening: prevent legacy/custom CSS from shrinking floating buttons */
.floating .float{
  width:auto !important;
  height:54px !important;
  min-width:148px !important;
  max-width:none !important;
  padding:0 18px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  white-space:nowrap !important;
  overflow:visible !important;
  line-height:1 !important;
}
.floating .float > span:last-child{display:inline-block !important;white-space:nowrap !important}

/* Keep post/page content inside the viewport, including old editor content */
.article,.article article,.article-content{max-width:100%;min-width:0}
.article-content{overflow-wrap:anywhere;word-break:normal}
.article-content img,.article-content figure,.article-content .wp-caption,.article-content .wp-block-image,
.article-content iframe,.article-content video,.article-content embed,.article-content object{
  max-width:100% !important;
}
.article-content img{height:auto !important}
.article-content figure,.article-content .wp-caption,.article-content .wp-block-image{
  width:auto !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-content table{display:block;max-width:100%;overflow-x:auto}
.article-content pre{max-width:100%;overflow-x:auto;white-space:pre-wrap}

@media(max-width:520px){
  .article{width:92% !important;margin:28px auto !important;overflow:hidden}
  .article article,.article-content{width:100% !important;max-width:100% !important;overflow:hidden}
  .article-content > *{max-width:100% !important}
  .floating{left:14px !important;right:auto !important;bottom:18px !important;align-items:flex-start !important}
  .floating .float{height:50px !important;min-width:132px !important;padding:0 14px !important;font-size:14px !important}
}


/* V13.3 floating buttons — style 4: rounded squares, icon only */
.floating{align-items:center !important;gap:10px !important}
.floating .float{
  width:62px !important;height:62px !important;min-width:62px !important;max-width:62px !important;
  padding:0 !important;border-radius:18px !important;display:flex !important;
  align-items:center !important;justify-content:center !important;overflow:hidden !important;
  box-shadow:0 8px 22px #00000030 !important;
}
.floating .float-icon{width:32px !important;height:32px !important;flex:0 0 32px !important}
.floating .float-icon svg{width:31px !important;height:31px !important;fill:#fff !important}
@media(max-width:520px){
 .floating .float{width:58px !important;height:58px !important;min-width:58px !important;max-width:58px !important;border-radius:17px !important}
 .floating .float-icon{width:30px !important;height:30px !important;flex-basis:30px !important}
 .floating .float-icon svg{width:29px !important;height:29px !important}
}

/* V13.4 — guaranteed white icons for style 4 floating buttons */
.floating .float .float-icon{display:none !important}
.floating .float::before{
  content:"" !important;
  display:block !important;
  width:32px !important;
  height:32px !important;
  flex:0 0 32px !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  background-size:contain !important;
}
.floating .wa::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M16 3a12.8 12.8 0 0 0-11 19.3L3.5 28.5l6.4-1.7A12.9 12.9 0 1 0 16 3Zm0 23.4c-2 0-3.9-.5-5.6-1.5l-.4-.2-3.8 1 1-3.7-.2-.4A10.5 10.5 0 1 1 16 26.4Zm5.8-7.9c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-.9 1.2-.2.2-.3.2-.7.1-1.8-.9-3-1.6-4.2-3.7-.3-.6.3-.6.9-1.4.1-.2.2-.4.3-.6.1-.2 0-.4 0-.6-.1-.2-.7-1.8-1-2.4-.3-.6-.5-.5-.7-.5h-.6c-.2 0-.6.1-.9.4-.3.3-1.2 1.2-1.2 3 0 1.8 1.3 3.5 1.5 3.7.2.2 2.6 4 6.3 5.6 2.3 1 3.2 1.1 4.4.9.7-.1 1.9-.8 2.2-1.5.3-.7.3-1.3.2-1.5-.1-.2-.3-.3-.7-.5Z'/%3E%3C/svg%3E") !important;
}
.floating .phone::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M6.6 10.8c1.7 3.4 3.2 4.9 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1l-2.3 2.2Z'/%3E%3C/svg%3E") !important;
}
@media(max-width:520px){
  .floating .float::before{width:29px !important;height:29px !important;flex-basis:29px !important}
}

/* V13.5: icon source is ::before only; footer contains no duplicate inline SVG */

/* V13.6 Accessibility improvements */
:root{--gold:#7b5b28}
/* WCAG-friendly text contrast on gold buttons and accents */
.call,.btn-gold,.phone{background:#7b5b28;color:#fff}
.eyebrow{color:#f4dfb8}
/* Keep interactive targets comfortably tappable */
a.call,.btn,.city,.floating .float{min-height:48px}
.footer a{display:inline-block;min-height:44px;padding-block:7px}
/* Strong keyboard focus without changing normal appearance */
a:focus-visible,button:focus-visible{outline:3px solid #111;outline-offset:3px}
/* Floating controls: accessible 58x58 targets with one icon each */
.floating .float{width:58px !important;height:58px !important;min-width:58px !important;max-width:58px !important;min-height:58px !important;padding:0 !important}
/* Avoid adjacent inline links becoming undersized touch targets on mobile */
@media(max-width:850px){
  .actions{gap:14px}
  .actions .btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center}
  .top .wrap{gap:12px}
}


/* V13.7 targeted Lighthouse accessibility + LCP fixes */
:root{--gold:#76531f;--wa:#08783f}
.call,.btn-gold,.phone{background:var(--gold) !important;color:#fff !important}
.wa,.home-wa-btn{background:var(--wa) !important;color:#fff !important}
.eyebrow{color:#fff !important;text-shadow:0 1px 3px #000}
.title p{color:#514b43}
.footer{color:#f2eee8}
.footer a{color:#fff}
/* Every navigational/control target gets a comfortable target box */
.logo{min-width:48px;min-height:48px;display:inline-flex;align-items:center;justify-content:center}
.menu a{min-height:48px;padding:11px 8px}
.footer a{min-height:48px;padding:10px 4px}
.actions .btn,.call,.city{min-height:48px;min-width:48px}
/* Do not let adjacent footer links collapse into tiny targets */
.footer p{margin:.35em 0}

/* V13.8 exact Lighthouse targets */
.menu{gap:10px}
.menu a{min-width:48px;min-height:48px;padding:12px 14px}
.btn-light{background:#fff !important;color:#111 !important}
.btn-gold,.call{background:#5b3b0d !important;color:#fff !important}
.home-wa-btn{background:#006b35 !important;color:#fff !important}

/* V13.9.2 mobile homepage image safeguard */
@media (max-width:767px){
  body.home .card img,body.home .why img{display:block;width:100%;max-width:100%;height:auto;object-fit:cover}
  body.home .cards{grid-template-columns:1fr}
  body.home .why{grid-template-columns:1fr}
  body.home .hero{min-height:560px;background-position:center center;background-size:cover}
}

/* V14 navigation: WordPress menu + accessible mobile menu. */
.sa-menu-list{display:flex;align-items:center;gap:10px;list-style:none;margin:0;padding:0}
.sa-menu-list a{min-width:48px;min-height:48px;padding:12px 14px;display:inline-flex;align-items:center;justify-content:center;font-weight:700}
.menu-toggle{display:none;min-height:48px;border:1px solid #e6dccd;background:#fff;color:#222;border-radius:12px;padding:9px 13px;font:inherit;font-weight:800;cursor:pointer}
.navigation.pagination{margin:35px 0}.nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.page-numbers{min-width:44px;min-height:44px;padding:10px 13px;border:1px solid #e5d5bc;border-radius:10px;display:inline-flex;align-items:center;justify-content:center}.page-numbers.current{background:#5b3b0d;color:#fff}
@media(max-width:850px){
 .nav{position:relative;gap:10px}
 .menu-toggle{display:inline-flex;align-items:center;gap:7px}
 .menu{display:none;position:absolute;top:calc(100% - 4px);right:4%;left:4%;background:#fff;border:1px solid #eadfcd;border-radius:15px;box-shadow:0 12px 30px #0002;padding:10px;z-index:90}
 .menu.is-open{display:block}
 .sa-menu-list{display:flex;flex-direction:column;align-items:stretch;gap:2px}
 .sa-menu-list li,.sa-menu-list a{width:100%}
 .sa-menu-list a{justify-content:flex-start;padding:12px 14px}
}
@media(max-width:520px){.menu-toggle span{display:none}.site-head .call{padding-inline:13px}.logo img{max-width:64px;height:auto;object-fit:contain}}

/* V14.3 performance/cities: only Riyadh, Jeddah and Dammam. */
body.home #cities .cities{grid-template-columns:repeat(3,1fr)}
@media(max-width:850px){body.home #cities .cities{grid-template-columns:1fr}}

/* V14.7 safe media sizing: preserve intrinsic ratios without changing layout boxes. */
.logo img,.custom-logo{height:auto;object-fit:contain}.footer img{width:auto;height:auto}.home-seo-image img,.why img{height:auto}

/* Monthly housekeeping identity and responsive refinements */
:root{--gold:#17645b;--cream:#f6f3ed;--ink:#243e39}
.brand .logo{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:700;color:#17645b}.brand small{display:block;font-size:12px;font-weight:400;color:#5d6965}.brand img{width:58px;height:58px}.hero{background-image:linear-gradient(90deg,rgba(12,34,29,.08),rgba(12,34,29,.86)),none}.hero-box{max-width:580px}.hero .actions{justify-content:flex-start!important}.hero .btn-gold{background:#fff!important;color:#174c43!important}.hero .btn:not(.btn-gold){background:#17645b!important}.section .eyebrow{color:#17645b}.cta{background:#174c43}.faq{max-width:850px}.faq details{border-bottom:1px solid #d9e0dc;padding:20px 0}.faq summary{font-size:19px;font-weight:700;cursor:pointer}.image-note{font-size:12px;opacity:.8;margin-top:28px}.footer{padding-bottom:140px}section[id],footer[id]{scroll-margin-top:110px}
@media(max-width:600px){.brand .logo{font-size:17px;gap:7px}.brand img{width:42px;height:42px}.brand small{font-size:10px}.nav{gap:8px;flex-wrap:wrap;padding:10px 0}.top .wrap{flex-wrap:wrap;gap:0}.hero h1{font-size:38px}.hero{background-position:35% center}.section{padding:48px 0}.title h2{font-size:28px}.hero-box{padding:40px 0}.hero p{font-size:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.service-link{display:inline-block;color:#17645b;font-weight:700;padding:10px 0;min-height:44px}.city-services .card-body{padding:24px}.city-services .card h3{font-size:22px}.availability{text-align:center;color:#58665f;font-size:14px;margin-top:28px}

.booking-wrap{max-width:900px}.booking-form{display:grid;grid-template-columns:1fr 1fr;gap:20px;background:#fff;padding:32px;border-radius:22px;border:1px solid #e3e8e4;box-shadow:0 12px 35px #173e3910}.booking-form[hidden]{display:none}.booking-field label{display:block;font-weight:700;margin-bottom:7px}.booking-field input,.booking-field select{width:100%;min-height:50px;border:1px solid #9aaba3;border-radius:10px;padding:12px;font:inherit;color:#243e39;background:white}.booking-field input:focus,.booking-field select:focus{outline:3px solid #17645b44;border-color:#17645b}.booking-wide{grid-column:1/-1}.booking-note{font-size:14px;color:#52655d;margin-top:0}.booking-submit{border:0;background:#17645b;color:white;font:inherit;font-weight:700;cursor:pointer;min-height:50px}.booking-form [role=status]:empty{display:none}@media(max-width:600px){.booking-form{grid-template-columns:1fr;padding:20px;gap:16px}.booking-submit{width:100%}}

/* Review fixes: readable section captions and navigation on compact screens. */
.section .eyebrow{color:#17645b!important;text-shadow:none}.hero .eyebrow{color:#f4dfb8!important;text-shadow:none}
.brand .custom-logo{max-width:160px;max-height:64px;width:auto;height:auto}.brand{flex-shrink:0}
.booking-field{min-width:0}.booking-direct{text-align:center}.booking-direct a{text-decoration:underline;color:#17645b;padding:10px;display:inline-block}
.skip-link{position:absolute;top:-150px;right:16px;z-index:1000;padding:12px 20px;background:white;color:#174c43}.skip-link:focus{top:12px}
@media(min-width:851px) and (max-width:1100px){.nav{position:relative}.menu-toggle{display:inline-flex;align-items:center;gap:7px}.menu{display:none;position:absolute;top:100%;right:0;left:0;background:white;border:1px solid #eadfcd;border-radius:15px;padding:10px;box-shadow:0 12px 30px #0002}.menu.is-open{display:block}.sa-menu-list{flex-direction:column;align-items:stretch}.sa-menu-list li,.sa-menu-list a{width:100%}.sa-menu-list a{justify-content:flex-start}}
@media(max-width:767px){body.home .hero{background-position:35% center}.floating{bottom:12px;left:12px}.floating .float{width:48px!important;height:48px!important;min-width:48px!important;max-width:48px!important;min-height:48px!important}}

@media(max-width:767px){body.home .hero{background-image:linear-gradient(90deg,rgba(12,34,29,.50),rgba(12,34,29,.86)),none}}

/* Hero discovery and contrast: real eager image, responsive source, constant dark overlay. */
.hero{position:relative;isolation:isolate;background:#12342b!important;overflow:hidden}.hero-picture{position:absolute;inset:0;z-index:-2;display:block}.hero img.hero-media{display:block;width:100%;height:100%;object-fit:cover}.hero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(12,34,29,.18),rgba(12,34,29,.90))}.hero .wrap{position:relative}.brand .custom-logo{width:64px;height:64px;max-width:64px;object-fit:contain}.hero .eyebrow{color:#fff!important}.booking-field input::placeholder{color:#52635d;opacity:1}
@media(max-width:767px){.hero:before{background:rgba(12,34,29,.76)}.hero img.hero-media{object-position:center}.brand .custom-logo{width:48px;height:48px}.hero .eyebrow{font-size:14px}}
