:root {
  --navy: #08051c;
  --navy-2: #110b2d;
  --ink: #f7fbff;
  --muted: rgba(247, 251, 255, .72);
  --soft: rgba(247, 251, 255, .1);
  --line: rgba(255, 255, 255, .16);
  --cyan: #46d9ff;
  --blue: #1586f7;
  --royal: #2455ff;
  --magenta: #ff3d8f;
  --silver: #dce8f2;
  --card: rgba(255, 255, 255, .075);
  --card-strong: rgba(255, 255, 255, .12);
  --shadow: 0 25px 80px rgba(0, 0, 0, .45);
  --radius: 28px;
  --radius-sm: 16px;
  --max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 16% 8%, rgba(70, 217, 255, .15), transparent 28rem),
    radial-gradient(circle at 90% 12%, rgba(255, 61, 143, .12), transparent 24rem),
    linear-gradient(135deg, var(--navy), #06040f 48%, #0d0826);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  min-height: 100vh;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: radial-gradient(circle at 50% 0%, black, transparent 70%);
  opacity: .45;
  z-index: -1;
}
body[dir="rtl"], html[dir="rtl"] body {
  font-family: Tahoma, Arial, sans-serif;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
.container { width: min(var(--max), calc(100% - 36px)); margin-inline: auto; }
.section { padding: 110px 0; position: relative; }
.eyebrow {
  color: var(--cyan);
  letter-spacing: .2em;
  text-transform: uppercase;
  font-size: .78rem;
  font-weight: 800;
  margin: 0 0 16px;
}
h1, h2, h3, p { margin-top: 0; }
h1, h2 { letter-spacing: -.04em; line-height: .96; }
h1 { font-size: clamp(3rem, 7vw, 7.5rem); }
h2 { font-size: clamp(2.1rem, 4.5vw, 4.5rem); }
h3 { line-height: 1.1; }
p { color: var(--muted); line-height: 1.8; }

.preloader {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
  background: radial-gradient(circle at center, #151043, #05030d 70%);
  transition: opacity .55s ease, visibility .55s ease;
}
.preloader.is-hidden { opacity: 0; visibility: hidden; }
.preloader-shell { position: relative; width: 146px; height: 146px; display: grid; place-items: center; }
.preloader-shell img { width: 84px; height: 84px; object-fit: contain; border-radius: 22px; filter: drop-shadow(0 0 24px rgba(70,217,255,.65)); animation: pulseLogo 1.5s ease-in-out infinite; }
.orbit { position: absolute; border: 1px solid rgba(70,217,255,.45); border-radius: 50%; inset: 0; animation: spin 1.8s linear infinite; }
.orbit-two { inset: 18px; border-color: rgba(255,61,143,.4); animation-direction: reverse; animation-duration: 2.5s; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulseLogo { 50% { transform: scale(1.06); filter: drop-shadow(0 0 36px rgba(70,217,255,.9)); } }

.site-header {
  position: fixed; top: 18px; left: 50%; transform: translateX(-50%);
  z-index: 1000;
  width: min(1240px, calc(100% - 28px));
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(7, 5, 24, .66);
  backdrop-filter: blur(22px);
  box-shadow: 0 16px 50px rgba(0,0,0,.28);
  transition: .3s ease;
}
.site-header.is-scrolled { top: 10px; background: rgba(7, 5, 24, .9); }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.brand img { width: 50px; height: 50px; object-fit: contain; border-radius: 15px; background: rgba(255,255,255,.05); }
.brand strong { display: block; font-size: .96rem; text-transform: uppercase; letter-spacing: .05em; }
.brand small { display: block; color: var(--muted); font-size: .72rem; white-space: nowrap; }
.main-nav { display: flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid rgba(255,255,255,.08); border-radius: 999px; background: rgba(255,255,255,.035); }
.main-nav a { color: rgba(247,251,255,.74); padding: 10px 14px; border-radius: 999px; font-size: .9rem; font-weight: 750; transition: .25s ease; }
.main-nav a:hover, .main-nav a.active { color: white; background: linear-gradient(135deg, rgba(21,134,247,.46), rgba(70,217,255,.16)); box-shadow: inset 0 0 0 1px rgba(70,217,255,.25); }
.header-actions { display: flex; align-items: center; gap: 10px; }
.menu-toggle, .lang-toggle { border: 0; color: var(--ink); cursor: pointer; }
.lang-toggle { padding: 11px 13px; border-radius: 999px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.13); font-weight: 900; }
.menu-toggle { display: none; width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.1); position: relative; }
.menu-toggle span { position: absolute; left: 13px; right: 13px; height: 2px; background: white; transition: .25s ease; }
.menu-toggle span:first-child { top: 17px; }
.menu-toggle span:last-child { bottom: 17px; }
.menu-toggle.is-open span:first-child { top: 22px; transform: rotate(45deg); }
.menu-toggle.is-open span:last-child { bottom: 22px; transform: rotate(-45deg); }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; padding: 14px 22px; font-weight: 850; transition: .25s ease; border: 1px solid transparent; cursor: pointer; }
.btn-small { padding: 11px 15px; font-size: .9rem; }
.btn-primary { color: #020611; background: linear-gradient(135deg, var(--cyan), #65f7ff, #aeeeff); box-shadow: 0 18px 45px rgba(70,217,255,.25); }
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 24px 60px rgba(70,217,255,.35); }
.btn-outline, .btn-ghost { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: white; }
.btn-outline:hover, .btn-ghost:hover { border-color: rgba(70,217,255,.5); background: rgba(70,217,255,.12); transform: translateY(-2px); }
.text-link { color: var(--cyan); font-weight: 850; display: inline-flex; align-items: center; gap: 10px; }
.text-link::after { content: "→"; transition: .2s ease; }
html[dir="rtl"] .text-link::after { content: "←"; }
.text-link:hover::after { transform: translateX(4px); }
html[dir="rtl"] .text-link:hover::after { transform: translateX(-4px); }

.hero { min-height: 100vh; display: grid; align-items: center; padding: 140px 0 80px; position: relative; overflow: hidden; }
.hero-media { position: absolute; inset: 0; z-index: -2; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; opacity: .42; filter: saturate(1.12) contrast(1.05); }
.hero-overlay { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5,3,17,.96) 0%, rgba(8,5,28,.82) 48%, rgba(8,5,28,.52)); }
html[dir="rtl"] .hero-overlay { background: linear-gradient(-90deg, rgba(5,3,17,.96) 0%, rgba(8,5,28,.82) 48%, rgba(8,5,28,.52)); }
.hero-grid { display: grid; grid-template-columns: 1.08fr .72fr; gap: 42px; align-items: center; }
.hero-copy p { max-width: 710px; font-size: 1.08rem; }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 30px; }
.identity-card { border: 1px solid rgba(255,255,255,.14); border-radius: 40px; padding: 28px; min-height: 500px; display: flex; flex-direction: column; justify-content: center; background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)); backdrop-filter: blur(18px); box-shadow: var(--shadow); position: relative; overflow: hidden; }
.identity-card::before { content: ""; position: absolute; width: 300px; height: 300px; border-radius: 50%; background: rgba(70,217,255,.16); filter: blur(50px); right: -100px; top: -80px; }
.logo-orb { width: 210px; height: 210px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 32px; background: radial-gradient(circle, rgba(70,217,255,.22), rgba(255,255,255,.045) 60%, transparent); border: 1px solid rgba(70,217,255,.24); }
.logo-orb img { width: 136px; filter: drop-shadow(0 0 32px rgba(70,217,255,.45)); }
.identity-card > p { text-align: center; font-size: 1.15rem; color: white; font-weight: 800; }
.stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 28px; }
.stats-row div { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); border-radius: 20px; padding: 18px 10px; text-align: center; }
.stats-row strong { display: block; color: var(--cyan); font-size: 1.6rem; }
.stats-row span { color: rgba(255,255,255,.7); font-size: .78rem; }

.intro-strip { padding: 42px 0 0; }
.strip-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: -100px; position: relative; z-index: 5; }
.strip-item, .glass-panel, .statement-card, .value-card, .process-step, .sector-card, .client-logo-wall, .contact-form, .contact-cards, .contact-logo-panel, .service-index, .client-badge, .cta-card {
  background: linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,.045));
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--radius);
  box-shadow: 0 18px 60px rgba(0,0,0,.22);
  backdrop-filter: blur(16px);
}
.strip-item { padding: 26px; }
.strip-item span, .process-step span, .sector-card span { color: var(--cyan); font-weight: 950; }
.strip-item h3 { margin: 14px 0 8px; }

.split-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 56px; align-items: center; }
.section-copy p:not(.eyebrow) { font-size: 1.06rem; }
.glass-panel { padding: 34px; }
.glass-panel h3 { color: white; font-size: 1.6rem; margin-bottom: 12px; }
.glass-panel hr { border: 0; height: 1px; background: rgba(255,255,255,.14); margin: 26px 0; }

.section-heading { max-width: 850px; margin-bottom: 44px; }
.section-heading.narrow, .center-hero { max-width: 850px; text-align: center; margin-inline: auto; }
.mini-service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.mini-service { position: relative; min-height: 250px; border-radius: 30px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 20px 70px rgba(0,0,0,.35); isolation: isolate; }
.mini-service img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: .5s ease; }
.mini-service::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5,3,17,.2), rgba(5,3,17,.85)); }
.mini-service h3 { position: absolute; left: 22px; right: 22px; bottom: 20px; margin: 0; font-size: 1.35rem; }
.mini-service:hover img { transform: scale(1.08); }

.cta-band { padding-top: 20px; }
.cta-card { padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 22px; overflow: hidden; position: relative; }
.cta-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 90% 20%, rgba(70,217,255,.18), transparent 32rem); pointer-events: none; }
.cta-card h2 { max-width: 800px; margin-bottom: 0; }

.page-hero { padding: 160px 0 80px; min-height: 74vh; display: grid; align-items: center; position: relative; overflow: hidden; }
.page-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 76% 22%, rgba(70,217,255,.18), transparent 32rem), linear-gradient(180deg, transparent, rgba(255,255,255,.025)); pointer-events: none; }
.compact-hero { min-height: 60vh; }
.page-hero-grid { display: grid; grid-template-columns: 1fr .72fr; gap: 48px; align-items: center; position: relative; z-index: 2; }
.page-hero h1 { font-size: clamp(2.8rem, 5.5vw, 5.9rem); }
.page-hero p { font-size: 1.05rem; max-width: 760px; }
.page-visual { border-radius: 38px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); box-shadow: var(--shadow); min-height: 420px; }
.page-visual img { width: 100%; height: 100%; min-height: 420px; object-fit: cover; }
.narrative-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 70px; align-items: start; }
.sticky-label { position: sticky; top: 130px; }
.sticky-label span { color: var(--cyan); font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.rich-text p { font-size: 1.12rem; color: rgba(247,251,255,.78); }
.cards-two { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.statement-card { padding: 36px; position: relative; overflow: hidden; }
.statement-card::after { content: ""; position: absolute; width: 220px; height: 220px; border-radius: 50%; background: rgba(21,134,247,.12); filter: blur(34px); right: -80px; bottom: -80px; }
.card-number { color: var(--cyan); font-weight: 950; }
.statement-card h2 { font-size: clamp(2rem, 4vw, 3.4rem); margin: 16px 0; }
.process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.process-step { padding: 26px; min-height: 250px; }

.service-index { display: grid; gap: 10px; padding: 22px; }
.service-index a { padding: 16px 18px; border-radius: 16px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); transition: .25s ease; font-weight: 850; }
.service-index a:hover { border-color: rgba(70,217,255,.48); color: var(--cyan); transform: translateX(4px); }
.service-list-grid { display: grid; gap: 26px; }
.service-detail { display: grid; grid-template-columns: 360px 1fr; gap: 30px; align-items: stretch; padding: 18px; border-radius: 34px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.13); scroll-margin-top: 110px; }
.service-detail:nth-child(even) { grid-template-columns: 1fr 360px; }
.service-detail:nth-child(even) img { order: 2; }
.service-detail img { width: 100%; height: 100%; min-height: 320px; object-fit: cover; border-radius: 24px; }
.service-detail div { padding: 24px 16px; }
.service-detail span { color: var(--cyan); font-weight: 950; }
.service-detail h2 { font-size: clamp(2rem, 3.6vw, 3.4rem); margin: 14px 0; }
.service-detail ul { display: grid; gap: 10px; padding-inline-start: 20px; color: rgba(247,251,255,.82); }
.service-detail li::marker { color: var(--cyan); }
html[dir="rtl"] .service-detail ul { padding-inline-start: 0; padding-inline-end: 20px; }

.values-hero { background: radial-gradient(circle at center, rgba(70,217,255,.08), transparent 44rem); }
.values-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.large-values-grid { grid-template-columns: repeat(4, 1fr); }
.value-card { padding: 26px; min-height: 270px; position: relative; overflow: hidden; }
.value-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(70,217,255,.08), transparent 45%); opacity: 0; transition: .25s ease; }
.value-card:hover::before { opacity: 1; }
.value-card span { color: var(--cyan); font-weight: 950; }
.value-card h3 { margin: 18px 0 10px; font-size: 1.25rem; }

.client-badge { aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; text-align: center; width: min(260px, 100%); justify-self: center; }
.client-badge strong { font-size: 4.2rem; color: var(--cyan); }
.client-badge span { display: block; color: var(--muted); }
.client-showcase { padding-top: 60px; }
.client-logo-wall { padding: 28px; border-radius: 36px; overflow: hidden; }
.client-logo-wall img { width: 100%; border-radius: 24px; }
.sector-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 22px; }
.sector-card { padding: 26px; }

.contact-logo-panel { padding: 34px; text-align: center; }
.contact-logo-panel img { width: 170px; margin: 0 auto 18px; filter: drop-shadow(0 0 28px rgba(70,217,255,.35)); }
.contact-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 24px; align-items: start; }
.contact-cards { padding: 18px; display: grid; gap: 12px; }
.contact-item { display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 22px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); transition: .25s ease; }
.contact-item:hover { transform: translateY(-3px); border-color: rgba(70,217,255,.42); }
.contact-item span { width: 46px; height: 46px; border-radius: 16px; display: grid; place-items: center; background: rgba(70,217,255,.13); color: var(--cyan); font-weight: 950; flex: 0 0 auto; }
.contact-item p { margin: 3px 0 0; }
.contact-form { padding: 28px; }
.contact-form h2 { font-size: clamp(1.8rem, 3vw, 2.8rem); margin-bottom: 24px; }
.contact-form label { display: grid; gap: 8px; margin-bottom: 16px; color: rgba(247,251,255,.86); font-weight: 750; }
.contact-form input, .contact-form textarea, .contact-form select { width: 100%; color: white; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: 16px; padding: 14px 16px; outline: 0; transition: .2s ease; }
.contact-form select option { color: #111; }
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus { border-color: rgba(70,217,255,.58); box-shadow: 0 0 0 4px rgba(70,217,255,.12); }
.form-note { font-size: .85rem; margin: 14px 0 0; }

.footer { position: relative; padding: 68px 0 24px; background: rgba(0,0,0,.18); border-top: 1px solid rgba(255,255,255,.1); overflow: hidden; }
.footer-glow { position: absolute; width: 520px; height: 520px; border-radius: 50%; background: rgba(70,217,255,.08); filter: blur(60px); right: -160px; top: -200px; pointer-events: none; }
.footer-grid { display: grid; grid-template-columns: 1.3fr .7fr .9fr; gap: 28px; position: relative; z-index: 1; }
.footer-brand { display: flex; gap: 16px; align-items: flex-start; }
.footer-brand img { width: 70px; border-radius: 18px; }
.footer-brand strong { display: block; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; }
.footer-links, .footer-contact { display: grid; gap: 10px; align-content: start; }
.footer-links a, .footer-contact a { color: rgba(247,251,255,.76); transition: .2s ease; }
.footer-links a:hover, .footer-contact a:hover { color: var(--cyan); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 28px; margin-top: 40px; border-top: 1px solid rgba(255,255,255,.1); position: relative; z-index: 1; }
.footer-bottom p { margin: 0; font-size: .9rem; }
.floating-whatsapp { position: fixed; right: 20px; bottom: 22px; z-index: 999; width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; color: #031315; background: linear-gradient(135deg, #4fffc0, var(--cyan)); font-weight: 950; box-shadow: 0 18px 50px rgba(70,217,255,.28); }
html[dir="rtl"] .floating-whatsapp { right: auto; left: 20px; }
.back-to-top { position: fixed; right: 20px; bottom: 86px; z-index: 999; width: 46px; height: 46px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; background: rgba(255,255,255,.09); color: white; cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(10px); transition: .25s ease; }
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
html[dir="rtl"] .back-to-top { right: auto; left: 20px; }

.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .12s; }
.delay-2 { transition-delay: .22s; }

@media (max-width: 1020px) {
  .hide-mobile { display: none; }
  .menu-toggle { display: block; }
  .main-nav { position: fixed; top: 82px; left: 14px; right: 14px; display: grid; gap: 8px; padding: 14px; border-radius: 28px; background: rgba(7,5,24,.96); backdrop-filter: blur(24px); transform: translateY(-12px); opacity: 0; visibility: hidden; transition: .25s ease; }
  .main-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .main-nav a { padding: 14px 18px; }
  .hero-grid, .page-hero-grid, .split-layout, .narrative-grid, .contact-grid { grid-template-columns: 1fr; }
  .strip-grid, .mini-service-grid, .sector-grid { grid-template-columns: 1fr; }
  .strip-grid { margin-top: 0; }
  .process-grid, .values-grid, .large-values-grid { grid-template-columns: repeat(2, 1fr); }
  .service-detail, .service-detail:nth-child(even) { grid-template-columns: 1fr; }
  .service-detail:nth-child(even) img { order: 0; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; }
}
@media (max-width: 640px) {
  .site-header { top: 10px; border-radius: 26px; }
  .brand small { display: none; }
  .brand img { width: 44px; height: 44px; }
  .section { padding: 76px 0; }
  .hero { padding-top: 126px; }
  .hero-card, .identity-card { min-height: auto; }
  .stats-row { grid-template-columns: 1fr; }
  .cards-two, .process-grid, .values-grid, .large-values-grid { grid-template-columns: 1fr; }
  .cta-card { flex-direction: column; align-items: flex-start; }
  .page-visual, .page-visual img { min-height: 280px; }
  .service-detail img { min-height: 260px; }
  h1 { font-size: clamp(2.55rem, 15vw, 4.1rem); }
  .page-hero h1 { font-size: clamp(2.35rem, 12vw, 3.8rem); }
}

/* =========================================================
   GrandMind refinement v3
   - animated hand background inspired by the social-media hand visual
   - smaller, cleaner typography
   - tighter professional spacing and card rhythm
   ========================================================= */
body {
  position: relative;
  font-size: 15px;
  background:
    radial-gradient(circle at 16% 8%, rgba(70, 217, 255, .13), transparent 28rem),
    radial-gradient(circle at 90% 12%, rgba(255, 61, 143, .10), transparent 24rem),
    radial-gradient(circle at 54% 72%, rgba(21, 134, 247, .08), transparent 34rem),
    linear-gradient(135deg, var(--navy), #06040f 48%, #0d0826);
}
body::before {
  z-index: 0;
  opacity: .32;
}
body::after {
  content: "";
  position: fixed;
  right: -8vw;
  bottom: -10vh;
  width: min(58vw, 820px);
  height: min(82vh, 850px);
  pointer-events: none;
  z-index: 0;
  opacity: .34;
  background: url('../assets/hand-bg.png') center / contain no-repeat;
  filter: saturate(1.18) contrast(1.08) drop-shadow(0 0 42px rgba(70,217,255,.20));
  transform-origin: 58% 78%;
  animation: grandHandFloat 10s ease-in-out infinite alternate, grandHandGlow 5.5s ease-in-out infinite;
}
main, .footer {
  position: relative;
  z-index: 1;
}
.site-header, .floating-whatsapp, .back-to-top, .preloader {
  isolation: isolate;
}
@keyframes grandHandFloat {
  0% { transform: translate3d(0, 0, 0) scale(1) rotate(-1deg); }
  50% { transform: translate3d(-16px, -24px, 0) scale(1.035) rotate(1deg); }
  100% { transform: translate3d(-34px, -8px, 0) scale(1.06) rotate(-.35deg); }
}
@keyframes grandHandGlow {
  0%, 100% { opacity: .26; filter: saturate(1.1) contrast(1.08) drop-shadow(0 0 34px rgba(70,217,255,.16)); }
  50% { opacity: .42; filter: saturate(1.28) contrast(1.12) drop-shadow(0 0 62px rgba(70,217,255,.28)); }
}

.container { width: min(1120px, calc(100% - 42px)); }
.section { padding: 86px 0; }
.eyebrow { font-size: .68rem; letter-spacing: .24em; margin-bottom: 12px; }
h1 { font-size: clamp(2.55rem, 5.5vw, 5.85rem); letter-spacing: -.052em; }
h2 { font-size: clamp(1.78rem, 3.5vw, 3.65rem); letter-spacing: -.045em; }
h3 { font-size: 1.1rem; }
p { line-height: 1.72; }
.btn { padding: 12px 18px; font-size: .92rem; }
.btn-small { padding: 10px 13px; font-size: .82rem; }

.site-header {
  width: min(1160px, calc(100% - 28px));
  padding: 9px 12px;
  background: rgba(7, 5, 24, .74);
  box-shadow: 0 14px 42px rgba(0,0,0,.24);
}
.brand img { width: 44px; height: 44px; border-radius: 13px; }
.brand strong { font-size: .86rem; }
.brand small { font-size: .66rem; }
.main-nav a { padding: 8px 12px; font-size: .82rem; }
.lang-toggle { padding: 9px 11px; font-size: .82rem; }

.hero { min-height: 92vh; padding: 128px 0 70px; }
.hero-media img { opacity: .27; }
.hero-overlay { background: linear-gradient(90deg, rgba(5,3,17,.97) 0%, rgba(8,5,28,.88) 52%, rgba(8,5,28,.62)); }
.hero-grid { grid-template-columns: 1.02fr .66fr; gap: 34px; }
.hero-copy p { font-size: .98rem; max-width: 650px; }
.hero-actions { margin-top: 24px; }
.identity-card {
  min-height: 430px;
  padding: 24px;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.038));
}
.logo-orb { width: 166px; height: 166px; margin-bottom: 24px; }
.logo-orb img { width: 108px; }
.identity-card > p { font-size: 1rem; }
.stats-row { margin-top: 22px; }
.stats-row div { padding: 14px 8px; border-radius: 16px; }
.stats-row strong { font-size: 1.32rem; }
.stats-row span { font-size: .7rem; }

.strip-grid { gap: 14px; margin-top: -72px; }
.strip-item, .glass-panel, .statement-card, .value-card, .process-step, .sector-card, .client-logo-wall, .contact-form, .contact-cards, .contact-logo-panel, .service-index, .client-badge, .cta-card {
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
  box-shadow: 0 15px 48px rgba(0,0,0,.20);
}
.strip-item { padding: 21px; }
.split-layout { gap: 42px; }
.section-copy p:not(.eyebrow) { font-size: .96rem; }
.glass-panel { padding: 28px; }
.glass-panel h3 { font-size: 1.32rem; }
.section-heading { max-width: 760px; margin-bottom: 34px; }

.mini-service-grid { gap: 16px; }
.mini-service { min-height: 220px; border-radius: 24px; }
.mini-service h3 { font-size: 1.12rem; bottom: 18px; left: 18px; right: 18px; }
.cta-card { padding: 28px; }
.cta-card h2 { max-width: 720px; }

.page-hero { padding: 138px 0 66px; min-height: 66vh; }
.compact-hero { min-height: 52vh; }
.page-hero-grid { gap: 38px; }
.page-hero h1 { font-size: clamp(2.2rem, 4.55vw, 4.75rem); }
.page-hero p { font-size: .96rem; max-width: 690px; }
.page-visual { min-height: 360px; border-radius: 28px; }
.page-visual img { min-height: 360px; }
.narrative-grid { gap: 52px; }
.rich-text p { font-size: 1rem; }
.cards-two { gap: 18px; }
.statement-card { padding: 30px; }
.statement-card h2 { font-size: clamp(1.75rem, 3.2vw, 2.85rem); margin: 12px 0; }
.process-grid { gap: 15px; }
.process-step { padding: 22px; min-height: 220px; }

.service-index { padding: 18px; }
.service-index a { padding: 13px 15px; border-radius: 14px; font-size: .92rem; }
.service-list-grid { gap: 22px; }
.service-detail { grid-template-columns: 320px 1fr; gap: 24px; padding: 14px; border-radius: 28px; background: rgba(255,255,255,.052); }
.service-detail:nth-child(even) { grid-template-columns: 1fr 320px; }
.service-detail img { min-height: 280px; border-radius: 20px; }
.service-detail div { padding: 20px 14px; }
.service-detail h2 { font-size: clamp(1.72rem, 2.9vw, 2.75rem); }
.service-detail ul { font-size: .92rem; }

.values-grid, .large-values-grid { gap: 15px; }
.value-card { padding: 22px; min-height: 230px; }
.value-card h3 { font-size: 1.06rem; margin: 14px 0 8px; }
.value-card p { font-size: .92rem; }
.client-badge strong { font-size: 3.45rem; }
.client-logo-wall { padding: 22px; border-radius: 28px; }
.client-logo-wall img { border-radius: 20px; }
.sector-grid { gap: 15px; }
.sector-card { padding: 22px; }

.contact-logo-panel { padding: 28px; }
.contact-logo-panel img { width: 136px; }
.contact-grid { gap: 20px; }
.contact-cards { padding: 15px; }
.contact-item { padding: 15px; border-radius: 18px; }
.contact-item span { width: 40px; height: 40px; border-radius: 14px; font-size: .84rem; }
.contact-form { padding: 24px; }
.contact-form h2 { font-size: clamp(1.55rem, 2.45vw, 2.35rem); }
.contact-form label { margin-bottom: 13px; font-size: .9rem; }
.contact-form input, .contact-form textarea, .contact-form select { padding: 12px 14px; border-radius: 14px; }

.footer { padding: 56px 0 22px; }
.footer-grid { gap: 22px; }
.footer-brand img { width: 58px; border-radius: 15px; }
.footer-brand p, .footer-links a, .footer-contact a, .footer-bottom p { font-size: .88rem; }
.floating-whatsapp { width: 50px; height: 50px; font-size: .86rem; }
.back-to-top { width: 42px; height: 42px; }

/* extra polish: subtle animated light line on hero cards */
.identity-card::after,
.statement-card::before,
.service-detail::before,
.value-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(120deg, transparent 0%, rgba(70,217,255,.10) 42%, transparent 72%);
  transform: translateX(-120%);
  animation: cardSweep 9s ease-in-out infinite;
}
@keyframes cardSweep {
  0%, 18% { transform: translateX(-120%); opacity: 0; }
  30%, 46% { opacity: 1; }
  62%, 100% { transform: translateX(120%); opacity: 0; }
}
.service-detail, .value-card { position: relative; overflow: hidden; }

@media (max-width: 1020px) {
  body::after { width: 76vw; height: 72vh; right: -24vw; opacity: .24; }
  .section { padding: 74px 0; }
  .hero { min-height: auto; padding: 124px 0 66px; }
  .hero-grid, .page-hero-grid { gap: 26px; }
  .identity-card { min-height: 340px; }
  .strip-grid { margin-top: 0; }
  .service-detail, .service-detail:nth-child(even) { grid-template-columns: 1fr; }
  .service-detail:nth-child(even) img { order: 0; }
}
@media (max-width: 640px) {
  body { font-size: 14px; }
  body::after { width: 105vw; height: 64vh; right: -54vw; bottom: -12vh; opacity: .18; }
  .container { width: min(100% - 28px, 1120px); }
  .site-header { width: calc(100% - 20px); padding: 8px 10px; }
  .section { padding: 62px 0; }
  .hero { padding-top: 112px; }
  h1 { font-size: clamp(2.05rem, 11vw, 3.35rem); }
  h2 { font-size: clamp(1.55rem, 8vw, 2.65rem); }
  .page-hero { padding-top: 120px; min-height: auto; }
  .page-hero h1 { font-size: clamp(1.95rem, 10vw, 3.1rem); }
  .page-visual, .page-visual img { min-height: 240px; }
  .mini-service { min-height: 190px; }
  .service-detail img { min-height: 220px; }
  .logo-orb { width: 136px; height: 136px; }
  .logo-orb img { width: 90px; }
}
@media (prefers-reduced-motion: reduce) {
  body::after, .identity-card::after, .statement-card::before, .service-detail::before, .value-card::after {
    animation: none !important;
  }
}


/* =========================================================
   GrandMind v4 - true animated collaboration hands + logo cursor
   Requested behavior:
   - On page entrance, one luminous hand comes from the left and one from the right.
   - After meeting, both keep a subtle breathing/floating motion.
   - The desktop cursor follows the user as a GrandMind logo mark and glows while scrolling.
   ========================================================= */
body::after { display: none; }

.hero, .page-hero { isolation: isolate; }
.hero > .container, .page-hero > .container { position: relative; z-index: 4; }
.hand-scene {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
}
.hand-scene::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 36%;
  width: min(42vw, 620px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%) scale(.65);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(255,255,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at center, rgba(70,217,255,.34), rgba(143,92,255,.16) 34%, transparent 64%);
  background-size: 42px 42px, 100% 100%;
  filter: blur(.2px) drop-shadow(0 0 35px rgba(70,217,255,.28));
  opacity: 0;
  animation: meetingAura 1.95s cubic-bezier(.16, 1, .3, 1) .25s forwards, auraBreath 4.4s ease-in-out 2.2s infinite;
}
.collab-hand {
  position: absolute;
  top: clamp(96px, 17vh, 170px);
  width: min(58vw, 760px);
  min-width: 430px;
  opacity: 0;
  will-change: transform, opacity, filter;
  mix-blend-mode: screen;
}
.collab-hand img {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 0 18px rgba(70,217,255,.48)) drop-shadow(0 0 46px rgba(143,92,255,.27));
}
.collab-hand-left {
  left: -19vw;
  transform-origin: 70% 55%;
  animation: handEnterLeft 1.85s cubic-bezier(.16, 1, .3, 1) .2s forwards, handFloatLeft 5.5s ease-in-out 2.15s infinite alternate;
}
.collab-hand-right {
  right: -19vw;
  transform-origin: 30% 55%;
  animation: handEnterRight 1.85s cubic-bezier(.16, 1, .3, 1) .2s forwards, handFloatRight 5.5s ease-in-out 2.15s infinite alternate;
}
.collab-hand-right img { transform: scaleX(-1); }
.hero-home .collab-hand { top: clamp(90px, 14vh, 145px); width: min(61vw, 820px); }
.compact-hero .collab-hand { top: clamp(82px, 15vh, 138px); width: min(54vw, 690px); opacity: .86; }
.contact-hero .collab-hand, .values-hero .collab-hand { top: clamp(78px, 14vh, 130px); }

@keyframes handEnterLeft {
  0% { opacity: 0; transform: translate3d(-58%, -8px, 0) rotate(4deg) scale(.96); filter: blur(3px); }
  68% { opacity: .94; }
  100% { opacity: .86; transform: translate3d(0, 0, 0) rotate(0deg) scale(1); filter: blur(0); }
}
@keyframes handEnterRight {
  0% { opacity: 0; transform: translate3d(58%, -8px, 0) rotate(-4deg) scale(.96); filter: blur(3px); }
  68% { opacity: .94; }
  100% { opacity: .86; transform: translate3d(0, 0, 0) rotate(0deg) scale(1); filter: blur(0); }
}
@keyframes handFloatLeft {
  0% { transform: translate3d(0,0,0) rotate(0deg) scale(1); opacity: .78; }
  100% { transform: translate3d(18px,-10px,0) rotate(-1.1deg) scale(1.015); opacity: .93; }
}
@keyframes handFloatRight {
  0% { transform: translate3d(0,0,0) rotate(0deg) scale(1); opacity: .78; }
  100% { transform: translate3d(-18px,-10px,0) rotate(1.1deg) scale(1.015); opacity: .93; }
}
@keyframes meetingAura {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.20); }
  60% { opacity: .85; transform: translate(-50%, -50%) scale(.82); }
  100% { opacity: .45; transform: translate(-50%, -50%) scale(.68); }
}
@keyframes auraBreath {
  0%, 100% { opacity: .25; transform: translate(-50%, -50%) scale(.62); }
  50% { opacity: .55; transform: translate(-50%, -50%) scale(.78); }
}

/* Make the new moving hands look like background, not clutter. */
.hero-media, .hero-overlay { z-index: -2; }
.hero::after, .page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(5,3,17,.18), transparent 22%, transparent 64%, rgba(5,3,17,.46)),
    radial-gradient(circle at 50% 38%, transparent 0 18rem, rgba(5,3,17,.26) 34rem);
}
.page-hero::before { z-index: 0; }

/* Typography and spacing final tuning. */
.hero-copy h1, .page-hero h1 {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 650;
  text-shadow: 0 14px 60px rgba(70,217,255,.14);
}
.hero-copy p, .page-hero p, .rich-text p, .service-detail p, .value-card p {
  font-size: .93rem;
}
.main-nav a, .btn, .lang-toggle { letter-spacing: .01em; }
.identity-card, .glass-panel, .mini-service, .service-detail, .value-card, .contact-form, .contact-cards, .cta-card {
  border-color: rgba(137, 209, 255, .16);
}

/* Logo custom cursor */
@media (pointer: fine) and (min-width: 900px) {
  body.cursor-ready, body.cursor-ready a, body.cursor-ready button, body.cursor-ready input,
  body.cursor-ready textarea, body.cursor-ready select, body.cursor-ready label {
    cursor: none !important;
  }
  .brand-cursor {
    position: fixed;
    left: 0;
    top: 0;
    width: 38px;
    height: 38px;
    z-index: 20000;
    pointer-events: none;
    opacity: 0;
    transform: translate3d(-50%, -50%, 0) scale(.86);
    transition: opacity .18s ease, transform .09s ease, filter .18s ease;
    filter: drop-shadow(0 0 11px rgba(70,217,255,.75)) drop-shadow(0 0 24px rgba(143,92,255,.28));
    mix-blend-mode: screen;
  }
  .brand-cursor img { width: 100%; height: 100%; object-fit: contain; }
  .brand-cursor.is-visible { opacity: .96; }
  .brand-cursor.is-hover { transform: translate3d(-50%, -50%, 0) scale(1.14); filter: drop-shadow(0 0 16px rgba(70,217,255,.95)) drop-shadow(0 0 38px rgba(143,92,255,.46)); }
  .brand-cursor.is-click { transform: translate3d(-50%, -50%, 0) scale(.78); }
  .brand-cursor.is-scrolling { animation: cursorLogoPulse .46s ease-in-out infinite alternate; }
  @keyframes cursorLogoPulse {
    from { filter: drop-shadow(0 0 10px rgba(70,217,255,.65)) drop-shadow(0 0 22px rgba(143,92,255,.26)); }
    to { filter: drop-shadow(0 0 24px rgba(70,217,255,1)) drop-shadow(0 0 48px rgba(143,92,255,.58)); }
  }
}
@media (pointer: coarse), (max-width: 899px) {
  .brand-cursor { display: none !important; }
  .collab-hand { min-width: 300px; width: 78vw; opacity: .52; top: 105px; }
  .collab-hand-left { left: -42vw; }
  .collab-hand-right { right: -42vw; }
  .hand-scene::before { top: 32%; width: 86vw; }
}
@media (prefers-reduced-motion: reduce) {
  .collab-hand, .hand-scene::before, .brand-cursor.is-scrolling {
    animation: none !important;
  }
  .collab-hand-left, .collab-hand-right { opacity: .58; transform: none !important; }
  .hand-scene::before { opacity: .24; transform: translate(-50%, -50%) scale(.66); }
}

/* =========================================================
   GrandMind v5 - continued hand journey + logo scroll effects
   - Hands enter from both sides, meet, then continue together downward.
   - During scrolling, the GrandMind logo appears as cursor glow, trail particles,
     and a rotating scroll-progress brand badge.
   ========================================================= */
.hand-scene {
  z-index: 1;
  overflow: hidden;
}
.hand-scene::before {
  top: 33%;
  width: min(46vw, 680px);
  animation: meetingAuraJourneyV5 3.9s cubic-bezier(.16, 1, .3, 1) .15s forwards, auraDownBreathV5 5.2s ease-in-out 4.1s infinite alternate !important;
}
.collab-hand {
  --hand-final-y: 30vh;
  --hand-final-scale: .64;
  --hand-final-opacity: .40;
  width: min(62vw, 840px);
  min-width: 430px;
  top: clamp(82px, 13vh, 142px);
  opacity: 0;
  filter: saturate(1.18) contrast(1.08);
}
.collab-hand-left {
  left: -22vw;
  transform-origin: 76% 58%;
  animation: handJourneyLeftV5 3.85s cubic-bezier(.16, 1, .3, 1) .12s forwards, handTogetherLeftV5 5.6s ease-in-out 4s infinite alternate !important;
}
.collab-hand-right {
  right: -22vw;
  transform-origin: 24% 58%;
  animation: handJourneyRightV5 3.85s cubic-bezier(.16, 1, .3, 1) .12s forwards, handTogetherRightV5 5.6s ease-in-out 4s infinite alternate !important;
}
.hero-home .collab-hand {
  --hand-final-y: 35vh;
  --hand-final-scale: .58;
  --hand-final-opacity: .34;
  top: clamp(74px, 12vh, 130px);
  width: min(68vw, 900px);
}
.compact-hero .collab-hand,
.page-hero .collab-hand {
  --hand-final-y: 22vh;
  --hand-final-scale: .56;
  --hand-final-opacity: .30;
  width: min(58vw, 760px);
  top: clamp(72px, 12vh, 126px);
}
.contact-hero .collab-hand,
.values-hero .collab-hand {
  --hand-final-y: 20vh;
}
@keyframes handJourneyLeftV5 {
  0% {
    opacity: 0;
    transform: translate3d(-70%, -20px, 0) rotate(5deg) scale(.96);
    filter: blur(4px) saturate(1.12);
  }
  38% {
    opacity: .92;
    transform: translate3d(0, 0, 0) rotate(0deg) scale(1);
    filter: blur(0) saturate(1.18);
  }
  55% {
    opacity: .88;
    transform: translate3d(5vw, 6vh, 0) rotate(-.7deg) scale(.92);
  }
  100% {
    opacity: var(--hand-final-opacity);
    transform: translate3d(21vw, var(--hand-final-y), 0) rotate(-2deg) scale(var(--hand-final-scale));
    filter: blur(.2px) saturate(1.05);
  }
}
@keyframes handJourneyRightV5 {
  0% {
    opacity: 0;
    transform: translate3d(70%, -20px, 0) rotate(-5deg) scale(.96);
    filter: blur(4px) saturate(1.12);
  }
  38% {
    opacity: .92;
    transform: translate3d(0, 0, 0) rotate(0deg) scale(1);
    filter: blur(0) saturate(1.18);
  }
  55% {
    opacity: .88;
    transform: translate3d(-5vw, 6vh, 0) rotate(.7deg) scale(.92);
  }
  100% {
    opacity: var(--hand-final-opacity);
    transform: translate3d(-21vw, var(--hand-final-y), 0) rotate(2deg) scale(var(--hand-final-scale));
    filter: blur(.2px) saturate(1.05);
  }
}
@keyframes handTogetherLeftV5 {
  0% { opacity: var(--hand-final-opacity); transform: translate3d(21vw, var(--hand-final-y), 0) rotate(-2deg) scale(var(--hand-final-scale)); }
  100% { opacity: calc(var(--hand-final-opacity) + .10); transform: translate3d(21.7vw, calc(var(--hand-final-y) + 1.2vh), 0) rotate(-1deg) scale(calc(var(--hand-final-scale) + .025)); }
}
@keyframes handTogetherRightV5 {
  0% { opacity: var(--hand-final-opacity); transform: translate3d(-21vw, var(--hand-final-y), 0) rotate(2deg) scale(var(--hand-final-scale)); }
  100% { opacity: calc(var(--hand-final-opacity) + .10); transform: translate3d(-21.7vw, calc(var(--hand-final-y) + 1.2vh), 0) rotate(1deg) scale(calc(var(--hand-final-scale) + .025)); }
}
@keyframes meetingAuraJourneyV5 {
  0% { opacity: 0; top: 31%; transform: translate(-50%, -50%) scale(.16); }
  38% { opacity: .82; top: 34%; transform: translate(-50%, -50%) scale(.78); }
  58% { opacity: .56; top: 45%; transform: translate(-50%, -50%) scale(.68); }
  100% { opacity: .20; top: 69%; transform: translate(-50%, -50%) scale(.52); }
}
@keyframes auraDownBreathV5 {
  0% { opacity: .14; top: 68%; transform: translate(-50%, -50%) scale(.48); }
  100% { opacity: .28; top: 70%; transform: translate(-50%, -50%) scale(.60); }
}
.hero::after, .page-hero::after {
  background:
    linear-gradient(180deg, rgba(5,3,17,.20), transparent 18%, transparent 62%, rgba(5,3,17,.58)),
    radial-gradient(circle at 50% 38%, transparent 0 16rem, rgba(5,3,17,.30) 34rem),
    radial-gradient(circle at 50% 74%, rgba(70,217,255,.08), transparent 27rem);
}

/* stronger branded cursor + scroll logo effects */
@media (pointer: fine) and (min-width: 900px) {
  .brand-cursor {
    width: 42px;
    height: 42px;
    filter: drop-shadow(0 0 14px rgba(70,217,255,.86)) drop-shadow(0 0 30px rgba(143,92,255,.36));
  }
  .brand-cursor::after {
    content: "";
    position: absolute;
    inset: -12px;
    border-radius: 50%;
    border: 1px solid rgba(70,217,255,.22);
    box-shadow: 0 0 24px rgba(70,217,255,.12), inset 0 0 18px rgba(143,92,255,.12);
    opacity: .72;
    animation: cursorHaloSpinV5 2.6s linear infinite;
  }
  .brand-cursor.is-scrolling {
    animation: cursorLogoPulse .36s ease-in-out infinite alternate, cursorMicroRotateV5 .8s ease-in-out infinite alternate;
  }
}
@keyframes cursorHaloSpinV5 { to { transform: rotate(360deg); } }
@keyframes cursorMicroRotateV5 {
  from { rotate: -7deg; }
  to { rotate: 7deg; }
}
.scroll-progress-logo {
  position: fixed;
  right: 18px;
  top: 50%;
  width: 58px;
  height: 58px;
  z-index: 19999;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-50%) scale(.82);
  transition: opacity .25s ease, transform .25s ease;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background:
    conic-gradient(from -90deg, rgba(70,217,255,.9) calc(var(--scroll-progress, 0) * 1%), rgba(255,255,255,.08) 0),
    rgba(8,5,28,.70);
  box-shadow: 0 0 24px rgba(70,217,255,.22), 0 18px 45px rgba(0,0,0,.22);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(137,209,255,.18);
}
.scroll-progress-logo img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  border-radius: 11px;
  filter: drop-shadow(0 0 10px rgba(70,217,255,.72));
}
.scroll-progress-logo.is-active {
  opacity: .92;
  transform: translateY(-50%) scale(1);
}
.logo-trail {
  position: fixed;
  width: 24px;
  height: 24px;
  z-index: 19998;
  pointer-events: none;
  background: url('../assets/logo-cursor.png') center / contain no-repeat;
  filter: drop-shadow(0 0 12px rgba(70,217,255,.85)) drop-shadow(0 0 26px rgba(143,92,255,.36));
  opacity: .72;
  transform: translate3d(-50%, -50%, 0) scale(.55) rotate(var(--trail-rotate, 0deg));
  animation: logoTrailFlyV5 .86s ease-out forwards;
  mix-blend-mode: screen;
}
.logo-trail.is-scroll-burst {
  width: 18px;
  height: 18px;
  opacity: .48;
  animation-duration: 1.05s;
}
@keyframes logoTrailFlyV5 {
  0% { opacity: .75; transform: translate3d(-50%, -50%, 0) scale(.72) rotate(var(--trail-rotate, 0deg)); }
  100% { opacity: 0; transform: translate3d(calc(-50% + var(--trail-x, 0px)), calc(-50% + var(--trail-y, -42px)), 0) scale(.18) rotate(calc(var(--trail-rotate, 0deg) + 90deg)); }
}
@media (max-width: 899px), (pointer: coarse) {
  .scroll-progress-logo, .logo-trail { display: none !important; }
  .collab-hand { --hand-final-y: 23vh; --hand-final-scale: .50; --hand-final-opacity: .22; }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-progress-logo, .logo-trail { display: none !important; }
  .collab-hand-left, .collab-hand-right, .hand-scene::before { animation: none !important; }
}

/* =========================================================
   GrandMind Client-Ready v6
   Cleaner than the old hand animation: premium depth, responsive video,
   hover interaction, smaller typography, and mobile polish.
   ========================================================= */
.hand-scene,
.collab-hand,
.hand-scene::before {
  display: none !important;
}

.neon-depth-scene {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  opacity: .88;
}
.neon-depth-scene::before,
.neon-depth-scene::after,
.neon-depth-scene span {
  content: "";
  position: absolute;
  border-radius: 999px;
  filter: blur(.2px);
  transform: translate3d(0,0,0);
}
.neon-depth-scene::before {
  width: min(56vw, 720px);
  aspect-ratio: 1;
  right: -10vw;
  top: 10vh;
  background: radial-gradient(circle, rgba(70,217,255,.20), rgba(36,85,255,.10) 38%, transparent 70%);
  animation: depthFloat 9s ease-in-out infinite alternate;
}
.neon-depth-scene::after {
  width: min(38vw, 560px);
  aspect-ratio: 1;
  left: -8vw;
  bottom: -8vh;
  background: radial-gradient(circle, rgba(255,61,143,.14), rgba(70,217,255,.08) 42%, transparent 70%);
  animation: depthFloat 11s ease-in-out infinite alternate-reverse;
}
.neon-depth-scene span:nth-child(1) {
  inset: 17% 10% auto auto;
  width: 34%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(70,217,255,.72), transparent);
  box-shadow: 0 0 32px rgba(70,217,255,.28);
  rotate: -18deg;
}
.neon-depth-scene span:nth-child(2) {
  left: 8%;
  top: 42%;
  width: 28%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,61,143,.55), transparent);
  box-shadow: 0 0 30px rgba(255,61,143,.24);
  rotate: 22deg;
}
.neon-depth-scene span:nth-child(3) {
  left: 50%;
  top: 18%;
  width: min(18vw, 230px);
  aspect-ratio: 1;
  border: 1px solid rgba(70,217,255,.16);
  box-shadow: inset 0 0 40px rgba(70,217,255,.06), 0 0 55px rgba(36,85,255,.12);
  animation: slowSpin 20s linear infinite;
}
@keyframes depthFloat {
  from { transform: translate3d(0,0,0) scale(.96); opacity: .55; }
  to { transform: translate3d(-18px,18px,0) scale(1.08); opacity: .9; }
}
@keyframes slowSpin { to { transform: rotate(360deg); } }

/* More mature typography scale */
h1,
.hero-copy h1,
.page-hero h1 {
  font-size: clamp(2.15rem, 5.4vw, 5.05rem) !important;
  line-height: .96;
}
h2 { font-size: clamp(1.72rem, 3.4vw, 3.15rem); line-height: 1.04; }
h3 { line-height: 1.18; }
p, li { line-height: 1.78; }
.section { padding: 86px 0; }

/* Section / card interaction */
.interactive-surface {
  position: relative;
  overflow: hidden;
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease, background .28s ease;
}
.interactive-surface::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(70,217,255,.18), transparent 42%);
  transition: opacity .25s ease;
  z-index: 0;
}
.interactive-surface:hover::before { opacity: 1; }
.interactive-surface:hover {
  border-color: rgba(70,217,255,.32);
  box-shadow: 0 26px 80px rgba(0,0,0,.38), 0 0 0 1px rgba(70,217,255,.08);
}
.mini-service:hover,
.strip-item:hover,
.value-card:hover,
.service-detail:hover,
.glass-panel:hover,
.identity-card:hover {
  transform: translateY(-7px);
}
.interactive-surface > * { position: relative; z-index: 1; }

/* Correct video presentation */
.video-showcase {
  background:
    radial-gradient(circle at 15% 20%, rgba(70,217,255,.12), transparent 32rem),
    radial-gradient(circle at 90% 70%, rgba(255,61,143,.10), transparent 26rem);
}
.video-showcase-grid {
  display: grid;
  grid-template-columns: .86fr 1.14fr;
  gap: 42px;
  align-items: center;
}
.video-stage {
  position: relative;
  min-height: 470px;
  transform-style: preserve-3d;
  transition: transform .22s ease;
}
.video-card {
  position: absolute;
  inset: 0 8% 10% 0;
  border: 1px solid rgba(137,209,255,.22);
  border-radius: 30px;
  overflow: hidden;
  background: rgba(255,255,255,.06);
  box-shadow: 0 28px 90px rgba(0,0,0,.42), 0 0 58px rgba(70,217,255,.10);
}
.video-card-small {
  inset: auto 0 0 auto;
  width: 46%;
  height: 42%;
  z-index: 2;
  border-radius: 24px;
  box-shadow: 0 18px 60px rgba(0,0,0,.52), 0 0 45px rgba(255,61,143,.10);
}
.brand-video {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
  background: rgba(0,0,0,.35);
}
.video-label {
  position: absolute;
  left: 18px;
  bottom: 16px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: .78rem;
  color: var(--ink);
  background: rgba(5,3,17,.62);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(14px);
}
.service-video-detail {
  grid-template-columns: .78fr 1.22fr;
  align-items: center;
}
.service-video-copy span {
  color: var(--cyan);
  font-weight: 800;
}
.dual-video-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.dual-video-grid video {
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 16px 55px rgba(0,0,0,.35);
  aspect-ratio: 16 / 9;
}

/* SEO/accessibility helpers */
:focus-visible {
  outline: 3px solid rgba(70,217,255,.72);
  outline-offset: 4px;
}

@media (max-width: 980px) {
  .video-showcase-grid,
  .service-video-detail {
    grid-template-columns: 1fr;
  }
  .video-stage { min-height: 410px; }
  .section { padding: 72px 0; }
}
@media (max-width: 680px) {
  h1,
  .hero-copy h1,
  .page-hero h1 {
    font-size: clamp(2rem, 12vw, 3.15rem) !important;
    line-height: 1.02;
  }
  h2 { font-size: clamp(1.55rem, 8vw, 2.35rem); }
  .hero,
  .page-hero {
    padding-top: 112px !important;
    min-height: auto !important;
  }
  .hero-grid,
  .page-hero-grid {
    gap: 20px !important;
  }
  .identity-card,
  .glass-panel,
  .cta-card,
  .service-detail,
  .value-card,
  .contact-form,
  .contact-cards {
    border-radius: 22px;
  }
  .video-stage {
    min-height: auto;
    display: grid;
    gap: 14px;
  }
  .video-card,
  .video-card-small {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 22px;
  }
  .dual-video-grid {
    grid-template-columns: 1fr;
  }
  .mini-service:hover,
  .strip-item:hover,
  .value-card:hover,
  .service-detail:hover,
  .glass-panel:hover,
  .identity-card:hover {
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .neon-depth-scene *,
  .neon-depth-scene::before,
  .neon-depth-scene::after {
    animation: none !important;
  }
}

/* =========================================================
   GrandMind Client-Ready v7
   Requested by client: bring back refined hand motion + reduce main headings.
   This override intentionally comes last to beat older experimental effects.
   ========================================================= */

/* 1) Bring the collaboration hands back, but keep them subtle and premium. */
.hand-scene {
  display: block !important;
  z-index: 2;
  opacity: .94;
}
.hand-scene::before {
  display: block !important;
  top: 34%;
  width: min(38vw, 560px);
  opacity: .28;
  animation: handAuraSoftV7 5.8s ease-in-out infinite alternate !important;
}
.collab-hand {
  display: block !important;
  top: clamp(78px, 13vh, 132px);
  width: min(48vw, 680px);
  min-width: 335px;
  opacity: .34;
  filter: saturate(1.08) contrast(1.03);
  mix-blend-mode: screen;
}
.collab-hand img {
  filter:
    drop-shadow(0 0 12px rgba(70,217,255,.34))
    drop-shadow(0 0 30px rgba(143,92,255,.20));
}
.collab-hand-left {
  left: -15vw;
  transform-origin: 72% 56%;
  animation: handSoftInLeftV7 2.25s cubic-bezier(.16, 1, .3, 1) .15s forwards,
             handSoftFloatLeftV7 6.4s ease-in-out 2.5s infinite alternate !important;
}
.collab-hand-right {
  right: -15vw;
  transform-origin: 28% 56%;
  animation: handSoftInRightV7 2.25s cubic-bezier(.16, 1, .3, 1) .15s forwards,
             handSoftFloatRightV7 6.4s ease-in-out 2.5s infinite alternate !important;
}
.hero-home .collab-hand {
  top: clamp(76px, 12vh, 126px);
  width: min(52vw, 720px);
  opacity: .36;
}
.page-hero .collab-hand,
.compact-hero .collab-hand {
  top: clamp(72px, 12vh, 118px);
  width: min(45vw, 610px);
  opacity: .28;
}
.hero:hover .collab-hand img,
.page-hero:hover .collab-hand img {
  filter:
    drop-shadow(0 0 15px rgba(70,217,255,.46))
    drop-shadow(0 0 38px rgba(143,92,255,.26));
}
.hero:hover .hand-scene::before,
.page-hero:hover .hand-scene::before {
  opacity: .38;
}

@keyframes handSoftInLeftV7 {
  0%   { opacity: 0; transform: translate3d(-40%, -8px, 0) rotate(3deg) scale(.98); filter: blur(2px); }
  72%  { opacity: .44; }
  100% { opacity: .34; transform: translate3d(0, 0, 0) rotate(0deg) scale(.88); filter: blur(0); }
}
@keyframes handSoftInRightV7 {
  0%   { opacity: 0; transform: translate3d(40%, -8px, 0) rotate(-3deg) scale(.98); filter: blur(2px); }
  72%  { opacity: .44; }
  100% { opacity: .34; transform: translate3d(0, 0, 0) rotate(0deg) scale(.88); filter: blur(0); }
}
@keyframes handSoftFloatLeftV7 {
  0%   { opacity: .29; transform: translate3d(0, 0, 0) rotate(0deg) scale(.88); }
  100% { opacity: .40; transform: translate3d(12px, -8px, 0) rotate(-.9deg) scale(.90); }
}
@keyframes handSoftFloatRightV7 {
  0%   { opacity: .29; transform: translate3d(0, 0, 0) rotate(0deg) scale(.88); }
  100% { opacity: .40; transform: translate3d(-12px, -8px, 0) rotate(.9deg) scale(.90); }
}
@keyframes handAuraSoftV7 {
  0%   { opacity: .18; transform: translate(-50%, -50%) scale(.54); }
  100% { opacity: .36; transform: translate(-50%, -50%) scale(.68); }
}

/* 2) Main heading scale: smaller, readable, and still premium. */
h1,
.hero-copy h1,
.page-hero h1 {
  font-size: clamp(2rem, 4.35vw, 4.2rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -.038em !important;
}
h2,
.section-heading h2,
.section-copy h2 {
  font-size: clamp(1.55rem, 2.85vw, 2.75rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.032em !important;
}
.hero-copy p,
.page-hero p {
  font-size: clamp(.95rem, 1.15vw, 1.05rem) !important;
  line-height: 1.72 !important;
}

@media (max-width: 980px) {
  .collab-hand {
    width: min(58vw, 520px);
    min-width: 285px;
    opacity: .26;
  }
  .collab-hand-left { left: -25vw; }
  .collab-hand-right { right: -25vw; }
  h1,
  .hero-copy h1,
  .page-hero h1 {
    font-size: clamp(1.9rem, 7vw, 3.15rem) !important;
  }
}
@media (max-width: 680px) {
  .hand-scene {
    opacity: .62;
  }
  .collab-hand {
    top: 92px;
    width: 72vw;
    min-width: 245px;
    opacity: .18;
  }
  .collab-hand-left { left: -45vw; }
  .collab-hand-right { right: -45vw; }
  .hand-scene::before {
    width: 72vw;
    opacity: .16;
  }
  h1,
  .hero-copy h1,
  .page-hero h1 {
    font-size: clamp(1.75rem, 9.5vw, 2.55rem) !important;
    line-height: 1.1 !important;
  }
  h2,
  .section-heading h2,
  .section-copy h2 {
    font-size: clamp(1.38rem, 7vw, 2.05rem) !important;
  }
  .hero-copy p,
  .page-hero p {
    font-size: .94rem !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .collab-hand-left,
  .collab-hand-right,
  .hand-scene::before {
    animation: none !important;
  }
}

/* =========================================================
   GrandMind Client-Ready v4.1
   Client request: the hands must be clearly visible on website entry.
   Behavior: fast left/right entrance, visible meeting moment, then subtle float.
   ========================================================= */
.hero,
.page-hero {
  position: relative;
  isolation: isolate;
}

.hand-scene {
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: 2 !important;
  pointer-events: none;
  overflow: hidden;
  opacity: 1 !important;
}

.hand-scene::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 34%;
  width: min(44vw, 620px);
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(59,196,255,.34) 0%, rgba(132,83,255,.24) 34%, rgba(132,83,255,0) 70%);
  transform: translate(-50%, -50%) scale(.55);
  opacity: .32 !important;
  filter: blur(10px);
  animation: handAuraVisibleV41 1.35s ease-out .08s forwards,
             handAuraBreathV41 4.6s ease-in-out 1.5s infinite alternate !important;
}

.collab-hand {
  display: block !important;
  position: absolute;
  top: clamp(82px, 14vh, 140px) !important;
  width: min(56vw, 780px) !important;
  min-width: 390px !important;
  opacity: 0;
  mix-blend-mode: screen;
  filter: saturate(1.2) contrast(1.08);
  will-change: transform, opacity, filter;
}

.collab-hand img {
  width: 100%;
  display: block;
  filter:
    drop-shadow(0 0 16px rgba(74, 210, 255, .55))
    drop-shadow(0 0 42px rgba(133, 87, 255, .38))
    drop-shadow(0 0 80px rgba(14, 121, 255, .18)) !important;
}

.collab-hand-left {
  left: -34vw !important;
  transform-origin: 76% 54%;
  animation: handEntryLeftVisibleV41 1.18s cubic-bezier(.12, .88, .18, 1) .16s forwards,
             handVisibleFloatLeftV41 5.2s ease-in-out 1.55s infinite alternate !important;
}

.collab-hand-right {
  right: -34vw !important;
  transform-origin: 24% 54%;
  animation: handEntryRightVisibleV41 1.18s cubic-bezier(.12, .88, .18, 1) .16s forwards,
             handVisibleFloatRightV41 5.2s ease-in-out 1.55s infinite alternate !important;
}

.collab-hand-right img {
  transform: scaleX(-1);
}

.hero-home .collab-hand {
  top: clamp(78px, 13vh, 132px) !important;
  width: min(59vw, 840px) !important;
  min-width: 430px !important;
}

.page-hero .collab-hand,
.compact-hero .collab-hand {
  top: clamp(72px, 12vh, 122px) !important;
  width: min(50vw, 680px) !important;
  min-width: 360px !important;
}

.hero > .container,
.page-hero > .container {
  position: relative;
  z-index: 4 !important;
}

@keyframes handEntryLeftVisibleV41 {
  0% {
    opacity: 0;
    transform: translate3d(-58%, -10px, 0) rotate(5deg) scale(.92);
    filter: blur(3px);
  }
  58% {
    opacity: .82;
    transform: translate3d(16vw, 0, 0) rotate(-1deg) scale(1.02);
    filter: blur(0);
  }
  100% {
    opacity: .66;
    transform: translate3d(11vw, 0, 0) rotate(0deg) scale(.96);
    filter: blur(0);
  }
}

@keyframes handEntryRightVisibleV41 {
  0% {
    opacity: 0;
    transform: translate3d(58%, -10px, 0) rotate(-5deg) scale(.92);
    filter: blur(3px);
  }
  58% {
    opacity: .82;
    transform: translate3d(-16vw, 0, 0) rotate(1deg) scale(1.02);
    filter: blur(0);
  }
  100% {
    opacity: .66;
    transform: translate3d(-11vw, 0, 0) rotate(0deg) scale(.96);
    filter: blur(0);
  }
}

@keyframes handVisibleFloatLeftV41 {
  0%   { opacity: .58; transform: translate3d(11vw, 0, 0) rotate(0deg) scale(.96); }
  100% { opacity: .72; transform: translate3d(11.8vw, -9px, 0) rotate(-.85deg) scale(.985); }
}

@keyframes handVisibleFloatRightV41 {
  0%   { opacity: .58; transform: translate3d(-11vw, 0, 0) rotate(0deg) scale(.96); }
  100% { opacity: .72; transform: translate3d(-11.8vw, -9px, 0) rotate(.85deg) scale(.985); }
}

@keyframes handAuraVisibleV41 {
  0%   { opacity: 0; transform: translate(-50%, -50%) scale(.42); }
  100% { opacity: .32; transform: translate(-50%, -50%) scale(.72); }
}

@keyframes handAuraBreathV41 {
  0%   { opacity: .24; transform: translate(-50%, -50%) scale(.68); }
  100% { opacity: .42; transform: translate(-50%, -50%) scale(.82); }
}

/* Smaller main headlines, but still premium and readable. */
h1,
.hero-copy h1,
.page-hero h1 {
  font-size: clamp(1.9rem, 3.85vw, 3.75rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -.035em !important;
}

h2,
.section-heading h2,
.section-copy h2 {
  font-size: clamp(1.48rem, 2.45vw, 2.45rem) !important;
  line-height: 1.16 !important;
  letter-spacing: -.028em !important;
}

.hero-copy p,
.page-hero p {
  font-size: clamp(.94rem, 1.05vw, 1.02rem) !important;
  line-height: 1.72 !important;
}

@media (max-width: 980px) {
  .collab-hand {
    width: 69vw !important;
    min-width: 310px !important;
    top: 92px !important;
  }
  .collab-hand-left { left: -48vw !important; }
  .collab-hand-right { right: -48vw !important; }
  h1,
  .hero-copy h1,
  .page-hero h1 {
    font-size: clamp(1.8rem, 6.4vw, 2.9rem) !important;
  }
}

@media (max-width: 680px) {
  .hand-scene { opacity: .86 !important; }
  .collab-hand {
    width: 86vw !important;
    min-width: 245px !important;
    top: 88px !important;
  }
  .collab-hand-left { left: -68vw !important; }
  .collab-hand-right { right: -68vw !important; }
  .hand-scene::before {
    top: 28%;
    width: 86vw;
    opacity: .24 !important;
  }
  h1,
  .hero-copy h1,
  .page-hero h1 {
    font-size: clamp(1.65rem, 8.5vw, 2.35rem) !important;
    line-height: 1.12 !important;
  }
  h2,
  .section-heading h2,
  .section-copy h2 {
    font-size: clamp(1.32rem, 6.4vw, 1.95rem) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .collab-hand-left,
  .collab-hand-right,
  .hand-scene::before {
    animation: none !important;
    opacity: .55 !important;
  }
}

/* =========================================================
   GrandMind Client-Ready v5
   Client request: after the left/right hand entrance, the hands travel downward with page scrolling.
   Behavior: visible fast entrance first, then the pair follows the scroll vertically as a background effect.
   ========================================================= */
:root {
  --hands-scroll-y: 0px;
  --hands-scroll-opacity: .68;
  --hands-scroll-aura-opacity: .32;
}

.hand-scene {
  position: fixed !important;
  inset: 0 !important;
  height: 100vh !important;
  z-index: 1 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  opacity: var(--hands-scroll-opacity) !important;
  transition: opacity .18s ease-out;
}

.hand-scene::before {
  top: calc(34% + (var(--hands-scroll-y) * .42)) !important;
  opacity: var(--hands-scroll-aura-opacity) !important;
  animation: handAuraScrollVisibleV5 1.35s ease-out .08s forwards,
             handAuraScrollBreathV5 4.6s ease-in-out 1.5s infinite alternate !important;
}

.collab-hand-left {
  animation: handEntryLeftScrollV5 1.18s cubic-bezier(.12, .88, .18, 1) .16s forwards,
             handScrollFloatLeftV5 5.2s ease-in-out 1.55s infinite alternate !important;
}

.collab-hand-right {
  animation: handEntryRightScrollV5 1.18s cubic-bezier(.12, .88, .18, 1) .16s forwards,
             handScrollFloatRightV5 5.2s ease-in-out 1.55s infinite alternate !important;
}

@keyframes handEntryLeftScrollV5 {
  0% {
    opacity: 0;
    transform: translate3d(-58%, calc(var(--hands-scroll-y) - 10px), 0) rotate(5deg) scale(.92);
    filter: blur(3px);
  }
  58% {
    opacity: .86;
    transform: translate3d(16vw, var(--hands-scroll-y), 0) rotate(-1deg) scale(1.02);
    filter: blur(0);
  }
  100% {
    opacity: .70;
    transform: translate3d(11vw, var(--hands-scroll-y), 0) rotate(0deg) scale(.96);
    filter: blur(0);
  }
}

@keyframes handEntryRightScrollV5 {
  0% {
    opacity: 0;
    transform: translate3d(58%, calc(var(--hands-scroll-y) - 10px), 0) rotate(-5deg) scale(.92);
    filter: blur(3px);
  }
  58% {
    opacity: .86;
    transform: translate3d(-16vw, var(--hands-scroll-y), 0) rotate(1deg) scale(1.02);
    filter: blur(0);
  }
  100% {
    opacity: .70;
    transform: translate3d(-11vw, var(--hands-scroll-y), 0) rotate(0deg) scale(.96);
    filter: blur(0);
  }
}

@keyframes handScrollFloatLeftV5 {
  0%   { opacity: .58; transform: translate3d(11vw, var(--hands-scroll-y), 0) rotate(0deg) scale(.96); }
  100% { opacity: .74; transform: translate3d(11.8vw, calc(var(--hands-scroll-y) - 9px), 0) rotate(-.85deg) scale(.985); }
}

@keyframes handScrollFloatRightV5 {
  0%   { opacity: .58; transform: translate3d(-11vw, var(--hands-scroll-y), 0) rotate(0deg) scale(.96); }
  100% { opacity: .74; transform: translate3d(-11.8vw, calc(var(--hands-scroll-y) - 9px), 0) rotate(.85deg) scale(.985); }
}

@keyframes handAuraScrollVisibleV5 {
  0%   { opacity: 0; transform: translate(-50%, -50%) scale(.42); }
  100% { opacity: var(--hands-scroll-aura-opacity); transform: translate(-50%, -50%) scale(.72); }
}

@keyframes handAuraScrollBreathV5 {
  0%   { opacity: calc(var(--hands-scroll-aura-opacity) * .75); transform: translate(-50%, -50%) scale(.68); }
  100% { opacity: var(--hands-scroll-aura-opacity); transform: translate(-50%, -50%) scale(.82); }
}

@media (max-width: 680px) {
  :root {
    --hands-scroll-opacity: .50;
    --hands-scroll-aura-opacity: .18;
  }
  .hand-scene {
    z-index: 0 !important;
  }
}


/* =========================================================
   GrandMind Client-Ready v6 Mobile + Full-Site Video Background
   Client priority: premium mobile, visible hand entrance, hands follow scroll,
   same content kept, uploaded video used as cinematic background site-wide.
   ========================================================= */
:root {
  --mobile-safe-x: 18px;
  --header-h: 74px;
}

/* Full website cinematic background video */
.site-video-background {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background: #06040f url('../assets/videos/grandmind-site-background-poster.jpg') center / cover no-repeat;
}
.site-video-background video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .34;
  filter: saturate(1.08) contrast(1.08) brightness(.72);
  transform: scale(1.03);
}
.site-video-background::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(5,3,17,.66), rgba(5,3,17,.42) 42%, rgba(5,3,17,.82)),
    radial-gradient(circle at 50% 12%, rgba(70,217,255,.12), transparent 34rem),
    radial-gradient(circle at 84% 72%, rgba(255,61,143,.10), transparent 28rem);
}
body {
  background: #06040f;
}
body::after {
  display: none !important;
}
main, .footer, .site-header, .floating-whatsapp, .back-to-top {
  position: relative;
}
main, .footer { z-index: 2; }
.site-header { z-index: 1200; }
.neon-depth-scene { display: none !important; }

/* Re-enable premium hand entrance and scroll-following hands. */
.hand-scene {
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  height: 100dvh !important;
  z-index: 1 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  opacity: var(--hands-scroll-opacity, .68) !important;
  mix-blend-mode: screen;
}
.hand-scene::before {
  display: block !important;
  content: "";
  position: absolute;
  left: 50%;
  top: calc(34% + (var(--hands-scroll-y, 0px) * .42)) !important;
  width: min(44vw, 620px);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(.72);
  opacity: var(--hands-scroll-aura-opacity, .32) !important;
  background: radial-gradient(circle, rgba(70,217,255,.30), rgba(36,85,255,.13) 42%, transparent 68%);
  filter: blur(2px);
  animation: handAuraScrollBreathV5 4.6s ease-in-out 1.5s infinite alternate !important;
}
.collab-hand {
  display: block !important;
  width: min(56vw, 780px) !important;
  min-width: 390px !important;
  top: clamp(82px, 13vh, 132px) !important;
  opacity: 0;
  position: absolute !important;
  filter: saturate(1.12) contrast(1.05) drop-shadow(0 0 24px rgba(70,217,255,.12));
  will-change: transform, opacity;
}
.collab-hand img { width: 100%; height: auto; }
.collab-hand-left {
  left: -28vw !important;
  animation: handEntryLeftScrollV5 1.05s cubic-bezier(.12,.88,.18,1) .12s forwards,
             handScrollFloatLeftV5 5.2s ease-in-out 1.35s infinite alternate !important;
}
.collab-hand-right {
  right: -28vw !important;
  animation: handEntryRightScrollV5 1.05s cubic-bezier(.12,.88,.18,1) .12s forwards,
             handScrollFloatRightV5 5.2s ease-in-out 1.35s infinite alternate !important;
}

/* Premium readable scale: smaller headings without making the brand weak. */
h1, .hero-copy h1, .page-hero h1 {
  font-size: clamp(2.05rem, 3.7vw, 3.65rem) !important;
  line-height: 1.09 !important;
  letter-spacing: -.034em !important;
}
h2, .section-heading h2, .section-copy h2 {
  font-size: clamp(1.52rem, 2.35vw, 2.42rem) !important;
  line-height: 1.16 !important;
}
.hero-copy p, .page-hero p, .section-copy p:not(.eyebrow) {
  font-size: clamp(.94rem, 1.02vw, 1.02rem) !important;
  line-height: 1.72 !important;
}
.hero, .page-hero {
  background: transparent !important;
}
.hero-media img { opacity: .16 !important; }
.hero-overlay {
  background: linear-gradient(90deg, rgba(5,3,17,.86) 0%, rgba(8,5,28,.72) 52%, rgba(8,5,28,.55)) !important;
}

/* Desktop spacing polish */
.hero-grid { align-items: center; }
.identity-card { max-width: 420px; justify-self: end; }
.video-stage, .video-card, .identity-card, .glass-panel, .mini-service, .service-detail, .value-card {
  transform: translateZ(0);
}

/* Tablet: no cramped columns, cards breathe. */
@media (max-width: 1020px) {
  .container { width: min(100% - 32px, 860px) !important; }
  .site-header {
    width: calc(100% - 24px) !important;
    top: 10px !important;
    padding: 9px 11px !important;
  }
  .main-nav {
    top: 78px !important;
    left: 12px !important;
    right: 12px !important;
    max-height: calc(100dvh - 98px);
    overflow: auto;
    background: rgba(7,5,24,.97) !important;
    border-color: rgba(137,209,255,.18) !important;
  }
  .hero, .page-hero {
    padding: 118px 0 58px !important;
    min-height: auto !important;
  }
  .hero-grid, .page-hero-grid, .split-layout, .narrative-grid, .contact-grid, .video-showcase-grid {
    grid-template-columns: 1fr !important;
  }
  .identity-card {
    max-width: 100%;
    justify-self: stretch;
    min-height: auto !important;
  }
  .strip-grid { margin-top: 0 !important; }
  .mini-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .service-detail, .service-detail:nth-child(even), .service-video-detail {
    grid-template-columns: 1fr !important;
  }
  .service-detail:nth-child(even) img { order: 0 !important; }
  .video-stage { min-height: 380px !important; }
  .collab-hand {
    width: 74vw !important;
    min-width: 320px !important;
    top: 96px !important;
  }
  .collab-hand-left { left: -56vw !important; }
  .collab-hand-right { right: -56vw !important; }
}

/* Mobile: production-ready. No horizontal overflow, bigger touch targets, cleaner hierarchy. */
@media (max-width: 680px) {
  :root {
    --mobile-safe-x: 16px;
    --hands-scroll-opacity: .42;
    --hands-scroll-aura-opacity: .15;
  }
  html, body { width: 100%; overflow-x: hidden !important; }
  body { font-size: 14.5px !important; }
  .site-video-background video {
    opacity: .22;
    transform: scale(1.08);
  }
  .site-video-background::after {
    background:
      linear-gradient(180deg, rgba(5,3,17,.78), rgba(5,3,17,.60) 45%, rgba(5,3,17,.88)),
      radial-gradient(circle at 50% 14%, rgba(70,217,255,.11), transparent 22rem);
  }
  .container {
    width: calc(100% - 32px) !important;
  }
  .site-header {
    width: calc(100% - 18px) !important;
    top: 8px !important;
    border-radius: 22px !important;
    padding: 8px 9px !important;
  }
  .brand { min-width: 0; gap: 8px; }
  .brand img { width: 40px !important; height: 40px !important; border-radius: 12px !important; }
  .brand strong { font-size: .78rem !important; white-space: nowrap; }
  .brand small { display: none !important; }
  .header-actions { gap: 7px !important; }
  .lang-toggle { min-width: 42px; padding: 8px 9px !important; }
  .menu-toggle { width: 42px !important; height: 42px !important; border-radius: 14px !important; }
  .main-nav {
    top: 68px !important;
    left: 9px !important;
    right: 9px !important;
    border-radius: 22px !important;
    padding: 12px !important;
  }
  .main-nav a {
    padding: 13px 14px !important;
    font-size: .92rem !important;
    min-height: 46px;
    display: flex;
    align-items: center;
  }
  h1, .hero-copy h1, .page-hero h1 {
    font-size: clamp(1.72rem, 8.8vw, 2.45rem) !important;
    line-height: 1.13 !important;
    letter-spacing: -.026em !important;
    max-width: 12ch;
  }
  .center-hero h1, .page-hero h1 { max-width: 13ch; }
  h2, .section-heading h2, .section-copy h2 {
    font-size: clamp(1.34rem, 6.6vw, 1.92rem) !important;
    line-height: 1.18 !important;
  }
  h3 { font-size: 1.02rem !important; }
  p, li { font-size: .94rem !important; line-height: 1.68 !important; }
  .eyebrow { font-size: .61rem !important; letter-spacing: .18em !important; line-height: 1.4; }
  .section { padding: 56px 0 !important; }
  .hero, .page-hero {
    padding: 100px 0 44px !important;
  }
  .hero-copy, .center-hero { text-align: start; }
  .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 10px !important;
    margin-top: 18px !important;
  }
  .btn { width: 100%; min-height: 46px; padding: 12px 15px !important; }
  .identity-card {
    padding: 18px !important;
    border-radius: 24px !important;
  }
  .logo-orb { width: 116px !important; height: 116px !important; margin-bottom: 14px !important; }
  .logo-orb img { width: 76px !important; }
  .stats-row { grid-template-columns: 1fr 1fr 1fr !important; gap: 7px !important; }
  .stats-row div { padding: 11px 6px !important; border-radius: 14px !important; }
  .stats-row strong { font-size: 1rem !important; }
  .stats-row span { font-size: .62rem !important; line-height: 1.35; }
  .strip-item, .glass-panel, .statement-card, .value-card, .process-step, .sector-card, .contact-form, .contact-cards, .contact-logo-panel, .service-index, .client-badge, .cta-card {
    border-radius: 20px !important;
    padding: 18px !important;
  }
  .mini-service-grid, .process-grid, .values-grid, .large-values-grid, .cards-two, .dual-video-grid {
    grid-template-columns: 1fr !important;
  }
  .mini-service { min-height: 178px !important; border-radius: 22px !important; }
  .service-detail { padding: 12px !important; border-radius: 22px !important; gap: 14px !important; }
  .service-detail img { min-height: 185px !important; border-radius: 18px !important; }
  .service-detail div { padding: 8px 4px 6px !important; }
  .page-visual, .page-visual img { min-height: 225px !important; border-radius: 22px !important; }
  .video-stage { min-height: 310px !important; }
  .video-card { inset: 0 0 18% 0 !important; border-radius: 22px !important; }
  .video-card-small { width: 56% !important; height: 34% !important; border-radius: 18px !important; }
  .video-label { left: 12px !important; bottom: 10px !important; font-size: .68rem !important; padding: 6px 9px !important; }
  .footer-bottom { gap: 10px !important; }
  .floating-whatsapp { width: 48px !important; height: 48px !important; right: 14px !important; bottom: 14px !important; }
  .back-to-top { right: 15px !important; bottom: 74px !important; }
  html[dir="rtl"] .floating-whatsapp { left: 14px !important; right: auto !important; }
  html[dir="rtl"] .back-to-top { left: 15px !important; right: auto !important; }

  .hand-scene { z-index: 1 !important; opacity: var(--hands-scroll-opacity, .42) !important; }
  .collab-hand {
    width: 92vw !important;
    min-width: 230px !important;
    top: 82px !important;
  }
  .collab-hand-left { left: -75vw !important; }
  .collab-hand-right { right: -75vw !important; }
  .hand-scene::before { width: 84vw !important; top: calc(28% + (var(--hands-scroll-y, 0px) * .36)) !important; }
}

@media (max-width: 390px) {
  .container { width: calc(100% - 24px) !important; }
  h1, .hero-copy h1, .page-hero h1 { font-size: clamp(1.58rem, 8.6vw, 2.1rem) !important; }
  .stats-row { grid-template-columns: 1fr !important; }
  .video-stage { min-height: 280px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .site-video-background video { display: none !important; }
  .hand-scene, .collab-hand, .hand-scene::before { animation: none !important; }
}

/* =========================================================
   GrandMind Client-Ready v7 Opening Video Splash
   Client request: the uploaded video must be visible immediately when the website appears.
   Behavior: cinematic intro video overlay on first landing, then fades into the full-site video background.
   ========================================================= */
.opening-video-splash {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  background: #05030d;
  overflow: hidden;
  opacity: 1;
  visibility: visible;
  transition: opacity .65s ease, visibility .65s ease;
}
.opening-video-splash.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.opening-video-splash video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .88;
  filter: saturate(1.12) contrast(1.08) brightness(.72);
  transform: scale(1.02);
}
.opening-video-splash::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(5,3,17,.38), rgba(5,3,17,.36) 42%, rgba(5,3,17,.82)),
    radial-gradient(circle at 50% 42%, rgba(70,217,255,.14), transparent 34rem);
}
.opening-video-content {
  position: relative;
  z-index: 2;
  width: min(680px, calc(100% - 42px));
  text-align: center;
  padding: 34px 24px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 30px;
  background: rgba(5,3,17,.34);
  backdrop-filter: blur(14px);
  box-shadow: 0 28px 100px rgba(0,0,0,.45);
  animation: openingContentIn .7s ease .15s both;
}
.opening-video-content img {
  width: 82px;
  height: 82px;
  object-fit: contain;
  margin: 0 auto 16px;
  border-radius: 22px;
  filter: drop-shadow(0 0 28px rgba(70,217,255,.62));
}
.opening-video-content strong {
  display: block;
  color: #fff;
  font-size: clamp(1.35rem, 3vw, 2.35rem);
  line-height: 1.08;
  letter-spacing: -.035em;
  margin-bottom: 8px;
}
.opening-video-content span {
  display: block;
  color: rgba(247,251,255,.78);
  font-size: clamp(.9rem, 1.6vw, 1.05rem);
  line-height: 1.65;
}
.opening-skip {
  position: absolute;
  z-index: 3;
  right: 22px;
  bottom: 22px;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(5,3,17,.58);
  color: #fff;
  border-radius: 999px;
  padding: 11px 16px;
  font-weight: 850;
  cursor: pointer;
  backdrop-filter: blur(14px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease;
}
.opening-skip:hover {
  transform: translateY(-2px);
  border-color: rgba(70,217,255,.55);
  background: rgba(70,217,255,.14);
}
html[dir="rtl"] .opening-skip { left: 22px; right: auto; }
body.is-intro-playing { overflow: hidden; }
body.is-intro-playing .site-header,
body.is-intro-playing main,
body.is-intro-playing .footer,
body.is-intro-playing .floating-whatsapp,
body.is-intro-playing .back-to-top {
  filter: blur(1.5px);
}
@keyframes openingContentIn {
  from { opacity: 0; transform: translateY(18px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 680px) {
  .opening-video-splash video {
    opacity: .82;
    transform: scale(1.08);
  }
  .opening-video-content {
    width: calc(100% - 30px);
    padding: 24px 18px;
    border-radius: 24px;
  }
  .opening-video-content img {
    width: 64px;
    height: 64px;
    border-radius: 18px;
  }
  .opening-skip {
    right: 15px;
    bottom: 15px;
    padding: 10px 13px;
    font-size: .86rem;
  }
  html[dir="rtl"] .opening-skip { left: 15px; right: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .opening-video-splash { display: none !important; }
  body.is-intro-playing { overflow: auto; }
}


/* =========================================================
   GrandMind Client-Ready V8 Final Direction
   1) Home starts with the uploaded video as the hero visual, then text appears.
   2) Same video remains as the cinematic background across all pages.
   3) Hands do NOT appear immediately on page load; they start near the end of
      the first section and continue downward with scrolling.
   ========================================================= */

/* Home hero: video first, content second */
.hero-video-media,
.hero-media {
  background: #05030d url('../assets/videos/grandmind-site-background-poster.jpg') center / cover no-repeat;
}
.hero-media img { display: none !important; }
.hero-background-video,
.hero-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .94;
  filter: saturate(1.12) contrast(1.08) brightness(.70);
  transform: scale(1.02);
}
.hero-home .hero-overlay {
  background:
    linear-gradient(180deg, rgba(5,3,17,.18) 0%, rgba(5,3,17,.46) 52%, rgba(5,3,17,.88) 100%),
    linear-gradient(90deg, rgba(5,3,17,.84) 0%, rgba(8,5,28,.58) 48%, rgba(8,5,28,.34) 100%) !important;
}
.hero-home .hero-copy,
.hero-home .identity-card {
  opacity: 0;
  animation: contentAfterVideoV8 .82s ease-out .9s forwards;
}
.hero-home .identity-card { animation-delay: 1.12s; }
@keyframes contentAfterVideoV8 {
  from { opacity: 0; transform: translateY(18px); filter: blur(5px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

/* Remove the old full-screen intro overlay; the video is now part of the home hero. */
.opening-video-splash { display: none !important; }
body.is-intro-playing { overflow: auto !important; }
body.is-intro-playing .site-header,
body.is-intro-playing main,
body.is-intro-playing .footer,
body.is-intro-playing .floating-whatsapp,
body.is-intro-playing .back-to-top { filter: none !important; }

/* Site-wide video background remains active behind every page/content area. */
.site-video-background video {
  opacity: .32 !important;
  filter: saturate(1.1) contrast(1.08) brightness(.62) !important;
}
.site-video-background::after {
  background:
    linear-gradient(180deg, rgba(5,3,17,.76), rgba(5,3,17,.52) 42%, rgba(5,3,17,.88)),
    radial-gradient(circle at 50% 12%, rgba(70,217,255,.13), transparent 34rem),
    radial-gradient(circle at 86% 76%, rgba(255,61,143,.10), transparent 30rem) !important;
}
.section,
.page-hero,
.footer {
  background-color: transparent !important;
}

/* V8 hands: hidden at the top, revealed from the bottom/end of the first section. */
:root {
  --hands-scroll-y: 0px;
  --hands-scroll-opacity: 0;
  --hands-scroll-aura-opacity: 0;
}
body:not(.hands-follow-active) .hand-scene,
body:not(.hands-follow-active) .collab-hand,
body:not(.hands-follow-active) .hand-scene::before {
  opacity: 0 !important;
  visibility: hidden !important;
}
body.hands-follow-active .hand-scene {
  visibility: visible !important;
  opacity: var(--hands-scroll-opacity, .66) !important;
}
.hand-scene {
  position: fixed !important;
  inset: 0 !important;
  height: 100dvh !important;
  z-index: 1 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  mix-blend-mode: screen;
}
.hand-scene::before {
  left: 50% !important;
  top: calc(70vh + (var(--hands-scroll-y, 0px) * .20)) !important;
  width: min(44vw, 600px) !important;
  opacity: var(--hands-scroll-aura-opacity, .26) !important;
  transform: translate(-50%, -50%) scale(.72) !important;
  background: radial-gradient(circle, rgba(70,217,255,.30), rgba(132,83,255,.18) 42%, transparent 70%) !important;
  filter: blur(8px) !important;
}
.collab-hand {
  display: block !important;
  position: absolute !important;
  top: calc(58vh + var(--hands-scroll-y, 0px)) !important;
  width: min(54vw, 760px) !important;
  min-width: 360px !important;
  opacity: .62 !important;
  mix-blend-mode: screen;
  filter: saturate(1.12) contrast(1.06) drop-shadow(0 0 30px rgba(70,217,255,.18)) !important;
  will-change: transform, opacity;
}
.collab-hand img { width: 100%; height: auto; display: block; }
.collab-hand-right img { transform: scaleX(-1); }
body.hands-follow-active .collab-hand-left {
  left: -31vw !important;
  animation: handsSectionInLeftV8 .95s cubic-bezier(.12,.88,.18,1) forwards,
             handsSectionFloatLeftV8 5.4s ease-in-out 1s infinite alternate !important;
}
body.hands-follow-active .collab-hand-right {
  right: -31vw !important;
  animation: handsSectionInRightV8 .95s cubic-bezier(.12,.88,.18,1) forwards,
             handsSectionFloatRightV8 5.4s ease-in-out 1s infinite alternate !important;
}
@keyframes handsSectionInLeftV8 {
  from { opacity: 0; transform: translate3d(-55%, 18px, 0) rotate(4deg) scale(.94); filter: blur(3px); }
  to   { opacity: .66; transform: translate3d(10vw, 0, 0) rotate(0deg) scale(.96); filter: blur(0); }
}
@keyframes handsSectionInRightV8 {
  from { opacity: 0; transform: translate3d(55%, 18px, 0) rotate(-4deg) scale(.94); filter: blur(3px); }
  to   { opacity: .66; transform: translate3d(-10vw, 0, 0) rotate(0deg) scale(.96); filter: blur(0); }
}
@keyframes handsSectionFloatLeftV8 {
  from { transform: translate3d(10vw, 0, 0) rotate(0deg) scale(.96); opacity: .54; }
  to   { transform: translate3d(11vw, -10px, 0) rotate(-.8deg) scale(.985); opacity: .70; }
}
@keyframes handsSectionFloatRightV8 {
  from { transform: translate3d(-10vw, 0, 0) rotate(0deg) scale(.96); opacity: .54; }
  to   { transform: translate3d(-11vw, -10px, 0) rotate(.8deg) scale(.985); opacity: .70; }
}

/* Keep content above video and hands. */
main, .footer { z-index: 3 !important; }
.hero > .container,
.page-hero > .container,
.section > .container { position: relative; z-index: 4 !important; }

/* Mobile final polish: readable video, no cramped text, hands delayed and lighter. */
@media (max-width: 680px) {
  .hero-home { min-height: 100svh !important; padding: 102px 0 48px !important; }
  .hero-background-video,
  .hero-media video { opacity: .88; transform: scale(1.09); }
  .hero-home .hero-overlay {
    background:
      linear-gradient(180deg, rgba(5,3,17,.28), rgba(5,3,17,.62) 52%, rgba(5,3,17,.92)),
      linear-gradient(90deg, rgba(5,3,17,.82), rgba(5,3,17,.62)) !important;
  }
  .hero-copy h1,
  h1 { max-width: 13ch; }
  .hero-copy p { max-width: 34ch; }
  .site-video-background video { opacity: .22 !important; transform: scale(1.12); }
  .site-video-background::after {
    background:
      linear-gradient(180deg, rgba(5,3,17,.82), rgba(5,3,17,.64) 48%, rgba(5,3,17,.90)),
      radial-gradient(circle at 50% 14%, rgba(70,217,255,.11), transparent 22rem) !important;
  }
  .collab-hand {
    top: calc(68vh + var(--hands-scroll-y, 0px)) !important;
    width: 92vw !important;
    min-width: 240px !important;
    opacity: .34 !important;
  }
  body.hands-follow-active .collab-hand-left { left: -76vw !important; }
  body.hands-follow-active .collab-hand-right { right: -76vw !important; }
  .hand-scene::before {
    top: calc(74vh + (var(--hands-scroll-y, 0px) * .16)) !important;
    width: 82vw !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-home .hero-copy,
  .hero-home .identity-card { opacity: 1 !important; animation: none !important; }
  .collab-hand-left,
  .collab-hand-right { animation: none !important; }
}