@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,500&family=DM+Sans:wght@400;500;600&family=Italiana&family=Parisienne&display=swap');
:root{--green:#082a23;--green2:#123b31;--paper:#f1dcb8;--cream:#f8ead0;--gold:#d2a04f;--rust:#9e4932;--ink:#173329;--blue:#527f90;--sage:#8a9c80}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--green);color:var(--ink);font-family:"Cormorant Garamond",serif}.locked{overflow:hidden}.grain{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}#sparkCursor{position:fixed;z-index:1000;pointer-events:none;color:#f3c76f;filter:drop-shadow(0 0 8px #f2c36d);opacity:0}.intro{position:fixed;inset:0;z-index:100;background:#082a23;overflow:hidden;transition:opacity 1s,visibility 1s}.intro.gone{opacity:0;visibility:hidden;pointer-events:none}.intro-world,.world-art{position:absolute;inset:0;background:url("assets/mailclub-world.webp") center/cover no-repeat}.intro-world:after{content:"";position:absolute;inset:0;background:#05241cc9;backdrop-filter:blur(2px)}.intro-copy{position:absolute;left:50%;top:13%;transform:translateX(-50%);text-align:center;color:#f5dfb6;z-index:3}.intro-copy p,.section-title small,.night small{font:600 10px "DM Sans";letter-spacing:.28em}.intro-copy h1{font:500 56px/1 "Italiana";margin:10px}.intro-copy em{font-family:"Parisienne";color:#e1ad59;font-size:1.25em}.seal{position:absolute;z-index:5;left:50%;top:47%;transform:translate(-50%,-50%);width:100px;height:100px;border:0;border-radius:50%;background:radial-gradient(circle,#b94832,#7c231b);box-shadow:0 10px 25px #0009,inset 0 0 0 6px #c95c43;cursor:pointer;color:#efc46c;font-size:35px;transition:.5s}.seal:hover{transform:translate(-50%,-50%) scale(1.08)}.seal.break{animation:sealbreak .75s forwards}@keyframes sealbreak{60%{transform:translate(-50%,-50%) scale(.7) rotate(18deg)}100%{transform:translate(-50%,-50%) scale(.1) rotate(40deg);opacity:0}}.open-label{position:absolute;z-index:5;left:50%;top:61%;transform:translateX(-50%);background:#0a3329;color:#fff;border:1px solid #d9a94f;padding:13px 28px;font:600 10px "DM Sans";letter-spacing:.12em;cursor:pointer}.intro-letter{position:absolute;left:30%;right:30%;top:48%;height:300px;background:#f3dfbd;z-index:2;padding:45px;box-shadow:0 25px 60px #0009;transform:translateY(80%);transition:transform 1s}.intro-letter span{font:40px "Parisienne"}.intro-letter.rise{transform:translateY(-20%)}.skip{position:absolute;right:25px;top:25px;z-index:8;border:1px solid #dfc18a77;background:#092b24aa;color:#ead3aa;padding:9px 13px;font:10px "DM Sans";cursor:pointer}.site{opacity:0;transition:opacity 1s}.site.show{opacity:1}header{height:84px;background:#f1ddbbf2;backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:sticky;top:0;z-index:50;border-bottom:1px solid #c9aa76}.logo{font:600 20px "Italiana";color:var(--ink);text-decoration:none}.logo b,footer b{color:#a8672f}.logo small{display:block;font:9px "DM Sans";margin-top:4px}nav{display:flex;gap:30px}nav a{font:500 12px "DM Sans";text-decoration:none;color:var(--ink)}.join{background:#0a3028;color:#fff;text-decoration:none;border-radius:30px;padding:13px 20px;font:500 11px "DM Sans"}.hero{height:calc(100vh - 84px);min-height:650px;position:relative;overflow:hidden}.world-art{transform:scale(1.03);transition:transform 12s ease}.hero:hover .world-art{transform:scale(1.08)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#06231dcc 0,#06231d2a 50%,transparent 75%)}.hero-overlay{position:absolute;z-index:4;left:6%;top:50%;transform:translateY(-50%);color:#f4dfb8;width:390px;text-shadow:0 2px 20px #000}.hero-overlay p{font:600 9px "DM Sans";letter-spacing:.25em;color:#e0b363}.hero-overlay h1{font:500 58px/1.02 "Italiana";margin:18px 0 30px}.hero-overlay em{font:400 70px "Parisienne";color:#e6b35c}.hero-overlay a{display:inline-block;background:#f0ddb9;color:#15372e;padding:13px 20px;text-decoration:none;font:600 10px "DM Sans";letter-spacing:.1em}.hotspot{position:absolute;z-index:5;border-radius:50%;cursor:help}.hs-envelope{width:25%;height:38%;left:30%;top:17%}.hs-compass{width:12%;height:20%;left:1%;top:32%}.hs-book{width:19%;height:35%;right:3%;top:18%}.tooltip{position:fixed;z-index:80;background:#f5e3c4;color:#17342b;padding:10px 14px;box-shadow:0 8px 30px #0006;pointer-events:none;opacity:0;font:14px "Cormorant Garamond";transform:rotate(-1deg)}.letter-zone{padding:110px 7vw;background:radial-gradient(circle,#24483b,#082820 70%);position:relative}.letter{max-width:900px;margin:auto;background:#f1dcb8;padding:75px 85px;box-shadow:0 35px 90px #0009;position:relative;transform:rotate(-.7deg);border:1px solid #d4b687}.script,.signature,.scribble{font-family:"Parisienne"}.script{font-size:45px;margin:0 0 25px}.letter h2{font:500 38px/1.15 "Italiana"}.letter h3{font:500 27px "Cormorant Garamond"}.letter>p:not(.script):not(.signature){font-size:19px;line-height:1.6}.signature{font-size:25px}.scribble{position:absolute;right:40px;top:310px;font-size:20px;color:#8c6048;transform:rotate(7deg)}.postmark{position:absolute;right:50px;top:45px;width:100px;height:100px;border:2px solid #8c684c;border-radius:50%;display:grid;place-items:center;text-align:center;font:9px "DM Sans";transform:rotate(12deg)}.discover{background:#092821;color:#f2deba;padding:90px 5vw;position:relative}.section-title{text-align:center}.section-title h2{font:500 55px "Italiana";margin:10px}.section-title p{font-size:17px}.desk{max-width:1300px;height:720px;margin:45px auto 0;position:relative;background:radial-gradient(#ffffff0b 1px,transparent 1px);background-size:14px 14px}.piece{position:absolute;border:0;padding:24px;text-align:left;box-shadow:0 22px 55px #000a;cursor:pointer;color:#173229;transition:.35s}.piece:hover{transform:translateY(-18px) rotate(0)!important;z-index:20}.piece i,.piece span{display:block;font:600 8px "DM Sans";letter-spacing:.13em}.piece b{display:block;font:500 31px "Italiana";margin:22px 0}.story{left:3%;top:150px;width:230px;height:310px;background:#ead4ae;transform:rotate(-7deg)}.history{left:23%;top:230px;width:225px;height:240px;background:#d4bf99;transform:rotate(5deg)}.art{left:42%;top:115px;width:210px;height:300px;background:#cdd8c6;transform:rotate(-3deg)}.culture{right:21%;top:230px;width:235px;height:245px;background:#d99e8d;transform:rotate(6deg)}.curious{right:3%;top:125px;width:225px;height:310px;background:#c4d4d9;transform:rotate(4deg)}.surprise{left:43%;bottom:25px;width:250px;height:210px;background:#102c3d;color:#e8c47e;transform:rotate(-5deg)}.compass{position:absolute;right:8%;bottom:35px;border:0;background:none;color:#c89d59;font-size:90px;cursor:pointer}.compass.spin{animation:spin 1.2s ease}@keyframes spin{to{transform:rotate(720deg)}}.flowers{position:absolute;left:12%;bottom:40px;color:#d2ae6f;font-size:65px}.pen{position:absolute;left:27%;bottom:35px;font-size:70px;color:#b8925c;transform:rotate(-25deg)}dialog{border:0;background:#f1ddba;color:#173329;padding:55px;width:min(520px,85vw);box-shadow:0 30px 100px #000c;transform:rotate(-1deg)}dialog::backdrop{background:#061d18b5;backdrop-filter:blur(3px)}dialog button{position:absolute;right:15px;top:10px;border:0;background:none;font-size:25px;cursor:pointer}dialog small{font:600 9px "DM Sans";letter-spacing:.2em;color:#a25237}dialog h3{font:500 42px "Italiana";margin:12px 0}dialog p{font-size:19px}dialog>i{display:block;text-align:center;color:#b77e39;font-size:30px}.arrives{background:#ead7b5;padding:100px 5vw}.section-title.dark{color:#173329}.mail-spread{max-width:1200px;margin:65px auto;display:flex;justify-content:center;align-items:end;gap:13px}.arrival{width:175px;min-height:310px;background:#f4e2c3;padding:22px;box-shadow:0 15px 35px #795d3d44;transition:.35s}.arrival:hover{transform:translateY(-15px) rotate(0)!important}.arrival>div{font-size:45px;margin-bottom:70px}.arrival small{font:600 8px "DM Sans";color:#9c543b}.arrival h3{font:500 23px "Italiana";margin:8px 0}.arrival p{font-size:14px}.r1{transform:rotate(-4deg)}.r2{background:#d2c29e;transform:rotate(2deg);min-height:350px}.r3{background:#c7d5c2;transform:rotate(-2deg);min-height:330px}.r4{background:#d3a08f;transform:rotate(3deg);min-height:360px}.r5{background:#bcd0d6;transform:rotate(-2deg);min-height:335px}.r6{background:#102d3f;color:#e8c783;transform:rotate(3deg);min-height:355px}.night{height:700px;background:radial-gradient(circle,#234a3b,#08251f 67%,#051914);display:grid;place-items:center;align-content:center;text-align:center;color:#f1deb8}.night small{color:#d3a458}.night h2{font:500 56px "Italiana";margin:10px}.night h3{font:42px "Parisienne";color:#e0ad58;margin:0 0 25px}.night p{font-size:18px;line-height:1.7}.stars{color:#e3b663;font-size:28px;animation:glow 2.5s infinite}@keyframes glow{50%{opacity:.35;filter:blur(.4px)}}.mini-envelope{width:260px;height:140px;background:#ddc296;position:relative;margin:20px}.mini-envelope:before{content:"";position:absolute;inset:0 0 auto;height:70%;background:#d0ae7d;clip-path:polygon(0 0,100% 0,50% 100%)}.mini-envelope span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;background:#923829;color:#e4b965;width:50px;height:50px;border-radius:50%;display:grid;place-items:center}.membership{background:#81947f;padding:110px 7vw}.order{max-width:940px;margin:auto;background:#f0ddba;padding:60px;box-shadow:14px 15px 0 #385248;position:relative}.order>small{font:600 8px "DM Sans";letter-spacing:.2em}.order h2{font:500 55px/1.05 "Italiana"}.order h2 em{font-family:"Parisienne";font-size:1.25em;color:#a25d36}.order p{font-size:19px;max-width:650px}.order strong{display:block;margin:25px 0;font-size:18px}.order a{display:inline-block;background:#10352c;color:#fff;padding:14px 20px;text-decoration:none;font:600 10px "DM Sans"}.round{position:absolute;right:45px;bottom:45px;width:110px;height:110px;border:2px solid #8f4c37;border-radius:50%;display:grid;place-items:center;text-align:center;font:9px "DM Sans";transform:rotate(10deg)}.gift{background:#ead7b6;padding:100px 6vw;text-align:center}.postcard{width:min(820px,90vw);height:440px;margin:50px auto 25px;border:0;background:none;position:relative;transform-style:preserve-3d;transition:.8s;cursor:pointer}.postcard.flipped{transform:rotateY(180deg)}.front,.back{position:absolute;inset:0;backface-visibility:hidden;box-shadow:0 22px 55px #76583a55}.front{background:linear-gradient(#0c2b2377,#0c2b2377),url("assets/mailclub-world.webp") center/cover;display:grid;place-items:center;align-content:center;color:#fff;border:15px solid #f1dfbf}.front b{font:500 30px "Italiana"}.front em{font:32px "Parisienne";margin:12px}.front span{position:absolute;right:20px;bottom:20px;background:#f1ddba;color:#173329;padding:9px;font:600 8px "DM Sans"}.back{background:#f2dfbe;transform:rotateY(180deg);padding:60px;text-align:left;font:31px "Parisienne"}.back small{font:600 8px "DM Sans";position:absolute;right:25px;bottom:20px}.personalise{display:flex;justify-content:center;align-items:center;gap:10px;font:600 10px "DM Sans"}.personalise input{padding:11px;border:1px solid #ae8f62;background:#f7e6c8}.signup{background:#082820;padding:110px 6vw}.signup-paper{max-width:820px;margin:auto;background:#f1ddba;padding:65px;text-align:center;box-shadow:0 30px 80px #000a;position:relative}.signup-paper>small{font:600 9px "DM Sans";letter-spacing:.2em;color:#a45a36}.signup-paper h2{font:500 48px "Italiana"}.signup-paper p{font-size:17px}.signup-paper form{display:flex;max-width:620px;margin:30px auto}.signup-paper input{flex:1;padding:16px;border:1px solid #ae9064;background:#f9ead0}.signup-paper button{border:0;background:#10352c;color:#fff;padding:16px 20px;font:600 10px "DM Sans";cursor:pointer}.stamp-success{position:absolute;left:50%;top:50%;width:125px;height:125px;border:3px solid #9c4132;color:#9c4132;border-radius:50%;display:grid;place-items:center;transform:translate(-50%,-50%) rotate(-14deg) scale(2);opacity:0;font:600 11px "DM Sans"}.stamp-success.hit{animation:stamp .65s forwards}@keyframes stamp{65%{opacity:1;transform:translate(-50%,-50%) rotate(-14deg) scale(.8)}100%{opacity:.8;transform:translate(-50%,-50%) rotate(-14deg) scale(1)}}#status{color:#913e2f;font-style:italic}.faq{background:#e6d2af;padding:100px 6vw}.notes{max-width:1000px;margin:50px auto;display:grid;grid-template-columns:1fr 1fr;gap:20px}.notes details{background:#f2dfbe;padding:25px;box-shadow:6px 7px 0 #b79a6b;transform:rotate(-.6deg)}.notes details:nth-child(even){background:#d3dbc9;transform:rotate(.6deg)}.notes summary{font:500 20px "Italiana";cursor:pointer;list-style:none}.notes summary b{float:right}.notes p{font:14px/1.5 "DM Sans"}footer{background:#061f1a;color:#ead6b1;padding:60px 7vw;display:grid;grid-template-columns:2fr 1fr auto;align-items:center;gap:40px;font:500 19px "Italiana"}footer small{display:block;font:8px "DM Sans"}footer a{color:#ead6b1;font:12px "DM Sans"}.footer-seal{width:105px;height:105px;border:2px solid #c79b54;border-radius:50%;display:grid;place-items:center;text-align:center;color:#d3a55c}.reveal{opacity:0;transform:translateY(35px);transition:1s}.reveal.in{opacity:1;transform:translateY(0)}
@media(max-width:800px){#sparkCursor{display:none}.intro-copy h1{font-size:40px}.intro-world{background-position:54% center}.seal{top:50%}.open-label{top:64%}.intro-letter{left:10%;right:10%}nav{display:none}header{padding:0 4vw}.logo{font-size:15px}.join{font-size:9px}.hero{height:80vh}.world-art{background-position:55% center}.hero:after{background:#06231d88}.hero-overlay{left:7%;width:86%;top:67%}.hero-overlay h1{font-size:40px}.hero-overlay em{font-size:52px}.hotspot{display:none}.letter-zone{padding:70px 5vw}.letter{padding:50px 28px}.letter h2{font-size:29px}.script{font-size:36px}.scribble,.postmark{position:static;margin:25px 0;transform:none}.discover{min-height:1370px}.section-title h2{font-size:40px}.desk{height:1120px}.story{left:3%;top:80px}.history{right:2%;left:auto;top:250px}.art{left:4%;top:440px}.culture{right:3%;top:600px}.curious{left:4%;right:auto;top:790px}.surprise{right:3%;left:auto;bottom:0}.compass,.flowers,.pen{display:none}.mail-spread{overflow-x:auto;justify-content:flex-start;padding:20px}.arrival{flex:0 0 175px}.night h2{font-size:45px}.order{padding:40px 25px}.order h2{font-size:40px}.round{position:static;margin:30px auto 0}.postcard{height:370px}.signup-paper{padding:55px 22px}.signup-paper h2{font-size:37px}.signup-paper form{flex-direction:column;gap:8px}.notes{grid-template-columns:1fr}footer{grid-template-columns:1fr;text-align:center}.footer-seal{margin:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}