<?php $__env->startSection('title', 'About Us | Data Intellec'); ?>

<?php $__env->startSection('description', 'Data Intellec builds BI, AI-over-BI, AI agents, and decision-support systems around the business decisions teams actually need to make.'); ?>

<?php $__env->startPush('styles'); ?>
<link rel="stylesheet" href="/src/stylesheet/about.css" />
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
  <?php
    $principles = [
        [
            'title' => 'Start from the decision',
            'text' => 'We do not begin with a dashboard template. We begin with the operating decision that needs to get faster, clearer, or more consistent.',
        ],
        [
            'title' => 'Make data usable, not just available',
            'text' => 'The goal is not more reporting. The goal is a business signal that leaders, operators, and teams can act on without interpretation debt.',
        ],
        [
            'title' => 'Connect BI and AI in one layer',
            'text' => 'Real-time visibility, explained movement, recommendations, and workflow automation should work together instead of living in separate tools.',
        ],
    ];

    $workflow = [
        [
            'step' => '01',
            'title' => 'Find the blocked decision',
            'text' => 'We map the moment where a team is still waiting on numbers, context, or approval.',
        ],
        [
            'step' => '02',
            'title' => 'Unify the signal',
            'text' => 'We connect operational, commercial, and finance views into a single reporting layer that can be trusted.',
        ],
        [
            'step' => '03',
            'title' => 'Add the intelligence layer',
            'text' => 'Where needed, we layer AI for summaries, forecasting, anomaly detection, recommendations, and conversational access.',
        ],
        [
            'step' => '04',
            'title' => 'Shape the handoff',
            'text' => 'The final build has to fit the team using it, whether that is an exec view, an operator dashboard, or an embedded partner delivery.',
        ],
    ];

    $focusPanels = [
        [
            'title' => 'Real-time BI',
            'text' => 'Operational visibility for teams where delay gets expensive fast.',
            'image' => '/images/feature/1.webp',
            'position' => '50% 78%',
        ],
        [
            'title' => 'AI over BI',
            'text' => 'Context, explanation, and next-step guidance layered on top of reporting.',
            'image' => '/images/feature/2.webp',
            'position' => '80% 26%',
        ],
        [
            'title' => 'AI Agents',
            'text' => 'Alerts, checks, and routine follow-through built into the workflow itself.',
            'image' => '/images/feature/3.webp',
            'position' => '80% 26%',
        ],
        [
            'title' => 'White-label delivery',
            'text' => 'Partner-ready BI and AI systems shipped cleanly under your own brand.',
            'image' => '/images/feature/4.webp',
            'position' => '80% 26%',
        ],
        [
            'title' => 'Insight 360X',
            'text' => 'A productized analytics layer for Shopify and growth-focused commercial teams.',
            'image' => '/images/feature/5.webp',
            'position' => '50% 50%',
        ],
    ];

    $impactBand = [
        [
            'title' => 'Live visibility',
            'text' => 'See what changed while it still matters.',
        ],
        [
            'title' => 'Faster interpretation',
            'text' => 'Understand the movement, not just the chart.',
        ],
        [
            'title' => 'Workflow support',
            'text' => 'Act inside the flow, not after the fact.',
        ],
        [
            'title' => 'Partner-ready delivery',
            'text' => 'Built for internal teams or white-label rollout.',
        ],
    ];

    $offerings = [
        'BI transformation',
        'Data platform modernization',
        'AI strategy and implementation',
        'AI agent development',
        'Managed analytics services',
        'Decision-support product builds',
    ];

    $useCases = [
        'Manufacturing command centers',
        'FMCG sales intelligence hubs',
        'NBFC executive risk dashboards',
        'Executive AI copilots',
        'Demand forecasting engines',
        'Enterprise knowledge assistants',
    ];
  ?>

  <section class="about-hero">
    <div class="absolute inset-0 z-1 bg-gradient-to-r from-(--accent-2) via-(--accent-2) to-(--accent-2)/0 scale-200 rotate-[25deg]"></div>
    <div class="site_shell px-5 md:px-12 lg:px-16">
      <div class="about-hero-copy" data-reveal>
        <div class="about-hero-frame">
          <h1 class="about-hero-title">
            We turn signal into
            <span class="about-hero-title__rotate-wrap" data-hero-rotate-wrap>
              <span class="about-hero-title__rotate-sizer" data-hero-rotate-sizer aria-hidden="true">action.</span>
              <span
                class="about-hero-title__rotate"
                data-hero-rotate
                data-hero-rotate-words="action.,decisions.,outcomes.,clarity."
                aria-live="polite"
              ></span>
            </span>
          </h1>

          <p class="about-hero-lede">
            From real-time BI to AI-over-BI and agent-led workflows,
            we help teams see what changed, understand what it means,
            and act while the moment still matters.
          </p>

          <div class="about-hero-actions">
            <a href="/contact" class="about-hero-cta about-hero-cta--primary">
              Talk to us
              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                <path d="M5 12h14" />
                <path d="m12 5 7 7-7 7" />
              </svg>
            </a>

            <a href="/solutions" class="about-hero-cta about-hero-cta--secondary">
              Explore solutions
            </a>
          </div>
        </div>
      </div>
    </div>
  </section>

  <section class="about-flow-section bg-white py-16 lg:py-20" data-about-flow>
    <div class="site_shell px-5 md:px-12 lg:px-16">
      <div class="about-flow-head" data-reveal>
        <h2 class="about-flow-title" data-title="We turn scattered business signals into clearer action.">
          We turn scattered business signals into clearer action.
        </h2>

        <p class="about-flow-lede">
          We build with teams that need better visibility, faster
          interpretation, and sharper follow-through around the decisions
          that actually move the business.
        </p>
      </div>

      <div class="about-flow-grid" data-about-flow-grid>
        <div class="about-flow-card about-flow-card--turn" data-about-flow-card>
          <div aria-hidden="true" class="about-flow-card__scrim"></div>
          <span class="about-flow-card__label">We Turn</span>
        </div>

        <div class="about-flow-card about-flow-card--signal" data-about-flow-card>
          <div aria-hidden="true" class="about-flow-card__scrim"></div>
          <span class="about-flow-card__label">Signal</span>
        </div>

        <div class="about-flow-card about-flow-card--arrow" data-about-flow-card>
          <svg class="h-20 w-20 text-(--accent-2) sm:h-24 sm:w-24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
            <path d="M5 12h14" />
            <path d="m12 5 7 7-7 7" />
          </svg>
        </div>

        <div class="about-flow-card about-flow-card--action" data-about-flow-card>
          <div aria-hidden="true" class="about-flow-card__scrim"></div>
          <span class="about-flow-card__label">Action</span>
        </div>
      </div>
    </div>
  </section>

  <section class="about-impact-band" data-about-parallax>
    <div class="about-impact-band__media" data-about-parallax-media aria-hidden="true"></div>
    <div class="about-impact-band__veil" aria-hidden="true"></div>

    <div class="site_shell relative z-10 px-5 md:px-12 lg:px-16">
      <div class="about-impact-band__frame" data-about-parallax-frame>
        <div class="about-impact-band__intro">
          <h2 class="about-impact-band__title">
            Clearer decisions.<br />
            Less reporting drag.
          </h2>
          <p class="about-impact-band__lede">
            Live visibility, faster interpretation, and sharper follow-through
            for the moments that actually move the business.
          </p>
        </div>

        <div class="about-impact-band__grid">
          <?php $__currentLoopData = $impactBand; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <article class="about-impact-band__item" data-about-parallax-card>
              <h3 class="about-impact-band__card-title"><?php echo e($item['title']); ?></h3>
              <p class="about-impact-band__card-text"><?php echo e($item['text']); ?></p>
            </article>
          <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
        </div>
      </div>
    </div>
  </section>

  <section class="bg-white py-24 lg:py-28">
    <div class="site_shell px-5 md:px-8 lg:px-5">
      <div class="grid gap-6 lg:grid-cols-3">
        <?php $__currentLoopData = $principles; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $principle): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
          <article
            class="rounded-[24px] border border-[#e5ebf1] bg-[#f9fbfc] p-8 shadow-[0_18px_50px_rgba(15,45,73,0.05)]"
            data-reveal
          >
            <p class="text-[11px] font-semibold uppercase tracking-[0.16em] text-(--accent-5)">
              Principle
            </p>
            <h2 class="mt-4 text-2xl font-semibold leading-tight tracking-[-0.02em] text-(--accent-2)">
              <?php echo e($principle['title']); ?>

            </h2>
            <p class="mt-4 text-[15px] leading-relaxed text-(--accent-2)/68">
              <?php echo e($principle['text']); ?>

            </p>
          </article>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
      </div>
    </div>
  </section>

  <section class="bg-[#f4f8fb] py-24 lg:py-28">
    <div class="site_shell px-5 md:px-12 lg:px-16">
      <div class="grid gap-14 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:items-start">
        <div data-reveal>
          <p class="text-[11px] font-semibold uppercase tracking-[0.18em] text-(--accent-5)">
            How we work
          </p>
          <h2 class="mt-4 max-w-[14ch] text-[clamp(2rem,3.6vw,3.2rem)] font-semibold leading-[1.06] tracking-[-0.03em] text-(--accent-2)">
            A build process shaped around the operating moment.
          </h2>
          <p class="mt-5 max-w-[46ch] text-[15px] leading-relaxed text-(--accent-2)/70">
            Our work tends to span reporting, data foundations, AI logic,
            and interface design. What keeps it coherent is that every
            system is anchored to a real business moment someone has to act on.
          </p>
        </div>

        <div class="grid gap-5" data-reveal>
          <?php $__currentLoopData = $workflow; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <article class="rounded-[24px] border border-[#dbe4ec] bg-white p-6 shadow-[0_16px_40px_rgba(15,45,73,0.05)]">
              <div class="flex items-start gap-5">
                <div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-[#f2ead3] text-sm font-semibold text-(--accent-2)">
                  <?php echo e($item['step']); ?>

                </div>
                <div>
                  <h3 class="text-xl font-semibold leading-tight text-(--accent-2)">
                    <?php echo e($item['title']); ?>

                  </h3>
                  <p class="mt-3 text-[15px] leading-relaxed text-(--accent-2)/68">
                    <?php echo e($item['text']); ?>

                  </p>
                </div>
              </div>
            </article>
          <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
        </div>
      </div>
    </div>
  </section>

  <section class="bg-white py-24 lg:py-28">
    <div class="site_shell px-5 md:px-8 lg:px-5">
      <div data-reveal>
        <p class="text-[11px] font-semibold uppercase tracking-[0.18em] text-(--accent-5)">
          Where we focus
        </p>
        <h2 class="mt-4 max-w-[14ch] text-[clamp(2rem,3.8vw,3.1rem)] font-semibold leading-[1.06] tracking-[-0.03em] text-(--accent-2)">
          The operating layers where we do our best work.
        </h2>
        <p class="mt-5 max-w-[58ch] text-[15px] leading-relaxed text-(--accent-2)/70">
          Some teams need cleaner reporting. Others need interpretation, workflow support,
          or partner-ready delivery. These are the layers where our work compounds fastest.
        </p>
      </div>

      <div class="about-focus-panels mt-10 lg:mt-12" data-about-focus-panels data-reveal>
        <?php $__currentLoopData = $focusPanels; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $panel): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
          <article
            class="about-focus-panel"
            data-about-focus-panel
            data-active="false"
            style="--panel-image: url('<?php echo e($panel['image']); ?>'); --panel-position: <?php echo e($panel['position']); ?>;"
          >
            <button
              type="button"
              class="about-focus-panel__button"
              aria-pressed="false"
            >
              <span class="about-focus-panel__badge" aria-hidden="true">
                <svg class="about-focus-panel__badge-icon about-focus-panel__badge-icon--plus" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round">
                  <path d="M12 5v14" />
                  <path d="M5 12h14" />
                </svg>
                <svg class="about-focus-panel__badge-icon about-focus-panel__badge-icon--arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round">
                  <path d="M5 12h14" />
                  <path d="m12 5 7 7-7 7" />
                </svg>
              </span>

              <span class="about-focus-panel__body">
                <span class="about-focus-panel__title"><?php echo e($panel['title']); ?></span>
                <span class="about-focus-panel__text"><?php echo e($panel['text']); ?></span>
              </span>
            </button>
          </article>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
      </div>

      <div class="mt-10 grid gap-6 lg:mt-12 lg:grid-cols-2">
          <article class="rounded-[28px] border border-[#e1e8ef] bg-(--accent-2) p-8 text-white" data-reveal>
            <p class="text-[11px] font-semibold uppercase tracking-[0.16em] text-(--accent-1)">
              Capability stack
            </p>
            <ul class="mt-6 grid gap-3 text-[15px] leading-relaxed text-white/72">
              <?php $__currentLoopData = $offerings; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $offering): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <li class="flex items-start gap-3">
                  <span class="mt-[8px] h-1.5 w-1.5 rounded-full bg-(--accent-1)"></span>
                  <span><?php echo e($offering); ?></span>
                </li>
              <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </ul>
          </article>

          <article class="rounded-[28px] border border-[#e5ebf1] bg-[#fffaf0] p-8" data-reveal>
            <p class="text-[11px] font-semibold uppercase tracking-[0.16em] text-(--accent-5)">
              Typical use cases
            </p>
            <div class="mt-5 flex flex-wrap gap-3">
              <?php $__currentLoopData = $useCases; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $useCase): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <span class="rounded-full border border-[#d9cfae] bg-white px-4 py-2 text-sm font-medium text-(--accent-2)">
                  <?php echo e($useCase); ?>

                </span>
              <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
          </article>
      </div>
    </div>
  </section>

  <section class="bg-[#f4f8fb] py-24 lg:py-28">
    <div class="site_shell px-5 md:px-12 lg:px-16">
      <div class="overflow-hidden rounded-[30px] border border-[#d6e0e8] bg-white shadow-[0_22px_70px_rgba(15,45,73,0.08)]">
        <div class="grid gap-0 lg:grid-cols-[minmax(0,1.1fr)_minmax(0,0.9fr)]">
          <div class="p-8 sm:p-10 lg:p-12" data-reveal>
            <p class="text-[11px] font-semibold uppercase tracking-[0.18em] text-(--accent-5)">
              The point of the company
            </p>
            <h2 class="mt-4 max-w-[15ch] text-[clamp(2rem,3.8vw,3.1rem)] font-semibold leading-[1.04] tracking-[-0.03em] text-(--accent-2)">
              Turn delayed reporting into decision-ready operating systems.
            </h2>
            <p class="mt-5 max-w-[56ch] text-[15px] leading-relaxed text-(--accent-2)/70">
              A lot of organizations already have dashboards, data teams,
              and reporting routines. What they still lack is a clean path
              from signal to action. That is the gap we are built to close.
            </p>
            <div class="mt-8 flex flex-wrap gap-4">
              <a
                href="/contact"
                class="inline-flex items-center gap-2 rounded-[14px] bg-(--accent-2) px-5 py-3 text-sm font-semibold text-white transition-transform duration-300 hover:-translate-y-0.5"
              >
                Talk to us
                <svg class="h-4 w-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                  <path d="M5 12h14" />
                  <path d="m12 5 7 7-7 7" />
                </svg>
              </a>

              <a
                href="/solutions"
                class="inline-flex items-center gap-2 rounded-[14px] border border-[#d8e0e7] px-5 py-3 text-sm font-semibold text-(--accent-2) transition-colors duration-200 hover:border-(--accent-1) hover:text-(--accent-1)"
              >
                Explore solutions
              </a>
            </div>
          </div>

          <div class="relative isolate overflow-hidden bg-(--accent-2) p-8 sm:p-10 lg:p-12" data-reveal>
            <div
              aria-hidden="true"
              class="pointer-events-none absolute inset-0 -z-10 bg-[radial-gradient(circle_at_top_left,rgba(255,255,255,0.08),transparent_34%)]"
            ></div>
            <p class="text-[11px] font-semibold uppercase tracking-[0.16em] text-(--accent-1)">
              Products and builds
            </p>
            <div class="mt-6 space-y-5">
              <article class="rounded-[22px] border border-white/10 bg-white/6 p-5">
                <h3 class="text-xl font-semibold text-white">Insight 360X</h3>
                <p class="mt-2 text-sm leading-relaxed text-white/68">
                  Plug-and-play reporting for e-commerce, retail, D2C, and growth-focused teams that need one live commercial view.
                </p>
              </article>

              <article class="rounded-[22px] border border-white/10 bg-white/6 p-5">
                <h3 class="text-xl font-semibold text-white">Decision-support builds</h3>
                <p class="mt-2 text-sm leading-relaxed text-white/68">
                  Executive decision intelligence, KPI monitoring, recommendations, and conversational access shaped around leadership workflows.
                </p>
              </article>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script src="/src/scripts/about-hero.js"></script>
<script src="/src/scripts/about-hero-rotate.js"></script>
<script src="/src/scripts/about-flow.js"></script>
<script src="/src/scripts/about-focus-panels.js"></script>
<script src="/src/scripts/about-parallax.js"></script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH D:\OneDrive\Sandeep\data-intellec\resources\views/about.blade.php ENDPATH**/ ?>