/* Motorium v3 — Awwwards-level agency • Dubai 2026
   Editorial: Fraunces display + Inter UI
   Color: ink #0b0d10 / paper #ffffff / sand #f8f7f6 / accent #111216
*/
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,600&family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --paper:#ffffff;
  --ink:#0b0d10;
  --ink2:#1a1d23;
  --muted:#5f6774;
  --muted2:#848c98;
  --line:#e7e8eb;
  --line-soft:#f0f1f3;
  --sand:#f8f7f6;
  --sand2:#fbfaf9;
  --black:#0a0b0e;
  --green:#0b9d5a;
  --gold:#c5a46a;
  --max:1280px;
  --max-wide:1440px;
  --r-xl:26px;
  --r-lg:20px;
  --r:14px;
  --shadow-xl:0 30px 90px rgba(15,17,22,.10);
  --shadow:0 16px 48px rgba(14,16,20,.08);
  --shadow-s:0 6px 24px rgba(14,16,20,.06);
  --ease: cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter', system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Display", Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:auto}
button{font-family:inherit;cursor:pointer}

/* --- utility type --- */
.display{
  font-family:'Fraunces', Georgia, 'Times New Roman', serif;
  font-weight:600;
  letter-spacing:-.025em;
  font-optical-sizing:auto;
}
h1,h2,h3{letter-spacing:-.028em}

/* LAYOUT */
.shell{background:#fff}
.page{max-width:100%}
.container{max-width:var(--max);margin:0 auto;padding:0 52px}
.container-w{max-width:var(--max-wide);margin:0 auto;padding:0 44px}
.narrow{max-width:900px;margin:0 auto;padding:0 52px}

/* PROGRESS */
#scrollProgress{
  position:fixed;top:0;left:0;height:2.5px;background:linear-gradient(90deg,#111,#555);
  z-index:200;width:0%;transition:width .06s linear;
}

/* PRELOADER */
#preloader{
  position:fixed;inset:0;background:#0b0b0d;z-index:300;
  display:flex;align-items:center;justify-content:center;
  color:#fff;transition:opacity .55s var(--ease), visibility .55s;
}
#preloader.hide{opacity:0;visibility:hidden}
.pre-mark{
  font-family:'Fraunces',serif;font-size:34px;font-weight:700;letter-spacing:-.02em;
  opacity:.98;
}
.pre-bar{width:120px;height:1px;background:rgba(255,255,255,.22);margin:16px auto 0;position:relative;overflow:hidden;border-radius:2px}
.pre-bar::after{content:"";position:absolute;left:0;top:0;height:100%;width:40%;background:#fff;animation:pl 1.1s infinite var(--ease)}
@keyframes pl{0%{left:-40%}100%{left:140%}}

/* NAV */
.topbar{
  position:fixed;top:0;left:0;right:0;z-index:80;
  display:flex;align-items:center;justify-content:space-between;
  padding:24px 52px;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.82));
  backdrop-filter:saturate(170%) blur(14px);
  border-bottom:1px solid rgba(230,231,234,.9);
  transition:padding .22s var(--ease), box-shadow .22s, background .22s;
}
.topbar.scrolled{padding:14px 52px;background:rgba(255,255,255,.96);box-shadow:0 8px 34px rgba(10,12,18,.045)}
.brand{font-weight:800;font-size:19px;letter-spacing:-.018em;display:flex;align-items:center;gap:11px}
.brand-dot{width:9px;height:9px;border-radius:50%;background:#0f1115;box-shadow:0 0 0 4px #f0f0f2;transition:transform .3s}
.brand:hover .brand-dot{transform:scale(1.25)}
.nav-center{display:flex;gap:40px;align-items:center;font-size:14.8px;color:#2a3038;font-weight:520}
.nav-center a{position:relative;padding:6px 0;transition:color .18s}
.nav-center a::after{content:"";position:absolute;left:50%;right:50%;bottom:-4px;height:1.5px;background:#111;transition:.22s var(--ease)}
.nav-center a:hover::after,.nav-center a.active::after{left:0;right:0}
.nav-center a.active{color:#000}
.nav-right{display:flex;align-items:center;gap:12px}
.icon-btn{width:42px;height:42px;border-radius:999px;border:1px solid #dde0e5;display:flex;align-items:center;justify-content:center;background:#fff;color:#2b3139;transition:.2s}
.icon-btn:hover{background:#f5f6f7;transform:translateY(-1px)}
.whatsapp-btn{
  background:#0f1115;color:#fff;border-radius:999px;
  padding:13px 22px;font-size:13.8px;font-weight:720;letter-spacing:-.01em;border:0;
  box-shadow:0 10px 30px rgba(0,0,0,.16);
  transition:transform .16s var(--ease), box-shadow .16s, background .2s;
  position:relative;overflow:hidden;
}
.whatsapp-btn:hover{transform:translateY(-2px);box-shadow:0 16px 44px rgba(0,0,0,.22);background:#1a1c22}
.magnetic{display:inline-block;will-change:transform;transition:transform .18s linear}
.hamburger{display:none}

/* HERO – editorial full viewport */
.hero{
  position:relative;min-height:100vh;display:flex;align-items:center;
  background:#08090b;overflow:hidden;
}
.hero-media{
  position:absolute;inset:0;overflow:hidden;
}
.hero-media img{
  width:100%;height:120%;object-fit:cover;object-position:center 32%;
  transform:translateY(0) scale(1.06);
  filter:brightness(.64) saturate(1.03) contrast(1.04);
  will-change:transform;
}
.hero-vignette{
  position:absolute;inset:0;
  background:
   radial-gradient(1100px 680px at 50% 58%, rgba(0,0,0,.10) 0%, rgba(0,0,0,.52) 62%, rgba(0,0,0,.84) 100%),
   linear-gradient(180deg, rgba(6,7,9,.18) 0%, rgba(6,7,9,.78) 100%);
}
.noise{
  position:absolute;inset:0;opacity:.035;mix-blend-mode:overlay;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="1"/></filter><rect width="100%" height="100%" filter="url(%23n)"/></svg>');
  pointer-events:none;
}
.hero-inner{
  position:relative;z-index:5;width:100%;
  padding:160px 0 110px;
}
.hero-grid{display:grid;grid-template-columns:1.32fr .88fr;gap:60px;align-items:end}
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:11.5px;text-transform:uppercase;letter-spacing:.18em;font-weight:700;color:#d7dae1;
  margin-bottom:22px;
}
.eyebrow::before{content:"";width:36px;height:1px;background:rgba(255,255,255,.42);display:inline-block}
.hero h1{
  font-family:'Fraunces',serif;
  font-size:clamp(52px,7vw,100px);
  line-height:.90;
  letter-spacing:-.032em;
  font-weight:600;
  color:#fff;
}
.hero h1 em{font-style:italic;font-weight:600;color:#f2efe9}
.hero-sub{
  color:#cdd1d8;font-size:18.5px;line-height:1.65;max-width:460px;margin:24px 0 30px;font-weight:450
}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.btn-light{
  background:#fff;color:#0f1115;border-radius:14px;padding:17px 28px;
  font-weight:750;font-size:15.2px;border:0;
  box-shadow:0 16px 44px rgba(0,0,0,.38);
  transition:transform .18s var(--ease), box-shadow .18s;
}
.btn-light:hover{transform:translateY(-2px);box-shadow:0 24px 60px rgba(0,0,0,.44)}
.btn-ghost-dark{
  border:1.5px solid rgba(255,255,255,.34);color:#e9ebf0;background:rgba(255,255,255,.03);
  padding:16px 24px;border-radius:14px;font-weight:650;font-size:14.8px;
  backdrop-filter:blur(6px);transition:.2s;
}
.btn-ghost-dark:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.55)}

.hero-right{
  color:#d8dce3;
}
.social-proof{
  display:flex;align-items:center;gap:14px;margin-bottom:18px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(10px);border-radius:16px;padding:12px 16px;
  max-width:330px;
}
.avatars{display:flex}
.avatars span{
  width:34px;height:34px;border-radius:50%;margin-left:-9px;
  border:2px solid rgba(0,0,0,.5);
  display:flex;align-items:center;justify-content:center;
  font-size:10.5px;font-weight:750;
}
.avatars span:first-child{margin-left:0}
.sp-copy{font-size:13px;line-height:1.4}
.sp-copy strong{display:block;font-weight:720;color:#fff}
.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px;max-width:340px}
.hs{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.11);
  border-radius:14px;padding:14px 14px;
}
.hs b{display:block;font-size:22px;font-weight:800;color:#fff;letter-spacing:-.022em}
.hs span{font-size:11.5px;color:#b8bec8}

/* scroll cue */
.scroll-cue{
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  color:rgba(255,255,255,.72);font-size:11px;text-transform:uppercase;letter-spacing:.18em;
  display:flex;flex-direction:column;align-items:center;gap:8px;z-index:6
}
.scroll-cue .line{width:1px;height:34px;background:linear-gradient(#fff, transparent);opacity:.7;animation:sc 1.8s infinite}
@keyframes sc{0%{transform:scaleY(.3);opacity:.2}50%{transform:scaleY(1);opacity:.85}100%{transform:scaleY(.3);opacity:.2}}

/* TRUST marquee */
.trust-marquee{
  border-bottom:1px solid #ececef;background:#fcfcfd;overflow:hidden;
  padding:18px 0;
}
.marquee-track{
  display:flex;gap:52px;align-items:center;white-space:nowrap;
  animation:marq 38s linear infinite;
  font-weight:650;color:#30363f;font-size:14.2px;letter-spacing:-.01em;
}
.marquee-track span{display:flex;align-items:center;gap:10px}
.marquee-track .dot{width:5px;height:5px;background:#18a96a;border-radius:50%}
@keyframes marq{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* SECTIONS */
.section{padding:124px 0}
.section-tight{padding:88px 0}
.section-sand{background:var(--sand);border-top:1px solid #eeece9;border-bottom:1px solid #eeece9}
.kicker{font-size:11.5px;text-transform:uppercase;letter-spacing:.2em;color:#8b9099;font-weight:750;margin-bottom:16px}
.h2{font-family:'Fraunces',serif;font-size:clamp(38px,4.8vw,68px);line-height:.96;letter-spacing:-.028em;font-weight:600}
.h3{font-size:clamp(28px,3vw,44px);letter-spacing:-.024em;line-height:1.04;font-weight:760}
.lead{color:#4d5562;font-size:18px;line-height:1.72;max-width:560px;margin-top:18px}
.lead-sm{color:#5b636f;font-size:16px;line-height:1.68;max-width:500px;margin-top:12px}

/* why grid */
.split{display:grid;grid-template-columns:1.05fr 1.3fr;gap:72px;align-items:start}
.features-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px 56px}
.feat{max-width:340px}
.feat-icon{width:48px;height:48px;border-radius:14px;background:#fff;border:1px solid #e9eaed;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(0,0,0,.045);margin-bottom:16px;font-size:15px;color:#23272f;font-weight:700}
.feat h4{font-size:17px;font-weight:750;letter-spacing:-.012em;margin-bottom:7px}
.feat p{color:#606873;font-size:14.8px;line-height:1.66}

/* editorial trio */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px}
.trio .card{border-radius:24px;overflow:hidden;position:relative;background:#e9e9ea;box-shadow:var(--shadow-s);aspect-ratio:4/3.15}
.trio .card.tall{aspect-ratio:3/4.3;transform:translateY(18px)}
.trio .card img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.trio .card:hover img{transform:scale(1.045)}
.card-cap{
  position:absolute;left:16px;bottom:16px;
  background:rgba(10,10,12,.58);backdrop-filter:blur(10px);
  color:#fff;padding:10px 14px;border-radius:12px;font-size:12.8px;font-weight:640
}
.card-cap small{display:block;font-size:11px;opacity:.82;margin-top:2px;font-weight:500}

/* SERVICES */
.svc-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.svc-mini{
  background:#fff;border:1px solid #e6e7eb;border-radius:22px;padding:30px 26px;
  transition:transform .25s var(--ease), box-shadow .25s;
  position:relative;overflow:hidden;
}
.svc-mini::after{
  content:"";position:absolute;top:0;right:0;width:72px;height:72px;
  background:radial-gradient(circle at top right, rgba(0,0,0,.035), transparent 70%);
  pointer-events:none;
}
.svc-mini:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.svc-mini .ico{width:46px;height:46px;border-radius:14px;background:#f4f5f7;display:flex;align-items:center;justify-content:center;margin-bottom:18px;font-size:17px}
.svc-mini h4{font-size:18.5px;font-weight:760;letter-spacing:-.013em;margin-bottom:8px}
.svc-mini p{font-size:14.6px;color:#5f6773;line-height:1.63}

/* FEATURED CASE – sticky editorial */
.feature-case{
  background:#0d0e12;color:#e8e9ec;padding:120px 0;position:relative;overflow:hidden
}
.feature-case .noise{opacity:.035}
.fc-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:64px;align-items:center}
.fc-kicker{color:#a9b0bb}
.fc h3{font-family:'Fraunces',serif;font-size:clamp(32px,3.6vw,54px);line-height:.98;color:#fff;font-weight:600;margin-top:10px}
.fc p{color:#b8bcc5;font-size:16.5px;line-height:1.7;margin-top:16px;max-width:480px}
.fc-list{margin-top:22px;display:grid;gap:10px;color:#c5c9d1;font-size:14.3px}
.fc-list li{list-style:none;display:flex;gap:10px}
.fc-list li::before{content:"—";color:#7a818e}
.fc-img{
  border-radius:22px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.5);
  aspect-ratio:4/3;position:relative
}
.fc-img img{width:100%;height:100%;object-fit:cover}
.fc-badge{
  position:absolute;left:18px;bottom:18px;
  background:rgba(8,9,12,.62);backdrop-filter:blur(10px);
  color:#fff;border:1px solid rgba(255,255,255,.16);
  padding:10px 14px;border-radius:12px;font-size:12.5px;font-weight:640
}

/* STATS */
.stats-band{background:#0b0c10;color:#fff;padding:78px 0}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;text-align:center}
.stat-num{font-family:'Fraunces',serif;font-size:56px;font-weight:600;letter-spacing:-.028em}
.stat-label{font-size:13.5px;color:#a6adb8;margin-top:6px}

/* BRANDS */
.brands-row{padding:44px 0;border-top:1px solid #eeeff2;border-bottom:1px solid #eeeff2;text-align:center;background:#fff}
.brands-list{display:flex;flex-wrap:wrap;justify-content:center;gap:22px 42px;font-size:15.5px;color:#39414d;font-weight:620;letter-spacing:-.01em;margin-top:16px}

/* PROCESS */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:52px}
.process-step{border-top:2.5px solid #12141a;padding-top:20px}
.process-step .n{font-size:11.5px;color:#8a909a;font-weight:750;letter-spacing:.08em;margin-bottom:10px}
.process-step h5{font-size:18px;font-weight:760;margin-bottom:8px;letter-spacing:-.012em}
.process-step p{font-size:14.5px;color:#5c646f;line-height:1.62}

/* TESTIMONIALS – carousel */
.testi-wrap{position:relative}
.testi-track{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:42px;transition:transform .5s var(--ease)}
.testi{
  background:#fff;border:1px solid #e5e7eb;border-radius:22px;padding:28px 26px;
  box-shadow:0 10px 34px rgba(16,18,24,.038);min-height:230px;
}
.testi .stars{color:#e3a700;font-size:14px;letter-spacing:2px;margin-bottom:12px}
.testi p{font-size:15.2px;color:#3d444f;line-height:1.7}
.testi .who{margin-top:18px;font-weight:740;color:#1a1f27;font-size:14px}
.testi .car{font-size:12.8px;color:#7a818c;margin-top:3px}
.testi-nav{display:flex;gap:10px;margin-top:22px}
.tn{width:44px;height:44px;border-radius:50%;border:1px solid #d9dbdf;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.18s}
.tn:hover{background:#f5f6f7;transform:translateY(-1px)}

/* PRICING transparency */
.pricing{
  background:var(--sand);
  border-top:1px solid #ebe9e6;border-bottom:1px solid #ebe9e6;
  padding:100px 0;
}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.price-card{
  background:#fff;border:1px solid #e4e5e8;border-radius:22px;padding:28px;
  box-shadow:0 8px 30px rgba(16,18,24,.035)
}
.price-card.featured{border:1.8px solid #1b1d23;box-shadow:var(--shadow);transform:translateY(-4px)}
.price-card h5{font-size:13px;text-transform:uppercase;letter-spacing:.14em;color:#7f8792;font-weight:750;margin-bottom:8px}
.price-card .pnum{font-family:'Fraunces',serif;font-size:38px;font-weight:600;letter-spacing:-.022em}
.price-card ul{margin:16px 0 0 0;padding:0;list-style:none;display:grid;gap:9px;color:#4c545f;font-size:14.2px}
.price-card ul li::before{content:"✓ ";color:#0b9d5a;font-weight:700}

/* FAQ */
.faq{max-width:860px;margin:52px auto 0}
.faq-item{border-bottom:1px solid #e6e7ea}
.faq-q{
  width:100%;text-align:left;background:none;border:0;
  padding:22px 6px;font-size:17.5px;font-weight:680;color:#151922;
  display:flex;justify-content:space-between;align-items:center;cursor:pointer;
  letter-spacing:-.01em;
}
.faq-q span:last-child{font-size:22px;color:#7b828e;transition:transform .22s}
.faq-item.open .faq-q span:last-child{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .34s var(--ease)}
.faq-a-inner{padding:0 6px 22px;color:#545c68;font-size:15.2px;line-height:1.68}
.faq-item.open .faq-a{max-height:240px}

/* journal */
.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px}
.j-card{border-radius:18px;overflow:hidden;border:1px solid #e6e7ea;background:#fff}
.j-card img{aspect-ratio:16/10;object-fit:cover}
.j-card .jb{padding:18px 18px 20px}
.j-card .jb small{font-size:11.5px;text-transform:uppercase;letter-spacing:.11em;color:#8a9099;font-weight:700}
.j-card .jb h5{font-size:17px;margin-top:8px;font-weight:730;letter-spacing:-.011em;line-height:1.35}

/* CTA big */
.cta-big{
  background:linear-gradient(180deg,#14161b 0%, #0b0c10 100%);
  color:#fff;padding:110px 0;text-align:center;position:relative;overflow:hidden
}
.cta-big h3{font-family:'Fraunces',serif;font-size:clamp(34px,4.4vw,60px);letter-spacing:-.026em;font-weight:600;margin-bottom:16px}
.cta-big p{color:#b9bdc6;font-size:17.5px;max-width:600px;margin:0 auto 30px;line-height:1.62}
.cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn-cta-light{background:#fff;color:#111219;border-radius:14px;padding:17px 28px;font-weight:770;font-size:15.5px;border:0;box-shadow:0 14px 42px rgba(0,0,0,.42)}
.btn-cta-ghost{border:1.5px solid rgba(255,255,255,.3);color:#e8eaef;background:transparent;padding:16px 26px;border-radius:14px;font-weight:680;font-size:15px}

/* FOOTER mega */
footer{
  border-top:1px solid #e8e9ec;
  background:#fbfbfc;
  padding:72px 0 32px;
  color:#555d68;
  font-size:14.3px;
}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.1fr;gap:34px;margin-bottom:34px}
.footer-grid h5{font-size:12px;text-transform:uppercase;letter-spacing:.13em;color:#8a919b;margin-bottom:16px;font-weight:760}
.footer-grid a{display:block;margin:10px 0;color:#3a414c;font-weight:520}
.footer-grid a:hover{color:#111}
.brand-foot{font-weight:820;color:#12151a;font-size:21px;letter-spacing:-.016em}
.newsletter input{
  width:100%;padding:12px 14px;border:1px solid #d8dbe0;border-radius:12px;font-size:14px;margin-top:8px;background:#fff
}
.newsletter button{margin-top:10px;width:100%;padding:12px;border-radius:12px;background:#111219;color:#fff;border:0;font-weight:680}
.footer-bottom{border-top:1px solid #e9eaee;padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:13px;color:#747c88}

/* inner pages – keep compatibility */
.page-hero{padding:140px 0 48px;border-bottom:1px solid #f1f1f3;background:linear-gradient(180deg,#fff,#fafafb)}
.page-hero h1{font-family:'Fraunces',serif;font-size:clamp(38px,4.6vw,62px);letter-spacing:-.028em;line-height:.98;font-weight:600}
.page-hero p{color:#58606b;margin-top:16px;max-width:700px;font-size:17.5px;line-height:1.66}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding:48px 0 80px}
.svc{border:1px solid #e6e7eb;border-radius:22px;padding:28px;background:#fff;transition:box-shadow .22s, transform .18s}
.svc:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.svc .ico{width:46px;height:46px;border-radius:14px;background:#f4f5f7;display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:17px}
.svc h3{font-size:18.5px;font-weight:760;letter-spacing:-.012em;margin-bottom:8px}
.svc p{font-size:14.6px;color:#5d646f;line-height:1.62}
.svc .meta{margin-top:12px;font-size:12.6px;color:#838a95}
.pill{display:inline-block;font-size:11.5px;font-weight:650;background:#f3f4f6;padding:6px 12px;border-radius:999px;color:#434a54;margin-top:10px;margin-right:6px}

/* cases */
.cases-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;padding:48px 0 80px}
.case{border-radius:22px;overflow:hidden;border:1px solid #e5e6e9;background:#fff;box-shadow:0 8px 30px rgba(0,0,0,.035)}
.case-img{height:300px;background:#111;position:relative;overflow:hidden}
.case-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.case:hover .case-img img{transform:scale(1.035)}
.case-body{padding:24px}
.case-body h3{font-size:19.5px;letter-spacing:-.014em;margin-bottom:8px;font-weight:750}
.case-body p{color:#5b626e;font-size:14.8px;line-height:1.62}
.tag-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.tag{font-size:11.5px;background:#f4f5f6;color:#434954;padding:6px 11px;border-radius:999px;font-weight:600}

/* BA */
.ba-wrap{padding:52px 0 90px}
.ba-compare{position:relative;border-radius:24px;overflow:hidden;height:560px;background:#0e0e10;max-width:1040px;margin:0 auto}
.ba-compare img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-after{clip-path:inset(0 0 0 50%)}
.ba-slider{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;z-index:5;transform:translateX(-1px)}
.ba-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 32px rgba(0,0,0,.4);font-size:15px;color:#111;z-index:6}
.ba-range{width:100%;max-width:1040px;margin:20px auto 0;display:block}
.ba-labels{display:flex;justify-content:space-between;max-width:1040px;margin:10px auto 36px;font-size:13.2px;color:#646b76;font-weight:600}
.ba-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.ba-mini{border-radius:16px;overflow:hidden;border:1px solid #e9eaed}
.ba-mini img{aspect-ratio:4/3;object-fit:cover}

/* contact */
.contact-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:48px;padding:52px 0 90px}
.form-card{border:1px solid #e5e6e9;border-radius:22px;padding:32px;background:#fff;box-shadow:0 14px 48px rgba(14,16,20,.045)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.input,.textarea,select{width:100%;padding:14px 15px;border:1.5px solid #dfe0e4;border-radius:13px;font-size:14.5px;font-family:inherit;background:#fff;outline:none;transition:border .15s}
.input:focus,.textarea:focus,select:focus{border-color:#111}
.textarea{min-height:138px;resize:vertical}
label{font-size:12.5px;font-weight:700;color:#343a44;display:block;margin-bottom:7px}
.contact-side h3{font-size:23px;margin-bottom:10px;letter-spacing:-.015em;font-weight:760}
.contact-side p{color:#5c636e;font-size:15.2px;line-height:1.64}
.info-list{margin-top:24px;display:grid;gap:16px}
.info-item{font-size:14.5px;color:#353b44}
.info-item strong{display:block;font-size:11.5px;color:#7b828e;font-weight:750;margin-bottom:3px;text-transform:uppercase;letter-spacing:.07em}
.map-embed{margin-top:22px;border-radius:16px;overflow:hidden;border:1px solid #e5e6ea;height:250px;background:#eef0f3;display:flex;align-items:center;justify-content:center;color:#6b727d;font-size:13.5px}

/* buttons */
.btn-dark{background:#111319;color:#fff;border:0;padding:15px 24px;border-radius:14px;font-weight:710;font-size:15px;box-shadow:0 10px 30px rgba(0,0,0,.14);transition:.18s var(--ease)}
.btn-dark:hover{transform:translateY(-1px);background:#191c23}
.btn-outline{background:transparent;border:1.5px solid #d4d6da;padding:14px 22px;border-radius:14px;font-weight:660;font-size:14.5px;color:#1b1e25;transition:.18s}
.btn-outline:hover{background:#f6f7f8}

/* reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease), transform .7s var(--ease)}
.reveal.visible{opacity:1;transform:none}

/* responsive */
@media (max-width:1100px){
  .container,.narrow,.container-w{padding:0 30px}
  .topbar{padding:18px 30px}
  .topbar.scrolled{padding:13px 30px}
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-right{max-width:520px}
  .split{grid-template-columns:1fr;gap:48px}
  .svc-preview,.services-grid,.price-grid,.journal-grid{grid-template-columns:1fr 1fr}
  .testi-track{grid-template-columns:1fr 1fr}
  .process{grid-template-columns:1fr 1fr}
  .fc-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:720px){
  .container,.narrow,.container-w{padding:0 20px}
  .topbar{padding:14px 20px}
  .nav-center{display:none}
  .hamburger{display:flex}
  .hero h1{font-size:48px}
  .hero-sub{font-size:16.5px}
  .section{padding:84px 0}
  .trio{grid-template-columns:1fr}
  .trio .card.tall{transform:none;aspect-ratio:4/3.1}
  .svc-preview,.services-grid,.price-grid,.cases-grid,.testi-track,.journal-grid,.process{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-bottom{flex-direction:column}
}

/* mobile menu */
.mobile-menu{display:none;padding:16px 24px 22px;border-top:1px solid #ececef;background:#fff;position:fixed;top:68px;left:0;right:0;z-index:70;box-shadow:0 18px 44px rgba(0,0,0,.07)}
.mobile-menu a{display:block;padding:13px 4px;font-weight:630;color:#27303a;border-bottom:1px solid #f2f3f5;font-size:15px}
.mobile-menu a:last-child{border-bottom:0}
.mobile-menu.open{display:block}