:root{
  --color-navy:#1B2951;
  --color-white:#FFFFFF;
  --color-sage:#7BA05B;
  --color-sage-600:#6B8F4B;
  --color-warm-gray:#F8F9FA;
  --color-soft-blue:#E8F4FD;
  --color-success:#10B981;

  --text-primary:#1B2951;
  --text-secondary:#64748B;
  --text-muted:#94A3B8;
  --border:#E2E8F0;
  --border-focus:#7BA05B;
  --shadow:0 2px 8px rgba(27,41,81,.08);
  --shadow-hover:0 8px 24px rgba(27,41,81,.12);

  --space-1:.25rem;
  --space-2:.5rem;
  --space-3:.75rem;
  --space-4:1rem;
  --space-5:1.25rem;
  --space-6:1.5rem;
  --space-8:2rem;
  --space-10:2.5rem;
  --space-12:3rem;
  --space-16:4rem;
  --space-20:5rem;
  --space-24:6rem;
  --space-32:8rem;

  --ease-standard:cubic-bezier(.4,0,.2,1);
  --ease-decelerate:cubic-bezier(0,0,.2,1);
  --ease-accelerate:cubic-bezier(.4,0,1,1);

  --duration-fast:.15s;
  --duration-standard:.2s;
  --duration-slow:.3s;
  --duration-slower:.5s;

  --breakpoint-sm:640px;
  --breakpoint-md:768px;
  --breakpoint-lg:1024px;
  --breakpoint-xl:1280px;
  --breakpoint-2xl:1536px;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  color:var(--text-primary);
  background:var(--color-white);
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

.container{max-width:1280px;margin:0 auto;padding:0 1.5rem}
.container-sm{max-width:640px;margin:0 auto;padding:0 1.5rem}
.container-md{max-width:768px;margin:0 auto;padding:0 1.5rem}
.container-lg{max-width:1024px;margin:0 auto;padding:0 1.5rem}
.container-xl{max-width:1280px;margin:0 auto;padding:0 1.5rem}
.container-2xl{max-width:1536px;margin:0 auto;padding:0 1.5rem}

.grid{display:grid;gap:var(--space-6)}
.grid-cols-1{grid-template-columns:repeat(1,1fr)}
.grid-cols-2{grid-template-columns:repeat(2,1fr)}
.grid-cols-3{grid-template-columns:repeat(3,1fr)}
.grid-cols-4{grid-template-columns:repeat(4,1fr)}
.grid-cols-12{grid-template-columns:repeat(12,1fr)}

.section-padding-sm{padding:var(--space-16) 0}
.section-padding{padding:var(--space-24) 0}
.section-padding-lg{padding:var(--space-32) 0}
.component-spacing{margin-bottom:var(--space-12)}
.element-spacing{margin-bottom:var(--space-6)}

.text-display{
  font-family:'Poppins',sans-serif;
  font-size:3.5rem;line-height:1.1;font-weight:600;letter-spacing:-.02em;color:var(--text-primary)
}
.text-h1{
  font-family:'Poppins',sans-serif;
  font-size:2.5rem;line-height:1.2;font-weight:600;letter-spacing:-.01em;color:var(--text-primary)
}
.text-h2{font-size:2rem;line-height:1.25;font-weight:500;color:var(--text-primary)}
.text-h3{font-size:1.5rem;line-height:1.33;font-weight:500;color:var(--text-primary)}
.text-h4{font-size:1.25rem;line-height:1.4;font-weight:500;color:var(--text-primary)}
.text-body-large{font-size:1.125rem;line-height:1.6;color:var(--text-secondary)}
.text-body{font-size:1rem;line-height:1.6;color:var(--text-secondary)}
.text-body-small{font-size:.875rem;line-height:1.5;color:var(--text-muted)}
.text-caption{font-size:.75rem;line-height:1.4;color:var(--text-muted)}

@media (max-width:768px){
  .text-display{font-size:2.5rem}
  .text-h1{font-size:2rem}
  .text-h2{font-size:1.75rem}
  .text-h3{font-size:1.25rem}
  .section-padding-lg,.section-padding{padding:calc(var(--space-24)/2) 0}
  .section-padding-sm{padding:calc(var(--space-16)/2) 0}
  .grid{gap:var(--space-4)}
}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:6px;font-weight:500;cursor:pointer;transition:all var(--duration-standard) var(--ease-standard);border:none}
.btn-primary{font-size:1rem;padding:.75rem 2rem;background:var(--color-sage);color:var(--color-white);box-shadow:0 2px 4px rgba(123,160,91,.2)}
.btn-primary:hover{background:var(--color-sage-600);transform:translateY(-1px);box-shadow:0 4px 8px rgba(123,160,91,.3)}
.btn-primary:active{transform:translateY(0);box-shadow:0 2px 4px rgba(123,160,91,.2)}
.btn-secondary{font-size:1rem;padding:.75rem 2rem;background:var(--color-white);color:var(--color-navy);border:2px solid var(--color-navy)}
.btn-secondary:hover{background:var(--color-navy);color:var(--color-white);transform:translateY(-1px);box-shadow:0 4px 8px rgba(27,41,81,.2)}
.btn-sm{padding:.5rem 1.5rem;font-size:.875rem}
.btn-lg{padding:1rem 2.5rem;font-size:1.125rem}

.input{font-size:1rem;padding:.75rem 1rem;border:2px solid var(--border);border-radius:6px;background:var(--color-white);color:var(--text-primary);transition:all var(--duration-standard) var(--ease-standard);width:100%}
.input:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 3px rgba(123,160,91,.1)}
.input::placeholder{color:var(--text-muted)}
.label{font-size:.875rem;font-weight:500;color:var(--text-primary);margin-bottom:.5rem;display:block}

.card{background:var(--color-white);border-radius:8px;padding:var(--space-6);box-shadow:var(--shadow);border:1px solid var(--border);transition:all .3s var(--ease-standard)}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}
.service-card{background:var(--color-white);border-radius:8px;padding:var(--space-8);box-shadow:var(--shadow);border:1px solid var(--border);border-left:4px solid var(--color-sage);transition:all .3s var(--ease-standard);position:relative;overflow:hidden}
.service-card:hover{transform:scale(1.02);box-shadow:0 12px 32px rgba(27,41,81,.16);border-left-color:var(--color-sage-600)}
.badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:999px;border:1px solid var(--border);background:var(--color-white);color:var(--text-secondary)}
.check{width:18px;height:18px;display:inline-block;background:var(--color-success);border-radius:50%;position:relative}
.check::after{content:'';position:absolute;left:5px;top:2px;width:5px;height:9px;border:2px solid var(--color-white);border-top:0;border-left:0;transform:rotate(45deg)}

.focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}

.hover-lift{transition:transform var(--duration-standard) var(--ease-standard),box-shadow var(--duration-standard) var(--ease-standard)}
.hover-lift:hover{transform:translateY(-2px)}
.hover-scale{transition:transform var(--duration-standard) var(--ease-standard)}
.hover-scale:hover{transform:scale(1.02)}

.loading-sweep{position:relative;overflow:hidden}
.loading-sweep::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(123,160,91,.2),transparent);animation:sweep 1.5s infinite}
@keyframes sweep{0%{left:-100%}100%{left:100%}}

.fade-in{opacity:0;transform:translateY(20px);animation:fadeInUp var(--duration-slow) var(--ease-decelerate) forwards}
@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}

.topbar{position:sticky;top:0;z-index:50;background:var(--color-white);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:.75rem}
.brand-mark{width:36px;height:36px;border-radius:8px;background:var(--color-navy);display:grid;place-items:center;color:var(--color-white);font-weight:600}
.brand-name{font-weight:600;color:var(--text-primary)}
.nav-links{display:flex;gap:1.25rem;align-items:center}
.nav-links a{color:var(--text-primary);font-weight:500}
.nav-cta{display:flex;gap:.75rem;align-items:center}
.menu-btn{display:none;border:1px solid var(--border);background:var(--color-white);border-radius:6px;padding:.5rem}
@media (max-width:1024px){
  .nav-links{display:none}
  .menu-btn{display:inline-flex}
  .mobile-menu{display:none;flex-direction:column;gap:1rem;padding:1rem;border-top:1px solid var(--border)}
  .mobile-menu.open{display:flex}
}

/* Add this to ensure mobile menu is hidden on desktop */
@media (min-width:1025px){
  .mobile-menu{display:none !important}
  .menu-btn{display:none}
}

.hero{background:linear-gradient(180deg,var(--color-white),var(--color-warm-gray))}
.hero-wrap{display:grid;gap:var(--space-12);grid-template-columns:1.1fr .9fr;align-items:center}
@media (max-width:1024px){.hero-wrap{grid-template-columns:1fr}}
.hero-badges{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:var(--space-6)}
.illus{background:var(--color-soft-blue);border:1px solid var(--border);border-radius:12px;padding:var(--space-6);box-shadow:var(--shadow)}
.illus-blob{width:100%;aspect-ratio:4/3;background:radial-gradient(1200px 600px at 0% 0%,rgba(123,160,91,.25),transparent),radial-gradient(800px 400px at 100% 100%,rgba(27,41,81,.15),transparent),linear-gradient(135deg,rgba(232,244,253,1),rgba(255,255,255,1));border-radius:10px;position:relative;overflow:hidden}
.illus-blob::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(27,41,81,.04) 0 2px,transparent 2px 8px)}
.illus-caption{margin-top:.75rem;color:var(--text-muted);text-align:center}

.section-muted{background:var(--color-warm-gray)}
.kpis{display:grid;gap:var(--space-6);grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.kpis{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.kpis{grid-template-columns:1fr}}
.kpi{padding:var(--space-8);border:1px solid var(--border);border-radius:12px;background:var(--color-white);text-align:center}
.kpi .num{font-family:'Poppins',sans-serif;font-weight:600;font-size:2rem;color:var(--text-primary)}
.kpi .label{color:var(--text-secondary)}

.service-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(3,1fr)}
@media (max-width:1024px){.service-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.service-grid{grid-template-columns:1fr}}

.process-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.process-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.process-grid{grid-template-columns:1fr}}
.step-num{width:36px;height:36px;border-radius:999px;background:var(--color-sage);color:#fff;display:grid;place-items:center;font-weight:600}

.testimonial-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(3,1fr)}
@media (max-width:1024px){.testimonial-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.testimonial-grid{grid-template-columns:1fr}}
.quote{font-style:italic;color:var(--text-secondary)}
.author{margin-top:.75rem;font-weight:600;color:var(--text-primary)}

.cta{background:linear-gradient(135deg, var(--color-soft-blue), #fff)}
.cta-wrap{display:grid;gap:var(--space-8);grid-template-columns:1.2fr .8fr;align-items:center}
@media (max-width:1024px){.cta-wrap{grid-template-columns:1fr}}

.form-grid{display:grid;gap:var(--space-6);grid-template-columns:repeat(2,1fr)}
.form-grid .full{grid-column:1/-1}
@media (max-width:768px){.form-grid{grid-template-columns:1fr}}

.footer{background:var(--color-white);border-top:1px solid var(--border)}
.footer-grid{display:grid;gap:var(--space-8);grid-template-columns:2fr 1fr 1fr 1.2fr}
@media (max-width:1024px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.footer-grid{grid-template-columns:1fr}}
.footer a{color:var(--text-secondary)}
.copyright{border-top:1px solid var(--border);margin-top:var(--space-8);padding-top:var(--space-6);color:var(--text-muted);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

.notice{padding:.75rem 1rem;border-radius:8px;border:1px solid var(--border);background:var(--color-soft-blue);color:var(--text-primary)}
.success{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.25);color:#065F46}
.error{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.25);color:#7F1D1D}
.illus-gallery {
  position: relative;
  width: 100%;
  max-width: 500px;
  height: 300px; /* Add a fixed height */
  overflow: hidden;
  border-radius: 10px; /* Optional: for better appearance */
}

.gallery-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* This ensures images cover the container properly */
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.gallery-image.active {
  opacity: 1;
  /* Remove the conflicting position: relative */
}

/* Privacy Policy Page Styles */
.privacy-content h2 {
  margin-top: var(--space-8);
  margin-bottom: var(--space-4);
}

.privacy-content h3 {
  margin-top: var(--space-6);
  margin-bottom: var(--space-3);
}

.privacy-content p {
  margin-bottom: var(--space-4);
}

.privacy-content ul, .privacy-content ol {
  margin-bottom: var(--space-4);
  padding-left: var(--space-6);
}

.privacy-content li {
  margin-bottom: var(--space-2);
}