/*
Theme Name: شركة التميز
Theme URI: https://example.com
Author: شركة التميز
Description: ثيم صفحة هبوط لشركة خدمات تنظيف، بنفس تصميم الصفحة المرجعية بألوان عنابي وتركوازي وذهبي، مع نظام كروت خدمات (Custom Post Type) يتيح إضافة وتعديل وحذف الخدمات بحرية من لوحة تحكم ووردبريس، ولوحة تخصيص لاسم الشركة ورقم الجوال والألوان.
Version: 1.0
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: altamayoz
*/

:root{
  --navy:#4a0e2d;
  --navy-2:#6c1442;
  --navy-light:#8f1b57;
  --blue:#2a9d8f;
  --blue-light:#42ccbc;
  --blue-dark:#1b655c;
  --gold:#e9c46a;
  --gold-light:#f5e4ba;
  --gold-dark:#dfaa27;
  --green:#25d366;
  --paper:#faf7ef;
  --text-dark:#1a1a1a;
  --text-light:#fdf6e3;
  --shadow:0 10px 30px rgba(74,14,45,0.18);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Tajawal','Cairo',sans-serif;
  background:linear-gradient(180deg,#f5f2ee 0%, #f0ece6 100%);
  color:var(--text-dark);
  direction:rtl;
  overflow-x:hidden;
  padding-bottom:78px;
}
.container{
  max-width:520px;
  margin:0 auto;
  background:#fff;
  min-height:100vh;
  box-shadow:0 0 40px rgba(0,0,0,0.08);
  position:relative;
}
/* ===== HEADER فاتح ===== */
header.top{
  background:linear-gradient(180deg,#ffffff 0%, #f7f4f0 100%);
  padding:22px 18px 16px;
  text-align:center;
  position:relative;
  border-bottom:1px solid #ece4d8;
}
.logo-circle{
  width:84px;height:84px;
  border-radius:50%;
  background:linear-gradient(145deg,var(--navy) 0%, var(--blue-dark) 100%);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 10px;
  border:3px solid var(--blue);
  box-shadow:0 6px 18px rgba(74,14,45,0.28);
}
.logo-circle svg{width:42px;height:42px;}
.badge{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--navy);
  color:#fdf6e3;
  font-size:12px;
  font-weight:700;
  padding:5px 14px;
  border-radius:20px;
  margin-bottom:8px;
  letter-spacing:.3px;
}
.badge svg{width:13px;height:13px;fill:var(--gold);}
header.top h1{
  font-family:'Cairo',sans-serif;
  font-weight:900;
  font-size:26px;
  background:linear-gradient(90deg,var(--blue-dark),var(--blue),var(--blue-dark));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  margin-bottom:6px;
}
.city-tag{
  display:inline-flex;align-items:center;gap:5px;
  color:var(--navy);
  font-weight:700;
  font-size:14.5px;
  background:#f3ece0;
  padding:4px 14px;
  border-radius:16px;
}
.city-tag svg{width:14px;height:14px;fill:var(--blue-dark);}
.wave{display:block;width:100%;line-height:0;}
.wave svg{width:100%;height:36px;display:block;}
/* ===== بانر للعروض ===== */
.promo-banner{
  background:linear-gradient(120deg,var(--navy) 0%, var(--blue) 55%, var(--navy) 100%);
  position:relative;
  padding:22px 18px 26px;
  text-align:center;
  overflow:hidden;
}
.promo-banner::before{
  content:"";
  position:absolute;inset:0;
  background:radial-gradient(circle at 20% 20%, rgba(42,157,143,0.35), transparent 45%),
             radial-gradient(circle at 85% 80%, rgba(233,196,106,0.15), transparent 40%);
}
.promo-banner .flag{
  position:relative;z-index:1;
  display:inline-block;
  background:var(--gold);
  color:var(--navy);
  font-weight:900;
  font-size:12.5px;
  padding:4px 14px;
  border-radius:20px;
  margin-bottom:10px;
  letter-spacing:.4px;
}
.promo-banner h2{
  position:relative;z-index:1;
  font-family:'Cairo',sans-serif;
  color:#fff;
  font-size:19px;
  font-weight:800;
  line-height:1.6;
  margin-bottom:4px;
}
.promo-banner h2 span{
  color:#ffe0b8;
  font-weight:900;
}
.promo-banner p{
  position:relative;z-index:1;
  color:#f7ebdd;
  font-size:13.5px;
  font-weight:500;
}
/* ===== كروت الخدمات ===== */
.services{
  padding:26px 16px 8px;
}
.section-title{
  text-align:center;
  font-family:'Cairo',sans-serif;
  font-weight:800;
  font-size:19px;
  color:var(--navy);
  margin-bottom:18px;
  position:relative;
}
.section-title::after{
  content:"";
  display:block;
  width:56px;height:3px;
  background:linear-gradient(90deg,var(--blue-dark),var(--blue));
  margin:8px auto 0;
  border-radius:3px;
}
.service-card{
  background:#fff;
  border:1px solid #efe6d8;
  border-radius:18px;
  padding:18px;
  margin-bottom:16px;
  box-shadow:0 8px 22px rgba(74,14,45,0.08);
  position:relative;
  overflow:hidden;
}
.service-card::before{
  content:"";
  position:absolute;
  top:0;right:0;
  width:6px;height:100%;
  background:linear-gradient(180deg,var(--blue),var(--navy));
}
.service-illus{
  width:100%;
  height:130px;
  border-radius:14px;
  overflow:hidden;
  margin-bottom:14px;
  box-shadow:0 4px 10px rgba(74,14,45,0.15);
}
.service-illus svg{width:100%;height:100%;display:block;}
.service-illus-icon{
  fill:none;
  stroke:#ffffff;
  stroke-width:1.3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.service-top{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.service-info h3{
  font-family:'Cairo',sans-serif;
  font-size:17px;
  font-weight:800;
  color:var(--navy);
  margin-bottom:3px;
}
.service-info p{
  font-size:12.5px;
  color:#666;
  font-weight:500;
}
.price-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#fbf1e4;
  border:1px dashed var(--blue-dark);
  border-radius:12px;
  padding:10px 14px;
}
.price-row .label{
  font-size:13px;
  font-weight:700;
  color:var(--navy);
}
.price-row .price{
  font-family:'Cairo',sans-serif;
  font-weight:900;
  font-size:22px;
  color:var(--blue-dark);
}
.price-row .price small{
  font-size:12px;
  font-weight:700;
  color:var(--navy);
}
.price-cta{
  display:block;
  text-align:center;
  background:#fbf1e4;
  border:1px dashed var(--blue-dark);
  border-radius:12px;
  padding:10px 14px;
  font-size:13px;
  font-weight:700;
  color:var(--navy);
}
.service-note{
  margin-top:8px;
  font-size:11.5px;
  color:var(--gold-dark);
  font-weight:700;
  display:flex;
  align-items:center;
  gap:4px;
}
.service-note svg{fill:var(--gold-dark);width:13px;height:13px;flex:0 0 auto;}
/* ===== المميزات ===== */
.features{
  padding:22px 16px 8px;
}
.features-list{
  list-style:none;
  background:#fff;
  border-radius:16px;
  box-shadow:0 8px 22px rgba(74,14,45,0.08);
  overflow:hidden;
}
.features-list li{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  font-size:14px;
  font-weight:600;
  color:var(--navy);
  border-right:4px solid var(--blue);
  border-bottom:1px solid #f5efe6;
}
.features-list li:last-child{border-bottom:none;}
.features-list li svg{
  flex:0 0 auto;
  width:20px;height:20px;
  fill:var(--blue-dark);
}
/* ===== قسم التواصل ===== */
.contact-section{
  margin:26px 16px 8px;
  background:linear-gradient(135deg,var(--navy) 0%, var(--navy-light) 100%);
  border-radius:20px;
  padding:26px 20px;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.contact-section::before{
  content:"";
  position:absolute;inset:0;
  background:radial-gradient(circle at 90% 10%, rgba(42,157,143,0.35), transparent 40%);
}
.contact-section h3{
  position:relative;z-index:1;
  font-family:'Cairo',sans-serif;
  color:#fff;
  font-size:18px;
  font-weight:800;
  margin-bottom:6px;
}
.contact-section p{
  position:relative;z-index:1;
  color:#d8dee6;
  font-size:12.5px;
  margin-bottom:16px;
}
.phone-display{
  position:relative;z-index:1;
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(66,204,188,0.5);
  color:#ffe0b8;
  font-family:'Cairo',sans-serif;
  font-weight:800;
  font-size:20px;
  direction:ltr;
  padding:10px 20px;
  border-radius:14px;
  margin-bottom:18px;
}
.phone-display svg{width:18px;height:18px;fill:#ffe0b8;}
.contact-buttons{
  position:relative;z-index:1;
  display:flex;
  gap:10px;
}
.cbtn{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:13px 8px;
  border-radius:12px;
  font-weight:800;
  font-size:13.5px;
  text-decoration:none;
  transition:transform .15s ease;
}
.cbtn:active{transform:scale(0.96);}
.cbtn svg{width:18px;height:18px;}
.cbtn.whatsapp{background:var(--green);color:#fff;}
.cbtn.call{background:var(--blue);color:#fff;}
/* ===== زراير دائرية جانبية ===== */
.side-buttons{
  position:fixed;
  left:14px;
  bottom:100px;
  display:flex;
  flex-direction:column;
  gap:12px;
  z-index:998;
}
.side-btn{
  width:52px;height:52px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 16px rgba(0,0,0,0.25);
  text-decoration:none;
  animation:pulse-side 2.4s infinite;
}
.side-btn svg{width:24px;height:24px;fill:#fff;}
.side-btn.wa{background:var(--green);animation-delay:0s;}
.side-btn.blue{background:linear-gradient(145deg,var(--blue),var(--blue-dark));animation-delay:.3s;}
.side-btn.navy{background:linear-gradient(145deg,var(--navy-light),var(--navy));animation-delay:.6s;}
@keyframes pulse-side{
  0%{box-shadow:0 0 0 0 rgba(37,211,102,0.4);}
  70%{box-shadow:0 0 0 12px rgba(37,211,102,0);}
  100%{box-shadow:0 0 0 0 rgba(37,211,102,0);}
}
/* ===== شريط سفلي عائم ===== */
.bottom-bar{
  position:fixed;
  bottom:0;left:0;right:0;
  max-width:520px;
  margin:0 auto;
  background:#fff;
  border-top:1px solid #eee;
  box-shadow:0 -6px 20px rgba(0,0,0,0.12);
  display:flex;
  z-index:999;
}
.bottom-bar a{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:15px 6px;
  font-weight:800;
  font-size:14.5px;
  text-decoration:none;
}
.bottom-bar a svg{width:20px;height:20px;}
.bottom-bar .bar-wa{background:var(--green);color:#fff;}
.bottom-bar .bar-call{background:var(--navy);color:#ffe0b8;}
/* ===== توقيع ===== */
.signature{
  text-align:center;
  padding:22px 16px 26px;
  font-size:12px;
  color:#999;
}
.signature .line{
  width:40px;height:2px;
  background:#ece4d8;
  margin:0 auto 12px;
  border-radius:2px;
}
@media (max-width:360px){
  header.top h1{font-size:22px;}
  .promo-banner h2{font-size:16px;}
}