:root{
  --olive:#616C0D;
  --deep:#283720;
  --olive2:#3E4705;
  --cream:#E1E1C3;
  --charcoal:#2E2C2C;
  --bg:#d6cfad;
  --surface:rgba(225,225,195,.78);
  --surface2:rgba(225,225,195,.92);
  --text:var(--charcoal);
  --muted:rgba(46,44,44,.72);
  --line:rgba(46,44,44,.16);
  --shadow:0 14px 30px rgba(0,0,0,.12);
  --shadow2:0 10px 18px rgba(0,0,0,.10);
  --radius:16px;
  --radius2:24px;
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(1200px 700px at 16% -10%, rgba(97,108,13,.18), transparent 60%),
    radial-gradient(900px 600px at 96% 26%, rgba(40,55,32,.16), transparent 55%),
    radial-gradient(1000px 700px at 40% 105%, rgba(62,71,5,.12), transparent 55%),
    linear-gradient(180deg, var(--bg), var(--cream));
  line-height:1.55;
}

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

.container{
  max-width:var(--max);
  margin:0 auto;
  padding:0 clamp(14px, 4vw, 22px);
}

.no-scroll{overflow:hidden}

.topbar{
  padding:10px 0;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(40,55,32,.96), rgba(40,55,32,.90));
  backdrop-filter:blur(8px);
}
.topbar__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-size:14px;
}
.topbar__brand{
  font-weight:500;
  letter-spacing:.4px;
  padding:7px 12px;
  border-radius:8px;
  color:rgba(255,255,255,.92);
  transition:.18s ease;
}
.topbar__brand:hover{
  background:transparent;
  transform:none;
}
.topbar__right{
  display:flex;
  align-items:center;
  gap:10px;
}
.topbar__link{
  font:inherit;
  color:rgba(255,255,255,.90);
  background:transparent;
  border:1px solid rgba(225,225,195,.18);
  cursor:pointer;
  padding:7px 12px;
  border-radius:8px;
  transition:.18s ease;
}
.topbar__link:hover{
  background:rgba(225,225,195,.14);
  transform:translateY(-1px);
}
.topbar__user{
  color:rgba(255,255,255,.92);
  font-weight:600;
  padding:0 2px;
}
.topbar__link--danger{
  color:#ffd7d7;
  border-color:rgba(255,120,120,.5);
  background:rgba(180,40,40,.24);
}
.topbar__link--danger:hover{
  background:rgba(200,50,50,.35);
}
.social{
  width:38px;height:38px;
  display:grid;
  place-items:center;
  border-radius:8px;
  border:1px solid rgba(225,225,195,.18);
  color:rgba(255,255,255,.92);
  background:rgba(225,225,195,.10);
  transition:.18s ease;
}
.social:hover{
  background:rgba(225,225,195,.18);
  transform:translateY(-1px);
}

header{
  position:sticky;
  top:0;
  z-index:50;
  background:linear-gradient(180deg, rgba(40,55,32,.92), rgba(40,55,32,.85));
  border-bottom:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(8px);
}
.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 0;
  gap:12px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:190px;
}
.logo{
  width:52px;
  height:40px;
  display:grid;
  place-items:center;
  background:transparent;
}
.logo__img{
  width:48px;
  height:48px;
  object-fit:contain;
  object-position:center;
  display:block;
  transform:translateY(-3px);
}
.brand__name{font-weight:600;letter-spacing:.2px;color:rgba(255,255,255,.92);font-size:28px;line-height:1}
.brand__tag{font-size:12px;color:rgba(255,255,255,.70)}
.menu{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.menu a{
  font-size:15px;
  padding:8px 10px;
  border-radius:8px;
  color:rgba(255,255,255,.92);
  transition:.18s ease;
}
.menu a:hover{background:rgba(225,225,195,.14)}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:8px;
  border:1px solid rgba(46,44,44,.18);
  background:rgba(225,225,195,.80);
  color:var(--text);
  cursor:pointer;
  font-weight:900;
  font-size:15px;
  white-space:nowrap;
  transition:.18s ease;
}
.btn:hover{
  box-shadow:var(--shadow2);
  transform:translateY(-1px);
}
.btn--primary{
  background:linear-gradient(135deg, var(--olive), var(--olive2));
  color:#fff;
  border-color:transparent;
}
.btn--primary:focus{outline:3px solid rgba(97,108,13,.26);outline-offset:2px}
.btn--soft{
  background:rgba(225,225,195,.62);
  border-color:rgba(46,44,44,.14);
}

.hero{padding:18px 0 8px}
.slider{
  position:relative;
  border-radius:8px;
  overflow:hidden;
  background:
    radial-gradient(900px 520px at 18% 0%, rgba(97,108,13,.20), transparent 60%),
    radial-gradient(760px 520px at 96% 35%, rgba(40,55,32,.18), transparent 60%),
    rgba(225,225,195,.62);
  border:1px solid rgba(46,44,44,.14);
  box-shadow:var(--shadow);
  user-select:none;
  touch-action:pan-y;
}
.slider.is-grabbing{cursor:grabbing}
.slider__track{
  display:flex;
  width:100%;
  transform:translateX(0%);
  transition:transform .58s cubic-bezier(.22,.8,.22,1);
}
.slide{
  flex:0 0 100%;
  padding:clamp(18px, 4.5vw, 34px);
  min-height:230px;
  display:grid;
  gap:12px;
}
.pill{
  display:inline-flex;
  gap:8px;
  align-items:center;
  width:max-content;
  padding:7px 12px;
  border-radius:8px;
  background:rgba(225,225,195,.68);
  border:1px solid rgba(46,44,44,.14);
  color:rgba(46,44,44,.78);
  font-weight:850;
  font-size:13px;
  transform:rotate(-1.2deg);
}
.slide__title{
  font-size:clamp(22px, 3vw, 32px);
  margin:0;
  letter-spacing:-.35px;
}
.slide__text{
  margin:0;
  color:var(--muted);
  max-width:72ch;
}
.slide__cta{display:flex;gap:10px;flex-wrap:wrap}
.slide__cta .btn{padding:7px 12px;min-width:210px}
.slider__dots{
  display:flex;
  gap:10px;
  padding:0 18px 16px;
  align-items:center;
}
.dot{
  width:10px;
  height:10px;
  border-radius:8px;
  border:1px solid rgba(46,44,44,.18);
  background:rgba(225,225,195,.65);
  cursor:pointer;
  transition:.18s ease;
}
.dot.is-active{
  background:var(--olive);
  border-color:var(--olive);
  transform:scale(1.15);
  animation:pulse 2s ease-in-out infinite;
}
@keyframes pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(97,108,13,.22)}
  50%{box-shadow:0 0 0 10px rgba(97,108,13,0)}
}
.slider__hint{
  position:absolute;
  right:14px;
  bottom:12px;
  display:flex;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:8px;
  font-size:13px;
  color:rgba(46,44,44,.72);
  background:rgba(225,225,195,.62);
  border:1px solid rgba(46,44,44,.14);
  animation:hinty 2.8s ease-in-out infinite;
}
@keyframes hinty{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}

.panel{
  border:1px solid rgba(46,44,44,.14);
  background:var(--surface);
  border-radius:8px;
  padding:16px;
  box-shadow:var(--shadow);
}
.panel h2{margin:0 0 10px;font-size:18px;letter-spacing:-.2px}
.panel p{margin:0;color:var(--muted)}

.intro{padding:14px 0 4px}
.intro__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-items:stretch;
}
.video{
  border:1px solid rgba(46,44,44,.14);
  background:rgba(225,225,195,.60);
  border-radius:8px;
  box-shadow:var(--shadow);
  display:grid;
  place-items:center;
  min-height:220px;
  position:relative;
  overflow:hidden;
}
.play{
  width:74px;
  height:74px;
  border-radius:8px;
  border:2px solid rgba(46,44,44,.68);
  display:grid;
  place-items:center;
  background:rgba(225,225,195,.78);
  transition:.18s ease;
  animation:floaty 4.8s ease-in-out infinite;
}
.play:hover{transform:scale(1.03)}
.triangle{
  width:0;
  height:0;
  border-left:18px solid rgba(46,44,44,.78);
  border-top:12px solid transparent;
  border-bottom:12px solid transparent;
  margin-left:6px;
}
.video small{position:absolute;bottom:10px;left:12px;color:var(--muted)}
@keyframes floaty{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}

.mindmap{
  border:1px solid rgba(46,44,44,.14);
  background:
    radial-gradient(620px 320px at 18% 15%, rgba(97,108,13,.14), transparent 60%),
    radial-gradient(620px 320px at 86% 25%, rgba(40,55,32,.12), transparent 60%),
    linear-gradient(180deg, rgba(240,239,216,.72), rgba(225,225,195,.56));
  border-radius:8px;
  box-shadow:var(--shadow);
  padding:18px;
  position:relative;
  overflow:hidden;
}
.mindmap::before{
  content:"";
  position:absolute;
  inset:-40px;
  opacity:.35;
  background:
    radial-gradient(500px 240px at 22% 22%, rgba(97,108,13,.20), transparent 62%),
    radial-gradient(520px 260px at 82% 32%, rgba(40,55,32,.16), transparent 62%),
    radial-gradient(340px 220px at 58% 78%, rgba(62,71,5,.12), transparent 62%);
  pointer-events:none;
}
.mindmap__grid{
  position:relative;
  /* Central anchor for the radial layout */
  --cx: 50%;
  --cy: 56%;
  min-height:540px;
  isolation:isolate;
}
.mindmap__center{
  width:180px;
  height:180px;
  border-radius:8px;
  overflow:hidden;
  position:absolute;
  left:var(--cx);
  top:var(--cy);
  transform:translate(-50%,-50%);
  border:0;
  background:transparent;
  box-shadow:none;
  z-index:2;
  animation:mindFloatCenter 7.6s ease-in-out infinite;
  will-change:translate;
}
.mindmap__center::after{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:8px;
  border:0;
  opacity:.9;
  pointer-events:none;
}
.mindmap__center img{width:100%;height:100%;object-fit:cover}
.mindmap__node{
  border:1px solid rgba(46,44,44,.18);
  background:
    radial-gradient(160px 110px at 28% 22%, rgba(255,255,255,.48), rgba(255,255,255,0) 62%),
    rgba(240,239,216,.82);
  border-radius:8px;
  padding:12px 14px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  min-height:84px;
  position:absolute;
  width:clamp(190px, 22vw, 250px);
  text-align:center;
  align-items:center;
  box-shadow:0 14px 26px rgba(46,44,44,.12);
  z-index:3;
  backdrop-filter:blur(6px);
  transition:transform .18s ease, box-shadow .18s ease;
  animation:mindFloat 6.8s ease-in-out infinite;
  will-change:translate;

  /* Radial layout around the center */
  left:var(--cx);
  top:var(--cy);
  /* Big enough so bubbles never cover the center image */
  --r: clamp(170px, 22vw, 240px);
  --a: 0deg;
  transform:
    translate(-50%,-50%)
    rotate(var(--a))
    translate(var(--r))
    rotate(calc(var(--a) * -1));
}
.mindmap__node:hover{
  transform:
    translate(-50%,-50%)
    rotate(var(--a))
    translate(var(--r))
    rotate(calc(var(--a) * -1))
    translateY(-2px)
    scale(1.01);
  box-shadow:0 18px 32px rgba(46,44,44,.15);
}

@keyframes mindFloat{
  0%,100%{translate:0 0}
  50%{translate:0 -10px}
}
@keyframes mindFloatCenter{
  0%,100%{translate:0 0}
  50%{translate:0 -6px}
}
.mindmap__node strong{font-size:15px;letter-spacing:-.2px}
.mindmap__node small{font-size:13px;color:var(--muted);line-height:1.28}

.mindmap__node--top{
  --a: -90deg;
  animation-delay:0s;
}
.mindmap__node--left{
  /* 5 nodes evenly spaced (step 72deg) */
  --a: 198deg;
  animation-delay:1.3s;
}
.mindmap__node--right{
  --a: -18deg;
  animation-delay:.7s;
}
.mindmap__node--bl{
  --a: 126deg;
  animation-delay:2.1s;
}
.mindmap__node--br{
  --a: 54deg;
  animation-delay:1.8s;
}

@media (max-width:920px){
  .mindmap__grid{
    min-height:unset;
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .mindmap__center{
    position:static;
    transform:none;
    width:170px;
    height:170px;
    margin:0 auto 6px;
  }
  .mindmap__center::after{display:none}
  .mindmap__node{
    position:static;
    width:auto;
    transform:none;
    text-align:left;
    align-items:flex-start;
  }
  .mindmap__center,
  .mindmap__node{
    animation:none;
    translate:0 0;
  }
}

@media (max-width:1200px){
  .mindmap__grid{ min-height:500px; }
}
@media (max-width:1040px){
  .mindmap__grid{ min-height:470px; }
}

@media (prefers-reduced-motion: reduce){
  .mindmap__center,
  .mindmap__node{
    animation:none !important;
    translate:0 0 !important;
  }
}

.stats{padding:16px 0 10px}
.stats__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.stat{
  border:1px solid rgba(46,44,44,.14);
  background:var(--surface);
  border-radius:8px;
  padding:14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  box-shadow:var(--shadow);
  transition:.18s ease;
}
.stat:hover{transform:translateY(-2px)}
.stat__value{font-size:18px;font-weight:950;letter-spacing:-.2px}
.stat__label{color:var(--muted);font-size:13px}
.stat__icon{
  width:42px;
  height:42px;
  border-radius:8px;
  display:grid;
  place-items:center;
  background:rgba(97,108,13,.22);
  color:#556109;
  border:1px solid rgba(97,108,13,.30);
}
.stat__icon i,
.stat__icon svg{
  color:inherit;
}

.olive-icon{width:22px;height:22px}
.olive-icon__fruit{fill:currentColor}
.olive-icon__pit{fill:rgba(0,0,0,.14)}
.olive-icon__leaf{fill:currentColor;opacity:.9}

.whyClean{padding:24px 0 10px}
.whyClean__title{
  text-align:center;
  margin:0 0 14px;
  font-size:clamp(22px, 2.5vw, 30px);
  letter-spacing:-.35px;
}
.whyClean__wrap{
  position:relative;
  min-height:460px;
  border-radius:8px;
  background:rgba(225,225,195,.50);
  border:1px solid rgba(46,44,44,.14);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.whyClean__center{
  position:absolute;
  left:50%;
  top:52%;
  transform:translate(-50%,-50%);
  width:min(280px, 48vw);
  display:grid;
  place-items:center;
  pointer-events:none;
}
.whyClean__tree{
  width:100%;
  height:auto;
  filter:drop-shadow(0 14px 18px rgba(0,0,0,.18));
  animation:treeFloat2 5.6s ease-in-out infinite;
}
@keyframes treeFloat2{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
.whyClean__item{
  position:absolute;
  display:flex;
  gap:10px;
  align-items:flex-start;
  max-width:min(420px, 44vw);
  padding:14px 16px;
  background:transparent;
  border:none;
  opacity:.98;
  transition:transform .2s ease, opacity .2s ease;
}
.whyClean__item:hover{
  transform:translateY(-2px);
  opacity:1;
}
.whyClean__n{
  font-weight:950;
  color:var(--charcoal);
  min-width:28px;
}
.whyClean__h{
  font-weight:950;
  letter-spacing:-.2px;
}
.whyClean__p{
  margin:6px 0 0;
  color:var(--muted);
}
.whyClean__item--1{left:clamp(14px, 2.2vw, 26px);top:34px;transform:rotate(-0.6deg)}
.whyClean__item--2{right:clamp(14px, 2.2vw, 26px);top:56px;transform:rotate(0.7deg);text-align:left}
.whyClean__item--3{left:clamp(14px, 2.2vw, 26px);bottom:42px;transform:rotate(0.4deg)}
.whyClean__item--4{right:clamp(14px, 2.2vw, 26px);bottom:62px;transform:rotate(-0.8deg)}

.donors{padding:22px 0}
.donors__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-items:stretch;
}
.donor-month,.podium{
  border:1px solid rgba(46,44,44,.14);
  border-radius:8px;
  background:var(--surface);
  box-shadow:var(--shadow);
  padding:16px;
  height:100%;
}
.donor-month h3{margin:0 0 10px;font-size:18px}
.donor-card{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px;
  border:1px solid rgba(46,44,44,.14);
  border-radius:8px;
  background:rgba(225,225,195,.62);
}
.avatar{
  width:54px;
  height:54px;
  border-radius:8px;
  border:2px solid rgba(46,44,44,.70);
  background:rgba(225,225,195,.72);
  display:grid;
  place-items:center;
  font-weight:950;
}
.donor-name{font-weight:950}
.donor-card p{margin:0;color:var(--muted)}
.donor-card strong{color:var(--text)}
.hint{margin-top:12px;color:var(--muted);font-size:13px}
.podium h3{margin:0 0 14px;text-align:center;font-size:20px}
.podium__wrap{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:14px;
  padding:6px 0 4px;
}
.podium__col{
  width:110px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  --podium-delay:0s;
  opacity:1;
  transform:translateY(0) scale(1);
}
.podium__wrap.is-inview .podium__col{
  opacity:0;
  transform:translateY(22px) scale(.985);
  animation:podiumReveal 1.25s cubic-bezier(.16,1,.3,1) both;
  animation-delay:var(--podium-delay);
}
.podium__wrap.is-inview .podium__col--rank1{
  animation:podiumReveal 1.25s cubic-bezier(.16,1,.3,1) both, podiumChampion 2.8s ease-in-out infinite;
  animation-delay:var(--podium-delay), calc(var(--podium-delay) + 1.35s);
}
.podium__head{
  width:56px;
  height:56px;
  border-radius:8px;
  border:2px solid rgba(46,44,44,.70);
  display:grid;
  place-items:center;
  background:rgba(225,225,195,.72);
  position:relative;
  font-weight:950;
}
.badge{
  position:absolute;
  top:-10px;
  right:-10px;
  background:rgba(225,225,195,.80);
  border:1px solid rgba(46,44,44,.14);
  border-radius:8px;
  padding:3px 8px;
  font-size:12px;
  color:var(--muted);
  box-shadow:var(--shadow2);
}
.podium__block{
  width:100%;
  border:1px solid rgba(46,44,44,.14);
  border-radius:8px;
  background:rgba(225,225,195,.62);
  display:grid;
  place-items:center;
  font-weight:950;
  box-shadow:var(--shadow2);
}
.podium__block--first{
  height:170px;
  background:linear-gradient(135deg, var(--olive), var(--olive2));
  color:#fff;
  border-color:transparent;
}
.podium__wrap.is-inview .podium__block{
  animation:podiumBlockRise 1.35s cubic-bezier(.16,1,.3,1) both;
  animation-delay:var(--podium-delay);
}
.podium__block--second{height:135px}
.podium__block--third{height:110px}
.podium__name{color:var(--muted);font-size:14px}

@keyframes podiumReveal{
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes podiumBlockRise{
  0%{opacity:0;transform:translateY(34px)}
  60%{opacity:1}
  100%{opacity:1;transform:translateY(0)}
}

@keyframes podiumChampion{
  0%,100%{translate:0 0}
  50%{translate:0 -3px}
}

.cta{padding:0 0 28px}
.cta__panel{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.cta__title{margin:0 0 6px}
.cta__text{margin:0;color:var(--muted);max-width:60ch}

footer{
  margin-top:8px;
  background:linear-gradient(180deg, rgba(40,55,32,.92), rgba(40,55,32,.98));
  border-top:1px solid rgba(255,255,255,.12);
  padding:18px 0;
  color:rgba(255,255,255,.78);
  font-size:14px;
}
.footer__row{
  display:flex;
  flex-wrap:wrap;
  gap:12px 16px;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.footer__row a{color:rgba(255,255,255,.92)}
.footer__row a:hover{opacity:.95}

.modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:1000;
}
.modal.is-open{display:block}
.modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.45);
}
.modal__dialog{
  position:relative;
  width:min(520px, calc(100% - 28px));
  margin:clamp(18px, 6vh, 60px) auto;
  background:rgba(225,225,195,.96);
  border:1px solid rgba(46,44,44,.16);
  border-radius:8px;
  box-shadow:var(--shadow);
  padding:16px;
}

#plantModal .modal__dialog{
  max-height:calc(100vh - 32px);
  display:flex;
  flex-direction:column;
  padding:0;
  overflow:hidden;
}
#plantModal .modal__header{
  margin:0;
  padding:14px 16px 10px;
  border-bottom:1px solid rgba(46,44,44,.12);
  background:rgba(225,225,195,.98);
}
#plantModal #plantForm{
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:0;
  padding:0;
  gap:0;
}
#plantModal .plant-form__scroll{
  flex:1;
  min-height:0;
  overflow-y:auto;
  padding:12px 16px;
  display:grid;
  gap:6px;
}
#plantModal .plant-form__actions{
  position:sticky;
  bottom:0;
  z-index:3;
  padding:10px 16px 16px;
  background:rgba(225,225,195,.98);
  border-top:1px solid rgba(46,44,44,.12);
}
#plantModal #plantSubmitBtn{
  margin:0;
  width:100%;
}
.modal__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.modal__title{
  margin:0;
  font-size:18px;
  letter-spacing:-.2px;
}
.modal__close{
  border:1px solid rgba(46,44,44,.18);
  background:rgba(225,225,195,.70);
  border-radius:8px;
  width:40px;
  height:40px;
  cursor:pointer;
  transition:.18s ease;
}
.modal__close:hover{transform:translateY(-1px)}

.form{display:grid;gap:12px}
.form__row{display:grid;gap:6px}
.form__label{font-weight:900;font-size:13px}
.form__input{
  width:100%;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid rgba(46,44,44,.18);
  outline:none;
  font:inherit;
  background:rgba(225,225,195,.78);
}
.form__input:focus{
  border-color:rgba(97,108,13,.55);
  box-shadow:0 0 0 3px rgba(97,108,13,.18);
}
#signupModal .select2-container{
  width:100% !important;
}
#signupModal .select2-container .select2-selection--single{
  height:auto;
  min-height:43px;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid rgba(46,44,44,.18);
  background:rgba(225,225,195,.78);
  display:flex;
  align-items:center;
}
#signupModal .select2-container--default .select2-selection--single .select2-selection__rendered{
  color:var(--text);
  line-height:1.4;
  padding:0;
}
#signupModal .select2-container--default .select2-selection--single .select2-selection__placeholder{
  color:var(--muted);
}
#signupModal .select2-container--default .select2-selection--single .select2-selection__arrow{
  height:100%;
  right:8px;
}
#signupModal .select2-container--default.select2-container--focus .select2-selection--single{
  border-color:rgba(97,108,13,.55);
  box-shadow:0 0 0 3px rgba(97,108,13,.18);
}
#signupModal .select2-dropdown{
  border:1px solid rgba(46,44,44,.18);
  border-radius:8px;
  background:rgba(225,225,195,.98);
}
#signupModal .select2-search--dropdown .select2-search__field{
  border:1px solid rgba(46,44,44,.18);
  border-radius:8px;
  background:rgba(225,225,195,.90);
}
.country-combobox{
  position:relative;
  display:flex;
  align-items:stretch;
  border:1px solid rgba(46,44,44,.18);
  border-radius:8px;
  overflow:hidden;
  background:rgba(225,225,195,.78);
}
.country-search{
  border:0 !important;
  border-radius:8px;
  box-shadow:none !important;
  background:transparent !important;
}
.country-combobox:focus-within{
  border-color:rgba(97,108,13,.55);
  box-shadow:0 0 0 3px rgba(97,108,13,.18);
  background:rgba(225,225,195,.92);
}
.country-toggle{
  width:44px;
  min-width:44px;
  border:0;
  border-left:2px solid rgba(46,44,44,.28);
  background:transparent;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.country-toggle__line{
  display:inline-block;
  width:14px;
  height:2px;
  background:rgba(46,44,44,.82);
  border-radius:8px;
}
.country-menu{
  position:fixed;
  top:0;
  left:0;
  width:320px;
  max-height:260px;
  overflow:auto;
  padding:6px;
  border:1px solid rgba(46,44,44,.16);
  border-radius:8px;
  background:rgba(225,225,195,.98);
  box-shadow:var(--shadow2);
  z-index:2000;
}
.country-option{
  width:100%;
  border:0;
  background:transparent;
  color:var(--text);
  text-align:left;
  border-radius:8px;
  padding:8px 10px;
  cursor:pointer;
}
.country-option:hover,.country-option.is-active{background:rgba(97,108,13,.14)}
.country-option--placeholder{font-weight:900;color:var(--muted)}
.country-separator{
  height:1px;
  background:rgba(46,44,44,.16);
  margin:6px 2px;
}
.country-empty{
  color:var(--muted);
  padding:8px 10px;
}
.form__submit{width:100%}
.form__hint{
  margin:0;
  color:var(--muted);
  font-size:14px;
  text-align:center;
}
.form__hint button{
  border:none;
  background:transparent;
  color:var(--olive2);
  font-weight:950;
  cursor:pointer;
  padding:0;
}
.form__hint button:hover{
  text-decoration:underline;
}
.linklike{
  border:none;
  background:transparent;
  color:var(--olive2);
  font-weight:950;
  cursor:pointer;
  padding:0;
}
.linklike:hover{text-decoration:underline}

.reveal{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .78s ease, transform .78s ease;
}
.reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
}

@media (min-width:860px){
  .intro__grid{grid-template-columns:1.05fr .95fr;gap:18px}
  .stats__grid{grid-template-columns:repeat(5, 1fr)}
  .donors__grid{grid-template-columns:1fr 1.4fr;gap:18px}
  .slide{min-height:250px}
}

@media (max-width:860px){
  .slider__hint{display:none}
  .whyClean__wrap{
    min-height:auto;
    padding:12px;
  }
  .whyClean__center{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    width:min(260px, 72vw);
    margin:10px auto 6px;
  }
  .whyClean__item{
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    bottom:auto;
    max-width:100%;
    padding:12px 14px;
  }
}

