
@font-face{font-family:ReciclaRoboto;font-weight:400;font-style:normal;font-display:swap;src:url(/images/recicla-app-asset-0.ttf) format('truetype')}
@font-face{font-family:ReciclaRoboto;font-weight:700;font-style:normal;font-display:swap;src:url(/images/recicla-app-asset-1.ttf) format('truetype')}

/* Recicla-app: original standalone design, with CMS content and invitation dialog. */
:root{--green:#00543b;--ink:#103a34;--muted:#90999d;--source:url("/images/recicla-app-asset-2.png")}
*{box-sizing:border-box}body{margin:0;background:#f3f7f5;font-family:ReciclaRoboto,Arial,Helvetica,sans-serif;color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #5abf78;outline-offset:3px}svg{display:block;flex-shrink:0}.symbols{position:absolute;width:0;height:0;overflow:hidden}.sheet{width:min(100%,853px);margin:0 auto;container-type:inline-size}.canvas{--u:calc(100cqw / 853);font-size:calc(14 * var(--u));background:linear-gradient(110deg,#fff,#fbfdfc);min-height:calc(1280 * var(--u));overflow:hidden}.icon{width:calc(24 * var(--u));height:calc(24 * var(--u));fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.sprite{background-image:var(--source);background-repeat:no-repeat;background-size:calc(853 * var(--u)) calc(1280 * var(--u))}
.hero{height:calc(307 * var(--u));position:relative;overflow:hidden;background:radial-gradient(ellipse at 0 95%,#abd575 0,transparent 32%),radial-gradient(ellipse at 33% 92%,#e5edc2 0,transparent 42%),linear-gradient(112deg,#edfcff,#f7fff2)}.hero-art{position:absolute;inset:0 0 0 50.3%;background-position:right top;mask-image:linear-gradient(90deg,transparent,#000 5%)}.corner-leaves{position:absolute;top:0;left:0;width:calc(40 * var(--u));height:calc(49 * var(--u));background-position:0 0;mask-image:linear-gradient(135deg,#000 35%,transparent 80%)}.brand{position:absolute;top:calc(13 * var(--u));left:calc(49 * var(--u));display:flex;align-items:center;gap:calc(8 * var(--u));font-size:calc(22 * var(--u));line-height:calc(30 * var(--u));font-weight:750;letter-spacing:calc(-0.7 * var(--u));color:#07563a}.recycle-mark{font-size:calc(37 * var(--u));line-height:calc(32 * var(--u));color:#80bd27;font-family:Arial,sans-serif}.hero h1{position:absolute;left:calc(52 * var(--u));top:calc(55 * var(--u));margin:0;color:#00503a;font-size:calc(42 * var(--u));font-weight:800;line-height:.96;letter-spacing:calc(-1.1 * var(--u))}.prices{position:absolute;top:calc(145 * var(--u));left:calc(51 * var(--u));display:flex;gap:calc(14 * var(--u))}.price{width:calc(179 * var(--u));height:calc(61 * var(--u));background:linear-gradient(#dcefd1,#fff 83%);border:calc(1 * var(--u)) solid #ffffffa3;border-radius:calc(22 * var(--u));box-shadow:0 calc(6 * var(--u)) calc(15 * var(--u)) #407d2310;display:flex;align-items:center;gap:calc(12 * var(--u));padding:calc(8 * var(--u)) calc(12 * var(--u))}.price:nth-child(2){width:calc(175 * var(--u));gap:calc(12 * var(--u))}.price .icon{width:calc(39 * var(--u));height:calc(39 * var(--u));stroke:none;color:#2baa22;fill:currentColor}.price:nth-child(2) .icon{color:#006644;width:calc(40 * var(--u))}.price-name{font-size:calc(13 * var(--u));font-weight:700;line-height:calc(17 * var(--u))}.amount{font-size:calc(25 * var(--u));font-weight:800;letter-spacing:calc(-0.6 * var(--u));white-space:nowrap;line-height:calc(26 * var(--u))}.amount small{font-size:calc(14 * var(--u));letter-spacing:0}.pickup{position:absolute;left:calc(53 * var(--u));top:calc(219 * var(--u));display:flex;align-items:center;gap:calc(10 * var(--u));font-size:calc(18 * var(--u));font-weight:750;letter-spacing:calc(-0.3 * var(--u))}.pickup .icon{width:calc(34 * var(--u));height:calc(28 * var(--u));stroke:#11693f;fill:#0b7945}.disclaimer{position:absolute;top:calc(257 * var(--u));left:calc(56 * var(--u));display:flex;align-items:center;gap:calc(9 * var(--u));font-size:calc(12 * var(--u));color:#16372c}.disclaimer .icon{width:calc(21 * var(--u));height:calc(21 * var(--u));stroke:#244f31}
.main{position:relative;margin-top:calc(-14 * var(--u));border-radius:calc(16 * var(--u)) calc(16 * var(--u)) 0 0;background:linear-gradient(110deg,#fff,#fbfdfc);padding-top:calc(17 * var(--u))}.intro{text-align:center}.intro h2{font-size:calc(28 * var(--u));line-height:calc(34 * var(--u));margin:0;letter-spacing:calc(-0.7 * var(--u));font-weight:750;color:#064f43}.intro p{font-size:calc(14 * var(--u));line-height:calc(20 * var(--u));margin:calc(2 * var(--u)) 0 0;letter-spacing:calc(-0.15 * var(--u))}.steps{position:relative;margin:calc(19 * var(--u)) calc(38 * var(--u)) 0;display:grid;grid-template-columns:repeat(5,1fr);list-style:none;padding:0;height:calc(72 * var(--u))}.steps:before{content:"";position:absolute;top:calc(13 * var(--u));left:calc(77 * var(--u));right:calc(77 * var(--u));height:calc(2 * var(--u));background:#e0e3e1;box-shadow:0 calc(1 * var(--u)) calc(1 * var(--u)) #ddd3}.steps li{position:relative;text-align:center;font-size:calc(12 * var(--u));line-height:calc(16 * var(--u))}.step-number{width:calc(27 * var(--u));height:calc(27 * var(--u));display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#079642,#00633b);color:white;font-size:calc(16 * var(--u));font-weight:700;margin:0 auto calc(7 * var(--u));box-shadow:0 0 0 calc(5 * var(--u)) #fcfefd}.steps strong{font-weight:700}
.request-form{margin:calc(18 * var(--u)) calc(79 * var(--u)) 0}.field-title{display:block;font-size:calc(12 * var(--u));font-weight:600;line-height:calc(17 * var(--u));margin:0 0 calc(4 * var(--u))}.items{border:0;padding:0;margin:0 0 calc(13 * var(--u));min-width:0}.items legend{padding:0;margin-bottom:calc(2 * var(--u));line-height:calc(13 * var(--u))}.choices{display:grid;grid-template-columns:.89fr 1.12fr 1.05fr;gap:calc(15 * var(--u))}.choice{display:flex;align-items:center;gap:calc(12 * var(--u));height:calc(43 * var(--u));padding:0 calc(11 * var(--u));background:#fff;border:calc(1 * var(--u)) solid #f2f3f2;border-radius:calc(7 * var(--u));box-shadow:0 calc(1 * var(--u)) calc(3 * var(--u)) #22382f05;font-size:calc(12 * var(--u));cursor:pointer;white-space:nowrap}.choice input{appearance:none;width:calc(15 * var(--u));height:calc(15 * var(--u));flex-shrink:0;margin:0;border:calc(1 * var(--u)) solid #d5d9d6;border-radius:calc(3 * var(--u));background:#fff;display:grid;place-content:center}.choice input:checked{background:linear-gradient(135deg,#22b755,#008649);border-color:#19a74b}.choice input:checked:after{content:"";width:calc(8 * var(--u));height:calc(4 * var(--u));border-left:calc(1.5 * var(--u)) solid white;border-bottom:calc(1.5 * var(--u)) solid white;transform:translateY(calc(-1 * var(--u))) rotate(-45deg)}.choice .icon{width:calc(25 * var(--u));height:calc(25 * var(--u))}.choice .shirt{color:#41b328;fill:currentColor;stroke:none}.choice .blanket{color:#006547;fill:currentColor;stroke:none}.choice .textiles{width:calc(23 * var(--u));height:calc(23 * var(--u));color:#7a8589}.weight-field{margin-bottom:calc(14 * var(--u))}.control{height:calc(40 * var(--u));position:relative;display:flex;align-items:center;border:calc(1 * var(--u)) solid #e7e8e7;border-radius:calc(8 * var(--u));background:#fff;box-shadow:0 0 calc(2 * var(--u)) #12392306}.control>.icon{width:calc(22 * var(--u));height:calc(22 * var(--u));margin-left:calc(12 * var(--u));color:#818c91;pointer-events:none}.control input,.control select{appearance:none;min-width:0;flex:1;width:100%;height:100%;border:0;background:transparent;color:#344d45;font-size:calc(11 * var(--u));padding:0 calc(15 * var(--u));outline-offset:0;border-radius:calc(8 * var(--u))}.control input::placeholder{color:#929da2;opacity:1}.control select:invalid{color:#929da2}.control select{padding-right:calc(33 * var(--u))}.control select option{color:#244b3a}.control .chevron{position:absolute;right:calc(14 * var(--u));top:calc(16 * var(--u));width:calc(9 * var(--u));height:calc(5 * var(--u));margin:0;stroke-width:1.5;color:#65706c}.form-grid .control{height:calc(39 * var(--u))}.form-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:calc(24 * var(--u));row-gap:calc(14 * var(--u))}.date-input:not(:valid){color:#929da2}.date-input::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.55;width:calc(12 * var(--u))}.date-placeholder{position:absolute;left:calc(47 * var(--u));top:calc(12 * var(--u));font-size:calc(11 * var(--u));color:#929da2;pointer-events:none;background:white;padding-right:calc(5 * var(--u))}.date-input:not(:valid){color:transparent!important}.date-input:valid+.date-placeholder,.date-input:focus+.date-placeholder{display:none}.date-input:focus{color:#344d45!important}.continue{display:flex;align-items:center;justify-content:center;gap:calc(9 * var(--u));margin:calc(15 * var(--u)) auto 0;width:calc(267 * var(--u));height:calc(42 * var(--u));border:calc(1 * var(--u)) solid #007538;border-radius:calc(24 * var(--u));background:linear-gradient(#008d45,#006c37);box-shadow:inset 0 calc(1 * var(--u)) calc(4 * var(--u)) #83d75d40;color:white;font-size:calc(17 * var(--u));font-weight:700;letter-spacing:calc(-0.2 * var(--u))}.continue .icon{width:calc(20 * var(--u));height:calc(20 * var(--u));stroke-width:2}.continue:hover,.share-button:hover{filter:brightness(1.06)}
.confirmation{position:relative;display:flex;align-items:center;margin:calc(17 * var(--u)) calc(25 * var(--u)) 0;height:calc(161 * var(--u));border-radius:calc(11 * var(--u));background:#eef8ef;overflow:hidden}.collection-art{position:absolute;width:calc(224 * var(--u));height:calc(137 * var(--u));left:calc(19 * var(--u));top:calc(20 * var(--u));background-position:calc(-44 * var(--u)) calc(-923 * var(--u));mask-image:linear-gradient(90deg,transparent,#000 4%,#000 97%,transparent)}.confirmation-copy{position:absolute;left:calc(315 * var(--u));top:calc(21 * var(--u));right:calc(22 * var(--u))}.success-check{position:absolute;left:calc(264 * var(--u));top:calc(21 * var(--u));width:calc(36 * var(--u));height:calc(36 * var(--u));border-radius:50%;background:linear-gradient(130deg,#83d333,#52b825);box-shadow:0 0 0 calc(3 * var(--u)) white;display:grid;place-items:center;color:#fff}.success-check .icon{width:calc(27 * var(--u));height:calc(27 * var(--u));stroke-width:3}.confirmation h2{font-size:calc(20 * var(--u));font-weight:750;line-height:calc(25 * var(--u));margin:0 0 calc(5 * var(--u));color:#075c37;letter-spacing:calc(-0.5 * var(--u));white-space:nowrap}.confirmation p{font-size:calc(12.5 * var(--u));line-height:calc(19 * var(--u));margin:0}.timing{display:flex;gap:calc(13 * var(--u));align-items:center;height:calc(41 * var(--u));margin-top:calc(12 * var(--u));padding:0 calc(14 * var(--u));background:linear-gradient(90deg,#def3d7,#d6f0d4);border-radius:calc(8 * var(--u));font-size:calc(11 * var(--u))}.timing .icon{width:calc(21 * var(--u));height:calc(21 * var(--u));color:#39754a;stroke-width:1.8}
.reward{height:calc(185 * var(--u));margin:calc(13 * var(--u)) calc(25 * var(--u)) calc(18 * var(--u));border-radius:calc(11 * var(--u));position:relative;overflow:hidden;background:radial-gradient(ellipse at 35% 0,#fff6b3,transparent 65%),linear-gradient(110deg,#ffec82,#ffe983)}.megaphone{position:absolute;width:calc(69 * var(--u));height:calc(72 * var(--u));left:calc(17 * var(--u));top:calc(13 * var(--u));background-position:calc(-42 * var(--u)) calc(-1090 * var(--u));mask-image:radial-gradient(ellipse,#000 52%,transparent 74%)}.reward-copy{position:absolute;left:calc(97 * var(--u));top:calc(16 * var(--u));z-index:1}.reward h2{font-size:calc(27 * var(--u));line-height:calc(32 * var(--u));color:#005b3c;font-weight:800;letter-spacing:calc(-0.6 * var(--u));margin:0 0 calc(5 * var(--u))}.reward p{font-size:calc(13.5 * var(--u));line-height:calc(20 * var(--u));margin:0;letter-spacing:calc(-0.1 * var(--u))}.share-button{display:flex;align-items:center;justify-content:center;gap:calc(10 * var(--u));width:calc(252 * var(--u));height:calc(45 * var(--u));border:calc(1 * var(--u)) solid #00703c;border-radius:calc(24 * var(--u));background:linear-gradient(#008447,#006637);box-shadow:inset 0 calc(1 * var(--u)) calc(3 * var(--u)) #54d36666;color:#fff;font-size:calc(16 * var(--u));font-weight:700;position:absolute;left:calc(77 * var(--u));bottom:calc(14 * var(--u));z-index:2}.share-button .icon{width:calc(21 * var(--u));height:calc(21 * var(--u));fill:currentColor;stroke:none}.powerbank{position:absolute;left:calc(412 * var(--u));top:calc(8 * var(--u));width:calc(205 * var(--u));height:calc(177 * var(--u));background-position:calc(-437 * var(--u)) calc(-1085 * var(--u));mask-image:linear-gradient(90deg,transparent,#000 5%,#000 96%,transparent)}.share-steps{position:absolute;left:calc(626 * var(--u));right:calc(13 * var(--u));top:calc(20 * var(--u));list-style:none;margin:0;padding:0;display:grid;gap:calc(15 * var(--u))}.share-steps li{display:flex;align-items:center;gap:calc(8 * var(--u));min-height:calc(37 * var(--u))}.share-number{width:calc(26 * var(--u));height:calc(26 * var(--u));border:calc(5 * var(--u)) solid #fff;border-radius:50%;background:#ffd24b;color:white;display:grid;place-items:center;flex-shrink:0;font-size:calc(16 * var(--u));font-weight:700;box-sizing:content-box}.share-avatar{width:calc(38 * var(--u));height:calc(39 * var(--u));flex-shrink:0;background-position:calc(-686 * var(--u)) calc(-1097 * var(--u));mask-image:radial-gradient(ellipse,#000 55%,transparent 78%)}.share-steps li:nth-child(2) .share-avatar{background-position:calc(-686 * var(--u)) calc(-1148 * var(--u))}.share-steps li:nth-child(3) .share-avatar{background-position:calc(-686 * var(--u)) calc(-1198 * var(--u))}.share-steps p{font-size:calc(10.5 * var(--u));line-height:calc(14 * var(--u));letter-spacing:0;margin:0;white-space:nowrap}.confetti{position:absolute;width:calc(7 * var(--u));height:calc(12 * var(--u));background:#ffc640;transform:rotate(38deg);left:calc(41 * var(--u));top:calc(111 * var(--u));box-shadow:calc(4 * var(--u)) calc(-4 * var(--u)) 0 #ffd551}.confetti.second{left:calc(387 * var(--u));top:calc(38 * var(--u));width:calc(6 * var(--u));height:calc(8 * var(--u));background:#b9d023;box-shadow:none;transform:rotate(-30deg)}.confetti.third{left:calc(580 * var(--u));top:calc(157 * var(--u));width:calc(7 * var(--u));height:calc(7 * var(--u));background:#ff8797;box-shadow:none}.confetti.fourth{left:calc(408 * var(--u));top:calc(107 * var(--u));width:calc(5 * var(--u));height:calc(7 * var(--u));box-shadow:none}
.feedback{position:fixed;z-index:20;bottom:20px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);width:max-content;padding:14px 20px;border-radius:12px;background:#064f39;color:white;font-size:14px;line-height:1.5;box-shadow:0 6px 25px #003d3330}.feedback[hidden]{display:none}@media(prefers-reduced-motion:no-preference){button{transition:filter .15s}}
@media(max-width:560px){
.canvas{min-height:100vh}.main{padding-top:20px}.intro{padding:0 20px}.intro h2{font-size:23px;line-height:30px}.intro p{font-size:12px;line-height:18px;margin-top:5px}.steps{margin:20px 12px 0;height:80px}.steps:before{top:12px;left:9%;right:9%;height:2px}.steps li{font-size:9px;line-height:13px}.step-number{width:25px;height:25px;font-size:13px;margin-bottom:6px;box-shadow:0 0 0 3px #fcfefd}.request-form{margin:15px 20px 0}.field-title{font-size:12px;line-height:18px;margin-bottom:5px}.items legend{line-height:18px;margin-bottom:5px}.items{margin-bottom:14px}.choices{grid-template-columns:1fr 1fr 1.15fr;gap:5px}.choice{font-size:10px;gap:5px;padding:0 7px;height:43px;border-radius:7px}.choice input{width:14px;height:14px;border-radius:3px}.choice input:checked:after{width:7px;height:4px;border-width:0 0 1.5px 1.5px;transform:translateY(-1px) rotate(-45deg)}.choice .icon{width:19px;height:19px}.control,.form-grid .control{height:43px;border-radius:8px}.control>.icon{width:20px;height:20px;margin-left:10px}.control input,.control select{font-size:12px;padding:0 10px}.control .chevron{width:9px;height:5px;top:18px;right:12px}.weight-field{margin-bottom:14px}.form-grid{grid-template-columns:1fr;gap:14px}.date-placeholder{left:40px;top:14px;font-size:12px}.continue{width:100%;height:44px;margin-top:20px;border-radius:25px;font-size:16px;gap:8px}.continue .icon{width:20px;height:20px}.confirmation{height:auto;min-height:190px;margin:20px 12px 0;padding:20px 18px 20px 49px;border-radius:11px}.confirmation-copy{position:relative;left:auto;top:auto;right:auto}.confirmation h2{font-size:17px;line-height:23px;white-space:normal;margin:0 0 8px;letter-spacing:-.4px}.confirmation p{font-size:12px;line-height:18px}.confirmation br{display:none}.success-check{left:14px;top:22px;width:25px;height:25px;box-shadow:0 0 0 2px white}.success-check .icon{width:20px;height:20px}.collection-art{display:none}.timing{height:auto;padding:10px;gap:8px;margin-top:12px;font-size:11px;line-height:16px;border-radius:7px}.timing .icon{width:20px;height:20px}.reward{margin:12px 12px 16px;height:365px;border-radius:11px}.reward-copy{left:23px;top:18px;right:12px}.reward h2{font-size:25px;line-height:32px;margin-bottom:6px}.reward p{font-size:12px;line-height:19px}.megaphone{display:none}.powerbank{background-size:853px 1280px;background-position:-437px -1085px;width:205px;height:177px;left:4px;top:145px;transform:scale(.8);transform-origin:top left}.share-steps{left:170px;right:10px;top:160px;gap:13px}.share-steps li{gap:5px;min-height:30px}.share-number{width:18px;height:18px;border-width:3px;font-size:12px}.share-avatar{background-size:853px 1280px;background-position:-686px -1097px;width:38px;height:39px;transform:scale(.8);margin-inline:-3px}.share-steps li:nth-child(2) .share-avatar{background-position:-686px -1148px}.share-steps li:nth-child(3) .share-avatar{background-position:-686px -1198px}.share-steps p{font-size:10px;line-height:14px}.share-button{height:42px;width:calc(100% - 40px);left:20px;bottom:15px;border-radius:24px;font-size:15px;gap:8px}.share-button .icon{width:19px;height:19px}
}

[hidden]{display:none!important}.canvas{min-height:100vh}.main{padding-bottom:24px}.invite-dialog{padding:0;border:0;border-radius:18px;width:min(853px,calc(100% - 24px));max-width:none;max-height:90dvh;overflow:auto;background:#fff8d4;color:var(--ink);box-shadow:0 20px 80px #001b3266;container-type:inline-size}.invite-dialog::backdrop{background:#082d2477;backdrop-filter:blur(3px)}.invite-content{--u:calc(100cqw / 853);padding:25px 0 16px;position:relative}.invite-dialog .reward{margin:0 12px;height:calc(185 * var(--u))}.invite-dialog .reward-copy{top:calc(25 * var(--u))}.invite-close{position:absolute;top:3px;right:8px;z-index:4;width:30px;height:30px;border:0;background:transparent;color:#00543b;font-size:26px}.invite-actions{display:flex;gap:12px;padding:16px 24px 0}.invite-action{flex:1;min-height:46px;border-radius:24px;border:1px solid #00703c;background:#007640;color:white;font-size:16px;font-weight:700;padding:10px 18px}.invite-action.secondary{color:#006037;background:white}.invite-action:disabled{opacity:.65;cursor:wait}.invite-feedback{font-size:13px;text-align:center;line-height:1.5;margin:10px 24px 0;min-height:0}.invitation-progress{margin:24px 25px 0;padding:22px;border:1px solid #cee6d6;border-radius:14px;background:#f1f9f3;font-size:14px}.invitation-progress h2{font-size:22px;color:#075c37;margin:0 0 12px}.invitation-progress p{margin:10px 0;line-height:1.5}.invitation-progress progress{width:100%;height:12px;accent-color:#00914b}.invitation-progress label{display:block;margin:16px 0 6px;font-size:13px;font-weight:700}.invitation-progress input{width:100%;padding:12px;border:1px solid #c9ddce;border-radius:8px;color:#23533c;background:#fff;font-size:13px}.progress-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.progress-actions button{border:1px solid #b8d7c3;border-radius:8px;background:#fff;color:#00633b;padding:10px 13px;font-size:13px}.progress-actions button:first-child{background:#007640;color:white}.progress-actions button:disabled{opacity:.55;cursor:default}.invitation-progress .progress-note{font-size:12px;color:#577266}.download-app{display:inline-block;margin-top:10px;color:#00633b;font-size:14px;font-weight:700}.confirmation:has(.download-app:not([hidden])){min-height:190px}
@media(max-width:560px){.invite-dialog .reward{height:315px;margin:0 8px}.invite-dialog .reward-copy{top:15px;left:18px;right:12px}.invite-dialog .reward h2{font-size:23px}.invite-dialog .powerbank{top:139px;transform:scale(.72)}.invite-dialog .share-steps{left:152px;top:145px}.invite-actions{padding:12px 16px 0;gap:8px}.invite-action{padding:10px 8px;font-size:14px}.invitation-progress{margin:20px 12px 0;padding:18px}.invitation-progress h2{font-size:20px}.progress-actions{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
