<?php
// Ensure session is properly started for both PHP 7.4 and 8.x
if (session_status() === PHP_SESSION_NONE) {
    // Use basic session settings that work in both PHP 7.4 and 8.x
    // Skip advanced options that might cause compatibility issues
    session_start();
}
header("X-Robots-Tag: noindex, nofollow, noarchive", true);

$contact_success = false;
$contact_error = null; // validation / user-facing errors
$contact_internal_note = null; // only shown after success if logging failed

// Configure webhook URL - can be set via environment or directly here
// In PHP 7.4, constants can't use expressions like ternary operators
$discord_webhook_env = getenv('DISCORD_WEBHOOK');
define('DISCORD_WEBHOOK', $discord_webhook_env ? $discord_webhook_env : "WEBHOOK GOES HERE");

/* --- Safe multibyte fallbacks --- */
function cc_strlen(string $s): int
{
    return function_exists("mb_strlen") ? mb_strlen($s, "UTF-8") : strlen($s);
}
function cc_substr(string $s, int $start, ?int $len = null): string
{
    if (function_exists("mb_substr")) {
        return $len === null
            ? mb_substr($s, $start, mb_strlen($s, "UTF-8"), "UTF-8")
            : mb_substr($s, $start, $len, "UTF-8");
    }
    return $len === null ? substr($s, $start) : substr($s, $start, $len);
}

/* --- Sanitizer --- */
function cc_safe_text(string $text): string
{
    $text = str_replace(["\r\n", "\r"], "\n", $text);
    $text = str_replace(
        ["@everyone", "@here"],
        ["(everyone)", "(here)"],
        $text,
    );
    $text = preg_replace("/[`]/u", "´", $text);
    $text = preg_replace("/[\x{200B}-\x{200D}\x{FEFF}]/u", "", $text);
    $text = preg_replace("/@([A-Za-z0-9_]{1,32})/", '(at)$1', $text);
    return trim($text);
}

/* --- JSON encode with optional mbstring --- */
function cc_json_encode(array $data): string
{
    // First attempt: standard JSON encode
    $json = json_encode($data, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE);
    if ($json !== false) {
        return $json;
    }

    // JSON encoding failed - create a deep copy to avoid reference issues in PHP 7.4
    $data_copy = unserialize(serialize($data));

    // Process strings for potential encoding issues
    $process_strings = function(&$v) {
        if (!is_string($v)) {
            return;
        }

        // Check and fix encoding issues
        if (
            function_exists("mb_detect_encoding") &&
            function_exists("mb_convert_encoding") &&
            !mb_detect_encoding($v, "UTF-8", true)
        ) {
            $converted = @mb_convert_encoding($v, "UTF-8", "UTF-8");
            if ($converted !== false) {
                $v = $converted;
            }
        }
    };

    array_walk_recursive($data_copy, $process_strings);

    // Second attempt with sanitized data
    $json = json_encode($data_copy, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE);
    return $json === false ? '{"error":"encoding_failed"}' : $json;
}

/* --- Discord sender --- */
function cc_send_discord_contact(
    string $name,
    string $email,
    string $message
): array {
    $webhook_url = DISCORD_WEBHOOK;
    if (!$webhook_url) {
        return [
            "ok" => false,
            "error" => "Webhook not configured",
            "detail" => null,
        ];
    }

    $nameSafe = cc_safe_text($name);
    $emailSafe = cc_safe_text($email);
    $raw = trim($message);
    $rawLen = cc_strlen($raw);
    $maxDesc = 4096;
    if ($rawLen > $maxDesc) {
        $raw = cc_substr($raw, 0, $maxDesc - 25) . "\n\n[... truncated ...]";
    }
    $desc = ">>> " . cc_safe_text($raw);

    // Get client IP address - compatible with both PHP 7.4 and 8.x
    if (!empty($_SERVER["HTTP_CF_CONNECTING_IP"])) {
        $ip = $_SERVER["HTTP_CF_CONNECTING_IP"];
    } elseif (!empty($_SERVER["HTTP_X_FORWARDED_FOR"])) {
        $ip = $_SERVER["HTTP_X_FORWARDED_FOR"];
    } elseif (!empty($_SERVER["REMOTE_ADDR"])) {
        $ip = $_SERVER["REMOTE_ADDR"];
    } else {
        $ip = "Unknown";
    }

    if (strpos($ip, ",") !== false) {
        $ip = trim(explode(",", $ip)[0]);
    }

    // Get user agent
    $ua = cc_substr(
        cc_safe_text(!empty($_SERVER["HTTP_USER_AGENT"]) ? $_SERVER["HTTP_USER_AGENT"] : "Unknown"),
        0,
        900,
    );

    // Determine protocol - compatible with both PHP 7.4 and 8.x
    $scheme = (!empty($_SERVER["HTTPS"]) && $_SERVER["HTTPS"] !== "off") ? "https://" : "http://";
    $host = !empty($_SERVER["HTTP_HOST"]) ? $_SERVER["HTTP_HOST"] : "localhost";
    $uri = strtok(!empty($_SERVER["REQUEST_URI"]) ? $_SERVER["REQUEST_URI"] : "/", "?");
    $url = $scheme . $host . $uri;

    // Build simple plain text payload for Discord (no embed)
    $baseContent =
        "**New Contact Submission**\n" .
        "Name: {$nameSafe}\n" .
        "Email: {$emailSafe}\n" .
        "URL: {$url}\n" .
        "Message:\n";

    $room = 2000 - strlen($baseContent);
    if ($room < 0) {
        $room = 0;
    }
    if (strlen($raw) > $room) {
        $rawDisplay = substr($raw, 0, max(0, $room - 15)) . "\n[...truncated]";
    } else {
        $rawDisplay = $raw;
    }

    $payload = [
        "content" => $baseContent . $rawDisplay,
        "allowed_mentions" => ["parse" => []],
    ];

    $json = cc_json_encode($payload);
    $status = null;
    $detail = null;

    if (function_exists("curl_init")) {
        $ch = @curl_init($webhook_url);
        if (!$ch) {
            $detail = "Cannot init cURL";
        } else {
            curl_setopt_array($ch, [
                CURLOPT_POST => true,
                CURLOPT_HTTPHEADER => ["Content-Type: application/json"],
                CURLOPT_POSTFIELDS => $json,
                CURLOPT_RETURNTRANSFER => true,
                CURLOPT_TIMEOUT => 8,
            ]);
            $resp = curl_exec($ch);
            $status = curl_getinfo($ch, CURLINFO_HTTP_CODE);
            if ($resp === false) {
                $detail = "cURL: " . curl_error($ch);
            } elseif ($status < 200 || $status >= 300) {
                $detail = "HTTP $status: $resp";
            }
            curl_close($ch);
        }
    } else {
        $ctx = stream_context_create([
            "http" => [
                "method" => "POST",
                "header" => "Content-Type: application/json\r\n",
                "content" => $json,
                "timeout" => 8,
            ],
        ]);
        // Error handling improved for PHP 7.4 compatibility
        $resp = @file_get_contents($webhook_url, false, $ctx);
        $status = null;

        // Parse response headers safely
        if (!empty($http_response_header) && is_array($http_response_header)) {
            foreach ($http_response_header as $h) {
                if (!is_string($h)) continue;

                if (preg_match("#HTTP/\\S+\\s+(\\d{3})#", $h, $m)) {
                    $status = (int) $m[1];
                    break;
                }
            }
        }

        if ($resp === false || ($status !== null && ($status < 200 || $status >= 300))) {
            $detail = "Stream send failed (HTTP " . ($status !== null ? $status : "??") . ")";
        }
    }

    if ($detail) {
        error_log("[DiscordWebhook] " . $detail);
        return [
            "ok" => false,
            "error" => "Discord send failed",
            "detail" => $detail,
        ];
    }
    return ["ok" => true, "error" => null, "detail" => null];
}

/* --- Handle POST --- */
if (
    $_SERVER["REQUEST_METHOD"] === "POST" &&
    isset($_POST["contact_token"]) &&
    empty($_POST["website"])
) {
    // Form processing compatible with both PHP 7.4 and 8.x
    $name = trim(!empty($_POST["name"]) ? $_POST["name"] : "");
    $email = trim(!empty($_POST["email"]) ? $_POST["email"] : "");
    $message = trim(!empty($_POST["message"]) ? $_POST["message"] : "");

    if (
        $name !== "" &&
        filter_var($email, FILTER_VALIDATE_EMAIL) &&
        $message !== ""
    ) {
        $contact_success = true;
        cc_send_discord_contact($name, $email, $message);
    } else {
        $contact_error = "Please provide a valid name, email, and message.";
    }
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Clay Consulting - Driving Innovation, Delivering Value.</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="description" content="Clay Consulting delivers strategic advisory, digital transformation, cloud integration and data-driven enterprise solutions.">
<meta name="robots" content="noindex, nofollow, noarchive">
<style>
:root {
  --primary:#1c4f8a;
  --primary-accent:#2f6fbf;
  --primary-rgb:28,79,138;
  --bg:#f7f9fc;
  --bg-alt:#ffffff;
  --text:#22303e;
  --muted:#5e6b78;
  --border:#d6dde5;
  --radius:10px;
  --gradient:linear-gradient(135deg, rgba(var(--primary-rgb),0.95) 0%, #193d66 100%);
  font-family: "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing:border-box; }
body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

a { color:var(--primary-accent); text-decoration:none; }
a:hover { text-decoration:underline; }

header {
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,0.86);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
}

.navbar {
  max-width:1200px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.75rem 1.25rem;
  gap:1rem;
}

.brand {
  font-size:1.1rem;
  font-weight:600;
  letter-spacing:.5px;
  display:flex;
  align-items:center;
  gap:.5rem;
}

.brand span.logo {
  width:36px; height:36px;
  background:var(--gradient);
  color:#fff; display:flex;
  align-items:center; justify-content:center;
  font-weight:700; font-size:.85rem;
  border-radius:50%;
  box-shadow:0 4px 8px -2px rgba(var(--primary-rgb),0.45);
}

nav ul {
  list-style:none;
  padding:0; margin:0;
  display:flex; gap:1.25rem;
  font-size:.9rem;
  font-weight:500;
}

nav a {
  padding:.55rem .85rem;
  border-radius:30px;
  position:relative;
  transition:.25s background, .25s color;
}

nav a:hover,
nav a:focus {
  background:var(--primary);
  color:#fff;
  text-decoration:none;
}

#mobileToggle {
  display:none;
  background:none;
  border:1px solid var(--border);
  border-radius:8px;
  padding:.5rem .65rem;
  font:inherit;
  cursor:pointer;
  color:var(--primary);
  background:#fff;
}

@media (max-width: 880px) {
  nav { position:absolute; top:100%; left:0; right:0; background:#fff; border-bottom:1px solid var(--border); display:none; }
  nav.open { display:block; animation:fadeSlide .35s ease; }
  nav ul { flex-direction:column; padding:0.75rem 1rem; }
  nav a { width:100%; }
  #mobileToggle { display:inline-flex; align-items:center; }
}

@keyframes fadeSlide {
  from { opacity:0; transform:translateY(-8px); }
  to { opacity:1; transform:translateY(0); }
}

/* Hero */
.hero {
  background:var(--gradient), url("https://images.unsplash.com/photo-1520607162513-77705c0f0d4a?auto=format&fit=crop&w=1400&q=60") center/cover;
  color:#fff;
  padding:clamp(3rem, 10vh, 7rem) 1.25rem;
  text-align:center;
  position:relative;
  isolation:isolate;
}

.hero::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,.55) 100%);
  z-index:-1;
}

.hero-inner {
  max-width:950px;
  margin:0 auto;
}

.hero h1 {
  font-size:clamp(2rem, 4vw + 1rem, 3.25rem);
  margin:0 0 1rem;
  line-height:1.1;
  letter-spacing:1px;
}

.hero p.tagline {
  font-size:clamp(1.05rem, 1.1rem + .5vw, 1.5rem);
  margin:0 0 1.75rem;
  font-weight:300;
  color:#e4eef7;
}

.hero .cta-group {
  display:flex;
  flex-wrap:wrap;
  gap:.9rem;
  justify-content:center;
}

.btn {
  --btn-bg:var(--primary);
  --btn-border:var(--primary);
  --btn-color:#fff;
  appearance:none;
  border:1px solid var(--btn-border);
  background:var(--btn-bg);
  color:var(--btn-color);
  padding:.9rem 1.35rem;
  font-size:.95rem;
  font-weight:600;
  letter-spacing:.5px;
  border-radius:40px;
  cursor:pointer;
  position:relative;
  overflow:hidden;
  transition:.35s;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
}

.btn.secondary {
  --btn-bg:rgba(255,255,255,0.1);
  --btn-border:rgba(255,255,255,0.4);
  --btn-color:#fff;
  backdrop-filter:blur(4px);
}

.btn:hover,
.btn:focus {
  filter:brightness(1.08) saturate(1.1);
  box-shadow:0 5px 20px -5px rgba(var(--primary-rgb), .5);
  text-decoration:none;
}

/* Sections */
section {
  padding:clamp(3rem, 6vh, 5rem) 1.25rem;
}

.section-inner {
  max-width:1200px;
  margin:0 auto;
}

section h2 {
  font-size:1.85rem;
  margin:0 0 1.25rem;
  font-weight:600;
  letter-spacing:.75px;
  position:relative;
}

section h2 span.accent {
  background:linear-gradient(90deg,var(--primary), var(--primary-accent));
  -webkit-background-clip:text;
  color:transparent;
}

.lead {
  font-size:1.1rem;
  color:var(--muted);
  max-width:760px;
  margin:0 0 2rem;
}

.grid {
  display:grid;
  gap:1.65rem;
}

.grid.cols-3 {
  grid-template-columns:repeat(auto-fit, minmax(240px,1fr));
}

.card {
  background:var(--bg-alt);
  border:1px solid var(--border);
  padding:1.15rem 1.15rem 1.35rem;
  border-radius:var(--radius);
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:.65rem;
  transition:.35s;
}

.card:hover {
  box-shadow:0 8px 28px -8px rgba(var(--primary-rgb),0.25), 0 2px 6px -1px rgba(var(--primary-rgb),0.15);
  transform:translateY(-4px);
}

.card h3 {
  margin:.25rem 0 .35rem;
  font-size:1.05rem;
  letter-spacing:.5px;
}

.badge {
  display:inline-block;
  background:rgba(var(--primary-rgb),0.08);
  color:var(--primary);
  padding:.35rem .65rem;
  font-size:.65rem;
  letter-spacing:.75px;
  border-radius:6px;
  font-weight:600;
  text-transform:uppercase;
  margin-right:.4rem;
}

.muted { color:var(--muted); }

.split {
  display:grid;
  gap:2.5rem;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  align-items:start;
}

/* Careers */
.careers-cta {
  background:var(--gradient);
  color:#fff;
  padding:2.25rem clamp(1.25rem, 3vw, 3rem);
  border-radius:var(--radius);
  position:relative;
  overflow:hidden;
}

.careers-cta::before {
  content:"";
  position:absolute;
  width:450px; height:450px;
  background:radial-gradient(circle at center, rgba(255,255,255,.25), transparent 70%);
  top:-150px; right:-120px;
  filter:blur(2px);
}

.careers-cta h3 {
  margin:0 0 .75rem;
  font-size:1.6rem;
  letter-spacing:.5px;
}

.careers-cta p {
  margin:0 0 1.35rem;
  max-width:640px;
  font-size:1rem;
  color:#e1ebf5;
}

.careers-cta .btn {
  --btn-bg:#fff;
  --btn-border:#fff;
  --btn-color:var(--primary);
  font-weight:700;
}

/* Contact */
.contact-box {
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:2rem clamp(1.25rem, 3vw, 2.25rem);
  display:grid;
  gap:1.75rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  align-items:start;
}

.inline-inputs { display:grid; gap:1rem; }

.inline-inputs.two { grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }

form label {
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.75px;
  text-transform:uppercase;
  display:block;
  margin:0 0 .35rem;
  color:var(--primary);
}

input[type="text"],
input[type="email"],
textarea {
  width:100%;
  padding:.75rem .85rem;
  border:1px solid var(--border);
  border-radius:8px;
  font:inherit;
  background:#fff;
  resize:vertical;
  min-height:46px;
  transition:border-color .25s, box-shadow .25s;
}

textarea { min-height:140px; }

input:focus,
textarea:focus {
  outline:none;
  border-color:var(--primary-accent);
  box-shadow:0 0 0 3px rgba(var(--primary-rgb),0.15);
}

footer {
  background:#0e2337;
  color:#b5c2ce;
  padding:2.75rem 1.25rem 2.5rem;
  margin-top:4rem;
  position:relative;
}

footer .footer-inner {
  max-width:1200px;
  margin:0 auto;
  display:grid;
  gap:2.5rem;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
}

footer h4 {
  margin:0 0 .85rem;
  font-size:1rem;
  color:#fff;
  letter-spacing:.75px;
  text-transform:uppercase;
}

footer a { color:#cfe2f3; }
footer a:hover { color:#fff; }

.footer-bar {
  max-width:1200px;
  margin:2.25rem auto 0;
  border-top:1px solid #27455f;
  padding-top:1rem;
  font-size:.75rem;
  letter-spacing:.6px;
  text-transform:uppercase;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:1rem;
  color:#7c93a6;
}

/* Utilities */
.fade-in { opacity:0; transform:translateY(20px); transition: .7s ease; }
.fade-in.visible { opacity:1; transform:translateY(0); }

.separator {
  height:2px; width:80px;
  background:linear-gradient(90deg,var(--primary),transparent);
  margin:-.5rem 0 1.75rem;
  border-radius:2px;
}

.small { font-size:.85rem; }

blockquote.fake {
  margin:0;
  padding:1.1rem 1.25rem 1.2rem 1.1rem;
  background:linear-gradient(90deg, rgba(var(--primary-rgb),0.08), rgba(var(--primary-rgb),0.02));
  border-left:4px solid var(--primary);
  border-radius:0 8px 8px 0;
  font-size:.95rem;
  color:var(--muted);
  line-height:1.5;
}

.inline-icon {
  width:22px; height:22px;
  display:inline-flex;
  align-items:center; justify-content:center;
  border-radius:6px;
  background:rgba(var(--primary-rgb),0.1);
  color:var(--primary);
  font-size:.7rem;
  font-weight:700;
  margin-right:.45rem;
  vertical-align:middle;
}

::-webkit-scrollbar { width:11px; }
::-webkit-scrollbar-track { background:#e6edf4; }
::-webkit-scrollbar-thumb { background:#b0c2d3; border-radius:20px; border:3px solid #e6edf4; }
::-webkit-scrollbar-thumb:hover { background:#90a8bb; }

</style>
</head>
<body>

<header>
  <div class="navbar">
    <div class="brand">
      <span class="logo">CC</span>
      <span>Clay Consulting</span>
    </div>
    <button id="mobileToggle" aria-expanded="false" aria-controls="primaryNav">Menu</button>
    <nav id="primaryNav" aria-label="Main navigation">
      <ul>
        <li><a href="#hero">Home</a></li>
        <li><a href="#about">About</a></li>
        <li><a href="#services">Services</a></li>
        <li><a href="#cases">Case Studies</a></li>
        <li><a href="#careers">Careers</a></li>
        <li><a href="#contact">Contact</a></li>
      </ul>
    </nav>
  </div>
</header>

<!-- Hero Section -->
<section class="hero" id="hero">
  <div class="hero-inner fade-in">
    <h1>Driving Innovation, Delivering Value.</h1>
    <p class="tagline">Positioning organizations for tomorrow through scalable, synergistic, cross-functional excellence.</p>
    <div class="cta-group">
      <a href="#services" class="btn">Explore Services</a>
      <a href="#contact" class="btn secondary">Get In Touch</a>
    </div>
  </div>
</section>

<!-- About Us -->
<section id="about">
  <div class="section-inner fade-in">
    <h2><span class="accent">About</span> Us</h2>
    <div class="separator"></div>
    <div class="split">
      <div>
        <p class="lead">
          At Clay Consulting, we leverage cutting-edge strategies to empower businesses across diverse sectors. Harnessing
          a culture of continuous improvement, we synchronize transformative roadmaps with scalable operational rigor.
        </p>
        <p>
          Our mission is to deliver scalable solutions that align with tomorrow’s challenges. Through an integrated focus
          on stakeholder alignment, value acceleration, and enterprise resilience, we enable organizations to convert
          strategic intent into measurable outcomes.
        </p>
        <p>
          We orchestrate innovation by embedding data-driven optionality within core processes, ensuring sustainable
          differentiation and end-to-end lifecycle performance across global value chains.
        </p>
      </div>
      <div>
        <blockquote class="fake">
          “Their framework empowered us to pivot, optimize, and accelerate our multi-market engagement model with
          unparalleled clarity and speed.”
          <div class="small muted" style="margin-top:.55rem;">— Customer Testimonial</div>
        </blockquote>
        <div style="margin-top:1.85rem;">
          <span class="badge">Core Pillars</span>
          <ul class="muted" style="margin:.5rem 0 0; padding-left:1.1rem;">
            <li>Strategic Enablement</li>
            <li>Resilient Scalability</li>
            <li>Operational Alignment</li>
            <li>Insight Optimization</li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</section>

<!-- Services -->
<section id="services" style="background:linear-gradient(180deg,#f0f5fa 0%, #ffffff 100%);">
  <div class="section-inner fade-in">
    <h2><span class="accent">Services</span></h2>
    <div class="separator"></div>
    <p class="lead">
      We provide a broad matrix of capability layers engineered to unlock latent enterprise potential and drive
      multidimensional value capture.
    </p>
    <div class="grid cols-3">
      <div class="card">
        <div><span class="inline-icon">BC</span><strong>Business Consulting</strong></div>
        <p class="muted">Strategic frameworks and holistic advisory aligning vision with scalable execution across global
        delivery channels.</p>
      </div>
      <div class="card">
        <div><span class="inline-icon">DT</span><strong>Digital Transformation</strong></div>
        <p class="muted">End-to-end modernization blueprints catalyzing platform agility, omnichannel integration, and
        adaptive governance.</p>
      </div>
      <div class="card">
        <div><span class="inline-icon">CI</span><strong>Cloud Integration</strong></div>
        <p class="muted">Composable cloud migration and interoperability pathways optimizing elasticity and workload
        orchestration.</p>
      </div>
      <div class="card">
        <div><span class="inline-icon">ES</span><strong>Enterprise Solutions</strong></div>
        <p class="muted">Modular architectures unifying stakeholder ecosystems through scalable, service-driven operating
        layers.</p>
      </div>
      <div class="card">
        <div><span class="inline-icon">DD</span><strong>Data-Driven Insights</strong></div>
        <p class="muted">Analytics amplification converting fragmented datasets into predictive intelligence and
        actionable levers.</p>
      </div>
      <div class="card">
        <div><span class="inline-icon">VX</span><strong>Value Expansion</strong></div>
        <p class="muted">Portfolio rationalization and continuous improvement loops reinforcing sustainable ROI horizons.</p>
      </div>
    </div>
  </div>
</section>

<!-- Case Studies / Clients -->
<section id="cases">
  <div class="section-inner fade-in">
    <h2><span class="accent">Case</span> Studies & Clients</h2>
    <div class="separator"></div>
    <p class="lead">
      We have supported Fortune 500 companies in achieving operational efficiency and worked with global partners to
      streamline innovation pipelines.
    </p>
    <div class="grid cols-3">
      <div class="card">
        <h3>Operational Efficiency Enablement</h3>
        <p class="muted">Delivered a layered maturity model accelerating cross-silo transparency and compressing
        decision latency.</p>
        <div class="small muted">Fortune 500 | Global Footprint</div>
      </div>
      <div class="card">
        <h3>Innovation Pipeline Streamlining</h3>
        <p class="muted">Unified prototype gating process with governance telemetry, amplifying throughput and reducing
        redundancy.</p>
        <div class="small muted">International Consortium</div>
      </div>
      <div class="card">
        <h3>Cloud-Native Adoption Catalyst</h3>
        <p class="muted">Architected microservice modularity enabling horizontal scale and improving release velocity.</p>
        <div class="small muted">Enterprise Technology Sector</div>
      </div>
      <div class="card">
        <h3>Lifecycle Analytics Fabric</h3>
        <p class="muted">Implemented an insight fabric translating real-time signals into proactive intervention
        scenarios.</p>
        <div class="small muted">Industrial Vertical</div>
      </div>
      <div class="card">
        <h3>Global Integration Alignment</h3>
        <p class="muted">Harmonized multi-region platforms under a unifying interoperability schema.</p>
        <div class="small muted">Multinational Portfolio</div>
      </div>
      <div class="card">
        <h3>Strategic Resilience Roadmap</h3>
        <p class="muted">Developed resilience indices enabling adaptive risk recalibration and continuity acceleration.</p>
        <div class="small muted">Corporate Advisory</div>
      </div>
    </div>
  </div>
</section>

<!-- Careers -->
<section id="careers" style="background:linear-gradient(180deg,#ffffff 0%, #f4f8fc 100%);">
  <div class="section-inner fade-in">
    <h2><span class="accent">Careers</span></h2>
    <div class="separator"></div>
    <div class="careers-cta">
      <h3>Join Our Growing Team</h3>
      <p>We are always seeking talented professionals to join our growing team. If you are passionate about enabling
      enterprise transformation and shaping scalable value creation, we invite you to express interest.</p>
      <a class="btn" href="#contact">Submit Resume</a>

    </div>
  </div>
</section>

<!-- Contact -->
<section id="contact">
  <div class="section-inner fade-in">
    <h2><span class="accent">Contact</span> Us</h2>
    <div class="separator"></div>
    <p class="lead">Ready to explore alignment opportunities? Reach out via the form below.</p>
    <div class="contact-box">
      <div>
        <h3 style="margin-top:0;">General Inquiries</h3>
        <p class="muted" style="margin-top:.4rem;">For engagements, partnerships, or additional information, contact us using the form.</p>

        <p class="muted small" style="margin-top:1.25rem;">We respond to legitimate business inquiries in a timely manner.</p>
      </div>
      <div>
        <form action="#contact" method="post" autocomplete="on" aria-label="Contact form" novalidate>
            <?php if ($contact_success): ?>
              <div class="small" style="margin:0 0 1rem; color:#1d6f3a; font-weight:600;">
                Thank you — your message has been received.
                <?php if ($contact_internal_note): ?>
                  <br><span style="color:#b36200;">(Note: <?php echo htmlspecialchars(
                      $contact_internal_note,
                      ENT_QUOTES,
                  ); ?>)</span>
                <?php endif; ?>
              </div>
            <?php elseif ($contact_error): ?>
              <div class="small" style="margin:0 0 1rem; color:#8a1d1d; font-weight:600;">
                <?php echo htmlspecialchars($contact_error, ENT_QUOTES); ?>
              </div>
            <?php endif; ?>
            <input type="hidden" name="contact_token" value="<?php echo hash(
                "crc32b",
                session_id() ?: "token",
            ); ?>">

            <div style="display:none;">
              <label>Website <input type="text" name="website" value=""></label>
            </div>
          <div class="inline-inputs two">
            <div>
              <label for="name">Name</label>
              <input id="name" type="text" name="name" placeholder="Your Name" required>
            </div>
            <div>
              <label for="email">Email</label>
              <input id="email" type="email" name="email" placeholder="you@example.com" required>
            </div>
          </div>
          <div style="margin-top:1rem;">
            <label for="message">Message</label>
            <textarea id="message" name="message" placeholder="How can we help you?" required></textarea>
          </div>
            <div style="margin-top:1.1rem;">
              <button class="btn" type="submit">Send Message</button>
            </div>
        </form>
      </div>
    </div>
  </div>
</section>

<footer>
  <div class="footer-inner">
    <div>
      <h4>Clay Consulting</h4>
      <p class="small">Driving Innovation, Delivering Value.</p>
      <p class="small muted" style="max-width:240px;">We partner with organizations to operationalize strategy through scalable technology and insight-driven execution.</p>
    </div>
    <div>
      <h4>Navigation</h4>
      <div class="small">
        <p><a href="#about">About</a></p>
        <p><a href="#services">Services</a></p>
        <p><a href="#cases">Case Studies</a></p>
        <p><a href="#careers">Careers</a></p>
        <p><a href="#contact">Contact</a></p>
      </div>
    </div>
    <div>
      <h4>Engage</h4>
      <div class="small">
        <p><a href="#services">Capabilities Overview</a></p>
        <p><a href="#careers">Talent Portal</a></p>
        <p><a href="#contact">Connect With Us</a></p>
      </div>
    </div>
    <div>
      <h4>Legal</h4>
      <div class="small muted">
        Information on this site is provided for general corporate purposes. © <?php echo date(
            "Y",
        ); ?> Clay Consulting.
      </div>
    </div>
  </div>
  <div class="footer-bar small">
    <div>&copy; <?php echo date("Y"); ?> Clay Consulting</div>
    <div>All Rights Reserved</div>
  </div>
</footer>

<script>
/* Simple intersection observer for fade-ins */
const observer = new IntersectionObserver(entries => {
  entries.forEach(e => {
    if (e.isIntersecting) {
      e.target.classList.add('visible');
      observer.unobserve(e.target);
    }
  });
}, { threshold:.15 });

document.querySelectorAll('.fade-in').forEach(el => observer.observe(el));

/* Mobile nav toggle */
const toggle = document.getElementById('mobileToggle');
const nav = document.getElementById('primaryNav');
toggle?.addEventListener('click', () => {
  const open = nav.classList.toggle('open');
  toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
  toggle.textContent = open ? 'Close' : 'Menu';
});

/* Basic smooth scroll */
document.querySelectorAll('a[href^="#"]').forEach(a => {
  a.addEventListener('click', e => {
    const id = a.getAttribute('href').slice(1);
    const target = document.getElementById(id);
    if (target) {
      e.preventDefault();
      nav.classList.remove('open');
      toggle.setAttribute('aria-expanded','false');
      toggle.textContent='Menu';
      const y = target.getBoundingClientRect().top + window.scrollY - 70;
      window.scrollTo({ top:y, behavior:'smooth' });
      history.replaceState(null,'','#'+id);
    }
  });
});
</script>

</body>
</html>