:root {
  --bg-deep: #070707;
  --bg-base: #0b0b0b;
  --bg-surface: #111111;
  --bg-card: #151515;
  --accent-purple: #ff8a00;
  --accent-magenta: #ff5a00;
  --accent-orange: #ffb347;
  --grad: linear-gradient(135deg, #ff5a00, #ff8a00, #ffb347);
  --grad-reverse: linear-gradient(315deg, #ff5a00, #ff8a00, #ffb347);
  --text-white: #ffffff;
  --text-muted: #a7a7a7;
  --text-dim: #666666;
  --border: rgba(255,255,255,0.07);
  --border-hover: rgba(255,255,255,0.15);
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --font-ar: 'Cairo', 'Tajawal', sans-serif;
  --font-en: 'Space Grotesk', sans-serif;
  --section-pad: 110px 0;
  --max-w: 1280px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  background: var(--bg-deep);
  color: var(--text-white);
  font-family: var(--font-ar);
  font-size: 16px;
  line-height: 1.7;
  overflow-x: hidden;
  direction: rtl;
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg-deep); }
::-webkit-scrollbar-thumb { background: var(--accent-purple); border-radius: 3px; }

.container {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 40px;
}

/* ── GRADIENT TEXT ── */
.grad-text {
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── LOGO MARK ── */
.logo-mark {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  user-select: none;
}
.logo-word {
  font-family: var(--font-en);
  font-weight: 700;
  font-size: 18px;
  color: var(--text-white);
  letter-spacing: -0.5px;
}
.logo-360 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.logo-360 svg {
  overflow: visible;
}
.logo-360-text {
  font-family: var(--font-en);
  font-weight: 700;
  fill: url(#logoGrad);
}

/* ── NAVBAR ── */
.site-header {
  position: fixed;
  top: 0;
  inset-inline: 0;
  z-index: 1000;
  padding: 0;
  transition: all 0.4s ease;
}
.site-header.scrolled {
  background: rgba(10, 10, 30, 0.85);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 8px 40px rgba(0,0,0,0.4);
}
.nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
}
.nav-links {
  display: flex;
  align-items: center;
  gap: 36px;
  list-style: none;
}
.nav-links a {
  color: var(--text-muted);
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  transition: color 0.25s;
  position: relative;
}
.nav-links a::after {
  content: '';
  position: absolute;
  bottom: -4px;
  right: 0;
  width: 0;
  height: 2px;
  background: var(--grad);
  transition: width 0.3s ease;
  border-radius: 2px;
}
.nav-links a:hover { color: white; }
.nav-links a:hover::after { width: 100%; }

.btn-primary {
  background: var(--grad);
  color: white;
  border: none;
  padding: 10px 24px;
  border-radius: 50px;
  font-family: var(--font-ar);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.btn-primary::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #ff9f2f, #ff7138, #ffc76a);
  opacity: 0;
  transition: opacity 0.3s;
}
.btn-primary:hover::before { opacity: 1; }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(124,58,237,0.5); }
.btn-primary span { position: relative; z-index: 1; }

.btn-ghost {
  background: transparent;
  color: white;
  border: 1.5px solid rgba(255,255,255,0.3);
  padding: 10px 28px;
  border-radius: 50px;
  font-family: var(--font-ar);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: all 0.3s ease;
}
.btn-ghost:hover {
  border-color: rgba(255,255,255,0.8);
  background: rgba(255,255,255,0.06);
  transform: translateY(-2px);
}

/* Hamburger */
.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 6px;
  z-index: 1100;
  background: none;
  border: none;
}
.hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: white;
  border-radius: 2px;
  transition: all 0.35s ease;
  transform-origin: center;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile overlay */
.mobile-menu {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(7,7,26,0.97);
  backdrop-filter: blur(30px);
  z-index: 999;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 32px;
  opacity: 0;
  transition: opacity 0.35s ease;
}
.mobile-menu.open {
  display: flex;
  opacity: 1;
}
.mobile-menu a {
  color: var(--text-white);
  text-decoration: none;
  font-size: 28px;
  font-weight: 700;
  transition: all 0.25s;
}
.mobile-menu a:hover { background: var(--grad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }

/* ── HERO ── */
.hero-section {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
  padding-top: 72px;
}

.hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  animation: float 8s ease-in-out infinite alternate;
}
.orb-1 {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(124,58,237,0.25), transparent 70%);
  top: -10%; right: -5%;
  animation-delay: 0s;
}
.orb-2 {
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(236,72,153,0.2), transparent 70%);
  bottom: 10%; left: 10%;
  animation-delay: -3s;
}
.orb-3 {
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(245,158,11,0.15), transparent 70%);
  top: 40%; left: 40%;
  animation-delay: -5s;
}
.hero-grid-bg {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse at 50% 50%, black 30%, transparent 80%);
}

.hero-radar {
  position: absolute;
  left: -60px;
  top: 50%;
  transform: translateY(-50%);
  width: 520px;
  height: 520px;
  opacity: 0.07;
  animation: spin-slow 30s linear infinite;
}

@keyframes spin-slow { from { transform: translateY(-50%) rotate(0deg); } to { transform: translateY(-50%) rotate(360deg); } }
@keyframes float { 0% { transform: translateY(0) scale(1); } 100% { transform: translateY(-30px) scale(1.05); } }

.hero-content {
  position: relative;
  z-index: 2;
  text-align: right;
  max-width: 780px;
  margin-right: auto;
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(124,58,237,0.12);
  border: 1px solid rgba(124,58,237,0.35);
  padding: 6px 18px;
  border-radius: 50px;
  font-size: 13px;
  color: #ffd0a3;
  margin-bottom: 28px;
  letter-spacing: 0.5px;
}
.badge-dot {
  width: 6px; height: 6px;
  background: #ff8a00;
  border-radius: 50%;
  animation: pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%, 100% { box-shadow: 0 0 0 0 rgba(124,58,237,0.7); }
  50% { box-shadow: 0 0 0 6px rgba(124,58,237,0); }
}

.hero-title {
  font-size: clamp(42px, 6vw, 76px);
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: -1px;
  margin-bottom: 24px;
  color: white;
}
.hero-360-badge {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  margin: 0 8px;
}
.hero-360-badge svg {
  overflow: visible;
}

.hero-sub {
  font-size: clamp(16px, 2vw, 20px);
  color: var(--text-muted);
  max-width: 600px;
  margin-bottom: 44px;
  line-height: 1.8;
}
.hero-ctas {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.hero-ctas .btn-primary { padding: 14px 36px; font-size: 16px; }
.hero-ctas .btn-ghost { padding: 12px 32px; font-size: 16px; }

.hero-stats {
  position: relative;
  z-index: 2;
  margin-top: 80px;
  padding-top: 40px;
  border-top: 1px solid var(--border);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.stat-item {
  text-align: center;
  padding: 20px;
  position: relative;
}
.stat-item:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 0;
  top: 20%;
  height: 60%;
  width: 1px;
  background: var(--border);
}
.stat-num {
  font-family: var(--font-en);
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 700;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: 8px;
}
.stat-label {
  font-size: 14px;
  color: var(--text-muted);
  font-weight: 600;
}

/* ── SECTION COMMON ── */
section { padding: var(--section-pad); }
.section-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: clamp(16px, 1.45vw, 19px);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--accent-magenta);
  margin-bottom: 18px;
}
.section-label::before {
  content: '';
  display: block;
  width: clamp(26px, 2.6vw, 34px);
  height: 2px;
  background: var(--accent-magenta);
  border-radius: 2px;
}
.section-title {
  font-size: clamp(30px, 4vw, 52px);
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: -0.5px;
  margin-bottom: 20px;
}
.section-sub {
  font-size: 17px;
  color: var(--text-muted);
  max-width: 600px;
  line-height: 1.8;
}

/* ── SERVICES ── */
#services { background: linear-gradient(180deg, var(--bg-deep) 0%, var(--bg-base) 100%); }
.services-header { text-align: center; margin-bottom: 70px; }
.services-header .section-sub { margin: 0 auto; }
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.service-card {
  background: rgba(22,22,58,0.7);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 36px 30px;
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
  cursor: pointer;
  backdrop-filter: blur(12px);
}
.service-card::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: var(--radius-md);
  padding: 1px;
  background: var(--grad);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.4s ease;
}
.service-card:hover::before { opacity: 1; }
.service-card::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 120px;
  height: 120px;
  background: radial-gradient(circle at top right, rgba(124,58,237,0.12), transparent 70%);
  pointer-events: none;
}
.service-card:hover {
  transform: translateY(-6px);
  background: rgba(28,28,70,0.9);
  box-shadow: 0 20px 60px rgba(0,0,0,0.3), 0 0 0 1px rgba(124,58,237,0.15);
}
.service-icon {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  background: rgba(124,58,237,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  transition: all 0.3s;
}
.service-card:hover .service-icon {
  background: rgba(124,58,237,0.25);
}
.service-icon svg { width: 26px; height: 26px; }
.service-card h3 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 12px;
  color: white;
}
.service-card p {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.8;
  margin-bottom: 20px;
}
.service-link {
  font-size: 13px;
  font-weight: 700;
  color: var(--accent-purple);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: gap 0.3s, color 0.3s;
}
.service-link:hover { color: var(--accent-magenta); gap: 10px; }

/* ── WHY US ── */
#why {
  background: var(--bg-base);
  position: relative;
  overflow: hidden;
}
#why::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(124,58,237,0.5), rgba(236,72,153,0.5), transparent);
}
.why-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}
.why-left .section-title { font-size: clamp(26px, 3.5vw, 44px); line-height: 1.3; margin-bottom: 24px; }
.why-left p { color: var(--text-muted); font-size: 16px; line-height: 1.9; margin-bottom: 36px; }
.why-cta { margin-top: 8px; }

.timeline { display: flex; flex-direction: column; gap: 0; }
.timeline-item {
  display: flex;
  gap: 24px;
  padding: 28px 0;
  border-bottom: 1px solid var(--border);
  transition: all 0.3s;
  position: relative;
}
.timeline-item:last-child { border-bottom: none; }
.timeline-item:hover .t-num { color: white; background: rgba(124,58,237,0.3); }
.t-num {
  font-family: var(--font-en);
  font-size: 28px;
  font-weight: 700;
  color: var(--text-dim);
  min-width: 52px;
  height: 52px;
  border-radius: 14px;
  background: rgba(255,255,255,0.04);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.35s;
  line-height: 1;
  flex-shrink: 0;
}
.t-content h4 {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 8px;
  color: white;
}
.t-content p { font-size: 14px; color: var(--text-muted); line-height: 1.8; }

/* ── PORTFOLIO ── */
#portfolio { background: linear-gradient(180deg, var(--bg-base) 0%, var(--bg-deep) 100%); }
.portfolio-header { text-align: center; margin-bottom: 48px; }
.portfolio-header .section-sub { margin: 0 auto; }
.filter-chips {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 52px;
}
.chip {
  padding: 8px 22px;
  border-radius: 50px;
  border: 1px solid var(--border);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  transition: all 0.25s;
  background: transparent;
  font-family: var(--font-ar);
}
.chip:hover, .chip.active {
  background: rgba(124,58,237,0.15);
  border-color: rgba(124,58,237,0.5);
  color: white;
}
.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.portfolio-card {
  display: block;
  color: inherit;
  text-decoration: none;
  border-radius: var(--radius-md);
  overflow: hidden;
  position: relative;
  cursor: pointer;
  transition: all 0.4s;
  border: 1px solid var(--border);
  background: var(--bg-card);
}
.portfolio-card:hover { transform: translateY(-6px) scale(1.01); box-shadow: 0 24px 60px rgba(0,0,0,0.4); }
.port-thumb {
  width: 100%;
  height: 200px;
  position: relative;
  overflow: hidden;
}
.port-thumb .overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.35s;
}
.portfolio-card:hover .overlay { opacity: 1; }
.overlay-metric {
  text-align: center;
  color: white;
}
.overlay-metric .metric-num {
  font-family: var(--font-en);
  font-size: 42px;
  font-weight: 700;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}
.overlay-metric .metric-label { font-size: 13px; color: rgba(255,255,255,0.8); margin-top: 4px; }
.port-info { padding: 20px 22px; }
.port-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 3px 12px;
  border-radius: 50px;
  background: rgba(124,58,237,0.15);
  color: #ffd0a3;
  display: inline-block;
  margin-bottom: 10px;
}
.port-name { font-size: 17px; font-weight: 700; color: white; margin-bottom: 6px; }
.port-result { font-size: 13px; color: var(--text-muted); }

/* ── STATS BAND ── */
#stats {
  background: linear-gradient(135deg, #0c0c2a 0%, #12122e 50%, #0c0c2a 100%);
  position: relative;
  overflow: hidden;
  padding: 90px 0;
}
#stats::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 50%, rgba(124,58,237,0.1), transparent 70%);
}
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
  z-index: 1;
}
.big-stat {
  text-align: center;
  padding: 30px 20px;
  position: relative;
}
.big-stat:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 0;
  top: 15%;
  height: 70%;
  width: 1px;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.1), transparent);
}
.big-num {
  font-family: var(--font-en);
  font-size: clamp(42px, 5vw, 68px);
  font-weight: 700;
  line-height: 1;
  margin-bottom: 12px;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.big-label { font-size: 15px; color: var(--text-muted); font-weight: 600; }

/* ── TESTIMONIALS ── */
#testimonials {
  background: var(--bg-base);
  position: relative;
  overflow: hidden;
}
.testimonials-header { text-align: center; margin-bottom: 60px; }
.carousel-wrap { position: relative; overflow: hidden; }
.carousel-track {
  display: flex;
  transition: transform 0.6s cubic-bezier(0.4,0,0.2,1);
}
.testimonial-slide {
  min-width: 100%;
  padding: 0 80px;
}
.tcard {
  background: rgba(22,22,58,0.6);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 48px;
  position: relative;
  backdrop-filter: blur(16px);
  max-width: 800px;
  margin: 0 auto;
}
.tcard::before {
  content: '"';
  position: absolute;
  top: 24px;
  left: 40px;
  font-size: 120px;
  line-height: 1;
  color: rgba(124,58,237,0.12);
  font-family: Georgia, serif;
}
.stars { display: flex; gap: 4px; margin-bottom: 20px; justify-content: flex-end; }
.star { color: var(--accent-orange); font-size: 18px; }
.tquote {
  font-size: 17px;
  line-height: 1.9;
  color: var(--text-muted);
  margin-bottom: 32px;
  text-align: right;
}
.tclient {
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: flex-end;
}
.client-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-en);
  font-weight: 700;
  font-size: 18px;
  color: white;
  flex-shrink: 0;
}
.client-info { text-align: right; }
.client-name { font-size: 16px; font-weight: 700; color: white; }
.client-role { font-size: 13px; color: var(--text-muted); }

.carousel-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 40px;
}
.carousel-btn {
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: rgba(255,255,255,0.04);
  color: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
  font-size: 0;
}
.carousel-btn:hover {
  background: rgba(124,58,237,0.2);
  border-color: rgba(124,58,237,0.5);
}
.carousel-btn svg { width: 18px; height: 18px; }
.dots { display: flex; gap: 8px; }
.dot {
  width: 8px; height: 8px;
  border-radius: 4px;
  background: var(--border-hover);
  cursor: pointer;
  transition: all 0.35s;
}
.dot.active {
  background: var(--accent-purple);
  width: 24px;
}

/* ── PRICING ── */
#pricing { background: linear-gradient(180deg, var(--bg-deep) 0%, var(--bg-base) 100%); }
.pricing-header { text-align: center; margin-bottom: 60px; }
.pricing-header .section-sub { margin: 0 auto; }
.pricing-grid {
  display: grid;
  grid-template-columns: 1fr 1.08fr 1fr;
  gap: 24px;
  align-items: start;
}
.price-card {
  background: rgba(18,18,42,0.8);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px 36px;
  position: relative;
  transition: all 0.4s;
  backdrop-filter: blur(16px);
}
.price-card:hover { transform: translateY(-6px); }
.price-card.featured {
  background: rgba(22,22,60,0.9);
  border-color: transparent;
  box-shadow: 0 0 0 1px rgba(124,58,237,0.5), 0 30px 70px rgba(124,58,237,0.2);
  transform: scale(1.02);
}
.price-card.featured:hover { transform: scale(1.02) translateY(-6px); }
.featured-ribbon {
  position: absolute;
  top: -1px;
  right: -1px;
  left: -1px;
  background: var(--grad);
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  padding: 6px;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  letter-spacing: 0.5px;
  color: white;
}
.price-name {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 8px;
  margin-top: 20px;
  color: white;
}
.price-card:not(.featured) .price-name { margin-top: 0; }
.price-amount {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 8px;
}
.price-num {
  font-family: var(--font-en);
  font-size: 48px;
  font-weight: 700;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}
.price-currency { font-size: 16px; color: var(--text-muted); font-weight: 600; }
.price-desc { font-size: 14px; color: var(--text-muted); margin-bottom: 32px; line-height: 1.7; }
.price-features { list-style: none; margin-bottom: 36px; display: flex; flex-direction: column; gap: 14px; }
.price-features li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: #d3d3d3;
}
.check-icon { flex-shrink: 0; }
.price-features li svg { width: 18px; height: 18px; }
.price-card .btn-primary,
.price-card .btn-ghost { width: 100%; text-align: center; padding: 14px; font-size: 15px; }

/* ── CTA BANNER ── */
#cta-banner {
  background: var(--grad);
  padding: 90px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}
#cta-banner::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 20% 50%, rgba(255,255,255,0.1), transparent 50%),
    radial-gradient(ellipse at 80% 50%, rgba(0,0,0,0.15), transparent 50%);
}
.cta-title {
  font-size: clamp(26px, 4vw, 46px);
  font-weight: 900;
  color: white;
  margin-bottom: 36px;
  position: relative;
  z-index: 1;
  line-height: 1.3;
}
.btn-white {
  background: white;
  color: #ff8a00;
  border: none;
  padding: 16px 48px;
  border-radius: 50px;
  font-family: var(--font-ar);
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
  display: inline-block;
  text-decoration: none;
  transition: all 0.3s;
  position: relative;
  z-index: 1;
}
.btn-white:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0,0,0,0.3); background: #f8f4ff; }

/* ── CONTACT ── */
#contact {
  background: var(--bg-deep);
  padding: var(--section-pad);
}
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 70px;
  align-items: start;
}
.contact-info { display: flex; flex-direction: column; gap: 20px; }
.info-title { font-size: 32px; font-weight: 900; margin-bottom: 12px; }
.info-sub { color: var(--text-muted); font-size: 15px; line-height: 1.8; margin-bottom: 16px; }
.info-card {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 16px 20px;
  transition: all 0.3s;
}
.info-card:hover { border-color: rgba(124,58,237,0.4); transform: translateX(-4px); }
.info-icon {
  width: 44px; height: 44px;
  border-radius: 12px;
  background: rgba(124,58,237,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.info-icon svg { width: 20px; height: 20px; }
.info-text h5 { font-size: 14px; font-weight: 700; color: white; margin-bottom: 2px; }
.info-text p { font-size: 13px; color: var(--text-muted); }
.hours-note { font-size: 13px; color: var(--text-muted); padding-top: 12px; }

.contact-form {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 44px;
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.form-group { margin-bottom: 16px; }
.form-group label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-muted);
  margin-bottom: 8px;
}
.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  color: white;
  font-family: var(--font-ar);
  font-size: 15px;
  transition: all 0.3s;
  outline: none;
  direction: rtl;
  appearance: none;
  -webkit-appearance: none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: rgba(124,58,237,0.6);
  background: rgba(124,58,237,0.05);
  box-shadow: 0 0 0 3px rgba(124,58,237,0.1);
}
.form-group select { cursor: pointer; }
.form-group select option { background: var(--bg-surface); color: white; }
.contact-form select,.lead-form select{color-scheme:dark;cursor:pointer}
.lead-form select option{background:var(--bg-surface);color:#fff}
.contact-form select:focus,.lead-form select:focus{border-color:#ff8a00;background:rgba(255,138,0,.05);box-shadow:0 0 0 3px rgba(255,138,0,.14);outline:none}
.contact-form select option:checked,.lead-form select option:checked{background:var(--bg-surface)!important;background-color:var(--bg-surface)!important;color:#fff!important}
.contact-form select option:hover,.contact-form select option:focus,.lead-form select option:hover,.lead-form select option:focus{background:#ff8a00!important;background-color:#ff8a00!important;box-shadow:0 0 0 100vmax #ff8a00 inset!important;color:#111!important}
.m360-service-select{position:relative;width:100%}.m360-native-service-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;inset:auto!important;padding:0!important;border:0!important}.m360-service-select-trigger{width:100%;min-height:53px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 15px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.04);color:#fff;font-family:var(--font-ar);font-size:15px;text-align:right;cursor:pointer}.m360-service-select-trigger i{font-size:13px;color:#fff;transition:transform .2s}.m360-service-select.is-open .m360-service-select-trigger{border-color:#ff8a00;background:rgba(255,138,0,.05);box-shadow:0 0 0 3px rgba(255,138,0,.14)}.m360-service-select.is-open .m360-service-select-trigger i{transform:rotate(180deg)}.m360-service-select-menu{position:absolute;z-index:120;top:calc(100% + 5px);inset-inline:0;padding:5px;background:#111;border:1px solid rgba(255,255,255,.35);border-radius:10px;box-shadow:0 18px 48px rgba(0,0,0,.5);max-height:320px;overflow:auto}.m360-service-select-menu[hidden]{display:none}.m360-service-select-option{display:block;width:100%;border:0;border-radius:6px;padding:10px 13px;background:#111;color:#fff;font-family:var(--font-ar);font-size:15px;text-align:right;cursor:pointer;outline:none}.m360-service-select-option:hover,.m360-service-select-option:focus{background:#ff8a00;color:#111}.m360-service-select-option[aria-selected="true"]{font-weight:800}.m360-service-select-option[aria-selected="true"]:not(:hover):not(:focus){background:#111;color:#fff}
.form-group textarea { resize: vertical; min-height: 120px; }
.form-group input::placeholder,
.form-group textarea::placeholder { color: var(--text-dim); }
.form-submit { width: 100%; padding: 15px; font-size: 16px; margin-top: 8px; }

/* ── FOOTER ── */
footer {
  background: linear-gradient(180deg, var(--bg-base) 0%, #030303 100%);
  padding: 80px 0 0;
  border-top: 1px solid var(--border);
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 60px;
  margin-bottom: 60px;
}
.footer-brand p {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.9;
  margin-top: 20px;
  max-width: 280px;
}
.footer-col h5 {
  font-size: 15px;
  font-weight: 700;
  color: white;
  margin-bottom: 24px;
  position: relative;
  padding-bottom: 12px;
}
.footer-col h5::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 32px;
  height: 2px;
  background: var(--grad);
  border-radius: 2px;
}
.footer-links { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.footer-links a {
  color: var(--text-muted);
  text-decoration: none;
  font-size: 14px;
  transition: color 0.25s;
  display: flex;
  align-items: center;
  gap: 6px;
}
.footer-links a::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--text-dim);
  transition: background 0.25s;
  flex-shrink: 0;
}
.footer-links a:hover { color: white; }
.footer-links a:hover::before { background: var(--accent-purple); }

.newsletter-form { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
.newsletter-input {
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--border);
  border-radius: 50px;
  padding: 12px 20px;
  color: white;
  font-family: var(--font-ar);
  font-size: 14px;
  direction: rtl;
  outline: none;
  transition: all 0.3s;
}
.newsletter-input:focus { border-color: rgba(124,58,237,0.5); background: rgba(124,58,237,0.05); }
.newsletter-input::placeholder { color: var(--text-dim); }
.newsletter-btn {
  background: var(--grad);
  color: white;
  border: none;
  border-radius: 50px;
  padding: 11px 24px;
  font-family: var(--font-ar);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s;
}
.newsletter-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(124,58,237,0.4); }

.footer-bottom {
  border-top: 1px solid var(--border);
  padding: 24px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}
.footer-copy { font-size: 13px; color: var(--text-dim); }
.social-links { display: flex; gap: 12px; }
.social-link {
  width: 38px; height: 38px;
  border-radius: 10px;
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  text-decoration: none;
  transition: all 0.3s;
}
.social-link:hover {
  border-color: rgba(124,58,237,0.5);
  background: rgba(124,58,237,0.15);
  color: white;
  transform: translateY(-2px);
}
.social-link svg { width: 16px; height: 16px; }

/* ── ANIMATE ON SCROLL ── */
.anim-up {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.anim-up.visible {
  opacity: 1;
  transform: translateY(0);
}
.anim-delay-1 { transition-delay: 0.1s; }
.anim-delay-2 { transition-delay: 0.2s; }
.anim-delay-3 { transition-delay: 0.3s; }
.anim-delay-4 { transition-delay: 0.4s; }
.anim-delay-5 { transition-delay: 0.5s; }

/* ── PULSE ANIMATION FOR 360 ── */
@keyframes pulse-ring {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; filter: drop-shadow(0 0 12px rgba(124,58,237,0.8)); }
}
.hero-360-ring { animation: pulse-ring 3s ease-in-out infinite; }

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
  .pricing-grid { grid-template-columns: 1fr; gap: 20px; }
  .price-card.featured { transform: none; }
  .price-card.featured:hover { transform: translateY(-6px); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .why-grid { gap: 50px; }
}

@media (max-width: 768px) {
  :root { --section-pad: 70px 0; }
  .container { padding: 0 20px; }
  .nav-links, .nav-cta { display: none; }
  .hamburger { display: flex; }
  .hamburger span { background: var(--accent-purple); }

  .mobile-menu {
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 96px 24px 32px;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .mobile-menu a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-height: 52px;
    padding: 13px 8px;
    border-bottom: 1px solid var(--accent-purple);
    color: var(--text-white);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
    text-align: right;
  }
  .mobile-menu a:first-child {
    border-top: 1px solid var(--accent-purple);
  }
  .mobile-menu a:hover,
  .mobile-menu a:focus-visible {
    background: rgba(255, 138, 0, 0.08);
    color: var(--accent-orange);
    -webkit-text-fill-color: currentColor;
  }
  #mobileMenu.mobile-menu {
    background: rgba(7, 7, 7, 0.98);
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 92px 22px 28px;
  }
  #mobileMenu.mobile-menu .mobile-link {
    flex: 0 0 52px;
    width: 100%;
    min-height: 52px;
    padding: 13px 10px;
    border-bottom: 1px solid #ff8a00;
    color: #ffffff;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0;
    text-align: right;
  }
  #mobileMenu.mobile-menu .mobile-link:first-child {
    border-top: 1px solid #ff8a00;
  }
  #mobileMenu.mobile-menu .mobile-link:hover,
  #mobileMenu.mobile-menu .mobile-link:focus-visible {
    background: rgba(255, 138, 0, 0.1);
    color: #ffb347;
    -webkit-text-fill-color: #ffb347;
  }

  .hero-radar { display: none; }
  .hero-stats { grid-template-columns: repeat(2, 1fr); }
  .hero-stat .stat-item:nth-child(2)::after,
  .hero-stats .stat-item:nth-child(4)::after { display: none; }

  .services-grid { grid-template-columns: 1fr; }
  .why-grid { grid-template-columns: 1fr; gap: 50px; }
  .portfolio-grid { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .big-stat:nth-child(2)::after,
  .big-stat:nth-child(4)::after { display: none; }
  .testimonial-slide { padding: 0 16px; }
  .tcard { padding: 28px 24px; }
  .contact-grid { grid-template-columns: 1fr; gap: 40px; }
  .contact-form { padding: 28px 22px; }
  .form-row { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 36px; }
  .footer-bottom { flex-direction: column-reverse; text-align: center; }
  .filter-chips { gap: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: 0.01ms !important; }
  .anim-up { opacity: 1 !important; transform: none !important; }
}

/* Marketing360 brand additions */
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:max-content}.brand-logo{width:42px;height:42px;object-fit:contain;display:block}.brand-word{display:flex;direction:ltr;align-items:baseline;font-family:'Space Grotesk',sans-serif;font-size:18px;letter-spacing:-.6px}.brand-word b{color:#fff}.brand-word em{font-style:normal;color:var(--accent-orange);font-weight:700}.site-header{position:fixed;top:0;inset-inline:0;z-index:1000;transition:.35s}.site-header.scrolled{background:rgba(7,7,7,.88);backdrop-filter:blur(24px);border-bottom:1px solid var(--border);box-shadow:0 8px 40px rgba(0,0,0,.45)}
.hero-section{min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;padding-top:72px}.hero-content{position:relative;z-index:2;text-align:right;max-width:780px;margin-right:auto}.hero-bg{position:absolute;inset:0}.hero-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse at 50% 50%,black 30%,transparent 80%)}
.service-icon svg{width:26px;height:26px;stroke:var(--accent-orange);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.service-icon img{width:26px;height:26px;object-fit:contain}.service-card:hover .service-icon svg{filter:drop-shadow(0 0 7px rgba(255,138,0,.35))}
.port-thumb img{width:100%;height:100%;object-fit:cover}.port-placeholder{height:100%;display:grid;place-items:center;font-family:'Space Grotesk';font-size:44px;font-weight:700;color:var(--accent-orange);background:radial-gradient(circle at 35% 25%,rgba(255,138,0,.28),transparent 55%),#111}.portfolio-card{min-height:300px}
.contact-head{text-align:center;margin-bottom:60px}.info-icon{color:var(--accent-orange);font-size:22px}.academy-card{display:flex;justify-content:space-between;gap:40px;align-items:center;padding:52px;border:1px solid var(--border);background:linear-gradient(135deg,rgba(255,138,0,.08),rgba(255,255,255,.02));border-radius:var(--radius-lg)}.academy-card h2{font-size:clamp(28px,4vw,48px);margin:6px 0 14px}.academy-card p{color:var(--text-muted);max-width:720px}.academy-status{display:flex;flex-direction:column;align-items:center;gap:14px}.academy-status>span{font-weight:900;color:var(--accent-orange);font-size:24px;white-space:nowrap}.academy-status>small{max-width:240px;color:var(--text-muted);font-size:13px;line-height:1.8;text-align:center}.academy-status.is-empty>span{font-size:clamp(24px,3vw,34px)}
.wa-float{position:fixed;left:24px;bottom:24px;width:64px;height:64px;border-radius:50%;background:#19b954;display:grid;place-items:center;z-index:1400;box-shadow:0 14px 38px rgba(0,0,0,.35),0 0 0 5px rgba(25,185,84,.12);transition:.25s}.wa-float:hover{transform:translateY(-4px) scale(1.04)}.wa-float svg{width:42px;height:42px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.footer-brand .brand{display:inline-flex}.footer-col span{font-size:14px;color:var(--text-muted)}.social-link svg{width:17px;height:17px}.social-link:hover{border-color:rgba(255,138,0,.55);background:rgba(255,138,0,.12)}
.carousel-btn{font-size:26px}.dot{border:0;padding:0}.client-avatar{background:linear-gradient(135deg,#ff5a00,#ffb347)}
@media(max-width:768px){.brand-word{font-size:16px}.brand-logo{width:36px;height:36px}.academy-card{padding:30px 22px;flex-direction:column;align-items:flex-start}.wa-float{width:58px;height:58px;left:16px;bottom:16px}.wa-float svg{width:38px;height:38px}}
/* Compatibility styling for inner pages */
.page-hero,.academy-hero{padding:150px 0 90px;background:radial-gradient(circle at 80% 0,rgba(255,138,0,.14),transparent 35%),var(--bg-deep)}.page-hero h1,.academy-hero h1{font-size:clamp(38px,6vw,72px);line-height:1.15;margin:12px 0 18px}.page-hero p,.academy-hero p{color:var(--text-muted);max-width:760px;font-size:18px}.section{padding:var(--section-pad)}.section-soft{background:var(--bg-base)}.eyebrow{color:var(--accent-orange);font-weight:800}.two-col{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px;align-items:center}.big-number{font:700 clamp(80px,15vw,180px)/1 'Space Grotesk';color:var(--accent-orange);opacity:.22}.mini-grid,.cards-grid,.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.mini-grid article,.course-card,.contact-panel,.lead-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:30px}.mini-grid article span{color:var(--accent-orange);font-weight:800}.mini-grid article p,.course-card p{color:var(--text-muted)}.service-card.tall{min-height:260px}.project-media{height:220px;border-radius:16px;overflow:hidden;background:#111}.project-media img{width:100%;height:100%;object-fit:cover}.project-placeholder{height:100%;display:grid;place-items:center;color:var(--accent-orange);font:700 40px 'Space Grotesk'}.project-meta{padding:18px 4px}.project-meta span{color:var(--accent-orange);font-size:12px;font-weight:700}.project-meta p{color:var(--text-muted)}.pricing-grid .price-card>strong{display:block;font:700 42px 'Space Grotesk';color:var(--accent-orange);margin:12px 0 22px}.pricing-grid .price-card ul{list-style:none;display:grid;gap:12px;margin-bottom:24px}.pricing-grid .price-card li{color:var(--text-muted)}.btn,.btn-dark{display:inline-block;border:0;border-radius:50px;padding:12px 26px;text-decoration:none;background:var(--grad);color:#fff;font-weight:800}.btn-dark{background:#fff;color:#111}.statement.center{text-align:center}.academy-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:center}.academy-mark{font:700 clamp(70px,12vw,150px)/.8 'Space Grotesk';color:#fff}.academy-mark span{color:var(--accent-orange)}.academy-mark small{display:block;font-size:16px;letter-spacing:5px;color:var(--text-muted);margin-top:20px}.coming-pill{display:inline-block;padding:7px 18px;border-radius:50px;background:rgba(255,138,0,.12);color:var(--accent-orange);font-weight:800;margin-bottom:18px}.empty-academy{text-align:center;padding:70px 20px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-card)}.empty-academy span{color:var(--accent-orange);font-weight:900}.course-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:14px;margin-bottom:18px}.contact-panel{display:grid;gap:16px}.contact-panel a,.contact-panel>div{display:flex;flex-direction:column;gap:3px;padding:16px;border:1px solid var(--border);border-radius:12px;text-decoration:none;color:#fff}.contact-panel span{color:var(--text-muted);font-size:13px}.lead-form{display:grid;gap:15px}.lead-form label{display:grid;gap:8px;color:var(--text-muted);font-size:14px}.lead-form input,.lead-form select,.lead-form textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:12px;padding:12px 15px;color:#fff;font-family:var(--font-ar)}.about-page-hero{padding-bottom:64px}.about-page-hero .container{max-width:980px}.about-page-hero h1{max-width:850px}.about-story{max-width:900px;color:var(--text-muted);font-size:clamp(17px,1.45vw,20px);line-height:2;text-wrap:pretty}.about-story p{max-width:none;margin:0 0 1.25em;font-size:inherit;line-height:inherit;color:inherit}.about-story p:last-child{margin-bottom:0}.about-values{padding-top:60px;padding-bottom:60px}.about-values .mini-grid{align-items:stretch}.about-values article{height:100%}.about-values article h3{font-size:clamp(22px,2vw,29px);margin:10px 0}.about-values article p{font-size:17px;line-height:1.9}.about-360-finale{padding:70px 0 90px;background:radial-gradient(circle at 50% 100%,rgba(255,138,0,.12),transparent 58%),var(--bg-deep);text-align:center}.about-360-mark{font:800 clamp(100px,22vw,260px)/.8 'Space Grotesk';letter-spacing:-.06em;color:var(--accent-orange);opacity:.28}.footer-address span,.footer-address a{display:block;line-height:1.9;white-space:normal}
.about-story p:nth-of-type(1)::first-line,.about-story p:nth-of-type(4)::first-line,.about-story p:nth-of-type(5)::first-line{color:var(--accent-orange);font-size:1.12em;font-weight:800;line-height:2.15}
@media(max-width:900px){.two-col,.academy-grid{grid-template-columns:1fr}.mini-grid,.cards-grid,.project-grid{grid-template-columns:1fr 1fr}.about-page-hero{padding-bottom:50px}.about-values{padding-top:42px}}@media(max-width:640px){.mini-grid,.cards-grid,.project-grid{grid-template-columns:1fr}.about-page-hero{padding-top:118px;padding-bottom:36px}.about-page-hero h1{font-size:clamp(38px,13vw,54px)}.about-story{font-size:16px;line-height:1.9}.about-story p{margin-bottom:1.1em}.about-story p:nth-of-type(1)::first-line,.about-story p:nth-of-type(4)::first-line,.about-story p:nth-of-type(5)::first-line{font-size:1.08em;line-height:2}.about-values{padding:30px 0}.about-values .mini-grid{gap:16px}.about-values article{padding:24px}.about-values article p{font-size:16px;line-height:1.85}.about-360-finale{padding:50px 0 70px}.about-360-mark{font-size:clamp(96px,40vw,160px)}}

/* ── CLIENTS / LOGOS ── */
#clients{background:linear-gradient(180deg,var(--bg-base) 0%,var(--bg-deep) 100%);padding-top:80px;padding-bottom:90px}
.clients-header{text-align:center;margin-bottom:40px}.clients-header .section-sub{margin:0 auto}
.clients-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:stretch}
.client-logo-card{min-height:120px;border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.025);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px;text-decoration:none;color:var(--text-muted);transition:.3s ease;overflow:hidden}
.client-logo-card:hover{transform:translateY(-4px);border-color:rgba(255,138,0,.45);background:rgba(255,138,0,.06)}
.client-logo-card[href]{cursor:pointer}
.client-logo-card[href]:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-color:var(--accent)}
.client-logo-card img{width:100%;height:70px;object-fit:contain;display:block;filter:saturate(.9)}
.client-logo-card span{font-size:12px;font-weight:700;opacity:.8}
.client-avatar{overflow:hidden}.client-avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
@media(max-width:1024px){.clients-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.clients-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.client-logo-card{min-height:100px;padding:12px}.client-logo-card img{height:58px}}
.form-success{margin-bottom:18px;padding:14px 18px;border:1px solid rgba(255,138,0,.45);border-radius:12px;background:rgba(255,138,0,.12);color:#fff;font-weight:700}

/* Dynamic content system */
.academy-catalog{background:linear-gradient(180deg,#0b0b0b,#070707)}.catalog-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:42px}.catalog-heading h2{font-size:clamp(30px,4vw,52px);margin:8px 0 0}.catalog-heading>p{max-width:430px;color:var(--text-muted)}
.course-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.course-card-pro{min-width:0;background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.018));border:1px solid var(--border);border-radius:24px;overflow:hidden;transition:.35s ease;box-shadow:0 18px 50px rgba(0,0,0,.18)}.course-card-pro:hover{transform:translateY(-8px);border-color:rgba(255,138,0,.5);box-shadow:0 24px 70px rgba(0,0,0,.36)}.course-cover{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:#111}.course-cover img{width:100%;height:100%;object-fit:cover;transition:.5s ease}.course-card-pro:hover .course-cover img{transform:scale(1.045)}.course-cover-fallback{height:100%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at 70% 20%,rgba(255,138,0,.52),transparent 34%),linear-gradient(145deg,#282018,#070707)}.course-cover-fallback b{font:800 54px/1 'Space Grotesk';color:#fff}.course-cover-fallback span{color:var(--accent-orange);font-size:11px;letter-spacing:6px;margin-top:12px}.course-badge{position:absolute;top:16px;right:16px;padding:7px 12px;border-radius:50px;background:rgba(7,7,7,.82);backdrop-filter:blur(12px);color:#fff;font-size:11px;font-weight:800;border:1px solid rgba(255,255,255,.12)}.course-badge.inline{position:static;display:inline-flex;background:rgba(255,138,0,.12);border-color:rgba(255,138,0,.35);color:var(--accent-orange)}.course-card-body{padding:24px}.course-meta{display:flex;flex-wrap:wrap;gap:8px 14px;color:#a9a9a9;font-size:11px}.course-card-body h3{font-size:22px;line-height:1.45;margin:14px 0 10px}.course-card-body h3 a{color:#fff;text-decoration:none}.course-card-body>p{color:var(--text-muted);font-size:14px;line-height:1.9;min-height:54px}.course-card-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid var(--border);padding-top:18px;margin-top:20px}.course-price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.course-price strong{font:800 clamp(34px,5vw,52px)/1 'Space Grotesk';color:#fff}.course-price span{font-size:13px;color:var(--text-muted);font-weight:700}.course-price del{color:#777;font-size:15px}.course-price.compact strong{font-size:28px;color:var(--accent-orange)}.course-price.compact del{order:2}.course-arrow{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fff;color:#111;text-decoration:none;font-size:20px;transition:.25s}.course-arrow:hover{background:var(--accent-orange);color:#fff;transform:translateX(-3px)}
.course-detail-hero{padding:155px 0 90px;background:radial-gradient(circle at 18% 12%,rgba(255,138,0,.2),transparent 32%),#070707}.course-detail-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:70px;align-items:center}.course-detail-grid h1{font-size:clamp(40px,6vw,76px);line-height:1.17;margin:20px 0}.course-detail-grid article>p{color:#c6c6c6;font-size:19px;line-height:1.95;max-width:780px}.course-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:34px}.course-facts span{display:flex;flex-direction:column;gap:5px;padding:15px;border:1px solid var(--border);border-radius:14px;color:#888;font-size:11px}.course-facts b{color:#fff;font-size:14px}.course-enroll-card{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);border-radius:26px;padding:18px;box-shadow:0 30px 80px rgba(0,0,0,.45)}.course-enroll-cover{aspect-ratio:16/10;overflow:hidden;border-radius:17px;margin-bottom:22px}.course-enroll-cover>img{width:100%;height:100%;object-fit:cover}.course-enroll-card .btn-primary{display:flex;justify-content:center;margin-top:18px}.course-enroll-card>small{display:block;text-align:center;color:#858585;margin-top:12px}.enroll-note{margin-top:15px;color:#aaa;font-size:13px}.enroll-note b{color:#fff}.course-detail-body{background:#0a0a0a}.course-content-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.5fr);gap:52px;align-items:start}.rich-copy{color:#c2c2c2;line-height:2}.rich-copy h2,.rich-copy h3{color:#fff}.course-intro{font-size:18px}.course-panel{background:rgba(255,255,255,.025);border:1px solid var(--border);border-radius:24px;padding:34px;margin-top:28px}.course-panel h2{font-size:clamp(25px,3vw,38px);margin:8px 0 26px}.panel-kicker{color:var(--accent-orange);font-size:12px;font-weight:900}.outcome-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.outcome-grid>div{display:flex;gap:12px;padding:16px;background:rgba(255,255,255,.025);border-radius:13px;color:#d4d4d4}.outcome-grid b{color:var(--accent-orange)}.curriculum-list{display:grid;gap:10px}.curriculum-list>div{display:flex;align-items:center;gap:18px;padding:18px;border-bottom:1px solid var(--border);color:#ddd}.curriculum-list b{font:700 22px 'Space Grotesk';color:var(--accent-orange);opacity:.72}.side-panel,.instructor-panel{padding:25px;border:1px solid var(--border);border-radius:20px;background:rgba(255,255,255,.025);margin-bottom:18px}.side-panel h3{margin-top:0}.side-panel ul{list-style:none;padding:0;margin:0;display:grid;gap:13px}.side-panel li{color:#bbb;line-height:1.65;padding-right:20px;position:relative}.side-panel li:before{content:'✓';position:absolute;right:0;color:var(--accent-orange);font-weight:900}.side-panel.accent{background:linear-gradient(145deg,rgba(255,138,0,.13),rgba(255,255,255,.025));border-color:rgba(255,138,0,.27)}.instructor-panel{display:flex;flex-direction:column;gap:6px}.instructor-panel small,.instructor-panel span{color:#888}.instructor-panel strong{font-size:20px;color:#fff}
.detail-shell{background:#0a0a0a}.detail-layout,.project-detail{display:grid;grid-template-columns:.65fr 1.35fr;gap:70px;align-items:start}.detail-mark{min-height:420px;border-radius:25px;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at 50% 30%,rgba(255,138,0,.32),transparent 46%),#111;border:1px solid var(--border);position:sticky;top:110px}.detail-mark.has-image{height:520px;min-height:0;display:block;overflow:hidden;background:#111;box-shadow:0 22px 70px rgba(0,0,0,.35)}.detail-service-image{display:block;width:100%;height:100%;object-fit:cover}.detail-mark .detail-service-icon{width:92px;height:92px;margin:0 auto 20px;border-radius:28px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-orange),var(--accent-gold));color:#111;font-size:38px;box-shadow:0 18px 45px rgba(255,138,0,.24)}.detail-mark>strong{display:block;font:800 clamp(62px,9vw,112px)/1 'Space Grotesk';color:var(--accent-orange)}.detail-mark small{color:#aaa}.detail-copy h2{font-size:clamp(34px,5vw,62px);line-height:1.25;margin:12px 0}.detail-lead{font-size:20px;line-height:1.9;color:#ddd}.detail-benefits{display:grid;gap:10px;margin:28px 0}.detail-benefits>div{display:flex;gap:16px;align-items:center;padding:15px;border:1px solid var(--border);border-radius:13px;color:#ccc}.detail-benefits b{color:var(--accent-orange)}.project-detail{grid-template-columns:1fr 1fr}.project-detail-media{height:min(70vh,650px);position:sticky;top:110px;border-radius:25px;overflow:hidden;background:#111}.project-detail-media img{width:100%;height:100%;object-fit:cover}.result-callout{display:flex;flex-direction:column;gap:6px;padding:22px;margin:26px 0;border-right:3px solid var(--accent-orange);background:rgba(255,138,0,.07);border-radius:14px}.result-callout small{color:var(--accent-orange)}.result-callout strong{font-size:18px;color:#fff}
.detail-copy>.detail-cta{display:flex;width:max-content;min-width:220px;justify-content:center;align-items:center;margin-top:4px;padding:14px 30px;background:linear-gradient(135deg,#ff8a00,#ffc247);color:#111;border:1px solid rgba(255,194,71,.75);box-shadow:0 14px 34px rgba(255,138,0,.22);transition:transform .25s ease,box-shadow .25s ease,filter .25s ease}.detail-copy>.detail-cta:hover{transform:translateY(-4px);box-shadow:0 20px 46px rgba(255,138,0,.38);filter:brightness(1.05)}.detail-copy>.detail-cta.anim-up.visible{animation:m360-detail-cta-pop .78s cubic-bezier(.22,.9,.3,1.25) .12s 2}@keyframes m360-detail-cta-pop{0%,100%{transform:translateY(0) rotate(0)}35%{transform:translateY(-8px) rotate(-1.2deg)}70%{transform:translateY(2px) rotate(.7deg)}}
.m360-attention-target{will-change:transform}.m360-attention-target.m360-attention-active{animation:m360-attention-float 2.35s ease-in-out .12s infinite;box-shadow:0 14px 34px rgba(255,138,0,.25)}.m360-attention-target.m360-attention-active:hover{animation-play-state:paused;transform:translateY(-5px) scale(1.025);box-shadow:0 22px 50px rgba(255,138,0,.42)}.academy-status>span.m360-attention-target{display:inline-block;padding:3px 8px;border-radius:12px}@keyframes m360-attention-float{0%,100%{transform:translateY(0);box-shadow:0 14px 34px rgba(255,138,0,.18)}50%{transform:translateY(-8px);box-shadow:0 24px 48px rgba(255,138,0,.38)}}
@media(max-width:1024px){.course-grid{grid-template-columns:repeat(2,1fr)}.course-detail-grid,.course-content-grid{grid-template-columns:1fr}.course-enroll-card{max-width:600px}.course-facts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.catalog-heading{display:block}.course-grid,.outcome-grid,.detail-layout,.project-detail{grid-template-columns:1fr}.course-detail-hero{padding-top:125px}.course-detail-grid{gap:35px}.course-facts{grid-template-columns:1fr 1fr}.detail-mark,.project-detail-media{position:relative;top:auto;min-height:280px;height:430px}.detail-mark.has-image{height:430px}.course-card-body h3{font-size:20px}.detail-copy>.detail-cta{width:100%;min-width:0}}

/* Commercial dynamic-content polish */
.service-card-link{display:flex!important;flex-direction:column;color:inherit;text-decoration:none;position:relative;overflow:hidden;isolation:isolate}.service-card-link:before{content:'';position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(255,138,0,.13);filter:blur(50px);top:-90px;left:-80px;z-index:-1;transition:.4s}.service-card-link:hover:before{transform:scale(1.55)}.service-card-link:hover{border-color:rgba(255,138,0,.52);transform:translateY(-7px);box-shadow:0 24px 65px rgba(0,0,0,.35)}.service-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.service-card-link .service-icon{width:58px;height:58px;border:1px solid rgba(255,138,0,.28);border-radius:17px;display:grid;place-items:center;background:rgba(255,138,0,.08);font-size:24px;color:var(--accent-orange)}.service-index{font:700 13px 'Space Grotesk';color:#666;letter-spacing:2px}.service-card-link h3{font-size:22px;line-height:1.45}.service-card-link p{flex:1;line-height:1.9}.service-card-link .service-link{display:flex;align-items:center;justify-content:space-between;margin-top:22px;padding-top:18px;border-top:1px solid var(--border);color:#fff;font-size:13px;font-weight:800}.service-card-link .service-link i{color:var(--accent-orange);font-size:18px;transition:.25s}.service-card-link:hover .service-link i{transform:translateX(-5px)}
.stat-icon{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;color:var(--accent-orange);background:rgba(255,138,0,.09);border:1px solid rgba(255,138,0,.17);margin-bottom:10px}.big-stat .stat-icon{width:46px;height:46px;font-size:19px}
.portfolio-grid-pro{align-items:stretch}.portfolio-card-pro{border-radius:24px!important;overflow:hidden;border:1px solid var(--border);background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015));transition:.4s!important}.portfolio-card-pro:hover{transform:translateY(-8px);border-color:rgba(255,138,0,.48);box-shadow:0 28px 70px rgba(0,0,0,.4)}.portfolio-card-pro .port-thumb{position:relative;height:310px}.portfolio-card-pro .port-thumb:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(7,7,7,.88))}.portfolio-card-pro .port-info{padding:24px}.project-number{position:absolute;top:18px;right:18px;z-index:2;font:800 12px 'Space Grotesk';color:#fff;padding:7px 10px;border-radius:40px;background:rgba(7,7,7,.7);backdrop-filter:blur(12px)}.project-view{position:absolute;left:18px;bottom:18px;z-index:3;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;color:#111;font-size:19px;transition:.3s}.portfolio-card-pro:hover .project-view{background:var(--accent-orange);color:#fff;transform:rotate(-8deg)}.project-tags{display:flex;flex-wrap:wrap;gap:8px}.project-tags span{display:inline-flex;padding:6px 11px;border-radius:30px;background:rgba(255,138,0,.1);border:1px solid rgba(255,138,0,.18);color:var(--accent-orange);font-size:11px;font-weight:800}.portfolio-card-pro .port-name{font-size:24px;line-height:1.45;margin:14px 0 8px}.portfolio-card-pro .port-result{color:#aaa;line-height:1.75}
.project-hero{padding:155px 0 85px;background:radial-gradient(circle at 18% 15%,rgba(255,138,0,.18),transparent 32%),#070707}.project-hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:center}.project-hero h1{font-size:clamp(42px,6vw,78px);line-height:1.15;margin:20px 0}.project-hero article>p{font-size:19px;line-height:1.9;color:#bbb}.project-hero-media{height:min(68vh,620px);border-radius:28px;overflow:hidden;background:#111;box-shadow:0 34px 90px rgba(0,0,0,.5)}.project-hero-media img{width:100%;height:100%;object-fit:cover}.project-story{background:#0a0a0a}.project-reading-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:58px;align-items:start}.reading-width{max-width:780px}.story-panel{padding:34px;border:1px solid var(--border);border-radius:24px;background:rgba(255,255,255,.025);margin-top:24px;max-width:780px}.story-panel>span{color:var(--accent-orange);font-size:12px;font-weight:900}.story-panel h2{font-size:clamp(26px,3vw,40px);margin:10px 0 14px}.story-panel p{color:#bbb;line-height:2}.story-panel.accent{background:linear-gradient(145deg,rgba(255,138,0,.12),rgba(255,255,255,.02));border-color:rgba(255,138,0,.26)}.project-metrics{display:grid;gap:10px;margin-bottom:18px}.project-metrics>div{display:flex;align-items:center;gap:13px;padding:17px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid var(--border)}.project-metrics i{color:var(--accent-orange)}.project-metrics strong{color:#eee;line-height:1.6}.project-cta{display:flex!important;justify-content:center}.rich-copy,.reading-width{font-size:17px;line-height:2}.rich-copy>*{max-width:780px}.rich-copy>figure,.rich-copy>.alignwide{max-width:980px}.rich-copy>.alignfull{max-width:none;width:100%}
.social-link i{font-size:17px}.wa-float i{font-size:31px}
@media(max-width:980px){.project-hero-grid,.project-reading-grid{grid-template-columns:1fr}.project-hero-media{height:460px}.project-reading-grid aside{max-width:620px}}
@media(max-width:640px){.portfolio-card-pro .port-thumb{height:250px}.project-hero{padding-top:125px}.project-hero-grid{gap:32px}.project-hero-media{height:320px}.story-panel{padding:24px}.service-card-link .service-icon{width:52px;height:52px}}

/* Keep service artwork edge-to-edge inside its portrait frame. */
.detail-mark.has-image{padding:0}
.detail-mark.has-image>.detail-service-image{width:100%!important;height:100%!important;min-height:100%;object-fit:cover;object-position:center;transform:scale(1);transform-origin:center;transition:transform .45s ease}
.detail-mark.has-image:hover .detail-service-image{transform:scale(1.04)}