/* =========================================================
   Tamkeen Azal — Main Stylesheet
   نظام تصميم: برتقالي + أسود، عصري، احترافي، RTL بالكامل
   الألوان الفعلية تُحقن كمتغيرات CSS من functions.php (Theme Settings)
   ========================================================= */

:root{
	--ta-primary: #F47B20;
	--ta-dark-orange: #D95F00;
	--ta-black: #111111;
	--ta-bg: #F5F5F5;
	--ta-white: #FFFFFF;
	--ta-font: 'Cairo', sans-serif;

	--ta-text: #1c1c1c;
	--ta-text-muted: #5c5c5c;
	--ta-border: #e7e5e2;
	--ta-radius-sm: 8px;
	--ta-radius-md: 14px;
	--ta-radius-lg: 22px;
	--ta-shadow-sm: 0 2px 10px rgba(17,17,17,.06);
	--ta-shadow-md: 0 12px 30px rgba(17,17,17,.10);
	--ta-shadow-lg: 0 20px 50px rgba(17,17,17,.16);
	--ta-container: 1200px;
	--ta-header-h: 84px;
}

/* ===== Reset أساسي وخفيف ===== */
*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
	margin:0;
	font-family: var(--ta-font);
	color: var(--ta-text);
	background: var(--ta-white);
	line-height: 1.75;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color: inherit; text-decoration: none; transition: color .2s ease, background-color .2s ease, transform .2s ease; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0 0 .5em; font-weight:800; line-height:1.3; color: var(--ta-black); }
p{ margin:0 0 1em; color: var(--ta-text-muted); }
button{ font-family: inherit; cursor:pointer; }
input, textarea, select{ font-family: inherit; font-size: 1rem; }

.screen-reader-text{
	position:absolute !important;
	clip: rect(1px,1px,1px,1px);
	width:1px; height:1px; overflow:hidden;
}
.skip-link{ position:absolute; top:-100px; right:16px; background:var(--ta-primary); color:#fff; padding:10px 16px; z-index:9999; border-radius: var(--ta-radius-sm); }
.skip-link:focus{ top:16px; }

:focus-visible{ outline: 3px solid var(--ta-primary); outline-offset: 2px; }

.ta-container{ max-width: var(--ta-container); margin-inline: auto; padding-inline: 20px; }
.ta-section{ padding-block: 80px; }
.ta-section-alt{ background: var(--ta-bg); }

.ta-section-head{ text-align:center; max-width: 640px; margin: 0 auto 48px; }
.ta-eyebrow{
	display:inline-block; font-weight:700; font-size:.85rem; letter-spacing:.04em;
	color: var(--ta-dark-orange); background: rgba(244,123,32,.1);
	padding: 6px 16px; border-radius: 999px; margin-bottom: 14px;
}
.ta-section-head h2{ font-size: clamp(1.6rem, 2.6vw, 2.4rem); }

/* ===== أزرار ===== */
.ta-btn{
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	padding: 13px 26px; border-radius: var(--ta-radius-sm); font-weight:700;
	border: 2px solid transparent; white-space: nowrap;
}
.ta-btn-lg{ padding: 16px 34px; font-size: 1.05rem; }
.ta-btn-primary{ background: var(--ta-primary); color:#fff; box-shadow: var(--ta-shadow-sm); }
.ta-btn-primary:hover{ background: var(--ta-dark-orange); transform: translateY(-2px); }
.ta-btn-outline{ background: transparent; border-color: var(--ta-black); color: var(--ta-black); }
.ta-btn-outline:hover{ background: var(--ta-black); color:#fff; }
.ta-btn-whatsapp{ background: #25D366; color:#fff; }
.ta-btn-whatsapp:hover{ background:#1ebc59; transform: translateY(-2px); }
.ta-btn-white{ background:#fff; color: var(--ta-black); }
.ta-btn-white:hover{ background: var(--ta-bg); }
.ta-btn-black{ background: var(--ta-black); color:#fff; }
.ta-btn-black:hover{ background:#000; }

.dashicons{ font-size:20px; width:20px; height:20px; }

/* ===== الهيدر ===== */
.ta-header{
	position: sticky; top:0; z-index: 500;
	background: rgba(255,255,255,.92);
	backdrop-filter: saturate(180%) blur(10px);
	border-bottom: 1px solid var(--ta-border);
}
.ta-header-inner{ display:flex; align-items:center; justify-content:space-between; gap: 24px; height: var(--ta-header-h); }
.ta-logo img{ max-height: 52px; width:auto; }
.ta-logo-text{ font-weight:900; font-size: 1.4rem; color: var(--ta-black); }
.ta-primary-nav{ flex:1; display:flex; justify-content:center; }
.ta-menu{ display:flex; align-items:center; gap: 30px; }
.ta-menu a{ font-weight:600; color: var(--ta-black); position:relative; padding: 6px 2px; }
.ta-menu a::after{
	content:''; position:absolute; right:0; left:0; bottom:-2px; height:2px;
	background: var(--ta-primary); transform: scaleX(0); transition: transform .25s ease;
}
.ta-menu a:hover::after, .ta-menu .current-menu-item a::after{ transform: scaleX(1); }
.ta-header-actions{ display:flex; align-items:center; gap: 10px; }
.ta-header-call, .ta-header-actions .ta-btn-whatsapp{ padding: 10px 18px; font-size:.92rem; }

.ta-mobile-toggle{
	display:none; background:none; border:none; width: 42px; height:42px;
	align-items:center; justify-content:center; border-radius: var(--ta-radius-sm);
}
.ta-burger, .ta-burger::before, .ta-burger::after{
	display:block; width: 22px; height: 2px; background: var(--ta-black); position:relative; transition: all .25s ease;
}
.ta-burger::before, .ta-burger::after{ content:''; position:absolute; right:0; }
.ta-burger::before{ top:-7px; }
.ta-burger::after{ top:7px; }
.ta-mobile-toggle[aria-expanded="true"] .ta-burger{ background: transparent; }
.ta-mobile-toggle[aria-expanded="true"] .ta-burger::before{ transform: rotate(45deg); top:0; }
.ta-mobile-toggle[aria-expanded="true"] .ta-burger::after{ transform: rotate(-45deg); top:0; }

.ta-mobile-menu{
	display:none; max-height:0; overflow:hidden; transition: max-height .3s ease;
	background:#fff; border-top: 1px solid var(--ta-border);
}
.ta-mobile-menu.is-open{ max-height: 600px; }
.ta-mobile-menu-list{ display:flex; flex-direction:column; padding: 10px 20px; }
.ta-mobile-menu-list a{ display:block; padding: 12px 0; border-bottom:1px solid var(--ta-border); font-weight:600; }
.ta-mobile-menu-actions{ display:flex; gap:10px; padding: 16px 20px; }
.ta-mobile-menu-actions .ta-btn{ flex:1; }

/* ===== Hero ===== */
.ta-hero{
	position:relative; min-height: 640px; display:flex; align-items:center;
	background-color: var(--ta-black);
	background-size: cover; background-position:center;
	color:#fff;
}
.ta-hero-overlay{
	position:absolute; inset:0;
	background: linear-gradient(135deg, rgba(17,17,17,.92), rgba(217,95,0, var(--ta-overlay-opacity, .55)));
}
.ta-hero-inner{ position:relative; z-index:2; max-width: 760px; }
.ta-hero-title{ color:#fff; font-size: clamp(2rem, 4.2vw, 3.4rem); margin-bottom:.4em; }
.ta-hero-desc{ color: rgba(255,255,255,.86); font-size: 1.15rem; max-width: 620px; }
.ta-hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top: 30px; }

.ta-service-hero{
	position:relative; min-height: 380px; display:flex; align-items:center;
	background-color: var(--ta-black); background-size: cover; background-position:center; color:#fff;
}
.ta-service-hero .ta-hero-inner{ padding-block: 60px; }

/* ===== الشبكات والبطاقات ===== */
.ta-grid{ display:grid; gap: 28px; }
.ta-grid-3{ grid-template-columns: repeat(3, 1fr); }

.ta-card{
	background:#fff; border-radius: var(--ta-radius-md); overflow:hidden;
	box-shadow: var(--ta-shadow-sm); border:1px solid var(--ta-border);
	transition: box-shadow .25s ease, transform .25s ease;
	display:flex; flex-direction:column;
}
.ta-card:hover{ box-shadow: var(--ta-shadow-md); transform: translateY(-4px); }
.ta-card-image{ aspect-ratio: 4/3; overflow:hidden; background: var(--ta-bg); }
.ta-card-image img{ width:100%; height:100%; object-fit:cover; }
.ta-card-body{ padding: 26px; flex:1; display:flex; flex-direction:column; }
.ta-card-icon{ color: var(--ta-primary); background: rgba(244,123,32,.1); border-radius: var(--ta-radius-sm); padding:10px; width:42px; height:42px; margin-bottom:14px; }
.ta-card-body h3{ font-size: 1.2rem; }
.ta-card-link{ margin-top:auto; font-weight:700; color: var(--ta-dark-orange); }
.ta-card-link:hover{ color: var(--ta-primary); }

/* ===== لماذا تختار تمكين عزل ===== */
.ta-feature{ text-align:center; padding: 30px 20px; }
.ta-feature-icon{
	display:inline-flex; align-items:center; justify-content:center;
	width:64px; height:64px; border-radius:50%;
	background: var(--ta-black); color: var(--ta-primary); margin-bottom: 18px;
}
.ta-feature h3{ font-size: 1.1rem; }

/* ===== خطوات العمل ===== */
.ta-steps-track{ display:grid; grid-template-columns: repeat(4,1fr); gap: 24px; position:relative; }
.ta-step{
	background:#fff; border:1px solid var(--ta-border); border-radius: var(--ta-radius-md);
	padding: 30px 22px; position:relative;
}
.ta-step-num{
	display:inline-flex; align-items:center; justify-content:center;
	width:46px; height:46px; border-radius:50%;
	background: var(--ta-primary); color:#fff; font-weight:800; margin-bottom: 16px;
}

/* ===== CTA ===== */
.ta-cta{ background: linear-gradient(120deg, var(--ta-primary), var(--ta-dark-orange)); color:#fff; }
.ta-cta-inner{ text-align:center; max-width:700px; }
.ta-cta h2{ color:#fff; font-size: clamp(1.6rem, 3vw, 2.2rem); }
.ta-cta p{ color: rgba(255,255,255,.9); }
.ta-cta-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:20px; }

/* ===== المدن ===== */
.ta-city-card{ display:block; background:#fff; border-radius: var(--ta-radius-md); overflow:hidden; border:1px solid var(--ta-border); box-shadow: var(--ta-shadow-sm); transition: transform .25s ease, box-shadow .25s ease; }
.ta-city-card:hover{ transform: translateY(-4px); box-shadow: var(--ta-shadow-md); }
.ta-city-image{ aspect-ratio: 16/10; background: var(--ta-bg); overflow:hidden; }
.ta-city-image img{ width:100%; height:100%; object-fit:cover; }
.ta-city-body{ padding: 20px; }
.ta-city-body h3{ font-size:1.1rem; margin-bottom:.3em; }
.ta-city-body p{ margin:0; font-size:.92rem; }

/* ===== FAQ ===== */
.ta-faq-inner{ max-width: 780px; }
.ta-faq-list{ display:flex; flex-direction:column; gap: 12px; }
.ta-faq-item{ background:#fff; border:1px solid var(--ta-border); border-radius: var(--ta-radius-sm); padding: 18px 22px; }
.ta-faq-item summary{ cursor:pointer; font-weight:700; list-style:none; display:flex; justify-content:space-between; align-items:center; }
.ta-faq-item summary::-webkit-details-marker{ display:none; }
.ta-faq-item summary::after{ content:'+'; font-size:1.4rem; color: var(--ta-primary); }
.ta-faq-item[open] summary::after{ content:'−'; }
.ta-faq-item p{ margin-top: 12px; margin-bottom:0; }

/* ===== الفوتر ===== */
.ta-footer{ background: var(--ta-black); color: rgba(255,255,255,.75); padding-top: 70px; }
.ta-footer-grid{ display:grid; grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: 40px; padding-bottom: 50px; }
.ta-footer-col h4{ color:#fff; font-size:1rem; margin-bottom: 18px; }
.ta-footer-col ul{ display:flex; flex-direction:column; gap: 10px; }
.ta-footer-col a{ color: rgba(255,255,255,.72); }
.ta-footer-col a:hover{ color: var(--ta-primary); }
.ta-footer-logo-text{ color:#fff; }
.ta-footer-brand p{ color: rgba(255,255,255,.65); }
.ta-footer-social{ display:flex; gap:10px; margin-top: 16px; }
.ta-footer-social a{
	width: 38px; height:38px; display:flex; align-items:center; justify-content:center;
	background: rgba(255,255,255,.08); border-radius:50%;
}
.ta-footer-social a:hover{ background: var(--ta-primary); color:#fff; }
.ta-footer-bottom{ border-top: 1px solid rgba(255,255,255,.1); padding: 22px 0; text-align:center; font-size:.88rem; }
.ta-footer-bottom p{ margin:0; color: rgba(255,255,255,.55); }
.ta-footer-contact li{ }

/* ===== الأزرار العائمة ===== */
.ta-floating-buttons{ position:fixed; bottom: 24px; z-index: 600; display:flex; flex-direction:column; gap: 12px; }
.ta-floating-bottom-left{ left: 24px; }
.ta-floating-bottom-right{ right: 24px; }
.ta-float-btn{
	width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center;
	box-shadow: var(--ta-shadow-lg); color:#fff;
}
.ta-float-whatsapp{ background:#25D366; }
.ta-float-phone{ background: var(--ta-primary); }
.ta-float-btn:hover{ transform: scale(1.08); }
.ta-float-btn .dashicons{ font-size: 26px; width:26px; height:26px; }

/* ===== صفحات عامة ===== */
.ta-page-header{ padding-block: 60px 10px; text-align:center; }
.ta-page-header-alt{ background: var(--ta-bg); padding-block: 60px; margin-bottom: 20px; }
.ta-page-title{ font-size: clamp(1.6rem, 3vw, 2.2rem); }
.ta-page-content{ max-width: 860px; margin-inline:auto; }
.ta-page-content img{ border-radius: var(--ta-radius-md); }

/* من نحن */
.ta-about-values{ margin-top: 50px; }

/* اتصل بنا */
.ta-contact-layout{ display:grid; grid-template-columns: 1fr 1.3fr; gap: 50px; }
.ta-contact-list{ display:flex; flex-direction:column; gap: 14px; margin: 20px 0; }
.ta-contact-list strong{ color: var(--ta-black); }
.ta-contact-form-wrap{ background:#fff; border:1px solid var(--ta-border); border-radius: var(--ta-radius-md); padding: 30px; box-shadow: var(--ta-shadow-sm); }
.ta-form-row{ margin-bottom: 18px; display:flex; flex-direction:column; gap:6px; }
.ta-form-row label{ font-weight:600; font-size:.92rem; }
.ta-form-row input, .ta-form-row select, .ta-form-row textarea{
	padding: 12px 14px; border:1px solid var(--ta-border); border-radius: var(--ta-radius-sm);
	background: var(--ta-bg);
}
.ta-form-row input:focus, .ta-form-row select:focus, .ta-form-row textarea:focus{ outline: 2px solid var(--ta-primary); background:#fff; }
.ta-form-honeypot{ position:absolute; left:-9999px; opacity:0; height:0; overflow:hidden; }
.ta-form-notice{ padding: 14px 18px; border-radius: var(--ta-radius-sm); margin-bottom: 20px; font-weight:600; }
.ta-form-success{ background:#e7f8ee; color:#1a7a45; }
.ta-form-error{ background:#fdeceb; color:#b3261e; }
.ta-contact-map iframe{ display:block; }

/* المدونة */
.ta-blog-meta{ display:flex; gap:10px; font-size:.82rem; color: var(--ta-text-muted); margin-bottom:8px; }
.ta-single-layout{ display:grid; grid-template-columns: 2.2fr 1fr; gap: 50px; align-items:start; }
.ta-single-thumb{ margin: 20px 0; border-radius: var(--ta-radius-md); overflow:hidden; }
.ta-post-tags{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 30px; }
.ta-post-tags a{ background: var(--ta-bg); padding:6px 14px; border-radius:999px; font-size:.85rem; }
.ta-widget{ background:#fff; border:1px solid var(--ta-border); border-radius: var(--ta-radius-md); padding: 22px; margin-bottom: 24px; }
.ta-widget-title{ font-size:1rem; margin-bottom:14px; }
.ta-related-list li{ padding: 8px 0; border-bottom:1px solid var(--ta-border); }
.ta-related-list li:last-child{ border-bottom:none; }
.ta-pagination{ display:flex; justify-content:center; gap:8px; margin-top: 40px; }
.ta-pagination .page-numbers{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius: var(--ta-radius-sm); background: var(--ta-bg); font-weight:700; }
.ta-pagination .page-numbers.current{ background: var(--ta-primary); color:#fff; }

/* التعليقات */
.ta-comments{ margin-top: 40px; }
.ta-comment-list{ margin: 20px 0; }
.ta-comments-closed{ color: var(--ta-text-muted); }

/* 404 */
.ta-404{ text-align:center; }
.ta-404-inner{ max-width: 560px; margin-inline:auto; }
.ta-404-code{ font-size: 6rem; font-weight:900; color: var(--ta-primary); line-height:1; }
.ta-404-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top: 24px; }

.ta-empty-state{ text-align:center; padding: 80px 20px; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
	.ta-grid-3{ grid-template-columns: repeat(2,1fr); }
	.ta-footer-grid{ grid-template-columns: 1fr 1fr; }
	.ta-steps-track{ grid-template-columns: repeat(2,1fr); }
	.ta-contact-layout, .ta-single-layout{ grid-template-columns: 1fr; }
}

@media (max-width: 768px){
	.ta-primary-nav{ display:none; }
	.ta-mobile-toggle{ display:flex; }
	.ta-header-call span:last-child{ display:none; }
	.ta-mobile-menu{ display:block; }
	.ta-grid-3{ grid-template-columns: 1fr; }
	.ta-steps-track{ grid-template-columns: 1fr; }
	.ta-hero{ min-height: 520px; text-align:center; }
	.ta-hero-inner{ margin-inline:auto; }
	.ta-hero-actions{ justify-content:center; }
	.ta-section{ padding-block: 56px; }
}

@media (max-width: 480px){
	:root{ --ta-header-h: 68px; }
	.ta-logo img{ max-height: 40px; }
	.ta-hero-title{ font-size: 1.7rem; }
	.ta-btn-lg{ padding: 13px 22px; font-size:.95rem; }
	.ta-floating-bottom-left{ left: 14px; }
	.ta-floating-bottom-right{ right: 14px; }
	.ta-float-btn{ width:48px; height:48px; }
}

/* تقليل الحركة لمن يفضل ذلك */
@media (prefers-reduced-motion: reduce){
	*, *::before, *::after{ animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior:auto !important; }
}
