/* ----- Reset & Core ----- */
    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
    html{
      overflow-y:scroll;
    }
    body{
      font-family:'Lora',serif;
      background:#fdfdfd;
      color:#111;
      line-height:1.6;
      padding:2rem 1rem 4rem;
      max-width:960px;
      margin:auto;
      min-height:100vh;
      display:flex;
      flex-direction:column;
    }

    /* ----- Global Link Styles (exclude masthead-link and article-card) ----- */
    a:not(.masthead-link):not(.article-card){
      color:#1a5490;
      text-decoration:underline;
      transition:color 0.2s ease, text-decoration-color 0.2s ease;
    }
    a:not(.masthead-link):not(.article-card):hover{
      color:#0d2f4a;
      text-decoration-color:#0d2f4a;
    }
    a:not(.masthead-link):not(.article-card):visited{
      color:#6b2c91;
    }
    a:not(.masthead-link):not(.article-card):visited:hover{
      color:#4a1d63;
    }
    a:not(.masthead-link):not(.article-card):active{
      color:#c41e3a;
    }
    
    /* ----- Article Title Links ----- */
    h2 a, h3 a{
      color:#111;
      text-decoration:none;
    }
    h2 a:hover, h3 a:hover{
      color:#1a5490;
      text-decoration:underline;
    }
    h2 a:visited, h3 a:visited{
      color:#111;
    }
    h2 a:visited:hover, h3 a:visited:hover{
      color:#1a5490;
    }

    /* ----- Breadcrumbs ----- */
    .breadcrumbs{
      font-family:'Roboto Mono',monospace;
      font-size:.85rem;
      color:#666;
      margin-bottom:1rem;
    }

    /* ----- Article Cards ----- */
    .article-card{
      display:block;
      color:inherit;
      text-decoration:none;
      cursor:pointer;
    }
    .article-card:hover, .article-card:visited, .article-card:active{
      color:inherit;
      text-decoration:none;
    }

    /* ----- Masthead ----- */
    .masthead{
      font-family:'Oswald',sans-serif;
      font-weight:700;
      font-size:4.25rem;
      text-transform:uppercase;
      letter-spacing:.02em;
      word-spacing:.12em;
      text-align:center;
      line-height:1;
      margin-bottom:.3em;
    }
    
    /* Masthead link styling - remove all link appearance */
    .masthead .masthead-link {
      color: inherit !important;
      text-decoration: none !important;
      cursor: pointer;
    }
    
    .masthead .masthead-link:hover,
    .masthead .masthead-link:visited,
    .masthead .masthead-link:active,
    .masthead .masthead-link:focus {
      color: inherit !important;
      text-decoration: none !important;
      outline: none;
    }
    .submasthead{
      font-family:'Roboto Slab',serif;
      font-weight:700;
      font-size:1.05rem;
      text-transform:uppercase;
      letter-spacing:.04em;
      text-align:center;
      margin-bottom:.6rem;
    }
    .tagline{
      font-family:'Lora',serif;
      font-style:italic;
      font-size:.95rem;
      text-align:center;
      margin-bottom:1.5rem;
    }

    /* ----- Divider lines (thin rule) ----- */
    .rule{
      border-top:2px solid #000;
      margin:1.25rem 0;
    }

    /* ----- Navigation Bar ----- */
    nav{
      font-family:'Roboto Slab',serif;
      font-weight:700;
      text-transform:uppercase;
      font-size:.95rem;
      text-align:center;
    }
    /* ----- Navigation Links ----- */
    nav a,
    nav a:link,
    nav a:visited {
      color:#111 !important;
      text-decoration: underline;
      text-decoration-color:#111;
      padding:.4rem .9rem;
      display:inline-block;
    }
    
    nav a:hover,
    nav a:focus,
    nav a:active,
    nav a:visited:hover {
      background:#000;
      color:#fff !important;
      text-decoration-color:#fff;
    }

    /* ----- Article hierarchy ----- */
    h2{
      font-family:'Roboto Slab',serif;
      font-weight:700;
      font-size:1.85rem;
      margin:2rem 0 1rem;
    }
    h3{
      font-family:'Roboto Slab',serif;
      font-weight:500;
      font-size:1.35rem;
      margin:1.5rem 0 .75rem;
    }
    p{margin-bottom:1rem;}

    blockquote{
      font-style:italic;
      margin:1.4rem 0;
      padding-left:1rem;
      border-left:4px solid #aaa;
      color:#444;
    }

    .byline{
      font-family:'Roboto Mono',monospace;
      font-size:.9rem;
      text-transform:uppercase;
      margin-bottom:2rem;
    }
    .caption{
      font-size:.85rem;
      font-style:italic;
      color:#666;
    }
    .footer{
      text-align:center;
      font-size:.8rem;
      color:#888;
      margin-top:3rem;
    }

    /* ----- Page Content Wrapper ----- */
    .page-content{
      flex:1;
    }

    /* ----- Bottom Bar ----- */
    .bottom-bar{
      background:#000;
      color:#fff;
      padding:1.5rem 0;
      margin-left:-1rem;
      margin-right:-1rem;
      margin-bottom:-4rem;
      margin-top:auto;
    }
    .bottom-bar-content{
      max-width:960px;
      margin:0 auto;
      padding:0 3rem;
      display:flex;
      justify-content:space-between;
      align-items:center;
      font-size:.9rem;
    }
    .bottom-bar-content .sitemap-text{
      text-decoration:underline;
    }
    .bottom-bar-content .copyright-text{
      text-align:center;
    }
    .bottom-bar-content .impressum-text{
      text-decoration:underline;
    }

    /* ----- Article Meta Information ----- */
    .article-meta{
      margin:2rem 0;
      padding:1rem 0;
      border-top:1px solid #ddd;
      border-bottom:1px solid #ddd;
      background:#f9f9f9;
    }
    .categories{
      text-align:center;
    }
    .categories a{
      background:#e8e8e8;
      color:#111;
      text-decoration:none;
      padding:.4rem .8rem;
      margin:0 .25rem;
      font-size:.8rem;
      text-transform:uppercase;
      font-family:'Roboto Mono',monospace;
      display:inline-block;
    }
    .categories a:hover{
      background:#d0d0d0;
    }

    /* ----- Comments Section ----- */
    .comments-section{
      margin-top:3rem;
      padding-top:2rem;
      border-top:2px solid #000;
    }
    .comments-title{
      font-family:'Roboto Slab',serif;
      font-weight:700;
      font-size:1.5rem;
      margin-bottom:2rem;
    }
    .comment{
      margin-bottom:2rem;
      padding:1rem;
      background:#f9f9f9;
      border-left:4px solid #ddd;
    }
    .comment-author{
      font-family:'Roboto Mono',monospace;
      font-weight:700;
      font-size:.9rem;
      margin-bottom:.5rem;
    }
    .comment-date{
      font-family:'Roboto Mono',monospace;
      font-size:.8rem;
      color:#666;
      margin-bottom:.75rem;
    }
    .comment-body{
      line-height:1.6;
    }

    /* ----- Comment Form ----- */
    .comment-form{
      margin-top:2rem;
      margin-bottom:3rem;
      padding:1.5rem;
      background:#f9f9f9;
      border:1px solid #ddd;
    }
    .comment-form h4{
      font-family:'Roboto Slab',serif;
      font-weight:700;
      margin-bottom:1rem;
    }
    .form-group{
      margin-bottom:1rem;
    }
    .form-group label{
      display:block;
      font-family:'Roboto Mono',monospace;
      font-size:.9rem;
      margin-bottom:.25rem;
      font-weight:700;
    }
    .form-group input, .form-group textarea{
      width:100%;
      padding:.5rem;
      border:1px solid #ccc;
      font-family:'Lora',serif;
      font-size:.9rem;
    }
    .form-group textarea{
      min-height:120px;
      resize:vertical;
    }
    .submit-btn{
      background:#000;
      color:#fff;
      padding:.75rem 1.5rem;
      border:none;
      font-family:'Roboto Slab',serif;
      font-weight:700;
      text-transform:uppercase;
      cursor:pointer;
      font-size:.9rem;
    }
    .submit-btn:hover{
      background:#333;
    }

    /* ----- Basic Columns Layout (for Resources section) ----- */
    .columns {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2rem;
      margin: 2rem 0;
    }

    /* ----- Article Grid Layout ----- */
    .article-grid {
      margin: 2rem 0;
    }
    
    .article-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2rem;
      margin-bottom: 2rem;
      align-items: start;
    }
    
    .article-row:last-child {
      margin-bottom: 0;
    }
    
    .article-row .article-card {
      display: flex;
      flex-direction: column;
      height: 100%;
      border-bottom: 1px solid #ddd;
      padding-bottom: 1.5rem;
    }
    
    .article-row .article-card > div {
      display: flex;
      flex-direction: column;
      height: 100%;
    }
    
    .article-row .title-container {
      /* Fixed height container for 2-line titles */
      min-height: 3.24rem; /* 1.35rem font-size * 1.2 line-height * 2 lines */
      display: flex;
      align-items: flex-start;
    }
    
    .article-row .title-container h3 {
      display: -webkit-box;
      -webkit-line-clamp: 2;
      line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
      line-height: 1.2;
      margin: 0;
      width: 100%;
    }
    
    .article-row .byline {
      flex-shrink: 0;
      margin: 0.75rem 0 1rem 0;
    }
    
    .article-row .story-image {
      flex-shrink: 0;
      height: 200px;
      margin-bottom: 1rem;
      background: #f8f8f8;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    
    .article-row .story-image img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
    
    .article-row p {
      margin-top: auto;
      margin-bottom: 0;
    }

      .lead-story {
        grid-column: 1 / -1;
        margin-bottom: 2rem;
      }
      .story-image {
        width: 100%;
        height: 200px;
        background: #f8f8f8;
        margin-bottom: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #666;
        font-style: italic;
      }
      
      .story-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block;
      }
      
      .story-image.large,
      .lead-story .story-image {
        height: 300px;
      }
      .breaking-banner {
        background: #c41e3a;
        color: white;
        text-align: center;
        padding: 0.5rem;
        font-family: 'Roboto Slab', serif;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.9rem;
        letter-spacing: 0.05em;
      }
      @media (max-width: 768px) {
        .columns {
          grid-template-columns: 1fr;
          gap: 1rem;
        }
        
        .article-row {
          grid-template-columns: 1fr;
          gap: 1rem;
          margin-bottom: 1.5rem;
        }
        
        .article-row .title-container {
          min-height: auto;
        }
        
        .article-row .title-container h3 {
          -webkit-line-clamp: none;
          line-clamp: none;
          display: block;
          overflow: visible;
          text-overflow: initial;
        }
      }

      /* ----- Featured Story Layout ----- */
      /* Aligned Titles Section */
      .featured-titles-section {
        display: grid;
        grid-template-columns: minmax(0,3fr) minmax(0,2fr);
        gap: 2rem;
        margin: 2rem 0 0 0;
        align-items: end;
      }
      
      .featured-title-container .featured-title {
        font-family: 'Roboto Slab', serif;
        font-weight: 700;
        font-size: 1.85rem;
        margin: 0 0 0.5rem 0;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #000;
        line-height: 1.2;
      }
      
      .recent-title-container .recent-title {
        font-family: 'Roboto Slab', serif;
        font-weight: 700;
        font-size: 1.2rem;
        margin: 0 0 0.5rem 0;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #000;
        text-transform: uppercase;
        letter-spacing: 0.05em;
      }
      
      /* Content Layout */
      .featured-content-layout {
        display: grid;
        grid-template-columns: minmax(0,3fr) minmax(0,2fr);
        gap: 2rem;
        margin: 1rem 0 2rem 0;
        overflow: hidden;
      }
      
      .featured-content {
        min-width: 0; /* Allows grid item to shrink below content size */
        overflow: hidden;
      }
      
      .featured-byline {
        font-family: 'Roboto Mono', monospace;
        font-size: clamp(0.7rem, 2vw, 0.9rem);
        text-transform: uppercase;
        margin-top: 1rem;
        margin-bottom: 1.5rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
        display: block;
      }
      
      .featured-byline * {
        white-space: nowrap;
        display: inline;
      }
      
      .featured-byline a {
        color: inherit;
        text-decoration: none;
      }
      
      .featured-byline a:hover {
        text-decoration: underline;
      }
      
      .featured-image-container {
        margin-bottom: 0;
        overflow: hidden;
        width: 100%;
        max-width: 100%;
      }
      
      .featured-image {
        width: 100%;
        max-width: 100%;
        height: auto;
        display: block;
        object-fit: contain;
      }
      
      .featured-excerpt {
        line-height: 1.6;
      }
      
      .recent-story-item {
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid #ddd;
      }
      
      .recent-story-item:last-child {
        border-bottom: none;
        margin-bottom: 0;
      }
      
      .recent-story-item h4 {
        font-size: 1rem;
        line-height: 1.4;
        margin-bottom: 0.3rem;
      }
      
      .recent-story-item .byline {
        font-size: 0.8rem;
        margin-bottom: 0;
      }
      
      @media (max-width: 768px) {
        .featured-titles-section {
          grid-template-columns: 1fr;
          gap: 1rem;
        }
        
        .featured-content-layout {
          grid-template-columns: 1fr;
          gap: 1rem;
        }
        
        .featured-title-container .featured-title {
          font-size: 1.5rem;
        }
        
        .featured-byline {
          font-size: 0.75rem;
          white-space: normal;
        }
      }

      /* ----- Mobile Menu Base Styles ----- */
      /* Hide mobile menu button on desktop */
      .mobile-menu-btn {
        display: none;
      }
      
      /* Mobile menu overlay - hidden by default */
      .mobile-menu {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: #fff;
        z-index: 9999;
        padding: 2rem;
        box-sizing: border-box;
      }
      
      .mobile-menu.active {
        display: block;
      }
      
      .mobile-menu-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 3rem;
        padding-bottom: 1rem;
        border-bottom: 2px solid #000;
      }
      
      .mobile-menu-title {
        font-family: 'Oswald', sans-serif;
        font-weight: 700;
        font-size: 1.5rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
      }
      
      .mobile-menu-close {
        background: #000;
        color: #fff;
        border: none;
        width: 40px;
        height: 40px;
        font-size: 1.5rem;
        cursor: pointer;
        font-family: 'Oswald', sans-serif;
        font-weight: bold;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      
      .mobile-menu-close:hover {
        background: #333;
      }
      
      .mobile-menu-links {
        list-style: none;
        padding: 0;
        margin: 0;
      }
      
      .mobile-menu-links li {
        border-bottom: 1px solid #ddd;
      }
      
      .mobile-menu-links li:last-child {
        border-bottom: none;
      }
      
      .mobile-menu-links a {
        display: block;
        padding: 1.25rem 0;
        font-family: 'Roboto Slab', serif;
        font-weight: 700;
        font-size: 1.1rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #000;
        text-decoration: none;
        transition: color 0.3s ease;
      }
      
      .mobile-menu-links a:hover {
        color: #1a5490;
      }

      /* ----- Mobile Responsive Design ----- */
      @media (max-width: 768px) {
        /* Mobile Header */
        .masthead {
          font-size: 2.5rem;
          margin-bottom: 0.2em;
        }
        
        .tagline {
          font-size: 0.85rem;
          margin-bottom: 1rem;
        }
        
        /* Hide desktop navigation */
        nav {
          display: none;
        }
        
        /* Show mobile menu button */
        .mobile-menu-btn {
          display: block;
          background: #000;
          color: #fff;
          border: none;
          padding: 0.75rem 1.5rem;
          font-family: 'Roboto Slab', serif;
          font-weight: 700;
          text-transform: uppercase;
          font-size: 0.9rem;
          letter-spacing: 0.05em;
          cursor: pointer;
          width: 100%;
          margin-bottom: 1rem;
          transition: background 0.3s ease;
        }
        
        .mobile-menu-btn:hover {
          background: #333;
        }
      }