:root { --color-primary: #19154C; --color-secondary: #48AEE2; --color-accent: #2A2470; --color-bg: #F4F4F4; }
body { background-color: var(--color-bg); color: #334155; overflow-x: hidden; transition: background-color 0.3s, color 0.3s;}

html[lang="ar"] body { font-family: 'Cairo', sans-serif; }
html[lang="en"] body { font-family: 'Poppins', sans-serif; }

.hero-bg { background-color: var(--color-primary); background-image: radial-gradient(circle at top right, var(--color-accent) 0%, var(--color-primary) 70%); background-size: cover; background-position: center; position: relative; }
.section-eyebrow { color: var(--color-secondary); font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 0.5rem; font-size: 0.875rem; }
.section-title { color: var(--color-primary); font-weight: 900; font-size: 2.25rem; margin-bottom: 1rem; line-height: 1.3; }
.section-sub { color: #64748b; font-size: 1.125rem; max-width: 48rem; margin: 0 auto; line-height: 1.7; }
.dark-section .section-title { color: white; }
.dark-section .section-sub { color: rgba(255,255,255,0.7); }
.feature-icon-wrapper { width: 4rem; height: 4rem; border-radius: 50%; background-color: rgba(72, 174, 226, 0.1); color: var(--color-secondary); display: flex; align-items: center; justify-content: center; font-size: 1.75rem; margin-bottom: 1.5rem; }

::-webkit-scrollbar { width: 6px; } 
::-webkit-scrollbar-thumb { background-color: var(--color-secondary); border-radius: 10px; }
[x-cloak] { display: none !important; }
.rendered-content ul { list-style-type: disc; margin-bottom: 10px; margin-inline-start: 20px; }
.rendered-content ol { list-style-type: decimal; margin-bottom: 10px; margin-inline-start: 20px; }
.scroll-offset { scroll-margin-top: 130px; }

.service-card { background-size: cover; background-position: center; position: relative; overflow: hidden; transition: all 0.3s ease; cursor: pointer; }
.service-card:hover { transform: translateY(-5px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2); }
.service-overlay-blue { background: linear-gradient(to top, rgba(11, 35, 65, 0.95) 0%, rgba(11, 35, 65, 0.7) 40%, rgba(11, 35, 65, 0.1) 100%); }
.service-overlay-green { background: linear-gradient(to top, rgba(13, 71, 62, 0.95) 0%, rgba(13, 71, 62, 0.7) 40%, rgba(13, 71, 62, 0.1) 100%); }
.service-overlay-gold { background: linear-gradient(to top, rgba(196, 154, 69, 0.95) 0%, rgba(196, 154, 69, 0.7) 40%, rgba(196, 154, 69, 0.1) 100%); }

body.edit-mode [data-edit="text"] { outline: 2px dashed var(--color-secondary) !important; outline-offset: 4px; border-radius: 4px; cursor: text; transition: all 0.2s; min-height: 20px;}
body.edit-mode [data-edit="text"]:focus { outline: 2px solid #ff0000 !important; background: rgba(255,255,255,0.9); color: #000; padding: 2px; }
body.edit-mode a, body.edit-mode button:not(.live-btn) { pointer-events: none !important; }
.edit-camera-btn { display: none; position: absolute; top: 10px; right: 10px; z-index: 99; background: #ff0000; color: white; border-radius: 50%; width: 40px; height: 40px; justify-content: center; align-items: center; cursor: pointer; box-shadow: 0 4px 6px rgba(0,0,0,0.3); pointer-events: auto !important; }
body.edit-mode .group:hover .edit-camera-btn { display: flex; }