        /* Local overrides if main.css isn't loaded */
        :root {
          --brand-red: rgb(220, 53, 69);
          --brand-dark: #000000;
          --brand-bg: #fcfdfe;
        }

        body {
          font-family: 'Outfit', system-ui, -apple-system, sans-serif;
          background-color: var(--brand-bg);
          color: #334155;
        }

        /* Hero Section */
        .hero-oejts {
          background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0) 100%), url('assets/hero-bg.jpg');
          background-size: cover;
          padding: 100px 0 60px 0;
        }

        /* Type Badges */
        .type-badge {
          background: rgba(220, 53, 69, 0.05);
          border: 1px solid rgba(220, 53, 69, 0.2);
          padding: 6px 16px;
          border-radius: 50px;
          font-family: 'Outfit', monospace;
          font-weight: 700;
          font-size: 1rem;
          color: var(--brand-red);
          letter-spacing: 1px;
        }

        /* Archetype Cards */
        .archetype-card {
          background: #ffffff;
          border: 1px solid rgba(0, 0, 0, 0.05);
          border-radius: 18px;
          box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.05);
          transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
          height: 100%;
          text-align: center;
          padding: 2rem;
        }

        .archetype-card:hover {
          transform: translateY(-10px);
          box-shadow: 0 20px 40px -15px rgba(220, 53, 69, 0.12);
          border-color: rgba(220, 53, 69, 0.2);
        }

        .archetype-icon {
          width: 60px;
          height: 60px;
          background: rgba(220, 53, 69, 0.1);
          color: var(--brand-red);
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
          margin: 0 auto 1.5rem auto;
          font-size: 1.5rem;
        }

        /* Gradient Text */
        .text-gradient {
          background: linear-gradient(135deg, var(--brand-red) 0%, #000000 100%);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
        }
