/*----- GENERAL STYLES -----*/

* {margin:0px; padding:0px; }

html {height:100%; width:100%; font-size:62.5%; scroll-behavior:smooth; }
body {height:100%; font-size:1.25rem; font-family: "Outfit", sans-serif; font-weight:300; color:#000; }

h1 {font-size:3.8em; font-family: "Outfit", sans-serif; font-weight:500; color:#000; line-height:1.05; margin:0 0 30px 0; letter-spacing:-0.02em; word-spacing:0.1em; }
h2 {font-size:2.5em; font-family: "Outfit", sans-serif; font-weight:500; color:#000; line-height:1.3; margin:0 0 30px 0; letter-spacing:-0.02em; word-spacing:0.1em; }
h3 {font-size:2em; font-family: "Outfit", sans-serif; font-weight:500; color:#000; line-height:1.3; margin:0 0 20px 0; letter-spacing:-0.02em; word-spacing:0.1em; }
h4 {font-size:1.6em; font-family: "Outfit", sans-serif; font-weight:500; color:#000; line-height:1.2; margin:0 0 15px 0; letter-spacing:-0.02em; word-spacing:0.1em; }
p {font-size:1.4em; font-family: "Outfit", sans-serif; font-weight:300; color:#000; line-height:1.5em; margin:0 0 20px 0; }
p:last-child {margin:0; }

.bold {font-weight:500; }
.highlight {background-color:#DCFC2C; }
.highlight-header {background:linear-gradient(to bottom, transparent 30%, #DCFC2C 30%, #DCFC2C 70%, transparent 70%); padding-right:5px; }
.highlight-narrow {background:linear-gradient(to bottom, transparent 30%, #DCFC2C 30%, #DCFC2C 70%, transparent 70%); }
.center-block {margin:0 auto; }
.relative {position:relative; }
.absolute {position:absolute; }

a:link {color:#000; text-decoration:underline; }
a:visited {color:#000; text-decoration:underline; }
a:active {color:#000; text-decoration:underline; }
a:hover {color:#000; text-decoration:underline; cursor:pointer; background:linear-gradient(to bottom, transparent 30%, #DCFC2C 30%, #DCFC2C 70%, transparent 70%); }

ul {list-style:none; padding-left:0; margin:0 0 20px 0; }
ul li {position:relative; padding-left:25px; font-size:1.4em; line-height:1.6em; margin:0 0 15px 0; }
ul li::before {content:''; position: absolute; left:0; top:0.55em; transform:rotate(-45deg); width:8px; height:8px; border-right:3px solid #000; border-bottom:3px solid #000; }

img {max-width:100%; display:block; }

.divider {margin:30px 0; border-top:1px solid #DDD; }
.divider-wide {margin:30px 0; border-top:2px solid #000; }

a.button,
a.button:link,
a.button:visited,
a.button:active {text-decoration:none; padding:10px 40px; border-radius:20px; border:none; color:#fff; font-size:1.3em; font-weight:500; background:#000; cursor:pointer; display:inline-block; }
a.button:hover {background:#DCFC2C; color:#000; text-decoration:none; background-image:none; transition:0.3s; }

a.button.small {font-size: 1.25em; padding:5px 20px; }


/*----- SITEWIDE -----*/

#wrapper {margin:0 auto; }

/*----- Header -----*/

#wrapper #header {padding:40px; }
#wrapper #header .container {max-width:1360px; margin:0 auto; }
#wrapper #header .container .logo {max-width:150px; margin:0 auto; }

/*----- Hero -----*/

#wrapper #hero {padding:20px 40px 60px 40px; }
#wrapper #hero .container {max-width:1360px; margin:0 auto; }

#wrapper #hero .container h1 {font-size:4.5em; margin:0 auto; }
#wrapper #hero .container h1 img {width:100%; max-width:570px; margin:0 auto; }
#wrapper #hero .container p {max-width:550px; margin:40px auto 0 auto; text-align:center; }

#wrapper #hero .container .subscribe {max-width:430px; margin:0 auto; }
#wrapper #hero .container .subscribe .subscribe-form {padding:5px; border-radius:25px; border:1px solid #DDD; display:flex; justify-content:space-between; }
#wrapper #hero .container .subscribe .subscribe-form .email-input {width:67%; }
#wrapper #hero .container .subscribe .subscribe-form .email-input input {width:calc(100% - 20px); padding:10px; font-size:1.3em; border-radius:19px; border:none; }
#wrapper #hero .container .subscribe .subscribe-form .subscribe-btn {width:32%; padding:10px 0; border-radius:19px; border:none; color:white; font-size:1.3em; font-weight:500; background:#6654E0; cursor:pointer; }
#wrapper #hero .container .subscribe .subscribe-form .subscribe-btn:hover {background:#DCFC2C; color:#000; transition:0.3s; }
#wrapper #hero .container .subscribe .formkit-alert { }
#wrapper #hero .container .subscribe .formkit-alert-success { }

#wrapper #hero .container .readers {display:flex; align-items:center; justify-content:center; margin:30px 0 0 0; }
#wrapper #hero .container .readers .readers-content {height:30px; display:flex; align-items:center; padding:0 0 0 105px; background-image:url("../images/icon-readers.png"); background-repeat:no-repeat; background-size:90px auto; font-size:1.4em; }

#wrapper #hero .container .benefits {max-width:430px; margin:10px auto 0 auto; font-size:1.2em; text-align:center; }

/*----- Past Editions -----*/

#wrapper #past-editions {padding:0 40px; background:#F8F8F8; }
#wrapper #past-editions .container {max-width:1360px; margin:0 auto; padding:60px 0; }

#wrapper #past-editions .container .cards-wrapper {width:100%; display:flex; justify-content:flex-start; align-items:stretch; flex-wrap:wrap; gap:30px; }
#wrapper #past-editions .container .cards-wrapper .card {width:calc(33.3% - 22px); display:flex; flex-direction:column; justify-content:space-between; flex-wrap:wrap; background-color:white; border:1px solid #DDD; border-radius:25px; text-decoration:none; background:white; overflow:hidden; }
#wrapper #past-editions .container .cards-wrapper .card .content {padding:30px; }
#wrapper #past-editions .container .cards-wrapper .card .content .date {font-size:1.1em; font-weight:400; margin:0 0 20px 0; display:inline-block; }
#wrapper #past-editions .container .cards-wrapper .card .content h3 {font-size:1.8em; margin:0 0 20px 0; }
#wrapper #past-editions .container .cards-wrapper .card .content p {font-size:1.3em; line-height:1.5; }
#wrapper #past-editions .container .cards-wrapper .card .image-wrapper {aspect-ratio:16/9; overflow:hidden; border-radius:0 0 25px 25px; }
#wrapper #past-editions .container .cards-wrapper .card .image-wrapper img {width:100%; height:100%; object-fit:cover; margin:0; border-radius:0 0 25px 25px; transition:transform 0.4s ease; }
#wrapper #past-editions .container .cards-wrapper .card:hover img {transform: scale(1.02); }

/*----- Page -----*/

#wrapper #page {padding:40px 40px 100px 40px; }
#wrapper #page .container {max-width:1200px; margin:0 auto; text-align:center; }

#wrapper #page .thank-you-page {max-width:1200px; margin:0 auto; text-align:center; }
#wrapper #page .thank-you-page .logo {max-width:150px; margin:0 auto 80px auto; }
#wrapper #page .thank-you-page p {margin:0 0 30px 0; }
#wrapper #page .thank-you-page p.focus {font-size:1.8em; font-weight:600; }

/*----- Newsletter Content -----*/

#wrapper #newsletter {padding:40px 40px 100px 40px; }

#wrapper #newsletter .container {max-width:1200px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between; }

#wrapper #newsletter .container .logo {width:100%; margin:0 0 80px 0; }
#wrapper #newsletter .container .logo img {max-width:150px; }

#wrapper #newsletter .container .primary {width:calc(100% - 400px); }

#wrapper #newsletter .container .primary .summary {padding:0 0 0 15px; border-left:5px solid #DCFC2C; }
#wrapper #newsletter .container .primary .summary h3 {margin:0 0 10px 0; }
#wrapper #newsletter .container .primary .summary ul li:last-child {margin:0; }

#wrapper #newsletter .container .primary .featured-image {aspect-ratio:16/9; object-fit:cover; border-radius:25px; margin:0 0 30px 0; }
#wrapper #newsletter .container .primary .featured-data {margin:35px 0 30px 0; }
#wrapper #newsletter .container .primary .featured-caption {margin:-15px 0 30px 0; font-size:1.25em; color:#999999; font-weight:400; }

#wrapper #newsletter .container .primary .listing {display:flex; justify-content:space-between; flex-wrap:wrap; }
#wrapper #newsletter .container .primary .listing .listing-image {width:40%; overflow:hidden; }
#wrapper #newsletter .container .primary .listing .listing-image img {aspect-ratio: 3 / 2; border-radius:15px; }
#wrapper #newsletter .container .primary .listing .listing-content {width:calc(60% - 20px); }
#wrapper #newsletter .container .primary .listing .listing-content h4 {margin:0 0 5px 0; }

#wrapper #newsletter .container .secondary {width:280px; align-self:flex-start; }

#wrapper #newsletter .container .secondary .author {font-size:1.2em; }
#wrapper #newsletter .container .secondary .author .author-name {height:50px; padding:0 0 0 60px; background-image:url("../images/author-kate.png"); background-repeat:no-repeat; background-size:contain; }
#wrapper #newsletter .container .secondary .author .author-bio {margin:10px 0; }
#wrapper #newsletter .container .secondary .author .author-connect {margin:10px 0; }

#wrapper #newsletter .container .secondary .socials {display:flex; gap:6px; }
#wrapper #newsletter .container .secondary .socials .icon {display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border:1px solid #DDD; border-radius:8px; }
#wrapper #newsletter .container .secondary .socials .icon:hover {background:#DCFC2C; transition:0.3s; }
#wrapper #newsletter .container .secondary .socials .icon img {width:20px; height:20px; display:block; }

#wrapper #newsletter .container .secondary .subscribe { }
#wrapper #newsletter .container .secondary .subscribe .description {margin:0 0 20px 0; font-size:1.2em; }
#wrapper #newsletter .container .secondary .subscribe .subscribe-form { }
#wrapper #newsletter .container .secondary .subscribe .subscribe-form .email-input {width:100%; }
#wrapper #newsletter .container .secondary .subscribe .subscribe-form .email-input input {width:calc(100% - 32px); padding:10px 15px; font-size:1.2em; border-radius:25px; border:1px solid #DDD; }
#wrapper #newsletter .container .secondary .subscribe .subscribe-form .subscribe-btn {width:100%; margin:10px 0 0 0; padding:10px 0; border-radius:25px; border:none; color:white; font-size:1.2em; font-weight:500; background:#000; cursor:pointer; }
#wrapper #newsletter .container .secondary .subscribe .subscribe-form .subscribe-btn:hover {background:#DCFC2C; color:#000; transition: 0.4s; }
#wrapper #newsletter .container .secondary .subscribe .benefits {margin:10px 0 0 0; font-size:1.2em; }

#wrapper #newsletter .container .disclaimer {width:calc(100% - 400px); }
#wrapper #newsletter .container .disclaimer h4 {font-size:1.35em; }
#wrapper #newsletter .container .disclaimer p {font-size:1.3em; }


/*----- Footer -----*/

#wrapper #footer {width:calc(100% - 80px); padding:0 40px; background-color:#000; bottom:0 }
#wrapper #footer .container {max-width:1360px; margin:0 auto; padding:40px 0; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; color:#fff; }
#wrapper #footer .container .logo {width:150px; }
#wrapper #footer .container .contact {font-size:1.4em; }


/*----- MAX WIDTH 1150PX -----*/    

@media only screen and (max-width:1150px) {

h1 {font-size:3.25em; }
h2 {font-size:2.125em; }
h3 {font-size:1.7em; }
h4 {font-size:1.35em; }
p {font-size:1.3em; }

ul li {padding-left:22px; font-size:1.3em; }
ul li::before {width:6px; height:6px; }

/*----- Hero -----*/

#wrapper #hero .container .readers .readers-content {font-size:1.3em; }
    
/*----- Past Editions -----*/

#wrapper #past-editions .container .cards-wrapper .card {width:calc(50% - 17px); }
#wrapper #past-editions .container .cards-wrapper .card .content h3 {font-size:1.7em; }

/*----- Newsletter Content -----*/

#wrapper #newsletter .container .primary .listing .listing-image {width:100%; overflow:hidden; margin:0 0 30px 0; }
#wrapper #newsletter .container .primary .listing .listing-image img {aspect-ratio: 16/9; border-radius:25px; }
#wrapper #newsletter .container .primary .listing .listing-content {width:100%; }

}

/*----- MAX WIDTH 900PX -----*/    

@media only screen and (max-width:900px) {

/*----- Past Editions -----*/

#wrapper #past-editions .container .cards-wrapper {gap:20px; }
#wrapper #past-editions .container .cards-wrapper .card {width:calc(50% - 12px); }
#wrapper #past-editions .container .cards-wrapper .card .content {padding:30px 25px 25px 25px; }
#wrapper #past-editions .container .cards-wrapper .card .content h3 {font-size:1.6em; line-height:1.2; }

/*----- Newsletter Content -----*/

#wrapper #newsletter .container .primary {width:100%; }
#wrapper #newsletter .container .secondary {width:100%; }
#wrapper #newsletter .container .disclaimer {width:100%; margin:30px 0 0 0; padding:30px 0 0 0; border-top:1px solid #DDDDDD;}

#wrapper #newsletter .container .secondary .author,
#wrapper #newsletter .container .secondary .socials,
#wrapper #newsletter .container .secondary .subscribe {max-width:400px; }

}

/*----- MAX WIDTH 780PX -----*/    

@media only screen and (max-width:780px) {

/*----- Past Editions -----*/

#wrapper #past-editions .container .cards-wrapper .card {width:100%; flex-direction:row;  }
#wrapper #past-editions .container .cards-wrapper .card .content {padding:20px; order:2; width:calc(66.6% - 40px); }

#wrapper #past-editions .container .cards-wrapper .card .image-wrapper {order:1; width:33.3%; border-radius:0; }
#wrapper #past-editions .container .cards-wrapper .card .image-wrapper img {border-radius:0; }

}

/*----- MAX WIDTH 550PX -----*/    

@media only screen and (max-width:550px) {

/*----- Past Editions -----*/

#wrapper #past-editions {padding:0 20px; }
#wrapper #past-editions .container {padding:40px 0; }  
#wrapper #past-editions .container .cards-wrapper .card {width:100%; }
#wrapper #past-editions .container .cards-wrapper .card .content {padding:30px 20px 20px 20px; order:1; width:100%; }

#wrapper #past-editions .container .cards-wrapper .card .image-wrapper {order:2; width:100%; border-radius:0 0 25px 25px; }
#wrapper #past-editions .container .cards-wrapper .card .image-wrapper img {border-radius:0 0 25px 25px; }

/*----- Newsletter Content -----*/

#wrapper #newsletter {padding:40px 20px; }
#wrapper #newsletter .container .secondary .author,
#wrapper #newsletter .container .secondary .socials,
#wrapper #newsletter .container .secondary .subscribe {max-width:100%; }

/*----- Page -----*/

#wrapper #page {padding:40px 20px; }

}