/* === AIID — Complete Design System === */

/* 1. Reset & Variables */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --primary:      #060B27;
  --primary-2:    #0D1438;
  --accent-blue:  #4F46E5;
  --accent-cyan:  #06B6D4;
  --accent-purple:#8B5CF6;
  --gradient:     linear-gradient(135deg, #4F46E5 0%, #06B6D4 100%);
  --text-dark:    #0F172A;
  --text-body:    #374151;
  --text-muted:   #6B7280;
  --surface:      #F8FAFC;
  --border:       rgba(0,0,0,0.08);
  --border-dark:  rgba(255,255,255,0.07);
  --shadow-sm:    0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:    0 4px 24px rgba(0,0,0,0.1);
  --shadow-lg:    0 20px 60px rgba(0,0,0,0.15);
  --r-sm: 8px; --r-md: 16px; --r-lg: 24px; --r-xl: 40px;
  --t: 0.35s cubic-bezier(0.4,0,0.2,1);
  --font: 'Poppins', -apple-system, sans-serif;
}
html  { scroll-behavior: smooth; font-size: 16px; }
body  { font-family: var(--font); color: var(--text-body); background: #fff; overflow-x: hidden; line-height: 1.6; }
img   { max-width: 100%; height: auto; display: block; }
a     { text-decoration: none; color: inherit; }
input, textarea, button, select { font-family: var(--font); }

/* 2. Typography */
h1 { font-size: clamp(2.2rem,5vw,3.8rem); font-weight:800; line-height:1.15; color:var(--text-dark); }
h2 { font-size: clamp(1.8rem,4vw,2.8rem); font-weight:700; line-height:1.2;  color:var(--text-dark); }
h3 { font-size: clamp(1.4rem,3vw,2rem);   font-weight:700; line-height:1.3;  color:var(--text-dark); }
h4 { font-size:1.15rem; font-weight:600; color:var(--text-dark); }
h5 { font-size:1rem;    font-weight:600; color:var(--text-dark); }
p  { line-height:1.75; color:var(--text-body); }
.gradient-text {
  background: var(--gradient);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

/* 3. Layout */
.container    { max-width:1240px; margin:0 auto; padding:0 24px; }
.section      { padding:100px 0; }
.section-sm   { padding:60px 0; }
.section-header { text-align:center; max-width:640px; margin:0 auto 64px; }
.section-header p { color:var(--text-muted); margin-top:12px; font-size:1.05rem; }
section[id] { scroll-margin-top: 92px; }

.label {
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 18px; border-radius:50px;
  font-size:0.75rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em;
  margin-bottom:20px;
}
.label::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.label-blue  { background:rgba(79,70,229,0.1); color:var(--accent-blue); border:1px solid rgba(79,70,229,0.2); }
.label-white { background:rgba(255,255,255,0.1); color:rgba(255,255,255,0.75); border:1px solid rgba(255,255,255,0.15); }

/* 4. Buttons */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 32px; border-radius:50px;
  font-weight:600; font-size:0.95rem; cursor:pointer; border:none;
  transition:var(--t); text-decoration:none; white-space:nowrap; position:relative; overflow:hidden;
}
.btn::after { content:''; position:absolute; inset:0; background:rgba(255,255,255,0.12); transform:translateX(-100%); transition:transform 0.3s ease; }
.btn:hover::after { transform:translateX(0); }
.btn-primary { background:var(--gradient); color:white; box-shadow:0 8px 30px rgba(79,70,229,0.35); }
.btn-primary:hover { transform:translateY(-3px); box-shadow:0 16px 44px rgba(79,70,229,0.55); color:white; }
.btn-glass   { background:rgba(255,255,255,0.1); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,0.18); color:white; }
.btn-glass:hover { background:rgba(255,255,255,0.2); transform:translateY(-3px); color:white; }
.btn-outline { background:transparent; color:var(--accent-blue); border:2px solid var(--accent-blue); }
.btn-outline:hover { background:var(--accent-blue); color:white; transform:translateY(-3px); }

/* 5. Navbar */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  padding:18px 0; transition:var(--t);
}
/* ---- Logo pill: handles any bg colour in the PNG ---- */
.navbar.scrolled {
  background:rgba(6,11,39,0.92); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid rgba(255,255,255,0.06); padding:12px 0;
  box-shadow:0 8px 40px rgba(0,0,0,0.35);
}
.nav-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.nav-logo {
  display:flex; align-items:center;
  background:#ffffff;
  border-radius:12px; padding:6px 14px;
  box-shadow:0 2px 12px rgba(0,0,0,0.18);
  transition:var(--t);
}
.nav-logo:hover { box-shadow:0 4px 20px rgba(0,0,0,0.28); transform:translateY(-1px); }
.nav-logo img { height:48px; width:auto; display:block; }
.nav-menu { display:flex; align-items:center; gap:4px; }
.nav-link {
  padding:9px 14px; border-radius:8px; color:rgba(255,255,255,0.72);
  font-size:0.87rem; font-weight:500; transition:var(--t); position:relative;
}
.nav-link::after {
  content:''; position:absolute; bottom:3px; left:14px; right:14px; height:2px;
  background:var(--gradient); border-radius:2px; transform:scaleX(0); transition:var(--t);
}
.nav-link:hover { color:white; }
.nav-link:hover::after { transform:scaleX(1); }
.menu-toggle {
  display:none; flex-direction:column; gap:5px; cursor:pointer;
  padding:9px; background:rgba(255,255,255,0.08);
  border-radius:8px; border:1px solid rgba(255,255,255,0.1); transition:var(--t);
}
.menu-toggle span { display:block; width:22px; height:2px; background:white; border-radius:2px; transition:var(--t); }
.menu-toggle.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.menu-toggle.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.menu-toggle.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* 6. Hero */
.hero {
  min-height:100vh;
  background:
    linear-gradient(115deg, rgba(3,22,16,0.86) 8%, rgba(7,29,20,0.72) 45%, rgba(8,19,44,0.76) 100%),
    url('../img/agri-hero-banner.svg') center center / cover no-repeat;
  position:relative; overflow:hidden; display:flex; align-items:center;
}
.hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size:64px 64px;
}
.orb { position:absolute; border-radius:50%; filter:blur(70px); pointer-events:none; }
.orb-1 { width:600px;height:600px; background:radial-gradient(circle,rgba(79,70,229,.55),transparent 70%); top:-150px;right:-100px; animation:orbFloat 10s ease-in-out infinite; }
.orb-2 { width:450px;height:450px; background:radial-gradient(circle,rgba(6,182,212,.45),transparent 70%); bottom:-100px;left:-100px; animation:orbFloat 12s 2s ease-in-out infinite reverse; }
.orb-3 { width:300px;height:300px; background:radial-gradient(circle,rgba(139,92,246,.4),transparent 70%); top:40%;left:35%; animation:orbFloat 8s 1s ease-in-out infinite; }
.hero-content { position:relative; z-index:2; padding:140px 0 100px; width:100%; }
.hero-layout  { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }

.hero-badge {
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(79,70,229,0.14); border:1px solid rgba(79,70,229,0.3);
  color:#a5b4fc; font-size:0.79rem; font-weight:600; letter-spacing:0.06em;
  padding:9px 20px; border-radius:50px; margin-bottom:28px;
  animation:fadeInUp 0.8s ease both;
}
.badge-dot { width:8px;height:8px; background:#818CF8; border-radius:50%; animation:pulseDot 2.5s ease infinite; }
.hero h1    { color:white; margin-bottom:20px; animation:fadeInUp 0.8s 0.15s ease both; }
.hero-sub   { font-size:1.1rem; color:rgba(255,255,255,0.6); max-width:460px; margin-bottom:44px; animation:fadeInUp 0.8s 0.25s ease both; line-height:1.7; }
.hero-btns  { display:flex; gap:16px; flex-wrap:wrap; animation:fadeInUp 0.8s 0.35s ease both; }

.hero-ticker {
  margin-top:56px; overflow:hidden; position:relative;
  animation:fadeInUp 0.8s 0.5s ease both;
}
.hero-ticker::before,.hero-ticker::after {
  content:''; position:absolute; top:0;bottom:0; width:60px; z-index:2; pointer-events:none;
}
.hero-ticker::before { left:0;  background:linear-gradient(to right,var(--primary),transparent); }
.hero-ticker::after  { right:0; background:linear-gradient(to left,var(--primary),transparent); }
.ticker-track {
  display:flex; align-items:center; gap:32px; width:max-content;
  animation:tickerScroll 20s linear infinite;
  font-size:0.78rem; font-weight:600; text-transform:uppercase; letter-spacing:0.1em;
  color:rgba(255,255,255,0.35);
}
.ticker-dot { color:var(--accent-blue); opacity:0.6; }

.hero-visual { position:relative; animation:fadeInRight 1s 0.4s ease both; }
.hero-img-frame {
  border-radius:var(--r-xl); overflow:hidden;
  box-shadow:0 40px 100px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1);
  position:relative;
}
.hero-img-frame::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(79,70,229,0.15) 0%,transparent 60%); pointer-events:none;
}
.hero-img-frame img { width:100%; display:block; }
.float-card {
  position:absolute; background:rgba(255,255,255,0.08); backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,0.14);
  border-radius:var(--r-md); padding:14px 20px;
}
.float-card-1 { bottom:32px; left:-28px; animation:floatY 4s ease-in-out infinite; }
.float-card-2 { top:32px;    right:-28px; animation:floatY 4s 2s ease-in-out infinite; }
.float-card-icon  { font-size:1.5rem; margin-bottom:4px; }
.float-card-value { color:white; font-size:1.15rem; font-weight:800; line-height:1; }
.float-card-label { color:rgba(255,255,255,0.5); font-size:0.7rem; margin-top:3px; }

/* 7. Partners */
.partners { background:white; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:52px 0; }
.partners-label { text-align:center; font-size:0.76rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.12em; margin-bottom:36px; }
.partners-slider { overflow:hidden; position:relative; }
.partners-slider::before,.partners-slider::after { content:''; position:absolute; top:0;bottom:0; width:100px; z-index:2; pointer-events:none; }
.partners-slider::before { left:0;  background:linear-gradient(to right,white,transparent); }
.partners-slider::after  { right:0; background:linear-gradient(to left,white,transparent); }
.partners-track { display:flex; gap:80px; align-items:center; animation:slide 20s linear infinite; width:max-content; }
.partners-track img { height:52px; width:auto; object-fit:contain; opacity:0.5; filter:grayscale(50%); transition:var(--t); }
.partners-track img:hover { opacity:0.9; filter:grayscale(0); }

/* 8. Stats Bar */
.stats-bar { background:var(--primary-2); border-top:1px solid rgba(255,255,255,0.05); }
.stats-row  { display:grid; grid-template-columns:repeat(4,1fr); }
.stat-cell  {
  padding:52px 30px; text-align:center;
  border-right:1px solid rgba(255,255,255,0.06); transition:var(--t);
}
.stat-cell:last-child { border-right:none; }
.stat-cell:hover { background:rgba(79,70,229,0.07); }
.stat-num  { font-size:2.8rem; font-weight:900; line-height:1; background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:8px; }
.stat-text { color:rgba(255,255,255,0.45); font-size:0.86rem; }

/* 9. About */
.about { padding:100px 0; background:white; }
.about-layout { display:grid; grid-template-columns:36% 1fr; gap:80px; align-items:start; }
.about-year  { font-size:6rem; font-weight:900; line-height:1; background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:4px; }
.about-since { font-size:0.85rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.15em; margin-bottom:24px; }
.about-desc  { color:var(--text-muted); font-size:0.93rem; line-height:1.8; }
.about-cards { display:flex; flex-direction:column; gap:16px; }
.about-card  {
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
  padding:26px; display:flex; gap:18px; transition:var(--t); position:relative; overflow:hidden;
}
.about-card::before {
  content:''; position:absolute; left:0;top:0;bottom:0; width:3px;
  background:var(--gradient); transform:scaleY(0); transition:var(--t);
}
.about-card:hover { border-color:rgba(79,70,229,0.2); box-shadow:var(--shadow-md); transform:translateX(5px); }
.about-card:hover::before { transform:scaleY(1); }
.ac-icon { width:50px;height:50px; flex-shrink:0; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center; font-size:1.4rem; }
.ic-blue   { background:rgba(79,70,229,0.1); }
.ic-cyan   { background:rgba(6,182,212,0.1); }
.ic-purple { background:rgba(139,92,246,0.1); }
.about-card h4 { margin-bottom:7px; font-size:0.98rem; }
.about-card p  { font-size:0.86rem; color:var(--text-muted); margin:0; line-height:1.65; }

/* 9-B. Millets Section */
.millets-sec { padding:100px 0; background:white; }

/* intro 2-col */
.millet-intro { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; margin-top:64px; margin-bottom:80px; }
.millet-intro-text h3 { margin-bottom:16px; }
.millet-intro-text > p { color:var(--text-muted); margin-bottom:28px; line-height:1.8; }
.millet-benefits-strip { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:8px; }
.millet-benefit {
  display:flex; align-items:center; gap:12px;
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r-md); padding:14px 16px; transition:var(--t);
}
.millet-benefit:hover { border-color:rgba(79,70,229,0.22); box-shadow:var(--shadow-sm); }
.mb-icon { width:38px;height:38px; flex-shrink:0; border-radius:10px; background:var(--gradient); display:flex; align-items:center; justify-content:center; color:white; font-size:0.95rem; }
.mb-text h5 { font-size:0.88rem; margin-bottom:1px; }
.mb-text p  { font-size:0.78rem; color:var(--text-muted); margin:0; }

.millet-intro-img-frame {
  border-radius:var(--r-xl); overflow:hidden;
  box-shadow:var(--shadow-lg); position:relative;
}
.millet-intro-img-frame img { width:100%; display:block; }
.millet-intro-img-frame::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(79,70,229,0.08),transparent 60%);
  pointer-events:none;
}

/* millet type grid */
.millet-subhead { text-align:center; margin-bottom:40px; }
.millet-subhead h3 { margin-bottom:8px; }
.millet-subhead p  { color:var(--text-muted); font-size:0.95rem; }
.millet-grid-wrap { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.millet-card {
  background:white; border:1px solid var(--border); border-radius:var(--r-lg);
  overflow:hidden; transition:var(--t); cursor:default;
}
.millet-card:hover { transform:translateY(-8px); box-shadow:0 28px 72px rgba(0,0,0,0.13); }
/* per-millet grain-colour fallback backgrounds */
.millet-kambu      { background: linear-gradient(145deg,#C8860A,#8B5E00); }
.millet-thinai     { background: linear-gradient(145deg,#7BAE37,#4A7A10); }
.millet-ragi       { background: linear-gradient(145deg,#7B3F00,#4A1A00); }
.millet-varagu     { background: linear-gradient(145deg,#B8860B,#7A5700); }
.millet-saamai     { background: linear-gradient(145deg,#C4A35A,#8A6E2A); }
.millet-kudiraivali{ background: linear-gradient(145deg,#D4A017,#8B6400); }

.millet-img-wrap { position:relative; aspect-ratio:4/3; overflow:hidden; }
.millet-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; display:block; }
.millet-card:hover .millet-img-wrap img { transform:scale(1.07); }
.millet-img-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(6,11,39,0.85) 0%, rgba(6,11,39,0.1) 55%, transparent 100%);
  display:flex; align-items:flex-end; padding:20px;
  transition:var(--t);
}
.millet-img-names { line-height:1.2; }
.millet-name-en { color:white; font-size:1.05rem; font-weight:700; }
.millet-name-ta { color:rgba(255,255,255,0.65); font-size:0.8rem; margin-top:3px; letter-spacing:0.02em; }
.millet-body { padding:20px; }
.millet-tag {
  display:inline-flex; align-items:center; gap:6px;
  background:linear-gradient(135deg,rgba(79,70,229,0.08),rgba(6,182,212,0.08));
  color:var(--accent-blue); font-size:0.72rem; font-weight:700;
  text-transform:uppercase; letter-spacing:0.08em;
  padding:4px 12px; border-radius:50px; margin-bottom:10px;
  border:1px solid rgba(79,70,229,0.14);
}
.millet-desc { font-size:0.86rem; color:var(--text-muted); line-height:1.68; margin:0; }
.millet-nutrients { display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.millet-nutrient {
  font-size:0.72rem; font-weight:600; color:var(--text-body);
  background:var(--surface); border:1px solid var(--border);
  padding:3px 10px; border-radius:50px;
}

@media (max-width:1024px) {
  .millet-intro { grid-template-columns:1fr; gap:40px; }
  .millet-grid-wrap { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px) {
  .millet-grid-wrap { grid-template-columns:1fr; }
  .millet-benefits-strip { grid-template-columns:1fr; }
}

/* 10. Services */
.services { padding:100px 0; background:var(--surface); }
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.svc-card {
  background:white; border:1px solid var(--border); border-radius:var(--r-lg);
  padding:40px 32px; transition:var(--t); position:relative; overflow:hidden; cursor:default;
}
.svc-card::after { content:''; position:absolute; inset:0; background:var(--gradient); opacity:0; transition:opacity 0.4s ease; border-radius:inherit; }
.svc-card:hover { transform:translateY(-10px); box-shadow:0 32px 80px rgba(79,70,229,0.22); }
.svc-card:hover::after { opacity:1; }
.svc-card > * { position:relative; z-index:1; }
.svc-icon  { width:66px;height:66px; border-radius:var(--r-md); background:linear-gradient(135deg,rgba(79,70,229,0.1),rgba(6,182,212,0.1)); display:flex; align-items:center; justify-content:center; font-size:1.8rem; margin-bottom:24px; transition:var(--t); }
.svc-card:hover .svc-icon { background:rgba(255,255,255,0.18); }
.svc-title { font-size:1.12rem; font-weight:700; margin-bottom:12px; transition:color 0.4s; }
.svc-desc  { font-size:0.88rem; color:var(--text-muted); line-height:1.7; transition:color 0.4s; }
.svc-card:hover .svc-title,.svc-card:hover .svc-desc { color:white; }
.svc-list  { margin-top:22px; display:flex; flex-direction:column; gap:10px; }
.svc-item  { display:flex; align-items:center; gap:10px; font-size:0.84rem; transition:color 0.4s; }
.svc-item::before { content:''; width:6px;height:6px; border-radius:50%; background:var(--gradient); flex-shrink:0; transition:background 0.4s; }
.svc-card:hover .svc-item { color:rgba(255,255,255,0.84); }
.svc-card:hover .svc-item::before { background:rgba(255,255,255,0.5); }

/* 12. Technology */
.tech-sec { padding:100px 0; background:white; }
.tech-block { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.tech-block + .tech-block { margin-top:80px; }
.tech-block.rev .tech-img-col  { order:2; }
.tech-block.rev .tech-text-col { order:1; }
.tech-img-frame { border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); position:relative; }
.tech-img-frame img { width:100%; display:block; }
.tech-img-frame::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(79,70,229,0.07),transparent); pointer-events:none;
}
.tech-text-col h3 { margin-bottom:14px; }
.tech-text-col > p { color:var(--text-muted); margin-bottom:28px; line-height:1.75; }
.tech-feats { display:flex; flex-direction:column; gap:12px; }
.tech-feat {
  display:flex; align-items:flex-start; gap:14px; padding:16px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); transition:var(--t);
}
.tech-feat:hover { border-color:rgba(79,70,229,0.22); transform:translateX(6px); box-shadow:var(--shadow-sm); }
.tf-icon  { width:40px;height:40px; flex-shrink:0; border-radius:10px; background:var(--gradient); display:flex; align-items:center; justify-content:center; color:white; font-size:1rem; }
.tf-body h5 { font-size:0.9rem; margin-bottom:3px; }
.tf-body p  { font-size:0.82rem; color:var(--text-muted); margin:0; }

/* 13. Team */
.team-sec  { padding:100px 0; background:var(--surface); }
.team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.team-card { background:white; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; transition:var(--t); }
.team-card:hover { transform:translateY(-8px); box-shadow:0 24px 60px rgba(0,0,0,0.13); }
.team-img-wrap { position:relative; aspect-ratio:1; overflow:hidden; }
.team-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.team-card:hover .team-img-wrap img { transform:scale(1.07); }
.team-overlay { position:absolute; inset:0; background:var(--gradient); opacity:0; transition:var(--t); display:flex; align-items:center; justify-content:center; gap:10px; }
.team-card:hover .team-overlay { opacity:0.88; }
.team-soc { width:36px;height:36px; border-radius:50%; background:rgba(255,255,255,0.18); border:1px solid rgba(255,255,255,0.28); display:flex; align-items:center; justify-content:center; color:white; font-size:0.9rem; transition:var(--t); }
.team-soc:hover { background:rgba(255,255,255,0.35); }
.team-info { padding:18px 20px; }
.team-name { font-size:0.93rem; font-weight:700; margin-bottom:3px; }
.team-role { font-size:0.77rem; color:var(--text-muted); }

/* 14. FAQ */
.faq-sec  { padding:100px 0; background:white; }
.faq-wrap { max-width:780px; margin:0 auto; }
.faq-item { border:1px solid var(--border); border-radius:var(--r-md); margin-bottom:10px; overflow:hidden; transition:border-color 0.3s,box-shadow 0.3s; }
.faq-item.open { border-color:rgba(79,70,229,0.28); box-shadow:0 4px 20px rgba(79,70,229,0.08); }
.faq-q { padding:22px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; cursor:pointer; background:white; transition:background 0.3s; user-select:none; -webkit-user-select:none; }
.faq-item.open .faq-q { background:linear-gradient(135deg,rgba(79,70,229,0.04),rgba(6,182,212,0.04)); }
.faq-q-text { font-weight:600; font-size:0.96rem; color:var(--text-dark); }
.faq-toggle { width:30px;height:30px; flex-shrink:0; border-radius:50%; background:rgba(79,70,229,0.08); display:flex; align-items:center; justify-content:center; color:var(--accent-blue); font-size:1.1rem; font-weight:700; transition:var(--t); }
.faq-item.open .faq-toggle { background:var(--gradient); color:white; transform:rotate(45deg); }
.faq-a { max-height:0; overflow:hidden; transition:max-height 0.45s cubic-bezier(0.4,0,0.2,1); }
.faq-item.open .faq-a { max-height:520px; }
.faq-a-inner { padding:0 24px 22px; color:var(--text-muted); font-size:0.92rem; line-height:1.78; }

/* 15. Contact */
.contact-sec { padding:100px 0 0; background:var(--primary); position:relative; overflow:hidden; }
.contact-sec::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,0.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.02) 1px,transparent 1px);
  background-size:60px 60px;
}
.contact-box {
  position:relative; background:rgba(255,255,255,0.04); backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.08); border-radius:var(--r-xl);
  padding:64px; display:grid; grid-template-columns:1fr 1fr; gap:64px;
}
.contact-info h2 { color:white; margin-bottom:14px; }
.contact-info > p { color:rgba(255,255,255,0.5); margin-bottom:36px; font-size:0.95rem; }
.c-detail { display:flex; align-items:center; gap:16px; padding:16px 18px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.07); border-radius:var(--r-md); margin-bottom:10px; transition:var(--t); }
.c-detail:hover { background:rgba(79,70,229,0.12); border-color:rgba(79,70,229,0.28); }
.c-d-icon { width:44px;height:44px; flex-shrink:0; border-radius:12px; background:var(--gradient); display:flex; align-items:center; justify-content:center; color:white; font-size:1.05rem; }
.c-d-text h5 { color:rgba(255,255,255,0.8); font-size:0.87rem; margin-bottom:2px; }
.c-d-text p,.c-d-text a { color:rgba(255,255,255,0.45); font-size:0.84rem; margin:0; }
.c-d-text a:hover { color:white; }
.c-form { display:flex; flex-direction:column; gap:14px; }
.f-row   { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.f-group { display:flex; flex-direction:column; gap:6px; }
.f-label { font-size:0.8rem; font-weight:600; color:rgba(255,255,255,0.55); }
.f-input { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:var(--r-md); padding:13px 18px; color:white; font-size:0.91rem; outline:none; transition:var(--t); }
.f-input::placeholder { color:rgba(255,255,255,0.22); }
.f-input:focus { border-color:rgba(79,70,229,0.5); background:rgba(79,70,229,0.08); box-shadow:0 0 0 3px rgba(79,70,229,0.12); }
textarea.f-input { min-height:110px; resize:vertical; }

/* 15-B. Map */
.map-wrap {
  position:relative; z-index:1;
  margin-top:48px; height:420px;
  border-top:1px solid rgba(255,255,255,0.07);
  overflow:hidden;
}
.map-wrap iframe { width:100%; height:100%; border:0; display:block; filter:grayscale(20%) contrast(1.05); }
.map-label {
  position:absolute; top:20px; left:20px; z-index:2;
  background:rgba(6,11,39,0.85); backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.1); border-radius:12px;
  padding:10px 18px; display:flex; align-items:center; gap:10px;
  color:white; font-size:0.85rem; font-weight:600;
  box-shadow:0 8px 24px rgba(0,0,0,0.4);
}
.map-label i { color:var(--accent-blue); font-size:1rem; }

/* 16. Footer */
.footer { background:#040918; border-top:1px solid rgba(255,255,255,0.04); }
.footer-main  { padding:80px 0 60px; display:grid; grid-template-columns:2.5fr 1fr 1fr 1fr; gap:60px; border-bottom:1px solid rgba(255,255,255,0.04); }
.foot-logo-wrap {
  display:inline-flex; align-items:center;
  background:#ffffff; border-radius:12px; padding:8px 16px;
  margin-bottom:22px;
  box-shadow:0 2px 12px rgba(0,0,0,0.25);
}
.foot-logo { height:50px; width:auto; display:block; }
.foot-desc    { color:rgba(255,255,255,0.38); font-size:0.87rem; line-height:1.75; margin-bottom:28px; max-width:280px; }
.foot-socials { display:flex; gap:8px; }
.foot-soc { width:38px;height:38px; border-radius:10px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.38); font-size:0.88rem; transition:var(--t); text-decoration:none; }
.foot-soc:hover { background:var(--accent-blue); border-color:var(--accent-blue); color:white; transform:translateY(-3px); }
.foot-col-title { color:rgba(255,255,255,0.65); font-size:0.78rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; margin-bottom:18px; }
.foot-links { display:flex; flex-direction:column; gap:10px; }
.foot-links a { color:rgba(255,255,255,0.36); font-size:0.87rem; transition:var(--t); }
.foot-links a:hover { color:rgba(255,255,255,0.85); padding-left:6px; }
.footer-bottom { padding:24px 0; display:flex; align-items:center; justify-content:space-between; }
.foot-copy { color:rgba(255,255,255,0.22); font-size:0.8rem; }
.foot-copy a { color:rgba(255,255,255,0.42); }
.foot-copy a:hover { color:rgba(255,255,255,0.8); }

/* 16-B. How It Works (replaces video section) */
.process-sec { padding:100px 0; background:var(--primary); position:relative; overflow:hidden; }
.process-sec::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,0.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.025) 1px,transparent 1px);
  background-size:64px 64px;
}
.process-head { text-align:center; margin-bottom:64px; }
.process-head h2 { color:white; margin-bottom:12px; }
.process-head p  { color:rgba(255,255,255,0.5); font-size:1.05rem; max-width:560px; margin:0 auto; }
.process-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; position:relative; z-index:1; }
.process-grid::before {
  content:''; position:absolute; top:70px; left:calc(33.33% - 10px); right:calc(33.33% - 10px); height:1px;
  background:linear-gradient(to right,transparent,rgba(79,70,229,0.4),rgba(6,182,212,0.4),transparent);
  pointer-events:none;
}
.process-card {
  background:rgba(255,255,255,0.04); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.07); border-radius:var(--r-xl);
  padding:48px 28px 36px; text-align:center; transition:var(--t); position:relative; overflow:hidden;
}
.process-card:hover { background:rgba(255,255,255,0.08); border-color:rgba(79,70,229,0.35); transform:translateY(-8px); }
.pc-step {
  position:absolute; top:16px; right:22px;
  font-size:4.5rem; font-weight:900; line-height:1;
  color:rgba(255,255,255,0.04); pointer-events:none; user-select:none;
}
.pc-icon-wrap {
  width:90px; height:90px; margin:0 auto 28px;
  border-radius:50%; background:var(--gradient);
  display:flex; align-items:center; justify-content:center;
  font-size:2.2rem; color:white; position:relative;
}
.pc-icon-wrap::before {
  content:''; position:absolute; inset:-10px; border-radius:50%;
  border:2px solid rgba(79,70,229,0.35);
  animation:pcRing 3s ease-out infinite;
}
.pc-icon-wrap::after {
  content:''; position:absolute; inset:-22px; border-radius:50%;
  border:1px solid rgba(6,182,212,0.2);
  animation:pcRing 3s 0.8s ease-out infinite;
}
.pc-icon-inner { animation:avatarFloat 4s ease-in-out infinite; }
.pc-title { color:white; font-size:1.15rem; font-weight:700; margin-bottom:12px; }
.pc-desc  { color:rgba(255,255,255,0.48); font-size:0.88rem; line-height:1.75; }
.pc-arrow { display:none; }
.process-cta { text-align:center; margin-top:56px; }
.process-cta p { color:rgba(255,255,255,0.45); font-size:0.9rem; margin-top:14px; }

@keyframes pcRing { 0%{transform:scale(1);opacity:.7} 100%{transform:scale(1.6);opacity:0} }

/* 16-C. Animated Team Avatars */
/* Removes real-photo team-img-wrap and replaces with animated avatars */
.anim-avatar {
  position:relative; aspect-ratio:1; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.av-bg { position:absolute; inset:0; }
.av-dot-pattern {
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,0.08) 1px,transparent 1px);
  background-size:18px 18px; pointer-events:none;
}
.av-rings { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.av-ring {
  position:absolute; border-radius:50%;
  border:1.5px solid rgba(255,255,255,0.2);
  animation:avRing 3.5s ease-out infinite;
}
.av-ring:nth-child(2) { animation-delay:1.2s; }
.av-ring:nth-child(3) { animation-delay:2.4s; }
.av-icon {
  position:relative; z-index:2;
  font-size:3.2rem; color:rgba(255,255,255,0.92);
  filter:drop-shadow(0 4px 18px rgba(0,0,0,0.3));
  animation:avatarFloat 4s ease-in-out infinite;
}
/* unique gradient per card */
.av-blue   { background:linear-gradient(145deg,#4F46E5,#7C3AED); }
.av-purple { background:linear-gradient(145deg,#7C3AED,#C026D3); }
.av-cyan   { background:linear-gradient(145deg,#0891B2,#06B6D4); }
.av-green  { background:linear-gradient(145deg,#059669,#16A34A); }
.av-orange { background:linear-gradient(145deg,#D97706,#EA580C); }
.av-pink   { background:linear-gradient(145deg,#DB2777,#E11D48); }
.av-teal   { background:linear-gradient(145deg,#0F766E,#0D9488); }
.av-indigo { background:linear-gradient(145deg,#4338CA,#6366F1); }

@keyframes avRing { 0%{width:30%;height:30%;opacity:.75} 100%{width:120%;height:120%;opacity:0} }
@keyframes avatarFloat { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-10px) scale(1.06)} }

/* 17. Scroll Animations */
[data-reveal] { opacity:0; transition:opacity 0.75s ease, transform 0.75s ease; }
[data-reveal="up"]    { transform:translateY(40px); }
[data-reveal="left"]  { transform:translateX(-40px); }
[data-reveal="right"] { transform:translateX(40px); }
[data-reveal="scale"] { transform:scale(0.93); }
[data-reveal].revealed { opacity:1; transform:none; }
[data-delay="1"] { transition-delay:0.1s; }
[data-delay="2"] { transition-delay:0.2s; }
[data-delay="3"] { transition-delay:0.3s; }
[data-delay="4"] { transition-delay:0.4s; }
[data-delay="5"] { transition-delay:0.5s; }
[data-delay="6"] { transition-delay:0.6s; }

/* Back to Top */
.back-top { position:fixed; bottom:28px;right:28px; width:46px;height:46px; border-radius:50%; background:var(--gradient); color:white; display:flex; align-items:center; justify-content:center; cursor:pointer; border:none; font-size:1rem; box-shadow:0 8px 24px rgba(79,70,229,0.42); opacity:0; transform:translateY(20px); transition:var(--t); z-index:999; text-decoration:none; }
.back-top.show { opacity:1; transform:translateY(0); }
.back-top:hover { transform:translateY(-4px); box-shadow:0 14px 36px rgba(79,70,229,0.65); }

/* 18. Keyframes */
@keyframes orbFloat   { 0%,100%{transform:translate(0,0) scale(1)} 25%{transform:translate(20px,-28px) scale(1.04)} 50%{transform:translate(-14px,14px) scale(0.96)} 75%{transform:translate(10px,20px) scale(1.02)} }
@keyframes floatY     { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }
@keyframes pulseDot   { 0%,100%{box-shadow:0 0 0 0 rgba(129,140,248,.45);opacity:1} 50%{box-shadow:0 0 0 7px rgba(129,140,248,0);opacity:.7} }
@keyframes slide      { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes tickerScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes fadeInUp   { from{opacity:0;transform:translateY(32px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeInRight{ from{opacity:0;transform:translateX(50px)} to{opacity:1;transform:translateX(0)} }

/* 19. Responsive */
@media (max-width:1024px) {
  .navbar { padding:14px 0; }
  .nav-logo { padding:5px 12px; }
  .nav-logo img { height:42px; }
  .menu-toggle { display:flex; }
  .nav-menu {
    display:none;
    flex-direction:column;
    position:fixed;
    inset:0;
    background:rgba(6,11,39,0.97);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    padding:92px 28px 40px;
    gap:4px;
    z-index:999;
    overflow-y:auto;
  }
  .nav-menu.open { display:flex; }
  .nav-link {
    font-size:1.02rem;
    padding:13px 16px;
    border-radius:12px;
    display:block;
    color:rgba(255,255,255,0.72);
  }
  .nav-link:hover { background:rgba(255,255,255,0.06); }
  .nav-link::after { display:none; }
  .nav-cta-wrap { margin-top:12px; }
  .nav-cta-wrap .btn { width:100%; margin-left:0 !important; }

  .hero-layout    { grid-template-columns:1fr; gap:50px; }
  .hero-visual    { display:none; }
  .hero           { min-height:90vh; }
  .partners-track { gap:56px; }
  .partners-track img { height:44px; }
  .about-layout   { grid-template-columns:1fr; gap:40px; }
  .tech-block     { grid-template-columns:1fr; gap:40px; }
  .tech-block.rev .tech-img-col,.tech-block.rev .tech-text-col { order:unset; }
  .team-grid      { grid-template-columns:repeat(3,1fr); }
  .stats-row      { grid-template-columns:repeat(2,1fr); }
  .stat-cell      { border-bottom:1px solid rgba(255,255,255,0.06); }
  .stat-cell:nth-child(2) { border-right:none; }
  .stat-cell:nth-child(3) { border-bottom:none; }
  .stat-cell:nth-child(4) { border-right:none; border-bottom:none; }
  .contact-box    { grid-template-columns:1fr; gap:48px; padding:48px; }
  .footer-main    { grid-template-columns:1fr 1fr; gap:48px; }
}
@media (max-width:768px) {
  .container { padding:0 18px; }
  .nav-logo img { height:40px; }
  .nav-menu { padding:88px 22px 36px; }
  .nav-link { font-size:1rem; }
  .orb { display:none; }
  .hero h1 { font-size:clamp(1.95rem,9vw,2.55rem); line-height:1.18; word-break:break-word; }
  .hero-sub { font-size:1rem; max-width:100%; }
  .hero-badge { max-width:100%; line-height:1.4; white-space:normal; }
  .hero-ticker { margin-top:34px; }
  .ticker-track { gap:22px; font-size:0.72rem; }
  .hero-btns { flex-direction:column; }
  .hero-btns .btn { justify-content:center; }
  .svc-grid { grid-template-columns:1fr; }
  .process-grid { grid-template-columns:1fr; }
  .process-grid::before { display:none; }
  .process-card { padding:40px 22px 30px; }
  .pc-step { font-size:3.2rem; top:12px; right:14px; }
  .faq-q { padding:18px 16px; }
  .faq-q-text { min-width:0; font-size:0.9rem; line-height:1.5; }
  .faq-a-inner { padding:0 16px 18px; }
  .team-grid { grid-template-columns:repeat(2,1fr); }
  .c-detail { align-items:flex-start; }
  .c-d-text p, .c-d-text a { word-break:break-word; }
  .map-wrap { height:320px; }
  .f-row { grid-template-columns:1fr; }
  .contact-box { padding:32px 22px; }
  .footer-main { grid-template-columns:1fr; gap:36px; }
  .footer-bottom { flex-direction:column; gap:8px; text-align:center; }
  .section { padding:70px 0; }
  .hero-content { padding:110px 0 80px; }
  .about-year { font-size:4.5rem; }
}
@media (max-width:480px) {
  .container { padding:0 14px; }
  .hero-content { padding:100px 0 64px; }
  .hero h1 { font-size:clamp(1.7rem,8.8vw,2.05rem); }
  .hero-sub { font-size:0.95rem; line-height:1.65; }
  .hero-badge { font-size:0.7rem; padding:8px 14px; }
  .hero-ticker { display:none; }
  .btn { width:100%; }
  .stats-row { grid-template-columns:1fr; }
  .stat-cell { border-right:none !important; border-bottom:1px solid rgba(255,255,255,0.06) !important; padding:32px 18px; }
  .stat-cell:last-child { border-bottom:none !important; }
  .team-grid { grid-template-columns:1fr; }
  .partners-track { gap:34px; }
  .partners-track img { height:34px; }
  .map-wrap { height:260px; }
  .map-label { top:10px; left:10px; font-size:0.75rem; padding:8px 12px; }
  .footer-main { grid-template-columns:1fr; }
}