:root{--navy:#04152f;--navy2:#061b3a;--red:#d71920;--gold:#f4a515;--white:#fff;--mobile-nav-h:54px}
*{box-sizing:border-box}
html{margin:0;width:100%;min-height:100%;background:#fff;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;width:100%;min-height:100vh;background:#fff;color:#fff;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
.site-shell{display:block;width:100%;min-height:100vh;background:#fff}
.page-canvas,.page-canvas.portrait,.page-canvas.desktop{position:relative;width:100%;max-width:none;margin:0 auto;background:#fff;overflow:hidden;box-shadow:none}
.page-image{display:block;width:100%;max-width:100%;height:auto;object-fit:contain;object-position:top center;user-select:none;-webkit-user-drag:none}
.hotspot{position:absolute;display:block;z-index:5;border-radius:8px;color:transparent;text-indent:-9999px;overflow:hidden;touch-action:manipulation;-webkit-tap-highlight-color:rgba(215,25,32,.22)}
.hotspot:focus-visible{outline:4px solid #fff;box-shadow:0 0 0 7px var(--red);background:rgba(215,25,32,.15)}
.desktop .nav-home{left:44.2%;top:.2%;width:4.5%;height:6.4%}
.desktop .nav-search{left:48.8%;top:.2%;width:7.5%;height:6.4%}
.desktop .nav-mission{left:57.4%;top:.2%;width:7.2%;height:6.4%}
.desktop .nav-features{left:65.6%;top:.2%;width:5.4%;height:6.4%}
.desktop .nav-news{left:71.1%;top:.2%;width:8.1%;height:6.4%}
.desktop .nav-partners{left:79.4%;top:.2%;width:6.4%;height:6.4%}
.desktop .nav-join{left:85.8%;top:.2%;width:6.6%;height:6.4%}
.desktop .nav-app{left:92.4%;top:.2%;width:7.4%;height:6.4%}
.portrait .nav-home{left:44.2%;top:.15%;width:4.5%;height:4.6%}
.portrait .nav-search{left:48.8%;top:.15%;width:7.5%;height:4.6%}
.portrait .nav-mission{left:57.4%;top:.15%;width:7.2%;height:4.6%}
.portrait .nav-features{left:65.6%;top:.15%;width:5.4%;height:4.6%}
.portrait .nav-news{left:71.1%;top:.15%;width:8.1%;height:4.6%}
.portrait .nav-partners{left:79.4%;top:.15%;width:6.4%;height:4.6%}
.portrait .nav-join{left:85.8%;top:.15%;width:6.6%;height:4.6%}
.portrait .nav-app{left:92.4%;top:.15%;width:7.4%;height:4.6%}
.portrait .hero-primary{left:4%;top:22%;width:19%;height:3.4%}
.portrait .hero-secondary{left:23%;top:22%;width:20%;height:3.4%}
.desktop .cta-primary{left:80%;top:76%;width:14%;height:6%}
.desktop .cta-secondary{left:32%;top:78%;width:17%;height:6%}
.mobile-jump{display:none}
@media(max-width:760px){
 html,body{width:100%;background:#fff}
 body{padding-bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom))}
 .site-shell{width:100%;min-height:calc(100vh - var(--mobile-nav-h));display:block;background:#fff}
 .page-canvas,.page-canvas.portrait,.page-canvas.desktop{width:100%;min-height:0;margin:0;overflow:hidden}
 .page-image{display:block;width:100%;height:auto;min-height:0;object-fit:contain;object-position:top center}
 .hotspot{border-radius:4px;min-width:24px;min-height:24px}
 .mobile-jump{display:flex;position:fixed;z-index:1000;left:0;right:0;bottom:0;width:100%;height:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom));background:var(--navy2);border-top:1px solid rgba(255,255,255,.3);box-shadow:0 -4px 16px rgba(0,0,0,.28);overflow-x:auto;overflow-y:hidden;padding:0 0 env(safe-area-inset-bottom);scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .mobile-jump::-webkit-scrollbar{display:none}
 .mobile-jump a{position:relative;flex:1 0 auto;min-width:82px;display:flex;align-items:center;justify-content:center;padding:0 15px;color:#fff;text-decoration:none;text-align:center;font-weight:700;font-size:12px;line-height:1;white-space:nowrap;touch-action:manipulation}
 .mobile-jump a+a{border-left:1px solid rgba(255,255,255,.22)}
 .mobile-jump a.active,.mobile-jump a[aria-current="page"]{background:rgba(255,255,255,.09)}
 .mobile-jump a.active::after,.mobile-jump a[aria-current="page"]::after{content:"";position:absolute;left:20%;right:20%;bottom:5px;height:3px;border-radius:3px;background:var(--red)}
}
@media(min-width:761px){
 .page-canvas.portrait{max-width:1024px}
 .page-canvas.desktop{max-width:1536px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Responsive, functional homepage Join the Litter card */
.join-card{position:absolute;z-index:8;left:65.4%;top:74.15%;width:30.2%;height:17.2%;padding:1.35% 1.45%;color:#172033;background:#fff;border-radius:10px;display:flex;flex-direction:column;overflow:hidden}
.join-card h2{margin:0 0 .65em;color:#a71922;font-size:clamp(13px,2.18vw,23px);line-height:1.06;letter-spacing:-.025em;white-space:normal;overflow-wrap:anywhere}
.join-card>p{margin:0 0 .8em;font-size:clamp(8px,1.42vw,15px);line-height:1.45}
.join-card-form{display:grid;grid-template-columns:1fr;gap:clamp(4px,.55vw,7px);margin:0}
.join-card-form input,.join-card-form button{width:100%;min-width:0;height:clamp(25px,3.8vw,40px);border-radius:7px;font:inherit}
.join-card-form input{border:1px solid #d3d8e1;padding:0 .9em;color:#172033;background:#fff;font-size:clamp(8px,1.2vw,13px)}
.join-card-form button{border:0;padding:0 .6em;background:#bd1421;color:#fff;font-size:clamp(8px,1.18vw,12px);font-weight:700;white-space:nowrap;cursor:pointer;touch-action:manipulation}
.join-card-form button:disabled{opacity:.65;cursor:default}
.join-benefits{display:flex;align-items:center;justify-content:space-between;gap:.45em;margin-top:auto;padding-top:.65em;font-size:clamp(6.5px,.93vw,9.5px);line-height:1.1;white-space:normal;overflow-wrap:anywhere}
.join-benefits span{display:flex;align-items:center;min-width:0}
.join-benefits span::before{content:"";flex:0 0 auto;width:.62em;height:.62em;margin-right:.45em;border-radius:50%;background:#bd1421}
.join-message{position:absolute;left:4.8%;right:4.8%;bottom:1.8%;margin:0!important;color:#8d111a;font-size:clamp(6.5px,.85vw,9px)!important;line-height:1.15!important;background:#fff}
@media(max-width:760px){
 .join-card{left:64.5%;top:73.9%;width:31.8%;height:18%;padding:1.5% 1.6%;border-radius:8px}
 .join-card h2{font-size:clamp(11px,2.8vw,15px);margin-bottom:.45em;line-height:1.08;white-space:normal;overflow-wrap:anywhere}
 .join-card>p{font-size:clamp(7.5px,1.78vw,10px);line-height:1.32;margin-bottom:.55em}
 .join-card-form{gap:4px}
 .join-card-form input,.join-card-form button{height:clamp(24px,5.1vw,30px)}
 .join-card-form input{font-size:clamp(7.5px,1.65vw,9px);padding:0 .65em}
 .join-card-form button{font-size:clamp(7.5px,1.7vw,9px)}
 .join-benefits{display:grid;grid-template-columns:1fr;gap:2px;padding-top:4px;font-size:clamp(6.5px,1.45vw,8px);white-space:normal}
 .join-benefits span::before{width:.55em;height:.55em}
 .join-message{font-size:7px!important;bottom:1%}
}

/* Site-wide alignment hardening — v1.0 mobile QA */
html,body,.site-shell{max-width:100%;overflow-x:clip}
img,svg,video,canvas{max-width:100%}
.page-canvas{isolation:isolate}
.page-image{vertical-align:top}
.page-canvas>.hotspot{max-width:100%}
.join-page-form-wrap{width:min(100% - 32px,520px);margin:2rem auto;padding:1rem;color:#172033}
.join-page-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;width:100%}
.join-page-form input,.join-page-form button{min-width:0;min-height:48px;border-radius:10px;font:inherit}
.join-page-form input{width:100%;padding:.8rem;border:1px solid #cfd5df}
.join-page-form button{padding:.8rem 1rem;border:0;background:#bd1421;color:#fff;font-weight:700}
.join-page-message{min-height:1.25em;margin:.75rem 0 0;color:#8d111a}
@media(max-width:760px){
 body{min-width:0}
 .site-shell{overflow:hidden}
 .page-canvas,.page-canvas.portrait,.page-canvas.desktop{max-width:100%;transform:none}
 .page-image{width:100%;max-width:100%;margin:0 auto}
 .join-card h2{text-wrap:balance}
 .join-page-form{grid-template-columns:1fr}
 .join-page-form input,.join-page-form button{width:100%}
}
@supports not (overflow:clip){html,body,.site-shell{overflow-x:hidden}}