:root {
  --bg-dark: #0a0f2d;
  --bg-deeper: #06091d;
  --text: #17203a;
  --muted: #6d7793;
  --white: #ffffff;
  --blue: #3f7bff;
  --violet: #7b4dff;
  --pink: #ff4fd8;
  --cyan: #3de0ff;
  --orange: #ff9933;
  --green: #138808;
  --red: #d6001c;
  --shadow: 0 20px 60px rgba(18, 28, 68, 0.18);
  --radius-xl: 28px;
  --radius-lg: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', sans-serif;
  color: var(--text);
  background: #f7f9ff;
  overflow-x: hidden;
}
a { text-decoration: none; }

.cursor-glow {
  position: fixed; width: 320px; height: 320px; border-radius: 50%;
  background: radial-gradient(circle, rgba(123,77,255,.18), rgba(255,79,216,.08), transparent 70%);
  pointer-events: none; z-index: 0; left: -160px; top: -160px; filter: blur(10px);
}

.glass-nav {
  background: rgba(10, 15, 45, 0.72);
  backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.navbar { padding: 1rem 0; }
.navbar-brand { display:flex; align-items:center; gap:.85rem; color:#fff; font-weight:800; }
.navbar-brand small { display:block; color:rgba(255,255,255,.7); font-size:.75rem; font-weight:500; }
.brand-text { letter-spacing: .08em; font-size: 1.35rem; }
.brand-mark { display:flex; align-items:center; gap:.22rem; }
.brand-dot { width:10px; height:10px; border-radius:50%; display:inline-block; box-shadow:0 0 15px rgba(255,255,255,.4); }
.brand-divider { width:10px; }
.dot-orange{background:var(--orange);} .dot-white{background:#fff;} .dot-green{background:var(--green);} .dot-red{background:var(--red);} 
.nav-link { color: rgba(255,255,255,.85); font-weight: 500; }
.nav-link:hover, .nav-link.active { color: #fff; }
.navbar-toggler { border-color: rgba(255,255,255,.2); }
.navbar-toggler-icon { filter: invert(1); }

.btn-pill {
  border-radius: 999px; padding: .9rem 1.55rem; font-weight: 700; border: 0;
  transition: all .35s ease; box-shadow: 0 12px 28px rgba(65, 88, 208, 0.16);
}
.btn-brand {
  color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--violet) 50%, var(--pink));
  position: relative;
}
.btn-brand:hover { transform: translateY(-3px); box-shadow: 0 16px 38px rgba(123,77,255,.45), 0 0 24px rgba(255,79,216,.25); color:#fff; }
.btn-outline-light:hover { transform: translateY(-3px); }

.hero-section {
  background: linear-gradient(135deg, #081229 0%, #101a48 25%, #2a1869 55%, #521f82 78%, #9f2d7a 100%);
  position: relative;
}
.hero-gradient {
  position:absolute; inset:0;
  background: radial-gradient(circle at 20% 20%, rgba(61,224,255,.18), transparent 30%),
              radial-gradient(circle at 85% 25%, rgba(255,79,216,.22), transparent 25%),
              radial-gradient(circle at 60% 80%, rgba(63,123,255,.20), transparent 28%);
  animation: pulseGradient 10s ease-in-out infinite alternate;
}
@keyframes pulseGradient { from { transform: scale(1) translateY(0); } to { transform: scale(1.08) translateY(-10px);} }
.hero-particles span {
  position:absolute; display:block; width:12px; height:12px; border-radius:50%;
  background: rgba(255,255,255,.45); box-shadow: 0 0 20px rgba(255,255,255,.35);
  animation: floatParticle 12s linear infinite;
}
.hero-particles span:nth-child(1){left:8%; top:70%; animation-delay:0s;}
.hero-particles span:nth-child(2){left:18%; top:25%; width:8px; height:8px; animation-delay:2s;}
.hero-particles span:nth-child(3){left:55%; top:18%; width:10px; height:10px; animation-delay:4s;}
.hero-particles span:nth-child(4){left:68%; top:65%; width:14px; height:14px; animation-delay:1s;}
.hero-particles span:nth-child(5){left:88%; top:28%; width:7px; height:7px; animation-delay:3s;}
.hero-particles span:nth-child(6){left:78%; top:82%; width:11px; height:11px; animation-delay:5s;}
@keyframes floatParticle { 0% { transform: translateY(0) scale(.9); opacity:.2; } 50% { opacity:.8; } 100% { transform: translateY(-60px) scale(1.15); opacity:.1; } }

.eyebrow, .section-kicker {
  display:inline-block; padding:.45rem .8rem; border-radius:999px; font-size:.82rem;
  letter-spacing:.08em; text-transform:uppercase; font-weight:700;
  color:#fff; background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.14);
}
.text-gradient {
  background: linear-gradient(90deg, #fff, #7fe8ff, #ff9cf1); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-actions { position:relative; z-index:2; }
.metric-card, .hero-logo-card, .premium-panel, .service-card, .choice-card, .statement-card, .contact-card, .contact-form, .director-card, .director-spotlight {
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow);
}
.metric-card {
  background: rgba(255,255,255,.09); color:#fff; border:1px solid rgba(255,255,255,.12); padding:1rem 1.15rem; backdrop-filter: blur(12px);
}
.metric-card strong { display:block; font-size:1rem; }
.metric-card span { color: rgba(255,255,255,.7); font-size:.92rem; }
.hero-spotlight { position:relative; }
.hero-logo-card {
  padding: 1.6rem; background: rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.16); backdrop-filter: blur(18px); color:#fff;
}
.logo-placeholder { display:flex; align-items:center; gap:1rem; margin-bottom:1.2rem; }
.logo-orb {
  width:74px; height:74px; border-radius:22px; background: linear-gradient(135deg, var(--orange), #fff 40%, var(--green) 70%, var(--red));
  position:relative; box-shadow: inset 0 0 20px rgba(255,255,255,.45), 0 12px 30px rgba(0,0,0,.18);
}
.logo-orb::after {
  content:''; position:absolute; inset:14px; border-radius:18px; background: linear-gradient(135deg, rgba(63,123,255,.95), rgba(123,77,255,.95), rgba(255,79,216,.95));
}
.logo-placeholder h2 { margin:0; font-weight:900; letter-spacing:.12em; }
.logo-placeholder p, .logo-placeholder small { margin:0; color:rgba(255,255,255,.75); }
.hero-checks li { margin-bottom:.65rem; color: rgba(255,255,255,.88); }
.hero-checks i { color:#9bf6ff; margin-right:.45rem; }
.flag-ribbon { display:flex; align-items:center; gap:.7rem; }
.flag-ribbon.compact { justify-content:flex-start; }
.india-flag, .japan-flag {
  width:58px; height:38px; border-radius:12px; display:inline-block; box-shadow:0 8px 20px rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.3);
}
.india-flag { background: linear-gradient(to bottom, var(--orange) 33.33%, #fff 33.33% 66.66%, var(--green) 66.66%); position:relative; }
.india-flag::after { content:''; position:absolute; width:11px; height:11px; border:2px solid #1a4fb0; border-radius:50%; top:50%; left:50%; transform:translate(-50%,-50%); }
.japan-flag { background:#fff; position:relative; }
.japan-flag::after { content:''; position:absolute; width:16px; height:16px; background:var(--red); border-radius:50%; top:50%; left:50%; transform:translate(-50%,-50%); }

.wave-divider {
  position:absolute; left:0; right:0; bottom:-1px; height:120px;
  background: radial-gradient(80% 140px at 50% -10px, transparent 67%, #f7f9ff 68%);
}

.section { padding: 110px 0; position:relative; z-index:1; }
.section-light { background: #f7f9ff; }
.section-dark { background: linear-gradient(180deg, var(--bg-dark), var(--bg-deeper)); }
.section-heading { max-width: 760px; margin-bottom: 1.2rem; }
.section-heading.text-center { margin-left:auto; margin-right:auto; }
.section-heading h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-top: .9rem; }
.section-heading p { color: var(--muted); font-size: 1.06rem; }
.section-dark .section-heading p { color: rgba(255,255,255,.7); }

.premium-panel { background:#fff; padding:1.5rem; }
.mini-feature {
  height:100%; padding:1.2rem; border-radius:20px; background: linear-gradient(180deg, #fff, #f2f6ff); border:1px solid #ebefff;
}
.mini-feature i, .choice-card i, .icon-wrap { display:inline-flex; align-items:center; justify-content:center; }
.mini-feature i, .choice-card i {
  width:54px; height:54px; border-radius:16px; margin-bottom:1rem; color:#fff; font-size:1.3rem;
  background: linear-gradient(135deg, var(--blue), var(--pink));
}
.service-card {
  background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); color:#fff; padding:1.7rem; height:100%;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.service-card:hover, .choice-card:hover, .director-card:hover, .director-spotlight:hover { transform: translateY(-10px); }
.icon-wrap {
  width:64px; height:64px; border-radius:20px; color:#fff; font-size:1.5rem; margin-bottom:1.1rem;
  background: linear-gradient(135deg, var(--cyan), var(--blue), var(--violet));
  box-shadow: 0 12px 25px rgba(61,224,255,.18);
}
.service-card p { color: rgba(255,255,255,.72); }
.accent-section { background: linear-gradient(180deg, #f7f9ff, #eef2ff); }
.statement-card {
  padding: 2rem; background:#fff; border:1px solid #e9edff; position:relative; overflow:hidden;
}
.statement-card::before {
  content:''; position:absolute; width:220px; height:220px; right:-60px; top:-60px; border-radius:50%; background: radial-gradient(circle, rgba(123,77,255,.18), transparent 65%);
}
.choice-card {
  background:#fff; padding:1.6rem; border:1px solid #edf1ff; height:100%; transition:all .35s ease;
}
.contact-card, .contact-form {
  background:#fff; padding:1.7rem; border:1px solid #ebefff;
}
.contact-item { display:flex; gap:1rem; align-items:flex-start; margin-bottom:1rem; color:var(--text); }
.contact-item i { color:var(--violet); font-size:1.2rem; margin-top:.15rem; }
.form-control {
  border-radius:18px; border:1px solid #e2e8ff; padding: .95rem 1rem; box-shadow:none;
}
.form-control:focus { border-color:#8ba7ff; box-shadow:0 0 0 .25rem rgba(99,135,255,.12); }
.form-note { color: var(--muted); font-size:.95rem; }

.directors-section::before {
  content:''; position:absolute; inset:0; background: radial-gradient(circle at 15% 20%, rgba(61,224,255,.10), transparent 25%), radial-gradient(circle at 85% 15%, rgba(255,79,216,.12), transparent 28%);
}
.director-card, .director-spotlight {
  background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); color:#fff; padding:1.8rem; backdrop-filter: blur(12px);
}
.director-avatar {
  width:78px; height:78px; border-radius:24px; display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--blue), var(--violet), var(--pink)); color:#fff; font-size:1.5rem; font-weight:800; box-shadow: 0 16px 30px rgba(123,77,255,.28);
  margin-bottom:1rem;
}
.spotlight-header { display:flex; gap:1.2rem; justify-content:space-between; align-items:flex-start; }
.spotlight-avatar { flex-shrink:0; margin-bottom:0; width:88px; height:88px; }
.director-meta { color:#9bdcff; text-transform:uppercase; letter-spacing:.08em; font-weight:700; font-size:.78rem; margin-bottom:.6rem; }
.director-origin { color: rgba(255,255,255,.72); }
.detail-chip {
  padding:.85rem 1rem; border-radius:16px; margin-bottom:.8rem; background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.88);
}
.expertise-block { border-top:1px solid rgba(255,255,255,.10); padding-top:1.2rem; }
.expertise-tags { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:.9rem; }
.expertise-tags span {
  padding:.6rem .9rem; border-radius:999px; background: linear-gradient(135deg, rgba(63,123,255,.25), rgba(255,79,216,.22)); border:1px solid rgba(255,255,255,.12); color:#fff; font-size:.92rem;
}

.site-footer {
  background: #081022; color: rgba(255,255,255,.72); padding: 1.3rem 0;
}
.site-footer a { color: rgba(255,255,255,.82); }
.whatsapp-float {
  position: fixed; right: 22px; bottom: 22px; width: 60px; height: 60px; z-index: 999;
  display:flex; align-items:center; justify-content:center; border-radius:50%; color:#fff; font-size:1.6rem;
  background: linear-gradient(135deg, #28d146, #0fa958); box-shadow: 0 15px 30px rgba(15,169,88,.35);
}
.whatsapp-float:hover { transform: translateY(-3px) scale(1.03); color:#fff; }

.fade-up, .fade-left, .reveal {
  opacity: 0; transform: translateY(28px); transition: all .8s cubic-bezier(.2,.65,.2,1);
}
.fade-left { transform: translateX(32px); }
.reveal.active, .fade-up.active, .fade-left.active { opacity: 1; transform: translate(0,0); }
.delay-1 { transition-delay: .1s; }
.delay-2 { transition-delay: .2s; }
.delay-3 { transition-delay: .3s; }
.delay-4 { transition-delay: .4s; }

@media (max-width: 991.98px) {
  .section { padding: 90px 0; }
  .spotlight-header { flex-direction:column; }
}
@media (max-width: 767.98px) {
  .hero-section .display-3 { font-size: 2.5rem; }
  .logo-placeholder { flex-direction:column; align-items:flex-start; }
  .whatsapp-float { width:54px; height:54px; right:16px; bottom:16px; }
}