/*
Theme Name: Shirka Siana Khas
Theme URI: https://al-khairworkshop.online/
Author: Shirka Siana Khas
Author URI: https://al-khairworkshop.online/
Description: Arabic RTL WordPress theme for washing machine and dishwasher repair service in Jeddah, Saudi Arabia. Includes professional hero banner, call, WhatsApp, location, brand section, service images, and responsive Saudi-market design.
Version: 1.1.0
Requires at least: 5.8
Tested up to: 6.6
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shirka-siana-khas
Tags: rtl-language-support, custom-logo, one-column, responsive-layout, business, services
*/

:root{
  --blue:#082d61;
  --blue-2:#0b4ea2;
  --blue-3:#0e6ed0;
  --orange:#ff8a00;
  --orange-2:#ffb44d;
  --green:#18b65b;
  --ink:#101828;
  --muted:#667085;
  --bg:#f5f8fc;
  --white:#ffffff;
  --border:#e5edf8;
  --shadow:0 24px 70px rgba(8,45,97,.15);
  --radius:28px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Cairo','Tajawal',Arial,sans-serif;direction:rtl;text-align:right;color:var(--ink);background:var(--bg);line-height:1.75}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}.container{width:min(1180px,calc(100% - 32px));margin-inline:auto}

.topbar{background:linear-gradient(90deg,#061b3f,#0b4ea2,#061b3f);color:#fff;font-weight:800;font-size:15px;border-bottom:3px solid var(--orange)}
.topbar .container{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 0;flex-wrap:wrap}.topbar a{display:inline-flex;align-items:center;gap:8px}.icon{width:21px;height:21px;display:inline-block;vertical-align:middle;flex:0 0 auto}.icon-lg{width:30px;height:30px}

.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(8,45,97,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:13px 0}.logo-wrap{display:flex;align-items:center;gap:10px;min-width:220px}.logo-wrap img{width:238px;height:auto}.menu{display:flex;align-items:center;gap:19px;font-weight:800;color:#173866}.menu a{position:relative;padding:8px 0}.menu a::after{content:'';position:absolute;right:0;bottom:1px;width:0;height:3px;background:var(--orange);border-radius:99px;transition:.25s}.menu a:hover::after{width:100%}.nav-actions{display:flex;align-items:center;gap:10px}.mobile-toggle{display:none;background:#fff;border:1px solid var(--border);border-radius:14px;padding:9px;color:var(--blue)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:999px;font-weight:900;border:0;cursor:pointer;transition:.25s ease;box-shadow:0 12px 25px rgba(255,138,0,.22)}
.btn-primary{background:linear-gradient(135deg,var(--orange),#ff6500);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(255,138,0,.34)}.btn-blue{background:linear-gradient(135deg,var(--blue-2),var(--blue));color:#fff;box-shadow:0 12px 25px rgba(8,45,97,.22)}.btn-outline{background:#fff;color:var(--blue);border:1px solid var(--border);box-shadow:none}.btn-whatsapp{background:var(--green);color:#fff;box-shadow:0 12px 25px rgba(24,182,91,.24)}

.hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(135deg,#061b3f 0%,#0a3d86 45%,#082d61 100%)}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.22;filter:saturate(1.05) contrast(1.08)}.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 18% 10%,rgba(255,138,0,.24),transparent 28%)}.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,45,97,.54),rgba(8,45,97,.98) 62%)}
.hero-layout{position:relative;z-index:1;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:44px;padding:82px 0 78px}.eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);padding:8px 14px;border-radius:999px;font-weight:800;color:#fff}h1{font-size:clamp(40px,5vw,72px);line-height:1.15;margin:18px 0 16px;font-weight:900;letter-spacing:-1px}.hero h1 span{color:var(--orange-2)}.hero p{font-size:21px;margin:0 0 26px;color:#eaf2ff;max-width:700px}.hero-buttons{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:26px}.trust-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:680px}.trust-item{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:14px;font-weight:800;text-align:center}
.hero-visual{position:relative;min-height:520px}.main-photo{position:absolute;inset:34px 0 44px 70px;background:#fff;border-radius:34px;padding:12px;box-shadow:var(--shadow);overflow:hidden}.main-photo img{width:100%;height:100%;border-radius:25px;object-fit:cover;object-position:center}.mini-photo{position:absolute;background:#fff;border-radius:24px;padding:9px;box-shadow:0 20px 50px rgba(0,0,0,.24);overflow:hidden}.mini-photo img{border-radius:17px;width:100%;height:100%;object-fit:cover}.mini-1{width:46%;height:180px;left:0;bottom:0}.mini-2{width:42%;height:162px;right:18px;top:0}.call-badge{position:absolute;right:30px;bottom:30px;background:linear-gradient(135deg,var(--orange),#ff6500);color:#fff;padding:15px 22px;border-radius:22px;box-shadow:0 18px 36px rgba(255,101,0,.35);font-weight:900;font-size:21px}

.banner-services{padding:34px 0;background:#fff}.banner-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.banner-card{position:relative;min-height:320px;border-radius:34px;overflow:hidden;box-shadow:0 20px 55px rgba(8,45,97,.12);display:flex;align-items:flex-end}.banner-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.washer-banner img{object-position:center 32%}.dishwasher-banner img{object-position:center}.banner-card::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,27,63,.88),rgba(6,27,63,.18))}.banner-card div{position:relative;z-index:1;padding:28px;color:#fff}.banner-card span{display:inline-block;background:rgba(255,138,0,.92);padding:4px 12px;border-radius:999px;font-weight:900;margin-bottom:8px}.banner-card h2{color:#fff;margin:0 0 6px;font-size:34px}.banner-card p{margin:0;color:#e8f1ff;font-size:16px}

.section{padding:82px 0}.section-title{text-align:center;margin-bottom:42px}.section-title .mini,.mini{display:inline-flex;background:#fff3e2;color:#b55600;border-radius:999px;padding:6px 14px;font-weight:900;margin-bottom:10px}h2{font-size:clamp(30px,3.5vw,48px);line-height:1.25;margin:0;color:var(--blue);font-weight:900;letter-spacing:-.5px}.section-title p{max-width:740px;margin:12px auto 0;color:var(--muted);font-size:18px}

.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}.service-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 16px 45px rgba(8,45,97,.08);transition:.3s}.service-card:hover{transform:translateY(-6px);box-shadow:0 28px 70px rgba(8,45,97,.14)}.service-card .pic{height:325px;overflow:hidden;background:#dfe8f5}.service-card .pic img{width:100%;height:100%;object-fit:cover}.service-card:nth-child(1) .pic img{object-position:center top}.service-card:nth-child(2) .pic img{object-position:center}.service-card .content{padding:26px}.service-card h3{margin:0 0 10px;color:var(--blue);font-size:28px;font-weight:900}.service-card p{margin:0 0 18px;color:var(--muted)}.service-tag{display:inline-flex;background:#eaf4ff;color:var(--blue-2);border-radius:999px;padding:5px 12px;font-weight:900;margin-bottom:11px;font-size:13px}.bullet-list{display:grid;gap:9px;margin:0 0 22px;padding:0;list-style:none;color:#243b5a;font-weight:700}.bullet-list li{display:flex;gap:9px;align-items:flex-start}.bullet-list li::before{content:'✓';width:24px;height:24px;border-radius:50%;background:#e9f7ef;color:var(--green);display:inline-flex;align-items:center;justify-content:center;font-weight:900;flex:0 0 auto;margin-top:4px}
.gallery-strip{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:18px;margin-top:28px}.gallery-strip figure{margin:0;position:relative;border-radius:24px;overflow:hidden;height:245px;box-shadow:0 15px 40px rgba(8,45,97,.11);background:#dfe8f5}.gallery-strip img{width:100%;height:100%;object-fit:cover}.gallery-strip figure:nth-child(1) img{object-position:center}.gallery-strip figure:nth-child(2) img{object-position:center}.gallery-strip figure:nth-child(3) img{object-position:center}.gallery-strip figcaption{position:absolute;right:16px;bottom:16px;background:rgba(8,45,97,.88);color:#fff;border-radius:999px;padding:7px 14px;font-weight:900}

.brands{background:linear-gradient(180deg,#fff,#f3f8ff)}.brand-cloud{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.brand-cloud span{background:#fff;border:1px solid var(--border);border-radius:999px;padding:11px 18px;font-weight:900;color:#173866;box-shadow:0 10px 28px rgba(8,45,97,.06);direction:ltr}.brand-note{margin:26px auto 0;max-width:860px;background:#082d61;color:#fff;border-radius:24px;padding:18px 22px;text-align:center;font-weight:800;display:flex;align-items:center;justify-content:center;gap:10px}

.features{background:#fff;position:relative;overflow:hidden}.features::before{content:'';position:absolute;inset:auto -130px -140px auto;width:360px;height:360px;background:rgba(255,138,0,.11);border-radius:50%}.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative}.feature{background:linear-gradient(180deg,#fff,#f7fbff);border:1px solid var(--border);border-radius:24px;padding:24px;box-shadow:0 12px 35px rgba(8,45,97,.06)}.feature .round{width:58px;height:58px;background:linear-gradient(135deg,var(--blue-2),var(--blue));color:#fff;border-radius:18px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}.feature h3{margin:0 0 8px;color:var(--blue);font-size:21px;font-weight:900}.feature p{margin:0;color:var(--muted);font-size:15px}

.about-wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:42px;align-items:center}.about-pic{position:relative}.pro-stack{min-height:560px}.stack-main{position:absolute;inset:0 0 80px 70px;border-radius:var(--radius);box-shadow:var(--shadow);height:480px;width:calc(100% - 70px);object-fit:cover;object-position:center}.stack-small{position:absolute;left:0;bottom:0;width:52%;height:230px;object-fit:cover;border:10px solid #fff;border-radius:25px;box-shadow:0 20px 55px rgba(8,45,97,.22)}.experience{position:absolute;right:22px;top:22px;background:#fff;color:var(--blue);border-radius:22px;padding:18px 22px;box-shadow:0 18px 40px rgba(8,45,97,.16);font-weight:900}.experience strong{display:block;font-size:34px;color:var(--orange)}.about-content h2{text-align:right;margin-bottom:18px}.about-content p{color:var(--muted);font-size:18px;margin-top:0}.checks{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:22px}.check{background:#fff;border:1px solid var(--border);border-radius:18px;padding:13px 15px;font-weight:800;color:#173866}

.process{background:linear-gradient(135deg,#082d61,#0b4ea2);color:#fff}.process .section-title h2,.process .section-title p{color:#fff}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.step{background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.18);border-radius:24px;padding:24px;position:relative}.step-num{width:46px;height:46px;border-radius:15px;background:var(--orange);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:900;margin-bottom:15px}.step h3{margin:0 0 8px;font-size:22px}.step p{margin:0;color:#e8f1ff}
.areas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.area{background:#fff;border:1px solid var(--border);border-radius:18px;padding:15px 18px;font-weight:900;color:var(--blue);display:flex;align-items:center;gap:8px}.area::before{content:'📍'}
.cta{padding:70px 0;background:#fff}.cta-box{background:linear-gradient(135deg,#ff8a00,#ff6500);border-radius:34px;color:#fff;padding:40px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:24px;box-shadow:0 24px 70px rgba(255,101,0,.22);overflow:hidden;position:relative}.cta-box::after{content:'';position:absolute;left:-80px;top:-80px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.16)}.cta-box h2{color:#fff;margin-bottom:8px}.cta-box p{margin:0;color:#fff5ec;font-size:18px}.cta-phone{font-size:38px;font-weight:900;text-align:center;position:relative}.cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:12px;position:relative}
.contact{background:#eef5ff}.contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:28px}.contact-card,.form-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:30px;box-shadow:0 16px 45px rgba(8,45,97,.07)}.contact-item{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--border)}.contact-item:last-child{border-bottom:0}.contact-item .round{width:48px;height:48px;flex:0 0 auto;border-radius:16px;background:#eff6ff;color:var(--blue);display:flex;align-items:center;justify-content:center}.contact-item h3{margin:0;color:var(--blue);font-size:18px}.contact-item p{margin:3px 0 0;color:var(--muted)}.form-row{display:grid;gap:10px;margin-bottom:14px}label{font-weight:900;color:#173866}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:16px;padding:13px 15px;font:inherit;background:#fbfdff;color:var(--ink);outline:none}input:focus,select:focus,textarea:focus{border-color:var(--blue-2);box-shadow:0 0 0 4px rgba(11,78,162,.08)}textarea{resize:vertical;min-height:120px}.form-note{font-size:13px;color:var(--muted);margin-top:12px}
.footer{background:#061b3f;color:#fff;border-top:4px solid var(--orange)}.footer-top{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:28px;padding:48px 0}.footer-logo{width:260px;background:#fff;border-radius:18px;padding:8px;margin-bottom:14px}.footer p{color:#dce9ff;margin:0}.footer h3{font-size:20px;margin:0 0 14px;color:#fff}.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;color:#dce9ff;font-weight:700}.footer a:hover{color:var(--orange-2)}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:18px 0;color:#dce9ff;text-align:center;font-weight:700}.socials{display:flex;gap:10px;margin-top:16px}.socials a{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1)}
.floating-actions{position:fixed;left:18px;bottom:18px;z-index:80;display:grid;gap:10px}.float-btn{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 14px 32px rgba(0,0,0,.25)}.float-call{background:var(--orange)}.float-wa{background:var(--green)}

@media (max-width: 1100px){.menu{gap:12px;font-size:15px}.logo-wrap img{width:210px}.nav-actions .btn{padding-inline:16px}}
@media (max-width: 980px){.mobile-toggle{display:inline-flex}.menu{position:absolute;top:100%;right:16px;left:16px;background:#fff;border:1px solid var(--border);border-radius:22px;padding:16px;display:none;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start}.menu.is-open{display:flex}.nav-actions{display:none}.hero-layout,.about-wrap,.contact-wrap,.cta-box{grid-template-columns:1fr}.hero-visual{min-height:430px}.main-photo{inset:30px 0 30px 50px}.mini-1{height:150px}.mini-2{height:140px}.services-grid,.features-grid,.steps,.footer-top,.banner-grid{grid-template-columns:1fr 1fr}.trust-row{grid-template-columns:1fr}.cta-phone{text-align:right}.areas-grid{grid-template-columns:1fr 1fr}.gallery-strip{grid-template-columns:1fr 1fr}.gallery-strip figure:first-child{grid-column:1/-1}}
@media (max-width: 640px){.topbar .container{justify-content:center;text-align:center}.logo-wrap{min-width:0}.logo-wrap img{width:205px}.hero-layout{padding:58px 0}.hero-visual{min-height:360px}.main-photo{inset:20px 0 40px 20px}.mini-photo{display:none}.call-badge{right:18px;bottom:18px;font-size:17px;padding:12px 16px}.services-grid,.features-grid,.steps,.footer-top,.checks,.areas-grid,.banner-grid,.gallery-strip{grid-template-columns:1fr}.service-card .pic{height:260px}.banner-card{min-height:265px}.cta-box{padding:28px}.cta-phone{font-size:28px}.section{padding:58px 0}.floating-actions{left:12px;bottom:12px}.float-btn{width:52px;height:52px}h1{font-size:38px}.hero p{font-size:18px}.brand-note{align-items:flex-start;text-align:right}.stack-main{position:relative;inset:auto;width:100%;height:360px}.stack-small{display:none}.pro-stack{min-height:auto}.experience{top:16px;right:16px}.gallery-strip figure{height:230px}}