@font-face{font-family:"Public Sans";font-weight:600;font-display:swap;font-style:normal;src:url("fonts/PublicSans-SemiBold.ttf")}@font-face{font-family:"Public Sans";font-weight:600;font-display:swap;font-style:italic;src:url("fonts/PublicSans-SemiBoldItalic.ttf")}@font-face{font-family:"ocr-b-std";font-weight:normal;font-display:swap;src:url("fonts/ocr-b-std-regular.otf")}:root{--color-white: #fff;--color-black: #281f17;--color-gray-100: #f5f5f5;--color-gray-300: #d9d9d9;--color-gray-500: #bfbfbf;--color-gray-700: #8c8c8c;--color-gray-900: #4d4d4d;--color-yellow: #f0b031;--color-green: #1c574c;--color-red: #9f2435;--color-beige: #e1c3a2;--color-primary: var(--color-green);--color-primary-hover: #1c524f;--color-success-dark: #175417;--color-success: #227622;--color-success-light: #cdedcd;--gutter: 2rem}html{margin:0;padding:0;color:var(--color-beige);font-size:16px;font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:"Public Sans",helvetica,arial,sans-serif}h1,h2,h3,h4,h5,h6{font-weight:normal;text-transform:uppercase;font-family:"ocr-b-std",monospace}h2{font-size:clamp(2.5rem,4vw,3rem);line-height:1}body{margin:0;padding:0;position:relative;overflow-x:hidden;background-color:var(--color-primary);background-image:url("images/noise-green.webp");background-repeat:repeat}body.has-open-mobile-menu{overflow:hidden}*{box-sizing:border-box}a{color:inherit;font-size:1.125rem;text-decoration:underline}p{line-height:1.4;font-size:1.125rem}header{display:flex;flex-direction:column;align-items:center;padding:1rem;width:100%;position:relative;background-color:var(--color-yellow)}header *{color:var(--color-black);text-transform:uppercase}.navbar{display:flex;flex-direction:row;align-items:center;justify-content:space-between;column-gap:2rem;width:100%;max-width:1400px}.navbar__logo{z-index:10;position:relative;width:165px}@media(max-width: 1080px){.navbar__logo{width:140px}}.navbar__logo a{display:block;width:100%;height:100%;text-decoration:none}.navbar__logo img{width:100%;height:auto;display:block}.navbar__menu{z-index:6;position:relative}@media(max-width: 1080px){.navbar__menu{opacity:0;visibility:hidden;top:0;right:0;width:100%;height:100vh;display:flex;align-items:center;justify-content:center;background-color:var(--color-yellow);background-repeat:no-repeat;background-size:100%;background-position:100% 100%;background-image:url("images/spraypaint-logo-2.webp");position:fixed;transform:translateX(100%);transition:transform .3s ease-in-out}.navbar__menu.active{opacity:1;visibility:visible;transform:translateX(0%)}}.navbar__menu ul{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:2rem;list-style:none;padding:0}@media(max-width: 1080px){.navbar__menu ul{flex-direction:column}}.navbar__menu ul a{font-size:1.25rem;text-decoration:none}.navbar__menu ul a.active{text-decoration:underline}.navbar__menu ul a:not(.active):hover{color:var(--color-primary)}.navbar__mobile-menu-toggle{z-index:10;appearance:none;border:0;background-color:rgba(0,0,0,0);color:var(--color-black);cursor:pointer}@media(min-width: 1080px){.navbar__mobile-menu-toggle{display:none}}.navbar__mobile-menu-toggle span{width:2rem;height:2rem;display:block;background-size:80%;background-position:center;background-repeat:no-repeat;background-image:url("images/icon-hamburger.svg")}.navbar__mobile-menu-toggle[aria-expanded=true] span{background-image:url("images/icon-close.svg")}main{display:flex;flex-direction:column;align-items:center;padding:4rem var(--gutter);overflow:hidden}.section{position:relative}.section--how-to #step-1 .sign-platforms{display:none}.platform-steam .section--how-to #sign-steam{display:flex}.platform-epic .section--how-to #sign-epic{display:flex}.platform-psn .section--how-to #sign-psn{display:flex}.platform-xbox .section--how-to #sign-xbox{display:flex}.completed #signin-instructions{display:none}#error-message{background-color:var(--color-red);padding:1rem;color:var(--color-beige);display:none}.step-error #error-message{display:block}.section--hero{display:flex;width:100%;max-width:1400px;padding:1rem}@media(max-width: 768px){.section--hero{width:calc(100% + var(--gutter)*2)}}.section--hero::before{content:"";z-index:1;position:absolute;inset:-1rem 0 -1rem 0;background-size:100% 100%;background-repeat:no-repeat;background-image:url("images/background-jagged-beige-paper.webp")}.section--hero *{z-index:5;position:relative;color:var(--color-black)}.section--hero img{width:100%;display:block}.section--hero--columns{display:flex;flex-wrap:wrap;flex-direction:row;align-items:center;justify-content:center;row-gap:1rem;column-gap:2rem;width:100%}@media(max-width: 768px){.section--hero--columns{flex-direction:column}}.section--hero--columns>*{flex:1;width:100%}.section--hero--column-content{text-align:center}.section--hero--column-content h1{font-size:2rem}.section--hero--column-content h1 span{display:inline-block;color:var(--color-beige);font-size:clamp(2.5rem,4vw,4.5rem);line-height:1;margin-top:.4rem;padding:.8rem .9rem 0rem;background-color:var(--color-black)}.section--hero--column-content h1 span:nth-of-type(1){transform:rotate(-1.8deg)}.section--hero--column-content h1 span:nth-of-type(2){transform:rotate(3.5deg) translateY(0.7rem)}.section--hero--column-content p{display:block;margin-top:3.5rem;line-height:1.4;font-size:clamp(1.2rem,2vw,1.475rem)}.section--how-to{position:relative;width:100%;max-width:calc(1400px - var(--gutter));margin-top:4rem}.section--how-to h2{margin:0;margin-top:2rem;margin-left:-0.3rem}.section--how-to>p{margin:.4rem 0;margin-bottom:3rem}.section--how-to--columns{display:flex;flex-direction:row;align-items:stretch;justify-content:center;row-gap:1rem;column-gap:1.5rem;width:100%}@media(max-width: 768px){.section--how-to--columns{width:calc(100% + var(--gutter)*1);flex-direction:column;margin-left:calc(var(--gutter)*-0.5)}}.section--how-to--column{text-align:center;padding:3rem 2rem;border:dashed 2px var(--color-beige)}@media(min-width: 768px){.section--how-to--column{flex:0 0 calc((100% - 3rem)/3);width:calc((100% - 3rem)/3)}}@media(max-width: 768px){.section--how-to--column{padding:2rem 1.5rem}}.section--how-to--column .connected{display:none}.section--how-to--column .connected img{vertical-align:top;padding-top:1px}.section--how-to--column.active,.section--how-to--column.completed{border-style:solid}.section--how-to--column.completed{border-style:dashed}.section--how-to--column.completed .step-status-completed{display:inline-block}.section--how-to--column.completed .sign-button{color:var(--color-beige);background-color:rgba(0,0,0,0);box-shadow:inset 0 0 0 2px var(--color-beige);cursor:default}.section--how-to--column.completed .connect{display:none}.section--how-to--column.completed .connected{display:block}.section--how-to--column.completed .logged-in{display:block}.section--how-to--column.not-active .sign-button{opacity:.5;cursor:not-allowed}.section--how-to--column.failed .step-status-failed{display:block}.section--how-to--column h3{margin:0;font-size:clamp(2rem,4vw,3.25rem);line-height:1}.section--how-to--column p{font-size:1.2rem;margin:1.2rem 0;font-weight:normal;font-family:"ocr-b-std",monospace}.section--how-to--column .step-status{display:none;font-size:1.25rem;font-family:"ocr-b-std",monospace;background-color:var(--color-beige);color:var(--color-black);justify-self:center;text-transform:uppercase;padding:.2rem .4rem;transform:rotate(-1.8deg)}.section--how-to--column .step-status-failed{background-color:var(--color-red);color:var(--color-beige)}.section--how-to--column .sign-button{appearance:none;font-weight:400;border:0;width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;row-gap:.4rem;padding:0 1rem;min-height:3.25rem;color:var(--color-beige);background-color:var(--color-black);font-family:"ocr-b-std",monospace;overflow:hidden;cursor:pointer;text-decoration:none}.section--how-to--column .sign-button:not(:last-child){margin-bottom:1rem}.section--how-to--column .sign-button.sign-platforms{color:var(--color-beige);background-color:rgba(0,0,0,0);box-shadow:inset 0 0 0 2px var(--color-beige);cursor:default}.section--how-to--column .sign-button.sign-platforms .connected{display:block}.section--how-to--column .sign-button *{position:relative;margin-top:0;margin-bottom:0;height:100%}.section--how-to--column .sign-button img{width:24px;height:auto;margin-right:.5rem}.section--how-to--column .sign-button span{min-width:60px;max-width:90px;padding-right:.5rem;margin-right:.5rem;font-size:.85rem;text-align:left;line-height:1.2;height:100%}.section--how-to--column .sign-button span::after{content:"";top:50%;right:0;position:absolute;transform:translateY(-50%);width:1px;height:350%;background-color:var(--color-beige)}.section--how-to--column .sign-button p{flex:auto}.section--how-to--column .logged-in{display:none;margin:0;margin-top:2rem;font-family:"Public Sans",helvetica,arial,sans-serif}.section--how-to--column .logged-in strong{display:block}@media(max-width: 1250px)and (min-width: 768px),(max-width: 460px){.section--how-to--column .sign-button{padding:.5rem 1rem}.section--how-to--column .sign-button span{min-width:auto;max-width:auto}.section--how-to--column .sign-button span::after{display:none}.section--how-to--column .sign-button p{flex-basis:100%}}.section--faq{position:relative;width:100%;max-width:calc(1400px - var(--gutter));margin-top:4rem}@media(max-width: 768px){.section--faq{padding:0 0 0 1rem;width:calc(100% + var(--gutter)*1);margin-left:calc(var(--gutter)*-2)}}.section--faq--bg{position:absolute;top:0;display:block;z-index:1;left:0;width:100%;height:100%;border-radius:8px}.section--faq--paper{background-image:url("images/background-newsletter-mobile.png");background-color:rgba(0,0,0,0);background-repeat:no-repeat;background-size:100% 100%;background-position:center;display:block;height:100%;left:0;overflow:hidden;position:absolute;top:0;width:calc(100% + 3rem);z-index:1}@media(min-width: 768px){.section--faq--paper{background-image:url("images/background-newsletter-paper.png");border-top-right-radius:12px;border-bottom-right-radius:12px}}.section--faq--border{background-color:var(--color-beige);background-image:url("images/paper-bg.png");background-repeat:no-repeat;background-size:cover;border-radius:8px;display:none;height:100%;left:-2.8rem;mask-image:url("images/border.svg");mask-repeat:repeat-y;mask-position:left center;mask-clip:border-box;mask-type:alpha;overflow:hidden;position:absolute;top:0;width:2.9rem}@media(min-width: 768px){.section--faq--border{display:block}}.section--faq h2{margin:.5rem 0 1.5rem 0}.section--faq--content{position:relative;z-index:2;padding:3rem var(--gutter);width:100%;margin:0 auto;color:var(--color-black)}@media(max-width: 768px){.section--faq--content{width:calc(100% + var(--gutter)*1)}}.section--faq--columns{display:flex;flex-direction:row;align-items:stretch;justify-content:center;row-gap:1rem;column-gap:3rem;width:100%}@media(max-width: 768px){.section--faq--columns{flex-direction:column}}@media(min-width: 768px){.section--faq--column:nth-child(1){flex-basis:600px}}.section--faq--column:nth-child(2){flex:auto}.section--faq--accordion .accordion-button{position:relative;background-color:rgba(0,0,0,0);color:var(--color-black);cursor:pointer;padding:.8rem 2.2rem .8rem 0;width:100%;border:none;text-align:left;outline:none;font-size:1.4rem;font-family:"Public Sans",helvetica,arial,sans-serif}.section--faq--accordion .accordion-button:focus-visible{outline:2px solid var(--color-black)}.section--faq--accordion .accordion-button:after{content:"+";position:absolute;top:.8rem;right:.2rem;width:1.5rem;height:1.5rem;line-height:1.6;text-align:center;border-radius:50%;font-size:1rem;color:var(--color-beige);background-color:var(--color-black)}@media(max-width: 768px){.section--faq--accordion .accordion-button:after{right:-1rem}}.section--faq--accordion .accordion-button.active:after{content:"−"}.section--faq--accordion .panel{padding:0 1rem;margin-bottom:.5rem;color:var(--color-beige);background-color:var(--color-black);max-height:0;overflow:hidden;border-bottom:1px solid var(--color-black);transition:max-height .15s ease-out}@media(max-width: 768px){.section--faq--accordion .panel{padding:0 var(--gutter);width:calc(100% + var(--gutter)*2.5);margin-left:calc(var(--gutter)*-1)}}.section--faq--accordion .panel p{margin:1rem 0}.section--faq--accordion .panel p:last-of-type{margin-bottom:2rem}.section--faq--accordion .panel a:hover{color:var(--color-white)}.section--faq--accordion .panel ul{padding-left:2rem}.section--faq--accordion .panel li{line-height:1.4;font-size:1.125rem;margin-bottom:.2rem}.footer{font-family:"ocr-b-std",monospace}.footer--content{width:100%;max-width:1400px;margin:0 auto;padding:1rem var(--gutter) 3rem}.footer .social-media-columns{display:flex;flex-direction:row;align-items:center;justify-content:center;row-gap:1rem;column-gap:2rem}@media(max-width: 768px){.footer .social-media-columns{flex-direction:column}}.footer .social-media-column:nth-child(1){flex:1;max-width:530px}.footer .social-media-column:nth-child(1) img{width:100%;height:auto;display:block}.footer .social-media-column:nth-child(2){flex:1}.footer .social-media-column h2{text-align:center;font-size:clamp(1.2rem,4vw,1.6rem);line-height:1}.footer .social-media-links{display:grid;flex-wrap:wrap;row-gap:1.5rem;column-gap:2.5rem;list-style-type:none;padding:0;margin:0;justify-content:center;grid-template-columns:repeat(6, 4rem)}@media(max-width: 768px){.footer .social-media-links{column-gap:1.5rem}}@media(max-width: 1280px){.footer .social-media-links{grid-template-columns:repeat(3, 4rem)}}.footer .social-media-links li{display:inline-block;margin:0}.footer .social-media-links li a{display:inline-flex;align-items:center;justify-content:center;width:5rem;height:5rem;background-color:rgba(0,0,0,0);border:1px solid;border-color:var(--color-yellow);transition:transform .3s ease;overflow:hidden;position:relative}@media(max-width: 768px){.footer .social-media-links li a{width:4rem;height:4rem}}.footer .social-media-links li a::after{content:"";height:100%;width:100%;position:absolute;background-color:var(--color-yellow);display:block;z-index:-1;top:100%;left:0;transition:top .3s ease}.footer .social-media-links li a:hover::after,.footer .social-media-links li a:focus-visible::after{top:0}.footer .social-media-links li a:hover path,.footer .social-media-links li a:hover circle,.footer .social-media-links li a:focus-visible path,.footer .social-media-links li a:focus-visible circle{fill:var(--color-black)}.footer .social-media-links li svg{width:1.5rem;height:1.5rem;transition:transform .15s ease-in-out}.footer .social-media-links li svg path,.footer .social-media-links li svg circle{fill:var(--color-yellow)}.footer--bottom{margin-top:4rem;color:var(--color-black)}.footer--bottom--columns{display:flex;flex-direction:row;align-items:flex-end;justify-content:space-between;row-gap:2.5rem;column-gap:2.5rem}@media(max-width: 768px){.footer--bottom--columns{text-align:center;align-items:center;flex-direction:column}}.footer--bottom .logo-remedy{width:100%;max-width:130px;display:block}@media(max-width: 768px){.footer--bottom .logo-remedy{margin:0 auto}}.footer--bottom p{font-weight:normal;display:inline-block}.footer--bottom a{font-weight:normal}.footer--bottom a:hover{color:var(--color-yellow)}.footer--bottom--links{display:inline-flex;flex-direction:row;flex-wrap:wrap;justify-content:center;column-gap:1rem;list-style:none;margin:0;padding:0}.footer--bottom .logo-esrb{width:100%;max-width:220px;margin-bottom:1rem}/*# sourceMappingURL=style.css.map */