:root{--black:#0b0b0d;--white:#f5f5f1;--lime:#d8ff35;--cyan:#00d5e8;--magenta:#ff2e68;--yellow:#ffdf21;--line:rgba(11,11,13,.18);--max:1500px;font-family:Arial,"Helvetica Neue",sans-serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--white);color:var(--black);overflow-x:hidden}button{font:inherit;color:inherit}.loader{position:fixed;inset:0;z-index:100;background:var(--lime);display:grid;place-items:center;transition:transform .8s cubic-bezier(.8,0,.15,1) .25s}.loader strong{font-size:clamp(3rem,9vw,9rem);letter-spacing:-.085em}.loader span{position:absolute;left:0;bottom:0;height:7px;background:var(--black);animation:load 1s ease-out forwards}.loader.is-gone{transform:translateY(-105%)}@keyframes load{from{width:0}to{width:100%}}
.wordmark,footer button{border:0;background:none;padding:0;font-weight:900;cursor:pointer}
.hero{height:100svh;min-height:720px;position:relative;overflow:hidden;display:grid;place-items:center;background:var(--white)}.contours{position:absolute;inset:-20%;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg width='520' height='390' viewBox='0 0 520 390' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%230b0b0d' stroke-width='1'%3E%3Cpath d='M-20 100C65 4 136 35 195 118s139 92 194 8 126-91 171-27'/%3E%3Cpath d='M-10 143C68 48 143 76 202 151s133 79 187 5 126-82 169-20'/%3E%3Cpath d='M-2 187c77-89 152-62 210 7s128 73 180 7 125-74 165-18'/%3E%3Cpath d='M8 231c77-82 149-57 207 6s123 67 175 7 119-68 157-16'/%3E%3C/g%3E%3C/svg%3E");background-size:680px 510px;transform:rotate(-6deg)}.hero h1{position:absolute;z-index:1;margin:0;width:100%;top:50%;transform:translateY(-51%);display:flex;justify-content:space-between;padding:0 1.6vw;font-size:clamp(8rem,20.2vw,24rem);line-height:.7;letter-spacing:-.105em}.hero h1 span:last-child{color:transparent;-webkit-text-stroke:3px var(--black)}
.hero-object{--spot-x:50%;--spot-y:50%;position:relative;z-index:3;width:min(42vw,610px);aspect-ratio:1;transform:rotate(-1.5deg);transform-style:preserve-3d;transition:transform .18s ease-out;cursor:crosshair}.paper-shadow{position:absolute;inset:6% -4% -4% 8%;background:var(--lime);transform:rotate(4deg) translateZ(-20px);box-shadow:0 45px 70px rgba(0,0,0,.18)}.image-base,.colour-reveal{position:absolute;inset:0;overflow:hidden;clip-path:polygon(6% 0,96% 5%,100% 92%,3% 100%,0 10%)}.image-base img,.colour-reveal img{width:100%;height:100%;object-fit:cover;transform:scale(1.13)}.image-base img{filter:grayscale(1) contrast(1.12)}.colour-reveal{opacity:0;transition:opacity .25s;-webkit-mask-image:radial-gradient(circle 150px at var(--spot-x) var(--spot-y),#000 0 64%,transparent 70%);mask-image:radial-gradient(circle 150px at var(--spot-x) var(--spot-y),#000 0 64%,transparent 70%)}.colour-reveal img{filter:saturate(1.45) contrast(1.05)}.hero-object:hover .colour-reveal{opacity:1}.lens-ring{position:absolute;z-index:5;left:var(--spot-x);top:var(--spot-y);width:300px;height:300px;border:1px solid rgba(11,11,13,.55);border-radius:50%;transform:translate(-50%,-50%) scale(.75);opacity:0;transition:opacity .2s,transform .25s;pointer-events:none;mix-blend-mode:multiply}.hero-object:hover .lens-ring{opacity:1;transform:translate(-50%,-50%) scale(1)}.lens-ring:before,.lens-ring:after{content:"";position:absolute;background:var(--black)}.lens-ring:before{width:34px;height:1px;left:-17px;top:50%}.lens-ring:after{width:1px;height:34px;left:50%;top:-17px}.lens-ring span{position:absolute;inset:12px;border:1px dashed rgba(11,11,13,.4);border-radius:50%;animation:slowspin 9s linear infinite}
.manifest{padding:clamp(90px,13vw,190px) max(20px,calc((100vw - var(--max))/2));display:grid;grid-template-columns:.35fr 1.15fr .5fr;gap:42px;border-top:1px solid var(--line)}.label{margin:0;font-size:.65rem;font-weight:900;letter-spacing:.16em}.manifest h2,.numbers h2,.responsible h2,.contact h2{margin:0;font-size:clamp(4rem,9vw,10rem);line-height:.81;letter-spacing:-.085em;text-transform:uppercase}.manifest h2 em,.contact h2 em{font-family:Georgia,serif;font-weight:400;text-transform:none}.manifest-copy{align-self:end;margin:0;font-size:1.12rem;line-height:1.55;max-width:390px}
.services{display:grid;grid-template-columns:1fr 1fr}.service{min-height:670px;padding:40px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}.service>p,.service>div>p{font-size:.66rem;font-weight:900;letter-spacing:.15em}.service h3{margin:0;max-width:900px;font-size:clamp(2.3rem,4.3vw,5rem);line-height:.98;letter-spacing:-.055em}.service>span{font-size:.62rem;font-weight:900;letter-spacing:.13em}.service--lime{background:var(--lime)}.service--dark{background:var(--black);color:#fff}.service--white{background:#fff;border-bottom:1px solid var(--line)}.service--photo{padding:0;background:var(--black);color:#fff}.service--photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);opacity:.72;transition:filter .45s,transform .65s}.service--photo:hover img{filter:grayscale(0);transform:scale(1.035)}.service--photo div{position:absolute;inset:0;padding:40px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(180deg,rgba(0,0,0,.65),transparent 40%,rgba(0,0,0,.72))}.foil-disc{width:min(33vw,430px);aspect-ratio:1;border-radius:50%;align-self:flex-end;background:conic-gradient(from var(--foil-angle,0deg),#e7e7e7,var(--cyan),#fff,var(--magenta),var(--yellow),#dbdbdb,var(--cyan));box-shadow:inset 0 0 55px rgba(255,255,255,.8),0 24px 50px rgba(0,0,0,.13);transition:transform .3s}.service--white:hover .foil-disc{transform:rotate(12deg) scale(1.03)}
.numbers{padding:clamp(90px,13vw,190px) max(20px,calc((100vw - var(--max))/2));display:grid;grid-template-columns:repeat(3,1fr);column-gap:25px}.numbers-title{grid-column:1/-1;display:grid;grid-template-columns:.35fr 1.65fr;margin-bottom:100px}.number{border-top:2px solid var(--black);padding:24px 0 70px}.number strong{display:block;font-size:clamp(4rem,8vw,9rem);line-height:.85;letter-spacing:-.08em}.number span{display:block;margin-top:24px;max-width:230px;font-size:.69rem;font-weight:900;line-height:1.45;letter-spacing:.1em;text-transform:uppercase}.numbers-copy{grid-column:2/-1;font-size:clamp(1.35rem,2vw,2rem);line-height:1.45;margin:60px 0 0;max-width:900px}
.responsible{min-height:720px;background:var(--lime);display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;padding:90px max(20px,calc((100vw - var(--max))/2));gap:7vw;overflow:hidden}.responsible>div:last-child p:last-child{font-size:1.15rem;line-height:1.6;max-width:720px}.responsible h2{font-size:clamp(3.6rem,7vw,8rem);margin:28px 0 42px}.eco-stamp{width:min(35vw,480px);aspect-ratio:1;border:3px solid var(--black);border-radius:50%;display:grid;place-items:center;position:relative;animation:slowspin 18s linear infinite}.eco-stamp:before,.eco-stamp:after{content:"";position:absolute;width:115%;height:1px;background:var(--black);transform:rotate(28deg)}.eco-stamp:after{transform:rotate(-28deg)}.eco-stamp span{background:var(--black);color:var(--lime);font-size:clamp(4rem,9vw,9rem);font-weight:900;letter-spacing:-.09em;padding:0 15px;z-index:2}.eco-stamp small{position:absolute;bottom:12%;text-align:center;font-weight:900;letter-spacing:.15em}@keyframes slowspin{to{rotate:360deg}}.eco-stamp span,.eco-stamp small{animation:reverseSpin 18s linear infinite}@keyframes reverseSpin{to{rotate:-360deg}}
.contact{background:var(--black);color:#fff;padding:clamp(90px,12vw,170px) max(20px,calc((100vw - var(--max))/2)) 50px}.contact .label{color:var(--lime);margin-bottom:56px}.contact h2{font-size:clamp(4rem,10vw,11rem)}.contact h2 em{color:var(--lime)}.contact-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:100px;border-top:1px solid rgba(255,255,255,.3)}.contact-grid>div{padding:25px 25px 50px 0;border-right:1px solid rgba(255,255,255,.3)}.contact-grid>div:not(:first-child){padding-left:25px}.contact-grid>div:last-child{border:0}.contact-grid small{display:block;color:var(--lime);font-size:.58rem;font-weight:900;letter-spacing:.15em;margin-bottom:20px}.contact-grid strong{font-size:clamp(1rem,1.5vw,1.35rem);line-height:1.45}.company{font-size:.65rem;letter-spacing:.08em;margin:50px 0 0;color:rgba(255,255,255,.55)}
footer{background:var(--black);color:#fff;border-top:1px solid rgba(255,255,255,.25);height:90px;padding:0 max(20px,calc((100vw - var(--max))/2));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;font-size:.65rem;letter-spacing:.1em}footer strong{font-size:1.35rem;letter-spacing:-.06em}footer button{justify-self:end;color:var(--lime);font-size:.65rem;letter-spacing:.1em}.reveal{opacity:0;transform:translateY(45px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.reveal.is-visible{opacity:1;transform:none}
@media(max-width:900px){.hero{min-height:700px}.hero h1{font-size:26vw}.hero-object{width:min(70vw,520px)}.manifest{grid-template-columns:1fr}.manifest h2{font-size:12vw}.manifest-copy{max-width:600px}.services{grid-template-columns:1fr}.service{min-height:620px}.numbers{grid-template-columns:1fr}.numbers-title{grid-template-columns:1fr;gap:35px}.number{display:grid;grid-template-columns:.7fr 1fr;align-items:end}.numbers-copy{grid-column:1}.responsible{grid-template-columns:1fr}.eco-stamp{width:min(72vw,430px);margin:auto}.contact-grid{grid-template-columns:1fr 1fr}.contact-grid>div:nth-child(2){border-right:0}.contact-grid>div:nth-child(3){padding-left:0}.contact-grid>div{border-bottom:1px solid rgba(255,255,255,.3)}}
@media(max-width:560px){.hero{min-height:640px}.hero h1{font-size:27vw}.hero h1 span:last-child{-webkit-text-stroke:1.5px var(--black)}.hero-object{width:82vw}.lens-ring{width:200px;height:200px}.colour-reveal{-webkit-mask-image:radial-gradient(circle 100px at var(--spot-x) var(--spot-y),#000 0 64%,transparent 71%);mask-image:radial-gradient(circle 100px at var(--spot-x) var(--spot-y),#000 0 64%,transparent 71%)}.manifest{padding-block:95px}.manifest h2{font-size:15vw}.service{min-height:540px;padding:25px}.service--photo div{padding:25px}.foil-disc{width:72vw}.number{grid-template-columns:1fr}.number strong{font-size:20vw}.responsible{padding-block:90px;min-height:auto}.contact-grid{grid-template-columns:1fr}.contact-grid>div{border-right:0;padding-left:0!important}.contact h2{font-size:16vw}.company{line-height:1.6}footer{grid-template-columns:1fr auto}footer span{display:none}}
@media(pointer:coarse){.hero-object{cursor:auto}.colour-reveal{opacity:1;-webkit-mask-image:none;mask-image:none}.lens-ring{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.loader{display:none}.eco-stamp,.eco-stamp span,.eco-stamp small,.lens-ring span{animation:none}.reveal{opacity:1;transform:none;transition:none}}

/* The official Postfly wordmark, enlarged behind the printed piece. */
.hero h1{width:104vw;left:50%;transform:translate(-50%,-50%);display:block;padding:0;font-size:0;line-height:0;letter-spacing:0}
.hero h1 img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.hero{background:#fff}
@media(max-width:900px){.hero h1{width:108vw}}
@media(max-width:560px){.hero h1{width:116vw}}

/* Full-screen photographic opening with the supplied official logo. */
.hero{background:#111}
.hero .contours{display:none}
.hero h1{z-index:12;top:32px;left:50%;width:189px;transform:translateX(-50%);filter:drop-shadow(0 2px 12px rgba(255,255,255,.45))}
.hero-object{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;transform:none;filter:none;cursor:crosshair;overflow:hidden}
.hero-object .paper-shadow{display:none}
.hero-object .image-base,.hero-object .colour-reveal{inset:0;clip-path:none}
.hero-object .image-base img,.hero-object .colour-reveal img{width:100%;height:100%;object-fit:cover;transform:scale(1.035)}
.hero-object .image-base img{filter:grayscale(1) contrast(1.15) brightness(.76)}
.hero-object .colour-reveal{z-index:3;-webkit-mask-image:radial-gradient(circle 220px at var(--spot-x) var(--spot-y),#000 0 66%,transparent 73%);mask-image:radial-gradient(circle 220px at var(--spot-x) var(--spot-y),#000 0 66%,transparent 73%)}
.hero-object .colour-reveal img{filter:saturate(1.45) contrast(1.06) brightness(.9)}
.hero-object .lens-ring{z-index:4;width:440px;height:440px;border-color:rgba(255,255,255,.72);mix-blend-mode:screen}
.hero-object .lens-ring:before,.hero-object .lens-ring:after{background:#fff}
.hero-object .lens-ring span{border-color:rgba(255,255,255,.58)}
@media(max-width:560px){.hero h1{top:24px;width:165px}.hero-object .colour-reveal{-webkit-mask-image:radial-gradient(circle 135px at var(--spot-x) var(--spot-y),#000 0 66%,transparent 74%);mask-image:radial-gradient(circle 135px at var(--spot-x) var(--spot-y),#000 0 66%,transparent 74%)}.hero-object .lens-ring{width:270px;height:270px}}
