:root{
  --brand:#1f7a3a;
  --brand-2:#0b5ed7;
  --ink:#0f172a;
  --muted:#64748b;
  --surface:#ffffff;
  --soft:#f8fafc;
}
body{
  color:var(--ink);
  background:var(--soft);
}
.navbar-brand{
  letter-spacing:.2px;
}
.hero{
  position:relative;
  background:
    radial-gradient(1200px 600px at 10% 10%, rgba(31,122,58,.25), transparent 60%),
    radial-gradient(900px 500px at 90% 0%, rgba(11,94,215,.20), transparent 55%),
    linear-gradient(180deg, #0b1220 0%, #0b1220 35%, #0f172a 100%);
  color:#fff;
  overflow:hidden;
}
.hero > .container{
  position:relative;
  z-index:2;
}
.hero-season{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
}

.hero-season--winter{
  opacity:.55;
  background-image:
    radial-gradient(2px 2px at 10% 10%, rgba(255,255,255,.9) 60%, transparent 62%),
    radial-gradient(1.5px 1.5px at 30% 20%, rgba(255,255,255,.85) 60%, transparent 62%),
    radial-gradient(2.5px 2.5px at 55% 15%, rgba(255,255,255,.8) 60%, transparent 62%),
    radial-gradient(1.8px 1.8px at 75% 8%, rgba(255,255,255,.9) 60%, transparent 62%),
    radial-gradient(2px 2px at 90% 25%, rgba(255,255,255,.85) 60%, transparent 62%),
    radial-gradient(1.2px 1.2px at 20% 35%, rgba(255,255,255,.75) 60%, transparent 62%),
    radial-gradient(1.6px 1.6px at 45% 28%, rgba(255,255,255,.78) 60%, transparent 62%),
    radial-gradient(2.2px 2.2px at 65% 32%, rgba(255,255,255,.8) 60%, transparent 62%),
    radial-gradient(1.4px 1.4px at 85% 40%, rgba(255,255,255,.78) 60%, transparent 62%);
  background-size:
    280px 280px,
    360px 360px,
    420px 420px,
    520px 520px,
    640px 640px,
    220px 220px,
    300px 300px,
    380px 380px,
    460px 460px;
  background-repeat:repeat;
  animation: heroWinterSnow 22s linear infinite;
  mix-blend-mode:screen;
}
@keyframes heroWinterSnow{
  0%{
    background-position:
      0 -280px,
      0 -360px,
      0 -420px,
      0 -520px,
      0 -640px,
      0 -220px,
      0 -300px,
      0 -380px,
      0 -460px;
  }
  100%{
    background-position:
      80px 900px,
      -120px 1100px,
      140px 1300px,
      -180px 1600px,
      200px 1800px,
      50px 1000px,
      -90px 1200px,
      110px 1400px,
      -140px 1650px;
  }
}

.hero-season--spring{
  opacity:.55;
  background-image:
    radial-gradient(9px 4px at 12% 10%, rgba(163,230,53,.85) 60%, transparent 62%),
    radial-gradient(7px 3px at 28% 18%, rgba(34,197,94,.80) 60%, transparent 62%),
    radial-gradient(10px 4px at 52% 12%, rgba(250,204,21,.70) 60%, transparent 62%),
    radial-gradient(8px 3px at 76% 8%, rgba(34,197,94,.78) 60%, transparent 62%),
    radial-gradient(9px 4px at 88% 20%, rgba(163,230,53,.80) 60%, transparent 62%),
    radial-gradient(7px 3px at 20% 38%, rgba(250,204,21,.65) 60%, transparent 62%),
    radial-gradient(10px 4px at 64% 32%, rgba(34,197,94,.78) 60%, transparent 62%);
  background-size:
    420px 420px,
    520px 520px,
    620px 620px,
    760px 760px,
    900px 900px,
    480px 480px,
    700px 700px;
  background-repeat:repeat;
  animation: heroSpringLeaves 26s linear infinite;
  mix-blend-mode:screen;
}
@keyframes heroSpringLeaves{
  0%{
    background-position:
      0 -420px,
      0 -520px,
      0 -620px,
      0 -760px,
      0 -900px,
      0 -480px,
      0 -700px;
  }
  100%{
    background-position:
      120px 1200px,
      -160px 1400px,
      180px 1600px,
      -220px 1900px,
      260px 2100px,
      -140px 1500px,
      200px 1750px;
  }
}

.hero-season--autumn{
  opacity:.58;
  background-image:
    radial-gradient(5px 5px at 14% 12%, rgba(244,114,182,.80) 60%, transparent 62%),
    radial-gradient(6px 6px at 30% 20%, rgba(251,146,60,.70) 60%, transparent 62%),
    radial-gradient(5px 5px at 52% 10%, rgba(244,114,182,.78) 60%, transparent 62%),
    radial-gradient(7px 7px at 74% 16%, rgba(167,139,250,.72) 60%, transparent 62%),
    radial-gradient(6px 6px at 90% 24%, rgba(244,114,182,.76) 60%, transparent 62%),
    radial-gradient(5px 5px at 20% 40%, rgba(251,146,60,.65) 60%, transparent 62%),
    radial-gradient(7px 7px at 66% 34%, rgba(167,139,250,.68) 60%, transparent 62%);
  background-size:
    360px 360px,
    460px 460px,
    560px 560px,
    680px 680px,
    820px 820px,
    520px 520px,
    740px 740px;
  background-repeat:repeat;
  animation: heroAutumnFlowers 30s linear infinite;
  mix-blend-mode:screen;
}
@keyframes heroAutumnFlowers{
  0%{
    background-position:
      0 -360px,
      0 -460px,
      0 -560px,
      0 -680px,
      0 -820px,
      0 -520px,
      0 -740px;
  }
  100%{
    background-position:
      90px 1100px,
      -130px 1300px,
      150px 1500px,
      -190px 1750px,
      220px 1950px,
      -120px 1400px,
      170px 1650px;
  }
}

.hero-season--summer::before{
  content:"";
  position:absolute;
  top:32px;
  right:48px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.85), rgba(255,214,102,.85) 35%, rgba(255,179,0,.75) 62%, rgba(255,179,0,0) 70%);
  box-shadow:0 0 60px rgba(255,193,7,.28), 0 0 140px rgba(255,193,7,.20);
  opacity:.8;
}
.hero-season--summer::after{
  content:"";
  position:absolute;
  top:18px;
  right:34px;
  width:210px;
  height:210px;
  border-radius:50%;
  background:conic-gradient(from 0deg, rgba(255,193,7,0) 0 8deg, rgba(255,193,7,.28) 8deg 14deg, rgba(255,193,7,0) 14deg 22deg);
  mask:radial-gradient(circle, transparent 0 40%, #000 42% 100%);
  opacity:.65;
  animation: heroSunSpin 26s linear infinite;
}
@keyframes heroSunSpin{
  0%{ transform:rotate(0deg); }
  100%{ transform:rotate(360deg); }
}
.hero .badge{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
}
.hero-card{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
}
.home-section-logo{
  width:min(360px, 90vw);
  height:auto;
  display:inline-block;
  filter: drop-shadow(0 18px 34px rgba(15,23,42,.18));
}
.section{
  padding:4rem 0;
}
.section-compact-top{
  padding-top:2rem;
}
.card{
  border:0;
  border-radius:1rem;
}
.shadow-soft{
  box-shadow:0 12px 28px rgba(15,23,42,.10);
}
.icon-pill{
  width:44px;
  height:44px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(31,122,58,.10);
  color:var(--brand);
}
.service-card-img{
  width:100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  display:block;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}
.service-card-placeholder{
  width:100%;
  aspect-ratio: 4/3;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  background:
    radial-gradient(900px 500px at 10% 10%, rgba(31,122,58,.14), transparent 60%),
    radial-gradient(700px 450px at 90% 20%, rgba(11,94,215,.10), transparent 55%),
    linear-gradient(135deg, rgba(15,23,42,.08), rgba(15,23,42,.02));
}
.service-link{
  text-decoration:none;
  color:inherit;
}

.section-kicker-accent{
  display:inline-block;
  padding:.25rem .6rem;
  border-radius:999px;
  background:rgba(31,122,58,.10);
  color:var(--brand)!important;
  font-weight:700;
}

.section-heading-accent{
  display:inline-block;
  position:relative;
}
.section-heading-accent::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-.2rem;
  height:.45rem;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(31,122,58,.28), rgba(11,94,215,.18));
  z-index:-1;
}
.service-link:hover .card{
  transform: translateY(-2px);
  transition: transform .15s ease;
}
.list-chips{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.chip{
  padding:.35rem .6rem;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(15,23,42,.10);
  color:var(--muted);
  font-size:.9rem;
}
.footer{
  background:#0b1220;
  color:rgba(255,255,255,.86);
}
.footer a{
  color:rgba(255,255,255,.86);
}
.footer a:hover{
  color:#fff;
}
.form-control, .form-select{
  border-radius:.85rem;
}
.btn{
  border-radius:.9rem;
}
.btn-brand{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
}
.btn-brand:hover{
  background:#17632f;
  border-color:#17632f;
  color:#fff;
}
.btn-brand:focus,
.btn-brand:active,
.btn-brand.active{
  color:#fff;
}
.text-muted{
  color:var(--muted)!important;
}

.project-carousel img,
.project-cover{
  aspect-ratio: 4/3;
  object-fit: cover;
}
.project-cover-placeholder{
  aspect-ratio: 4/3;
  background:linear-gradient(135deg, rgba(31,122,58,.12), rgba(11,94,215,.10));
}
.project-carousel .carousel-control-prev-icon,
.project-carousel .carousel-control-next-icon{
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.35));
}

.service-carousel .carousel-control-prev-icon,
.service-carousel .carousel-control-next-icon{
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.35));
}
.service-carousel-placeholder{
  aspect-ratio: 4/3;
  background:
    radial-gradient(900px 500px at 10% 10%, rgba(31,122,58,.18), transparent 60%),
    radial-gradient(700px 450px at 90% 20%, rgba(11,94,215,.14), transparent 55%),
    linear-gradient(135deg, rgba(15,23,42,.10), rgba(15,23,42,.02));
}
.service-carousel-placeholder-2{
  background:
    radial-gradient(900px 500px at 80% 10%, rgba(31,122,58,.16), transparent 60%),
    radial-gradient(700px 450px at 10% 50%, rgba(11,94,215,.14), transparent 55%),
    linear-gradient(135deg, rgba(15,23,42,.10), rgba(15,23,42,.02));
}
.service-carousel-placeholder-3{
  background:
    radial-gradient(900px 500px at 20% 20%, rgba(31,122,58,.18), transparent 60%),
    radial-gradient(700px 450px at 90% 70%, rgba(11,94,215,.14), transparent 55%),
    linear-gradient(135deg, rgba(15,23,42,.10), rgba(15,23,42,.02));
}

.snow-fall{
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 50;
  opacity: .55;
  background-image:
    radial-gradient(2px 2px at 10% 10%, rgba(255,255,255,.9) 60%, transparent 62%),
    radial-gradient(1.5px 1.5px at 30% 20%, rgba(255,255,255,.85) 60%, transparent 62%),
    radial-gradient(2.5px 2.5px at 55% 15%, rgba(255,255,255,.8) 60%, transparent 62%),
    radial-gradient(1.8px 1.8px at 75% 8%, rgba(255,255,255,.9) 60%, transparent 62%),
    radial-gradient(2px 2px at 90% 25%, rgba(255,255,255,.85) 60%, transparent 62%),
    radial-gradient(1.2px 1.2px at 20% 35%, rgba(255,255,255,.75) 60%, transparent 62%),
    radial-gradient(1.6px 1.6px at 45% 28%, rgba(255,255,255,.78) 60%, transparent 62%),
    radial-gradient(2.2px 2.2px at 65% 32%, rgba(255,255,255,.8) 60%, transparent 62%),
    radial-gradient(1.4px 1.4px at 85% 40%, rgba(255,255,255,.78) 60%, transparent 62%),
    radial-gradient(2.1px 2.1px at 5% 55%, rgba(255,255,255,.82) 60%, transparent 62%),
    radial-gradient(1.3px 1.3px at 95% 60%, rgba(255,255,255,.75) 60%, transparent 62%);
  background-size:
    280px 280px,
    360px 360px,
    420px 420px,
    520px 520px,
    640px 640px,
    220px 220px,
    300px 300px,
    380px 380px,
    460px 460px,
    560px 560px,
    700px 700px;
  background-repeat: repeat;
  animation: snowFall 18s linear infinite;
  mix-blend-mode: screen;
}

@keyframes snowFall{
  0%{
    background-position:
      0 -300px,
      0 -360px,
      0 -420px,
      0 -520px,
      0 -640px,
      0 -220px,
      0 -300px,
      0 -380px,
      0 -460px,
      0 -560px,
      0 -700px;
  }
  100%{
    background-position:
      80px 700px,
      -120px 900px,
      140px 1100px,
      -180px 1400px,
      200px 1600px,
      50px 900px,
      -90px 1100px,
      110px 1300px,
      -140px 1500px,
      160px 1700px,
      -200px 1900px;
  }
}
