/* ============ RESET & BASE ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 20px)}
body{
  font-family:var(--font-body);
  background:var(--green-tint);
  color:var(--ink);
  line-height:1.7;
  font-size:16px;
  font-weight:400;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  letter-spacing:.005em;
}
h1,h2,h3,h4,h5{font-family:var(--font-display);line-height:1.18;letter-spacing:-.02em;font-weight:700}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}
ul,ol{list-style:none}
input,textarea,select{font-family:inherit;font-size:inherit}

/* ============ LAYOUT UTILS ============ */
.container{max-width:var(--container);margin:0 auto;padding:0 32px;width:100%}
.container--narrow{max-width:var(--container-narrow)}
.container--wide{max-width:var(--container-wide)}
.section{padding:100px 0}
.section--white{background:var(--white)}
.section--tint{background:var(--green-tint)}
.section--green{background:var(--green);color:var(--white)}
.section--ink{background:var(--ink);color:var(--white)}
.section--gray{background:var(--gray-bg)}
.center{text-align:center}
.mt-0{margin-top:0!important}
.mt-16{margin-top:16px}
.mt-24{margin-top:24px}
.mt-32{margin-top:32px}
.mt-48{margin-top:48px}
.mb-0{margin-bottom:0!important}
.mb-16{margin-bottom:16px}
.mb-24{margin-bottom:24px}
.mb-32{margin-bottom:32px}
.mb-48{margin-bottom:48px}
.hidden{display:none!important}

/* ============ SECTION HEAD ============ */
.section-head{max-width:680px;margin:0 auto 56px;text-align:center}
.section-head .tag{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:9999px;background:rgba(46,173,85,.1);margin-bottom:16px}
.section-head .tag .dot{width:6px;height:6px;border-radius:50%;background:var(--green)}
.section-head .tag span{font-family:var(--font-display);font-size:12px;font-weight:600;color:var(--green-dark);letter-spacing:.15em}
.section-head h2{font-size:clamp(28px,5vw,44px);font-weight:700;color:var(--ink);margin-bottom:14px}
.section-head p{font-size:17px;color:var(--gray);line-height:1.7}
.section--green .section-head h2,.section--ink .section-head h2{color:var(--white)}
.section--green .section-head p,.section--ink .section-head p{color:rgba(255,255,255,.85)}
.section--green .section-head .tag,.section--ink .section-head .tag{background:rgba(255,255,255,.15)}
.section--green .section-head .tag span,.section--ink .section-head .tag span{color:var(--white)}
.section--green .section-head .tag .dot,.section--ink .section-head .tag .dot{background:var(--white)}

/* Section head left-aligned variant */
.section-head--left{text-align:left;margin-left:0;margin-right:0}
.section-head--left h2{font-size:clamp(28px,4vw,40px)}

/* ============ PAGE HERO (subpages) ============ */
.page-hero{padding:120px 0 80px;background:var(--green-tint);text-align:center;position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;top:-150px;right:-150px;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(46,173,85,.08),transparent 70%);pointer-events:none}
.page-hero__inner{position:relative;z-index:1;max-width:760px;margin:0 auto}
.page-hero .breadcrumb{font-family:var(--font-display);font-size:13px;font-weight:500;color:var(--gray-light);margin-bottom:20px}
.page-hero .breadcrumb a:hover{color:var(--green)}
.page-hero h1{font-size:clamp(32px,5vw,52px);font-weight:700;color:var(--ink);margin-bottom:18px;letter-spacing:-.02em}
.page-hero p{font-size:17px;color:var(--gray);line-height:1.7;max-width:580px;margin:0 auto}

/* Particles animation */
.particles{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.particle{position:absolute;background:rgba(46,173,85,.5);border-radius:50%;animation:float linear infinite}
@keyframes float{
  0%{transform:translate(0,0) scale(1);opacity:0.6}
  25%{transform:translate(10px,-30px) scale(1.1);opacity:0.8}
  50%{transform:translate(-5px,-60px) scale(0.9);opacity:0.5}
  75%{transform:translate(15px,-90px) scale(1.05);opacity:0.7}
  100%{transform:translate(0,-120px) scale(0.8);opacity:0}
}
.particle:nth-child(1){left:10%;top:20%;width:12px;height:12px;animation-duration:8s;animation-delay:0s}
.particle:nth-child(2){left:25%;top:60%;width:8px;height:8px;animation-duration:10s;animation-delay:1s}
.particle:nth-child(3){left:40%;top:40%;width:15px;height:15px;animation-duration:9s;animation-delay:0.5s}
.particle:nth-child(4){left:55%;top:75%;width:10px;height:10px;animation-duration:11s;animation-delay:2s}
.particle:nth-child(5){left:70%;top:30%;width:6px;height:6px;animation-duration:7s;animation-delay:1.5s}
.particle:nth-child(6){left:85%;top:50%;width:14px;height:14px;animation-duration:10s;animation-delay:0.8s}
.particle:nth-child(7){left:15%;top:80%;width:9px;height:9px;animation-duration:8s;animation-delay:2.5s}
.particle:nth-child(8){left:50%;top:15%;width:11px;height:11px;animation-duration:9s;animation-delay:1.2s}
.particle:nth-child(9){left:30%;top:90%;width:7px;height:7px;animation-duration:11s;animation-delay:3s}
.particle:nth-child(10){left:75%;top:45%;width:13px;height:13px;animation-duration:8s;animation-delay:0.3s}
