* { box-sizing: border-box; margin: 0; padding: 0; }
    html, body {
      height: 100%;
      background: #000;
      color: #fff;
      font-family: 'Cinzel Decorative', serif;
      overflow: hidden;
    }

    /* Background image */
    .bg {
      position: fixed;
      top: 0; left: 0;
      width: 100vw; height: 100vh;
      object-fit: cover; object-position: center;
      z-index: 0;
    }

    /* Overlay for readability */
    .overlay {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.32);
      z-index: 1;
    }

    /* Content container */
    .content {
      position: relative;
      z-index: 2;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      animation: fadeIn 2s ease-out forwards;
      opacity: 0;
      gap: 0.2rem;
      padding: 0 1rem;
    }

    /* Fade-in animation */
    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }

    /* Title styling */
    .title {
      font-weight: 700;
      font-size: clamp(2.6rem, 6.5vw, 4.8rem);
      letter-spacing: 0.05em;
      text-transform: uppercase;
      line-height: 1.05;
    }

    /* F1 red */
    .title .f1 {
      color: #e10800;
      text-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
      margin-right: 0.25ch;
      animation: f1glow 2.6s ease-in-out infinite alternate;
    }

    /* Red glow animation */
    @keyframes f1glow {
      from { text-shadow: 0 0 6px rgba(255, 42, 42, 0.5); }
      to { text-shadow: 0 0 12px rgba(255, 42, 42, 0.8); }
    }

    /* INTENT black */
    .title .intent {
      color: #0a0a0a;
      text-shadow:
        0 0 1px rgba(0, 0, 0, 0.55),
        0 2px 10px rgba(0, 0, 0, 0.35);
    }

    /* Tagline */
    .tagline {
      font-size: clamp(1rem, 2.3vw, 1.2rem);
      font-weight: 500;
      color: #0a0a0a;
      letter-spacing: 0.03em;
      opacity: 0;
      animation: fadeInTag 2.5s ease-out 0.8s forwards;
      text-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
    }

    /* red AI highlight (now ~35% larger) */
    .tagline .ai {
      color: #e10800;
      font-weight: 700;
      font-size: 1.9em; /* makes AI 35% bigger */
      text-shadow: 0 0 10px rgba(255, 42, 42, 0.9);
      vertical-align: middle;
    }

    @keyframes fadeInTag {
      from { opacity: 0; transform: translateY(8px); }
      to { opacity: 1; transform: translateY(0); }
    }

    /* Subtitle */
    .subtitle {
      margin-top: 0.8rem;
      font-size: clamp(1rem, 2.6vw, 1.35rem);
      letter-spacing: 0.04em;
      color: #e9e9e9;
      opacity: 0.9;
      animation: fadeIn 3s ease-out 1.5s forwards;
    }

    /* Footer */
    footer {
      position: fixed;
      bottom: 18px;
      width: 100%;
      display: flex;
      justify-content: center;
      z-index: 2;
      animation: fadeIn 3s ease-out 2s forwards;
    }

    .footer-content {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      text-align: center;
    }

    .footer-content span {
      color: #d0d0d0;
      font-size: 0.9rem;
      letter-spacing: 0.5px;
    }

    .footer-content a {
      color: #ecdfdf;
      font-size: 0.88rem;
      text-decoration: none;
      letter-spacing: 0.5px;
      transition: all 0.2s ease;
    }

    .footer-content a:hover {
      color: #ffffff;
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    /* Mobile tweak */
    @media (max-width: 640px) {
      .overlay { background: rgba(0, 0, 0, 0.38); }
      .subtitle { margin-top: 0.5rem; }
      .tagline .ai { font-size: 1.25em; } /* slightly reduced on mobile */
    }