
:root{
  --bg:#f6f7fb;
  --surface:#ffffff;
  --surface-2:#fbfcfe;
  --text:#152033;
  --muted:#667085;
  --border:#e6eaf0;
  --shadow:0 18px 50px rgba(16,24,40,.08);
  --shadow-lg:0 32px 90px rgba(16,24,40,.12);
  --radius:24px;
  --container:min(1180px, calc(100% - 32px));
  --accent:#a88f68;
  --accent-2:#d8c6aa;
  --accent-soft:rgba(168,143,104,.11);
  --accent-dark:#755f40;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 95% 0%, var(--accent-soft), transparent 25%),
    linear-gradient(180deg,#fff 0%,#f6f7fb 100%);
  line-height:1.65;
}
body.rtl{direction:rtl;font-family:"Noto Kufi Arabic",Tahoma,Arial,sans-serif}
h1,h2,h3,h4{margin:0 0 14px;line-height:1.14;font-family:Poppins,Inter,sans-serif;letter-spacing:-.03em}
body.rtl h1,body.rtl h2,body.rtl h3,body.rtl h4{font-family:"Noto Kufi Arabic",Tahoma,Arial,sans-serif;letter-spacing:0}
p{margin:0 0 14px}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button,input,textarea,select{font:inherit}
.container{width:var(--container);margin-inline:auto}
.section{padding:92px 0}
.section-tight{padding:62px 0}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;
  background:var(--accent-soft);color:var(--accent-dark);font-weight:800;font-size:.86rem;
}
.title-xl{font-size:clamp(2.6rem,5vw,5.2rem)}
.title-lg{font-size:clamp(2rem,4vw,3.35rem)}
.title-md{font-size:clamp(1.35rem,2.3vw,1.9rem)}
.lead{font-size:1.1rem;color:var(--muted);max-width:780px}
.muted{color:var(--muted)}
.grid{display:grid;gap:24px}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cards-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

/* Header */
.site-header{
  position:sticky;top:0;z-index:100;
  backdrop-filter:blur(16px);
  background:rgba(255,255,255,.88);
  border-bottom:1px solid rgba(230,234,240,.88)
}
.nav-wrap{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:13px;min-width:0}
.brand img{width:55px;height:55px;object-fit:cover;border-radius:14px;background:#fff;box-shadow:0 7px 18px rgba(0,0,0,.06)}
.brand-text small{display:block;color:var(--muted);font-size:.76rem}
.brand-text strong{display:block;font-size:1rem}
.nav-links{display:flex;align-items:center;gap:19px}
.nav-links a{font-size:.94rem;font-weight:700;color:#344054;transition:.2s}
.nav-links a:hover,.nav-links a.active{color:var(--accent-dark)}
.header-actions{display:flex;align-items:center;gap:10px}
.lang-btn,.nav-cta{
  display:inline-flex;align-items:center;justify-content:center;padding:11px 15px;border-radius:999px;font-weight:800
}
.lang-btn{border:1px solid var(--border);background:#fff}
.nav-cta{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;box-shadow:0 12px 24px var(--accent-soft)}
.nav-toggle{
  display:none;width:46px;height:46px;border:1px solid var(--border);border-radius:14px;background:#fff;cursor:pointer;font-size:1.2rem
}
.mobile-panel{display:none;padding-bottom:18px}
.mobile-panel.open{display:block}
.mobile-panel a{display:block;padding:11px 3px;border-bottom:1px solid var(--border);font-weight:700;color:#344054}

/* Hero */
.hero{position:relative;overflow:hidden;padding:96px 0 78px}
.hero::after{
  content:"";position:absolute;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle,var(--accent-soft),transparent 70%);
  right:-140px;top:-190px;pointer-events:none
}
body.rtl .hero::after{right:auto;left:-140px}
.hero-grid{display:grid;grid-template-columns:1.16fr .84fr;gap:30px;align-items:center}
.hero-card{
  position:relative;z-index:2;padding:36px;border:1px solid var(--border);border-radius:30px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.9));box-shadow:var(--shadow-lg)
}
.hero-card h1{margin-top:18px}
.hero-side{display:grid;gap:18px}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.stat{padding:22px;border:1px solid var(--border);border-radius:22px;background:#fff;box-shadow:var(--shadow)}
.stat strong{display:block;font-size:1.95rem;font-family:Poppins,sans-serif}
.stat span{color:var(--muted);font-size:.93rem}
.mini-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.mini-card{display:flex;align-items:center;gap:13px;padding:16px;border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:var(--shadow)}
.mini-card img{width:50px;height:50px;object-fit:contain;border-radius:12px;background:#fff}
.mini-card strong{display:block;font-size:.94rem}
.mini-card small{display:block;color:var(--muted);font-size:.78rem}

/* Buttons */
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.button,.ghost-btn,.button-light{
  display:inline-flex;align-items:center;justify-content:center;padding:12px 17px;border-radius:999px;font-weight:800;cursor:pointer
}
.button{border:none;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff}
.ghost-btn{border:1px solid var(--border);background:#fff}
.button-light{background:#fff;color:#111827}

/* Cards */
.card,.brand-card,.service-card,.project-card,.contact-card,.contact-form,.brand-accent-box{
  background:#fff;border:1px solid var(--border);border-radius:26px;box-shadow:var(--shadow)
}
.brand-card{padding:28px;transition:.25s}
.brand-card:hover,.service-card:hover,.project-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.logo-wrap{height:74px;display:flex;align-items:center;margin-bottom:18px}
.logo-wrap img{max-height:70px;max-width:250px;object-fit:contain}
.tag{display:inline-block;margin-bottom:11px;padding:6px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent-dark);font-size:.78rem;font-weight:800}
.brand-card p,.service-card p,.project-card p{color:var(--muted)}
.service-card{padding:25px;transition:.25s}
.service-icon{
  width:48px;height:48px;border-radius:16px;background:var(--accent-soft);display:grid;place-items:center;
  color:var(--accent-dark);font-size:1.35rem;margin-bottom:16px
}

/* Brand/page hero */
.page-hero{
  padding:78px 0 46px;border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.84)),radial-gradient(circle at 0 0,var(--accent-soft),transparent 35%)
}
.breadcrumbs{display:flex;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:.92rem}
.page-logo{margin-top:22px;width:min(310px,75vw);padding:20px;border:1px solid var(--border);border-radius:24px;background:#fff;box-shadow:var(--shadow)}
.page-logo img{max-height:120px;object-fit:contain;margin:auto}
.brand-accent-box{padding:28px}

/* Services */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:22px;margin-bottom:30px}
.section-head .lead{max-width:650px}

/* Projects */
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px}
.project-card{overflow:hidden;transition:.25s}
.project-visual{
  min-height:190px;padding:25px;display:flex;align-items:flex-end;position:relative;overflow:hidden;
  background:
    linear-gradient(135deg,var(--accent-soft),rgba(255,255,255,.5)),
    repeating-linear-gradient(45deg,rgba(255,255,255,.4),rgba(255,255,255,.4) 12px,transparent 12px,transparent 24px)
}
.project-visual::before{
  content:"";position:absolute;width:130px;height:130px;border-radius:40px;right:-30px;top:-35px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));opacity:.2;transform:rotate(24deg)
}
body.rtl .project-visual::before{right:auto;left:-30px}
.project-number{font-family:Poppins,sans-serif;font-size:3rem;font-weight:800;color:var(--accent-dark);opacity:.8}
.project-copy{padding:22px}

/* KPI */
.kpi-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.kpi{padding:24px;background:#fff;border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow)}
.kpi strong{display:block;font-size:1.85rem;font-family:Poppins,sans-serif}
.kpi span{color:var(--muted)}

/* CTA */
.cta{
  position:relative;overflow:hidden;padding:38px;border-radius:32px;color:#fff;
  background:linear-gradient(135deg,var(--accent-dark),var(--accent),var(--accent-2));box-shadow:var(--shadow-lg)
}
.cta p{color:rgba(255,255,255,.86)}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:24px}
.contact-card,.contact-form{padding:30px}
.contact-list{display:grid;gap:15px;margin-top:20px}
.contact-line{padding:16px 18px;border-radius:18px;background:#f8fafc;border:1px solid var(--border)}
.contact-line strong{display:block;margin-bottom:2px}
.contact-form form{display:grid;gap:15px}
.input-row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
input,textarea,select{
  width:100%;padding:14px 15px;border:1px solid #d5dce7;border-radius:15px;background:#fff;color:#172033;outline:none
}
input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
textarea{min-height:145px;resize:vertical}
.form-note{font-size:.86rem;color:var(--muted)}
.honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none}

/* Footer */
.footer{margin-top:42px;padding:56px 0 28px;background:#0e1726;color:#fff}
.footer-grid{display:grid;grid-template-columns:1.1fr .8fr .8fr 1fr;gap:28px}
.footer .brand img{background:#fff}
.footer small,.footer p,.footer a{color:#b8c2d2}
.footer h3{font-size:1.08rem}
.footer-links{display:grid;gap:9px}
.footer-bottom{
  margin-top:34px;padding-top:20px;border-top:1px solid rgba(255,255,255,.10);
  display:flex;justify-content:space-between;gap:15px;align-items:center;color:#98a2b3;font-size:.86rem
}

/* WhatsApp */
.whatsapp-float{
  position:fixed;right:22px;bottom:22px;z-index:120;width:58px;height:58px;border-radius:50%;
  display:grid;place-items:center;background:#25D366;color:#fff;font-size:1.65rem;box-shadow:0 16px 38px rgba(37,211,102,.28);
  transition:.2s
}
body.rtl .whatsapp-float{right:auto;left:22px}
.whatsapp-float:hover{transform:translateY(-3px) scale(1.03)}

/* Flash */
.flash{padding:15px 18px;border-radius:16px;margin-bottom:18px;font-weight:700}
.flash.success{background:#ecfdf3;color:#067647;border:1px solid #abefc6}
.flash.error{background:#fef3f2;color:#b42318;border:1px solid #fecdca}

/* Brand themes */
.brand-brothers{--accent:#aa8f67;--accent-2:#d9c8ae;--accent-soft:rgba(170,143,103,.11);--accent-dark:#725d3f}
.brand-solutions{--accent:#e23f45;--accent-2:#2764c8;--accent-soft:rgba(39,100,200,.10);--accent-dark:#173f78}
.brand-souq{--accent:#f36c31;--accent-2:#b23c89;--accent-soft:rgba(243,108,49,.10);--accent-dark:#9a315f}
.brand-bazar{--accent:#1f2937;--accent-2:#a5adb9;--accent-soft:rgba(31,41,55,.09);--accent-dark:#111827}
.brand-advertising{--accent:#ef7d3b;--accent-2:#d2476b;--accent-soft:rgba(239,125,59,.10);--accent-dark:#a43b54}
.brand-cooling{--accent:#1684c6;--accent-2:#56a635;--accent-soft:rgba(22,132,198,.10);--accent-dark:#0b4f80}

/* Arabic tweaks */
body.rtl .brand,body.rtl .mini-card{flex-direction:row}
body.rtl .section-head{text-align:right}
body.rtl .logo-wrap{justify-content:flex-start}
body.rtl input,body.rtl textarea,body.rtl select{text-align:right}

@media(max-width:1050px){
  .nav-links{display:none}
  .nav-toggle{display:grid;place-items:center}
  .hero-grid,.contact-grid,.footer-grid{grid-template-columns:1fr}
  .service-grid,.project-grid,.cards-3{grid-template-columns:repeat(2,1fr)}
  .cards-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
  .section{padding:70px 0}
  .hero{padding:68px 0 52px}
  .hero-card,.cta,.brand-card,.service-card,.contact-card,.contact-form,.brand-accent-box{padding:22px}
  .stats,.mini-grid,.service-grid,.project-grid,.cards-2,.cards-3,.cards-4,.kpi-strip,.input-row{grid-template-columns:1fr}
  .title-xl{font-size:2.4rem}
  .section-head{display:block}
  .header-actions .nav-cta{display:none}
  .footer-bottom{flex-direction:column;align-items:flex-start}
}


/* ============================================================
   PREMIUM HOME V2 — cinematic hero, slider, motion & photo story
   ============================================================ */
body.home-premium{
  background:#070b12;
}
.home-premium .site-header{
  background:rgba(7,11,18,.76);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.home-premium .site-header .brand-text strong,
.home-premium .site-header .nav-links a,
.home-premium .site-header .lang-btn,
.home-premium .site-header .nav-toggle{
  color:#fff;
}
.home-premium .site-header .brand-text small{color:rgba(255,255,255,.58)}
.home-premium .site-header .lang-btn,
.home-premium .site-header .nav-toggle{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.14);
}
.home-premium .site-header .brand img{box-shadow:none}
.home-premium .mobile-panel a{color:#fff;border-color:rgba(255,255,255,.09)}

.premium-hero{
  position:relative;
  min-height:calc(100vh - 82px);
  overflow:hidden;
  isolation:isolate;
  color:#fff;
  display:flex;
  align-items:center;
}
.hero-media{
  position:absolute;
  inset:0;
  z-index:-4;
  background:#05070b;
}
.hero-slide{
  position:absolute;
  inset:-3%;
  opacity:0;
  transition:opacity 1.15s ease;
  overflow:hidden;
}
.hero-slide.active{opacity:1}
.hero-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform:scale(1.08);
  animation:heroKenBurns 12s ease-out infinite alternate;
}
.hero-slide:nth-child(2) img{animation-delay:-3s}
.hero-slide:nth-child(3) img{animation-delay:-6s}
.hero-slide:nth-child(4) img{animation-delay:-9s}
@keyframes heroKenBurns{
  from{transform:scale(1.08) translate3d(0,0,0)}
  to{transform:scale(1.18) translate3d(-1.8%,1.2%,0)}
}
.hero-shade{
  position:absolute;inset:0;z-index:-3;
  background:
    linear-gradient(90deg,rgba(5,8,14,.94) 0%,rgba(5,8,14,.78) 43%,rgba(5,8,14,.25) 72%,rgba(5,8,14,.52) 100%),
    linear-gradient(180deg,rgba(4,7,12,.15),rgba(4,7,12,.72));
}
.rtl .hero-shade{
  background:
    linear-gradient(270deg,rgba(5,8,14,.94) 0%,rgba(5,8,14,.78) 43%,rgba(5,8,14,.25) 72%,rgba(5,8,14,.52) 100%),
    linear-gradient(180deg,rgba(4,7,12,.15),rgba(4,7,12,.72));
}
.hero-glow{
  position:absolute;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(circle at 18% 35%,rgba(177,147,99,.22),transparent 26%),
    radial-gradient(circle at 75% 42%,rgba(44,113,216,.14),transparent 24%);
  animation:glowBreath 8s ease-in-out infinite alternate;
}
@keyframes glowBreath{
  from{opacity:.65;transform:scale(1)}
  to{opacity:1;transform:scale(1.08)}
}
.hero-grid-premium{
  width:var(--container);
  margin:auto;
  padding:82px 0 92px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr);
  gap:60px;
  align-items:center;
}
.hero-copy-premium{position:relative;z-index:2;max-width:820px}
.hero-kicker{
  display:flex;align-items:center;gap:12px;
  color:rgba(255,255,255,.78);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.78rem;
  font-weight:800;
  margin-bottom:18px;
}
.hero-kicker::before{
  content:"";width:42px;height:1px;background:linear-gradient(90deg,#c3a478,transparent);
}
.rtl .hero-kicker{letter-spacing:0;text-transform:none}
.hero-title-premium{
  font-size:clamp(3.15rem,7vw,7.6rem);
  letter-spacing:-.065em;
  line-height:.92;
  max-width:900px;
  text-wrap:balance;
  margin:0;
}
.rtl .hero-title-premium{letter-spacing:0;line-height:1.15}
.hero-title-premium .gradient-word{
  background:linear-gradient(100deg,#fff 10%,#d8c09c 46%,#8ebcff 82%,#fff);
  background-size:220% auto;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:headlineShine 7s linear infinite;
}
@keyframes headlineShine{to{background-position:220% center}}
.hero-copy-premium .lead{
  max-width:720px;
  color:rgba(255,255,255,.72);
  font-size:clamp(1rem,1.4vw,1.18rem);
  margin-top:26px;
}
.premium-hero .button{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#b6996d,#d6c2a3);
  color:#0b0f16;
  padding:14px 22px;
  box-shadow:0 20px 50px rgba(181,151,106,.20);
}
.premium-hero .button::after{
  content:"";position:absolute;top:-20%;bottom:-20%;width:34px;
  background:rgba(255,255,255,.55);filter:blur(8px);transform:skewX(-22deg);
  left:-60px;animation:buttonSweep 4.8s ease-in-out infinite;
}
@keyframes buttonSweep{
  0%,45%{left:-60px}
  65%,100%{left:120%}
}
.premium-hero .ghost-btn{
  color:#fff;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
}
.hero-proof{
  display:flex;flex-wrap:wrap;gap:16px 25px;margin-top:30px;
  color:rgba(255,255,255,.63);font-size:.86rem;font-weight:700
}
.hero-proof span{display:flex;align-items:center;gap:8px}
.hero-proof i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#d5b98d;box-shadow:0 0 0 5px rgba(213,185,141,.12)}

.hero-command{
  position:relative;
  transform-style:preserve-3d;
  transition:transform .2s ease-out;
}
.command-card{
  position:relative;
  padding:24px;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.13);
  background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
  backdrop-filter:blur(22px);
  box-shadow:0 36px 100px rgba(0,0,0,.36);
  overflow:hidden;
}
.command-card::before{
  content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;
  background:linear-gradient(140deg,rgba(255,255,255,.6),transparent 24%,transparent 70%,rgba(193,160,111,.5));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}
.command-top{display:flex;align-items:center;justify-content:space-between;gap:14px}
.command-logo{
  width:86px;height:86px;border-radius:22px;background:#f5f1e8;padding:9px;object-fit:cover
}
.command-status{
  padding:7px 11px;border-radius:999px;background:rgba(89,225,146,.12);
  color:#8af0ae;font-size:.72rem;font-weight:800;border:1px solid rgba(89,225,146,.18)
}
.command-card h3{font-size:1.7rem;margin-top:25px;margin-bottom:6px}
.command-card>p{color:rgba(255,255,255,.58);font-size:.93rem}
.command-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}
.command-metric{
  padding:14px 12px;border-radius:16px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08)
}
.command-metric strong{display:block;font-size:1.28rem}
.command-metric span{font-size:.7rem;color:rgba(255,255,255,.5)}
.command-brand-stack{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:18px}
.command-brand-stack a{
  min-height:58px;display:grid;place-items:center;padding:8px;background:#fff;border-radius:14px;
  transition:transform .25s ease,box-shadow .25s ease
}
.command-brand-stack a:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 14px 30px rgba(0,0,0,.25)}
.command-brand-stack img{max-height:34px;max-width:100%;object-fit:contain}

.hero-slider-nav{
  position:absolute;left:50%;bottom:26px;transform:translateX(-50%);
  z-index:10;display:flex;align-items:center;gap:10px
}
.hero-dot{
  width:34px;height:4px;border-radius:999px;background:rgba(255,255,255,.22);border:0;padding:0;cursor:pointer;overflow:hidden
}
.hero-dot::after{content:"";display:block;width:0;height:100%;background:#fff;transition:width .2s}
.hero-dot.active::after{width:100%;transition:width 5s linear}
.hero-caption{
  position:absolute;right:26px;bottom:26px;z-index:10;
  color:rgba(255,255,255,.7);font-size:.76rem;text-transform:uppercase;letter-spacing:.14em
}
.rtl .hero-caption{right:auto;left:26px;letter-spacing:0;text-transform:none}

/* ticker */
.brand-ticker{
  overflow:hidden;background:#0b1019;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)
}
.ticker-track{
  width:max-content;display:flex;align-items:center;gap:42px;padding:18px 0;
  animation:tickerMove 28s linear infinite
}
.ticker-item{display:flex;align-items:center;gap:14px;color:rgba(255,255,255,.82);font-weight:800;white-space:nowrap}
.ticker-item img{width:40px;height:40px;object-fit:contain;background:#fff;border-radius:10px;padding:4px}
.ticker-sep{width:6px;height:6px;border-radius:50%;background:#a98e66;opacity:.75}
@keyframes tickerMove{to{transform:translateX(-50%)}}
.rtl .ticker-track{animation-name:tickerMoveRTL}
@keyframes tickerMoveRTL{to{transform:translateX(50%)}}

/* light content after dark hero */
.premium-light{
  background:
    radial-gradient(circle at 10% 0%,rgba(173,144,100,.09),transparent 26%),
    #f6f7fb;
  color:#152033;
}
.premium-intro{
  display:grid;grid-template-columns:.78fr 1.22fr;gap:70px;align-items:start
}
.sticky-title{position:sticky;top:120px}
.big-number{
  font:800 clamp(4.8rem,10vw,9rem)/1 Poppins,sans-serif;
  color:transparent;-webkit-text-stroke:1px rgba(21,32,51,.14);
  margin-bottom:4px
}
.photo-story{display:grid;gap:24px}
.photo-panel{
  position:relative;min-height:400px;border-radius:32px;overflow:hidden;box-shadow:var(--shadow-lg);
  isolation:isolate
}
.photo-panel.large{min-height:500px}
.photo-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .75s ease}
.photo-panel:hover img{transform:scale(1.055)}
.photo-panel::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,transparent 26%,rgba(5,9,15,.84) 100%)
}
.photo-panel-copy{position:absolute;z-index:2;left:28px;right:28px;bottom:26px;color:#fff}
.rtl .photo-panel-copy{text-align:right}
.photo-panel-copy .tag{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(10px)}
.photo-panel-copy h3{font-size:clamp(1.45rem,2vw,2rem);max-width:540px}
.photo-panel-copy p{color:rgba(255,255,255,.70);max-width:580px;margin:0}

/* counters */
.impact-strip{
  background:#0b1019;color:#fff;padding:34px 0;border-top:1px solid rgba(255,255,255,.07);border-bottom:1px solid rgba(255,255,255,.07)
}
.impact-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.impact-item{padding:22px 28px;border-right:1px solid rgba(255,255,255,.08)}
.rtl .impact-item{border-right:0;border-left:1px solid rgba(255,255,255,.08)}
.impact-item:last-child{border-right:0;border-left:0}
.impact-item strong{display:block;font:700 clamp(2.2rem,4vw,4rem)/1 Poppins,sans-serif;color:#d9c09b}
.impact-item span{display:block;margin-top:9px;color:rgba(255,255,255,.56)}

/* premium brand grid */
.brand-stage{position:relative}
.brand-stage::before{
  content:"";position:absolute;left:50%;top:15%;width:70%;height:70%;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(178,147,99,.08),transparent 67%);pointer-events:none
}
.premium-brand-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;position:relative}
.premium-brand-tile{
  position:relative;min-height:270px;padding:24px;border-radius:28px;overflow:hidden;
  color:#fff;display:flex;flex-direction:column;justify-content:space-between;isolation:isolate;
  transform-style:preserve-3d;transition:transform .22s ease,box-shadow .25s ease;
  box-shadow:0 18px 44px rgba(13,20,32,.12)
}
.premium-brand-tile::before{
  content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(145deg,#0f1725,#18243a)
}
.premium-brand-tile::after{
  content:"";position:absolute;z-index:-1;inset:auto -10% -40% 35%;height:90%;
  background:radial-gradient(circle,var(--tile-glow,rgba(255,255,255,.15)),transparent 67%)
}
.premium-brand-tile:nth-child(1){grid-column:span 7;--tile-glow:rgba(45,99,205,.48)}
.premium-brand-tile:nth-child(2){grid-column:span 5;--tile-glow:rgba(221,71,126,.42)}
.premium-brand-tile:nth-child(3){grid-column:span 4;--tile-glow:rgba(138,148,164,.35)}
.premium-brand-tile:nth-child(4){grid-column:span 4;--tile-glow:rgba(238,112,70,.45)}
.premium-brand-tile:nth-child(5){grid-column:span 4;--tile-glow:rgba(56,164,97,.38)}
.premium-brand-tile:hover{box-shadow:0 32px 70px rgba(13,20,32,.20)}
.premium-brand-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.premium-brand-logo{width:112px;height:74px;border-radius:18px;background:#fff;padding:10px;display:grid;place-items:center}
.premium-brand-logo img{max-height:54px;max-width:100%;object-fit:contain}
.premium-brand-arrow{
  width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.16);
  display:grid;place-items:center;background:rgba(255,255,255,.07);transition:.25s
}
.premium-brand-tile:hover .premium-brand-arrow{transform:rotate(-35deg);background:#fff;color:#111827}
.rtl .premium-brand-tile:hover .premium-brand-arrow{transform:rotate(35deg)}
.premium-brand-tile p{color:rgba(255,255,255,.60);max-width:520px;margin:0}
.premium-brand-tile h3{font-size:1.6rem}

/* cinematic CTA */
.cinematic-cta{
  position:relative;min-height:520px;border-radius:34px;overflow:hidden;isolation:isolate;
  display:flex;align-items:center;color:#fff;padding:52px;box-shadow:var(--shadow-lg)
}
.cinematic-cta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}
.cinematic-cta::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(5,9,15,.93),rgba(5,9,15,.56),rgba(5,9,15,.2))}
.rtl .cinematic-cta::before{background:linear-gradient(270deg,rgba(5,9,15,.93),rgba(5,9,15,.56),rgba(5,9,15,.2))}
.cinematic-cta::after{
  content:"";position:absolute;z-index:-1;inset:0;
  background:radial-gradient(circle at 18% 45%,rgba(177,147,99,.28),transparent 33%)
}
.cinematic-copy{max-width:670px}
.cinematic-copy p{color:rgba(255,255,255,.68);font-size:1.05rem}
.cinematic-copy .button{background:#fff;color:#101726}

/* generic animation helpers */
.reveal-up{opacity:0;transform:translateY(32px)}
.reveal-left{opacity:0;transform:translateX(-34px)}
.rtl .reveal-left{transform:translateX(34px)}
.revealed{opacity:1!important;transform:none!important;transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1)}
.hero-copy-premium>*{
  opacity:0;transform:translateY(24px);
  animation:heroEnter .8s cubic-bezier(.2,.7,.2,1) forwards
}
.hero-copy-premium>*:nth-child(1){animation-delay:.08s}
.hero-copy-premium>*:nth-child(2){animation-delay:.18s}
.hero-copy-premium>*:nth-child(3){animation-delay:.32s}
.hero-copy-premium>*:nth-child(4){animation-delay:.45s}
.hero-copy-premium>*:nth-child(5){animation-delay:.58s}
@keyframes heroEnter{to{opacity:1;transform:none}}
.hero-command{opacity:0;transform:translateY(24px) scale(.97);animation:commandEnter .9s .52s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes commandEnter{to{opacity:1;transform:none}}

@media(max-width:1050px){
  .hero-grid-premium{grid-template-columns:1fr;gap:30px;padding-top:68px}
  .hero-command{max-width:620px}
  .premium-intro{grid-template-columns:1fr;gap:35px}
  .sticky-title{position:relative;top:auto}
  .premium-brand-tile:nth-child(n){grid-column:span 6}
  .impact-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
  .premium-hero{min-height:auto}
  .hero-grid-premium{padding:58px 0 92px}
  .hero-title-premium{font-size:clamp(3rem,15vw,4.5rem)}
  .hero-command{display:none}
  .hero-shade{background:linear-gradient(180deg,rgba(5,8,14,.72),rgba(5,8,14,.92))}
  .hero-caption{display:none}
  .premium-brand-tile:nth-child(n){grid-column:span 12}
  .impact-grid{grid-template-columns:1fr 1fr}
  .impact-item{padding:19px 15px}
  .photo-panel,.photo-panel.large{min-height:390px}
  .cinematic-cta{min-height:470px;padding:26px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
}


/* ============================================================
   PREMIUM INNER PAGES V3
   ============================================================ */
.inner-premium{
  background:#f5f7fb;
}
.inner-premium .site-header{
  background:rgba(255,255,255,.9);
  box-shadow:0 8px 28px rgba(16,24,40,.04);
}
.inner-hero{
  position:relative;
  min-height:540px;
  display:flex;
  align-items:end;
  overflow:hidden;
  isolation:isolate;
  color:#fff;
  background:#0c111a;
}
.inner-hero-media{
  position:absolute;inset:0;z-index:-4;
}
.inner-hero-media img{
  width:100%;height:100%;object-fit:cover;
  animation:innerHeroZoom 16s ease-in-out infinite alternate;
}
@keyframes innerHeroZoom{
  from{transform:scale(1.04)}
  to{transform:scale(1.12)}
}
.inner-hero::before{
  content:"";position:absolute;inset:0;z-index:-3;
  background:
    linear-gradient(90deg,rgba(5,8,14,.90) 0%,rgba(5,8,14,.70) 46%,rgba(5,8,14,.23) 78%,rgba(5,8,14,.52) 100%),
    linear-gradient(180deg,rgba(5,8,14,.16),rgba(5,8,14,.78));
}
.rtl .inner-hero::before{
  background:
    linear-gradient(270deg,rgba(5,8,14,.90) 0%,rgba(5,8,14,.70) 46%,rgba(5,8,14,.23) 78%,rgba(5,8,14,.52) 100%),
    linear-gradient(180deg,rgba(5,8,14,.16),rgba(5,8,14,.78));
}
.inner-hero::after{
  content:"";position:absolute;inset:0;z-index:-2;
  background:radial-gradient(circle at 18% 54%,var(--accent-soft),transparent 35%);
}
.inner-hero .container{
  padding-top:105px;
  padding-bottom:58px;
}
.inner-hero-copy{
  max-width:860px;
}
.inner-hero .breadcrumbs{
  color:rgba(255,255,255,.62);
}
.inner-hero .breadcrumbs a{color:rgba(255,255,255,.82)}
.inner-hero .eyebrow{
  margin-top:24px;
  background:rgba(255,255,255,.10);
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px)
}
.inner-title{
  font-size:clamp(2.8rem,5.8vw,6.5rem);
  line-height:.97;
  letter-spacing:-.055em;
  margin-top:18px;
  max-width:940px;
}
.rtl .inner-title{letter-spacing:0;line-height:1.14}
.inner-hero .lead{
  color:rgba(255,255,255,.74);
  font-size:1.08rem;
  max-width:760px;
  margin-top:18px;
}
.inner-hero-badges{
  display:flex;gap:10px;flex-wrap:wrap;margin-top:24px;
}
.inner-badge{
  padding:8px 12px;border-radius:999px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.82);font-size:.8rem;font-weight:800;
  backdrop-filter:blur(8px)
}
.floating-logo-card{
  position:absolute;right:max(4vw,28px);bottom:48px;
  width:230px;min-height:150px;padding:22px;border-radius:28px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(18px);
  box-shadow:0 30px 80px rgba(0,0,0,.32);
  display:grid;place-items:center;
}
.rtl .floating-logo-card{right:auto;left:max(4vw,28px)}
.floating-logo-card img{
  max-height:95px;max-width:180px;object-fit:contain;background:#fff;border-radius:20px;padding:12px;
}

/* intro overlap card */
.inner-overlap{
  position:relative;
  margin-top:-34px;
  z-index:8;
}
.overlap-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
.overlap-card{
  padding:22px 24px;border-radius:22px;
  background:#fff;border:1px solid var(--border);
  box-shadow:0 16px 42px rgba(16,24,40,.09);
}
.overlap-card strong{
  display:block;font-size:1.15rem;margin-bottom:4px
}
.overlap-card span{color:var(--muted);font-size:.9rem}

/* premium section layout */
.inner-section{
  padding:92px 0;
}
.inner-section.alt{
  background:#0d1420;color:#fff;
}
.inner-section.alt .lead,
.inner-section.alt p{color:rgba(255,255,255,.63)}
.split-premium{
  display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;
}
.split-photo{
  position:relative;min-height:520px;border-radius:34px;overflow:hidden;
  box-shadow:0 26px 70px rgba(16,24,40,.16);
}
.split-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.split-photo:hover img{transform:scale(1.055)}
.split-photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 35%,rgba(4,8,14,.48))
}
.split-photo-label{
  position:absolute;left:22px;right:22px;bottom:20px;z-index:2;
  color:#fff;font-size:.85rem;font-weight:800
}
.rtl .split-photo-label{text-align:right}
.section-kicker{
  display:inline-flex;align-items:center;gap:10px;
  font-size:.82rem;font-weight:800;color:var(--accent-dark);
  text-transform:uppercase;letter-spacing:.12em
}
.rtl .section-kicker{text-transform:none;letter-spacing:0}
.section-kicker::before{
  content:"";width:34px;height:2px;background:linear-gradient(90deg,var(--accent),transparent)
}
.alt .section-kicker{color:#d7bd94}
.alt .section-kicker::before{background:linear-gradient(90deg,#d7bd94,transparent)}
.premium-copy h2{
  font-size:clamp(2rem,4vw,3.8rem);
  margin-top:12px
}
.premium-copy .lead{margin-top:14px}
.feature-stack{
  display:grid;gap:12px;margin-top:24px
}
.feature-row{
  display:flex;gap:14px;align-items:flex-start;
  padding:16px 17px;border-radius:18px;background:#fff;
  border:1px solid var(--border);box-shadow:0 10px 28px rgba(16,24,40,.05)
}
.alt .feature-row{
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.09);
  box-shadow:none
}
.feature-row-icon{
  width:42px;height:42px;display:grid;place-items:center;border-radius:13px;
  background:var(--accent-soft);color:var(--accent-dark);font-weight:900;flex:0 0 auto
}
.alt .feature-row-icon{background:rgba(255,255,255,.10);color:#fff}
.feature-row strong{display:block;margin-bottom:2px}
.feature-row span{color:var(--muted);font-size:.92rem}
.alt .feature-row span{color:rgba(255,255,255,.58)}

/* premium services */
.services-premium-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px
}
.service-premium{
  position:relative;overflow:hidden;min-height:260px;padding:25px;border-radius:26px;
  background:#fff;border:1px solid var(--border);box-shadow:0 14px 34px rgba(16,24,40,.07);
  transition:transform .3s ease,box-shadow .3s ease
}
.service-premium::after{
  content:"";position:absolute;width:170px;height:170px;border-radius:50%;
  right:-70px;bottom:-80px;background:radial-gradient(circle,var(--accent-soft),transparent 70%);
}
.rtl .service-premium::after{right:auto;left:-70px}
.service-premium:hover{
  transform:translateY(-8px);
  box-shadow:0 28px 58px rgba(16,24,40,.12)
}
.service-premium .service-index{
  font:700 2.7rem/1 Poppins,sans-serif;color:transparent;
  -webkit-text-stroke:1px color-mix(in srgb,var(--accent) 42%, transparent);
  margin-bottom:34px
}
.service-premium h3{font-size:1.28rem}
.service-premium p{color:var(--muted);margin:0}

/* projects premium */
.project-showcase-grid{
  display:grid;grid-template-columns:1.2fr .8fr;gap:20px;margin-top:30px
}
.project-showcase-grid .project-showcase:first-child{grid-row:span 2;min-height:560px}
.project-showcase{
  position:relative;min-height:270px;border-radius:28px;overflow:hidden;isolation:isolate;
  color:#fff;box-shadow:0 22px 58px rgba(16,24,40,.14)
}
.project-showcase img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3;transition:transform .8s ease}
.project-showcase:hover img{transform:scale(1.06)}
.project-showcase::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background:linear-gradient(180deg,rgba(5,8,14,.03),rgba(5,8,14,.84))
}
.project-showcase::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(circle at 80% 20%,var(--accent-soft),transparent 35%)
}
.project-showcase-copy{
  position:absolute;left:24px;right:24px;bottom:22px
}
.project-showcase-copy .tag{
  background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.12)
}
.project-showcase-copy h3{font-size:1.5rem;margin-top:12px}
.project-showcase-copy p{color:rgba(255,255,255,.68);margin:0}

/* brand universe */
.brand-orbit{
  position:relative;min-height:560px;border-radius:34px;overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%,rgba(172,142,99,.12),transparent 30%),
    linear-gradient(145deg,#0c1320,#141f31);
  box-shadow:0 28px 70px rgba(16,24,40,.18)
}
.orbit-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:190px;height:190px;border-radius:50%;background:#f5f1e8;padding:18px;
  display:grid;place-items:center;box-shadow:0 18px 48px rgba(0,0,0,.28);z-index:3
}
.orbit-center img{max-height:145px;border-radius:22px}
.orbit-ring{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:410px;height:410px;border-radius:50%;
  border:1px dashed rgba(255,255,255,.16);
  animation:orbitSpin 28s linear infinite
}
.orbit-ring::after{
  content:"";position:absolute;inset:48px;border-radius:50%;border:1px solid rgba(255,255,255,.07)
}
@keyframes orbitSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.orbit-node{
  position:absolute;width:105px;height:105px;border-radius:24px;background:#fff;
  display:grid;place-items:center;padding:10px;box-shadow:0 18px 42px rgba(0,0,0,.25);z-index:4;
  animation:floatNode 4.5s ease-in-out infinite alternate
}
.orbit-node img{max-height:68px;max-width:86px;object-fit:contain}
.orbit-node.n1{left:10%;top:14%;animation-delay:-.8s}
.orbit-node.n2{right:10%;top:13%;animation-delay:-1.7s}
.orbit-node.n3{left:8%;bottom:12%;animation-delay:-2.5s}
.orbit-node.n4{right:8%;bottom:12%;animation-delay:-3.1s}
.orbit-node.n5{left:50%;bottom:5%;transform:translateX(-50%);animation-delay:-1.2s}
@keyframes floatNode{to{translate:0 -10px}}

/* contact premium */
.contact-premium-wrap{
  margin-top:-56px;position:relative;z-index:8
}
.contact-premium-card{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:0;
  border-radius:32px;overflow:hidden;background:#fff;
  box-shadow:0 30px 80px rgba(16,24,40,.14)
}
.contact-info-dark{
  padding:38px;background:linear-gradient(145deg,#0d1420,#172236);color:#fff
}
.contact-info-dark p{color:rgba(255,255,255,.62)}
.contact-info-dark .contact-line{
  background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08);color:#fff
}
.contact-info-dark .contact-line a{color:#fff}
.contact-form-premium{padding:38px}
.contact-form-premium .button{width:max-content}

/* CTA band */
.inner-cta-band{
  position:relative;overflow:hidden;border-radius:32px;min-height:380px;color:#fff;
  display:flex;align-items:center;padding:42px;isolation:isolate;
  box-shadow:0 26px 70px rgba(16,24,40,.14)
}
.inner-cta-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}
.inner-cta-band::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background:linear-gradient(90deg,rgba(5,8,14,.92),rgba(5,8,14,.50),rgba(5,8,14,.15))
}
.rtl .inner-cta-band::before{
  background:linear-gradient(270deg,rgba(5,8,14,.92),rgba(5,8,14,.50),rgba(5,8,14,.15))
}
.inner-cta-copy{max-width:650px}
.inner-cta-copy p{color:rgba(255,255,255,.68)}

/* about timeline */
.timeline-premium{display:grid;gap:16px;margin-top:26px}
.timeline-item{
  display:grid;grid-template-columns:70px 1fr;gap:18px;align-items:start;
  padding:18px 0;border-bottom:1px solid var(--border)
}
.timeline-item:last-child{border-bottom:0}
.timeline-no{
  width:58px;height:58px;border-radius:18px;background:var(--accent-soft);
  display:grid;place-items:center;color:var(--accent-dark);font-weight:900
}
.timeline-item p{margin:0;color:var(--muted)}

/* animation helper for inner pages
   Content is VISIBLE by default. JS only hides it when animation is ready,
   so pages never appear empty if JS is blocked or fails. */
.inner-premium .reveal-up,
.inner-premium .reveal-left{
  opacity:1;
  transform:none;
}
.inner-premium.motion-ready .reveal-up{
  opacity:0;
  transform:translateY(28px);
}
.inner-premium.motion-ready .reveal-left{
  opacity:0;
  transform:translateX(-30px);
}
.rtl.inner-premium.motion-ready .reveal-left{
  transform:translateX(30px);
}
.inner-premium.motion-ready .revealed{
  opacity:1!important;
  transform:none!important;
  transition:opacity .72s ease,transform .72s cubic-bezier(.2,.7,.2,1);
}

@media(max-width:1050px){
  .floating-logo-card{display:none}
  .split-premium,.contact-premium-card{grid-template-columns:1fr}
  .services-premium-grid{grid-template-columns:repeat(2,1fr)}
  .project-showcase-grid{grid-template-columns:1fr 1fr}
  .project-showcase-grid .project-showcase:first-child{grid-column:1/-1;grid-row:auto;min-height:440px}
  .overlap-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .inner-hero{min-height:500px}
  .inner-hero .container{padding-top:80px;padding-bottom:48px}
  .inner-title{font-size:clamp(2.5rem,13vw,4rem)}
  .overlap-grid,.services-premium-grid,.project-showcase-grid{grid-template-columns:1fr}
  .project-showcase-grid .project-showcase:first-child{grid-column:auto;min-height:350px}
  .project-showcase{min-height:330px}
  .split-photo{min-height:390px}
  .brand-orbit{min-height:480px}
  .orbit-ring{width:300px;height:300px}
  .orbit-center{width:145px;height:145px}
  .orbit-center img{max-height:110px}
  .orbit-node{width:78px;height:78px;border-radius:18px}
  .orbit-node img{max-height:50px;max-width:60px}
  .contact-info-dark,.contact-form-premium{padding:26px}
  .inner-cta-band{padding:26px;min-height:420px}
}

/* FINAL VISIBILITY SAFETY */
.inner-premium main,
.inner-premium .inner-hero,
.inner-premium .inner-overlap,
.inner-premium .inner-section,
.inner-premium .contact-premium-wrap{
  visibility:visible;
}
@media (prefers-reduced-motion: reduce){
  .inner-premium.motion-ready .reveal-up,
  .inner-premium.motion-ready .reveal-left{
    opacity:1!important;
    transform:none!important;
  }
}


/* ============================================================
   FIX V2 — SERVICE CARDS: visible text + real photo treatment
   ============================================================ */

/* Fix the original problem:
   .inner-section.alt was forcing paragraph/text colors to white,
   while the service cards themselves are white. */
.inner-section.alt .service-premium{
  color:#152033;
}
.inner-section.alt .service-premium h3{
  color:#152033 !important;
}
.inner-section.alt .service-premium p{
  color:#667085 !important;
}
.inner-section.alt .service-premium .service-index{
  color:transparent;
}

/* Photo service card */
.service-premium.has-photo{
  min-height:360px;
  padding:0;
  display:flex;
  flex-direction:column;
  background:#fff;
}
.service-premium.has-photo::after{
  display:none;
}
.service-photo{
  position:relative;
  height:175px;
  overflow:hidden;
  background:#e9edf4;
}
.service-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(4,8,14,.02),rgba(4,8,14,.34)),
    radial-gradient(circle at 75% 20%,var(--accent-soft),transparent 38%);
}
.service-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .75s cubic-bezier(.2,.7,.2,1);
}
.service-premium.has-photo:hover .service-photo img{
  transform:scale(1.08);
}
.service-photo .service-index{
  position:absolute;
  z-index:2;
  top:16px;
  left:17px;
  margin:0;
  font-size:2.2rem;
  -webkit-text-stroke:1px rgba(255,255,255,.78);
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.25));
}
.rtl .service-photo .service-index{
  left:auto;
  right:17px;
}
.service-card-copy{
  position:relative;
  padding:21px 22px 24px;
  flex:1;
  display:flex;
  flex-direction:column;
}
.service-card-copy h3{
  font-size:1.28rem;
  color:#152033 !important;
  margin-bottom:9px;
}
.service-card-copy p{
  color:#667085 !important;
  margin:0;
  line-height:1.65;
}
.service-card-copy::after{
  content:"↗";
  position:absolute;
  right:20px;
  bottom:18px;
  color:var(--accent);
  font-weight:900;
  opacity:.42;
  transition:.25s;
}
.rtl .service-card-copy::after{
  right:auto;
  left:20px;
  content:"↖";
}
.service-premium.has-photo:hover .service-card-copy::after{
  opacity:1;
  transform:translate(2px,-2px);
}

/* Safety: all white cards must always use readable dark text */
.inner-section.alt .overlap-card,
.inner-section.alt .service-premium,
.inner-section.alt .feature-row{
  color:#152033;
}
.inner-section.alt .overlap-card span{
  color:#667085;
}

/* Smaller mobile photo cards */
@media(max-width:720px){
  .service-premium.has-photo{min-height:330px}
  .service-photo{height:165px}
}


/* =========================================================
   FINAL PREVIEW UPGRADE — branding, motion and service visuals
   ========================================================= */
.brand img{
  width:92px!important;
  height:72px!important;
  object-fit:contain!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.nav-wrap{min-height:92px}
.footer .brand img{width:108px!important;height:86px!important;background:transparent!important}
.command-logo{object-fit:contain!important;background:transparent!important;border-radius:0!important;width:110px!important;height:110px!important}
.orbit-center img{object-fit:contain;background:transparent;border-radius:0}

.made-by{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;color:#b8c2d2}
.made-by img{height:25px;width:auto;max-width:142px;object-fit:contain;opacity:.96}

/* premium nav underline */
.nav-links a{position:relative;transition:color .25s ease,transform .25s ease}
.nav-links a::after{content:"";position:absolute;left:50%;right:50%;bottom:-9px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:left .28s ease,right .28s ease}
.nav-links a:hover::after,.nav-links a.active::after{left:0;right:0}
.nav-links a:hover{transform:translateY(-1px)}

/* all buttons: magnetic-looking shine */
.button,.ghost-btn,.button-light,.nav-cta,.lang-btn{position:relative;overflow:hidden;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease,filter .25s ease}
.button::before,.nav-cta::before,.button-light::before{content:"";position:absolute;top:-55%;bottom:-55%;left:-70px;width:34px;transform:rotate(18deg);background:rgba(255,255,255,.42);filter:blur(8px);transition:left .55s ease}
.button:hover::before,.nav-cta:hover::before,.button-light:hover::before{left:125%}
.button:hover,.nav-cta:hover,.button-light:hover,.ghost-btn:hover,.lang-btn:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(16,24,40,.16)}
.button:active,.nav-cta:active,.button-light:active,.ghost-btn:active,.lang-btn:active{transform:translateY(-1px) scale(.985)}

/* service visuals */
.service-photo{background:#08101b}
.service-photo img{filter:saturate(1.08) contrast(1.03);transform:scale(1.001)}
.service-premium.has-photo:hover{transform:translateY(-9px) rotateX(.7deg);box-shadow:0 32px 70px rgba(0,0,0,.20)}
.service-premium.has-photo:hover .service-photo img{transform:scale(1.065)}
.service-premium.has-photo .service-index{text-shadow:0 8px 20px rgba(0,0,0,.35)}
.service-card-copy h3{transition:color .25s ease,transform .25s ease}
.service-premium:hover .service-card-copy h3{color:var(--accent-dark)!important;transform:translateX(3px)}
.rtl .service-premium:hover .service-card-copy h3{transform:translateX(-3px)}

/* project and image motion */
.project-showcase,.photo-panel,.split-photo,.premium-brand-tile,.brand-card,.overlap-card{will-change:transform}
.project-showcase:hover,.photo-panel:hover,.split-photo:hover{transform:translateY(-5px);transition:transform .35s ease,box-shadow .35s ease;box-shadow:0 32px 80px rgba(16,24,40,.20)}
.overlap-card{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.overlap-card:hover{transform:translateY(-6px);box-shadow:0 24px 54px rgba(16,24,40,.13);border-color:color-mix(in srgb,var(--accent) 28%,var(--border))}

/* logo subtle motion */
.site-header .brand img{transition:transform .35s cubic-bezier(.2,.7,.2,1),filter .35s ease}
.site-header .brand:hover img{transform:scale(1.05) rotate(-1deg);filter:drop-shadow(0 10px 18px rgba(168,143,104,.18))}

/* animated page glow */
.inner-premium main,.premium-light{position:relative;isolation:isolate}
.inner-premium main::before{content:"";position:fixed;z-index:-1;width:430px;height:430px;border-radius:50%;left:-180px;top:24%;background:radial-gradient(circle,var(--accent-soft),transparent 70%);filter:blur(18px);pointer-events:none;animation:ambientFloat 13s ease-in-out infinite alternate}
.rtl.inner-premium main::before{left:auto;right:-180px}
@keyframes ambientFloat{to{transform:translate3d(55px,85px,0) scale(1.12)}}

/* scroll progress bar */
body::after{content:"";position:fixed;left:0;top:0;height:3px;width:calc(var(--scroll-progress,0) * 1%);z-index:9999;background:linear-gradient(90deg,var(--accent),var(--accent-2));box-shadow:0 0 16px color-mix(in srgb,var(--accent) 55%,transparent);pointer-events:none}

@media(max-width:720px){
  .brand img{width:78px!important;height:62px!important}
  .nav-wrap{min-height:78px}
  .made-by{white-space:normal;gap:8px}
  .made-by img{height:22px;max-width:125px}
}
