/*
Theme Name: Starkers HTML5
Theme URI: http://nathanstaines.com
Description: An HTML5 version of <a href="http://elliotjaystocks.com/starkers/">Starkers</a> by <a href="http://elliotjaystocks.com/">Elliot Jay Stocks</a> which is based on Twenty Ten.
Version: 3.2
Author: Nathan Staines
Author URI: http://nathanstaines.com
Tags: starkers, html5, naked, clean, basic
*/

@import "css/reset.css";
@import "css/layout.css";




    *{
      margin:0;
      padding:0;
      box-sizing:border-box;
    }

    body{
      background:#000;
      color:#fff;
      font-family:"DM Sans", sans-serif;
    }

    a{
      text-decoration:none;
      color:inherit;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6{
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      color:#fff;
    }

    /* =========================
        HEADER
    ========================== */

    .topbar{
      background:#000;
      padding:20px 60px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      border-bottom:1px solid #111;
    }

/*.logo{
    font-family: "Noe Display", "Playfair Display", serif;
    font-style: italic;
    color: #F2F2F2;
}

 .logo{
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    letter-spacing: 8px;
    color: #D79A12;
}*/

.logo img {
    width: 160px;
}

 .logo{
      font-size:48px;
      color:#fff;
      font-weight:700;
      font-family:"Playfair Display", serif;
      font-style:normal;
    }

    .logo span{
      color:#fff;
      font-size:22px;
      letter-spacing:0;
      margin-left:8px;
      font-family:"DM Sans", sans-serif;
      font-weight:500;
    }

   /* .logo{
      font-size:48px;
      font-weight:bold;
      font-family:Georgia, serif;
    }

    .logo span{
      color:#f0a500;
      font-size:22px;
      letter-spacing:2px;
      margin-left:8px;
    }*/

    .nav{
      color:#fff;
      font-size:15px;
      line-height:22px;
      font-weight:500;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
    }

    .primary-menu{
      display:flex;
      gap:40px;
      align-items:center;
      list-style:none;
      margin:0;
      padding:0;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
    }

    .primary-menu li{
      position:relative;
      list-style:none;
    }

    .primary-menu a{
      display:block;
      color:#fff;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-size:15px;
      font-weight:500;
      line-height:22px;
      letter-spacing:0;
      transition:color .2s ease;
    }

    .primary-menu a:hover,
    .primary-menu .current-menu-item > a,
    .primary-menu .current_page_item > a{
      color:#f0a500;
    }

    .primary-menu .sub-menu,
    .primary-menu .children{
      display:none;
      position:absolute;
      top:100%;
      left:0;
      z-index:10;
      min-width:220px;
      padding:14px 0;
      background:#050505;
      border:1px solid #111;
    }

    .primary-menu li:hover > .sub-menu,
    .primary-menu li:hover > .children{
      display:block;
    }

    .primary-menu .sub-menu a,
    .primary-menu .children a{
      padding:10px 18px;
      white-space:nowrap;
      font-size:18px;
    }

    .header-actions{
      display:flex;
      align-items:center;
      gap:14px;
    }

    .social-link{
      width:44px;
      height:44px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border:1px solid #222;
      color:#fff;
      font-size:15px;
      font-weight:500;
      font-family:"DM Sans", sans-serif;
      line-height:1;
      text-transform:none;
      transition:border-color .2s ease, color .2s ease;
    }

    .social-link:hover{
      border-color:#f0a500;
      color:#f0a500;
    }

    .subscribe-btn{
      border:2px solid #f0a500;
      color:#f0a500;
      padding:12px 30px;
      border-radius:4px;
      font-size:15px;
      line-height:22px;
      font-weight:500;
      font-family:"DM Sans", sans-serif;
    }

    /* =========================
        TICKER
    ========================== */

    .ticker{
      background:#f0a500;
      color:#111;
      padding:16px 60px;
      font-size:16px;
      line-height:24px;
      font-weight:500;
      font-family:"DM Sans", sans-serif;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }

    /* =========================
        NEWSLETTER PAGE
    ========================== */

    .newsletter-page{
      min-height:620px;
      display:grid;
      grid-template-columns:1fr 1fr;
      border-bottom:1px solid #111;
    }

    .newsletter-hero{
      padding:80px 60px;
      border-right:1px solid #111;
    }

    .newsletter-hero__line{
      width:70px;
      height:4px;
      background:#f0a500;
      margin-bottom:35px;
    }

    .newsletter-hero__eyebrow{
      margin-bottom:22px;
      color:#f0a500;
      font-size:20px;
      font-weight:700;
      letter-spacing:4px;
      text-transform:uppercase;
      font-family:"DM Sans", sans-serif;
    }

    .newsletter-hero h1{
      max-width:620px;
      margin-bottom:28px;
      font-size:64px;
      line-height:1.1;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-weight:700;
      letter-spacing:0;
    }

    .newsletter-hero__copy{
      max-width:680px;
      color:#CFCFCF;
      font-size:26px;
      line-height:1.6;
      font-family:"DM Sans", sans-serif;
    }

    .newsletter-signup{
      display:flex;
      flex-direction:column;
      justify-content:center;
      padding:70px 60px;
    }

    .newsletter-signup__content{
      margin-bottom:34px;
    }

    .newsletter-signup__content h2{
      margin-bottom:12px;
      font-size:42px;
      line-height:1.2;
      font-family:"Playfair Display", serif;
      font-style:italic;
    }

    .newsletter-signup__content p{
      color:#CFCFCF;
      font-size:19px;
      line-height:1.6;
      font-family:"DM Sans", sans-serif;
    }

    .newsletter-signup__form{
      max-width:560px;
    }

    .newsletter-signup__form form,
    .newsletter-signup__form .tnp-subscription,
    .newsletter-signup__form .newsletter,
    .newsletter-signup__form .newsletter-form{
      width:100%;
      display:flex;
      flex-direction:column;
      gap:16px;
      padding:0;
    }

    .newsletter-signup__form label{
      display:block;
      margin-bottom:8px;
      color:#e8e8e8;
      font-size:17px;
      font-family:"DM Sans", sans-serif;
    }

    .newsletter-signup__form input[type="text"],
    .newsletter-signup__form input[type="email"],
    .newsletter-signup__form input[type="submit"],
    .newsletter-signup__form button{
      width:100%;
      min-height:56px;
      border-radius:0;
      font-size:18px;
      font-family:"DM Sans", sans-serif;
    }

    .newsletter-signup__form input[type="text"],
    .newsletter-signup__form input[type="email"]{
      padding:16px 18px;
      border:1px solid #222;
      background:#f4f4f4;
      color:#111;
      outline:none;
    }

    .newsletter-signup__form input[type="text"]:focus,
    .newsletter-signup__form input[type="email"]:focus{
      border-color:#f0a500;
    }

    .newsletter-signup__form input[type="submit"],
    .newsletter-signup__form button{
      border:2px solid #f0a500;
      background:#f0a500;
      color:#111;
      font-weight:700;
      cursor:pointer;
    }

    .newsletter-signup__form input[type="submit"]:hover,
    .newsletter-signup__form button:hover{
      background:#111;
      color:#f0a500;
    }

    /* =========================
        HERO SECTION
    ========================== */

    .main{
      display:grid;
      grid-template-columns:2fr 1fr;
      min-height:700px;
    }

    .hero{
      padding:70px 60px;
      border-right:1px solid #111;
    }

    .line{
      width:70px;
      height:4px;
      background:#f0a500;
      margin-bottom:35px;
    }

    .category{
      color:#F2B11A;
      font-size:22px;
      line-height:28px;
      letter-spacing:0;
      margin-bottom:25px;
      font-weight:700;
      font-family:"DM Sans", sans-serif;
    }

    .category a,
    .card-category a,
    .stream-category a,
    .card-tag a{
      color:#f0a500;
    }

    .hero h1{
      color:#fff;
      font-size:56px;
      line-height:1.1;
      margin-bottom:40px;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-weight:600;
      letter-spacing:0;
    }

    .description{
      color:#CFCFCF;
      font-size:24px;
      line-height:1.5;
      margin-bottom:50px;
      font-family:"DM Sans", sans-serif;
      font-weight:400;
    }

    .meta{
      display:flex;
      gap:30px;
      color:#8A8A8A;
      font-size:16px;
      line-height:24px;
      font-family:"DM Sans", sans-serif;
      font-weight:400;
    }

    .post-tags{
      margin:0 0 22px;
      color:#9A9A9A;
      font-size:16px;
      line-height:24px;
      font-family:"DM Sans", sans-serif;
    }

    .post-tags a{
      color:#9A9A9A;
    }

    .post-tags a:hover{
      color:#f0a500;
    }

    .author{
      color:#F2B11A;
      font-weight:bold;
    }

    /* =========================
        SIDEBAR
    ========================== */

    .sidebar{
      padding:40px;
    }

    .sidebar-title{
      display:inline-block;
      color:#8A8A8A;
      letter-spacing:.18em;
      font-size:14px;
      line-height:20px;
      font-family:"DM Sans", sans-serif;
      font-weight:500;
      margin-bottom:30px;
      text-transform:uppercase;
    }

    .sidebar-title::after{
      content:"";
      display:block;
      width:100%;
      height:3px;
      margin-top:14px;
      background:#f0a500;
    }

    .card{
      padding:30px 0;
      border-bottom:1px solid #111;
    }

    .card-category{
      color:#F2B11A;
      font-size:22px;
      line-height:28px;
      font-weight:700;
      font-family:"DM Sans", sans-serif;
      margin-bottom:18px;
    }

    .card h3{
      color:#fff;
      font-size:48px;
      line-height:1.15;
      margin-bottom:15px;
      font-family:"DM Sans", sans-serif;
      font-weight:600;
      letter-spacing:0;
    }

    .card-meta{
      color:#8A8A8A;
      font-size:16px;
      line-height:24px;
      font-family:"DM Sans", sans-serif;
    }

    /* =========================
        STORY STREAM
    ========================== */

    .story-stream{
      border-top:1px solid #111;
    }

    .stream-header{
      padding:20px 40px;
      border-bottom:1px solid #111;
      color:#8A8A8A;
      font-size:14px;
      line-height:20px;
      letter-spacing:.18em;
      font-family:"DM Sans", sans-serif;
      display:flex;
      align-items:center;
      gap:10px;
    }

    .live-dot{
      width:10px;
      height:10px;
      background:#f0a500;
      border-radius:50%;
    }

    .stream-item{
      display:flex;
      justify-content:space-between;
      gap:20px;
      padding:35px 40px;
      border-bottom:1px solid #111;
    }

    .stream-category{
      color:#F2B11A;
      font-size:22px;
      line-height:28px;
      font-weight:700;
      font-family:"DM Sans", sans-serif;
      margin-bottom:15px;
      display:flex;
      align-items:center;
      gap:10px;
    }

    .yellow-dot,
    .gray-dot{
      width:12px;
      height:12px;
      border-radius:50%;
    }

    .yellow-dot{
      background:#f0a500;
    }

    .gray-dot{
      background:#444;
    }

    .stream-item h2{
      color:#fff;
      font-size:48px;
      line-height:1.15;
      margin-bottom:12px;
      font-family:"DM Sans", sans-serif;
      font-weight:600;
      letter-spacing:0;
    }

    .stream-item p{
      color:#CFCFCF;
      font-size:24px;
      line-height:1.5;
      font-family:"DM Sans", sans-serif;
    }

    .stream-time{
      color:#8A8A8A;
      min-width:100px;
      text-align:right;
      font-size:16px;
      line-height:24px;
      font-family:"DM Sans", sans-serif;
    }

    /* =========================
        FEATURE GRID
    ========================== */

    .feature-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      border-bottom:1px solid #111;
    }

    .feature-card{
      padding:30px;
      border-right:1px solid #111;
    }

    .feature-card:last-child{
      border-right:none;
    }

    .thumb{
      height:180px;
      display:flex;
      align-items:center;
      justify-content:center;
      margin-bottom:25px;
      color:#444;
      font-size:38px;
      font-weight:bold;
      overflow:hidden;
    }

    .thumb img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }

    .solar-thumb{
      background:#2d1d00;
    }

    .ev-thumb{
      background:#002911;
    }

    .policy-thumb{
      background:#2b1200;
    }

    .card-tag{
      color:#F2B11A;
      font-size:22px;
      line-height:28px;
      font-weight:700;
      font-family:"DM Sans", sans-serif;
      margin-bottom:18px;
    }

    .feature-card h3{
      color:#fff;
      font-size:48px;
      line-height:1.15;
      margin-bottom:20px;
      font-family:"DM Sans", sans-serif;
      font-weight:600;
      letter-spacing:0;
    }

    /* =========================
        ARTICLE TYPOGRAPHY
    ========================== */

    .single .article-shell,
    .page article{
      max-width:860px;
      margin:0 auto;
      padding:70px 40px;
      color:#E8E8E8;
      font-family:"DM Sans", sans-serif;
    }

    .single .article-shell header h1,
    .page article header h1{
      color:#fff;
      font-size:48px;
      line-height:1.1;
      margin-bottom:20px;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-weight:700;
      letter-spacing:0;
    }

    .single .article-shell header,
    .page article header{
      margin-bottom:34px;
    }

    .single .article-shell p,
    .page article p{
      color:#E8E8E8;
      font-size:20px;
      line-height:34px;
      margin-bottom:24px;
      font-family:"DM Sans", sans-serif;
      font-weight:400;
    }

    .single .article-shell blockquote,
    .page article blockquote{
      margin:40px 0;
      color:#fff;
      font-size:36px;
      line-height:1.4;
      font-family:"Playfair Display", serif;
      font-style:italic;
      font-weight:600;
    }

    .single .article-shell figcaption,
    .page article figcaption,
    .wp-caption-text{
      color:#A0A0A0;
      font-size:14px;
      line-height:20px;
      font-family:"DM Sans", sans-serif;
      font-weight:400;
    }

    .article-page{
      border-top:1px solid #111;
    }

    .single .article-shell{
      max-width:none;
      margin:0;
      padding:0;
    }

    .article-hero{
      max-width:1240px;
      margin:0 auto;
      padding:72px 40px 58px;
    }

    .article-hero--with-image{
      display:block;
    }

    .article-hero__content{
      min-width:0;
    }

    .article-header{
      margin-bottom:34px;
    }

    .article-kicker{
      margin-bottom:22px;
      color:#F2B11A;
      font-size:14px;
      line-height:20px;
      font-family:"DM Sans", sans-serif;
      font-weight:700;
      letter-spacing:.18em;
      text-transform:uppercase;
    }

    .article-kicker a{
      color:#F2B11A;
    }

    .article-header h1{
      max-width:980px;
      margin-bottom:26px;
      color:#fff;
      font-size:48px;
      line-height:1.1;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-weight:700;
      letter-spacing:0;
    }

    .single .article-shell .article-deck,
    .article-deck{
      display:block;
      max-width:900px;
      margin-bottom:28px;
      color:#CFCFCF;
      font-size:24px;
      line-height:1.5;
      font-family:"DM Sans", sans-serif;
      font-weight:400;
    }

    .article-meta{
      display:flex;
      flex-wrap:wrap;
      gap:14px 28px;
      color:#8A8A8A;
      font-size:16px;
      line-height:24px;
      font-family:"DM Sans", sans-serif;
    }

    .article-author{
      color:#F2B11A;
      font-weight:700;
    }

    .article-featured-image{
      width:100%;
      max-width:1240px;
      margin:0 auto 56px;
      padding:16px;
      background:#050505;
      border:1px solid #171717;
      box-shadow:0 24px 80px rgba(0,0,0,.35);
    }

    .article-featured-image img{
      width:100%;
      height:auto;
      display:block;
      background:#111;
    }

    .article-featured-image figcaption{
      margin-top:12px;
    }

    .article-body{
      max-width:none;
      margin:0;
      padding:0;
    }

    .article-content{
      max-width:none;
      margin:0;
      text-align:left;
    }

    .article-content p,
    .article-content li{
      color:#E8E8E8;
      font-size:20px;
      line-height:34px;
      font-family:"DM Sans", sans-serif;
      font-weight:400;
    }

    .article-content p{
      margin-bottom:26px;
    }

    .article-content h2,
    .article-content h3{
      margin:44px 0 18px;
      color:#fff;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-weight:700;
      line-height:1.15;
    }

    .article-content h2{
      font-size:40px;
    }

    .article-content h3{
      font-size:30px;
    }

    .article-content ul,
    .article-content ol{
      margin:0 0 28px 24px;
    }

    .article-content blockquote{
      margin:44px 0;
      padding-left:28px;
      border-left:4px solid #F2B11A;
      color:#fff;
      font-size:36px;
      line-height:1.4;
      font-family:"Playfair Display", serif;
      font-style:italic;
      font-weight:600;
    }

    .article-tags{
      max-width:none;
      margin:0 0 18px;
      padding-top:0;
      border-top:none;
      color:#9A9A9A;
      font-size:16px;
      line-height:24px;
      font-family:"DM Sans", sans-serif;
    }

    .article-tags span{
      display:block;
      margin-bottom:10px;
      color:#8A8A8A;
      font-size:14px;
      line-height:20px;
      letter-spacing:.18em;
      text-transform:uppercase;
    }

    .article-tags a{
      color:#9A9A9A;
    }

    .article-tags a:hover{
      color:#F2B11A;
    }

    .article-footer-meta{
      max-width:none;
      margin:0 0 34px;
      padding:16px 0 22px;
      border-top:1px solid #111;
      border-bottom:1px solid #111;
      display:flex;
      flex-wrap:wrap;
      gap:14px 28px;
      color:#8A8A8A;
      font-size:16px;
      line-height:24px;
      font-family:"DM Sans", sans-serif;
    }

    .article-nav{
      max-width:1240px;
      margin:0 auto;
      padding:0 40px 54px;
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:20px;
    }

    .article-nav__item{
      min-height:118px;
      padding:22px;
      border:1px solid #111;
      background:#050505;
    }

    .article-nav__item span{
      display:block;
      margin-bottom:12px;
      color:#8A8A8A;
      font-size:12px;
      line-height:20px;
      letter-spacing:.18em;
      text-transform:uppercase;
      font-family:"DM Sans", sans-serif;
    }

    .article-nav__item a{
      color:#fff;
      font-size:20px;
      line-height:1.35;
      font-family:"DM Sans", sans-serif;
      font-weight:600;
    }

    .article-nav__item a:hover{
      color:#F2B11A;
    }

    .article-nav__item--next{
      text-align:right;
    }

    .article-related{
      border-top:1px solid #111;
      padding:34px 40px 72px;
    }

    .article-related__title{
      max-width:1180px;
      margin:0 auto 28px;
      color:#8A8A8A;
      font-size:14px;
      line-height:20px;
      font-family:"DM Sans", sans-serif;
      font-weight:500;
      letter-spacing:.18em;
      text-transform:uppercase;
    }

    .article-related__grid{
      max-width:1180px;
      margin:0 auto;
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:0;
      border:1px solid #111;
    }

    .article-related__card{
      padding:28px;
      border-right:1px solid #111;
      background:#020202;
    }

    .article-related__card:last-child{
      border-right:none;
    }

    .article-related__category{
      margin-bottom:16px;
      color:#F2B11A;
      font-size:14px;
      line-height:20px;
      font-family:"DM Sans", sans-serif;
      font-weight:700;
    }

    .article-related__category a{
      color:#F2B11A;
    }

    .article-related__card h2{
      margin-bottom:18px;
      color:#fff;
      font-size:26px;
      line-height:1.2;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-weight:600;
    }

    .article-related__meta{
      color:#8A8A8A;
      font-size:14px;
      line-height:20px;
      font-family:"DM Sans", sans-serif;
    }

    /* =========================
        NEWSLETTER
    ========================== */

    .footer-newsletter{
      margin:24px 8px 22px;
      padding:26px 44px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:32px;
      background:#121212;
      border:1px solid #242424;
      border-radius:8px;
    }

    .footer-newsletter h2{
      margin-bottom:7px;
      font-size:25px;
      line-height:1.1;
      font-family:"Playfair Display", serif;
      font-style:italic;
    }

    .footer-newsletter p{
      color:#B0B0B0;
      font-size:15px;
      line-height:22px;
      font-family:"DM Sans", sans-serif;
    }

    .footer-newsletter__form{
      display:flex;
      align-items:center;
      min-width:min(100%, 440px);
    }

    .footer-newsletter__form input{
      width:100%;
      height:38px;
      padding:0 16px;
      background:#171717;
      color:#ddd;
      border:1px solid #292929;
      border-right:none;
      font-size:12px;
      font-family:"DM Sans", sans-serif;
      outline:none;
    }

    .footer-newsletter__form button{
      height:38px;
      padding:0 24px;
      background:#d77725;
      color:#fff;
      border:1px solid #d77725;
      font-size:12px;
      font-weight:700;
      letter-spacing:.8px;
      text-transform:uppercase;
      font-family:"DM Sans", sans-serif;
      cursor:pointer;
      white-space:nowrap;
    }

    .site-footer{
      margin:0 8px 24px;
      background:#050505;
      border-top:1px solid #0f0f0f;
      color:#8A8A8A;
    }

    .site-footer__columns{
      display:grid;
      grid-template-columns:1fr 1fr 1fr 1fr;
      gap:40px;
      padding:34px 44px 36px;
      border-bottom:1px solid #111;
    }

    .site-footer__column h3{
      margin-bottom:14px;
      color:#d77725;
      font-size:12px;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      font-weight:700;
      letter-spacing:2px;
      text-transform:uppercase;
    }

    .site-footer__column a{
      display:block;
      margin-bottom:8px;
      color:#B0B0B0;
      font-size:15px;
      line-height:22px;
      font-family:"DM Sans", sans-serif;
    }

    .site-footer__column a:hover{
      color:#f0a500;
    }

    .site-footer__bottom{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:24px;
      padding:20px 44px 24px;
    }

    .footer-logo{
      color:#fff;
      font-size:21px;
      font-weight:700;
      font-family:"Playfair Display", serif;
      font-style:italic;
    }

    .footer-logo span{
      color:#fff;
      font-size:10px;
      font-family:"DM Sans", sans-serif;
      font-style:normal;
      letter-spacing:0;
      margin-left:2px;
    }

    .site-footer__bottom p{
      color:#8A8A8A;
      font-size:14px;
      line-height:20px;
      font-family:"DM Sans", sans-serif;
    }

    /* =========================
        RESPONSIVE
    ========================== */

    @media(max-width:1100px){

      .main{
        grid-template-columns:1fr;
      }

      .newsletter-page{
        grid-template-columns:1fr;
      }

      .newsletter-hero{
        padding:55px 24px;
        border-right:none;
        border-bottom:1px solid #111;
      }

      .newsletter-hero h1{
        font-size:40px;
      }

      .newsletter-hero__copy{
        font-size:20px;
        line-height:1.5;
      }

      .newsletter-signup{
        padding:45px 24px;
      }

      .hero{
        border-right:none;
        border-bottom:1px solid #111;
      }

      .feature-grid{
        grid-template-columns:1fr;
      }

      .footer-newsletter{
        flex-direction:column;
        align-items:flex-start;
        margin:18px 8px;
        padding:24px;
      }

      .footer-newsletter__form{
        width:100%;
        flex-direction:column;
        align-items:stretch;
        min-width:0;
      }

      .footer-newsletter__form input{
        width:100%;
        border-right:1px solid #292929;
      }

      .footer-newsletter__form button{
        width:100%;
      }

      .site-footer__columns{
        grid-template-columns:1fr 1fr;
        padding:30px 24px;
      }

      .site-footer__bottom{
        padding:20px 24px 24px;
      }

      .nav{
        display:none;
      }

      .stream-item{
        flex-direction:column;
      }

      .stream-time{
        text-align:left;
      }

      .hero h1{
        font-size:36px;
      }

      .category,
      .card-category,
      .stream-category,
      .card-tag{
        font-size:18px;
        line-height:28px;
      }

      .sidebar-title,
      .stream-header{
        font-size:12px;
        line-height:20px;
      }

      .card h3,
      .stream-item h2,
      .feature-card h3{
        font-size:32px;
        line-height:1.15;
      }

      .description{
        font-size:20px;
        line-height:1.5;
      }

      .stream-item p{
        font-size:20px;
        line-height:1.5;
      }

      .meta,
      .post-tags,
      .stream-time{
        font-size:14px;
        line-height:24px;
      }

      .single .article-shell,
      .page article{
        padding:45px 24px;
      }

      .single .article-shell header h1,
      .page article header h1{
        font-size:40px;
        line-height:1.1;
      }

      .single .article-shell p,
      .page article p{
        font-size:18px;
        line-height:34px;
      }

      .single .article-shell blockquote,
      .page article blockquote{
        font-size:28px;
        line-height:1.4;
      }

      .single .article-shell figcaption,
      .page article figcaption,
      .wp-caption-text{
        font-size:13px;
        line-height:20px;
      }

      .single .article-shell{
        padding:0;
      }

      .article-hero{
        padding-left:24px;
        padding-right:24px;
      }

      .article-hero{
        padding-top:52px;
        padding-bottom:34px;
      }

      .article-hero--with-image{
        display:block;
      }

      .article-featured-image{
        margin-top:30px;
        padding:10px;
      }

      .article-body{
        padding-bottom:42px;
      }

      .article-header h1{
        font-size:40px;
        line-height:1.1;
      }

      .single .article-shell .article-deck,
      .article-deck{
        font-size:20px;
        line-height:1.5;
      }

      .article-content,
      .article-tags{
        max-width:none;
      }

      .article-content p,
      .article-content li{
        font-size:18px;
        line-height:34px;
      }

      .article-content h2{
        font-size:30px;
      }

      .article-content h3{
        font-size:24px;
      }

      .article-content blockquote{
        font-size:28px;
        line-height:1.4;
      }

      .article-nav{
        grid-template-columns:1fr;
        padding:0 24px 44px;
      }

      .article-nav__item--next{
        text-align:left;
      }

      .article-related{
        padding:30px 24px 52px;
      }

      .article-related__grid{
        grid-template-columns:1fr;
      }

      .article-related__card{
        border-right:none;
        border-bottom:1px solid #111;
      }

      .article-related__card:last-child{
        border-bottom:none;
      }
    }

    @media(max-width:640px){
      .site-footer__columns{
        grid-template-columns:1fr;
        gap:26px;
      }

      .site-footer__bottom{
        flex-direction:column;
        align-items:flex-start;
      }

      .site-footer__column a{
        font-size:14px;
        line-height:22px;
      }
    }
