/* Base Reset */
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html { font-size: 16px; }
    body { font-family: 'Roboto', Arial; color: #333; line-height: 1.6; background-color: #fafafa; }
    a { color: #B22222; text-decoration: none; }
    a:hover { text-decoration: underline; }

    /* Container */
    .container { max-width: 800px; margin: 2.5rem auto; padding: 0 1rem; }

    /* Header/Hero */
    .hero {
      background: url('../others/DianiBeach-1.jpg') no-repeat center/cover;
      height: 300px;
      border-radius: 12px;
      position: relative;
      margin-bottom: 2rem;
    }
    .hero::after {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      background: rgba(0, 0, 0, 0.4);
      border-radius: 12px;
    }
    .hero-text {
      position: absolute;
      bottom: 1.5rem;
      left: 1.5rem;
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: 3rem;
      font-weight: 700;
    }

    /* Headings */
    h1 {font-weight: 700; margin-bottom: 1rem; font-size: 3rem; color: #169e11;}
    h2 {font-weight: 500; margin-top: 2.5rem; margin-bottom: 1rem; font-size: 1.75rem; }

    /* Paragraphs */
    p { margin-bottom: 1.6rem; }

    /* List Styles */
    ul.checklist {
      list-style: none;
      
    }
    ul.checklist li {
      position: relative;
      padding-left: 3rem;
      margin-bottom: 0.75rem;
      font-size: 1.6rem;
      
    }
    ul.checklist li::before {
      content: "✔";
      position: absolute;
      left: 0;
      color: #B22222;
    }

     /* Blog Navigation Links */
    .blog-nav {
      display: flex;
      justify-content: space-between;
      margin: 2.8rem 0;
    }
    .blog-nav a {
      font-family: 'Roboto', sans-serif;
      font-weight: 500;
      font-size: 1.6rem;
      color: #169e11;
      padding: 0.75rem 1.25rem;
      border-radius: 8px;
      transition: background-color 0.3s ease;
    }
    .blog-nav a:hover {
      color: #e26009;
    }