/* =========================================================
   Tourix — Elevate 2026
   Premium refinement layer (loads LAST, after polish-2026).
   Goal: world-class, restrained, human-crafted — not templated.
   Latin display -> Sora; Arabic keeps Cairo via font fallback.
   ========================================================= */

:root{
  --e-ink:#171310;
  --e-gold:#b0821c;          /* deeper, editorial gold for text/underlines */
  --e-gold-bright:#d3a232;
  --e-line:rgba(23,19,16,.09);
  --e-line-soft:rgba(23,19,16,.06);
  --e-bg:#f7f5ef;            /* cleaner warm off-white, less flat than cream */
  --e-shadow:0 1px 2px rgba(23,19,16,.045), 0 18px 44px -22px rgba(23,19,16,.20);
  --e-shadow-hi:0 2px 4px rgba(23,19,16,.05), 0 30px 60px -26px rgba(176,130,28,.30);
}

/* ---------- Typography: sharpen the Latin display face ---------- */
h1, h2, h3, h4,
.hero-x-title, .section-title, .service-title, .app-name,
.stat-number, .stat-num, .how-step h3, .feature-card h3,
.cta-title, .guarantee-title, .logo-text, .foot-col h4{
  font-family:'Sora','Cairo',system-ui,sans-serif !important;
  letter-spacing:-.021em;
}
.hero-x-title{ font-weight:800 !important; letter-spacing:-.035em !important; line-height:1.06 !important; }
.section-title{ font-weight:700 !important; }
.service-title, .feature-card h3{ font-weight:700 !important; letter-spacing:-.02em !important; }
/* body copy: a touch more breathing room + graded weight */
.section-desc, .service-desc, .hero-x-sub{ letter-spacing:-.005em; }

/* ---------- Ground: refine the flat cream ---------- */
body{ background:var(--e-bg) !important; }

/* ---------- Surfaces: calmer radius, hairline border, layered shadow ---------- */
.feature-card, .service-card, .app-card, .stat-card,
.how-step, .testimonial-card, .partner-card{
  border-radius:16px !important;
  border:1px solid var(--e-line) !important;
  box-shadow:var(--e-shadow) !important;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s cubic-bezier(.2,.7,.3,1), border-color .35s !important;
}
.feature-card:hover, .service-card:hover, .app-card:hover, .how-step:hover{
  transform:translateY(-6px) !important;
  box-shadow:var(--e-shadow-hi) !important;
  border-color:rgba(176,130,28,.35) !important;
}

/* hero floating stat cards — quieter, more premium glass */
.hero-float{
  border-radius:14px !important;
  border:1px solid var(--e-line) !important;
  box-shadow:0 1px 2px rgba(23,19,16,.05), 0 20px 50px -24px rgba(23,19,16,.28) !important;
  background:rgba(255,255,255,.86) !important;
  backdrop-filter:blur(8px) !important;
}

/* section underline accent — thinner, more refined */
.section-title::after{
  height:3px !important; width:44px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,var(--e-gold),var(--e-gold-bright)) !important;
}

/* eyebrow / tags — quieter, uppercase, tracked */
.section-tag, .hero-badge, .services-tag, .why-tag{
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
  font-weight:600 !important;
}

/* ---------- Buttons: refined weight + motion ---------- */
.btn-primary, .btn-hero, .cta-btn, .app-store-btn, .btn-x{
  letter-spacing:.005em !important;
  border-radius:12px !important;
  box-shadow:0 10px 26px -12px rgba(176,130,28,.5) !important;
}
.btn-ghost{ border-radius:12px !important; }
.btn-primary:hover, .btn-hero:hover, .cta-btn:hover{
  box-shadow:0 16px 34px -12px rgba(176,130,28,.6) !important;
  transform:translateY(-3px) !important;
}

/* nav polish */
.nav-links a{ letter-spacing:.005em; font-weight:600; }

/* stat numbers — tabular + tighter */
.stat-number, .stat-num{ font-variant-numeric:tabular-nums; letter-spacing:-.03em !important; }

/* ---------- AOS safety net: never leave content faded ---------- */
/* if a fast scroll or a JS hiccup skips the animation, force visible after paint */
@media (prefers-reduced-motion:reduce){ [data-aos]{opacity:1 !important; transform:none !important;} }

/* ---------- Hero: real app mockups (replaces abstract 3D) ---------- */
.hero-appshot-wrap{
  position:relative; display:flex; align-items:center; justify-content:center;
  width:100%; aspect-ratio:1/1;
}
.hero-appshot-wrap::before{           /* rich gold glow behind the phones */
  content:""; position:absolute; inset:4% 2%; z-index:0; border-radius:50%;
  background:
    radial-gradient(56% 52% at 52% 46%, rgba(216,171,52,.30), rgba(216,171,52,.06) 55%, transparent 72%),
    radial-gradient(48% 42% at 40% 64%, rgba(28,20,8,.12), transparent 70%);
  filter:blur(4px);
}
.hero-appshot{
  position:relative; z-index:1;
  width:100%; max-width:600px; height:auto;
  filter:drop-shadow(0 34px 54px rgba(23,19,16,.24));
  animation:heroFloat 6.5s ease-in-out infinite;
}
@keyframes heroFloat{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-13px)} }
@media (prefers-reduced-motion:reduce){ .hero-appshot{animation:none !important} }

/* ---------- Deepen the palette — richer, less washed-out ---------- */
body{ background:#f2eee4 !important; }               /* deeper warm neutral ground */
.hero-x{
  background:
    radial-gradient(120% 78% at 86% -6%, rgba(216,171,52,.13), transparent 44%),
    radial-gradient(90% 60% at 8% 108%, rgba(23,19,16,.05), transparent 60%),
    linear-gradient(180deg,#fbf8f1 0%, #efe9dc 100%) !important;
}
.stats-section{                                       /* richer dark band under hero */
  background:linear-gradient(135deg,#161310 0%, #2a1a0d 60%, #1c1409 100%) !important;
}
/* deeper, more editorial gold for the headline gradient + accents */
.hero-x-title .grad, .grad{
  background:linear-gradient(118deg,#c1901d,#a3711a 60%,#c99a24) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}
.section-tag, .hero-badge, .services-tag, .why-tag{ color:#986c14 !important; }
.section-title::after{ background:linear-gradient(90deg,#a3711a,#d3a232) !important; }

/* ---------- Small consistency fixes ---------- */
img{ max-width:100%; }
.app-store-btn{ background:#111 !important; }         /* solid black App-Store button, always */
.app-store-btn:hover{ background:#000 !important; }