    :root{
      --bg:#000;
      --text:#fff;
      --accent:#fff;
      --maxw:1100px;
      --gap:1rem;
      --nav-h:64px;
    }

    /* Base */
    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      background:var(--bg);
      color:var(--text);
      font-family:"Work Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      line-height:1.5;
    }
    a{color:var(--text); text-decoration:none}
    a:focus-visible, button:focus-visible, input:focus-visible{
      outline:2px solid var(--accent);
      outline-offset:2px;
    }
    img{max-width:100%; height:auto; display:block}

    .container{
      width:100%;
      max-width:var(--maxw);
      margin-inline:auto;
      padding:0 1rem;
    }

    /* Header / Nav */
    header{
      border-bottom:1px solid #fff2;
      position:sticky;
      top:0;
      z-index:10;
      backdrop-filter: blur(6px);
      background:rgba(0,0,0,0.6);
    }
    .nav{
      display:flex;
      align-items:center;
      justify-content:space-between; /* brand left, hamburger right */
      min-height:var(--nav-h);
      gap:var(--gap);
      position:relative; /* anchor the dropdown nav on mobile */
    }
    .brand{
      display:flex;
      align-items:center;
      gap:.75rem;
      min-width:0;
    }
    .brand img{
      height:56px;
      width:auto;
    }
    .brand-name{
      font-weight:700;
      letter-spacing:.02em;
      font-size:1.05rem;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }

    /* Hamburger (CSS only) */
    #nav-toggle{display:none}
    .hamburger{
      display:none;
      cursor:pointer;
      padding:.5rem;
      border:1px solid #fff2;
      border-radius:.5rem;
      line-height:0;
      user-select:none;
      margin-left:auto; /* ensure far right even if layout shifts */
    }
    .hamburger span{
      display:block;
      width:22px;
      height:2px;
      background:var(--text);
      margin:5px 0;
    }

    nav{
      /* desktop: inline in the flow; mobile: absolute dropdown (see media query) */
    }
    nav ul{
      list-style:none;
      display:flex;
      gap:1rem;
      align-items:center;
      margin:0;
      padding:0;
      flex-wrap:wrap;
    }
    nav a{
      font-weight:700;
      font-size:1rem;
      opacity:.95;
    }
    nav a:hover{opacity:1; text-decoration:underline}

    /* Hero */
    .hero{
      padding:2rem 0 1rem;
    }
    .hero img{
      border-radius:.5rem;
      box-shadow:0 10px 30px rgba(0,0,0,.4);
    }

    /* Footer */
    footer{
      border-top:1px solid #fff2;
      margin-top:2rem;
      padding:1rem 0 2rem;
    }
    .footer-grid{
      display:grid;
      grid-template-columns:1fr;
      align-items:center;
      gap:1rem;
    }
    .copyright{
      text-align:center;
      font-weight:400;
      font-size:.95rem;
      opacity:.9;
    }
    .social{
      display:flex;
      gap:.75rem;
      justify-content:center;
      flex-wrap:wrap;
    }
    .social img{
      width:auto;
      height:auto;
      filter:brightness(1);
      transition:transform .15s ease;
    }
    .social a:hover img{transform:scale(1.06)}

    /* Typography helpers */
    .link1{font-weight:700; font-size:1rem; color:#fff;}
    .txt1{font-family:Arial, Helvetica, sans-serif; font-weight:400; font-size:14px; color:#fff;}

    /* Tablet tweak */
    @media (max-width: 900px){
      .brand img{height:48px}
      nav a{font-size:0.975rem}
    }

    /* Phone: hamburger visible, centered dropdown links */
    @media (max-width: 800px){
      .hamburger{display:inline-block}
      .brand-name{display:none}

      /* turn nav into a full-width dropdown under header */
      nav{
        position:absolute;
        top:100%;
        left:0;
        right:0;
      }
      nav ul{
        display:none;                 /* hidden by default */
        flex-direction:column;
        align-items:center;           /* CENTER the links */
        justify-content:center;
        background:rgba(0,0,0,0.95);  /* solid backdrop */
        padding:.75rem 1rem;
        gap:.5rem;
        border-bottom:1px solid #fff2;
      }
      /* show when checked */
      #nav-toggle:checked ~ nav ul{display:flex}

      .hero{padding:1rem 0 .5rem}
      .copyright{font-size:.9rem}
    }

    .txt3 {
  font-family: arial;
  font-weight: normal;
  font-size: 48px;
  color: white;

}





