
.howtosubscribe{position:relative;width:100vw;min-height:100vh;margin:-8px 0 -8px calc(50% - 50vw);display:flex;align-items:center;overflow:hidden;color:#fff}
.prewhatsnext{position:relative;width:100vw;height:190px;margin:-8px 0 0 calc(50% - 50vw);display:flex;align-items:center;justify-content:center;overflow:hidden}
.whatsnext{position:relative;width:100vw;height:100vh;margin:0 0 -8px calc(50% - 50vw);display:flex;align-items:flex-start;justify-content:center;padding-top:10vh;overflow:hidden}

.howtosubscribe{position:relative;width:100vw;min-height:100vh;margin:-8px 0 -8px calc(50% - 50vw);display:flex;align-items:center;overflow:hidden;color:#fff}
.howtosubscribe *{box-sizing:border-box}
.hts-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hts-wrap{position:relative;z-index:1;display:flex;gap:0;max-width:1500px;margin:0 auto;padding:6vw 5vw;align-items:flex-start;width:100%}
.hts-left{flex:0 0 auto;width:clamp(180px,28vw,420px)}
.hts-right{flex:1;min-width:0;padding-left:clamp(10px,2vw,40px)}
.hts-title{font-family:"Playfair Display",serif;line-height:1;margin:0;text-align:center}
.hts-title-top{font-size:clamp(35px,3.5vw,42px);font-weight:500;letter-spacing:.05em}
.hts-title-bot{font-size:clamp(32px,7.5vw,42px);font-weight:800;font-style:italic}
.hts-desc{font-family:"Montserrat",sans-serif;font-weight:500;font-size:clamp(13px,1.6vw,18px);margin:1.2em 0 1.6em;text-align:center}
.hts-photo img{width:100%;height:100%;object-fit:cover;display:block}
.hts-item{border-bottom:1px solid rgba(255,255,255,.5)}
.hts-num{font-family:"Montserrat",sans-serif;font-weight:800;font-size:clamp(24px,2.8vw,38px);flex-shrink:0}
.hts-label{font-family:"Playfair Display",serif;font-weight:500;font-size:clamp(14px,1.5vw,22px);line-height:1.25;flex:1;min-width:0}
.hts-row{display:flex;align-items:center;gap:clamp(12px,1.8vw,24px);padding:clamp(16px,2.2vw,28px) 0;cursor:pointer}
.hts-label em{font-style:italic}
.hts-ham{display:flex;flex-direction:column;justify-content:center;gap:5px;width:42px;height:36px;padding:0;background:transparent;border:none;cursor:pointer;overflow:visible;flex-shrink:0}
.hts-ham-arm{display:block;width:42px;height:4px;background-color:#fff;border-radius:0;transform-origin:left center;transform:rotate(0deg);transition:transform 0.22s ease;margin-bottom:1px}
.hts-ham-bar{display:block;width:42px;height:4px;background-color:#fff;border-radius:0;transition:transform 0.22s ease,opacity 0.22s ease}
.hts-row:hover .hts-ham-arm{transform:translateY(-1px) rotate(-4deg)}
.hts-item.hts-open .hts-ham-arm{transform:translateY(-2px) rotate(-12deg)}
.hts-panel{font-family:"Montserrat",sans-serif;font-size:clamp(12px,1.4vw,15px);max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}
.hts-panel.hts-open{max-height:300px;padding-bottom:clamp(12px,1.6vw,20px)}
@media(max-width:768px){.hts-wrap{flex-direction:column;gap:6vw;padding:10vw 7vw}.hts-left,.hts-right{width:100%}.hts-photo{display:none}.hts-left{text-align:center}.hts-desc{margin-left:auto;margin-right:auto}}


.prewhatsnext{position:relative;width:100vw;height:120px;margin:-8px 0 0 calc(50% - 50vw);display:flex;align-items:center;justify-content:center;overflow:hidden}
.prewhatsnext *{box-sizing:border-box}
.pwn-bg{position:absolute;inset:0;width:100%;height:104%;object-fit:cover;z-index:0}
.pwn-title{position:relative;z-index:1;margin:0;font-family:"Playfair Display",serif;font-weight:800;color:#7a1f1f;text-align:center;font-size:clamp(28px,5vw,50px)}
.pwn-title em{font-style:italic}


.whatsnext{position:relative;width:100vw;height:100vh;margin:0 0 -8px calc(50% - 50vw);display:flex;align-items:center;justify-content:center;overflow:hidden;box-sizing:border-box}
.whatsnext *{box-sizing:border-box}
.wn-bg-wrap{position:absolute;inset:0;z-index:0}
.wn-bg{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.wn-envelope{position:relative;z-index:2;width:min(78vw,920px);cursor:pointer;flex-shrink:0;margin-top:-8vh}
.wn-env-closed{width:100%;height:auto;display:block;transition:opacity .8s ease}
.wn-env-open-wrap{position:absolute;inset:0;display:block;opacity:0;transition:opacity .8s ease}
.wn-env-open{width:100%;height:auto;display:block}
.wn-tap{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-family:"Playfair Display",serif;font-weight:800;font-size:clamp(20px,3vw,25px);pointer-events:none;text-shadow:0 1px 4px rgba(0,0,0,.6);transition:opacity .3s ease;white-space:nowrap}
.wn-letter{position:absolute;z-index:3;width:min(52vw,640px);height:min(48vh,460px);top:50%;left:50%;transform:translate(-50%,80px);opacity:0;overflow:hidden;border-radius:4px;transition:opacity 1.6s ease .8s,transform 1.6s ease .8s;pointer-events:none}
.wn-paper-bg{position:absolute;inset:0;width:100%;height:115%;object-fit:fill;z-index:0;pointer-events:none}
.wn-tag{position:absolute;z-index:4;top:10px;right:35px;background:#7a1f1f;color:#fff;font-family:"Montserrat",sans-serif;font-size:clamp(8px,1vw,11px);font-weight:600;padding:4px 10px;border-radius:4px;pointer-events:none;white-space:nowrap;transition:opacity .3s ease}
.wn-scroll{position:absolute;top:clamp(32px,4vw,52px);left:0;bottom:0;width:calc(100% - 18px);z-index:2;overflow-y:scroll;overflow-x:hidden;padding:0 16px clamp(20px,2.5vw,38px) clamp(20px,2.5vw,38px);scrollbar-width:thin;scrollbar-color:#7a1f1f rgba(122,31,31,.15)}
.wn-scroll::-webkit-scrollbar{width:5px}
.wn-scroll::-webkit-scrollbar-track{background:rgba(122,31,31,.12);border-radius:3px;margin:8px 0}
.wn-scroll::-webkit-scrollbar-thumb{background:#7a1f1f;border-radius:3px}
.wn-text{font-family:"Montserrat",sans-serif;color:#222}
.wn-text h3{font-family:"Playfair Display",serif;font-style:italic;font-weight:800;color:#7a1f1f;font-size:clamp(18px,2.4vw,28px);margin:1.2em 0 .4em;line-height:1.3}
.wn-text h3:first-child{margin-top:0}
.wn-num{font-family:"Montserrat",sans-serif;font-style:normal;font-weight:800;color:#1a1a1a;margin-right:.25em}
.wn-text p{font-size:clamp(13px,1.6vw,17px);line-height:1.65;margin:.4em 0}
.wn-text ol{font-size:clamp(13px,1.6vw,17px);line-height:1.8;margin:.3em 0;padding-left:1.4em}
.wn-strong{font-weight:700}
.wn-envelope:hover .wn-env-closed,.wn-opened .wn-env-closed{opacity:0}
.wn-envelope:hover .wn-env-open-wrap,.wn-opened .wn-env-open-wrap{opacity:1}
.wn-envelope:hover .wn-tap,.wn-opened .wn-tap{opacity:0}
.wn-opened .wn-envelope{cursor:default;pointer-events:none}
.wn-opened .wn-letter{opacity:1;transform:translate(-50%,-55%);pointer-events:auto}
@media(min-width:1367px){.wn-envelope{width:60vw;margin-top:-6vh}.wn-letter{width:48vw;height:58vh}.wn-opened .wn-letter{transform:translate(-50%,-58%)}}
@media(max-width:1280px){.wn-letter{width:56vw;height:46vh}.wn-opened .wn-letter{transform:translate(-50%,-52%)}}
@media(min-width:768px) and (max-width:1024px) and (orientation:landscape){.wn-envelope{width:65vw;margin-top:-4vh}.wn-letter{width:52vw;height:64vh}.wn-opened .wn-letter{transform:translate(-50%,-50%)}.wn-scroll{top:24px;padding:0 24px 24px 28px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(min-width:1024px) and (max-width:1180px) and (orientation:portrait){.wn-envelope{width:78vw;margin-top:-2vh}.wn-letter{width:64vw;height:58vh}.wn-opened .wn-letter{transform:translate(-50%,-48%)}.wn-scroll{top:26px;padding:0 24px 24px 28px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(min-width:1024px) and (max-width:1180px) and (orientation:landscape){.wn-envelope{width:68vw;margin-top:-4vh}.wn-letter{width:56vw;height:60vh}.wn-opened .wn-letter{transform:translate(-50%,-52%)}.wn-scroll{top:26px;padding:0 24px 24px 28px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(min-width:1180px) and (max-width:1366px) and (orientation:portrait){.wn-envelope{width:74vw;margin-top:-2vh}.wn-letter{width:62vw;height:56vh}.wn-opened .wn-letter{transform:translate(-50%,-50%)}.wn-scroll{top:26px;padding:0 24px 24px 28px}.wn-text{padding-top:16px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(min-width:1180px) and (max-width:1366px) and (orientation:landscape){.wn-envelope{width:64vw;margin-top:-4vh}.wn-letter{width:52vw;height:56vh}.wn-opened .wn-letter{transform:translate(-50%,-52%)}.wn-scroll{top:26px;padding:0 24px 24px 28px}.wn-text{padding-top:16px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(max-width:768px){.wn-envelope{width:100vw;margin-top:-4vh}.wn-letter{width:90vw;height:70vh}.wn-opened .wn-letter{transform:translate(-50%,-46%)}.wn-scroll{top:22px}.wn-tag{font-size:9px;padding:3px 8px;right:22px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(max-width:600px){.wn-envelope{width:100vw;margin-top:-2vh}.wn-letter{width:90vw;height:72vh}.wn-opened .wn-letter{transform:translate(-50%,-44%)}.wn-scroll{top:20px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(max-width:430px){.wn-envelope{width:100vw;margin-top:0}.wn-letter{width:90vw;height:72vh}.wn-opened .wn-letter{transform:translate(-50%,-42%)}.wn-scroll{top:18px}.wn-tag{font-size:9px;padding:3px 8px;right:20px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}
@media(max-width:375px){.wn-envelope{width:100vw;margin-top:2vh}.wn-letter{width:90vw;height:70vh}.wn-opened .wn-letter{transform:translate(-50%,-40%)}.wn-scroll{top:16px}.wn-text h3{font-size:14px;line-height:2.6;margin:2.4em 0 .8em}.wn-text p,.wn-text ol{font-size:12px;line-height:3;margin:.8em 0}}