/* ============================================================================
   Athar Widgets for Elementor — Master Stylesheet
   Brand: أثر لإدارة الفعاليات (Athar Event Management)
   Direction: RTL  ·  Theme: Dark + Gold accents  ·  Font: 29LT Bukra
   ============================================================================ */

/* -- Font face --------------------------------------------------------------- */
@font-face {
  font-family: '29LT Bukra';
  src: url('../fonts/29lt-bukra.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* -- Design tokens (scoped to .athar-widget so we don't leak globally) ------- */
.athar-widget,
.athar-widget * {
  --athar-bg: #0e0d0c;
  --athar-fg: #ece7dc;
  --athar-card: #1a1816;
  --athar-gold: #d4ad57;
  --athar-gold-soft: #e5cf8e;
  --athar-cream: #ece6d4;
  --athar-deep: #080807;
  --athar-muted: #221f1c;
  --athar-muted-fg: #b8a98c;
  --athar-border: rgba(212, 173, 87, 0.22);
  --athar-border-strong: rgba(212, 173, 87, 0.5);
  --athar-radius: 0.5rem;
  --athar-radius-sm: 0.25rem;
  --athar-shadow-gold: 0 20px 60px -20px rgba(212, 173, 87, 0.45);
  --athar-shadow-elegant: 0 25px 50px -12px rgba(0, 0, 0, 0.7);
  --athar-gradient-gold: linear-gradient(135deg, #e5cf8e 0%, #c8932d 100%);
  --athar-gradient-dark: linear-gradient(180deg, #1a1612 0%, #050403 100%);
  --athar-gradient-overlay: linear-gradient(180deg, rgba(8, 8, 7, 0.6) 0%, rgba(8, 8, 7, 0.95) 100%);
}

/* -- Base widget reset (font, RTL, color) ------------------------------------ */
.athar-widget {
  font-family: '29LT Bukra', system-ui, -apple-system, sans-serif !important;
  font-weight: 300;
  direction: rtl;
  text-align: right;
  color: var(--athar-fg);
  line-height: 1.7;
  box-sizing: border-box;
}
.athar-widget *,
.athar-widget *::before,
.athar-widget *::after {
  box-sizing: border-box;
}

.athar-widget p,
.athar-widget span,
.athar-widget li,
.athar-widget a,
.athar-widget label,
.athar-widget input,
.athar-widget textarea,
.athar-widget select,
.athar-widget button,
.athar-widget div {
  font-family: '29LT Bukra', system-ui, sans-serif;
  font-weight: 300;
}

.athar-widget h1,
.athar-widget h2,
.athar-widget h3,
.athar-widget h4,
.athar-widget h5,
.athar-widget h6 {
  font-family: '29LT Bukra', serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
  line-height: 1.25;
  color: var(--athar-cream);
  margin: 0 0 0.5em 0;
}

/* -- Container helper -------------------------------------------------------- */
.athar-container {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  width: 100%;
}
.athar-container--narrow { max-width: 820px; }
.athar-container--medium { max-width: 1024px; }

/* -- Section helpers --------------------------------------------------------- */
.athar-section {
  padding-block: 6rem;
  background: var(--athar-bg);
  position: relative;
}
.athar-section--dark { background: var(--athar-gradient-dark); }
.athar-section--bordered {
  border-block: 1px solid var(--athar-border);
}
@media (max-width: 767px) {
  .athar-section { padding-block: 4rem; }
}

/* -- Eyebrow / dividers ------------------------------------------------------ */
.athar-eyebrow {
  display: block;
  color: var(--athar-gold);
  font-size: 0.75rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  margin-bottom: 1rem;
  font-weight: 400;
}
.athar-divider {
  width: 6rem;
  height: 1px;
  background: var(--athar-gradient-gold);
  margin: 1.5rem 0;
  border: 0;
}
.athar-divider--center {
  margin-inline: auto;
}
.athar-divider--short {
  width: 4rem;
}

/* -- Heading utility classes ------------------------------------------------- */
.athar-heading {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--athar-cream);
  line-height: 1.2;
}
.athar-heading--xl {
  font-size: clamp(2.5rem, 6vw, 4.5rem);
}
.athar-text-gold {
  background: var(--athar-gradient-gold);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.athar-body {
  color: var(--athar-muted-fg);
  font-size: 1rem;
  line-height: 2;
}

/* -- Buttons (with theme-proof inline-style backup pattern in widgets) ------- */
.athar-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 1rem 2rem;
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  text-decoration: none !important;
  border-radius: var(--athar-radius-sm) !important;
  border: 1px solid transparent;
  transition: all 0.5s ease;
  cursor: pointer;
  white-space: nowrap;
  font-weight: 400;
}
.athar-btn--primary {
  background: var(--athar-gradient-gold) !important;
  color: var(--athar-deep) !important;
  border-color: transparent !important;
}
.athar-btn--primary:hover {
  box-shadow: var(--athar-shadow-gold) !important;
  color: var(--athar-deep) !important;
  transform: translateY(-2px);
}
.athar-btn--outline {
  background: transparent !important;
  color: var(--athar-cream) !important;
  border: 1px solid var(--athar-border-strong) !important;
}
.athar-btn--outline:hover {
  background: var(--athar-gradient-gold) !important;
  color: var(--athar-deep) !important;
  border-color: transparent !important;
}

/* -- Hover lift -------------------------------------------------------------- */
.athar-hover-lift {
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.5s;
}
.athar-hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: var(--athar-shadow-gold);
}

/* -- Fade-in animation ------------------------------------------------------- */
.athar-fade-in {
  animation: atharFadeInUp 0.8s ease-out both;
}
@keyframes atharFadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* -- Ken burns --------------------------------------------------------------- */
.athar-ken-burns {
  animation: atharKenBurns 18s ease-in-out infinite alternate;
}
@keyframes atharKenBurns {
  from { transform: scale(1); }
  to   { transform: scale(1.08); }
}

/* ============================================================================
   HEADER WIDGET
   ============================================================================ */
.athar-header {
  position: fixed;
  top: 0;
  inset-inline: 0;
  z-index: 9999;
  transition: all 0.5s ease;
  background: rgba(14, 13, 12, 0.85);
  backdrop-filter: blur(8px);
  padding-block: 1.25rem;
}
.athar-header.is-scrolled {
  background: rgba(14, 13, 12, 0.95);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--athar-border);
  padding-block: 0.75rem;
}
.athar-header__inner {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
.athar-header__logo {
  flex-shrink: 0;
  display: inline-block;
}
.athar-header__logo img {
  height: 56px;
  width: auto;
  display: block;
}
.athar-header__nav {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.athar-header__nav a {
  position: relative;
  color: rgba(236, 231, 220, 0.85);
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  text-decoration: none;
  padding-block: 0.5rem;
  transition: color 0.3s;
}
.athar-header__nav a::after {
  content: '';
  position: absolute;
  bottom: 0;
  inset-inline: 0;
  height: 1px;
  background: var(--athar-gradient-gold);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.5s;
}
.athar-header__nav a:hover {
  color: var(--athar-gold);
}
.athar-header__nav a:hover::after {
  transform: scaleX(1);
}
.athar-header__cta {
  flex-shrink: 0;
}
.athar-header__toggle {
  display: none;
  background: transparent;
  border: 0;
  color: var(--athar-gold);
  font-size: 1.5rem;
  padding: 0.5rem;
  cursor: pointer;
}
.athar-header__mobile {
  display: none;
  background: rgba(14, 13, 12, 0.97);
  backdrop-filter: blur(20px);
  border-top: 1px solid var(--athar-border);
  margin-top: 0.75rem;
}
.athar-header__mobile.is-open {
  display: block;
}
.athar-header__mobile-inner {
  max-width: 1200px;
  margin-inline: auto;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.athar-header__mobile a {
  display: block;
  padding-block: 0.75rem;
  font-size: 1rem;
  color: rgba(236, 231, 220, 0.9);
  text-decoration: none;
  border-bottom: 1px solid rgba(212, 173, 87, 0.1);
  transition: color 0.3s;
}
.athar-header__mobile a:hover {
  color: var(--athar-gold);
}
.athar-header__mobile-cta {
  margin-top: 1rem;
  text-align: center;
}

@media (max-width: 1023px) {
  .athar-header__nav,
  .athar-header__cta {
    display: none;
  }
  .athar-header__toggle {
    display: inline-flex;
  }
}

/* ============================================================================
   HERO WIDGET (home)
   ============================================================================ */
.athar-hero {
  position: relative;
  height: 100vh;
  min-height: 640px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.athar-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.athar-hero__bg video,
.athar-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.athar-hero__overlay-1 {
  position: absolute;
  inset: 0;
  background: rgba(8, 8, 7, 0.25);
}
.athar-hero__overlay-2 {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 66%;
  background: linear-gradient(to top, var(--athar-deep), rgba(8, 8, 7, 0.7), transparent);
}
.athar-hero__overlay-3 {
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 8rem;
  background: linear-gradient(to bottom, rgba(8, 8, 7, 0.6), transparent);
}
.athar-hero__inner {
  position: relative;
  width: 100%;
  padding-bottom: 4rem;
  z-index: 1;
}
.athar-hero__content {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.athar-hero__title-wrap { max-width: 720px; }
.athar-hero__eyebrow {
  color: var(--athar-gold);
  font-size: 0.625rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  margin-bottom: 1rem;
  font-weight: 400;
}
.athar-hero__title {
  color: var(--athar-cream);
  font-size: clamp(2.75rem, 6vw, 5rem);
  line-height: 1.15;
  font-weight: 700 !important;
  margin: 0;
}
.athar-hero__cta-wrap {
  display: inline-block;
}
.athar-hero__scroll {
  position: absolute;
  bottom: 1rem;
  inset-inline: 0;
  text-align: center;
  color: rgba(212, 173, 87, 0.6);
  font-size: 0.625rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .athar-hero__content {
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
  }
  .athar-hero__inner { padding-bottom: 5rem; }
  .athar-hero__eyebrow { font-size: 0.75rem; }
}
@media (max-width: 767px) {
  .athar-hero { min-height: 100svh; }
  .athar-hero__bg { background-attachment: scroll !important; }
}

/* ============================================================================
   PAGE HERO WIDGET (about / services / contact)
   ============================================================================ */
.athar-page-hero {
  position: relative;
  height: 60vh;
  min-height: 420px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.athar-page-hero__bg {
  position: absolute;
  inset: 0;
}
.athar-page-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.athar-page-hero__overlay {
  position: absolute;
  inset: 0;
  background: var(--athar-gradient-overlay);
}
.athar-page-hero__inner {
  position: relative;
  max-width: 1200px;
  margin-inline: auto;
  padding: 0 1.5rem 5rem;
  width: 100%;
}
.athar-page-hero__subtitle {
  color: var(--athar-gold);
  font-size: 0.75rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.athar-page-hero__title {
  font-size: clamp(2.5rem, 6vw, 4.5rem);
  color: var(--athar-cream);
  font-weight: 700 !important;
  max-width: 760px;
  margin: 0;
  line-height: 1.15;
}

/* ============================================================================
   PHILOSOPHY (home)
   ============================================================================ */
.athar-philosophy {
  text-align: center;
  max-width: 880px;
  margin-inline: auto;
}
.athar-philosophy__title {
  font-size: clamp(2.25rem, 5vw, 3.75rem);
  line-height: 1.3;
  color: var(--athar-cream);
}
.athar-philosophy__body {
  margin-top: 2.5rem;
  font-size: 1.125rem;
  line-height: 2.25;
  color: rgba(236, 231, 220, 0.85);
  white-space: pre-line;
}

/* ============================================================================
   ABOUT SNAPSHOT (home)
   ============================================================================ */
.athar-about-snapshot {
  display: grid;
  gap: 3.5rem;
  align-items: center;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.athar-about-snapshot__title {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--athar-cream);
  margin-bottom: 1.5rem;
  line-height: 1.2;
}
.athar-about-snapshot__body {
  color: var(--athar-muted-fg);
  font-size: 1rem;
  line-height: 2;
  margin-bottom: 1rem;
}
.athar-about-snapshot__image {
  overflow: hidden;
  border-radius: var(--athar-radius-sm);
  box-shadow: var(--athar-shadow-elegant);
}
.athar-about-snapshot__image img {
  width: 100%;
  height: 460px;
  object-fit: cover;
  display: block;
}
@media (min-width: 768px) {
  .athar-about-snapshot {
    grid-template-columns: 1fr 1fr;
  }
}

/* ============================================================================
   SERVICES CARDS (home grid)
   ============================================================================ */
.athar-services-cards__head {
  text-align: center;
  margin-bottom: 4rem;
}
.athar-services-cards__title {
  font-size: clamp(2.25rem, 5vw, 3.75rem);
  color: var(--athar-cream);
}
.athar-services-cards__body {
  margin-top: 1.5rem;
  max-width: 640px;
  margin-inline: auto;
  color: var(--athar-muted-fg);
  line-height: 2;
}
.athar-services-cards__grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
@media (min-width: 768px) {
  .athar-services-cards__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .athar-services-cards__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.athar-service-card {
  position: relative;
  border-radius: var(--athar-radius-sm);
  background: var(--athar-card);
  border: 1px solid var(--athar-border);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.athar-service-card__image-wrap {
  background: var(--athar-gradient-dark);
  border-bottom: 1px solid var(--athar-border);
}
.athar-service-card__image-wrap img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}
.athar-service-card__body {
  padding: 1.75rem;
}
.athar-service-card__title {
  font-size: 1.5rem;
  color: var(--athar-gold);
  margin-bottom: 0.75rem;
  font-weight: 700;
}
.athar-service-card__desc {
  font-size: 0.875rem;
  line-height: 1.85;
  color: var(--athar-muted-fg);
}
.athar-services-cards__cta-wrap {
  text-align: center;
  margin-top: 3.5rem;
}

/* ============================================================================
   WHY US (home) / WHY ABOUT
   ============================================================================ */
.athar-why__head {
  text-align: center;
  margin-bottom: 3.5rem;
}
.athar-why__title {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--athar-cream);
}
.athar-why__grid {
  display: grid;
  gap: 1.5rem;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .athar-why__grid.athar-why__grid--3 { grid-template-columns: repeat(3, 1fr); }
  .athar-why__grid.athar-why__grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .athar-why__grid.athar-why__grid--4 { grid-template-columns: repeat(4, 1fr) !important; }
}
.athar-why-card {
  text-align: center;
  padding: 2rem;
  border: 1px solid var(--athar-border);
  border-radius: var(--athar-radius-sm);
  background: var(--athar-card);
  transition: transform 0.5s, box-shadow 0.5s;
}
.athar-why-card--left { text-align: right; }
.athar-why-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--athar-shadow-gold);
}
.athar-why-card__icon {
  width: 3.5rem;
  height: 3.5rem;
  margin: 0 auto 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(212, 173, 87, 0.1);
  color: var(--athar-gold);
  font-size: 1.5rem;
}
.athar-why-card--left .athar-why-card__icon {
  margin-inline-start: 0;
  margin-inline-end: 0;
  width: 3rem;
  height: 3rem;
  font-size: 1.25rem;
}
.athar-why-card__title {
  font-size: 1.5rem;
  color: var(--athar-cream);
  margin-bottom: 0.75rem;
}
.athar-why-card--left .athar-why-card__title {
  font-size: 1.25rem;
}
.athar-why-card__desc {
  font-size: 0.875rem;
  line-height: 1.85;
  color: var(--athar-muted-fg);
}

/* ============================================================================
   VALUES
   ============================================================================ */
.athar-values__head {
  text-align: center;
  margin-bottom: 3.5rem;
}
.athar-values__title {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--athar-cream);
}
.athar-values__grid {
  display: grid;
  gap: 1.5rem;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) { .athar-values__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .athar-values__grid { grid-template-columns: repeat(4, 1fr); } }

/* ============================================================================
   QUOTE
   ============================================================================ */
.athar-quote {
  text-align: center;
  max-width: 760px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.athar-quote__mark {
  display: block;
  color: rgba(212, 173, 87, 0.4);
  font-size: 5rem;
  line-height: 1;
  font-family: serif;
}
.athar-quote__body {
  margin-top: -1rem;
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  line-height: 1.6;
  color: var(--athar-cream);
}
.athar-quote__footer {
  margin-top: 1.5rem;
  font-size: 0.875rem;
  color: var(--athar-muted-fg);
  letter-spacing: 0.3em;
  text-transform: uppercase;
}

/* ============================================================================
   STATS
   ============================================================================ */
.athar-stats {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  display: grid;
  gap: 2.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) { .athar-stats { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .athar-stats { grid-template-columns: repeat(4, 1fr); } }
.athar-stat {
  text-align: center;
}
.athar-stat__icon {
  display: block;
  font-size: 1.5rem;
  color: var(--athar-gold);
  margin-bottom: 0.75rem;
}
.athar-stat__value {
  font-family: '29LT Bukra', serif !important;
  font-weight: 700 !important;
  font-size: clamp(2.25rem, 5vw, 3rem);
  background: var(--athar-gradient-gold);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  line-height: 1;
}
.athar-stat__label {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: var(--athar-muted-fg);
  letter-spacing: 0.05em;
}

/* ============================================================================
   GALLERY
   ============================================================================ */
.athar-gallery__head {
  text-align: center;
  margin-bottom: 3.5rem;
}
.athar-gallery__grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, 1fr);
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
@media (min-width: 768px) {
  .athar-gallery__grid { grid-template-columns: repeat(3, 1fr); }
}
.athar-gallery__item {
  overflow: hidden;
  border-radius: var(--athar-radius-sm);
  border: 1px solid var(--athar-border);
}
.athar-gallery__item img {
  width: 100%;
  height: 14rem;
  object-fit: cover;
  display: block;
  transition: transform 0.7s;
}
.athar-gallery__item:hover img {
  transform: scale(1.1);
}
@media (min-width: 768px) {
  .athar-gallery__item img { height: 16rem; }
  .athar-gallery__item--feature {
    grid-column: span 2;
    grid-row: span 2;
  }
  .athar-gallery__item--feature img {
    height: 100%;
    min-height: 400px;
  }
}

/* ============================================================================
   CONTACT CTA
   ============================================================================ */
.athar-contact-cta {
  position: relative;
  padding-block: 7rem;
  overflow: hidden;
}
.athar-contact-cta__bg {
  position: absolute;
  inset: 0;
}
.athar-contact-cta__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.athar-contact-cta__overlay-1 {
  position: absolute;
  inset: 0;
  background: rgba(8, 8, 7, 0.8);
}
.athar-contact-cta__overlay-2 {
  position: absolute;
  inset: 0;
  background: var(--athar-gradient-overlay);
}
.athar-contact-cta__inner {
  position: relative;
  max-width: 760px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  text-align: center;
}
.athar-contact-cta__title {
  font-size: clamp(2.25rem, 5vw, 3.75rem);
  color: var(--athar-cream);
  line-height: 1.3;
}
.athar-contact-cta__body {
  margin-top: 1.5rem;
  font-size: 1.125rem;
  color: rgba(236, 231, 220, 0.85);
  line-height: 2;
}
.athar-contact-cta__cta-wrap {
  margin-top: 2.5rem;
}

/* ============================================================================
   FOOTER
   ============================================================================ */
.athar-footer {
  position: relative;
  background: var(--athar-gradient-dark);
  border-top: 1px solid var(--athar-border);
}
.athar-footer__divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--athar-gold), transparent);
}
.athar-footer__inner {
  max-width: 1200px;
  margin-inline: auto;
  padding: 4rem 1.5rem;
  display: grid;
  gap: 3rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .athar-footer__inner {
    grid-template-columns: repeat(4, 1fr);
  }
}
.athar-footer__brand img {
  height: 64px;
  width: auto;
}
.athar-footer__about {
  margin-top: 1.5rem;
  font-size: 0.875rem;
  line-height: 1.85;
  color: var(--athar-muted-fg);
}
.athar-footer__heading {
  color: var(--athar-gold) !important;
  font-size: 0.875rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}
.athar-footer__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  font-size: 0.875rem;
}
.athar-footer__list a {
  color: rgba(236, 231, 220, 0.8);
  text-decoration: none;
  transition: color 0.3s;
}
.athar-footer__list a:hover {
  color: var(--athar-gold);
}
.athar-footer__contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-size: 0.875rem;
  color: rgba(236, 231, 220, 0.8);
}
.athar-footer__contact-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}
.athar-footer__contact-list i {
  color: var(--athar-gold);
  margin-top: 0.15rem;
  flex-shrink: 0;
}
.athar-footer__contact-list a {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s;
}
.athar-footer__contact-list a:hover {
  color: var(--athar-gold);
}
.athar-footer__socials {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.athar-footer__social {
  width: 2.5rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--athar-border-strong);
  color: var(--athar-gold);
  text-decoration: none;
  border-radius: var(--athar-radius-sm);
  transition: all 0.5s;
}
.athar-footer__social:hover {
  background: var(--athar-gradient-gold);
  color: var(--athar-deep);
  border-color: transparent;
}
.athar-footer__tagline {
  margin-top: 2rem;
  font-size: 0.75rem;
  color: var(--athar-muted-fg);
  line-height: 1.7;
}
.athar-footer__bottom {
  border-top: 1px solid var(--athar-border);
}
.athar-footer__bottom-inner {
  max-width: 1200px;
  margin-inline: auto;
  padding: 1.25rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.75rem;
  color: var(--athar-muted-fg);
}
@media (min-width: 768px) {
  .athar-footer__bottom-inner { flex-direction: row; }
}
.athar-footer__credit {
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(212, 173, 87, 0.7);
}
.athar-footer__credit a {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s;
}
.athar-footer__credit a:hover {
  color: var(--athar-gold);
}

/* ============================================================================
   ABOUT INTRO
   ============================================================================ */
.athar-about-intro {
  display: grid;
  gap: 3.5rem;
  align-items: center;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.athar-about-intro__title {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--athar-cream);
  margin-bottom: 1.5rem;
  line-height: 1.2;
}
.athar-about-intro__body {
  font-size: 1rem;
  line-height: 2;
  color: var(--athar-muted-fg);
  margin-bottom: 1rem;
}
.athar-about-intro__image {
  overflow: hidden;
  border-radius: var(--athar-radius-sm);
  box-shadow: var(--athar-shadow-elegant);
}
.athar-about-intro__image img {
  width: 100%;
  height: 480px;
  object-fit: cover;
  display: block;
}
@media (min-width: 768px) {
  .athar-about-intro {
    grid-template-columns: 1fr 1fr;
  }
}

/* ============================================================================
   ABOUT PHILOSOPHY (long)
   ============================================================================ */
.athar-about-philosophy {
  text-align: center;
  max-width: 880px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.athar-about-philosophy__title {
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.3;
  color: var(--athar-cream);
}
.athar-about-philosophy__body-1 {
  margin-top: 2.5rem;
  font-size: 1.125rem;
  line-height: 2.25;
  color: rgba(236, 231, 220, 0.9);
}
.athar-about-philosophy__body-2 {
  margin-top: 1.5rem;
  font-size: 1rem;
  line-height: 2.25;
  color: var(--athar-muted-fg);
}

/* ============================================================================
   VISION
   ============================================================================ */
.athar-vision {
  max-width: 1100px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.athar-vision__head {
  text-align: center;
  margin-bottom: 3rem;
}
.athar-vision__title {
  font-size: clamp(2.25rem, 5vw, 3.75rem);
  color: var(--athar-cream);
  line-height: 1.3;
}
.athar-vision__grid {
  display: grid;
  gap: 2.5rem;
  font-size: 1rem;
  line-height: 2.25;
}
@media (min-width: 768px) {
  .athar-vision__grid { grid-template-columns: 1fr 1fr; }
}
.athar-vision__body-1 {
  color: rgba(236, 231, 220, 0.9);
}
.athar-vision__body-2 {
  color: var(--athar-muted-fg);
}
.athar-vision__highlight {
  color: var(--athar-gold);
}

/* ============================================================================
   FOUNDER
   ============================================================================ */
.athar-founder {
  position: relative;
  padding-block: 7rem;
  overflow: hidden;
}
.athar-founder__bg {
  position: absolute;
  inset: 0;
}
.athar-founder__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.2;
}
.athar-founder__bg-overlay {
  position: absolute;
  inset: 0;
  background: var(--athar-gradient-dark);
}
.athar-founder__inner {
  position: relative;
  max-width: 880px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.athar-founder__head {
  text-align: center;
  margin-bottom: 3rem;
}
.athar-founder__name {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--athar-cream);
}
.athar-founder__role {
  margin-top: 0.75rem;
  font-size: 0.875rem;
  color: var(--athar-muted-fg);
  letter-spacing: 0.05em;
}
.athar-founder__quote {
  position: relative;
  margin: 0;
  padding-inline-start: 2rem;
}
.athar-founder__quote-mark {
  position: absolute;
  top: -2rem;
  inset-inline-start: 0;
  color: rgba(212, 173, 87, 0.3);
  font-size: 6rem;
  line-height: 1;
  font-family: serif;
}
.athar-founder__quote-text {
  font-size: 1.125rem;
  line-height: 2.25;
  color: rgba(236, 231, 220, 0.9);
  font-style: italic;
}
.athar-founder__quote-footer {
  margin-top: 1.5rem;
  font-size: 0.875rem;
  color: var(--athar-gold);
  letter-spacing: 0.05em;
}
.athar-founder__bio {
  margin-top: 3.5rem;
  display: grid;
  gap: 1.5rem;
  font-size: 1rem;
  line-height: 2;
  color: var(--athar-muted-fg);
}
@media (min-width: 768px) {
  .athar-founder__bio { grid-template-columns: 1fr 1fr; }
}
.athar-founder__cta-wrap {
  margin-top: 3rem;
  text-align: center;
}

/* ============================================================================
   SERVICES INTRO
   ============================================================================ */
.athar-services-intro {
  max-width: 760px;
  margin-inline: auto;
  padding: 0 1.5rem 0;
  text-align: center;
  margin-bottom: 4rem;
}
.athar-services-intro__body {
  font-size: 1.125rem;
  line-height: 2.25;
  color: var(--athar-muted-fg);
}

/* ============================================================================
   SERVICES GRID (alternating rows)
   ============================================================================ */
.athar-services-grid {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 5rem;
}
.athar-service-row {
  display: grid;
  gap: 2.5rem;
  align-items: center;
}
@media (min-width: 768px) {
  .athar-service-row { grid-template-columns: 1fr 1fr; }
  .athar-service-row--reverse {
    direction: ltr;
  }
  .athar-service-row--reverse > * {
    direction: rtl;
  }
}
.athar-service-row__image {
  background: var(--athar-gradient-dark);
  border: 1px solid var(--athar-border);
  border-radius: var(--athar-radius-sm);
  box-shadow: var(--athar-shadow-elegant);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.athar-service-row__image img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.athar-service-row__subtitle {
  color: var(--athar-gold);
  font-size: 0.75rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}
.athar-service-row__title {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--athar-cream);
  margin-bottom: 1rem;
}
.athar-service-row__desc {
  font-size: 1rem;
  line-height: 2;
  color: var(--athar-muted-fg);
  margin-bottom: 1.5rem;
}
.athar-service-row__points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}
@media (min-width: 640px) {
  .athar-service-row__points { grid-template-columns: 1fr 1fr; }
}
.athar-service-row__points li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.875rem;
  color: rgba(236, 231, 220, 0.9);
}
.athar-service-row__check {
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(212, 173, 87, 0.15);
  color: var(--athar-gold);
  flex-shrink: 0;
  font-size: 0.7rem;
}

/* ============================================================================
   CONTACT INTRO
   ============================================================================ */
.athar-contact-intro {
  max-width: 760px;
  margin-inline: auto;
  padding: 0 1.5rem;
  text-align: center;
  margin-bottom: 4rem;
}
.athar-contact-intro__body {
  font-size: 1.125rem;
  line-height: 2.25;
  color: var(--athar-muted-fg);
}

/* ============================================================================
   CONTACT BLOCK (info + form)
   ============================================================================ */
.athar-contact-block {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
  display: grid;
  gap: 3rem;
  grid-template-columns: 1fr;
}
@media (min-width: 1024px) {
  .athar-contact-block { grid-template-columns: 2fr 3fr; }
}

/* Info column */
.athar-contact-info {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.athar-contact-channel {
  display: block;
  padding: 1.75rem;
  border: 1px solid var(--athar-border);
  background: var(--athar-card);
  border-radius: var(--athar-radius-sm);
  text-decoration: none;
  color: inherit;
  transition: transform 0.5s, box-shadow 0.5s;
}
.athar-contact-channel:hover {
  transform: translateY(-6px);
  box-shadow: var(--athar-shadow-gold);
}
.athar-contact-channel__inner {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}
.athar-contact-channel__icon {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(212, 173, 87, 0.1);
  color: var(--athar-gold);
  flex-shrink: 0;
  transition: all 0.5s;
}
.athar-contact-channel:hover .athar-contact-channel__icon {
  background: var(--athar-gradient-gold);
  color: var(--athar-deep);
}
.athar-contact-channel__label {
  display: block;
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--athar-gold);
  margin-bottom: 0.5rem;
}
.athar-contact-channel__value {
  font-size: 1rem;
  color: var(--athar-cream);
}
.athar-contact-hours {
  padding: 1.75rem;
  border: 1px solid var(--athar-border);
  background: var(--athar-card);
  border-radius: var(--athar-radius-sm);
}
.athar-contact-hours__label {
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--athar-gold);
  margin-bottom: 0.75rem;
}
.athar-contact-hours__line {
  font-size: 0.875rem;
  color: rgba(236, 231, 220, 0.85);
  line-height: 1.85;
}

/* Form column */
.athar-contact-form {
  padding: 2rem;
  border: 1px solid var(--athar-border);
  background: var(--athar-card);
  border-radius: var(--athar-radius-sm);
  box-shadow: var(--athar-shadow-elegant);
}
@media (min-width: 768px) {
  .athar-contact-form { padding: 2.5rem; }
}
.athar-contact-form__title {
  font-size: 1.875rem;
  color: var(--athar-cream);
  margin-bottom: 0.5rem;
}
.athar-contact-form__subtitle {
  font-size: 0.875rem;
  color: var(--athar-muted-fg);
  margin-bottom: 2rem;
}
.athar-contact-form__grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .athar-contact-form__grid { grid-template-columns: 1fr 1fr; }
}
.athar-contact-form__field {
  display: flex;
  flex-direction: column;
}
.athar-contact-form__field--full { grid-column: 1 / -1; }
.athar-contact-form__label {
  font-size: 0.75rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--athar-gold);
  margin-bottom: 0.5rem;
}
.athar-contact-form__input,
.athar-contact-form__select,
.athar-contact-form__textarea {
  width: 100%;
  background: rgba(14, 13, 12, 0.5);
  border: 1px solid rgba(212, 173, 87, 0.25);
  border-radius: var(--athar-radius-sm);
  padding: 0.85rem 1rem;
  font-size: 0.875rem;
  color: var(--athar-cream);
  font-family: '29LT Bukra', system-ui, sans-serif;
  transition: border-color 0.3s;
  outline: none;
  font-weight: 300;
}
.athar-contact-form__input:focus,
.athar-contact-form__select:focus,
.athar-contact-form__textarea:focus {
  border-color: var(--athar-gold);
}
.athar-contact-form__textarea {
  resize: vertical;
  min-height: 140px;
}
.athar-contact-form__select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--athar-gold) 50%),
                    linear-gradient(135deg, var(--athar-gold) 50%, transparent 50%);
  background-position: calc(100% - 18px) 18px, calc(100% - 12px) 18px;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-inline-start: 1rem;
  padding-inline-end: 2.5rem;
}
.athar-contact-form__select option {
  background: var(--athar-card);
  color: var(--athar-cream);
}
.athar-contact-form__submit {
  grid-column: 1 / -1;
  margin-top: 0.5rem;
}
.athar-contact-form__msg {
  grid-column: 1 / -1;
  text-align: center;
  padding: 3rem 1rem;
  display: none;
}
.athar-contact-form__msg.is-active { display: block; }
.athar-contact-form__msg-icon {
  width: 4rem;
  height: 4rem;
  margin: 0 auto 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--athar-gradient-gold);
  color: var(--athar-deep);
  font-size: 1.25rem;
}
.athar-contact-form__msg-title {
  font-size: 1.5rem;
  background: var(--athar-gradient-gold);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-bottom: 0.75rem;
  font-weight: 700;
}
.athar-contact-form__msg-text {
  color: var(--athar-muted-fg);
}
.athar-contact-form__msg--error .athar-contact-form__msg-icon {
  background: #c0392b;
  color: #fff;
}
.athar-contact-form__msg--error .athar-contact-form__msg-title {
  color: #e74c3c;
  background: none;
  -webkit-text-fill-color: #e74c3c;
}

/* ============================================================================
   Mobile overflow protection (lessons learned from prior builds)
   ============================================================================ */
@media (max-width: 767px) {
  .athar-widget {
    overflow-x: hidden;
  }
  .athar-widget img {
    max-width: 100%;
    height: auto;
  }
}

/* ============================================================================
   Hello Elementor / theme button override (theme-proof CTA pattern)
   ============================================================================ */
.athar-widget .athar-btn,
.athar-widget a.athar-btn,
.athar-widget button.athar-btn {
  font-family: '29LT Bukra', sans-serif !important;
  letter-spacing: 0.3em !important;
  text-transform: uppercase !important;
}

/* Padding helpers */
.athar-pt-xl { padding-top: 7rem; }
.athar-pb-xl { padding-bottom: 7rem; }
@media (max-width: 767px) {
  .athar-pt-xl { padding-top: 4rem; }
  .athar-pb-xl { padding-bottom: 4rem; }
}