@font-face {
  font-family: "Manrope";
  src: url("../vendor/fonts/manrope/Manrope-Variable.ttf") format("truetype");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Vazirmatn";
  src: url("../vendor/fonts/vazirmatn/Vazirmatn-Variable.ttf") format("truetype");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans Arabic";
  src: url("../vendor/fonts/noto-sans-arabic/NotoSansArabic-Variable.ttf") format("truetype");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --ink: #17133f;
  --ink-soft: #302b62;
  --muted: #676784;
  --bg: #f7f8ff;
  --surface: #ffffff;
  --surface-2: #eef3ff;
  --line: rgba(52, 45, 126, 0.12);
  --primary: #5b42f3;
  --primary-dark: #4128d8;
  --blue: #2d7cff;
  --cyan: #16c7d9;
  --coral: #ff6b78;
  --amber: #ffbd38;
  --purple: #9a67ff;
  --white: #ffffff;
  --radius-sm: 16px;
  --radius-md: 24px;
  --radius-lg: 34px;
  --shadow-sm: 0 12px 35px rgba(46, 38, 120, 0.08);
  --shadow-md: 0 24px 70px rgba(45, 36, 120, 0.13);
  --ease: cubic-bezier(.2, .8, .2, 1);
  --font: "Manrope", "Segoe UI", Tahoma, Arial, sans-serif;
  --font-alt: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 105px; }
body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background: var(--bg);
  font-family: var(--font);
  font-size: 1rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
[lang="fa"] body { font-family: "Vazirmatn", Tahoma, sans-serif; }
[lang="ar"] body, [lang="ckb"] body { font-family: "Noto Sans Arabic", Tahoma, sans-serif; }
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 3%, rgba(45,124,255,.15), transparent 26%),
    radial-gradient(circle at 88% 10%, rgba(255,107,120,.12), transparent 24%),
    radial-gradient(circle at 52% 68%, rgba(22,199,217,.08), transparent 30%);
}
::selection { background: var(--primary); color: #fff; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
img { max-width: 100%; display: block; }
:where(a, button, input, textarea, .project-type label):focus-visible {
  outline: 3px solid rgba(45,124,255,.42);
  outline-offset: 3px;
}
.container { max-width: 1240px; }
.section-pad { padding: 118px 0; }
.position-relative { position: relative; }
.noise {
  position: fixed;
  inset: 0;
  z-index: 20;
  pointer-events: none;
  opacity: .018;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}
.page-progress { position: fixed; inset: 0 0 auto; z-index: 1200; height: 3px; }
.page-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--blue), var(--purple), var(--coral)); }

/* Navigation */
.navbar { padding: 16px 0; transition: .3s var(--ease); }
.nav-shell {
  min-height: 68px;
  padding: 9px 12px 9px 18px;
  border: 1px solid rgba(255,255,255,.85);
  border-radius: 22px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 34px rgba(50,43,130,.07);
  backdrop-filter: blur(18px) saturate(1.25);
  transition: .3s var(--ease);
}
.navbar.scrolled { padding-top: 8px; }
.navbar.scrolled .nav-shell { box-shadow: 0 15px 45px rgba(50,43,130,.12); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-size: .9rem; font-weight: 850; letter-spacing: -.02em; }
.brand > span:last-child > span { color: var(--primary); }
.brand-mark { width: 34px; height: 34px; position: relative; display: block; border-radius: 11px; background: linear-gradient(145deg, var(--blue), var(--primary) 55%, var(--coral)); box-shadow: 0 8px 20px rgba(91,66,243,.25); }
.brand-mark::after { content: ""; position: absolute; inset: 8px; border: 2px solid rgba(255,255,255,.9); border-radius: 6px; }
.brand-mark i { display: none; }
.navbar-nav { gap: 2px; }
.navbar .nav-link { position: relative; padding: 10px 12px !important; border-radius: 12px; color: #575574; font-size: .86rem; font-weight: 650; transition: .22s; }
.navbar .nav-link:hover, .navbar .nav-link.active { color: var(--primary); background: rgba(91,66,243,.08); }
.nav-cta, .btn-primary-tech, .contact-btn {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  padding: 0 18px;
  border: 0;
  border-radius: 15px;
  color: #fff !important;
  background: linear-gradient(135deg, var(--primary), var(--blue));
  box-shadow: 0 12px 26px rgba(74,70,231,.25);
  font-size: .86rem;
  font-weight: 750;
  transition: transform .28s var(--ease), box-shadow .28s;
}
.nav-cta:hover, .btn-primary-tech:hover, .contact-btn:hover { transform: translateY(-2px); box-shadow: 0 17px 35px rgba(74,70,231,.32); }
.language-btn {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-inline: 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--ink);
  background: rgba(255,255,255,.75);
  font-size: .78rem;
  font-weight: 800;
}
.language-btn::after { display: none; }
.dropdown-menu { min-width: 185px; padding: 8px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.96); box-shadow: var(--shadow-md); backdrop-filter: blur(18px); }
.dropdown-item { padding: 9px 11px; border-radius: 10px; color: var(--muted); font-size: .82rem; }
.dropdown-item span { display: inline-grid; width: 28px; color: var(--primary); font-weight: 800; }
.dropdown-item:hover, .dropdown-item.active { color: var(--ink); background: var(--surface-2); }
.navbar-toggler { width: 43px; height: 43px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; box-shadow: none !important; }
.navbar-toggler span { display: block; width: 100%; height: 2px; margin: 5px 0; border-radius: 5px; background: var(--ink); }

/* Shared typography */
.section-heading { margin-bottom: 54px; }
.section-heading h2, .expertise-copy h2, .about-copy h2, .contact-shell h2 {
  margin: 12px 0 0;
  font-size: clamp(2.35rem, 4.3vw, 4.8rem);
  line-height: 1.04;
  letter-spacing: -.055em;
  font-weight: 780;
}
.section-heading p, .about-copy > p, .expertise-copy > p, .contact-shell p { color: var(--muted); font-size: 1rem; line-height: 1.8; }
.section-heading p { max-width: 520px; margin: 0; }
.section-kicker, .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  padding: 8px 12px;
  border: 1px solid rgba(91,66,243,.12);
  border-radius: 999px;
  color: var(--primary);
  background: rgba(91,66,243,.07);
  font-size: .78rem;
  font-weight: 800;
}
.section-kicker b { min-width: 25px; height: 25px; display: inline-grid; place-items: center; border-radius: 8px; color: #fff; background: linear-gradient(135deg, var(--primary), var(--blue)); font-family: var(--font-alt); font-size: .75rem; }
.section-kicker.light { border-color: rgba(255,255,255,.2); color: #fff; background: rgba(255,255,255,.12); }
.section-kicker.light b { color: var(--primary); background: #fff; }

/* Hero */
.hero { min-height: 100vh; padding-top: 126px; position: relative; overflow: hidden; background: linear-gradient(180deg, #fbfcff 0%, #f0f4ff 100%); }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .36; background-image: linear-gradient(rgba(89,70,225,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(89,70,225,.08) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to bottom, #000, transparent 76%); }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(4px); pointer-events: none; }
.hero-orb-one { width: 430px; height: 430px; top: -130px; left: -150px; background: radial-gradient(circle, rgba(45,124,255,.19), transparent 68%); }
.hero-orb-two { width: 520px; height: 520px; right: -150px; bottom: -190px; background: radial-gradient(circle, rgba(255,107,120,.16), transparent 68%); }
.hero-layout { min-height: calc(100vh - 126px) !important; padding: 60px 0 88px; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { color: #484374; background: rgba(255,255,255,.72); box-shadow: var(--shadow-sm); }
.live-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 6px rgba(22,199,217,.13); }
.hero-title { display: flex; flex-direction: column; align-items: flex-start; margin: 26px 0 24px; font-size: clamp(3.5rem, 6.7vw, 6.7rem); line-height: .94; letter-spacing: -.075em; font-weight: 820; }
.text-gradient { padding-inline-end: .09em; color: transparent; background: linear-gradient(100deg, var(--primary) 0%, var(--blue) 42%, var(--cyan) 75%, var(--coral) 100%); -webkit-background-clip: text; background-clip: text; }
.hero-desc { max-width: 650px; margin: 0; color: var(--muted); font-size: 1.08rem; line-height: 1.8; }
.hero-actions { margin-top: 32px; }
.btn-primary-tech { min-height: 58px; padding: 0 12px 0 22px; border-radius: 18px; font-size: .94rem; }
.btn-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: var(--primary); background: #fff; }
.btn-ghost-tech { min-height: 58px; display: inline-flex; align-items: center; gap: 10px; padding: 0 20px; border: 1px solid var(--line); border-radius: 18px; color: var(--ink); background: rgba(255,255,255,.76); box-shadow: var(--shadow-sm); font-size: .92rem; font-weight: 750; }
.btn-ghost-tech:hover { color: var(--primary); border-color: rgba(91,66,243,.25); }
.hero-proof { max-width: 620px; margin-top: 44px; }
.proof-item { padding: 15px 14px; border: 1px solid rgba(70,61,160,.09); border-radius: 17px; background: rgba(255,255,255,.68); }
.proof-item strong, .proof-item small { display: block; }
.proof-item strong { font-size: 1.45rem; line-height: 1.15; color: var(--ink); }
.proof-item:nth-child(2) strong { color: var(--primary); }
.proof-item:nth-child(3) strong { color: #e65367; }
.proof-item small { margin-top: 5px; color: var(--muted); font-size: .76rem; line-height: 1.35; }
.hero-media { max-width: 620px; margin-inline: auto; position: relative; padding: 18px; }
.hero-media-glow { position: absolute; inset: 8% 2% 0; border-radius: 50%; background: linear-gradient(135deg, rgba(45,124,255,.4), rgba(154,103,255,.25), rgba(255,107,120,.28)); filter: blur(45px); opacity: .65; }
.hero-image-frame { position: relative; overflow: hidden; border: 10px solid rgba(255,255,255,.85); border-radius: 46px; background: #eef4ff; box-shadow: 0 35px 90px rgba(52,43,134,.19); transform: rotate(1.2deg); }
.hero-image-frame::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.9); border-radius: 36px; pointer-events: none; }
.hero-image-frame img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.visual-pill { position: absolute; z-index: 3; display: flex; align-items: center; gap: 11px; min-width: 206px; padding: 12px 15px; border: 1px solid rgba(255,255,255,.9); border-radius: 18px; background: rgba(255,255,255,.9); box-shadow: 0 17px 45px rgba(49,42,130,.17); backdrop-filter: blur(12px); }
.visual-pill-top { top: 8%; right: -1%; }
.visual-pill-bottom { left: -1%; bottom: 7%; }
.visual-pill small, .visual-pill strong { display: block; }
.visual-pill small { color: var(--muted); font-size: .75rem; }
.visual-pill strong { margin-top: 1px; color: var(--ink); font-size: .8rem; }
.label-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, var(--primary), var(--blue)); }
.pulse-ring { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: rgba(22,199,217,.12); }
.pulse-ring i { width: 10px; height: 10px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 6px rgba(22,199,217,.13); }
.hero-mini-orbit { position: absolute; z-index: 2; width: 49px; height: 49px; display: grid; place-items: center; border: 5px solid rgba(255,255,255,.85); border-radius: 17px; color: #fff; box-shadow: 0 12px 28px rgba(49,42,130,.18); animation: float 5s ease-in-out infinite; }
.orbit-health { left: 4%; top: 11%; background: var(--coral); }
.orbit-learning { right: 4%; bottom: 20%; background: var(--purple); animation-delay: -1.6s; }
.orbit-food { left: 15%; bottom: 0; background: var(--amber); animation-delay: -3s; }
@keyframes float { 50% { transform: translateY(-10px) rotate(4deg); } }
.scroll-cue { display: none; }

/* Technology strip */
.tech-strip { position: relative; margin-top: -42px; z-index: 3; }
.tech-strip .container { padding: 20px 26px; overflow: hidden; border: 1px solid rgba(255,255,255,.9); border-radius: 23px; background: rgba(255,255,255,.9); box-shadow: var(--shadow-md); }
.tech-strip p { margin: 0 0 12px; color: var(--muted); text-align: center; font-size: .75rem; font-weight: 750; }
.marquee-wrap { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee-track { width: max-content; display: flex; align-items: center; gap: 23px; animation: marquee 26s linear infinite; }
.marquee-track span { color: #3e3a66; font-family: var(--font-alt); font-size: .82rem; font-weight: 750; }
.marquee-track i { width: 6px; height: 6px; border-radius: 3px; background: linear-gradient(135deg, var(--blue), var(--coral)); }
@keyframes marquee { to { transform: translateX(-50%); } }

/* Services */
.services { background: transparent; }
.services-grid > div { display: flex; }
.service-card { width: 100%; min-height: 322px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; padding: 27px; border: 1px solid rgba(65,53,148,.09); border-radius: 28px; background: #fff; box-shadow: var(--shadow-sm); transition: transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.service-card::before { content: ""; position: absolute; width: 190px; height: 190px; right: -80px; top: -95px; border-radius: 50%; background: var(--card-glow, rgba(91,66,243,.16)); filter: blur(3px); }
.services-grid > div:nth-child(1) { --card-accent: #5b42f3; --card-glow: rgba(91,66,243,.18); }
.services-grid > div:nth-child(2) { --card-accent: #287cff; --card-glow: rgba(45,124,255,.17); }
.services-grid > div:nth-child(3) { --card-accent: #f05c74; --card-glow: rgba(255,107,120,.18); }
.services-grid > div:nth-child(4) { --card-accent: #10aebf; --card-glow: rgba(22,199,217,.18); }
.services-grid > div:nth-child(5) { --card-accent: #8a55ed; --card-glow: rgba(154,103,255,.17); }
.services-grid > div:nth-child(6) { --card-accent: #e99a06; --card-glow: rgba(255,189,56,.2); }
.service-card:hover { transform: translateY(-7px); border-color: color-mix(in srgb, var(--card-accent) 28%, transparent); box-shadow: var(--shadow-md); }
.service-top, .service-bottom { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.service-bottom { align-items: flex-end; }
.service-icon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 18px; color: #fff; background: var(--card-accent); box-shadow: 0 12px 22px color-mix(in srgb, var(--card-accent) 25%, transparent); font-size: 1.35rem; }
.service-number { color: rgba(40,34,94,.4); font-family: var(--font-alt); font-size: .75rem; }
.service-card h3 { margin: 0 0 10px; font-size: 1.22rem; line-height: 1.3; font-weight: 780; letter-spacing: -.025em; }
.service-card p { max-width: 310px; margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.7; }
.service-arrow { flex: 0 0 auto; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: var(--card-accent); background: color-mix(in srgb, var(--card-accent) 10%, white); transition: .3s var(--ease); }
.service-card:hover .service-arrow { color: #fff; background: var(--card-accent); transform: translate(3px,-3px); }

/* Industry solutions */
.industries { position: relative; overflow: hidden; background: #fff; }
.industries::before { content: ""; position: absolute; width: 620px; height: 620px; left: -340px; top: 80px; border-radius: 50%; background: radial-gradient(circle, rgba(45,124,255,.13), transparent 68%); }
.industries-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; }
.industry-card { min-height: 285px; grid-column: span 4; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; padding: 27px; border-radius: 30px; color: var(--industry-ink, #fff); background: var(--industry-bg); box-shadow: var(--shadow-sm); transition: transform .35s var(--ease), box-shadow .35s; }
.industry-card:nth-child(1), .industry-card:nth-child(4) { grid-column: span 6; }
.industry-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.industry-card::after { content: ""; position: absolute; width: 190px; height: 190px; top: -70px; right: -55px; border: 1px solid rgba(255,255,255,.22); border-radius: 55px; transform: rotate(28deg); box-shadow: 0 0 0 24px rgba(255,255,255,.055); }
.industry-card:nth-child(1) { --industry-bg: linear-gradient(135deg, #ff6578, #ff8b72); }
.industry-card:nth-child(2) { --industry-bg: linear-gradient(135deg, #6452f4, #9d68ff); }
.industry-card:nth-child(3) { --industry-bg: linear-gradient(135deg, #f5a20c, #ffd45a); --industry-ink: #36260a; }
.industry-card:nth-child(4) { --industry-bg: linear-gradient(135deg, #1687ed, #2bc7d7); }
.industry-card:nth-child(5) { --industry-bg: linear-gradient(135deg, #2fca9f, #8be584); --industry-ink: #113d36; }
.industry-card:nth-child(6) { --industry-bg: linear-gradient(135deg, #25214e, #514b96); }
.industry-top { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: flex-start; }
.industry-icon { width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.25); border-radius: 19px; background: rgba(255,255,255,.19); backdrop-filter: blur(8px); font-size: 1.4rem; }
.industry-chip { padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.18); font-size: .75rem; font-weight: 800; }
.industry-content { position: relative; z-index: 1; }
.industry-content h3 { margin: 0 0 9px; font-size: 1.42rem; font-weight: 800; letter-spacing: -.03em; }
.industry-content p { max-width: 420px; margin: 0; color: inherit; opacity: .78; font-size: .88rem; line-height: 1.65; }

/* Expertise */
.expertise { padding-top: 30px; background: #fff; }
.expertise-shell { overflow: hidden; border-radius: 38px; color: #fff; background: linear-gradient(135deg, #4931d5 0%, #5b42f3 42%, #2385ff 100%); box-shadow: 0 35px 90px rgba(65,48,194,.22); }
.expertise-copy { min-height: 660px; padding: clamp(42px, 6vw, 82px); display: flex; flex-direction: column; justify-content: center; }
.expertise-copy h2 { font-size: clamp(2.45rem, 4vw, 4.5rem); }
.expertise-copy > p { margin: 25px 0; color: rgba(255,255,255,.72); }
.text-link { width: fit-content; display: inline-flex; align-items: center; gap: 10px; padding: 11px 15px; border-radius: 13px; color: var(--primary); background: #fff; font-size: .84rem; font-weight: 800; }
.bento-grid { min-height: 660px; padding: 18px; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; }
.bento-card { min-height: 0; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; padding: 28px; border: 1px solid rgba(255,255,255,.22); border-radius: 25px; background: rgba(255,255,255,.13); backdrop-filter: blur(10px); }
.bento-large { grid-row: 1 / 3; background: rgba(255,255,255,.18); }
.bento-number { align-self: flex-end; color: rgba(255,255,255,.3); font-size: 4.8rem; line-height: 1; font-weight: 800; letter-spacing: -.08em; }
.bento-card > div > i { font-size: 1.7rem; }
.bento-card h3 { margin: 14px 0 8px; font-size: 1.18rem; font-weight: 780; }
.bento-card p { margin: 0; color: rgba(255,255,255,.67); font-size: .86rem; line-height: 1.7; }
.orbit-icon { width: 90px; height: 90px; position: relative; border: 1px solid rgba(255,255,255,.28); border-radius: 30px; transform: rotate(7deg); }
.orbit-icon::before, .orbit-icon::after { content: ""; position: absolute; inset: 16px; border: 1px solid rgba(255,255,255,.24); border-radius: 20px; }
.orbit-icon::after { inset: 32px; border: 0; border-radius: 9px; background: #fff; box-shadow: 0 0 25px rgba(255,255,255,.4); }
.orbit-icon span { width: 10px; height: 10px; position: absolute; top: 8px; left: 40px; border-radius: 50%; background: var(--amber); transform-origin: 5px 36px; animation: orbit 5s linear infinite; }
@keyframes orbit { to { transform: rotate(360deg); } }
.metric-card { flex-direction: row; align-items: center; gap: 18px; }
.metric-ring { width: 108px; height: 108px; flex: 0 0 108px; display: grid; place-items: center; position: relative; border-radius: 36px; background: conic-gradient(#fff 0 94%, rgba(255,255,255,.15) 94%); transform: rotate(-4deg); }
.metric-ring::before { content: ""; position: absolute; inset: 7px; border-radius: 30px; background: #5842e8; }
.metric-ring strong, .metric-ring span { position: relative; }
.metric-ring strong { font-size: 1.55rem; transform: translateX(5px); }
.metric-ring span { font-size: .7rem; transform: translate(-16px,18px); }

/* Process */
.process { background: linear-gradient(180deg, #f7f8ff, #eef5ff); }
.process .section-heading { max-width: 760px; }
.process-line { display: none; }
.process-grid > div { display: flex; }
.process-card { width: 100%; min-height: 275px; position: relative; padding: 25px; border: 1px solid var(--line); border-radius: 26px; background: rgba(255,255,255,.84); box-shadow: var(--shadow-sm); }
.process-card::after { content: ""; position: absolute; inset: auto 25px 24px; height: 5px; border-radius: 10px; background: linear-gradient(90deg, var(--step-color, var(--primary)), transparent); opacity: .55; }
.process-grid > div:nth-child(1) { --step-color: var(--primary); }
.process-grid > div:nth-child(2) { --step-color: var(--blue); }
.process-grid > div:nth-child(3) { --step-color: var(--coral); }
.process-grid > div:nth-child(4) { --step-color: var(--cyan); }
.process-dot { width: 52px; height: 52px; display: grid; place-items: center; margin-bottom: 42px; border: 0; border-radius: 17px; background: color-mix(in srgb, var(--step-color) 12%, white); }
.process-dot::before { content: ""; width: 13px; height: 13px; border-radius: 4px; background: var(--step-color); transform: rotate(45deg); }
.process-index { position: absolute; top: 26px; inset-inline-end: 25px; color: var(--step-color); font-family: var(--font-alt); font-size: .75rem; font-weight: 800; }
.process-card h3 { margin: 0 0 10px; font-size: 1.18rem; font-weight: 780; }
.process-card p { margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.7; }

/* About */
.about { background: #fff; }
.about-shell { min-height: 620px; overflow: hidden; border: 1px solid var(--line); border-radius: 38px; background: #f8faff; box-shadow: var(--shadow-sm); }
.about-visual { align-self: stretch; padding: 18px; }
.map-card { height: 100%; min-height: 540px; position: relative; overflow: hidden; border-radius: 29px; background: linear-gradient(145deg, #225cff, #6f4bf0 58%, #fb6683); }
.map-grid { position: absolute; inset: 0; opacity: .24; background-image: linear-gradient(rgba(255,255,255,.28) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.28) 1px, transparent 1px); background-size: 43px 43px; transform: perspective(600px) rotateX(55deg) scale(1.55); transform-origin: center bottom; }
.map-card::before { content: attr(data-country); position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.09); font-size: clamp(4rem, 8vw, 7rem); font-weight: 850; letter-spacing: -.07em; }
.location { position: absolute; display: flex; align-items: center; gap: 8px; color: rgba(255,255,255,.88); font-size: .75rem; }
.location span { width: 11px; height: 11px; border: 3px solid rgba(255,255,255,.5); border-radius: 50%; background: #fff; box-shadow: 0 0 0 7px rgba(255,255,255,.14); }
.location-istanbul { top: 30%; left: 25%; }
.location-ankara { top: 47%; left: 57%; }
.location-izmir { top: 63%; left: 20%; }
.timezone-card { position: absolute; left: 22px; right: 22px; bottom: 22px; display: flex; align-items: center; gap: 13px; padding: 15px; border: 1px solid rgba(255,255,255,.26); border-radius: 18px; color: #fff; background: rgba(255,255,255,.16); backdrop-filter: blur(14px); }
.timezone-card > i { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 14px; color: var(--primary); background: #fff; }
.timezone-card small, .timezone-card strong { display: block; }
.timezone-card small { color: rgba(255,255,255,.68); font-size: .75rem; }
.timezone-card strong { margin-top: 2px; font-size: .78rem; }
.about-copy { padding: clamp(45px, 6vw, 86px); }
.about-copy > p { margin: 24px 0 30px; }
.about-tags { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.about-tags span { display: flex; align-items: center; gap: 9px; padding: 11px; border-radius: 14px; background: #fff; color: #4e4b6d; font-size: .82rem; box-shadow: 0 8px 22px rgba(46,38,120,.06); }
.about-tags i { width: 25px; height: 25px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: #fff; background: linear-gradient(135deg, var(--primary), var(--blue)); }

/* Team */
.team { background: linear-gradient(180deg, #fff, #f5f3ff); }
.team-grid { margin-bottom: 24px; }
.team-grid > div { display: flex; }
.team-card { width: 100%; min-height: 430px; overflow: hidden; border: 1px solid var(--line); border-radius: 27px; background: rgba(255,255,255,.88); box-shadow: var(--shadow-sm); transition: transform .35s var(--ease), box-shadow .35s; }
.team-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.team-visual { min-height: 205px; position: relative; display: grid; place-items: center; overflow: hidden; background: var(--team-bg, linear-gradient(135deg, #5b42f3, #2d7cff)); }
.team-grid > div:nth-child(2) { --team-bg: linear-gradient(135deg, #ff6075, #ffad66); }
.team-grid > div:nth-child(3) { --team-bg: linear-gradient(135deg, #0fb5c8, #75db9a); }
.team-grid > div:nth-child(4) { --team-bg: linear-gradient(135deg, #28224f, #7e58dd); }
.team-visual::before { content: ""; position: absolute; width: 180px; height: 180px; border: 1px solid rgba(255,255,255,.2); border-radius: 54px; transform: rotate(26deg); box-shadow: 0 0 0 30px rgba(255,255,255,.055); }
.team-code { position: absolute; top: 17px; left: 18px; color: rgba(255,255,255,.65); font-family: var(--font-alt); font-size: .75rem; }
.team-icon { width: 74px; height: 74px; position: relative; z-index: 2; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.4); border-radius: 24px; color: var(--primary); background: rgba(255,255,255,.92); box-shadow: 0 15px 34px rgba(30,22,105,.2); font-size: 1.65rem; transition: .35s var(--ease); }
.team-card:hover .team-icon { transform: translateY(-5px) rotate(-4deg); }
.team-orbit { position: absolute; z-index: 1; width: 185px; height: 92px; border: 1px solid rgba(255,255,255,.26); border-radius: 50%; transform: rotate(-18deg); }
.team-orbit i { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #fff; box-shadow: 0 0 16px rgba(255,255,255,.7); }
.team-orbit i:first-child { left: 18px; top: 13px; }
.team-orbit i:last-child { right: 12px; bottom: 16px; }
.team-content { padding: 25px; }
.team-content h3 { margin: 0 0 10px; font-size: 1.15rem; font-weight: 780; }
.team-content p { min-height: 82px; margin: 0; color: var(--muted); font-size: .86rem; line-height: 1.7; }
.team-skills { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.team-skills span { padding: 6px 10px; border-radius: 9px; color: var(--primary); background: rgba(91,66,243,.08); font-size: .75rem; font-weight: 750; }
.team-manifesto { display: flex; align-items: center; gap: 17px; padding: 20px 22px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: var(--shadow-sm); }
.manifesto-mark { width: 47px; height: 47px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 15px; color: #fff; background: linear-gradient(135deg, var(--coral), var(--purple)); }
.team-manifesto p { flex: 1; margin: 0; color: #555270; font-size: .85rem; }
.manifesto-status { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: .75rem; white-space: nowrap; }
.manifesto-status i { width: 9px; height: 9px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 6px rgba(22,199,217,.13); }

/* Contact and footer */
.contact { padding-top: 30px; background: #f5f3ff; }
.contact-shell { position: relative; overflow: hidden; padding: clamp(54px, 7vw, 92px); border-radius: 38px; color: #fff; background: linear-gradient(115deg, #573bea 0%, #297cff 47%, #13b9ca 100%); box-shadow: 0 35px 90px rgba(65,48,194,.22); }
.contact-shell::before { content: ""; position: absolute; width: 260px; height: 260px; top: -100px; right: 8%; border: 1px solid rgba(255,255,255,.18); border-radius: 70px; transform: rotate(28deg); box-shadow: 0 0 0 38px rgba(255,255,255,.055); }
.contact-glow { position: absolute; width: 550px; height: 550px; left: -230px; bottom: -350px; border-radius: 50%; background: radial-gradient(circle, rgba(255,128,142,.55), transparent 65%); }
.contact-shell p { max-width: 650px; margin: 22px 0 0; color: rgba(255,255,255,.72); }
.contact-btn { min-height: 64px; margin-left: auto; padding: 0 23px; color: var(--primary) !important; background: #fff; box-shadow: 0 14px 35px rgba(31,29,98,.2); }
.contact-email { display: block; margin-top: 14px; color: rgba(255,255,255,.72); font-size: .84rem; }
footer { padding: 20px 0 30px; background: #f5f3ff; }
.footer-top { padding: 42px 0; border-bottom: 1px solid var(--line); }
.footer-brand { color: var(--ink) !important; }
.footer-top p { margin: 0; color: var(--muted); font-size: .88rem; }
.socials { display: flex; gap: 8px; }
.socials a { width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 14px; background: #fff; transition: .25s; }
.socials a:hover { color: #fff; background: var(--primary); transform: translateY(-3px); }
.footer-bottom { padding-top: 22px; color: #8886a0; font-size: .75rem; }

/* Modal and form */
.modal-backdrop.show { opacity: .55; backdrop-filter: blur(8px); }
.project-modal { overflow: hidden; border: 1px solid rgba(255,255,255,.7); border-radius: 30px; color: var(--ink); background: #f9faff; box-shadow: 0 40px 120px rgba(24,20,75,.32); }
.modal-header { padding: 34px 37px 20px; border: 0; align-items: flex-start; }
.modal-title { margin-top: 12px; font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.05; letter-spacing: -.045em; font-weight: 780; }
.btn-close { padding: 11px; border-radius: 12px; background-color: #fff; box-shadow: var(--shadow-sm) !important; }
.modal-body { padding: 8px 37px 24px; }
.modal-body label { display: block; margin-bottom: 7px; color: #555270; font-size: .82rem; font-weight: 750; }
.form-control { min-height: 53px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: #fff; font-size: .9rem; box-shadow: none !important; }
.form-control:focus { border-color: rgba(91,66,243,.5); box-shadow: 0 0 0 4px rgba(91,66,243,.08) !important; }
textarea.form-control { resize: vertical; }
.project-types { display: flex; flex-wrap: wrap; gap: 8px; }
.project-type { position: relative; }
.project-type input { position: absolute; opacity: 0; }
.project-type label { margin: 0; padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; cursor: pointer; transition: .2s; }
.project-type input:checked + label { border-color: var(--primary); color: #fff; background: var(--primary); }
.modal-footer { padding: 19px 37px 33px; border: 0; justify-content: space-between; gap: 14px; }
.modal-footer small { max-width: 350px; color: #817f98; font-size: .75rem; line-height: 1.55; }
.modal-footer .btn-primary-tech { min-height: 50px; }
.form-success { display: none; align-items: center; gap: 8px; margin-top: 14px; padding: 12px; border-radius: 13px; color: #147d89; background: rgba(22,199,217,.12); font-size: .82rem; }
.form-success.show { display: flex; }

/* Motion and direction */
[dir="rtl"] .hero-title { align-items: flex-start; letter-spacing: -.04em; }
[dir="rtl"] .btn-icon i, [dir="rtl"] .btn-primary-tech > i, [dir="rtl"] .text-link i, [dir="rtl"] .service-arrow i { transform: rotate(180deg); }
[dir="rtl"] .contact-btn { margin-left: 0; margin-right: auto; }
[dir="rtl"] .team-code { left: auto; right: 18px; }
[dir="rtl"] .marquee-track { animation-direction: reverse; }

@media (max-width: 1199.98px) {
  .navbar .nav-link { padding-inline: 9px !important; }
  .hero-title { font-size: clamp(3.6rem, 6.5vw, 5.6rem); }
  .expertise-copy, .bento-grid { min-height: 610px; }
  .industry-card { grid-column: span 6; }
}

@media (max-width: 991.98px) {
  .section-pad { padding: 92px 0; }
  .nav-shell { margin-inline: 12px; padding-inline: 15px; }
  .navbar-collapse { padding: 15px 0 5px; }
  .navbar-nav { align-items: stretch !important; }
  .hero { padding-top: 108px; }
  .hero-layout { min-height: auto !important; padding: 80px 0 100px; }
  .hero-copy { text-align: center; }
  .eyebrow, .hero-title { margin-inline: auto; align-items: center; }
  .hero-desc, .hero-proof { margin-inline: auto; }
  .hero-actions { justify-content: center; }
  .hero-media { margin-top: 20px; max-width: 660px; }
  .tech-strip { margin-top: -34px; }
  .expertise-copy { min-height: auto; }
  .bento-grid { min-height: 560px; }
  .about-copy { order: -1; }
  .contact-btn { margin-left: 0; }
  [dir="rtl"] .hero-title { align-items: center; }
}

@media (max-width: 767.98px) {
  .section-pad { padding: 76px 0; }
  .section-heading { margin-bottom: 38px; }
  .section-heading h2, .expertise-copy h2, .about-copy h2, .contact-shell h2 { font-size: clamp(2.25rem, 10vw, 3.5rem); }
  .hero-layout { padding: 55px 0 88px; }
  .hero-title { margin-top: 22px; font-size: clamp(3rem, 14vw, 4.8rem); }
  .hero-desc { font-size: .98rem; }
  .hero-proof { margin-top: 35px; }
  .proof-item { padding: 12px 8px; }
  .proof-item strong { font-size: 1.15rem; }
  .proof-item small { font-size: .75rem; }
  .hero-media { padding: 12px 7px; }
  .hero-image-frame { border-width: 7px; border-radius: 32px; }
  .visual-pill { min-width: 180px; padding: 10px 12px; transform: scale(.9); }
  .visual-pill-top { right: -7%; }
  .visual-pill-bottom { left: -7%; }
  .hero-mini-orbit { display: none; }
  .tech-strip .container { width: calc(100% - 24px); padding-inline: 18px; }
  .service-card { min-height: 290px; }
  .industries-grid { grid-template-columns: 1fr; }
  .industry-card, .industry-card:nth-child(1), .industry-card:nth-child(4) { min-height: 270px; grid-column: auto; }
  .expertise-shell, .about-shell, .contact-shell { border-radius: 27px; }
  .bento-grid { min-height: auto; grid-template-columns: 1fr; grid-template-rows: auto; }
  .bento-card, .bento-large { min-height: 285px; grid-row: auto; }
  .metric-card { min-height: 220px; }
  .about-tags { grid-template-columns: 1fr; }
  .team-manifesto { align-items: flex-start; flex-wrap: wrap; }
  .team-manifesto p { flex-basis: calc(100% - 65px); }
  .manifesto-status { margin-inline-start: 64px; }
  .contact-shell { padding: 48px 27px; }
  .contact-btn { width: 100%; justify-content: space-between; }
  .modal-header, .modal-body, .modal-footer { padding-left: 22px; padding-right: 22px; }
  .modal-footer { align-items: stretch; flex-direction: column; }
}

@media (max-width: 575.98px) {
  .nav-shell { min-height: 60px; border-radius: 18px; }
  .brand { font-size: .76rem; }
  .brand-mark { width: 30px; height: 30px; }
  .language-btn { padding-inline: 10px; }
  .hero-title { font-size: clamp(2.65rem, 13vw, 4rem); }
  .btn-primary-tech, .btn-ghost-tech { width: 100%; justify-content: space-between; }
  .btn-ghost-tech { justify-content: center; }
  .hero-image-frame img { min-height: 330px; object-fit: cover; }
  .visual-pill { position: relative; inset: auto !important; width: calc(100% - 28px); min-width: 0; margin: -25px auto 0; transform: none; }
  .visual-pill-bottom { margin-top: 8px; }
  .map-card { min-height: 430px; }
  .team-card { min-height: 410px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Zanora theme and responsive layouts. */
:root{--ink:#141b2d;--ink-soft:#34405a;--muted:#677188;--bg:#f8faff;--surface:#fff;--surface-2:#eef2f9;--line:#dfe5ef;--primary:#2457f5;--primary-dark:#1646db;--blue:#2457f5;--lime:#c3f85c;--shadow-sm:0 10px 35px #1a31580a;--shadow-md:0 24px 65px #1a315814;--radius-md:22px;--radius-lg:30px;color-scheme:light}
html[data-theme="dark"]{--ink:#f0f4ff;--ink-soft:#c4cde0;--muted:#a0adc4;--bg:#0b1020;--surface:#121a2d;--surface-2:#182239;--line:#27334a;--primary:#7195ff;--primary-dark:#8aa7ff;--blue:#7195ff;--shadow-sm:0 10px 35px #0002;--shadow-md:0 24px 65px #0003;color-scheme:dark}
body{background:var(--bg);color:var(--ink)}body::before,.noise,.hero-orb{display:none}.navbar{background:color-mix(in srgb,var(--bg) 90%,transparent);border-bottom:1px solid var(--line);backdrop-filter:blur(22px);box-shadow:none;padding:18px 0}.navbar.scrolled{background:color-mix(in srgb,var(--bg) 94%,transparent);box-shadow:var(--shadow-sm)}.brand{gap:10px;color:var(--ink)!important;direction:ltr;font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-1.8px;font-size:29px}.brand>span,.brand>span>span{color:inherit}.brand-symbol{width:39px;height:39px}.brand-word{display:flex;align-items:baseline}.brand-word .brand-period{color:var(--primary);font-size:36px}.nav-link{color:var(--muted)!important;font-size:14px}.nav-link:hover,.nav-link.active{color:var(--primary)!important}.nav-cta{background:var(--ink);color:var(--bg);border-radius:12px;font-size:14px}.nav-cta:hover{background:var(--primary);color:#fff}.language-btn,.theme-toggle{height:44px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:12px}.theme-toggle{width:44px;display:grid;place-items:center;font-size:19px;flex-shrink:0}.theme-toggle:hover{border-color:var(--primary);color:var(--primary)}.theme-toggle .bi-sun{display:none}[data-theme="dark"] .theme-toggle .bi-moon-stars{display:none}[data-theme="dark"] .theme-toggle .bi-sun{display:block}.dropdown-menu{background:var(--surface);color:var(--ink);border-color:var(--line)}.dropdown-item{color:var(--ink)}.dropdown-item:hover{background:var(--surface-2);color:var(--ink)}.dropdown-item.active{background:var(--primary);color:var(--bg)}.navbar-toggler{border-color:var(--line)}.navbar-toggler span{background:var(--ink)}
.hero{padding:145px 0 65px;min-height:auto;overflow:hidden;background:radial-gradient(ellipse at 95% 45%,color-mix(in srgb,var(--primary) 6%,transparent),transparent 50%)}.hero .hero-layout{min-height:0!important;--bs-gutter-x:3rem}.eyebrow{background:transparent;border:0;padding:0;color:var(--muted);font-size:13px;letter-spacing:.01em;margin-bottom:26px;box-shadow:none}.live-dot{background:#73a834;box-shadow:0 0 0 5px #8cbd3f15}.hero-title{font-size:clamp(46px,4.55vw,72px);line-height:1.12;letter-spacing:-3.6px;font-weight:800;margin:0 0 25px}.hero-title>span{display:block}.hero-title .text-gradient{background:none;color:var(--primary);-webkit-text-fill-color:initial;position:relative}.hero-desc{font-size:17px;line-height:1.85;max-width:520px;color:var(--muted);margin-bottom:28px}.hero-actions{gap:12px!important}.btn-primary-tech{background:#2457f5;color:#fff;border:1px solid #2457f5;border-radius:13px;box-shadow:0 6px 14px #2457f51a;font-size:14px;padding:15px 20px;gap:15px}.btn-primary-tech:hover{background:#1646db;color:#fff;box-shadow:0 8px 25px #2457f529}.btn-icon{background:transparent;padding:0;width:auto;height:auto}.btn-ghost-tech{color:var(--ink);border:1px solid var(--line);background:var(--surface);border-radius:13px;font-size:14px;padding:15px 20px;gap:9px}.btn-ghost-tech:hover{color:var(--primary);background:var(--surface-2);border-color:var(--primary)}.hero-footnote{margin-top:27px;display:flex;align-items:center;gap:9px;color:var(--muted);font-size:13px}.hero-footnote i{color:var(--primary);font-size:17px}.hero-visual{position:relative;padding-top:0}.ecosystem{aspect-ratio:1.07;position:relative;direction:ltr;border:1px solid var(--line);border-radius:30px;isolation:isolate;background-color:var(--surface);background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:20px 20px;box-shadow:var(--shadow-md)}.ecosystem-caption{position:absolute;top:24px;left:25px;color:var(--muted);font:500 12px Manrope,sans-serif;letter-spacing:1.5px}.ecosystem-status{position:absolute;top:23px;right:23px;color:var(--primary);font-size:18px}.ecosystem-lines{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--line);stroke-width:1.5;stroke-dasharray:5 5}.ecosystem-core{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:124px;height:124px;border-radius:33px;background:var(--surface);box-shadow:0 0 0 16px color-mix(in srgb,var(--primary) 4%,transparent),0 0 0 38px color-mix(in srgb,var(--primary) 3%,transparent),0 15px 45px #2457f51a;display:grid;place-items:center;z-index:2}.ecosystem-core img{width:96px;height:96px}.ecosystem-node{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:12px 15px;border:1px solid var(--line);background:var(--surface);border-radius:14px;color:var(--ink);font-size:13px;font-weight:700;box-shadow:0 4px 12px #1a315808;white-space:nowrap;transition:transform .2s,border-color .2s}.ecosystem-node:hover{color:var(--primary);border-color:var(--primary);transform:translateY(-4px)}.ecosystem-node i{display:grid;place-items:center;width:33px;height:33px;border-radius:10px;font-size:20px;background:var(--surface-2);color:var(--primary)}.node-web{left:8%;top:23%}.node-mobile{right:7%;top:21%}.node-design{left:4%;top:49%}.node-ai{right:4%;top:48%}.node-commerce{left:12%;bottom:20%}.node-cloud{right:9%;bottom:19%}.node-ai i{background:#c3f85c;color:#30440f}.node-design i{background:#ffdfce;color:#985430}.node-commerce i{background:#e8e1ff;color:#7954c5}.ecosystem-bottom{position:absolute;bottom:22px;left:25px;right:25px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--muted);font-size:12px}.ecosystem-bottom span{display:flex;align-items:center;gap:7px}.ecosystem-bottom i{width:6px;height:6px;background:#86b843;border-radius:50%}.ecosystem-bottom b{font-weight:600;letter-spacing:1px}.hero-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:57px;padding-top:23px;gap:20px}.hero-disciplines{display:flex;gap:27px;flex-wrap:wrap;color:var(--muted);font-size:14px}.hero-disciplines span{display:flex;align-items:center;gap:8px}.hero-disciplines i{color:var(--primary)}.hero-explore{color:var(--ink);display:flex;align-items:center;gap:13px;font-size:13px}.hero-explore i{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%}.scroll-cue{display:none}.tech-strip{background:var(--surface);border-color:var(--line);padding:24px 0}.tech-strip .container{display:flex;align-items:center;gap:35px}.tech-strip p{min-width:190px;max-width:210px;margin:0;text-align:start;font-size:12px;line-height:1.8;color:var(--muted)}.marquee-wrap{flex:1;min-width:0}.marquee-track span{font-size:19px;color:var(--muted);font-weight:700}.marquee-track i{background:var(--line)}
[dir="rtl"] .hero-title{letter-spacing:-1.8px;line-height:1.45;font-size:clamp(38px,4vw,62px)}[dir="rtl"] .hero-desc{line-height:2}[dir="rtl"] .brand{direction:ltr}[dir="rtl"] .hero-actions .bi-arrow-right{transform:rotate(180deg)}
.hero-layout{padding:0}.hero-copy{text-align:start}.hero-title{align-items:flex-start}.hero-desc{margin-inline:0}.eyebrow{margin-inline:0}.hero-actions{justify-content:flex-start}
@media(min-width:1200px){.container{max-width:1200px}.navbar-nav{gap:0}.nav-link{padding-inline:11px!important}}
@media(max-width:1199px){.hero-title{font-size:53px}.ecosystem-node{padding:10px;gap:7px;font-size:12px}.ecosystem-core{width:100px;height:100px}.ecosystem-core img{width:80px;height:80px}.nav-cta{padding:12px}.nav-link{font-size:12px}}
@media(max-width:991px){.hero{padding:118px 0 36px}.hero-title{font-size:60px}.hero-copy{max-width:660px}.hero-visual{max-width:570px;margin-inline:auto}.hero-layout{row-gap:36px!important}.navbar{padding:12px 0}.navbar-collapse{background:var(--surface);border:1px solid var(--line);border-radius:18px;margin-top:15px;padding:12px}.navbar .nav-link{padding:12px!important;font-size:15px}.hero-bottom{margin-top:32px}.ecosystem-node{padding:12px 15px;font-size:14px}.ecosystem-core{width:124px;height:124px}.ecosystem-core img{width:96px;height:96px}.tech-strip .container{gap:25px}}
@media(max-width:575px){html{scroll-padding-top:88px}.container{padding-inline:var(--gutter,20px)}.navbar{padding:10px 0}.nav-shell{padding-inline:18px}.brand{font-size:26px}.brand-symbol{width:35px;height:35px}.brand-word .brand-period{font-size:30px}.nav-cta{display:none!important}.language-btn{font-size:12px;padding:0 10px}.language-btn .bi-globe2{display:none}.navbar-toggler{display:none}.hero{padding:102px 0 25px}.hero .hero-layout{--bs-gutter-x:0;row-gap:28px!important}.eyebrow{font-size:12px;gap:10px;margin-bottom:19px}.hero-title{font-size:clamp(39px,11.8vw,60px);letter-spacing:-2px;margin-bottom:20px}.hero-desc{font-size:15px;line-height:1.8;margin-bottom:23px}.hero-actions{flex-wrap:nowrap!important;gap:8px!important}.hero-actions .btn{font-size:12px;padding:13px 12px;gap:8px;flex:1;justify-content:center}.hero-footnote{font-size:12px;margin-top:19px}.ecosystem{border-radius:24px;aspect-ratio:1.1}.ecosystem-caption{left:17px;top:17px;font-size:10px}.ecosystem-status{top:15px;right:17px}.ecosystem-node{gap:6px;font-size:11px;padding:8px 10px;border-radius:12px}.ecosystem-node i{width:28px;height:28px;font-size:17px;border-radius:8px}.ecosystem-core{width:88px;height:88px;border-radius:25px;box-shadow:0 0 0 12px #2457f508,0 0 0 25px #2457f506}.ecosystem-core img{width:70px;height:70px}.node-web{left:5%}.node-mobile{right:4%}.node-design{left:3%;top:48%}.node-ai{right:3%}.node-commerce{left:7%;bottom:19%}.node-cloud{right:7%;bottom:18%}.ecosystem-bottom{left:17px;right:17px;bottom:15px;font-size:10px}.hero-bottom{margin-top:25px;padding-top:18px}.hero-disciplines{gap:13px;font-size:11px}.hero-explore{font-size:0;gap:0}.hero-explore i{font-size:14px;width:28px;height:28px}.tech-strip{padding:20px 0}.tech-strip .container{display:block}.tech-strip p{max-width:none;text-align:center;font-size:11px;margin-bottom:13px}.marquee-track span{font-size:16px}[dir="rtl"] .hero-title{font-size:clamp(34px,9vw,47px);letter-spacing:-1px;line-height:1.5}}
/* Shared section rhythm */
.section-pad:not(.hero){padding:90px 0}.section-heading{margin-bottom:36px}.section-heading h2,.about-copy h2{font-size:clamp(29px,3.2vw,43px);line-height:1.26;letter-spacing:-1.65px;max-width:670px}.section-heading p,.about-copy>p{font-size:16px;line-height:1.85;color:var(--muted)}.section-kicker{color:var(--primary);font-size:12px;margin-bottom:17px;letter-spacing:.02em}.section-kicker b{border:0;border-radius:0;background:transparent;color:var(--muted);width:auto;height:auto;font-family:var(--font-alt);font-size:12px;padding-inline-end:9px;border-inline-end:1px solid var(--line)}.section-kicker.light{color:#c3f85c}.section-kicker.light b{color:#a1b2d2;border-color:#44516a}.services,.process,.team,.contact,footer{background:var(--bg)}.industries,.expertise,.about{background:var(--surface)}.industries::before{display:none}.section-heading p{margin:0}.page-progress{height:2px}.page-progress span{background:var(--primary)}
/* Service category control and useful cards */
.service-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}.service-filters{display:flex;gap:7px;flex-wrap:wrap}.filter-chip{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:11px 15px;color:var(--muted);font-size:14px;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;min-height:44px;transition:background .2s,color .2s,border-color .2s}.filter-chip:hover{border-color:var(--primary);color:var(--primary)}.filter-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}.service-count{color:var(--muted);font-size:12px;white-space:nowrap}.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.services-grid>.service-item{min-width:0;--card-accent:var(--primary)}.services-grid>.service-item[hidden]{display:none}.service-card{min-height:300px;border-radius:19px;padding:26px;background:var(--surface);border:1px solid var(--line);box-shadow:none;gap:25px}.service-card::before{display:none}.service-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:var(--shadow-sm)}.service-icon{width:48px;height:48px;border-radius:14px;box-shadow:none;background:var(--surface-2);color:var(--primary);font-size:22px}.service-item[data-category="mobile"] .service-icon{background:#fff0dd;color:#aa6508}.service-item[data-category="design"] .service-icon{background:#f0e7ff;color:#8150c9}.service-item[data-category="ai"] .service-icon{background:#c3f85c;color:#385410}.service-item[data-category="enterprise"] .service-icon{background:#def4f0;color:#248071}.service-number{color:var(--muted);font-size:12px}.service-card h3{font-size:19px;font-weight:750;line-height:1.4;letter-spacing:-.5px;margin-bottom:9px}.service-card p{font-size:15px;line-height:1.8;max-width:none;min-height:54px}.service-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:18px;direction:ltr;justify-content:flex-start}.service-tags span{font-family:Manrope,sans-serif;font-size:12px;color:var(--muted);padding:3px 8px;background:var(--surface-2);border-radius:6px}.service-link,.industry-link{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 0 0;border:0;border-top:1px solid var(--line);background:none;color:var(--ink);font-size:13px;font-weight:650;width:100%;text-align:start}.service-link i,.industry-link i{font-size:18px;color:var(--primary)}.service-link:hover,.industry-link:hover{color:var(--primary)}
/* Business-specific solutions */
.industries-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.industry-card,.industry-card:nth-child(1),.industry-card:nth-child(4){grid-column:auto;min-height:285px;border:1px solid var(--line);border-radius:19px;background:var(--bg);color:var(--ink);box-shadow:none;padding:25px;gap:24px}.industry-card::after{display:none}.industry-card:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:var(--shadow-sm)}.industry-icon{background:var(--surface);color:var(--primary);border:1px solid var(--line);width:48px;height:48px;border-radius:14px;font-size:23px}.industry-card:nth-child(1) .industry-icon{color:#df6b72}.industry-card:nth-child(2) .industry-icon{color:#9772dc}.industry-card:nth-child(3) .industry-icon{color:#ba851b}.industry-card:nth-child(5) .industry-icon{color:#339e82}.industry-chip{color:var(--muted);background:var(--surface);border:1px solid var(--line);font-size:11px;font-weight:600;padding:5px 8px;border-radius:7px}.industry-content h3{font-size:20px;letter-spacing:-.5px;line-height:1.5}.industry-content p{color:var(--muted);opacity:1;font-size:15px;line-height:1.8}.industry-link{font-size:13px}
/* Supporting content */
.expertise.section-pad{padding-top:0}.expertise-shell{border-radius:26px;background:#111e36;box-shadow:none}.expertise-copy{min-height:500px;padding:44px}.expertise-copy h2{font-size:clamp(29px,3vw,42px);line-height:1.3;letter-spacing:-1.4px}.expertise-copy>p{font-size:16px;color:#a9b8d3;line-height:1.9}.text-link{background:#c3f85c;color:#263910;border-radius:10px;font-size:14px;padding:13px 16px}.text-link:hover{background:#d5ff89;color:#263910}.bento-grid{min-height:500px;padding:20px;gap:12px}.bento-card{background:#1b2a43;border-color:#30405b;border-radius:17px;padding:22px}.bento-large{background:#243b60}.bento-card p{color:#b4c1d8;font-size:14px}.bento-card h3{font-size:18px;line-height:1.5}.bento-card>div>i{color:#c3f85c}.bento-number{font-size:64px}.metric-card{flex-direction:column;align-items:flex-start}.metric-ring{width:72px;height:72px;flex-basis:72px;background:transparent;border:1px solid #61713c;border-radius:50%;transform:none;color:#c3f85c}.metric-ring::before{display:none}.metric-ring strong{font-size:21px;transform:none}.orbit-icon{width:65px;height:65px;border-radius:17px}.orbit-icon::before{inset:11px;border-radius:12px}.orbit-icon::after{inset:24px;border-radius:4px;background:#c3f85c}.orbit-icon span{display:none}.process .section-heading{max-width:700px}.process-card{border-radius:18px;min-height:260px;background:var(--surface);padding:25px;box-shadow:none}.process-card::after{height:2px;opacity:.2;background:var(--primary)}.process-dot{background:var(--surface-2);color:var(--primary);margin-bottom:29px;width:45px;height:45px;border-radius:12px}.process-dot::before{display:none}.process-dot i{font-size:21px}.process-index{color:var(--muted)}.process-card p{font-size:15px}.process-card h3{font-size:19px}.about-shell{background:var(--bg);min-height:450px;border-radius:26px;box-shadow:none}.about-visual{padding:15px}.map-card{min-height:420px;background:#1747c8;border-radius:18px}.map-grid{background-size:35px 35px}.about-copy{padding:40px}.about-tags span{background:var(--surface);color:var(--ink-soft);font-size:12px;box-shadow:none;border:1px solid var(--line)}.about-tags i{background:var(--primary);color:var(--bg);border-radius:7px;width:22px;height:22px}.timezone-card{background:#ffffff12;border-color:#ffffff30}.timezone-card>i{color:#2457f5}.timezone-card strong{font-size:13px}.location{font-size:13px}
/* Team portraits */
.team-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-bottom:16px}.team-card{min-height:0;box-shadow:none;background:var(--surface);border-color:var(--line);border-radius:18px}.team-card:hover{transform:translateY(-4px)}.team-visual{display:block;aspect-ratio:1 / 1.12;min-height:0;background:#e5e9ed}.team-visual::before{display:none}.team-visual>img{width:100%;height:100%;object-fit:cover;object-position:center 28%;transition:transform .5s}.team-card:hover .team-visual>img{transform:scale(1.035)}.team-sample{position:absolute;bottom:12px;inset-inline-start:12px;background:#ffffffdc;backdrop-filter:blur(10px);color:#485268;font-size:11px;padding:5px 8px;border-radius:6px}.team-content{padding:21px}.team-content h3{font-family:Manrope,sans-serif;font-size:20px;margin:0 0 7px;text-align:start;letter-spacing:-.5px}.team-role{font-weight:500;color:var(--muted);display:block;font-size:14px;min-height:42px;line-height:1.6}.team-skills{padding-top:14px;margin-top:13px;gap:5px}.team-skills span{font-size:12px;color:var(--primary);background:var(--surface-2);padding:4px 8px;border-radius:6px}.team-disclosure{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;margin:20px 0 24px;line-height:1.8}.team-manifesto{border-radius:16px;box-shadow:none;background:var(--surface);padding:21px}.team-manifesto p{color:var(--muted);font-size:14px;line-height:1.8}.manifesto-mark{color:var(--primary);background:var(--surface-2);border-radius:12px}.manifesto-status{font-size:12px}.manifesto-status i{background:#86b843;box-shadow:0 0 0 4px #86b84316}
/* Contact, footer, and project sheet */
.contact.section-pad{padding-top:0;padding-bottom:35px}.contact-shell{background:#2457f5;border-radius:26px;padding:55px;box-shadow:none}.contact-shell::before,.contact-glow{display:none}.contact-shell h2{font-size:clamp(29px,3vw,43px);line-height:1.3;letter-spacing:-1.4px}.contact-shell p{color:#dae4ff;font-size:16px;line-height:1.85}.contact-btn{background:#c3f85c;color:#25390e!important;border-radius:13px;min-height:57px;box-shadow:none;font-size:15px}.contact-btn:hover{background:#d4ff88}.contact-email{color:#e3ebff;font-size:14px;direction:ltr}.contact .section-kicker b{color:#b6caff}.contact .section-kicker{color:#e5edff}.footer-top{padding:28px 0}.footer-bottom{color:var(--muted);font-size:12px}.socials a{background:var(--surface);color:var(--ink);border-radius:12px}.project-modal{background:var(--bg);border:1px solid var(--line);border-radius:23px}.modal-title{font-size:30px;line-height:1.3;letter-spacing:-1px}.modal-header{padding:28px 30px 18px;gap:15px}.modal-body{padding:10px 30px 20px}.modal-footer{padding:15px 30px 28px}.modal-body label{color:var(--ink-soft);font-size:14px}.form-control{color:var(--ink);background:var(--surface);border-radius:11px;font-size:16px}.form-control:focus{color:var(--ink);background:var(--surface);border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)!important}.form-control::placeholder{color:var(--muted);opacity:.8}.project-type label{background:var(--surface);color:var(--muted);border-radius:9px;font-size:13px;min-height:44px;display:flex;align-items:center;padding:8px 11px}.project-type input:checked+label{background:var(--primary);color:var(--bg);border-color:var(--primary)}.project-type input:focus-visible+label{outline:3px solid var(--primary);outline-offset:3px}.modal-footer small{color:var(--muted);font-size:12px;line-height:1.8}.btn-close{background-color:transparent;box-shadow:none!important;opacity:.7;min-width:22px;min-height:22px}.form-success{background:var(--surface-2);color:var(--primary);font-size:14px}button,a,input,textarea{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--primary);outline-offset:4px}button{touch-action:manipulation}.mobile-nav{display:none}[dir="rtl"] .section-heading h2,[dir="rtl"] .about-copy h2,[dir="rtl"] .expertise-copy h2,[dir="rtl"] .contact-shell h2,[dir="rtl"] .modal-title{letter-spacing:-.6px;line-height:1.6}[dir="rtl"] .service-card h3,[dir="rtl"] .industry-content h3{letter-spacing:0}[dir="rtl"] .service-tags{justify-content:flex-end}[dir="rtl"] .team-content h3{text-align:right}.nav-shell{margin-inline:auto}.hero-copy{text-align:start}.hero-layout{padding:0}.hero-title{align-items:flex-start}.hero .eyebrow{justify-content:flex-start}.hero-footnote{justify-content:flex-start}.hero-actions{justify-content:flex-start}
@media(max-width:1199px){.team-grid{gap:15px}.team-content{padding:17px}.team-content h3{font-size:18px}.bento-grid{min-height:560px}.expertise-copy{min-height:560px;padding:35px}.filter-chip{padding:10px 12px;font-size:13px}.service-filters{gap:6px}.service-card{padding:23px}.service-count{display:none}}
@media(max-width:991px){.section-pad:not(.hero){padding:65px 0}.hero-layout{padding:0}.hero-copy{max-width:none}.hero-title{margin-inline:0}.hero .hero-desc{max-width:600px}.hero-footnote{margin-bottom:10px}.hero-visual{width:100%;max-width:580px}.services-grid,.industries-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.team-visual{aspect-ratio:1 / 1}.expertise-copy{min-height:0;padding:35px}.bento-grid{min-height:360px;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr;padding:0 25px 25px}.bento-large{grid-row:auto}.bento-card{gap:20px}.bento-number{font-size:50px}.about-copy{padding:35px}.about-visual{padding:15px}.map-card{min-height:350px}.team-manifesto{flex-wrap:wrap}.manifesto-status{margin-inline-start:64px}.contact-shell{padding:40px}.contact .text-lg-end{text-align:start}.contact-btn{margin:0}.service-toolbar{margin-bottom:22px}.section-heading p{max-width:650px}}
/* Compact app shell: safe areas, touch navigation, and a bottom sheet */
@media(max-width:575px){:root{--gutter:20px}body{padding-bottom:calc(83px + env(safe-area-inset-bottom,0px))}.section-pad:not(.hero){padding:47px 0}.section-heading{margin-bottom:24px;--bs-gutter-y:14px}.section-heading h2,.about-copy h2{font-size:29px;letter-spacing:-1px;line-height:1.3}.section-heading p{font-size:15px;line-height:1.9}.section-kicker{font-size:12px;margin-bottom:12px}.hero .hero-copy{text-align:start}.hero .hero-title{align-items:flex-start}.hero-visual{padding:0}.hero-footnote{margin-bottom:0}.hero .hero-layout{row-gap:27px!important}.hero-bottom{flex-wrap:nowrap}.service-toolbar{margin-inline:calc(var(--gutter,20px) * -1);margin-bottom:20px;overflow:hidden}.service-filters{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:4px var(--gutter,20px) 8px;scroll-padding-inline:var(--gutter,20px)}.service-filters::-webkit-scrollbar{display:none}.filter-chip{font-size:13px;min-height:44px;padding:10px 14px;border-radius:12px}.services-grid{grid-template-columns:1fr;gap:12px}.service-card{min-height:0;padding:22px;gap:20px;border-radius:19px}.service-top{align-items:center}.service-icon{width:45px;height:45px;font-size:22px}.service-card h3{font-size:19px}.service-card p{font-size:15px;min-height:0;line-height:1.8}.service-tags{margin-top:14px}.service-link{font-size:14px;padding-top:14px;min-height:44px}.industries-grid{grid-template-columns:1fr;gap:12px}.industry-card,.industry-card:nth-child(1),.industry-card:nth-child(4){min-height:0;padding:21px;gap:18px}.industry-content h3{font-size:19px}.industry-content p{font-size:15px}.industry-chip{font-size:12px}.industry-link{font-size:14px;min-height:44px}.expertise.section-pad{padding-top:0}.expertise-shell{border-radius:21px}.expertise-copy{padding:26px}.expertise-copy h2{font-size:29px;letter-spacing:-1px}.expertise-copy>p{font-size:15px;margin:16px 0 20px}.bento-grid{display:grid;grid-template-columns:1fr;min-height:0;padding:0 16px 16px;gap:10px}.bento-card{padding:20px;min-height:0;gap:10px;flex-direction:row;align-items:center}.bento-large{flex-direction:row-reverse}.bento-number{font-size:40px}.bento-card>div:last-child{flex:1}.bento-card h3{margin-top:0;font-size:18px}.bento-card p{font-size:14px}.bento-large>div>i{display:none}.orbit-icon{flex:0 0 60px}.metric-ring{width:60px;height:60px;flex:0 0 60px}.process .section-heading{text-align:start!important}.process .section-kicker{justify-content:flex-start!important}.process-grid{--bs-gutter-y:12px}.process-card{min-height:0;padding:22px 22px 22px 80px}.process-dot{position:absolute;left:20px;top:23px;margin:0;width:42px;height:42px}.process-index{position:static;display:block;margin-bottom:7px;font-size:12px}.process-card h3{font-size:18px;margin-bottom:7px}.process-card p{font-size:14px}.process-card::after{display:none}[dir="rtl"] .process-card{padding:22px 80px 22px 22px}[dir="rtl"] .process-dot{left:auto;right:20px}.about-shell{border-radius:22px}.about-copy{padding:25px}.about-visual{padding:12px}.map-card{min-height:280px;border-radius:15px}.about-copy>p{font-size:15px;margin:18px 0 20px}.about-tags{grid-template-columns:1fr;gap:8px}.about-tags span{font-size:13px;padding:10px}.team-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter,20px);overscroll-behavior-x:contain;margin-inline:calc(var(--gutter,20px) * -1);padding:0 var(--gutter,20px) 15px;gap:13px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.team-item{flex:0 0 77%;scroll-snap-align:start;min-width:0}.team-card{border-radius:18px}.team-visual{aspect-ratio:1 / 1.08}.team-content{padding:20px}.team-content h3{font-size:21px}.team-role{min-height:0;font-size:14px}.team-sample{font-size:12px}.team-skills span{font-size:12px}.team-disclosure{margin-top:15px;align-items:flex-start;line-height:1.8}.team-disclosure i{margin-top:3px}.team-manifesto{padding:18px;align-items:flex-start;gap:13px}.team-manifesto p{font-size:13px}.manifesto-mark{width:36px;height:36px;border-radius:10px}.manifesto-status{margin-inline-start:49px;font-size:12px}.contact.section-pad{padding-top:0;padding-bottom:10px}.contact-shell{padding:29px 24px;border-radius:22px}.contact-shell h2{font-size:29px;line-height:1.4;letter-spacing:-1px}.contact-shell p{font-size:15px;margin-top:16px}.contact-shell .row{--bs-gutter-y:25px}.contact-btn{font-size:14px;width:100%;justify-content:space-between;min-height:54px}.contact-email{text-align:center;font-size:14px;margin-top:17px}.footer-top{gap:20px!important;padding:25px 0}.footer-top p{font-size:14px}.footer-bottom{font-size:12px}.mobile-nav{display:flex;align-items:stretch;justify-content:space-around;position:fixed;z-index:1035;bottom:0;left:0;right:0;padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:color-mix(in srgb,var(--surface) 93%,transparent);backdrop-filter:blur(24px);box-shadow:0 -8px 30px #091c3806}.mobile-nav a{display:flex;flex:1;min-width:0;min-height:57px;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--muted);font-size:12px;line-height:1.4;position:relative}.mobile-nav a i{font-size:21px;position:relative;z-index:1}.mobile-nav a.active{color:var(--primary);font-weight:700}.mobile-nav a.active::before{content:'';position:absolute;top:0;width:48px;height:31px;border-radius:10px;background:color-mix(in srgb,var(--primary) 10%,transparent)}.mobile-nav a:active{transform:scale(.94)}.modal-dialog{margin:0;min-height:100%;display:flex;align-items:flex-end}.modal.fade .modal-dialog{transform:translateY(100%)}.modal.show .modal-dialog{transform:translateY(0)}.project-modal{border-radius:25px 25px 0 0;max-height:calc(100dvh - 40px);padding-bottom:env(safe-area-inset-bottom,0px);overflow-y:auto;overscroll-behavior-y:contain}.project-modal::before{content:'';width:38px;height:4px;flex-shrink:0;background:var(--line);border-radius:9px;align-self:center;margin:11px 0 0}.modal-header{padding:19px 22px 14px}.modal-title{font-size:26px;line-height:1.35}.modal-body{padding:10px 22px 20px}.modal-footer{padding:10px 22px 23px;flex-direction:column-reverse;align-items:stretch}.modal-footer>small{max-width:none;text-align:center}.modal-footer>.btn{width:100%;justify-content:center}.project-type label{font-size:12px;padding:9px 10px}.project-types{gap:6px}.modal-header .section-kicker{margin-bottom:0}.form-control{font-size:16px;min-height:50px}[dir="rtl"] .hero-title{line-height:1.5}[dir="rtl"] .section-heading h2,[dir="rtl"] .about-copy h2,[dir="rtl"] .expertise-copy h2,[dir="rtl"] .contact-shell h2{font-size:28px;line-height:1.65}.navbar .nav-shell{margin-inline:auto;width:100%}}
@media(max-width:360px){:root{--gutter:16px}.hero-title{font-size:39px}.brand{font-size:24px}.brand-symbol{width:32px;height:32px}.theme-toggle,.language-btn{height:40px}.theme-toggle{width:40px}.ecosystem-node{font-size:10px;padding:7px;gap:5px}.ecosystem-node i{width:24px;height:24px;font-size:15px}.ecosystem-core{width:76px;height:76px}.ecosystem-core img{width:62px;height:62px}.ecosystem-bottom{font-size:9px}.hero-disciplines{gap:10px;font-size:10px}.hero-actions .btn{font-size:11px;padding:12px 9px}.mobile-nav a{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.marquee-track{animation:none;flex-wrap:wrap;justify-content:center}.marquee-track [aria-hidden="true"]{display:none}}
/* Reset retained layout chrome to the Zanora surfaces. */
.nav-shell{min-height:44px;padding-block:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}.navbar.scrolled .nav-shell{box-shadow:none}.navbar .nav-cta{color:var(--bg)!important;box-shadow:none}.navbar .nav-cta:hover{color:#fff!important}.hero::before{display:none}.hero-actions{margin-top:0}.hero .btn{min-height:52px}.tech-strip{margin-top:0;border-block:1px solid var(--line)}.tech-strip .container{border:0;border-radius:0;background:transparent;box-shadow:none;padding-block:0}.section-kicker,.section-kicker.light{padding:0;border:0;background:transparent;border-radius:0}.section-kicker.light b{background:transparent;color:#a1b2d2}.section-kicker b{min-width:0}.hero-visual{min-width:0}.hero-title span{max-width:100%;overflow-wrap:normal}.navbar .nav-link:hover,.navbar .nav-link.active{background:color-mix(in srgb,var(--primary) 7%,transparent)}.dropdown-item.active span{color:inherit}.hero .eyebrow{padding:0;background:transparent;box-shadow:none;border:0}.hero-bottom b{font-weight:600}.team-card{min-height:0}.brand .brand-period{color:var(--primary)}
@media(max-width:575px){.nav-shell{min-height:44px}.hero .btn{min-height:49px;width:auto}.tech-strip .container{width:100%;padding-inline:20px}.hero-title{margin-top:0}.team-card{min-height:0}}
@media(prefers-reduced-motion:reduce){.marquee-track{width:auto;gap:15px}}

/* Contact details and the first-party security challenge. */
.contact-details-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:24px}
.contact-details-card{padding:32px;background:var(--surface);border:1px solid var(--line);border-radius:24px}
.contact-details-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--surface-2);color:var(--primary);font-size:24px;margin-bottom:20px}
.contact-details-card h3{font-size:25px;margin:0 0 24px;line-height:1.5}
.contact-detail{display:flex;align-items:flex-start;gap:13px;margin:16px 0;color:var(--ink-soft);font-size:16px}
.contact-detail>i{color:var(--primary);font-size:20px;line-height:1.6}
.contact-detail address{font-style:normal;white-space:pre-line;margin:6px 0 0;color:var(--muted);line-height:1.9}
.contact-detail-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.whatsapp-link,.contact-message-link{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 16px;border-radius:12px;font-size:14px;border:1px solid var(--line);text-decoration:none}
.whatsapp-link{background:#e2f8eb;color:#15663a;border-color:#bce8cc;flex-wrap:wrap}
.whatsapp-link i{font-size:20px}.whatsapp-link:hover{background:#c9f1d9;color:#104d2b}.whatsapp-link.is-sample{opacity:.7;cursor:default}.whatsapp-link small{width:100%;text-align:center;font-size:12px}
.contact-message-link{background:var(--surface-2);color:var(--ink)}
.sample-contact-note{display:flex;gap:8px;align-items:flex-start;font-size:13px!important;line-height:1.8!important;color:var(--muted)!important;margin:20px 0 0!important}
.location-preview{position:relative;display:flex;flex-direction:column;border-radius:24px;border:1px solid var(--line);background:var(--surface);overflow:hidden;min-height:430px}
.location-preview iframe{display:block;flex:1;width:100%;min-height:330px;border:0;filter:saturate(.65)}
.location-preview-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px;color:var(--ink)}
.location-preview-footer>div,.location-preview-footer a{display:flex;align-items:center;gap:9px}.location-preview-footer a{font-size:14px;color:var(--primary)}
.team-bio{font-size:14px;line-height:1.9;color:var(--muted);margin:12px 0}
.captcha-box{margin:24px 0 18px;padding:20px;border:1px solid var(--line);border-radius:17px;background:var(--surface)}
.captcha-heading{display:flex;align-items:center;gap:9px;margin-bottom:15px}.captcha-heading strong{font-size:14px;line-height:1.6}.captcha-shield{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--surface-2);color:var(--primary);font-size:19px;flex-shrink:0}
.captcha-refresh{display:flex;align-items:center;gap:6px;margin-inline-start:auto;min-height:40px;border:0;background:var(--surface-2);color:var(--primary);border-radius:9px;padding:8px 10px;font-size:13px;flex-shrink:0}
.captcha-refresh:disabled{opacity:.5}.captcha-refresh i{font-size:18px}
.captcha-challenge{display:flex;justify-content:center;align-items:center;min-height:96px;background:#eef2ff;border-radius:12px;overflow:hidden;margin-bottom:15px}
.captcha-challenge img{width:340px;max-width:100%;height:auto;object-fit:contain}.captcha-challenge [hidden]{display:none!important}
.captcha-image-placeholder{color:#2457f5;font-size:30px}.captcha-answer{letter-spacing:.45em;text-transform:uppercase;font-family:Manrope,Arial,sans-serif;font-weight:700;text-align:center;font-size:21px!important}
.captcha-box>small{display:block;color:var(--muted);font-size:13px;margin-top:9px;line-height:1.8}.captcha-status{display:block;color:var(--primary);font-size:13px;line-height:1.8;margin-top:7px}
.form-error{border-radius:11px;padding:13px 15px;background:#fff0f0;color:#992727;border:1px solid #f3c1c1;font-size:14px;line-height:1.8}
.form-trap{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
#submitRequest:disabled{opacity:.55;cursor:wait}.form-success{overflow-wrap:anywhere}
[hidden]{display:none!important}
@media(max-width:991px){.contact-details-grid{grid-template-columns:1fr}.location-preview{min-height:370px}}
@media(max-width:575px){.contact-details-card{padding:24px;border-radius:20px}.contact-details-card h3{font-size:22px}.contact-details-grid{gap:15px;margin-top:15px}.location-preview-footer{align-items:flex-start;flex-direction:column;padding:18px}.captcha-box{padding:14px}.captcha-heading{flex-wrap:wrap}.captcha-heading strong{font-size:13px}.captcha-refresh{font-size:12px;padding:7px}.captcha-challenge{min-height:78px}.contact-detail-actions>*{flex:1 1 100%}}

/* ==========================================================================
   Conversion layer: starting paths, questions, the request flow, the mobile
   action bar, and the floating contact shortcut. Built on the Zanora tokens.
   ========================================================================== */

/* Shared inline action used by the path footnote, the questions block and the
   request sheet. It is a button element, so the link look is spelled out. */
.text-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--primary);
  font-size: 14px;
  font-weight: 700;
  text-align: start;
}
.text-action i { font-size: 17px; transition: transform .25s var(--ease); }
.text-action:hover { color: var(--primary-dark); }
.text-action:hover i { transform: translate(2px, -2px); }
[dir="rtl"] .text-action .bi-arrow-up-right { transform: scaleX(-1); }
[dir="rtl"] .text-action:hover .bi-arrow-up-right { transform: scaleX(-1) translate(2px, -2px); }

/* Starting paths */
.starting-paths { background: var(--surface); }
.paths-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.path-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 19px;
  background: var(--bg);
  transition: transform .35s var(--ease), border-color .25s, box-shadow .25s;
}
.path-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s;
  background: radial-gradient(280px circle at var(--mx, 50%) var(--my, 0%), color-mix(in srgb, var(--primary) 9%, transparent), transparent 70%);
}
.path-card:hover { transform: translateY(-4px); border-color: var(--primary); box-shadow: var(--shadow-sm); }
.path-card:hover::before { opacity: 1; }
.path-card > * { position: relative; }
.path-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.path-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--surface-2);
  color: var(--primary);
  font-size: 22px;
}
.path-badge {
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}
.path-card h3 { margin: 0 0 9px; font-size: 20px; line-height: 1.5; font-weight: 750; letter-spacing: -.5px; }
.path-description { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.8; }
.path-deliverables { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.path-deliverables strong { display: block; margin-bottom: 11px; color: var(--ink-soft); font-size: 13px; font-weight: 700; }
.path-deliverables ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.path-deliverables li { display: flex; align-items: flex-start; gap: 9px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.path-deliverables li i { flex: 0 0 auto; margin-top: 3px; color: var(--primary); font-size: 15px; }
.path-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 48px;
  margin-top: auto;
  padding: 15px 0 0;
  border: 0;
  border-top: 1px solid var(--line);
  background: none;
  color: var(--ink);
  font-size: 14px;
  font-weight: 650;
  text-align: start;
}
.path-deliverables + .path-action { margin-top: 20px; }
.path-action i { color: var(--primary); font-size: 18px; transition: transform .25s var(--ease); }
.path-card:hover .path-action { color: var(--primary); }
.path-card:hover .path-action i { transform: translate(3px, -3px); }
[dir="rtl"] .path-action .bi-arrow-up-right { transform: scaleX(-1); }
[dir="rtl"] .path-card:hover .path-action .bi-arrow-up-right { transform: scaleX(-1) translate(3px, -3px); }
/* The card a visitor carried into the request sheet stays marked. */
.path-card.is-selected { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent); }
.path-card.is-selected .path-icon { background: var(--primary); color: #fff; }

.paths-footnote {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 26px;
  margin-top: 26px;
  padding: 18px 22px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--bg);
}
.paths-footnote p { display: flex; align-items: flex-start; gap: 9px; max-width: 640px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
.paths-footnote p i { margin-top: 3px; color: var(--primary); font-size: 15px; }
.paths-footnote > div { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; color: var(--ink-soft); font-size: 14px; }

/* Questions asked before the first step */
.faq-section { background: var(--bg); }
/* `gx-lg-5` widened the row gutter past the container padding, so the row
   hung 12px over both edges. Space the columns without touching the gutter. */
@media (min-width: 992px) { .faq-row > .col-lg-7 { padding-inline-start: 34px; } }
.faq-section .section-heading { margin-bottom: 0; }
.faq-section .text-action { margin-top: 18px; }
.faq-list { display: grid; gap: 10px; }
.faq-item {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  transition: border-color .25s, box-shadow .25s;
}
.faq-item[open] { border-color: var(--primary); box-shadow: var(--shadow-sm); }
.faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 56px;
  padding: 17px 20px;
  color: var(--ink);
  font-size: 16px;
  font-weight: 650;
  line-height: 1.7;
  cursor: pointer;
  list-style: none;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--primary); }
.faq-item summary i {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: var(--surface-2);
  color: var(--primary);
  font-size: 15px;
  transition: transform .3s var(--ease), background .25s, color .25s;
}
.faq-item[open] summary i { background: var(--primary); color: #fff; transform: rotate(45deg); }
.faq-answer { padding: 0 20px 19px; }
.faq-answer p { margin: 0; padding-block-start: 15px; border-top: 1px solid var(--line); color: var(--muted); font-size: 15px; line-height: 1.9; }

/* Request sheet: guidance, the carried path, and the optional details */
.request-intro { margin: 0 0 18px; color: var(--muted); font-size: 15px; line-height: 1.85; }
.message-hint { display: block; margin-top: 8px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.selected-path {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
  padding: 14px 17px;
  border: 1px solid color-mix(in srgb, var(--primary) 35%, var(--line));
  border-radius: 14px;
  background: color-mix(in srgb, var(--primary) 7%, var(--surface));
}
.selected-path small { display: block; color: var(--muted); font-size: 12px; }
.selected-path strong { display: block; margin-top: 3px; color: var(--ink); font-size: 15px; line-height: 1.6; }
.selected-path .text-action { flex: 0 0 auto; font-size: 13px; }
.request-optional { margin-top: 18px; }
.request-optional > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 48px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}
.request-optional > summary::-webkit-details-marker { display: none; }
.request-optional > summary:hover { border-color: var(--primary); color: var(--primary); }
.request-optional > summary i { color: var(--primary); font-size: 15px; transition: transform .3s var(--ease); }
.request-optional[open] > summary { border-color: var(--primary); border-end-start-radius: 0; border-end-end-radius: 0; }
.request-optional[open] > summary i { transform: rotate(45deg); }
.request-optional > .row {
  margin-inline: 0;
  padding: 18px 16px;
  border: 1px solid var(--line);
  border-top: 0;
  border-end-start-radius: 12px;
  border-end-end-radius: 12px;
}
.request-no-payment { display: flex; align-items: flex-start; gap: 9px; margin: 18px 0 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
.request-no-payment i { margin-top: 3px; color: #2f9e6b; font-size: 16px; }

/* What happens next, shown under the contact banner */
.request-next {
  margin-top: 22px;
  padding: 30px 32px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--surface);
}
.request-next h3 { margin: 0 0 22px; font-size: 22px; font-weight: 750; line-height: 1.5; letter-spacing: -.5px; }
.request-next ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.request-next li { display: flex; align-items: flex-start; gap: 13px; min-width: 0; }
.request-next li > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  background: var(--surface-2);
  color: var(--primary);
  font-family: var(--font-alt);
  font-size: 12px;
  font-weight: 700;
}
.request-next li p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.8; }
.request-next .request-no-payment { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }

/* Confirmation shown in place of the form */
.request-confirmation { padding: 40px 32px 44px; text-align: center; }
.confirmation-icon {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  margin: 0 auto 22px;
  border-radius: 20px;
  background: color-mix(in srgb, #2f9e6b 14%, transparent);
  color: #2f9e6b;
  font-size: 31px;
}
.confirmation-message { max-width: 460px; margin: 0 auto; color: var(--ink); font-size: 18px; font-weight: 650; line-height: 1.7; }
.confirmation-reference {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 5px 10px;
  margin: 18px 0 0;
  padding: 9px 10px 9px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: var(--muted);
  font-size: 13px;
}
.confirmation-reference bdi { color: var(--ink); font-family: var(--font-alt); font-size: 13px; font-weight: 700; overflow-wrap: anywhere; }
.copy-reference {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 9px;
  background: var(--surface-2);
  color: var(--primary);
  font-size: 15px;
  transition: background .2s, color .2s;
}
.copy-reference:hover { background: var(--primary); color: #fff; }
.copy-reference.is-copied { background: #2f9e6b; color: #fff; }
.request-confirmation h3 { margin: 30px 0 10px; font-size: 20px; font-weight: 750; line-height: 1.6; }
.request-confirmation > p:not(.confirmation-message):not(.confirmation-reference) { max-width: 520px; margin: 0 auto; color: var(--muted); font-size: 15px; line-height: 1.85; }
.request-confirmation .btn-ghost-tech { margin-top: 26px; }

/* Pointer spotlight shared by the card grids. Decoration only. */
.service-card, .industry-card { position: relative; }
.service-card::after, .industry-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s;
  background: radial-gradient(300px circle at var(--mx, 50%) var(--my, 0%), color-mix(in srgb, var(--primary) 9%, transparent), transparent 70%);
}
.service-card:hover::after, .industry-card:hover::after { opacity: 1; }
.service-card > *, .industry-card > * { position: relative; z-index: 1; }
.service-body { display: flex; flex-direction: column; flex: 1; }
.service-body .service-tags { margin-top: auto; }

/* Magnetic pull on the two headline calls to action. */
.magnetic { transform: translate(var(--pull-x, 0px), var(--pull-y, 0px)); transition: transform .35s var(--ease); }
.magnetic.is-pulled { transition: transform .12s linear; }

/* Language menu. `dropdown-menu-end` is physically right-aligned, which pushes
   the menu off the left edge in RTL because the control sits at that edge. */
.lang-dropdown { position: relative; }
.lang-dropdown .dropdown-menu, .lang-dropdown .dropdown-menu-end {
  right: auto;
  left: auto;
  inset-inline-end: 0;
  min-width: 190px;
  max-width: calc(100vw - 28px);
  max-height: min(70vh, 420px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.lang-dropdown .dropdown-item { display: flex; align-items: center; gap: 4px; min-height: 42px; }
.lang-dropdown .dropdown-item bdi { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Mobile action bar */
.mobile-nav a span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Physical `left`, because centring is the same in both writing directions and
   `inset-inline-start` plus a negative translate lands the pill on the neighbour. */
.mobile-nav a.active::before { left: 50%; right: auto; transform: translateX(-50%); }

@media (max-width: 991px) {
  .paths-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .request-next { padding: 26px; }
  .request-next ol { grid-template-columns: 1fr; gap: 16px; }
  .faq-section .section-heading { margin-bottom: 6px; }
}

@media (max-width: 575px) {
  .paths-grid { grid-template-columns: 1fr; gap: 12px; }
  .path-card { padding: 21px; }
  .path-card h3 { font-size: 19px; }
  .path-action { min-height: 44px; font-size: 14px; }
  .paths-footnote { flex-direction: column; align-items: stretch; gap: 12px; margin-top: 15px; padding: 16px 18px; }
  .faq-item summary { padding: 14px 16px; font-size: 15px; }
  .faq-answer { padding: 0 16px 16px; }
  .faq-answer p { font-size: 14px; }
  .request-next { margin-top: 15px; padding: 22px; border-radius: 20px; }
  .request-next h3 { margin-bottom: 18px; font-size: 20px; }
  .request-next li p { font-size: 14px; }
  .request-confirmation { padding: 30px 22px 36px; }
  .confirmation-message { font-size: 17px; }
  .request-confirmation h3 { margin-top: 24px; font-size: 19px; }
  .selected-path { padding: 12px 14px; }
  /* The bar would sit on top of the request sheet, so it slides away with it. */
  .mobile-nav { transition: transform .3s var(--ease); }
  body.modal-open .mobile-nav { transform: translateY(100%); }
}

/* Surfaces written as fixed light colours need a dark counterpart. */
html[data-theme="dark"] .form-error { border-color: #6d3535; background: #2b1a1a; color: #ffb4b4; }
html[data-theme="dark"] .whatsapp-link { border-color: #2c5a41; background: #16301f; color: #96e2b6; }
html[data-theme="dark"] .whatsapp-link:hover { background: #1c3f2a; color: #b6f0cd; }
html[data-theme="dark"] .service-item[data-category] .service-icon,
html[data-theme="dark"] .ecosystem-node i { filter: saturate(.8) brightness(.9); }
html[data-theme="dark"] .location-preview iframe { filter: saturate(.6) brightness(.85); }

@media (prefers-reduced-motion: reduce) {
  .magnetic { transform: none !important; }
  .path-card::before, .service-card::after, .industry-card::after { display: none; }
}

/* ---- Scroll animations (AOS) --------------------------------------------
   AOS travels 100px by default, which is far more than this layout's rhythm,
   and its own reduced-motion handling only covers markup present at init. */
[data-aos="fade-up"] { transform: translate3d(0, 26px, 0); }
[data-aos] { transition-timing-function: var(--ease); }

@media (prefers-reduced-motion: reduce) {
  [data-aos] { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ==========================================================================
   Floating support dock: a WhatsApp shortcut and the assistant chat panel.
   Buttons are 52px - comfortably past the 44px touch target without
   dominating the corner.
   ========================================================================== */

.floating-dock {
  position: fixed;
  z-index: 1032;
  inset-block-end: 24px;
  inset-inline-end: 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  animation: dock-in .5s var(--ease) both .5s;
}
@keyframes dock-in { from { opacity: 0; transform: translateY(16px); } }
.dock-buttons { display: flex; flex-direction: column; gap: 12px; }
.dock-btn {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  flex: 0 0 auto;
  border: 0;
  border-radius: 17px;
  color: #fff;
  font-size: 23px;
  transition: transform .22s var(--ease), background .22s, box-shadow .22s;
}
.dock-btn:hover { transform: translateY(-3px); }
.dock-btn:active { transform: scale(.95); }
.dock-whatsapp { background: #25a35a; box-shadow: 0 10px 26px rgba(37, 163, 90, .32); }
.dock-whatsapp:hover { background: #1f8c4d; color: #fff; }
/* Shown while the sample contact details are still in place, so the owner can
   see where the button lands before entering a real number. */
.dock-whatsapp.is-sample { background: #9aa6b8; box-shadow: none; cursor: default; opacity: .75; }
.dock-whatsapp.is-sample:hover { transform: none; }
.dock-chat { background: var(--primary); box-shadow: 0 10px 26px color-mix(in srgb, var(--primary) 34%, transparent); }
.dock-chat:hover { background: var(--primary-dark); }
.dock-chat .bi-x-lg { display: none; }
.dock-chat[aria-expanded="true"] .bi-x-lg { display: block; }
.dock-chat[aria-expanded="true"] .bi-chat-dots { display: none; }

@media (max-width: 575px) {
  /* Clear of the action bar, which keeps its own safe-area padding. */
  .floating-dock { inset-block-end: calc(84px + env(safe-area-inset-bottom, 0px)); inset-inline-end: 16px; gap: 10px; }
  .dock-buttons { gap: 10px; }
  .dock-btn { width: 50px; height: 50px; border-radius: 16px; font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .floating-dock { animation: none; }
}

/* Full-screen chat. The overlay covers the page; the conversation itself sits
   in a centred reading column so it stays comfortable on a wide monitor. */
.chat-screen {
  position: fixed;
  inset: 0;
  z-index: 1060;
  display: flex;
  justify-content: center;
  background: color-mix(in srgb, #0a1024 55%, transparent);
  backdrop-filter: blur(7px);
  animation: chat-screen-in .25s var(--ease);
}
@keyframes chat-screen-in { from { opacity: 0; } }
.chat-screen-inner {
  display: flex;
  flex-direction: column;
  width: min(760px, 100%);
  height: 100%;
  background: var(--bg);
  border-inline: 1px solid var(--line);
  animation: chat-screen-rise .3s var(--ease);
}
@keyframes chat-screen-rise { from { transform: translateY(18px); } }
body.chat-open { overflow: hidden; }

.chat-head {
  display: flex;
  align-items: center;
  gap: 11px;
  flex: 0 0 auto;
  padding: 14px 18px;
  padding-top: calc(14px + env(safe-area-inset-top, 0px));
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.chat-avatar {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  border-radius: 12px;
  background: var(--primary);
  color: #fff;
  font-size: 19px;
}
.chat-head-text { flex: 1; min-width: 0; color: var(--ink); font-size: 16px; font-weight: 750; line-height: 1.5; }
.chat-icon-btn {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--muted);
  font-size: 16px;
  transition: background .2s, color .2s;
}
.chat-icon-btn:hover { background: var(--surface-2); color: var(--ink); }

.chat-log {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 22px 18px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--line) transparent;
}
.chat-bubble {
  max-width: 78%;
  margin: 0;
  padding: 11px 15px;
  border-radius: 16px;
  font-size: 15px;
  line-height: 1.8;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.chat-from-bot { align-self: flex-start; border-start-start-radius: 5px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); }
.chat-from-user { align-self: flex-end; border-end-end-radius: 5px; background: var(--primary); color: #fff; }
.chat-bubble.is-error { border-color: #f3c1c1; background: #fff0f0; color: #992727; }
html[data-theme="dark"] .chat-bubble.is-error { border-color: #6d3535; background: #2b1a1a; color: #ffb4b4; }
/* The disclaimer scrolls with the transcript instead of filling the header. */
.chat-note { margin: 0 0 6px; color: var(--muted); font-size: 12px; line-height: 1.7; text-align: center; }
.chat-typing {
  display: flex;
  align-items: center;
  gap: 5px;
  align-self: flex-start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  border-start-start-radius: 5px;
  background: var(--surface);
}
.chat-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); animation: chat-dot 1.1s infinite; }
.chat-typing i:nth-child(2) { animation-delay: .16s; }
.chat-typing i:nth-child(3) { animation-delay: .32s; }
@keyframes chat-dot { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

/* Openers drawn from the published questions, so they need no extra copy. */
.chat-suggestions { flex: 0 0 auto; padding: 0 18px 4px; }
.chat-suggestions > span { display: block; margin-bottom: 8px; color: var(--muted); font-size: 12px; font-weight: 650; }
.chat-suggestion-list { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 8px; scrollbar-width: none; }
.chat-suggestion-list::-webkit-scrollbar { display: none; }
.chat-suggestion {
  flex: 0 0 auto;
  max-width: 280px;
  min-height: 40px;
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.5;
  text-align: start;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: border-color .2s, color .2s;
}
.chat-suggestion:hover { border-color: var(--primary); color: var(--primary); }

.chat-form {
  display: flex;
  align-items: flex-end;
  gap: 9px;
  flex: 0 0 auto;
  padding: 12px 18px;
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--line);
  background: var(--surface);
}
.chat-form textarea {
  flex: 1;
  min-width: 0;
  max-height: 132px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--bg);
  color: var(--ink);
  font-size: 16px;
  line-height: 1.6;
  resize: none;
}
.chat-form textarea:focus { border-color: var(--primary); outline: 0; box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent); }
.chat-form textarea::placeholder { color: var(--muted); opacity: .85; }
.chat-send {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  border: 0;
  border-radius: 14px;
  background: var(--primary);
  color: #fff;
  font-size: 18px;
  transition: background .2s;
}
.chat-send:hover:not(:disabled) { background: var(--primary-dark); }
.chat-send:disabled { opacity: .5; cursor: wait; }
[dir="rtl"] .chat-send .bi-send { transform: scaleX(-1); }

@media (max-width: 575px) {
  .chat-screen-inner { border-inline: 0; }
  .chat-head { padding: 12px 14px; padding-top: calc(12px + env(safe-area-inset-top, 0px)); }
  .chat-log { padding: 18px 14px; }
  .chat-bubble { max-width: 88%; font-size: 15px; }
  .chat-suggestions { padding-inline: 14px; }
  .chat-suggestion { max-width: 230px; }
  .chat-form { padding-inline: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .chat-screen, .chat-screen-inner { animation: none; }
  .chat-typing i { animation: none; opacity: .5; }
}
