/* =========================================
   TENTH CONSULT — WHITE THEME (PREMIUM)
   Brand: Navy #0B1B29 | Orange #F67B22
   Primary BG: White | Accent BG: Navy
   ========================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Outfit:wght@300;400;500;600;700;800;900&display=swap');

/* ── CUSTOM PROPERTIES ───────────────────── */
:root {
  --navy:        #0B1B29;
  --navy-mid:    #122436;
  --navy-light:  #1a3352;
  --orange:      #F67B22;
  --orange-glow: #FF9A50;
  --orange-dim:  rgba(246,123,34,.12);
  --orange-dim2: rgba(246,123,34,.06);

  /* Light theme surfaces */
  --bg-white:    #ffffff;
  --bg-soft:     #F4F7FA;
  --bg-softer:   #EEF2F7;

  /* Text */
  --text-dark:   #0B1B29;
  --text-mid:    #3d5166;
  --text-muted:  #7a92a8;

  /* Borders */
  --border-light: rgba(11,27,41,.08);
  --border-orange: rgba(246,123,34,.25);

  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --ease-out:    cubic-bezier(.16,1,.3,1);
}

/* ── RESET & BASE ────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: 'Inter', sans-serif;
  background: var(--bg-white);
  color: var(--text-dark);
  overflow-x: hidden;
  line-height: 1.6;
}

img { max-width: 100%; display: block; }
a  { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* ── SCROLLBAR ───────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg-soft); }
::-webkit-scrollbar-thumb { background: var(--orange); border-radius: 3px; }

/* ── CURSOR GLOW ─────────────────────────── */
.cursor-glow {
  position: fixed;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(246,123,34,.07) 0%, transparent 70%);
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%,-50%);
  transition: transform .08s linear;
}

/* ── LOADER ──────────────────────────────── */
#loader {
  position: fixed; inset: 0;
  background: var(--navy);
  z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  flex-direction: column;
  transition: opacity .6s ease, visibility .6s ease;
}
#loader.hidden { opacity: 0; visibility: hidden; }
.loader-ring {
  width: 70px; height: 70px;
  border: 3px solid rgba(255,255,255,.1);
  border-top-color: var(--orange);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.loader-text {
  margin-top: 20px;
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  letter-spacing: .3em;
  font-size: .75rem;
  color: var(--orange);
  animation: pulse 1.5s ease infinite;
}
@keyframes spin   { to { transform: rotate(360deg); } }
@keyframes pulse  { 0%,100% { opacity: .4; } 50% { opacity: 1; } }

/* ── PARTICLES CANVAS ────────────────────── */
#particle-canvas {
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: .35;
}

/* ── HEADER ──────────────────────────────── */
#main-header {
  position: fixed; top: 0; width: 100%; z-index: 500;
  padding: 0 2rem;
  background: rgba(255,255,255,.97);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border-light);
  box-shadow: 0 4px 30px rgba(11,27,41,.08);
  transition: background .4s ease, box-shadow .4s ease;
}
#main-header.scrolled {
  background: rgba(255,255,255,.98);
  box-shadow: 0 6px 40px rgba(11,27,41,.12);
}
.header-inner {
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  height: 88px;
}
.logo img { 
  height: 58px; width: auto; object-fit: contain;
}
.logo-text {
  font-family: 'Outfit', sans-serif;
  font-size: 1.4rem; font-weight: 800;
  color: var(--navy); letter-spacing: -.02em;
}
.logo-text span { color: var(--orange); }

.nav-links { display: flex; align-items: center; gap: 2.5rem; }
.nav-links a {
  font-size: .9rem; font-weight: 500;
  color: var(--text-mid);
  position: relative;
  transition: color .3s ease;
}
.nav-links a::after {
  content: '';
  position: absolute; bottom: -4px; left: 0;
  width: 0; height: 2px;
  background: var(--orange); border-radius: 2px;
  transition: width .35s var(--ease-out);
}
.nav-links a:hover, .nav-links a.active { color: var(--navy); }
.nav-links a:hover::after, .nav-links a.active::after { width: 100%; }

.nav-cta {
  display: inline-flex; align-items: center; gap: .5rem;
  background: var(--orange) !important;
  color: #fff !important;
  padding: .6rem 1.5rem;
  border-radius: 50px;
  font-weight: 600 !important; font-size: .85rem !important;
  transition: all .4s var(--ease-spring) !important;
}
.nav-cta:hover {
  background: var(--orange-glow) !important;
  box-shadow: 0 6px 24px rgba(246,123,34,.4);
  transform: translateY(-2px) !important;
}
.nav-cta::after { display: none !important; }

.hamburger {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 8px;
}
.hamburger span {
  display: block; width: 24px; height: 2px;
  background: var(--navy);
  border-radius: 2px;
  transition: all .35s var(--ease-out);
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* mobile nav */
#mobile-nav {
  position: fixed; inset: 0;
  background: rgba(255,255,255,.98);
  backdrop-filter: blur(20px);
  z-index: 499;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 2rem;
  opacity: 0; pointer-events: none;
  transition: opacity .4s ease;
}
#mobile-nav.open { opacity: 1; pointer-events: all; }
#mobile-nav a {
  font-family: 'Outfit', sans-serif;
  font-size: 2rem; font-weight: 700;
  color: var(--navy);
  transition: color .3s;
  transform: translateY(20px); opacity: 0;
}
#mobile-nav.open a {
  animation: slideInNav .4s var(--ease-out) forwards;
}
#mobile-nav.open a:nth-child(1){ animation-delay:.05s }
#mobile-nav.open a:nth-child(2){ animation-delay:.1s }
#mobile-nav.open a:nth-child(3){ animation-delay:.15s }
#mobile-nav.open a:nth-child(4){ animation-delay:.2s }
#mobile-nav.open a:nth-child(5){ animation-delay:.25s }
#mobile-nav a:hover { color: var(--orange); }
@keyframes slideInNav { to { transform: translateY(0); opacity: 1; } }

/* ── HERO (stays dark — strong first impression) ─ */
.hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: center;
  overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--navy) 0%, #0e2236 60%, #0B1B29 100%);
}
.hero-bg img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: .1; mix-blend-mode: luminosity;
}
.hero-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(246,123,34,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(246,123,34,.04) 1px, transparent 1px);
  background-size: 60px 60px;
  animation: gridShift 20s linear infinite;
}
@keyframes gridShift {
  0%   { background-position: 0 0; }
  100% { background-position: 60px 60px; }
}

.orb {
  position: absolute; border-radius: 50%;
  filter: blur(80px); animation: orbFloat 8s ease-in-out infinite;
  pointer-events: none;
}
.orb-1 { width:500px;height:500px; background:radial-gradient(circle, rgba(246,123,34,.28) 0%, transparent 70%); top:-100px;right:-100px; animation-delay:0s; }
.orb-2 { width:350px;height:350px; background:radial-gradient(circle, rgba(246,123,34,.12) 0%, transparent 70%); bottom:-80px;left:-80px; animation-delay:-4s; }
.orb-3 { width:200px;height:200px; background:radial-gradient(circle, rgba(255,255,255,.04) 0%, transparent 70%); top:40%;left:40%; animation-delay:-2s; }
@keyframes orbFloat {
  0%,100% { transform: translate(0,0) scale(1); }
  33%      { transform: translate(30px,-40px) scale(1.05); }
  66%      { transform: translate(-20px,20px) scale(.95); }
}

.hero-content {
  position: relative; z-index: 10;
  max-width: 960px; margin: 0 auto; padding: 0 2rem;
  padding-top: 200px;
  padding-bottom: 50px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.hero-text {
  position: relative; z-index: 15;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: .5rem;
  background: rgba(246,123,34,.15);
  border: 1px solid rgba(246,123,34,.3);
  padding: .4rem 1.2rem; border-radius: 50px;
  font-size: .78rem; font-weight: 600; color: var(--orange);
  letter-spacing: .05em; text-transform: uppercase;
  margin-bottom: 2rem;
  animation: badgePulse 3s ease infinite;
}
.hero-badge .dot { width:7px;height:7px; background:var(--orange); border-radius:50%; animation:blink 1.2s ease infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.2} }
@keyframes badgePulse { 0%,100%{ box-shadow:0 0 0 0 rgba(246,123,34,0); } 50%{ box-shadow:0 0 0 8px rgba(246,123,34,.07); } }

.hero-title {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(2.5rem, 5vw, 4.2rem);
  font-weight: 900; line-height: 1.12;
  letter-spacing: -.03em; margin-bottom: 2rem;
}
.hero-title .line { overflow: hidden; }
.hero-title .word { display: inline-block; color: #fff; }
.hero-title .accent { color: var(--orange); position: relative; }
.hero-title .accent::after {
  content: ''; position: absolute; bottom: 2px; left: 0;
  width: 100%; height: 4px; background: var(--orange);
  border-radius: 2px; opacity: .35;
}
.hero-desc { color: rgba(255,255,255,.65); font-size: 1.15rem; line-height: 1.8; max-width: 680px; margin-bottom: 2.5rem; }

.hero-ctas { display: flex; gap: 1.25rem; flex-wrap: wrap; justify-content: center; }
.btn-primary {
  display: inline-flex; align-items: center; gap: .6rem;
  background: var(--orange); color: #fff;
  padding: 1rem 2.2rem; border-radius: 50px;
  font-weight: 700; font-size: .95rem;
  transition: all .4s var(--ease-spring);
  position: relative; overflow: hidden;
}
.btn-primary::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.2), transparent);
  opacity: 0; transition: opacity .3s;
}
.btn-primary:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(246,123,34,.45), 0 0 0 4px rgba(246,123,34,.12);
}
.btn-primary:hover::before { opacity: 1; }

.btn-outline {
  display: inline-flex; align-items: center; gap: .6rem;
  background: transparent; color: #fff;
  padding: 1rem 2rem;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 50px;
  font-weight: 600; font-size: .95rem;
  transition: all .4s var(--ease-spring);
}
.btn-outline:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.6); transform: translateY(-4px); }

/* btn-outline-dark — for use on light backgrounds */
.btn-outline-dark {
  display: inline-flex; align-items: center; gap: .6rem;
  background: transparent; color: var(--navy);
  padding: 1rem 2rem;
  border: 2px solid rgba(11,27,41,.2);
  border-radius: 50px;
  font-weight: 600; font-size: .95rem;
  transition: all .4s var(--ease-spring);
}
.btn-outline-dark:hover { background: var(--navy); color: #fff; transform: translateY(-4px); }

.hero-stats {
  display: flex; gap: 3.5rem; margin-top: 4.5rem;
  padding-top: 3rem; border-top: 1px solid rgba(255,255,255,.1);
  justify-content: center;
  width: 100%;
  flex-wrap: wrap;
}
.stat-item { text-align: center; }
.stat-number { font-family:'Outfit',sans-serif; font-size:2.2rem; font-weight:900; color:var(--orange); line-height:1; }
.stat-label { font-size:.78rem; color:rgba(255,255,255,.45); font-weight:500; text-transform:uppercase; letter-spacing:.05em; margin-top:.25rem; }

.hero-visual { position: relative; display:flex; align-items:center; justify-content:center; }
.hero-image-wrap { position: relative; z-index: 2; }
.hero-image-wrap img { width:100%; max-width:520px; border-radius:24px; box-shadow:0 40px 100px rgba(0,0,0,.55); animation:floatImg 6s ease-in-out infinite; }
@keyframes floatImg { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }
.hero-glow-ring { position:absolute; border:1px solid rgba(246,123,34,.15); border-radius:50%; animation:ringExpand 4s ease-in-out infinite; }
.hero-glow-ring:nth-child(1){width:120%;height:120%;animation-delay:0s}
.hero-glow-ring:nth-child(2){width:150%;height:150%;animation-delay:1.3s}
.hero-glow-ring:nth-child(3){width:180%;height:180%;animation-delay:2.6s}
@keyframes ringExpand { 0%{opacity:.5;transform:scale(.95)} 50%{opacity:.12;transform:scale(1.02)} 100%{opacity:.5;transform:scale(.95)} }

.floating-card {
  position: absolute;
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(20px); -webkit-backdrop-filter:blur(20px);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px; padding: 1rem 1.4rem;
  animation: floatCard 5s ease-in-out infinite;
}
.floating-card.card-1 { top:10%; left:-60px; animation-delay:-.5s; }
.floating-card.card-2 { bottom:15%; right:-50px; animation-delay:-2s; }
@keyframes floatCard { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-10px) rotate(.5deg)} }
.floating-card .fc-title { font-weight:700; font-size:.85rem; color:#fff; }
.floating-card .fc-sub  { font-size:.72rem; color:rgba(255,255,255,.5); margin-top:.1rem; }
.floating-card .fc-value { font-family:'Outfit',sans-serif; font-size:1.4rem; font-weight:900; color:var(--orange); }

.scroll-indicator {
  position: absolute; bottom: 2.5rem; left: 50%;
  transform: translateX(-50%); z-index:10;
  display: flex; flex-direction: column; align-items: center; gap: .5rem;
  color: rgba(255,255,255,.35); font-size:.72rem;
  letter-spacing:.1em; text-transform:uppercase;
  animation: scrollBounce 2s ease infinite;
}
.scroll-indicator::before { content:''; width:1px; height:40px; background:linear-gradient(to bottom, var(--orange), transparent); }
@keyframes scrollBounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(6px)} }

/* ── MARQUEE ─────────────────────────────── */
.marquee-section { background:var(--orange); padding:.9rem 0; overflow:hidden; position:relative; z-index:2; }
.marquee-track { display:flex; gap:3rem; animation:marqueeScroll 28s linear infinite; white-space:nowrap; width:max-content; }
.marquee-item { display:flex; align-items:center; gap:1rem; font-family:'Outfit',sans-serif; font-weight:800; font-size:.9rem; letter-spacing:.05em; text-transform:uppercase; color:#fff; flex-shrink:0; }
.marquee-item .dot { width:5px;height:5px; background:rgba(255,255,255,.6); border-radius:50%; }
@keyframes marqueeScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ── SECTIONS COMMON ─────────────────────── */
.section { position: relative; z-index: 1; }
.container { max-width: 1280px; margin: 0 auto; padding: 0 2rem; }

.section-tag {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--orange); margin-bottom: 1rem;
}
.section-tag::before { content:''; width:24px; height:2px; background:var(--orange); border-radius:2px; }

.section-title {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(1.8rem, 3vw, 3rem);
  font-weight: 800; line-height: 1.15; letter-spacing: -.03em;
  color: var(--navy);
}
.section-title .accent { color: var(--orange); }
.section-subtitle { color: var(--text-muted); font-size: 1.05rem; line-height: 1.7; max-width: 600px; margin-top: .75rem; }

/* Light (white) sections */
.section-white { background: var(--bg-white); }
.section-soft  { background: var(--bg-soft); }

/* Dark sections (kept for contrast) */
.section-dark { background: var(--navy); }
.section-dark .section-title { color: #fff; }
.section-dark .section-subtitle { color: rgba(255,255,255,.55); }
.section-dark .section-tag { color: var(--orange); }

/* ── SCROLL REVEAL ───────────────────────── */
.reveal { opacity: 0; transition: opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.reveal.from-bottom { transform: translateY(50px); }
.reveal.from-left   { transform: translateX(-50px); }
.reveal.from-right  { transform: translateX(50px); }
.reveal.scale-in    { transform: scale(.92); }
.reveal.visible { opacity:1; transform:translate(0) scale(1); }

/* ── ABOUT SECTION — WHITE ───────────────── */
.about-section { padding: 7rem 0; background: var(--bg-white); }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.about-image-wrap { position: relative; }
.about-image-main { width:100%; border-radius:20px; box-shadow:0 20px 60px rgba(11,27,41,.12); transition:transform .6s var(--ease-spring); }
.about-image-wrap:hover .about-image-main { transform:scale(1.02); }
.about-image-accent {
  position: absolute; width:60%; bottom:-40px; right:-40px;
  border-radius:16px; border:4px solid var(--bg-white);
  box-shadow:0 16px 50px rgba(11,27,41,.15); z-index:3;
  transition:transform .6s var(--ease-spring) .1s;
}
.about-image-wrap:hover .about-image-accent { transform:translate(6px, 6px); }
.about-image-bg {
  position: absolute; inset:-20px; border-radius:24px;
  background: linear-gradient(135deg, var(--orange-dim), var(--bg-soft));
  z-index: 1;
}
.about-text { color: var(--text-mid); font-size:1rem; line-height:1.8; margin-top:1.25rem; }
.check-list { margin-top:1.5rem; display:flex; flex-direction:column; gap:.75rem; }
.check-item { display:flex; align-items:center; gap:.75rem; color:var(--text-dark); font-size:.95rem; }
.check-icon {
  width:22px;height:22px; background:var(--orange-dim); border:1px solid rgba(246,123,34,.3);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  flex-shrink:0; font-size:.65rem; color:var(--orange);
}
.about-link { display:inline-flex; align-items:center; gap:.6rem; margin-top:2rem; color:var(--orange); font-weight:600; font-size:.95rem; transition:gap .3s; }
.about-link:hover { gap:1rem; }
.about-link i { transition:transform .3s; }
.about-link:hover i { transform:translateX(4px); }

/* ── SERVICES SECTION — SOFT ─────────────── */
.services-section { padding: 7rem 0; background: var(--bg-soft); }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:4rem; }
.service-card {
  position: relative;
  background: var(--bg-white);
  border: 1px solid var(--border-light);
  border-radius: 20px; padding: 2.5rem;
  overflow: hidden;
  transition: all .5s var(--ease-out);
  cursor: default;
  box-shadow: 0 2px 16px rgba(11,27,41,.05);
}
.service-card::after {
  content: ''; position:absolute; bottom:0; left:0;
  width:100%; height:3px;
  background: linear-gradient(90deg, var(--orange), var(--orange-glow));
  transform: scaleX(0); transform-origin: left;
  transition: transform .5s var(--ease-out);
}
.service-card:hover { transform:translateY(-10px); box-shadow:0 20px 60px rgba(11,27,41,.12); border-color:rgba(246,123,34,.2); }
.service-card:hover::after { transform:scaleX(1); }
.service-card:hover .svc-icon { transform:scale(1.15) rotate(-5deg); background:var(--orange); border-color:var(--orange); }
.service-card:hover .svc-icon i { color:#fff; }
.svc-icon {
  width:60px;height:60px; background:var(--orange-dim); border:1px solid rgba(246,123,34,.2);
  border-radius:16px; display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; color:var(--orange); margin-bottom:1.5rem;
  transition:all .4s var(--ease-spring);
}
.svc-title { font-family:'Outfit',sans-serif; font-size:1.15rem; font-weight:700; color:var(--navy); margin-bottom:.75rem; }
.svc-desc { color:var(--text-mid); font-size:.9rem; line-height:1.7; }
.svc-link { display:inline-flex; align-items:center; gap:.4rem; margin-top:1.5rem; color:var(--orange); font-size:.85rem; font-weight:600; opacity:0; transform:translateY(8px); transition:all .4s var(--ease-out); }
.service-card:hover .svc-link { opacity:1; transform:translateY(0); }
.svc-number { position:absolute;top:1.5rem;right:2rem; font-family:'Outfit',sans-serif; font-size:4rem; font-weight:900; color:rgba(11,27,41,.04); line-height:1; pointer-events:none; transition:color .4s; }
.service-card:hover .svc-number { color:rgba(246,123,34,.07); }

/* ── STATS — ORANGE (kept vibrant) ──────── */
.stats-section { padding:6rem 0; background:var(--orange); position:relative; overflow:hidden; }
.stats-section::before { content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.06'%3E%3Cpath d='M20 20L40 0H0z'/%3E%3C/g%3E%3C/svg%3E") repeat; }
.stats-grid { position:relative;z-index:1; display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; text-align:center; }
.stat-card { padding:1.5rem; }
.stat-big { font-family:'Outfit',sans-serif; font-size:clamp(2.5rem,4vw,4rem); font-weight:900; line-height:1; color:#fff; display:flex; align-items:flex-start; justify-content:center; }
.stat-big .plus { font-size:2rem; align-self:flex-end; padding-bottom:.2rem; }
.stat-desc { color:rgba(255,255,255,.8); font-size:.85rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; margin-top:.5rem; }

/* ── PROCESS — WHITE ─────────────────────── */
.process-section { padding:7rem 0; background:var(--bg-white); }
.process-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; margin-top:4rem; position:relative; }
.process-steps::before { content:''; position:absolute; top:38px; left:12.5%; right:12.5%; height:1px; background:linear-gradient(90deg, transparent, rgba(246,123,34,.3), var(--orange), rgba(246,123,34,.3), transparent); }
.process-step { text-align:center; position:relative; }
.step-circle {
  width:76px;height:76px; border-radius:50%;
  background:var(--bg-soft); border:2px solid rgba(246,123,34,.25);
  display:flex; align-items:center; justify-content:center; margin:0 auto 1.5rem;
  font-family:'Outfit',sans-serif; font-weight:900; font-size:1.5rem; color:var(--orange);
  position:relative; z-index:2; transition:all .4s var(--ease-spring);
}
.process-step:hover .step-circle { background:var(--orange); color:#fff; border-color:var(--orange); box-shadow:0 0 30px rgba(246,123,34,.35); transform:scale(1.1); }
.step-title { font-family:'Outfit',sans-serif; font-size:1rem; font-weight:700; color:var(--navy); margin-bottom:.5rem; }
.step-desc { color:var(--text-muted); font-size:.85rem; line-height:1.6; }

/* ── TESTIMONIALS — SOFT ─────────────────── */
.testimonials-section { padding:7rem 0; background:var(--bg-soft); }
.testimonials-track { display:flex; gap:1.5rem; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -ms-overflow-style:none; padding-bottom:1rem; margin-top:3rem; }
.testimonials-track::-webkit-scrollbar { display:none; }
.testimonial-card {
  min-width:380px; background:var(--bg-white);
  border:1px solid var(--border-light); border-radius:20px; padding:2.5rem;
  scroll-snap-align:start; position:relative;
  transition:transform .4s var(--ease-out), box-shadow .4s;
  box-shadow:0 2px 16px rgba(11,27,41,.06);
}
.testimonial-card:hover { transform:translateY(-6px); box-shadow:0 16px 48px rgba(11,27,41,.12); }
.quote-mark { font-size:4rem; color:var(--orange); opacity:.3; line-height:.7; font-family:Georgia,serif; margin-bottom:.5rem; }
.testimonial-text { color:var(--text-mid); font-size:.95rem; line-height:1.8; font-style:italic; }
.testimonial-author { display:flex; align-items:center; gap:1rem; margin-top:1.5rem; }
.testimonial-avatar { width:46px;height:46px; border-radius:50%; object-fit:cover; border:2px solid rgba(246,123,34,.25); }
.testimonial-name { font-weight:700; font-size:.9rem; color:var(--navy); }
.testimonial-role { font-size:.78rem; color:var(--text-muted); }
.testimonial-stars { color:var(--orange); font-size:.8rem; margin-bottom:.25rem; }

/* ── CTA — stays dark ────────────────────── */
.cta-section { padding:8rem 0; background:var(--navy); position:relative; overflow:hidden; text-align:center; }
.cta-section::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 50% 100%, rgba(246,123,34,.18), transparent); }
.cta-grid-lines { position:absolute; inset:0; background-image:linear-gradient(rgba(246,123,34,.03) 1px, transparent 1px),linear-gradient(90deg, rgba(246,123,34,.03) 1px, transparent 1px); background-size:50px 50px; }
.cta-content { position:relative; z-index:2; }
.cta-title { font-family:'Outfit',sans-serif; font-size:clamp(2rem,4vw,3.5rem); font-weight:900; line-height:1.1; letter-spacing:-.03em; margin-bottom:1.25rem; color:#fff; }
.cta-subtitle { color:rgba(255,255,255,.55); font-size:1.1rem; line-height:1.7; margin-bottom:2.5rem; max-width:600px; margin-left:auto; margin-right:auto; }

/* ── PAGE HERO — stays dark ──────────────── */
.page-hero { padding:10rem 0 5rem; background:linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%); position:relative; overflow:hidden; }
.page-hero::after { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 80% at 80% 50%, rgba(246,123,34,.12), transparent); }
.page-hero-content { position:relative; z-index:2; }
.page-hero h1 { font-family:'Outfit',sans-serif; font-size:clamp(2.5rem,5vw,4rem); font-weight:900; letter-spacing:-.04em; line-height:1.1; margin:1rem 0; color:#fff; }
.breadcrumb { display:flex; align-items:center; gap:.6rem; font-size:.8rem; color:rgba(255,255,255,.35); margin-top:1rem; }
.breadcrumb a { color:rgba(255,255,255,.35); transition:color .3s; }
.breadcrumb a:hover { color:var(--orange); }
.breadcrumb .sep { color:rgba(255,255,255,.2); }
.breadcrumb .current { color:var(--orange); }

/* ── ABOUT PAGE ──────────────────────────── */
.vision-mission-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-top:4rem; }
.vm-card {
  background:var(--bg-white); border:1px solid var(--border-light);
  border-radius:20px; padding:3rem; position:relative; overflow:hidden;
  transition:all .4s var(--ease-out);
  box-shadow:0 2px 16px rgba(11,27,41,.06);
}
.vm-card::before { content:''; position:absolute; top:0; left:0; width:100%; height:3px; background:var(--orange); transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease-out); }
.vm-card:hover::before { transform:scaleX(1); }
.vm-card:hover { transform:translateY(-6px); box-shadow:0 20px 60px rgba(11,27,41,.1); }
.vm-icon { width:60px;height:60px; background:var(--orange-dim); border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--orange); margin-bottom:1.5rem; }
.vm-title { font-family:'Outfit',sans-serif; font-size:1.5rem; font-weight:800; color:var(--navy); margin-bottom:.75rem; }
.vm-text  { color:var(--text-mid); line-height:1.8; }

.values-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:4rem; }
.value-card {
  background:var(--bg-white); border:1px solid var(--border-light);
  border-radius:16px; padding:2rem;
  transition:all .4s var(--ease-out);
  box-shadow:0 2px 12px rgba(11,27,41,.05);
}
.value-card:hover { transform:translateY(-6px) scale(1.02); border-color:rgba(246,123,34,.2); box-shadow:0 16px 48px rgba(11,27,41,.1); }
.value-icon { font-size:1.8rem; color:var(--orange); margin-bottom:1rem; }
.value-title { font-weight:700; font-size:1rem; color:var(--navy); margin-bottom:.5rem; }
.value-desc { font-size:.875rem; color:var(--text-muted); line-height:1.6; }

.advantage-grid { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-top:3rem; }
.adv-item { display:flex; gap:1.25rem; align-items:flex-start; }
.adv-icon { flex-shrink:0; width:48px;height:48px; border-radius:14px; background:var(--orange-dim); border:1px solid rgba(246,123,34,.2); display:flex; align-items:center; justify-content:center; font-size:1.1rem; color:var(--orange); transition:all .4s var(--ease-spring); }
.adv-item:hover .adv-icon { background:var(--orange); color:#fff; transform:rotate(5deg); }
.adv-title { font-weight:700; font-size:.95rem; color:var(--navy); margin-bottom:.25rem; }
.adv-desc  { font-size:.85rem; color:var(--text-muted); line-height:1.6; }

/* ── CONTACT PAGE ────────────────────────── */
.contact-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 4rem; align-items: start; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }

/* ── SERVICES PAGE ───────────────────────── */
.services-detail-section { padding:6rem 0; background:var(--bg-white); }
.services-detail-section.alt { background:var(--bg-soft); }
.service-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; margin-top:2rem; }
.service-detail-grid.reverse { direction:rtl; }
.service-detail-grid.reverse > * { direction:ltr; }
.service-img-wrap { position:relative; }
.service-img-wrap img { width:100%; border-radius:20px; box-shadow:0 20px 60px rgba(11,27,41,.12); }
.service-img-wrap::before { content:''; position:absolute; inset:-15px; border-radius:24px; background:linear-gradient(135deg, var(--orange-dim), var(--bg-soft)); z-index:-1; }
.service-detail-tag { display:inline-block; background:var(--orange-dim); border:1px solid rgba(246,123,34,.2); padding:.3rem .8rem; border-radius:50px; font-size:.72rem; font-weight:700; color:var(--orange); letter-spacing:.08em; text-transform:uppercase; margin-bottom:.75rem; }
.service-detail-title { font-family:'Outfit',sans-serif; font-size:clamp(1.5rem,2.5vw,2.2rem); font-weight:800; line-height:1.2; color:var(--navy); margin-bottom:1.25rem; }
.service-detail-text { color:var(--text-mid); font-size:.975rem; line-height:1.8; margin-bottom:1.5rem; }
.feature-list { display:flex; flex-direction:column; gap:.75rem; margin-bottom:2rem; }
.feature-item { display:flex; align-items:center; gap:.75rem; }
.feature-check { width:22px;height:22px; background:var(--orange-dim); border:1px solid rgba(246,123,34,.2); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.6rem; color:var(--orange); flex-shrink:0; }
.feature-text { color:var(--text-dark); font-size:.9rem; }

/* ── FOOTER — two-tone design ────────────── */

/* White top: logo + tagline + social */
.footer-top {
  background: #ffffff;
  padding: 4rem 0 3.5rem;
  border-bottom: 4px solid var(--orange);
  text-align: center;
}
.footer-top-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  max-width: 520px;
  margin: 0 auto;
}
.footer-top-inner img {
  height: 72px; width: auto; object-fit: contain;
}
.footer-top-inner > p {
  color: var(--text-muted);
  font-size: .95rem;
  line-height: 1.7;
}
.footer-top .footer-socials { justify-content: center; margin-top: .25rem; }
.footer-socials { display: flex; gap: .75rem; }
.social-btn {
  width: 40px; height: 40px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: .95rem;
  transition: all .3s var(--ease-spring);
  text-decoration: none;
}
/* Social buttons in white section — navy background */
.footer-top .social-btn {
  background: var(--navy);
  border: 1px solid var(--navy);
  color: #fff;
}
.footer-top .social-btn:hover {
  background: var(--orange);
  border-color: var(--orange);
  transform: translateY(-3px);
}

/* Navy main section — columns */
.footer-main {
  background: var(--navy);
  padding: 4.5rem 0 2.5rem;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1.5fr;
  gap: 4rem;
  margin-bottom: 3rem;
}
.footer-col h4 { font-weight:700; font-size:.875rem; color:#fff; margin-bottom:1.25rem; text-transform:uppercase; letter-spacing:.08em; }
.footer-col ul { display:flex; flex-direction:column; gap:.6rem; }
.footer-col a { color:rgba(255,255,255,.4); font-size:.875rem; transition:color .3s, padding-left .3s; }
.footer-col a:hover { color:var(--orange); padding-left:6px; }
.footer-contact-item { display:flex; gap:.75rem; align-items:flex-start; margin-bottom:1rem; }
.footer-contact-item i { color:var(--orange); font-size:.85rem; margin-top:.2rem; flex-shrink:0; }
.footer-contact-item a, .footer-contact-item span { color:rgba(255,255,255,.4); font-size:.875rem; line-height:1.6; transition:color .3s; }
.footer-contact-item a:hover { color:var(--orange); }

/* Bottom copyright bar */
.footer-bottom-bar {
  background: var(--navy-mid);
  border-top: 1px solid rgba(255,255,255,.07);
  padding: 1.5rem 0;
}
.footer-bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.footer-bottom p { color:rgba(255,255,255,.25); font-size:.8rem; }
.footer-bottom-links { display:flex; gap:1.5rem; }
.footer-bottom-links a { color:rgba(255,255,255,.25); font-size:.8rem; transition:color .3s; }
.footer-bottom-links a:hover { color:var(--orange); }

/* ── WHATSAPP ────────────────────────────── */
.whatsapp-float {
  position:fixed; bottom:2rem; right:2rem; z-index:1000;
  width:58px;height:58px; background:#25d366; color:#fff;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; box-shadow:0 8px 30px rgba(37,211,102,.35);
  transition:all .4s var(--ease-spring); animation:waPulse 3s ease infinite;
}
.whatsapp-float:hover { transform:scale(1.15) translateY(-4px); box-shadow:0 12px 40px rgba(37,211,102,.55); }
@keyframes waPulse { 0%,100%{box-shadow:0 8px 30px rgba(37,211,102,.35)} 50%{box-shadow:0 8px 50px rgba(37,211,102,.6)} }

/* ── TEAM PAGE ───────────────────────────── */
.team-hero-section { padding:11rem 0 6rem; background:linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%); position:relative; overflow:hidden; }
.team-hero-section::after { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 70% 60% at 80% 50%, rgba(246,123,34,.14), transparent),radial-gradient(ellipse 40% 40% at 20% 80%, rgba(246,123,34,.08), transparent); }
.team-hero-section .container { position:relative; z-index:2; }

/* leader cards */
.leadership-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:3rem; margin-top:5rem; max-width:960px; margin-left:auto; margin-right:auto; }
.leader-card { position:relative; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:28px; overflow:hidden; transition:all .5s var(--ease-out); }
.leader-card::before { content:''; position:absolute; inset:0; background:linear-gradient(to bottom, transparent 40%, rgba(11,27,41,.97) 100%); z-index:2; }
.leader-card:hover { transform:translateY(-12px); border-color:rgba(246,123,34,.3); box-shadow:0 30px 80px rgba(0,0,0,.25); }
.leader-photo { width:100%; aspect-ratio:3/4; object-fit:cover; object-position:top center; display:block; transition:transform .6s var(--ease-out); }
.leader-card:hover .leader-photo { transform:scale(1.06); }
.leader-info { position:absolute; bottom:0; left:0; right:0; padding:2.5rem 2rem 2rem; z-index:3; transform:translateY(8px); transition:transform .4s var(--ease-out); }
.leader-card:hover .leader-info { transform:translateY(0); }
.leader-role { display:inline-flex; align-items:center; gap:.4rem; background:var(--orange); color:#fff; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:.3rem .8rem; border-radius:50px; margin-bottom:.75rem; }
.leader-name { font-family:'Outfit',sans-serif; font-size:1.7rem; font-weight:900; color:#fff; line-height:1.15; letter-spacing:-.02em; }
.leader-title { font-size:.85rem; color:rgba(255,255,255,.6); font-weight:500; margin-top:.3rem; }
.leader-divider { width:40px;height:2px; background:var(--orange); border-radius:2px; margin:1rem 0; transition:width .4s var(--ease-out); }
.leader-card:hover .leader-divider { width:70px; }
.leader-bio { font-size:.875rem; color:rgba(255,255,255,.6); line-height:1.7; max-height:0; overflow:hidden; transition:max-height .5s var(--ease-out), opacity .4s ease; opacity:0; }
.leader-card:hover .leader-bio { max-height:120px; opacity:1; }
.leader-socials { display:flex; gap:.5rem; margin-top:1rem; opacity:0; transform:translateY(10px); transition:all .4s var(--ease-out) .1s; }
.leader-card:hover .leader-socials { opacity:1; transform:translateY(0); }
.leader-social-btn { width:34px;height:34px; border-radius:8px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.7); font-size:.8rem; transition:all .3s; }
.leader-social-btn:hover { background:var(--orange); border-color:var(--orange); color:#fff; }
.leader-card .corner-accent { position:absolute; top:1.5rem; right:1.5rem; z-index:4; width:50px;height:50px; border-radius:14px; background:rgba(246,123,34,.15); border:1px solid rgba(246,123,34,.25); display:flex; align-items:center; justify-content:center; font-size:1.2rem; color:var(--orange); backdrop-filter:blur(8px); opacity:0; transform:scale(.8); transition:all .4s var(--ease-spring); }
.leader-card:hover .corner-accent { opacity:1; transform:scale(1); }
.team-tagline { text-align:center; padding:2rem 0 5rem; font-family:'Outfit',sans-serif; font-size:1rem; color:rgba(255,255,255,.35); letter-spacing:.15em; text-transform:uppercase; }
.team-tagline span { color:var(--orange); }

/* values banner on team page */
.values-banner { background:var(--bg-soft); padding:5rem 0; }
.values-banner-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; text-align:center; }
.vb-item { padding:2rem; }
.vb-icon { width:56px;height:56px; background:var(--orange-dim); border:1px solid rgba(246,123,34,.2); border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; color:var(--orange); margin:0 auto 1rem; transition:all .4s var(--ease-spring); }
.vb-item:hover .vb-icon { background:var(--orange); color:#fff; transform:rotate(6deg) scale(1.1); }
.vb-title { font-family:'Outfit',sans-serif; font-weight:700; font-size:1.05rem; color:var(--navy); margin-bottom:.5rem; }
.vb-desc { font-size:.85rem; color:var(--text-muted); line-height:1.6; }

/* ── RESPONSIVE ──────────────────────────── */
@media (max-width:1024px) {
  .hero-content          { padding-top: 170px; gap:2rem; }
  .about-grid            { grid-template-columns:1fr; gap:3rem; }
  .services-grid         { grid-template-columns:repeat(2,1fr); }
  .stats-grid            { grid-template-columns:repeat(2,1fr); }
  .process-steps         { grid-template-columns:repeat(2,1fr); }
  .process-steps::before { display:none; }
  .footer-grid           { grid-template-columns:1fr 1fr; }
  .service-detail-grid   { grid-template-columns:1fr; gap:3rem; }
  .service-detail-grid.reverse { direction:ltr; }
  .vision-mission-grid   { grid-template-columns:1fr; }
  .advantage-grid        { grid-template-columns:1fr; }
  .leadership-grid       { grid-template-columns:1fr; max-width:460px; }
  .values-banner-grid    { grid-template-columns:1fr; }
  .contact-grid          { grid-template-columns:1fr; gap:3rem; }
}

@media (max-width:768px) {
  .nav-links             { display:none; }
  .hamburger             { display:flex; }
  .hero-content          { padding-top: 130px; }
  .services-grid         { grid-template-columns:1fr; }
  .values-grid           { grid-template-columns:repeat(2,1fr); }
  .stats-grid            { grid-template-columns:repeat(2,1fr); }
  .process-steps         { grid-template-columns:1fr; gap:2.5rem; }
  .footer-grid           { grid-template-columns:1fr; gap:2.5rem; }
  .hero-stats            { flex-wrap:wrap; gap:2rem; margin-top:3rem; }
  .hero-title            { font-size:2.2rem; }
  .form-row              { grid-template-columns:1fr; }
  .about-image-accent    { width: 50%; right: -10px; bottom: -20px; border-width: 3px; }
  
  #mobile-nav a          { font-size: 1.75rem; }
}

@media (max-width:480px) {
  .container             { padding: 0 1.25rem; }
  .values-grid           { grid-template-columns:1fr; }
  .hero-ctas             { flex-direction:column; width: 100%; }
  .btn-primary, .btn-outline { justify-content:center; width: 100%; }
  .hero-stats            { gap:1.5rem; }
}