:root{
  --navy:#102946;
  --navy-2:#193a63;
  --green:#5b7d40;
  --green-2:#6f9250;
  --bg:#f4f6f8;
  --text:#213041;
  --muted:#627183;
  --line:#dde5ed;
  --white:#ffffff;
  --shadow:0 18px 44px rgba(16,41,70,.12);
  --shadow-soft:0 10px 24px rgba(16,41,70,.08);
  --radius:26px;
  --max:1180px;
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top right, rgba(16,41,70,.06), transparent 28%),
    linear-gradient(180deg, #f8fafb 0%, #eff3f6 100%);
}

a{
  text-decoration:none;
  color:inherit;
}

img{
  max-width:100%;
  display:block;
}

.container{
  width:min(calc(100% - 32px), var(--max));
  margin-inline:auto;
}

/* Header */

.topbar{
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter:blur(12px);
  background:rgba(248,250,251,.88);
  border-bottom:1px solid rgba(16,41,70,.08);
}

.nav{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}

.brand{
  display:flex;
  align-items:center;
  gap:14px;
}

.brand-badge{
  width:46px;
  height:46px;
  border-radius:14px;
  background:linear-gradient(135deg, var(--green), var(--navy));
  box-shadow:var(--shadow-soft);
  position:relative;
  overflow:hidden;
}

.brand-badge::before,
.brand-badge::after{
  content:"";
  position:absolute;
  border-radius:10px;
  transform:rotate(28deg);
}

.brand-badge::before{
  width:26px;
  height:26px;
  left:4px;
  top:11px;
  background:rgba(255,255,255,.92);
  clip-path:polygon(0 100%, 45% 0, 100% 80%);
}

.brand-badge::after{
  width:16px;
  height:28px;
  right:7px;
  top:8px;
  background:rgba(255,255,255,.72);
  clip-path:polygon(0 100%, 55% 0, 100% 12%, 44% 100%);
}

.brand h1{
  margin:0;
  font-size:1rem;
  line-height:1.05;
  color:var(--navy);
  letter-spacing:.03em;
}

.brand small{
  display:block;
  margin-top:4px;
  color:var(--green);
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.72rem;
}

.menu{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}

.menu a.link{
  color:var(--muted);
  font-weight:700;
  font-size:.95rem;
  transition:.2s ease;
}

.menu a.link:hover,
.menu a.link.active{
  color:var(--navy);
}

/* Buttons */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  font-weight:800;
  transition:.2s ease;
  border:1px solid transparent;
  cursor:pointer;
  font:inherit;
}

.btn-primary{
  background:linear-gradient(135deg, var(--green), var(--navy));
  color:#fff;
  box-shadow:0 10px 24px rgba(16,41,70,.18);
}

.btn-primary:hover{
  transform:translateY(-1px);
}

.btn-secondary{
  background:#fff;
  color:var(--navy);
  border-color:rgba(16,41,70,.10);
}

.btn-secondary:hover{
  border-color:rgba(16,41,70,.18);
  transform:translateY(-1px);
}

/* Hero */

.hero{
  padding:64px 0 42px;
  position:relative;
  overflow:hidden;
}

.hero::after{
  content:"";
  position:absolute;
  right:-140px;
  bottom:-110px;
  width:560px;
  height:220px;
  background:linear-gradient(90deg, rgba(91,125,64,.85), rgba(16,41,70,.92));
  border-top-left-radius:320px 150px;
  transform:rotate(-6deg);
  opacity:.11;
  pointer-events:none;
}

.hero-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:32px;
  align-items:center;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  border:1px solid rgba(16,41,70,.08);
  background:#fff;
  padding:10px 14px;
  border-radius:999px;
  color:var(--green);
  font-weight:800;
  box-shadow:var(--shadow-soft);
  font-size:.9rem;
}

.hero h2{
  margin:18px 0 14px;
  font-size:clamp(2.2rem, 5vw, 4.2rem);
  line-height:1.02;
  letter-spacing:-.03em;
  color:var(--navy);
  max-width:12ch;
}

.hero h2 span{
  color:var(--green);
}

.hero p{
  margin:0 0 24px;
  color:var(--muted);
  line-height:1.85;
  font-size:1.05rem;
  max-width:62ch;
}

.hero-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:22px;
}

.highlights{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.highlight{
  background:rgba(255,255,255,.84);
  border:1px solid rgba(16,41,70,.08);
  border-radius:20px;
  padding:18px;
  box-shadow:var(--shadow-soft);
}

.highlight strong{
  display:block;
  color:var(--navy);
  font-size:1.05rem;
  margin-bottom:8px;
}

.highlight span{
  color:var(--muted);
  line-height:1.65;
  font-size:.94rem;
}

.card-visual{
  background:linear-gradient(180deg,#fff,#fafbfd);
  border:1px solid rgba(16,41,70,.08);
  border-radius:32px;
  box-shadow:0 20px 46px rgba(16,41,70,.14);
  padding:18px;
  overflow:hidden;
  position:relative;
}

.card-visual::after{
  content:"";
  position:absolute;
  left:30%;
  right:-5%;
  bottom:-34px;
  height:110px;
  background:linear-gradient(90deg, var(--green), #0f6b80, var(--navy));
  border-top-left-radius:220px 90px;
  transform:rotate(-2deg);
  opacity:.9;
}

.business-card-shot{
  position:relative;
  z-index:1;
  border-radius:24px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#fff;
}

/* Sections */

section{
  padding:44px 0;
}

.page-hero{
  padding:58px 0 22px;
}

.page-hero h2{
  margin:0 0 14px;
  font-size:clamp(2rem, 4vw, 3.5rem);
  color:var(--navy);
  letter-spacing:-.03em;
}

.page-hero p{
  margin:0;
  color:var(--muted);
  line-height:1.85;
  max-width:74ch;
  font-size:1.02rem;
}

.section-head{
  margin-bottom:28px;
}

.section-head h3{
  margin:0 0 12px;
  font-size:clamp(1.8rem, 3vw, 2.7rem);
  color:var(--navy);
  letter-spacing:-.02em;
}

.section-head p{
  margin:0;
  color:var(--muted);
  line-height:1.85;
  max-width:76ch;
  font-size:1rem;
}

/* Grid */

.grid-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}

.grid-2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}

/* Cards */

.card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  padding:26px;
  box-shadow:var(--shadow);
  height:100%;
}

.tag{
  display:inline-block;
  margin-bottom:14px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(91,125,64,.12);
  color:var(--green);
  font-weight:800;
  font-size:.84rem;
  letter-spacing:.01em;
}

.card h4{
  margin:0 0 12px;
  color:var(--navy);
  font-size:1.18rem;
  line-height:1.35;
}

.card p,
.card li{
  color:var(--muted);
  line-height:1.8;
  font-size:.98rem;
}

.card p{
  margin:0;
}

.card p + ul{
  margin-top:16px;
}

.card ul{
  margin:0;
  padding-left:0;
  list-style:none;
  display:grid;
  gap:10px;
}

.card li{
  position:relative;
  padding-left:22px;
}

.card li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--green), var(--navy));
  transform:translateY(-50%);
}

/* Stats */

.stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

.stat{
  background:linear-gradient(180deg,#fff,#fbfcfd);
  border:1px solid var(--line);
  border-radius:22px;
  padding:24px;
  box-shadow:var(--shadow-soft);
}

.stat .value{
  font-size:clamp(1.7rem, 3vw, 2.6rem);
  font-weight:900;
  color:var(--navy);
  line-height:1.05;
  margin-bottom:10px;
}

.stat .label{
  color:var(--muted);
  line-height:1.65;
  font-size:.96rem;
}

/* Timeline */

.timeline{
  display:grid;
  gap:16px;
}

.step{
  display:grid;
  grid-template-columns:66px 1fr;
  gap:16px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  padding:20px;
  box-shadow:var(--shadow-soft);
}

.step-num{
  width:66px;
  height:66px;
  border-radius:18px;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:900;
  font-size:1.15rem;
  background:linear-gradient(135deg,var(--green),var(--navy));
}

.step h4{
  margin:2px 0 8px;
  color:var(--navy);
  font-size:1.12rem;
}

.step p{
  margin:0;
  color:var(--muted);
  line-height:1.8;
}

/* CTA */

.cta-panel{
  margin-top:20px;
  background:linear-gradient(135deg, var(--navy), #1d4d78 58%, var(--green));
  color:#fff;
  border-radius:28px;
  padding:30px;
  box-shadow:0 20px 38px rgba(16,41,70,.18);
}

.cta-panel h4{
  margin:0 0 10px;
  font-size:1.5rem;
  line-height:1.25;
}

.cta-panel p{
  margin:0;
  color:rgba(255,255,255,.9);
  line-height:1.8;
  max-width:70ch;
}

/* Contact */

.contact-wrap{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:20px;
}

.contact-links{
  display:grid;
  gap:12px;
  margin-top:18px;
}

.contact-link{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  background:#fbfcfd;
  border:1px solid var(--line);
  border-radius:18px;
  transition:.2s ease;
}

.contact-link:hover{
  transform:translateY(-1px);
  border-color:rgba(16,41,70,.16);
}

.icon{
  width:42px;
  height:42px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--green),var(--navy));
  color:#fff;
  font-size:1rem;
  flex:0 0 auto;
  box-shadow:0 10px 22px rgba(16,41,70,.16);
}

.mini{
  color:var(--muted);
  line-height:1.8;
  font-size:.97rem;
}

.contact-card{
  background:linear-gradient(180deg,#f9fcf9,#eef4ef);
  border:1px solid rgba(91,125,64,.18);
  border-radius:24px;
  padding:24px;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.contact-card h4{
  margin:0 0 10px;
  color:var(--navy);
  font-size:1.35rem;
}

.contact-card p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.8;
}

/* Form */

.form{
  display:grid;
  gap:14px;
}

.form input,
.form textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px 16px;
  font:inherit;
  color:var(--text);
  background:#fff;
  transition:border-color .2s ease, box-shadow .2s ease;
}

.form input:focus,
.form textarea:focus{
  outline:none;
  border-color:rgba(16,41,70,.22);
  box-shadow:0 0 0 4px rgba(16,41,70,.06);
}

.form textarea{
  min-height:140px;
  resize:vertical;
}

/* Footer */

.footer{
  padding:28px 0 42px;
}

.footer-box{
  border-top:1px solid rgba(16,41,70,.10);
  padding-top:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:.94rem;
}

/* Animations */

.reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s ease, transform .7s ease;
}

.reveal.visible{
  opacity:1;
  transform:none;
}

/* Responsive */

@media (max-width: 1024px){
  .hero-grid,
  .grid-3,
  .grid-2,
  .stats,
  .contact-wrap,
  .highlights{
    grid-template-columns:1fr;
  }

  .hero h2{
    max-width:none;
  }
}

@media (max-width: 760px){
  .topbar{
    position:static;
  }

  .hero{
    padding-top:34px;
  }

  .step{
    grid-template-columns:1fr;
  }

  .menu{
    gap:12px;
  }

  .menu a.link{
    font-size:.92rem;
  }

  .card,
  .stat,
  .contact-card,
  .cta-panel{
    padding:20px;
  }

  section{
    padding:34px 0;
  }

  .hero p,
  .page-hero p,
  .section-head p,
  .card p,
  .card li,
  .mini,
  .cta-panel p{
    line-height:1.72;
  }
}